diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue index cf989c3..1eb9529 100644 --- a/src/layout/components/Settings/index.vue +++ b/src/layout/components/Settings/index.vue @@ -49,6 +49,13 @@ +
+ 显示页签图标 + + + +
+
固定 Header @@ -122,6 +129,7 @@ function saveSetting() { let layoutSetting = { "topNav": storeSettings.value.topNav, "tagsView": storeSettings.value.tagsView, + "tagsIcon": storeSettings.value.tagsIcon, "fixedHeader": storeSettings.value.fixedHeader, "sidebarLogo": storeSettings.value.sidebarLogo, "dynamicTitle": storeSettings.value.dynamicTitle, diff --git a/src/layout/components/TagsView/index.vue b/src/layout/components/TagsView/index.vue index 8aac500..38e32d5 100644 --- a/src/layout/components/TagsView/index.vue +++ b/src/layout/components/TagsView/index.vue @@ -5,13 +5,14 @@ v-for="tag in visitedViews" :key="tag.path" :data-path="tag.path" - :class="isActive(tag) ? 'active' : ''" + :class="{ 'active': isActive(tag), 'has-icon': tagsIcon }" :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }" class="tags-view-item" :style="activeStyle(tag)" @click.middle="!isAffix(tag) ? closeSelectedTag(tag) : ''" @contextmenu.prevent="openMenu(tag, $event)" > + {{ tag.title }} @@ -62,6 +63,7 @@ const router = useRouter() const visitedViews = computed(() => useTagsViewStore().visitedViews) const routes = computed(() => usePermissionStore().routes) const theme = computed(() => useSettingsStore().theme) +const tagsIcon = computed(() => useSettingsStore().tagsIcon) watch(route, () => { addTags() @@ -307,6 +309,10 @@ function handleScroll() { } } + .tags-view-item.active.has-icon::before { + content: none !important; + } + .contextmenu { margin: 0; background: var(--el-bg-color-overlay, #fff); diff --git a/src/settings.js b/src/settings.js index 171bcdf..77b78a2 100644 --- a/src/settings.js +++ b/src/settings.js @@ -23,6 +23,11 @@ export default { * 是否显示 tagsView */ tagsView: true, + + /** + * 显示页签图标 + */ + tagsIcon: false, /** * 是否固定头部 @@ -37,13 +42,5 @@ export default { /** * 是否显示动态标题 */ - dynamicTitle: false, - - /** - * @type {string | array} 'production' | ['production', 'development'] - * @description Need show err logs component. - * The default is only used in the production env - * If you want to also use it in dev, you can pass ['production', 'development'] - */ - errorLog: 'production' + dynamicTitle: false } diff --git a/src/store/modules/settings.js b/src/store/modules/settings.js index 64b413a..f69aaa5 100644 --- a/src/store/modules/settings.js +++ b/src/store/modules/settings.js @@ -5,7 +5,7 @@ import { useDynamicTitle } from '@/utils/dynamicTitle' const isDark = useDark() const toggleDark = useToggle(isDark) -const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings +const { sideTheme, showSettings, topNav, tagsView, tagsIcon, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || '' @@ -19,6 +19,7 @@ const useSettingsStore = defineStore( showSettings: showSettings, topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav, tagsView: storageSetting.tagsView === undefined ? tagsView : storageSetting.tagsView, + tagsIcon: storageSetting.tagsIcon === undefined ? tagsIcon : storageSetting.tagsIcon, fixedHeader: storageSetting.fixedHeader === undefined ? fixedHeader : storageSetting.fixedHeader, sidebarLogo: storageSetting.sidebarLogo === undefined ? sidebarLogo : storageSetting.sidebarLogo, dynamicTitle: storageSetting.dynamicTitle === undefined ? dynamicTitle : storageSetting.dynamicTitle,