fix: 设置菜单折叠宽度

This commit is contained in:
MTrun
2022-01-08 15:00:52 +08:00
parent 9c74c26219
commit 072b8668fd
9 changed files with 35 additions and 22 deletions
@@ -1,8 +0,0 @@
export type ListType = {
key: string
type: string
name: string
desc: string
value: boolean
tip: string
}
@@ -1,3 +0,0 @@
import SystemSet from './index.vue';
export { SystemSet };
@@ -1,90 +0,0 @@
<template>
<n-modal v-model:show="modelShow" @afterLeave="closeHandle">
<n-list bordered class="go-system-setting">
<template #header> 系统设置 </template>
<n-list-item v-for="item in list" :key="item.name">
<n-space :size="40">
<n-space>
<n-text class="item-left">{{ item.name }}</n-text>
<template v-if="item.type === 'switch'">
<n-switch
v-model:value="item.value"
size="small"
@update:value="handleChange($event, item)"
/>
</template>
</n-space>
<n-space>
<n-text class="item-right">{{ item.desc }}</n-text>
<n-tooltip trigger="hover">
<template #trigger>
<n-icon size="21">
<HelpOutlineIcon />
</n-icon>
</template>
<span>
{{ item.tip }}
</span>
</n-tooltip>
</n-space>
</n-space>
</n-list-item>
<n-list-item></n-list-item>
</n-list>
</n-modal>
</template>
<script script lang="ts" setup>
import { reactive } from 'vue'
import { ListType } from './index.d'
import { useLangStore } from '@/store/modules/langStore/langStore'
import { icon } from '@/plugins'
const { HelpOutlineIcon } = icon.ionicons5
const emit = defineEmits(['update:modelShow'])
defineProps({
modelShow: Boolean
})
const langStore = useLangStore()
const list = reactive<ListType[]>([
{
key: 'lang',
value: langStore.getReload,
type: 'switch',
name: '切换语言',
desc: '切换语言是否重新加载页面',
tip: '不重载可能会导致部分区域语言切换失败'
}
])
const closeHandle = () => {
emit('update:modelShow', false)
}
const handleChange = (e: Event, item: ListType) => {
switch (item.key) {
case 'lang':
langStore.changeReload(item.value)
break
default:
break
}
}
</script>
<style lang="scss" scoped>
@include go('system-setting') {
@extend .go-background-filter;
min-width: 100px;
max-width: 60vw;
.item-left {
width: 200px;
}
}
</style>
+1 -1
View File
@@ -27,7 +27,7 @@ import { h, ref } from 'vue'
import { NAvatar, NText } from 'naive-ui'
import { renderIcon } from '@/utils'
import { openDoc, logout, renderLang } from '@/utils'
import { SystemSet } from './components/SystemSet/index'
import { SystemSet } from '@/components/SystemSet/index'
import { icon } from '@/plugins'
const {