forked from liweijie/education
1 line
19 KiB
JSON
1 line
19 KiB
JSON
{"remainingRequest":"C:\\Users\\Admin\\Desktop\\education\\frontend\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\Admin\\Desktop\\education\\frontend\\src\\layout\\components\\Settings\\index.vue?vue&type=style&index=0&id=126b135a&lang=scss&scoped=true","dependencies":[{"path":"C:\\Users\\Admin\\Desktop\\education\\frontend\\src\\layout\\components\\Settings\\index.vue","mtime":1787309162969},{"path":"C:\\Users\\Admin\\Desktop\\education\\frontend\\node_modules\\css-loader\\dist\\cjs.js","mtime":1787309792478},{"path":"C:\\Users\\Admin\\Desktop\\education\\frontend\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1787309794547},{"path":"C:\\Users\\Admin\\Desktop\\education\\frontend\\node_modules\\postcss-loader\\src\\index.js","mtime":1787309793084},{"path":"C:\\Users\\Admin\\Desktop\\education\\frontend\\node_modules\\sass-loader\\dist\\cjs.js","mtime":1787309791955},{"path":"C:\\Users\\Admin\\Desktop\\education\\frontend\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1787309791955},{"path":"C:\\Users\\Admin\\Desktop\\education\\frontend\\node_modules\\vue-loader\\lib\\index.js","mtime":1787309793790}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoNCi5zZXR0aW5nLWRyYXdlci1jb250ZW50IHsNCiAgLnNldHRpbmctZHJhd2VyLXRpdGxlIHsNCiAgICBtYXJnaW4tYm90dG9tOiAxMnB4Ow0KICAgIGNvbG9yOiByZ2JhKDAsIDAsIDAsIC44NSk7DQogICAgZm9udC1zaXplOiAxNHB4Ow0KICAgIGxpbmUtaGVpZ2h0OiAyMnB4Ow0KICAgIGZvbnQtd2VpZ2h0OiBib2xkOw0KICB9DQoNCiAgLnNldHRpbmctZHJhd2VyLWJsb2NrLWNoZWNib3ggew0KICAgIGRpc3BsYXk6IGZsZXg7DQogICAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0Ow0KICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgbWFyZ2luLXRvcDogMTBweDsNCiAgICBtYXJnaW4tYm90dG9tOiAyMHB4Ow0KDQogICAgLnNldHRpbmctZHJhd2VyLWJsb2NrLWNoZWNib3gtaXRlbSB7DQogICAgICBwb3NpdGlvbjogcmVsYXRpdmU7DQogICAgICBtYXJnaW4tcmlnaHQ6IDE2cHg7DQogICAgICBib3JkZXItcmFkaXVzOiAycHg7DQogICAgICBjdXJzb3I6IHBvaW50ZXI7DQoNCiAgICAgIGltZyB7DQogICAgICAgIHdpZHRoOiA0OHB4Ow0KICAgICAgICBoZWlnaHQ6IDQ4cHg7DQogICAgICB9DQoNCiAgICAgIC5zZXR0aW5nLWRyYXdlci1ibG9jay1jaGVjYm94LXNlbGVjdEljb24gew0KICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICAgIHRvcDogMDsNCiAgICAgICAgcmlnaHQ6IDA7DQogICAgICAgIHdpZHRoOiAxMDAlOw0KICAgICAgICBoZWlnaHQ6IDEwMCU7DQogICAgICAgIHBhZGRpbmctdG9wOiAxNXB4Ow0KICAgICAgICBwYWRkaW5nLWxlZnQ6IDI0cHg7DQogICAgICAgIGNvbG9yOiAjMDA4NzVBOw0KICAgICAgICBmb250LXdlaWdodDogNzAwOw0KICAgICAgICBmb250LXNpemU6IDE0cHg7DQogICAgICB9DQogICAgfQ0KICB9DQp9DQoNCi5kcmF3ZXItY29udGFpbmVyIHsNCiAgcGFkZGluZzogMjBweDsNCiAgZm9udC1zaXplOiAxNHB4Ow0KICBsaW5lLWhlaWdodDogMS41Ow0KICB3b3JkLXdyYXA6IGJyZWFrLXdvcmQ7DQoNCiAgLmRyYXdlci10aXRsZSB7DQogICAgbWFyZ2luLWJvdHRvbTogMTJweDsNCiAgICBjb2xvcjogcmdiYSgwLCAwLCAwLCAuODUpOw0KICAgIGZvbnQtc2l6ZTogMTRweDsNCiAgICBsaW5lLWhlaWdodDogMjJweDsNCiAgfQ0KDQogIC5kcmF3ZXItaXRlbSB7DQogICAgY29sb3I6IHJnYmEoMCwgMCwgMCwgLjY1KTsNCiAgICBmb250LXNpemU6IDE0cHg7DQogICAgcGFkZGluZzogMTJweCAwOw0KICB9DQoNCiAgLmRyYXdlci1zd2l0Y2ggew0KICAgIGZsb2F0OiByaWdodA0KICB9DQp9DQoNCi8vIOWvvOiIquaooeW8jw0KLm5hdi13cmFwIHsNCiAgZGlzcGxheTogZmxleDsNCiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0Ow0KICBhbGlnbi1pdGVtczogY2VudGVyOw0KICBtYXJnaW4tdG9wOiAxMHB4Ow0KICBtYXJnaW4tYm90dG9tOiAyMHB4Ow0KDQogIC5hY3RpdmVJdGVtIHsNCiAgICBib3JkZXI6IDJweCBzb2xpZCAjeyd2YXIoLS10aGVtZSknfSAhaW1wb3J0YW50Ow0KICB9DQoNCiAgLml0ZW0gew0KICAgIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgICBtYXJnaW4tcmlnaHQ6IDE2cHg7DQogICAgY3Vyc29yOiBwb2ludGVyOw0KICAgIHdpZHRoOiA1NnB4Ow0KICAgIGhlaWdodDogNDhweDsNCiAgICBib3JkZXItcmFkaXVzOiA0cHg7DQogICAgYmFja2dyb3VuZDogI2YwZjJmNTsNCiAgICBib3JkZXI6IDJweCBzb2xpZCB0cmFuc3BhcmVudDsNCiAgfQ0KDQogIC5sZWZ0IHsNCiAgICBiOmZpcnN0LWNoaWxkIHsNCiAgICAgIGRpc3BsYXk6IGJsb2NrOw0KICAgICAgaGVpZ2h0OiAzMCU7DQogICAgICBiYWNrZ3JvdW5kOiAjZmZmOw0KICAgIH0NCiAgICBiOmxhc3QtY2hpbGQgew0KICAgICAgd2lkdGg6IDMwJTsNCiAgICAgIGJhY2tncm91bmQ6ICMxYjJhNDc7DQogICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICBoZWlnaHQ6IDEwMCU7DQogICAgICB0b3A6IDA7DQogICAgICBib3JkZXItcmFkaXVzOiA0cHggMCAwIDRweDsNCiAgICB9DQogIH0NCiAgLm1peCB7DQogICAgYjpmaXJzdC1jaGlsZCB7DQogICAgICBib3JkZXItcmFkaXVzOiA0cHggNHB4IDAgMDsNCiAgICAgIGRpc3BsYXk6IGJsb2NrOw0KICAgICAgaGVpZ2h0OiAzMCU7DQogICAgICBiYWNrZ3JvdW5kOiAjMWIyYTQ3Ow0KICAgIH0NCiAgICBiOmxhc3QtY2hpbGQgew0KICAgICAgd2lkdGg6IDMwJTsNCiAgICAgIGJhY2tncm91bmQ6ICMxYjJhNDc7DQogICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICBoZWlnaHQ6IDcwJTsNCiAgICAgIGJvcmRlci1yYWRpdXM6IDAgMCAwIDRweDsNCiAgICB9DQogIH0NCiAgLnRvcCB7DQogICAgYjpmaXJzdC1jaGlsZCB7DQogICAgICBkaXNwbGF5OiBibG9jazsNCiAgICAgIGhlaWdodDogMzAlOw0KICAgICAgYmFja2dyb3VuZDogIzFiMmE0NzsNCiAgICAgIGJvcmRlci1yYWRpdXM6IDRweCA0cHggMCAwOw0KICAgIH0NCiAgfQ0KfQ0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4SA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/layout/components/Settings","sourcesContent":["<template>\r\n <el-drawer size=\"280px\" :visible=\"showSettings\" :with-header=\"false\" :append-to-body=\"true\" :before-close=\"closeSetting\" :lock-scroll=\"false\">\r\n <div class=\"drawer-container\">\r\n <div>\r\n <div class=\"setting-drawer-content\">\r\n <div class=\"setting-drawer-title\">\r\n <h3 class=\"drawer-title\">菜单导航设置</h3>\r\n </div>\r\n <div class=\"nav-wrap\">\r\n <el-tooltip content=\"左侧菜单\" placement=\"bottom\">\r\n <div class=\"item left\" @click=\"handleNavType(1)\" :style=\"{'--theme': theme}\" :class=\"{ activeItem: navType == 1 }\">\r\n <b></b><b></b>\r\n </div>\r\n </el-tooltip>\r\n\r\n <el-tooltip content=\"混合菜单\" placement=\"bottom\">\r\n <div class=\"item mix\" @click=\"handleNavType(2)\" :style=\"{'--theme': theme}\" :class=\"{ activeItem: navType == 2 }\">\r\n <b></b><b></b>\r\n </div>\r\n </el-tooltip>\r\n <el-tooltip content=\"顶部菜单\" placement=\"bottom\">\r\n <div class=\"item top\" @click=\"handleNavType(3)\" :style=\"{'--theme': theme}\" :class=\"{ activeItem: navType == 3 }\">\r\n <b></b><b></b>\r\n </div>\r\n </el-tooltip>\r\n </div>\r\n <div class=\"setting-drawer-title\">\r\n <h3 class=\"drawer-title\">主题风格设置</h3>\r\n </div>\r\n <div class=\"setting-drawer-block-checbox\">\r\n <div class=\"setting-drawer-block-checbox-item\" @click=\"handleTheme('theme-dark')\">\r\n <img src=\"@/assets/images/dark.svg\" alt=\"dark\">\r\n <div v-if=\"sideTheme === 'theme-dark'\" class=\"setting-drawer-block-checbox-selectIcon\" style=\"display: block;\">\r\n <i aria-label=\"图标: check\" class=\"anticon anticon-check\">\r\n <svg viewBox=\"64 64 896 896\" data-icon=\"check\" width=\"1em\" height=\"1em\" :fill=\"theme\" aria-hidden=\"true\" focusable=\"false\" class=\"\">\r\n <path d=\"M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z\"/>\r\n </svg>\r\n </i>\r\n </div>\r\n </div>\r\n <div class=\"setting-drawer-block-checbox-item\" @click=\"handleTheme('theme-light')\">\r\n <img src=\"@/assets/images/light.svg\" alt=\"light\">\r\n <div v-if=\"sideTheme === 'theme-light'\" class=\"setting-drawer-block-checbox-selectIcon\" style=\"display: block;\">\r\n <i aria-label=\"图标: check\" class=\"anticon anticon-check\">\r\n <svg viewBox=\"64 64 896 896\" data-icon=\"check\" width=\"1em\" height=\"1em\" :fill=\"theme\" aria-hidden=\"true\" focusable=\"false\" class=\"\">\r\n <path d=\"M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z\"/>\r\n </svg>\r\n </i>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>主题颜色</span>\r\n <theme-picker style=\"float: right;height: 26px;margin: -3px 8px 0 0;\" @change=\"themeChange\" />\r\n </div>\r\n </div>\r\n\r\n <el-divider/>\r\n\r\n <h3 class=\"drawer-title\">系统布局配置</h3>\r\n\r\n <div class=\"drawer-item\">\r\n <span>开启页签</span>\r\n <el-switch v-model=\"tagsView\" class=\"drawer-switch\" />\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>持久化标签页</span>\r\n <el-switch v-model=\"tagsViewPersist\" :disabled=\"!tagsView\" class=\"drawer-switch\" />\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>显示页签图标</span>\r\n <el-switch v-model=\"tagsIcon\" :disabled=\"!tagsView\" class=\"drawer-switch\" />\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>标签页样式</span>\r\n <el-radio-group v-model=\"tagsViewStyle\" :disabled=\"!tagsView\" size=\"mini\" class=\"drawer-switch\">\r\n <el-radio-button label=\"card\">卡片</el-radio-button>\r\n <el-radio-button label=\"chrome\">谷歌</el-radio-button>\r\n </el-radio-group>\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>固定 Header</span>\r\n <el-switch v-model=\"fixedHeader\" class=\"drawer-switch\" />\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>显示 Logo</span>\r\n <el-switch v-model=\"sidebarLogo\" class=\"drawer-switch\" />\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>动态标题</span>\r\n <el-switch v-model=\"dynamicTitle\" class=\"drawer-switch\" />\r\n </div>\r\n\r\n <div class=\"drawer-item\">\r\n <span>底部版权</span>\r\n <el-switch v-model=\"footerVisible\" class=\"drawer-switch\" />\r\n </div>\r\n\r\n <el-divider/>\r\n\r\n <el-button size=\"small\" type=\"primary\" plain icon=\"el-icon-document-add\" @click=\"saveSetting\">保存配置</el-button>\r\n <el-button size=\"small\" plain icon=\"el-icon-refresh\" @click=\"resetSetting\">重置配置</el-button>\r\n </div>\r\n </div>\r\n </el-drawer>\r\n</template>\r\n\r\n<script>\r\nimport ThemePicker from '@/components/ThemePicker'\r\n\r\nexport default {\r\n components: { ThemePicker },\r\n expose: ['openSetting'],\r\n data() {\r\n return {\r\n theme: this.$store.state.settings.theme,\r\n sideTheme: this.$store.state.settings.sideTheme,\r\n navType: this.$store.state.settings.navType,\r\n showSettings: false\r\n }\r\n },\r\n computed: {\r\n fixedHeader: {\r\n get() {\r\n return this.$store.state.settings.fixedHeader\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'fixedHeader',\r\n value: val\r\n })\r\n }\r\n },\r\n tagsViewPersist: {\r\n get() {\r\n return this.$store.state.settings.tagsViewPersist\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'tagsViewPersist',\r\n value: val\r\n })\r\n }\r\n },\r\n tagsView: {\r\n get() {\r\n return this.$store.state.settings.tagsView\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'tagsView',\r\n value: val\r\n })\r\n }\r\n },\r\n tagsIcon: {\r\n get() {\r\n return this.$store.state.settings.tagsIcon\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'tagsIcon',\r\n value: val\r\n })\r\n }\r\n },\r\n tagsViewStyle: {\r\n get() {\r\n return this.$store.state.settings.tagsViewStyle\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'tagsViewStyle',\r\n value: val\r\n })\r\n }\r\n },\r\n sidebarLogo: {\r\n get() {\r\n return this.$store.state.settings.sidebarLogo\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'sidebarLogo',\r\n value: val\r\n })\r\n }\r\n },\r\n dynamicTitle: {\r\n get() {\r\n return this.$store.state.settings.dynamicTitle\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'dynamicTitle',\r\n value: val\r\n })\r\n this.$store.dispatch('settings/setTitle', this.$store.state.settings.title)\r\n }\r\n },\r\n footerVisible: {\r\n get() {\r\n return this.$store.state.settings.footerVisible\r\n },\r\n set(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'footerVisible',\r\n value: val\r\n })\r\n }\r\n }\r\n },\r\n watch: {\r\n navType: {\r\n handler(val) {\r\n if (val == 1) {\r\n this.$store.dispatch(\"app/toggleSideBarHide\", false)\r\n }\r\n if (val == 2) {\r\n }\r\n if (val == 3) {\r\n this.$store.dispatch(\"app/toggleSideBarHide\", true)\r\n }\r\n if ([1, 3].includes(val)) {\r\n this.$store.commit(\"SET_SIDEBAR_ROUTERS\",this.$store.state.permission.defaultRoutes)\r\n }\r\n },\r\n immediate: true,\r\n deep: true\r\n }\r\n },\r\n methods: {\r\n themeChange(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'theme',\r\n value: val\r\n })\r\n this.theme = val\r\n },\r\n handleTheme(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'sideTheme',\r\n value: val\r\n })\r\n this.sideTheme = val\r\n },\r\n handleNavType(val) {\r\n this.$store.dispatch('settings/changeSetting', {\r\n key: 'navType',\r\n value: val\r\n })\r\n this.navType = val\r\n },\r\n openSetting() {\r\n this.showSettings = true\r\n },\r\n closeSetting(){\r\n this.showSettings = false\r\n },\r\n saveSetting() {\r\n this.$modal.loading(\"正在保存到本地，请稍候...\")\r\n if (!this.tagsViewPersist) {\r\n this.$cache.local.remove('tags-view-visited')\r\n }\r\n this.$cache.local.set(\r\n \"layout-setting\",\r\n `{\r\n \"navType\":${this.navType},\r\n \"tagsView\":${this.tagsView},\r\n \"tagsIcon\":${this.tagsIcon},\r\n \"tagsViewStyle\":\"${this.tagsViewStyle}\",\r\n \"tagsViewPersist\":${this.tagsViewPersist},\r\n \"fixedHeader\":${this.fixedHeader},\r\n \"sidebarLogo\":${this.sidebarLogo},\r\n \"dynamicTitle\":${this.dynamicTitle},\r\n \"footerVisible\":${this.footerVisible},\r\n \"sideTheme\":\"${this.sideTheme}\",\r\n \"theme\":\"${this.theme}\"\r\n }`\r\n )\r\n setTimeout(this.$modal.closeLoading(), 1000)\r\n },\r\n resetSetting() {\r\n this.$modal.loading(\"正在清除设置缓存并刷新，请稍候...\")\r\n this.$cache.local.remove('tags-view-visited')\r\n this.$cache.local.remove(\"layout-setting\")\r\n setTimeout(\"window.location.reload()\", 1000)\r\n }\r\n }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.setting-drawer-content {\r\n .setting-drawer-title {\r\n margin-bottom: 12px;\r\n color: rgba(0, 0, 0, .85);\r\n font-size: 14px;\r\n line-height: 22px;\r\n font-weight: bold;\r\n }\r\n\r\n .setting-drawer-block-checbox {\r\n display: flex;\r\n justify-content: flex-start;\r\n align-items: center;\r\n margin-top: 10px;\r\n margin-bottom: 20px;\r\n\r\n .setting-drawer-block-checbox-item {\r\n position: relative;\r\n margin-right: 16px;\r\n border-radius: 2px;\r\n cursor: pointer;\r\n\r\n img {\r\n width: 48px;\r\n height: 48px;\r\n }\r\n\r\n .setting-drawer-block-checbox-selectIcon {\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n width: 100%;\r\n height: 100%;\r\n padding-top: 15px;\r\n padding-left: 24px;\r\n color: #00875A;\r\n font-weight: 700;\r\n font-size: 14px;\r\n }\r\n }\r\n }\r\n}\r\n\r\n.drawer-container {\r\n padding: 20px;\r\n font-size: 14px;\r\n line-height: 1.5;\r\n word-wrap: break-word;\r\n\r\n .drawer-title {\r\n margin-bottom: 12px;\r\n color: rgba(0, 0, 0, .85);\r\n font-size: 14px;\r\n line-height: 22px;\r\n }\r\n\r\n .drawer-item {\r\n color: rgba(0, 0, 0, .65);\r\n font-size: 14px;\r\n padding: 12px 0;\r\n }\r\n\r\n .drawer-switch {\r\n float: right\r\n }\r\n}\r\n\r\n// 导航模式\r\n.nav-wrap {\r\n display: flex;\r\n justify-content: flex-start;\r\n align-items: center;\r\n margin-top: 10px;\r\n margin-bottom: 20px;\r\n\r\n .activeItem {\r\n border: 2px solid #{'var(--theme)'} !important;\r\n }\r\n\r\n .item {\r\n position: relative;\r\n margin-right: 16px;\r\n cursor: pointer;\r\n width: 56px;\r\n height: 48px;\r\n border-radius: 4px;\r\n background: #f0f2f5;\r\n border: 2px solid transparent;\r\n }\r\n\r\n .left {\r\n b:first-child {\r\n display: block;\r\n height: 30%;\r\n background: #fff;\r\n }\r\n b:last-child {\r\n width: 30%;\r\n background: #1b2a47;\r\n position: absolute;\r\n height: 100%;\r\n top: 0;\r\n border-radius: 4px 0 0 4px;\r\n }\r\n }\r\n .mix {\r\n b:first-child {\r\n border-radius: 4px 4px 0 0;\r\n display: block;\r\n height: 30%;\r\n background: #1b2a47;\r\n }\r\n b:last-child {\r\n width: 30%;\r\n background: #1b2a47;\r\n position: absolute;\r\n height: 70%;\r\n border-radius: 0 0 0 4px;\r\n }\r\n }\r\n .top {\r\n b:first-child {\r\n display: block;\r\n height: 30%;\r\n background: #1b2a47;\r\n border-radius: 4px 4px 0 0;\r\n }\r\n }\r\n}\r\n</style>\r\n"]}]} |