From 01a7e6de9cfd1b745e279f5f54daf1f5d3a752e1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AD=A3=E5=9C=A3=E5=8D=8E?= <752718920@qq.com> Date: Thu, 16 Sep 2021 23:18:08 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=8F=9C=E5=8D=95=E5=B1=95?= =?UTF-8?q?=E7=A4=BA=E6=A8=A1=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/setting/SettingDrawer.vue | 64 +---- jshERP-web/src/defaultSettings.js | 62 ++--- jshERP-web/src/store/modules/app.js | 250 +++++++++--------- 3 files changed, 160 insertions(+), 216 deletions(-) diff --git a/jshERP-web/src/components/setting/SettingDrawer.vue b/jshERP-web/src/components/setting/SettingDrawer.vue index b34dcfe7..d840e60b 100644 --- a/jshERP-web/src/components/setting/SettingDrawer.vue +++ b/jshERP-web/src/components/setting/SettingDrawer.vue @@ -58,49 +58,8 @@
- - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - @@ -114,7 +73,7 @@ - +
固定侧边菜单
 @@ -143,19 +102,8 @@
- - - - - - - - -
- -
@@ -179,8 +127,7 @@ data() { return { visible: true, - colorList, - dataFixSiderbar: false + colorList } }, watch: { @@ -225,7 +172,7 @@ handleLayout (mode) { this.$store.dispatch('ToggleLayoutMode', mode) // 因为顶部菜单不能固定左侧菜单栏，所以强制关闭 - this.handleFixSiderbar(false) + this.handleFixSiderbar(this.fixSiderbar) // 触发窗口resize事件 triggerWindowResizeEvent() }, @@ -245,10 +192,7 @@ this.$store.dispatch('ToggleFixedHeaderHidden', autoHidden) }, handleFixSiderbar (fixed) { - if (this.layoutMode === 'topmenu') { - fixed = false - } - this.dataFixSiderbar = fixed + this.fixSiderbar = fixed this.$store.dispatch('ToggleFixSiderbar', fixed) } }, diff --git a/jshERP-web/src/defaultSettings.js b/jshERP-web/src/defaultSettings.js index 832264fe..46a177f2 100644 --- a/jshERP-web/src/defaultSettings.js +++ b/jshERP-web/src/defaultSettings.js @@ -1,32 +1,32 @@ -/** - * 项目默认配置项 - * primaryColor - 默认主题色 - * navTheme - sidebar theme ['dark', 'light'] 两种主题 - * colorWeak - 色盲模式 - * layout - 整体布局方式 ['sidemenu', 'topmenu'] 两种布局 - * fixedHeader - 固定 Header : boolean - * fixSiderbar - 固定左侧菜单栏 ： boolean - * autoHideHeader - 向下滚动时，隐藏 Header : boolean - * contentWidth - 内容区布局： 流式 | 固定 - * - * storageOptions: {} - Vue-ls 插件配置项 (localStorage/sessionStorage) - * - */ - -export default { - primaryColor: '#1890FF', // primary color of ant design - navTheme: 'light', // theme for nav menu - layout: 'sidemenu', // nav menu position: sidemenu or topmenu - contentWidth: 'Fixed', // layout of content: Fluid or Fixed, only works when layout is topmenu - fixedHeader: false, // sticky header - fixSiderbar: false, // sticky siderbar - autoHideHeader: false, // auto hide header - colorWeak: false, - multipage: true, //默认多页签模式 - // vue-ls options - storageOptions: { - namespace: 'pro__', // key prefix - name: 'ls', // name variable Vue.[ls] or this.[$ls], - storage: 'local', // storage name session, local, memory - } +/** + * 项目默认配置项 + * primaryColor - 默认主题色 + * navTheme - sidebar theme ['dark', 'light'] 两种主题 + * colorWeak - 色盲模式 + * layout - 整体布局方式 ['sidemenu', 'topmenu'] 两种布局 + * fixedHeader - 固定 Header : boolean + * fixSiderbar - 固定左侧菜单栏 ： boolean + * autoHideHeader - 向下滚动时，隐藏 Header : boolean + * contentWidth - 内容区布局： 流式 | 固定 + * + * storageOptions: {} - Vue-ls 插件配置项 (localStorage/sessionStorage) + * + */ + +export default { + primaryColor: '#1890FF', // primary color of ant design + navTheme: 'light', // theme for nav menu + layout: 'sidemenu', // nav menu position: sidemenu or topmenu + contentWidth: 'Fixed', // layout of content: Fluid or Fixed, only works when layout is topmenu + fixedHeader: false, // sticky header + fixSiderbar: true, // sticky siderbar + autoHideHeader: false, // auto hide header + colorWeak: false, + multipage: true, //默认多页签模式 + // vue-ls options + storageOptions: { + namespace: 'pro__', // key prefix + name: 'ls', // name variable Vue.[ls] or this.[$ls], + storage: 'local', // storage name session, local, memory + } } \ No newline at end of file diff --git a/jshERP-web/src/store/modules/app.js b/jshERP-web/src/store/modules/app.js index e7912e68..b7b23b90 100644 --- a/jshERP-web/src/store/modules/app.js +++ b/jshERP-web/src/store/modules/app.js @@ -1,126 +1,126 @@ -import Vue from 'vue' -import { - SIDEBAR_TYPE, - DEFAULT_THEME, - DEFAULT_LAYOUT_MODE, - DEFAULT_COLOR, - DEFAULT_COLOR_WEAK, - DEFAULT_FIXED_HEADER, - DEFAULT_FIXED_SIDEMENU, - DEFAULT_FIXED_HEADER_HIDDEN, - DEFAULT_CONTENT_WIDTH_TYPE, - DEFAULT_MULTI_PAGE -} from "@/store/mutation-types" - -const app = { - state: { - sidebar: { - opened: true, - withoutAnimation: false - }, - device: 'desktop', - theme: '', - layout: '', - contentWidth: '', - fixedHeader: false, - fixSiderbar: false, - autoHideHeader: false, - color: null, - weak: false, - multipage: true //默认多页签模式 - }, - mutations: { - SET_SIDEBAR_TYPE: (state, type) => { - state.sidebar.opened = type - Vue.ls.set(SIDEBAR_TYPE, type) - }, - CLOSE_SIDEBAR: (state, withoutAnimation) => { - Vue.ls.set(SIDEBAR_TYPE, true) - state.sidebar.opened = false - state.sidebar.withoutAnimation = withoutAnimation - }, - TOGGLE_DEVICE: (state, device) => { - state.device = device - }, - TOGGLE_THEME: (state, theme) => { - // setStore('_DEFAULT_THEME', theme) - Vue.ls.set(DEFAULT_THEME, theme) - state.theme = theme - }, - TOGGLE_LAYOUT_MODE: (state, layout) => { - Vue.ls.set(DEFAULT_LAYOUT_MODE, layout) - state.layout = layout - }, - TOGGLE_FIXED_HEADER: (state, fixed) => { - Vue.ls.set(DEFAULT_FIXED_HEADER, fixed) - state.fixedHeader = fixed - }, - TOGGLE_FIXED_SIDERBAR: (state, fixed) => { - Vue.ls.set(DEFAULT_FIXED_SIDEMENU, fixed) - state.fixSiderbar = fixed - }, - TOGGLE_FIXED_HEADER_HIDDEN: (state, show) => { - Vue.ls.set(DEFAULT_FIXED_HEADER_HIDDEN, show) - state.autoHideHeader = show - }, - TOGGLE_CONTENT_WIDTH: (state, type) => { - Vue.ls.set(DEFAULT_CONTENT_WIDTH_TYPE, type) - state.contentWidth = type - }, - TOGGLE_COLOR: (state, color) => { - Vue.ls.set(DEFAULT_COLOR, color) - state.color = color - }, - TOGGLE_WEAK: (state, flag) => { - Vue.ls.set(DEFAULT_COLOR_WEAK, flag) - state.weak = flag - }, - SET_MULTI_PAGE (state, multipageFlag) { - Vue.ls.set(DEFAULT_MULTI_PAGE, multipageFlag) - state.multipage = multipageFlag - } - }, - actions: { - setSidebar: ({ commit }, type) => { - commit('SET_SIDEBAR_TYPE', type) - }, - CloseSidebar({ commit }, { withoutAnimation }) { - commit('CLOSE_SIDEBAR', withoutAnimation) - }, - ToggleDevice({ commit }, device) { - commit('TOGGLE_DEVICE', device) - }, - ToggleTheme({ commit }, theme) { - commit('TOGGLE_THEME', theme) - }, - ToggleLayoutMode({ commit }, mode) { - commit('TOGGLE_LAYOUT_MODE', mode) - }, - ToggleFixedHeader({ commit }, fixedHeader) { - if (!fixedHeader) { - commit('TOGGLE_FIXED_HEADER_HIDDEN', false) - } - commit('TOGGLE_FIXED_HEADER', fixedHeader) - }, - ToggleFixSiderbar({ commit }, fixSiderbar) { - commit( 'TOGGLE_FIXED_SIDERBAR', fixSiderbar) - }, - ToggleFixedHeaderHidden({ commit }, show) { - commit('TOGGLE_FIXED_HEADER_HIDDEN', show) - }, - ToggleContentWidth({ commit }, type) { - commit('TOGGLE_CONTENT_WIDTH', type) - }, - ToggleColor({ commit }, color) { - commit('TOGGLE_COLOR', color) - }, - ToggleWeak({ commit }, weakFlag) { - commit('TOGGLE_WEAK', weakFlag) - }, - ToggleMultipage({ commit }, multipageFlag) { - commit('SET_MULTI_PAGE', multipageFlag) - } - } -} - +import Vue from 'vue' +import { + SIDEBAR_TYPE, + DEFAULT_THEME, + DEFAULT_LAYOUT_MODE, + DEFAULT_COLOR, + DEFAULT_COLOR_WEAK, + DEFAULT_FIXED_HEADER, + DEFAULT_FIXED_SIDEMENU, + DEFAULT_FIXED_HEADER_HIDDEN, + DEFAULT_CONTENT_WIDTH_TYPE, + DEFAULT_MULTI_PAGE +} from "@/store/mutation-types" + +const app = { + state: { + sidebar: { + opened: true, + withoutAnimation: false + }, + device: 'desktop', + theme: '', + layout: '', + contentWidth: '', + fixedHeader: false, + fixSiderbar: true, + autoHideHeader: false, + color: null, + weak: false, + multipage: true //默认多页签模式 + }, + mutations: { + SET_SIDEBAR_TYPE: (state, type) => { + state.sidebar.opened = type + Vue.ls.set(SIDEBAR_TYPE, type) + }, + CLOSE_SIDEBAR: (state, withoutAnimation) => { + Vue.ls.set(SIDEBAR_TYPE, true) + state.sidebar.opened = false + state.sidebar.withoutAnimation = withoutAnimation + }, + TOGGLE_DEVICE: (state, device) => { + state.device = device + }, + TOGGLE_THEME: (state, theme) => { + // setStore('_DEFAULT_THEME', theme) + Vue.ls.set(DEFAULT_THEME, theme) + state.theme = theme + }, + TOGGLE_LAYOUT_MODE: (state, layout) => { + Vue.ls.set(DEFAULT_LAYOUT_MODE, layout) + state.layout = layout + }, + TOGGLE_FIXED_HEADER: (state, fixed) => { + Vue.ls.set(DEFAULT_FIXED_HEADER, fixed) + state.fixedHeader = fixed + }, + TOGGLE_FIXED_SIDERBAR: (state, fixed) => { + Vue.ls.set(DEFAULT_FIXED_SIDEMENU, fixed) + state.fixSiderbar = fixed + }, + TOGGLE_FIXED_HEADER_HIDDEN: (state, show) => { + Vue.ls.set(DEFAULT_FIXED_HEADER_HIDDEN, show) + state.autoHideHeader = show + }, + TOGGLE_CONTENT_WIDTH: (state, type) => { + Vue.ls.set(DEFAULT_CONTENT_WIDTH_TYPE, type) + state.contentWidth = type + }, + TOGGLE_COLOR: (state, color) => { + Vue.ls.set(DEFAULT_COLOR, color) + state.color = color + }, + TOGGLE_WEAK: (state, flag) => { + Vue.ls.set(DEFAULT_COLOR_WEAK, flag) + state.weak = flag + }, + SET_MULTI_PAGE (state, multipageFlag) { + Vue.ls.set(DEFAULT_MULTI_PAGE, multipageFlag) + state.multipage = multipageFlag + } + }, + actions: { + setSidebar: ({ commit }, type) => { + commit('SET_SIDEBAR_TYPE', type) + }, + CloseSidebar({ commit }, { withoutAnimation }) { + commit('CLOSE_SIDEBAR', withoutAnimation) + }, + ToggleDevice({ commit }, device) { + commit('TOGGLE_DEVICE', device) + }, + ToggleTheme({ commit }, theme) { + commit('TOGGLE_THEME', theme) + }, + ToggleLayoutMode({ commit }, mode) { + commit('TOGGLE_LAYOUT_MODE', mode) + }, + ToggleFixedHeader({ commit }, fixedHeader) { + if (!fixedHeader) { + commit('TOGGLE_FIXED_HEADER_HIDDEN', false) + } + commit('TOGGLE_FIXED_HEADER', fixedHeader) + }, + ToggleFixSiderbar({ commit }, fixSiderbar) { + commit( 'TOGGLE_FIXED_SIDERBAR', fixSiderbar) + }, + ToggleFixedHeaderHidden({ commit }, show) { + commit('TOGGLE_FIXED_HEADER_HIDDEN', show) + }, + ToggleContentWidth({ commit }, type) { + commit('TOGGLE_CONTENT_WIDTH', type) + }, + ToggleColor({ commit }, color) { + commit('TOGGLE_COLOR', color) + }, + ToggleWeak({ commit }, weakFlag) { + commit('TOGGLE_WEAK', weakFlag) + }, + ToggleMultipage({ commit }, multipageFlag) { + commit('SET_MULTI_PAGE', multipageFlag) + } + } +} + export default app \ No newline at end of file