|
|
|
@@ -296,15 +296,15 @@ const copyToClipboard = async () => {
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<div class="fixed inset-0 z-100 bg-black/40 backdrop-blur-sm flex items-center justify-center p-6" @click.self="$emit('close')">
|
|
|
|
<div class="fixed inset-0 z-100 bg-black/40 backdrop-blur-sm flex items-center justify-center p-6" @click.self="$emit('close')">
|
|
|
|
<div class="bg-bg-card rounded-[40px] shadow-2xl w-full flex flex-col animate-in fade-in zoom-in duration-300 transition-all"
|
|
|
|
<div class="bg-bg-card rounded-[40px] shadow-2xl w-full flex flex-col animate-in fade-in zoom-in duration-300 transition-all"
|
|
|
|
:class="dateList.length > 0 ? 'max-w-[90vw] md:max-w-6xl h-[90vh] overflow-hidden' : 'max-w-4xl min-h-[500px]'">
|
|
|
|
:class="dateList.length > 0 ? 'max-w-[90vw] md:max-w-6xl h-[90vh] overflow-hidden' : 'max-w-4xl min-h-125'">
|
|
|
|
<div class="p-8 border-b flex justify-between items-center flex-shrink-0">
|
|
|
|
<div class="p-8 border-b flex justify-between items-center shrink-0">
|
|
|
|
<h2 class="text-2xl font-bold">导出记录</h2>
|
|
|
|
<h2 class="text-2xl font-bold">导出记录</h2>
|
|
|
|
<button @click="$emit('close')" class="hover:bg-bg-input p-2 rounded-full transition-colors"><X :size="24" /></button>
|
|
|
|
<button @click="$emit('close')" class="hover:bg-bg-input p-2 rounded-full transition-colors"><X :size="24" /></button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="p-8 flex-1 flex flex-col gap-8 no-scrollbar" :class="dateList.length > 0 ? 'overflow-y-auto' : 'overflow-visible'">
|
|
|
|
<div class="p-8 flex-1 flex flex-col gap-8 no-scrollbar" :class="dateList.length > 0 ? 'overflow-y-auto' : 'overflow-visible'">
|
|
|
|
<!-- 配置区域 -->
|
|
|
|
<!-- 配置区域 -->
|
|
|
|
<div class="space-y-6 flex-shrink-0">
|
|
|
|
<div class="space-y-6 shrink-0">
|
|
|
|
<!-- 日期选择 -->
|
|
|
|
<!-- 日期选择 -->
|
|
|
|
<div class="space-y-2">
|
|
|
|
<div class="space-y-2">
|
|
|
|
<label class="text-[11px] font-bold text-text-sec">日期范围</label>
|
|
|
|
<label class="text-[11px] font-bold text-text-sec">日期范围</label>
|
|
|
|
@@ -377,7 +377,7 @@ const copyToClipboard = async () => {
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 表格预览区域 -->
|
|
|
|
<!-- 表格预览区域 -->
|
|
|
|
<div v-if="dateList.length > 0" class="flex-1 flex flex-col border-t border-border-main pt-6">
|
|
|
|
<div v-if="dateList.length > 0" class="flex-1 flex flex-col border-t border-border-main pt-6">
|
|
|
|
<div class="flex justify-between items-center mb-4 flex-shrink-0">
|
|
|
|
<div class="flex justify-between items-center mb-4 shrink-0">
|
|
|
|
<div class="flex items-center gap-4">
|
|
|
|
<div class="flex items-center gap-4">
|
|
|
|
<h3 class="text-sm font-bold text-text-sec flex items-center gap-2">数据预览</h3>
|
|
|
|
<h3 class="text-sm font-bold text-text-sec flex items-center gap-2">数据预览</h3>
|
|
|
|
<button @click="isDesc = !isDesc" class="flex items-center gap-1.5 px-3 py-1.5 bg-bg-input hover:bg-border-main text-text-sec hover:text-text-main rounded-lg text-xs font-bold transition-all active:scale-95">
|
|
|
|
<button @click="isDesc = !isDesc" class="flex items-center gap-1.5 px-3 py-1.5 bg-bg-input hover:bg-border-main text-text-sec hover:text-text-main rounded-lg text-xs font-bold transition-all active:scale-95">
|
|
|
|
@@ -398,14 +398,14 @@ const copyToClipboard = async () => {
|
|
|
|
<th class="relative p-4 border-b border-border-main font-bold whitespace-nowrap text-text-sec bg-bg-card group" :style="{ width: colWidths['date'] + 'px' }">
|
|
|
|
<th class="relative p-4 border-b border-border-main font-bold whitespace-nowrap text-text-sec bg-bg-card group" :style="{ width: colWidths['date'] + 'px' }">
|
|
|
|
<div class="flex items-center gap-2 overflow-hidden w-full">
|
|
|
|
<div class="flex items-center gap-2 overflow-hidden w-full">
|
|
|
|
日期
|
|
|
|
日期
|
|
|
|
<button @click="copyColumn('date')" title="复制此列" class="opacity-0 group-hover:opacity-100 p-1 hover:bg-bg-input rounded transition-all text-text-sec flex-shrink-0"><Copy :size="12"/></button>
|
|
|
|
<button @click="copyColumn('date')" title="复制此列" class="opacity-0 group-hover:opacity-100 p-1 hover:bg-bg-input rounded transition-all text-text-sec shrink-0"><Copy :size="12"/></button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="absolute right-0 top-0 bottom-0 w-1.5 cursor-col-resize hover:bg-[#007AFF] z-40 group-hover:bg-border-main" @mousedown.prevent="startResizeCol($event, 'date')"></div>
|
|
|
|
<div class="absolute right-0 top-0 bottom-0 w-1.5 cursor-col-resize hover:bg-[#007AFF] z-40 group-hover:bg-border-main" @mousedown.prevent="startResizeCol($event, 'date')"></div>
|
|
|
|
</th>
|
|
|
|
</th>
|
|
|
|
<th v-for="tagId in selectedTags" :key="tagId" class="relative p-4 border-b border-l border-border-main/50 font-bold whitespace-nowrap bg-bg-card group" :style="{ color: mainTags.find(t => t.id === tagId)?.color || 'inherit', width: colWidths[tagId] + 'px' }">
|
|
|
|
<th v-for="tagId in selectedTags" :key="tagId" class="relative p-4 border-b border-l border-border-main/50 font-bold whitespace-nowrap bg-bg-card group" :style="{ color: mainTags.find(t => t.id === tagId)?.color || 'inherit', width: colWidths[tagId] + 'px' }">
|
|
|
|
<div class="flex items-center gap-2 overflow-hidden w-full">
|
|
|
|
<div class="flex items-center gap-2 overflow-hidden w-full">
|
|
|
|
{{ getTagName(tagId) }}
|
|
|
|
{{ getTagName(tagId) }}
|
|
|
|
<button @click="copyColumn(tagId)" title="复制此列" class="opacity-0 group-hover:opacity-100 p-1 hover:bg-bg-input rounded transition-all text-text-sec flex-shrink-0"><Copy :size="12"/></button>
|
|
|
|
<button @click="copyColumn(tagId)" title="复制此列" class="opacity-0 group-hover:opacity-100 p-1 hover:bg-bg-input rounded transition-all text-text-sec shrink-0"><Copy :size="12"/></button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="absolute right-0 top-0 bottom-0 w-1.5 cursor-col-resize hover:bg-[#007AFF] z-40 group-hover:bg-border-main" @mousedown.prevent="startResizeCol($event, tagId)"></div>
|
|
|
|
<div class="absolute right-0 top-0 bottom-0 w-1.5 cursor-col-resize hover:bg-[#007AFF] z-40 group-hover:bg-border-main" @mousedown.prevent="startResizeCol($event, tagId)"></div>
|
|
|
|
</th>
|
|
|
|
</th>
|
|
|
|
@@ -420,7 +420,7 @@ const copyToClipboard = async () => {
|
|
|
|
<div class="absolute bottom-0 left-0 right-0 h-1.5 cursor-row-resize hover:bg-[#007AFF] z-20 group-hover:bg-border-main" @mousedown.prevent="startResizeRow($event, date)"></div>
|
|
|
|
<div class="absolute bottom-0 left-0 right-0 h-1.5 cursor-row-resize hover:bg-[#007AFF] z-20 group-hover:bg-border-main" @mousedown.prevent="startResizeRow($event, date)"></div>
|
|
|
|
</td>
|
|
|
|
</td>
|
|
|
|
<td v-for="tagId in selectedTags" :key="tagId" class="relative p-4 border-l border-border-main/30 align-top whitespace-pre-wrap leading-relaxed text-text-sec group">
|
|
|
|
<td v-for="tagId in selectedTags" :key="tagId" class="relative p-4 border-l border-border-main/30 align-top whitespace-pre-wrap leading-relaxed text-text-sec group">
|
|
|
|
<div class="w-full overflow-y-auto no-scrollbar break-words" :style="{ height: rowHeights[date] ? Math.max(0, rowHeights[date] - 32) + 'px' : 'auto', minHeight: '16px' }">
|
|
|
|
<div class="w-full overflow-y-auto no-scrollbar wrap-break-words" :style="{ height: rowHeights[date] ? Math.max(0, rowHeights[date] - 32) + 'px' : 'auto', minHeight: '16px' }">
|
|
|
|
{{ previewData[date]?.[tagId] || '' }}
|
|
|
|
{{ previewData[date]?.[tagId] || '' }}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="absolute bottom-0 left-0 right-0 h-1.5 cursor-row-resize hover:bg-[#007AFF] z-20 group-hover:bg-border-main" @mousedown.prevent="startResizeRow($event, date)"></div>
|
|
|
|
<div class="absolute bottom-0 left-0 right-0 h-1.5 cursor-row-resize hover:bg-[#007AFF] z-20 group-hover:bg-border-main" @mousedown.prevent="startResizeRow($event, date)"></div>
|
|
|
|
|