cirry/simple-element-plus-template
1
0
Fork 0
mirror of https://github.com/fugary/simple-element-plus-template.git synced 2025-12-10 04:47:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

国际化、主题处理

Browse Source
This commit is contained in:
Gary Fu
2023-12-17 15:11:38 +08:00
parent 99629bc0a5
commit 45ccfddba5
8 changed files with 37 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/TopNav.vue
View File

@@ -1,22 +1,16 @@
<script setup>
import { ref } from 'vue'
import { useDark } from '@vueuse/core'
import { Check } from '@element-plus/icons-vue'
import { useGlobalConfigStore } from '@/stores/globalConfig'
import { useGlobalConfigStore } from '@/stores/globalConfigStore'
const globalConfigStore = useGlobalConfigStore()
const isCollapseLeft = ref(false)
const emit = defineEmits(['update:collapseLeft'])
const updateCollapseLeft = () => {
isCollapseLeft.value = !isCollapseLeft.value
emit('update:collapseLeft', isCollapseLeft.value)
globalConfigStore.collapseLeft()
emit('update:collapseLeft', globalConfigStore.isCollapseLeft)
}
const isDark = useDark()
defineProps({
collapseLeft: {
type: Boolean
@@ -30,10 +24,10 @@ defineProps({
>
<el-menu-item @click="updateCollapseLeft">
<template #title>
<el-icon v-if="!isCollapseLeft">
<el-icon v-if="!globalConfigStore.isCollapseLeft">
<Fold />
</el-icon>
<el-icon v-if="isCollapseLeft">
<el-icon v-if="globalConfigStore.isCollapseLeft">
<Expand />
</el-icon>
<span>&nbsp;</span>
@@ -69,18 +63,18 @@ defineProps({
</template>
<el-menu-item
index="2-1"
@click="isDark=false"
@click="globalConfigStore.changeTheme(false)"
>
<el-icon v-if="!isDark">
<el-icon v-if="!globalConfigStore.isDarkTheme">
<Check />
</el-icon>
{{ $t('common.label.themeDefault') }}
</el-menu-item>
<el-menu-item
index="2-2"
@click="isDark=true"
@click="globalConfigStore.changeTheme(true)"
>
<el-icon v-if="isDark">
<el-icon v-if="globalConfigStore.isDarkTheme">
<Check />
</el-icon>
{{ $t('common.label.themeDark') }}