修改设置

This commit is contained in:
Jason 2022-08-15 17:35:45 +08:00
parent e4a6704101
commit e553ab56e3
7 changed files with 82 additions and 23 deletions

View File

@ -23,14 +23,27 @@
<span class="flex-1 truncate mr-2">
<overflow-tooltip :content="data.name" />
</span>
<el-dropdown v-if="data.id > 0" :hide-on-click="false">
<el-dropdown
v-perms="[
'common:album:cateRename',
'common:album:cateDel'
]"
v-if="data.id > 0"
:hide-on-click="false"
>
<span class="muted m-r-10">···</span>
<template #dropdown>
<el-dropdown-menu>
<div @click="handleEditCate(data.name, data.id)">
<div
v-perms="['common:album:cateRename']"
@click="handleEditCate(data.name, data.id)"
>
<el-dropdown-item>命名分组</el-dropdown-item>
</div>
<div @click="handleDeleteCate(data.id)">
<div
v-perms="['common:album:cateDel']"
@click="handleDeleteCate(data.id)"
>
<el-dropdown-item>删除分组</el-dropdown-item>
</div>
</el-dropdown-menu>
@ -44,7 +57,9 @@
</div>
<div class="flex justify-center p-2 border-t border-br">
<el-button @click="handleAddCate">添加分组</el-button>
<el-button @click="handleAddCate" v-perms="['common:album:cateAdd']">
添加分组
</el-button>
</div>
</div>
<div class="material__center flex flex-col">
@ -60,6 +75,7 @@
<el-button type="primary">本地上传</el-button>
</upload>
<el-button
v-perms="['common:album:albumDel']"
v-if="mode == 'page'"
:disabled="!select.length"
@click.stop="batchFileDelete()"
@ -68,6 +84,7 @@
</el-button>
<popup
v-perms="['common:album:albumMove']"
v-if="mode == 'page'"
class="ml-3"
@confirm="batchFileMove"
@ -166,6 +183,7 @@
<overflow-tooltip class="mt-1" :content="item.name" />
<div class="operation-btns flex items-center">
<el-button
v-perms="['common:album:albumRename']"
type="primary"
link
@click="handleFileRename(item.name, item.id)"
@ -208,7 +226,7 @@
<el-table-column prop="createTime" label="上传时间" min-width="100" />
<el-table-column label="操作" width="150" fixed="right">
<template #default="{ row }">
<div class="inline-block">
<div class="inline-block" v-perms="['common:album:albumRename']">
<el-button
type="primary"
link
@ -222,7 +240,7 @@
查看
</el-button>
</div>
<div class="inline-block">
<div class="inline-block" v-perms="['common:album:albumDel']">
<el-button
type="primary"
link
@ -255,7 +273,11 @@
当页全选
</el-checkbox>
</span>
<el-button :disabled="!select.length" @click="batchFileDelete()">
<el-button
v-perms="['common:album:albumDel']"
:disabled="!select.length"
@click="batchFileDelete()"
>
删除
</el-button>
<popup

View File

@ -3,6 +3,7 @@ const defaultSetting = {
sideTheme: 'light',
sideDarkColor: '#1d2124',
theme: '#4A5DFF',
openMultipleTabs: true,
successTheme: '#67c23a',
warningTheme: '#e6a23c',
dangerTheme: '#f56c6c',

View File

@ -24,7 +24,7 @@
</div>
</div>
</div>
<multiple-tabs />
<multiple-tabs v-if="settingStore.openMultipleTabs" />
</header>
</template>
@ -38,8 +38,10 @@ import UserDropDown from './user-drop-down.vue'
import Setting from '../setting/index.vue'
import MultipleTabs from './multiple-tabs.vue'
import useSettingStore from '@/stores/modules/setting'
const appStore = useAppStore()
const isMobile = computed(() => appStore.isMobile)
const settingStore = useSettingStore()
</script>
<style lang="scss">

View File

@ -37,6 +37,20 @@
<el-switch :model-value="isDark" @change="toggleDark" />
</div>
</div>
<div class="setting-item mb-5 flex justify-between items-center">
<span class="text-tx-secondary">开启多页签栏</span>
<div>
<el-switch
v-model="openMultipleTabs"
:active-value="true"
:inactive-value="false"
/>
</div>
</div>
<div class="setting-item mb-5 flex justify-between items-center">
<span class="text-tx-secondary">菜单栏宽度</span>
<div><el-input-number v-model="sideWidth" :min="180" :max="250" /></div>
</div>
<div class="setting-item mb-5 flex justify-between items-center">
<el-button @click="resetTheme">重置主题</el-button>
</div>
@ -75,6 +89,30 @@ const sideTheme = computed({
})
}
})
const openMultipleTabs = computed({
get() {
return settingStore.openMultipleTabs
},
set(value) {
settingStore.setSetting({
key: 'openMultipleTabs',
value
})
}
})
const sideWidth = computed({
get() {
return settingStore.sideWidth
},
set(value) {
settingStore.setSetting({
key: 'sideWidth',
value
})
}
})
const showSetting = computed({
get() {
return settingStore.showDrawer

View File

@ -1,5 +1,5 @@
<template>
<div class="menu flex-1 min-h-0" :class="themeClass">
<div class="menu flex-1 min-h-0" :class="themeClass" :style="`--aside-width: ${width}px`">
<el-scrollbar>
<el-menu
v-bind="config"
@ -38,6 +38,10 @@ const props = defineProps({
},
theme: {
type: String
},
width: {
type: Number,
default: 200
}
})

View File

@ -4,6 +4,7 @@
<side-menu
:routes="routes"
:isCollapsed="isCollapsed"
:width="settingStore.sideWidth"
:config="menuProp"
:theme="sideTheme"
@select="handleSelect"
@ -34,7 +35,11 @@ const userStore = useUserStore()
const routes = computed(() => userStore.routes)
const sideStyle = computed(() => {
return sideTheme.value == 'dark' ? `--side-dark-color:${settingStore.sideDarkColor}` : ''
return sideTheme.value == 'dark'
? {
'--side-dark-color': settingStore.sideDarkColor
}
: ''
})
const menuProp = computed(() => {
return {

View File

@ -323,19 +323,6 @@ const getDetails = async () => {
//@ts-ignore
formData[key] = data[key]
})
// watch(
// () => formData.genType,
// (value) => {
// if (value == 1) {
// feedback
// .confirm('')
// .catch(() => {
// formData.genType = 0
// })
// }
// }
// )
}
const { optionsData } = useDictOptions<{