ygxbnet
3f6e999783
- 引入 ConfirmClearDialog 组件用于清空文件确认 - 添加 clear-files-no-prompt 配置项控制是否显示确认弹窗 - 实现清空文件列表显示和确认逻辑 - 集成 Element Plus 图标组件库 - 优化日志输出格式增加空格分隔 - 重构配置写入方法使用统一的 configModel 枚举 - 添加事件监听处理清空文件操作 - 实现勾选不再提示选项并保存配置
125 lines
2.8 KiB
Vue
125 lines
2.8 KiB
Vue
<script lang="ts" setup>
|
||
import {ref} from 'vue'
|
||
import {WriteConfig} from "../../wailsjs/go/main/App";
|
||
import {configModel} from "@/model.ts";
|
||
import {EventsEmit} from "../../wailsjs/runtime";
|
||
import {InfoFilled} from '@element-plus/icons-vue'
|
||
|
||
const props = defineProps<{
|
||
visible: boolean
|
||
fileList: string[]
|
||
}>()
|
||
|
||
const emit = defineEmits<{
|
||
(e: 'update:visible', value: boolean): void
|
||
// (e: 'confirm', dontShowAgain: boolean): void
|
||
}>()
|
||
|
||
const dontShowAgain = ref(false)
|
||
|
||
const handleClose = () => {
|
||
emit('update:visible', false)
|
||
EventsEmit('confirm-clear-files', false)
|
||
}
|
||
|
||
const handleConfirm = () => {
|
||
// emit('confirm', dontShowAgain.value)
|
||
emit('update:visible', false)
|
||
WriteConfig(configModel.ClearFilesNoPrompt, dontShowAgain.value)
|
||
EventsEmit('confirm-clear-files', true)
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<el-dialog
|
||
:model-value="visible"
|
||
width="600px"
|
||
:close-on-click-modal="false"
|
||
@update:model-value="(val: boolean) => emit('update:visible', val)"
|
||
@close="handleClose"
|
||
align-center
|
||
>
|
||
<template #header>
|
||
是否确认清空上传文件
|
||
</template>
|
||
<div class="hint-text">以下文件将会被清空并移动到tmp文件夹进行上传，您是否确认</div>
|
||
<div class="dialog-content">
|
||
<div class="file-list">
|
||
<div v-for="(file, index) in fileList" :key="index" class="file-item">
|
||
{{ file }}
|
||
</div>
|
||
<div v-if="fileList.length === 0" class="empty-text">暂无文件</div>
|
||
</div>
|
||
</div>
|
||
<template #footer>
|
||
<div class="dialog-footer">
|
||
<div class="dialog-footer-checkbox-container">
|
||
<el-checkbox v-model="dontShowAgain" label="下次清空文件不再弹出此弹窗确认"/>
|
||
<el-tooltip content="此弹窗会在首次运行时弹出，您可以选择下次不再弹出此弹窗">
|
||
<el-icon>
|
||
<InfoFilled/>
|
||
</el-icon>
|
||
</el-tooltip>
|
||
</div>
|
||
|
||
<div>
|
||
<el-button @click="handleClose">取消</el-button>
|
||
<el-button type="primary" @click="handleConfirm">确认</el-button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</el-dialog>
|
||
</template>
|
||
|
||
<style scoped>
|
||
.dialog-footer-checkbox-container {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 5px;
|
||
}
|
||
|
||
.dialog-footer-checkbox-container .el-icon {
|
||
color: #909399;
|
||
}
|
||
|
||
.dialog-content {
|
||
padding: 10px 0;
|
||
}
|
||
|
||
.hint-text {
|
||
font-size: 12px;
|
||
color: #909399;
|
||
}
|
||
|
||
.file-list {
|
||
max-height: 350px;
|
||
overflow-y: auto;
|
||
border: 1px solid #e4e7ed;
|
||
border-radius: 4px;
|
||
padding: 8px;
|
||
}
|
||
|
||
.file-item {
|
||
padding: 6px 8px;
|
||
font-size: 14px;
|
||
color: #606266;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.file-item:last-child {
|
||
border-bottom: none;
|
||
}
|
||
|
||
.empty-text {
|
||
text-align: center;
|
||
color: #909399;
|
||
padding: 20px 0;
|
||
}
|
||
|
||
.dialog-footer {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
</style>
|