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

This commit is contained in:
alger
2025-01-03 22:24:13 +08:00
parent 1dc7d0ceca
commit 46f8067577
5 changed files with 92 additions and 17 deletions

View File

@@ -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();
}
});

View File

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

View File

@@ -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']

View File

@@ -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: '提示',
content: '确定要退出吗?',
positiveText: '最小化',
negativeText: '关闭',
onPositiveClick: () => {
window.api.minimize();
},
onNegativeClick: () => {
window.api.close();
}
});
const closeAction = store.state.setData.closeAction;
if (closeAction === 'minimize') {
window.api.miniTray();
return;
}
if (closeAction === '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>

View File

@@ -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) => {