support copy col
This commit is contained in:
@@ -138,27 +138,25 @@ const handlePreview = async () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const copyToClipboard = async () => {
|
const copyColumn = async (tagId: number | 'date') => {
|
||||||
// 生成适合 Excel 的 TSV (Tab-Separated Values) 格式
|
let lines: string[] = [];
|
||||||
const header = ["日期", ...selectedTags.value.map(id => getTagName(id))];
|
|
||||||
let tsv = header.join("\t") + "\n";
|
|
||||||
|
|
||||||
for (const date of sortedDateList.value) {
|
for (const date of sortedDateList.value) {
|
||||||
let row = [date];
|
if (tagId === 'date') {
|
||||||
for (const tagId of selectedTags.value) {
|
lines.push(date);
|
||||||
|
} else {
|
||||||
let cellStr = previewData.value[date][tagId] || "";
|
let cellStr = previewData.value[date][tagId] || "";
|
||||||
// Excel/Sheets 处理带换行符的单元格,需要用双引号包围,且内容中的双引号要转义为两个双引号
|
// Excel/Sheets 处理带换行符的单元格,需要用双引号包围
|
||||||
if (cellStr.includes('\n') || cellStr.includes('\t') || cellStr.includes('"')) {
|
if (cellStr.includes('\n') || cellStr.includes('\t') || cellStr.includes('"')) {
|
||||||
cellStr = `"${cellStr.replace(/"/g, '""')}"`;
|
cellStr = `"${cellStr.replace(/"/g, '""')}"`;
|
||||||
}
|
}
|
||||||
row.push(cellStr);
|
lines.push(cellStr);
|
||||||
}
|
}
|
||||||
tsv += row.join("\t") + "\n";
|
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await navigator.clipboard.writeText(tsv);
|
await navigator.clipboard.writeText(lines.join("\n"));
|
||||||
showToast("表格已复制,可直接粘贴到 Excel");
|
showToast(`列数据已复制`);
|
||||||
} catch(err) {
|
} catch(err) {
|
||||||
showToast("复制失败", "error");
|
showToast("复制失败", "error");
|
||||||
}
|
}
|
||||||
@@ -253,18 +251,23 @@ const copyToClipboard = async () => {
|
|||||||
{{ isDesc ? '倒序 (由近及远)' : '正序 (由远及近)' }}
|
{{ isDesc ? '倒序 (由近及远)' : '正序 (由远及近)' }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<button @click="copyToClipboard" class="flex items-center gap-1.5 px-4 py-2 bg-[#007AFF] hover:bg-[#007AFF]/90 text-white rounded-xl text-xs font-bold transition-all shadow-lg shadow-[#007AFF]/20 active:scale-95">
|
|
||||||
<Copy :size="14" /> 一键复制完整表格
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex-1 overflow-auto border border-border-main rounded-2xl bg-bg-input/30 relative select-text">
|
<div class="flex-1 overflow-auto border border-border-main rounded-2xl bg-bg-input/30 relative select-text">
|
||||||
<table class="w-full text-left border-collapse text-xs">
|
<table class="w-full text-left border-collapse text-xs">
|
||||||
<thead class="bg-bg-card sticky top-0 z-10 shadow-sm">
|
<thead class="bg-bg-card sticky top-0 z-10 shadow-sm">
|
||||||
<tr>
|
<tr>
|
||||||
<th class="p-4 border-b border-border-main font-bold whitespace-nowrap text-text-sec w-32">日期</th>
|
<th class="p-4 border-b border-border-main font-bold whitespace-nowrap text-text-sec w-32 group">
|
||||||
<th v-for="tagId in selectedTags" :key="tagId" class="p-4 border-b border-l border-border-main/50 font-bold whitespace-nowrap" :style="{ color: mainTags.find(t => t.id === tagId)?.color || 'inherit' }">
|
<div class="flex items-center gap-2">
|
||||||
{{ getTagName(tagId) }}
|
日期
|
||||||
|
<button @click="copyColumn('date')" title="复制此列" class="opacity-0 group-hover:opacity-100 p-1 hover:bg-bg-input rounded transition-all text-text-sec"><Copy :size="12"/></button>
|
||||||
|
</div>
|
||||||
|
</th>
|
||||||
|
<th v-for="tagId in selectedTags" :key="tagId" class="p-4 border-b border-l border-border-main/50 font-bold whitespace-nowrap group" :style="{ color: mainTags.find(t => t.id === tagId)?.color || 'inherit' }">
|
||||||
|
<div class="flex items-center gap-2">
|
||||||
|
{{ 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"><Copy :size="12"/></button>
|
||||||
|
</div>
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
|
|||||||
Reference in New Issue
Block a user