mirror of
https://github.com/LifeArchiveProject/WeChatDataAnalysis.git
synced 2026-06-18 15:54:08 +08:00
improvement(sns-ui): 合并朋友圈导出主操作并精简任务区
- 将开始导出与取消导出收敛为同一主操作按钮 - 精简任务状态区,仅保留导出完成后的保存操作 - 减少重复按钮与状态噪音,统一导出面板交互
This commit is contained in:
+32
-50
@@ -593,32 +593,15 @@
|
||||
<div class="text-sm font-medium text-gray-900">当前导出任务</div>
|
||||
<div class="mt-1 text-xs text-gray-500 break-all">ID:{{ exportJob.exportId || '-' }}</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap items-center gap-2">
|
||||
<span class="px-2.5 py-1 rounded-full text-xs border border-gray-200 bg-white text-gray-600">
|
||||
状态:{{ exportStatusText }}
|
||||
</span>
|
||||
<span class="px-2.5 py-1 rounded-full text-xs border border-gray-200 bg-white text-gray-600">
|
||||
{{ exportOverallPercent }}%
|
||||
</span>
|
||||
<button
|
||||
v-if="canCancelSnsExport"
|
||||
type="button"
|
||||
class="px-3 py-1.5 rounded-md text-xs border border-amber-200 bg-amber-50 text-amber-700 hover:bg-amber-100 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
:disabled="isExportCancelling"
|
||||
@click="cancelSnsExportJob"
|
||||
>
|
||||
{{ isExportCancelling ? '\u53d6\u6d88\u4e2d\u2026' : '\u53d6\u6d88\u5bfc\u51fa' }}
|
||||
</button>
|
||||
<button
|
||||
v-if="exportJob.status === 'done' && exportJob.exportId && hasWebExportFolder"
|
||||
type="button"
|
||||
class="px-3 py-1.5 rounded-md text-xs border border-[#03C160]/20 bg-[#03C160]/10 text-[#027a44] hover:bg-[#03C160]/15 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
:disabled="exportSaveBusy"
|
||||
@click="saveSnsExportToSelectedFolder()"
|
||||
>
|
||||
{{ exportSaveBusy ? '\u4fdd\u5b58\u4e2d\u2026' : exportSaveState === 'success' ? '\u91cd\u65b0\u4fdd\u5b58\u5230\u6587\u4ef6\u5939' : '\u4fdd\u5b58\u5230\u5df2\u9009\u6587\u4ef6\u5939' }}
|
||||
</button>
|
||||
</div>
|
||||
<button
|
||||
v-if="exportJob.status === 'done' && exportJob.exportId && hasWebExportFolder"
|
||||
type="button"
|
||||
class="w-fit px-3 py-1.5 rounded-md text-xs border border-[#03C160]/20 bg-[#03C160]/10 text-[#027a44] hover:bg-[#03C160]/15 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
:disabled="exportSaveBusy"
|
||||
@click="saveSnsExportToSelectedFolder()"
|
||||
>
|
||||
{{ exportSaveBusy ? '保存中…' : exportSaveState === 'success' ? '重新保存到文件夹' : '保存到已选文件夹' }}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="space-y-2">
|
||||
@@ -815,15 +798,6 @@
|
||||
<div class="px-5 py-4 border-t border-gray-200 flex items-center justify-between gap-3">
|
||||
<div class="text-xs text-gray-500">已选 {{ exportSelectedCount }} 人</div>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
v-if="canCancelSnsExport"
|
||||
type="button"
|
||||
class="px-4 py-2 rounded-md text-sm border border-amber-200 bg-amber-50 text-amber-700 hover:bg-amber-100 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
:disabled="isExportCancelling"
|
||||
@click="cancelSnsExportJob"
|
||||
>
|
||||
{{ isExportCancelling ? '\u53d6\u6d88\u4e2d\u2026' : '\u53d6\u6d88\u5bfc\u51fa' }}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="px-4 py-2 rounded-md text-sm border border-gray-200 bg-white hover:bg-gray-50 transition-colors"
|
||||
@@ -833,11 +807,12 @@
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="px-4 py-2 rounded-md text-sm bg-[#03C160] text-white hover:bg-[#02ad56] transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
:disabled="!selectedAccount || !exportSelectedCount || isSnsExportBusy"
|
||||
@click="startSnsExportFromModal"
|
||||
class="px-4 py-2 rounded-md text-sm transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
:class="canCancelSnsExport ? 'border border-amber-200 bg-amber-50 text-amber-700 hover:bg-amber-100' : 'bg-[#03C160] text-white hover:bg-[#02ad56]'"
|
||||
:disabled="exportPrimaryActionDisabled"
|
||||
@click="handleExportPrimaryAction"
|
||||
>
|
||||
{{ isSnsExportBusy ? '导出中…' : '开始导出' }}
|
||||
{{ exportPrimaryActionLabel }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1139,17 +1114,6 @@ const exportActiveFormatLabel = computed(() => {
|
||||
return exportFormatOptions.find((item) => item.value === exportActiveFormat.value)?.label || 'HTML'
|
||||
})
|
||||
|
||||
const exportStatusText = computed(() => {
|
||||
const status = String(exportJob.value?.status || '').trim()
|
||||
return {
|
||||
queued: '排队中',
|
||||
running: '导出中',
|
||||
done: '已完成',
|
||||
error: '失败',
|
||||
cancelled: '已取消'
|
||||
}[status] || status || '-'
|
||||
})
|
||||
|
||||
const exportOverallPercent = computed(() => {
|
||||
const status = String(exportJob.value?.status || '').trim()
|
||||
if (status === 'done') return 100
|
||||
@@ -1187,6 +1151,24 @@ const canCancelSnsExport = computed(() => {
|
||||
return status === 'queued' || status === 'running'
|
||||
})
|
||||
|
||||
const exportPrimaryActionLabel = computed(() => {
|
||||
if (canCancelSnsExport.value) return isExportCancelling.value ? '取消中…' : '取消导出'
|
||||
return isSnsExportBusy.value ? '导出中…' : '开始导出'
|
||||
})
|
||||
|
||||
const exportPrimaryActionDisabled = computed(() => {
|
||||
if (canCancelSnsExport.value) return isExportCancelling.value
|
||||
return !selectedAccount.value || !exportSelectedCount.value || isSnsExportBusy.value
|
||||
})
|
||||
|
||||
const handleExportPrimaryAction = async () => {
|
||||
if (canCancelSnsExport.value) {
|
||||
await cancelSnsExportJob()
|
||||
return
|
||||
}
|
||||
await startSnsExportFromModal()
|
||||
}
|
||||
|
||||
const normalizeExportSelectedUsernames = (list) => {
|
||||
const validUsernames = new Set(
|
||||
visibleSnsUsers.value
|
||||
|
||||
Reference in New Issue
Block a user