Skip to content

Commit f5fbc04

Browse files
committed
improvement(sns-ui): 合并朋友圈导出主操作并精简任务区
- 将开始导出与取消导出收敛为同一主操作按钮 - 精简任务状态区,仅保留导出完成后的保存操作 - 减少重复按钮与状态噪音,统一导出面板交互
1 parent 49da117 commit f5fbc04

1 file changed

Lines changed: 32 additions & 50 deletions

File tree

frontend/pages/sns.vue

Lines changed: 32 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -593,32 +593,15 @@
593593
<div class="text-sm font-medium text-gray-900">&#24403;&#21069;&#23548;&#20986;&#20219;&#21153;</div>
594594
<div class="mt-1 text-xs text-gray-500 break-all">ID&#65306;{{ exportJob.exportId || '-' }}</div>
595595
</div>
596-
<div class="flex flex-wrap items-center gap-2">
597-
<span class="px-2.5 py-1 rounded-full text-xs border border-gray-200 bg-white text-gray-600">
598-
&#29366;&#24577;&#65306;{{ exportStatusText }}
599-
</span>
600-
<span class="px-2.5 py-1 rounded-full text-xs border border-gray-200 bg-white text-gray-600">
601-
{{ exportOverallPercent }}%
602-
</span>
603-
<button
604-
v-if="canCancelSnsExport"
605-
type="button"
606-
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"
607-
:disabled="isExportCancelling"
608-
@click="cancelSnsExportJob"
609-
>
610-
{{ isExportCancelling ? '\u53d6\u6d88\u4e2d\u2026' : '\u53d6\u6d88\u5bfc\u51fa' }}
611-
</button>
612-
<button
613-
v-if="exportJob.status === 'done' && exportJob.exportId && hasWebExportFolder"
614-
type="button"
615-
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"
616-
:disabled="exportSaveBusy"
617-
@click="saveSnsExportToSelectedFolder()"
618-
>
619-
{{ exportSaveBusy ? '\u4fdd\u5b58\u4e2d\u2026' : exportSaveState === 'success' ? '\u91cd\u65b0\u4fdd\u5b58\u5230\u6587\u4ef6\u5939' : '\u4fdd\u5b58\u5230\u5df2\u9009\u6587\u4ef6\u5939' }}
620-
</button>
621-
</div>
596+
<button
597+
v-if="exportJob.status === 'done' && exportJob.exportId && hasWebExportFolder"
598+
type="button"
599+
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"
600+
:disabled="exportSaveBusy"
601+
@click="saveSnsExportToSelectedFolder()"
602+
>
603+
{{ exportSaveBusy ? '保存中…' : exportSaveState === 'success' ? '重新保存到文件夹' : '保存到已选文件夹' }}
604+
</button>
622605
</div>
623606

624607
<div class="space-y-2">
@@ -815,15 +798,6 @@
815798
<div class="px-5 py-4 border-t border-gray-200 flex items-center justify-between gap-3">
816799
<div class="text-xs text-gray-500">&#24050;&#36873; {{ exportSelectedCount }} &#20154;</div>
817800
<div class="flex gap-2">
818-
<button
819-
v-if="canCancelSnsExport"
820-
type="button"
821-
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"
822-
:disabled="isExportCancelling"
823-
@click="cancelSnsExportJob"
824-
>
825-
{{ isExportCancelling ? '\u53d6\u6d88\u4e2d\u2026' : '\u53d6\u6d88\u5bfc\u51fa' }}
826-
</button>
827801
<button
828802
type="button"
829803
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 @@
833807
</button>
834808
<button
835809
type="button"
836-
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"
837-
:disabled="!selectedAccount || !exportSelectedCount || isSnsExportBusy"
838-
@click="startSnsExportFromModal"
810+
class="px-4 py-2 rounded-md text-sm transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
811+
:class="canCancelSnsExport ? 'border border-amber-200 bg-amber-50 text-amber-700 hover:bg-amber-100' : 'bg-[#03C160] text-white hover:bg-[#02ad56]'"
812+
:disabled="exportPrimaryActionDisabled"
813+
@click="handleExportPrimaryAction"
839814
>
840-
{{ isSnsExportBusy ? '导出中…' : '开始导出' }}
815+
{{ exportPrimaryActionLabel }}
841816
</button>
842817
</div>
843818
</div>
@@ -1139,17 +1114,6 @@ const exportActiveFormatLabel = computed(() => {
11391114
return exportFormatOptions.find((item) => item.value === exportActiveFormat.value)?.label || 'HTML'
11401115
})
11411116

1142-
const exportStatusText = computed(() => {
1143-
const status = String(exportJob.value?.status || '').trim()
1144-
return {
1145-
queued: '排队中',
1146-
running: '导出中',
1147-
done: '已完成',
1148-
error: '失败',
1149-
cancelled: '已取消'
1150-
}[status] || status || '-'
1151-
})
1152-
11531117
const exportOverallPercent = computed(() => {
11541118
const status = String(exportJob.value?.status || '').trim()
11551119
if (status === 'done') return 100
@@ -1187,6 +1151,24 @@ const canCancelSnsExport = computed(() => {
11871151
return status === 'queued' || status === 'running'
11881152
})
11891153

1154+
const exportPrimaryActionLabel = computed(() => {
1155+
if (canCancelSnsExport.value) return isExportCancelling.value ? '取消中…' : '取消导出'
1156+
return isSnsExportBusy.value ? '导出中…' : '开始导出'
1157+
})
1158+
1159+
const exportPrimaryActionDisabled = computed(() => {
1160+
if (canCancelSnsExport.value) return isExportCancelling.value
1161+
return !selectedAccount.value || !exportSelectedCount.value || isSnsExportBusy.value
1162+
})
1163+
1164+
const handleExportPrimaryAction = async () => {
1165+
if (canCancelSnsExport.value) {
1166+
await cancelSnsExportJob()
1167+
return
1168+
}
1169+
await startSnsExportFromModal()
1170+
}
1171+
11901172
const normalizeExportSelectedUsernames = (list) => {
11911173
const validUsernames = new Set(
11921174
visibleSnsUsers.value

0 commit comments

Comments
 (0)