feat: 调整个人配置功能,每次改变自动保存,右上角保存修改为重置。
This commit is contained in:
parent
4e735beb2f
commit
e439bff2bc
|
|
@ -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
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue