✨ feat: 关闭应用的提示修改 可存储配置最小化 还是 关闭

src/main/modules/window.ts

@@ -1,4 +1,4 @@
-import { BrowserWindow, shell, ipcMain } from 'electron';
+import { BrowserWindow, shell, ipcMain, app } from 'electron';
 import { is } from '@electron-toolkit/utils';
 import { join } from 'path';
 
@@ -28,6 +28,7 @@ export function initializeWindowManager() {
     const win = BrowserWindow.fromWebContents(event.sender);
     if (win) {
       win.destroy();
+      app.quit();
     }
   });
 

src/main/set.json

@@ -4,5 +4,6 @@
   "animationSpeed": 1,
   "author": "Alger",
   "authorUrl": "https://github.com/algerkong",
-  "musicApiPort": 30488
+  "musicApiPort": 30488,
+  "closeAction": "ask"
 }

src/renderer/components.d.ts

@@ -25,6 +25,7 @@ declare module 'vue' {
     NModal: typeof import('naive-ui')['NModal']
     NPopover: typeof import('naive-ui')['NPopover']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
+    NSelect: typeof import('naive-ui')['NSelect']
     NSlider: typeof import('naive-ui')['NSlider']
     NSpin: typeof import('naive-ui')['NSpin']
     NSwitch: typeof import('naive-ui')['NSwitch']

src/renderer/layout/components/TitleBar.vue

@@ -10,14 +10,37 @@
       </button>
     </div>
   </div>
+
+  <n-modal
+    v-model:show="showCloseModal"
+    preset="dialog"
+    title="关闭应用"
+    :style="{ width: '400px' }"
+    :mask-closable="true"
+  >
+    <div class="close-dialog-content">
+      <p>请选择关闭方式</p>
+      <div class="remember-choice">
+        <n-checkbox v-model:checked="rememberChoice">记住我的选择</n-checkbox>
+      </div>
+    </div>
+    <template #action>
+      <div class="dialog-footer">
+        <n-button type="primary" @click="handleAction('minimize')">最小化到托盘</n-button>
+        <n-button @click="handleAction('close')">退出应用</n-button>
+      </div>
+    </template>
+  </n-modal>
 </template>
 
 <script setup lang="ts">
-import { useDialog } from 'naive-ui';
+import { ref } from 'vue';
-
+import { useStore } from 'vuex';
 import { isElectron } from '@/utils';
 
-const dialog = useDialog();
+const store = useStore();
+const showCloseModal = ref(false);
+const rememberChoice = ref(false);
 
 const minimize = () => {
   if (!isElectron) {
@@ -26,22 +49,40 @@ const minimize = () => {
   window.api.minimize();
 };
 
+const handleAction = (action: 'minimize' | 'close') => {
+  if (rememberChoice.value) {
+    store.commit('setSetData', {
+      ...store.state.setData,
+      closeAction: action
+    });
+  }
+  
+  if (action === 'minimize') {
+    window.api.miniTray();
+  } else {
+    window.api.close();
+  }
+  showCloseModal.value = false;
+};
+
 const close = () => {
   if (!isElectron) {
     return;
   }
-  dialog.warning({
+
-    title: '提示',
+  const closeAction = store.state.setData.closeAction;
-    content: '确定要退出吗？',
+  
-    positiveText: '最小化',
+  if (closeAction === 'minimize') {
-    negativeText: '关闭',
+    window.api.miniTray();
-    onPositiveClick: () => {
+    return;
-      window.api.minimize();
+  }
-    },
+  
-    onNegativeClick: () => {
+  if (closeAction === 'close') {
-      window.api.close();
+    window.api.close();
-    }
+    return;
-  });
+  }
+
+  showCloseModal.value = true;
 };
 
 const drag = (event: MouseEvent) => {
@@ -68,4 +109,12 @@ const drag = (event: MouseEvent) => {
 button {
   @apply text-gray-600 dark:text-gray-400 hover:text-green-500;
 }
+
+.close-dialog-content {
+  @apply flex flex-col gap-4;
+}
+
+.dialog-footer {
+  @apply flex gap-4 justify-end;
+}
 </style>

src/renderer/views/set/index.vue

@@ -112,6 +112,23 @@
           <n-button size="small" type="primary" @click="openAuthor"><i class="ri-github-line"></i>前往github</n-button>
         </div>
       </div>
+      <div class="set-item" v-if="isElectron">
+        <div>
+          <div class="set-item-title">关闭行为</div>
+          <div class="set-item-content">
+            {{ closeActionLabels[setData.closeAction] || '每次询问' }}
+          </div>
+        </div>
+        <n-select
+          v-model:value="setData.closeAction"
+          :options="[
+            { label: '每次询问', value: 'ask' },
+            { label: '最小化到托盘', value: 'minimize' },
+            { label: '直接退出', value: 'close' }
+          ]"
+          style="width: 120px"
+        />
+      </div>
       <div class="set-item" v-if="isElectron">
         <div>
           <div class="set-item-title">重启</div>
@@ -144,6 +161,12 @@ const updateInfo = ref<UpdateResult>({
   releaseInfo: null
 });
 
+const closeActionLabels = {
+  ask: '每次询问',
+  minimize: '最小化到托盘',
+  close: '直接退出'
+} as const;
+
 const setData = computed(() => store.state.setData);
 
 watch(() => setData.value, (newVal) => {