feat: 调整个人配置功能,每次改变自动保存,右上角保存修改为重置。

This commit is contained in:
pixelmaxQM 2025-04-07 13:00:14 +08:00
parent 4e735beb2f
commit e439bff2bc
2 changed files with 35 additions and 12 deletions

View File

@ -99,6 +99,26 @@ export const useAppStore = defineStore('app', () => {
config.transition_type = e config.transition_type = e
} }
const baseCoinfg = {
darkMode: 'auto',
primaryColor: '#3b82f6',
show_watermark: false,
grey: false,
weakness: false,
side_mode: 'normal',
showTabs: true,
transition_type: 'fade',
layout_side_width: 200,
layout_side_collapsed_width: 60,
layout_side_item_height: 40
}
const resetConfig = () => {
for (let baseCoinfgKey in baseCoinfg) {
config[baseCoinfgKey] = baseCoinfg[baseCoinfgKey]
}
}
// 监听色弱模式和灰色模式 // 监听色弱模式和灰色模式
watchEffect(() => { watchEffect(() => {
document.documentElement.classList.toggle('html-weakenss', config.weakness) document.documentElement.classList.toggle('html-weakenss', config.weakness)
@ -128,6 +148,7 @@ export const useAppStore = defineStore('app', () => {
toggleConfigSideItemHeight, toggleConfigSideItemHeight,
toggleConfigWatermark, toggleConfigWatermark,
toggleSideMode, toggleSideMode,
toggleTransition toggleTransition,
resetConfig
} }
}) })

View File

@ -9,7 +9,7 @@
<template #header> <template #header>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-lg">系统配置</span> <span class="text-lg">系统配置</span>
<el-button type="primary" @click="saveConfig">保存配置</el-button> <el-button type="primary" @click="resetConfig">重置配置</el-button>
</div> </div>
</template> </template>
<div class="flex flex-col"> <div class="flex flex-col">
@ -144,6 +144,8 @@
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { setSelfSetting } from '@/api/user' import { setSelfSetting } from '@/api/user'
import Title from './title.vue' import Title from './title.vue'
import { watch } from 'vue';
const appStore = useAppStore() const appStore = useAppStore()
const { config, device } = storeToRefs(appStore) const { config, device } = storeToRefs(appStore)
defineOptions({ defineOptions({
@ -185,24 +187,24 @@
] ]
const saveConfig = async () => { const saveConfig = async () => {
/*const input = document.createElement("textarea");
input.value = JSON.stringify(config.value);
//
input.value = input.value.replace(/,/g, ",\n");
document.body.appendChild(input);
input.select();
document.execCommand("copy");
document.body.removeChild(input);
ElMessage.success("复制成功, 请自行保存到本地文件中");*/
const res = await setSelfSetting(config.value) const res = await setSelfSetting(config.value)
console.log(config.value)
if (res.code === 0) { if (res.code === 0) {
localStorage.setItem('originSetting', JSON.stringify(config.value)) localStorage.setItem('originSetting', JSON.stringify(config.value))
ElMessage.success('保存成功') ElMessage.success('保存成功')
drawer.value = false
} }
} }
const customColor = ref('') const customColor = ref('')
const resetConfig = () => {
appStore.resetConfig()
}
watch(config, async () => {
await saveConfig();
}, { deep: true });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>