-
+
主题设置
深色模式
-
+
色弱模式
-
+
灰色模式
-
+
界面显示
LOGO显示
-
+
多页签
-
+
面包屑
-
+
固定头部和多页签
-
-
-
- 固定底部
-
+
侧边栏反转色
-
+
头部反转色
-
+
+
+
+ 水印
+
@@ -69,7 +105,7 @@ const appStore = useAppStore();
const drawerActive = ref(false);
const openSetting = () => {
- drawerActive.value = !drawerActive.value;
+ drawerActive.value = !drawerActive.value;
};
diff --git a/src/layouts/components/index.ts b/src/layouts/components/index.ts
index 8ccd4f5..ae02439 100644
--- a/src/layouts/components/index.ts
+++ b/src/layouts/components/index.ts
@@ -20,19 +20,22 @@ import TabBar from './tab/TabBar.vue';
/* 其他组件 */
// 返回顶部
import BackTop from './common/BackTop.vue';
+import Watermark from './common/Watermark.vue';
+
export {
- Breadcrumb,
- CollapaseButton,
- Menu,
- Logo,
- FullScreen,
- DarkMode,
- Setting,
- Github,
- Notices,
- UserCenter,
- Search,
- Reload,
- TabBar,
- BackTop,
+ Breadcrumb,
+ CollapaseButton,
+ Menu,
+ Logo,
+ FullScreen,
+ DarkMode,
+ Setting,
+ Github,
+ Notices,
+ UserCenter,
+ Search,
+ Reload,
+ TabBar,
+ BackTop,
+ Watermark,
};
diff --git a/src/store/modules/app.ts b/src/store/modules/app.ts
index 3436f37..050665e 100644
--- a/src/store/modules/app.ts
+++ b/src/store/modules/app.ts
@@ -15,9 +15,9 @@ interface AppStatus {
showTabs: boolean;
showBreadcrumb: boolean;
fixedHeader: boolean;
- fixedFooter: boolean;
invertedSider: boolean;
invertedHeader: boolean;
+ showWatermark: boolean;
}
const docEle = document.documentElement;
@@ -37,9 +37,9 @@ export const useAppStore = defineStore('app-store', {
showTabs: true,
showBreadcrumb: true,
fixedHeader: false,
- fixedFooter: true,
invertedSider: false,
invertedHeader: false,
+ showWatermark: false,
};
},
actions: {
@@ -119,10 +119,6 @@ export const useAppStore = defineStore('app-store', {
this.fixedHeader = !this.fixedHeader;
},
/* 切换固定底部 */
- toggleFixedFooter() {
- this.fixedFooter = !this.fixedFooter;
- },
- /* 切换固定底部 */
toggleInvertedSider() {
this.invertedSider = !this.invertedSider;
},
@@ -130,5 +126,9 @@ export const useAppStore = defineStore('app-store', {
toggleInvertedHeader() {
this.invertedHeader = !this.invertedHeader;
},
+ /* 切换固定底部 */
+ toggleShowWatermark() {
+ this.showWatermark = !this.showWatermark;
+ },
},
});