Feat/config leave confirm (#5249)

* feat: 配置文件增加未保存提示弹窗

* fix: 移除unsavedChangesDialog插件使用组件方式实现弹窗

Author: SnowNightt

dashboard/src/components/config/UnsavedChangesConfirmDialog.vue

@@ -0,0 +1,98 @@
+<template>
+  <v-dialog v-model="isOpen" max-width="480" persistent>
+    <v-card>
+      <v-card-title class="dialog-title d-flex align-center justify-space-between">
+        <span>{{ title }}</span>
+        <v-btn icon="mdi-close" variant="text" @click="handleClose"></v-btn>
+      </v-card-title>
+      <v-card-text>
+        <div class="message-text">{{ message }}</div>
+        <div class="action-hints">
+          <span class="hint-item">{{ confirmHint }}</span>
+          <span class="hint-item">{{ cancelHint }}</span>
+          <span class="hint-item">{{ closeHint }}</span>
+        </div>
+      </v-card-text>
+      <v-card-actions>
+        <v-spacer></v-spacer>
+        <v-btn color="gray" @click="handleCancel">{{ t('core.common.dialog.cancelButton') }}</v-btn>
+        <v-btn color="red" @click="handleConfirm" class="confirm-button">{{ t('core.common.dialog.confirmButton') }}</v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import { useI18n } from '@/i18n/composables';
+
+const { t } = useI18n();
+
+const isOpen = ref(false);
+const title = ref("");
+const message = ref("");
+const confirmHint = ref("");
+const cancelHint = ref("");
+const closeHint = ref("");
+let resolvePromise = null;
+
+const open = (options) => {
+  title.value = options.title || t('core.common.dialog.confirmTitle');
+  message.value = options.message || t('core.common.dialog.confirmMessage');
+  confirmHint.value = options.confirmHint || "";
+  cancelHint.value = options.cancelHint || "";
+  closeHint.value = options.closeHint || "";
+  isOpen.value = true;
+
+  return new Promise((resolve) => {
+    resolvePromise = resolve;
+  });
+};
+
+const handleConfirm = () => {
+  isOpen.value = false;
+  if (resolvePromise) resolvePromise(true);
+};
+
+const handleCancel = () => {
+  isOpen.value = false;
+  if (resolvePromise) resolvePromise(false);
+};
+
+const handleClose = () => {
+  isOpen.value = false;
+  if (resolvePromise) resolvePromise('close');
+};
+
+defineExpose({ open });
+</script>
+
+
+<style scoped>
+.message-text {
+  margin-bottom: 8px;
+  line-height: 1.5;
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.action-hints {
+  display: flex;
+  gap: 15px;
+}
+
+.hint-item {
+  color: var(--v-theme-secondaryText, #666);
+  font-size: 12px;
+  opacity: 0.7;
+}
+
+.dialog-title {
+  font-size: 20px;
+  font-weight: 500;
+}
+
+.confirm-button {
+  color: rgb(239, 68, 68);
+}
+</style>

dashboard/src/i18n/locales/en-US/features/config.json

@@ -112,5 +112,18 @@
     "addToConfig": "Added to config",
     "fileCount": "Files: {count}",
     "done": "Done"
+  },
+  "unsavedChangesWarning": {
+    "dialogTitle": "Unsaved changes",
+    "leavePage": "You have unsaved changes. Do you want to save before leaving?",
+    "switchConfig": "Switching config will discard unsaved changes. Do you want to save first?",
+    "options": {
+      "save": "Save",
+      "saveAndSwitch": "Save and switch",
+      "discardAndSwitch": "Discard changes and switch",
+      "closeCard": "Close the pop-up window",
+      "confirm": "confirm",
+      "cancel": "cancel"
+    }
   }
 }

dashboard/src/i18n/locales/zh-CN/features/config.json

@@ -112,5 +112,18 @@
     "addToConfig": "已加入配置",
     "fileCount": "文件：{count}",
     "done": "完成"
+    },
+  "unsavedChangesWarning": {
+    "dialogTitle": "未保存的更改",
+    "leavePage": "当前配置有未保存的更改，切换前是否保存？",
+    "switchConfig": "切换配置文件会丢失当前未保存的更改，是否先保存？",
+    "options": {
+      "save": "保存",
+      "saveAndSwitch": "保存并切换",
+      "discardAndSwitch": "放弃更改并切换",
+      "closeCard": "关闭弹窗",
+      "confirm": "确定",
+      "cancel": "取消"
+    }
   }
 }