From ab4b75fe30f9a3cf08e3ced667c3ec8c711ca939 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子li <15040126243@163.com> Date: 星期一, 06 九月 2021 09:59:28 +0800 Subject: [PATCH] Merge branch 'master' of https://gitee.com/y_project/RuoYi-Vue into dev --- ruoyi-ui/src/components/ThemePicker/index.vue | 18 +++- ruoyi-ui/src/layout/components/Sidebar/index.vue | 6 ruoyi-ui/src/views/tool/gen/index.vue | 2 ruoyi-ui/src/assets/styles/sidebar.scss | 20 ++-- ruoyi-ui/src/views/system/menu/index.vue | 23 +++++ ruoyi-ui/src/views/system/dept/index.vue | 26 ++++++ ruoyi-ui/src/assets/styles/ruoyi.scss | 4 ruoyi-ui/src/views/monitor/job/index.vue | 4 ruoyi-ui/src/store/modules/settings.js | 3 ruoyi-ui/src/assets/styles/variables.scss | 60 ++++++++------ ruoyi-ui/src/layout/index.vue | 4 ruoyi-ui/src/layout/components/Sidebar/Logo.vue | 6 ruoyi-ui/src/layout/components/TagsView/index.vue | 25 +++++- ruoyi-ui/src/store/modules/tagsView.js | 28 ++++++ 14 files changed, 167 insertions(+), 62 deletions(-) diff --git a/ruoyi-ui/src/assets/styles/ruoyi.scss b/ruoyi-ui/src/assets/styles/ruoyi.scss index bb12cb7..8fe1961 100644 --- a/ruoyi-ui/src/assets/styles/ruoyi.scss +++ b/ruoyi-ui/src/assets/styles/ruoyi.scss @@ -64,7 +64,7 @@ margin-top: 6vh !important; } -.el-dialog .el-dialog__body { +.el-dialog__wrapper.scrollbar .el-dialog .el-dialog__body { overflow: auto; overflow-x: hidden; max-height: 70vh; @@ -137,7 +137,7 @@ /** 琛ㄦ牸鏇村鎿嶄綔涓嬫媺鏍峰紡 */ .el-table .el-dropdown-link { cursor: pointer; - color: #1890ff; + color: #409EFF; margin-left: 5px; } diff --git a/ruoyi-ui/src/assets/styles/sidebar.scss b/ruoyi-ui/src/assets/styles/sidebar.scss index 2f368c3..d2a7453 100644 --- a/ruoyi-ui/src/assets/styles/sidebar.scss +++ b/ruoyi-ui/src/assets/styles/sidebar.scss @@ -3,15 +3,15 @@ .main-container { min-height: 100%; transition: margin-left .28s; - margin-left: $sideBarWidth; + margin-left: $base-sidebar-width; position: relative; } .sidebar-container { -webkit-transition: width .28s; transition: width 0.28s; - width: $sideBarWidth !important; - background-color: $menuBg; + width: $base-sidebar-width !important; + background-color: $base-menu-background; height: 100%; position: fixed; font-size: 0px; @@ -81,12 +81,12 @@ } & .theme-dark .is-active > .el-submenu__title { - color: $subMenuActiveText !important; + color: $base-menu-color-active !important; } & .nest-menu .el-submenu>.el-submenu__title, & .el-submenu .el-menu-item { - min-width: $sideBarWidth !important; + min-width: $base-sidebar-width !important; &:hover { background-color: rgba(0, 0, 0, 0.06) !important; @@ -95,10 +95,10 @@ & .theme-dark .nest-menu .el-submenu>.el-submenu__title, & .theme-dark .el-submenu .el-menu-item { - background-color: $subMenuBg !important; + background-color: $base-sub-menu-background !important; &:hover { - background-color: $subMenuHover !important; + background-color: $base-sub-menu-hover !important; } } } @@ -154,7 +154,7 @@ } .el-menu--collapse .el-menu .el-submenu { - min-width: $sideBarWidth !important; + min-width: $base-sidebar-width !important; } // mobile responsive @@ -165,14 +165,14 @@ .sidebar-container { transition: transform .28s; - width: $sideBarWidth !important; + width: $base-sidebar-width !important; } &.hideSidebar { .sidebar-container { pointer-events: none; transition-duration: 0.3s; - transform: translate3d(-$sideBarWidth, 0, 0); + transform: translate3d(-$base-sidebar-width, 0, 0); } } } diff --git a/ruoyi-ui/src/assets/styles/variables.scss b/ruoyi-ui/src/assets/styles/variables.scss index 452a1ec..34484d4 100644 --- a/ruoyi-ui/src/assets/styles/variables.scss +++ b/ruoyi-ui/src/assets/styles/variables.scss @@ -8,37 +8,47 @@ $yellow:#FEC171; $panGreen: #30B08F; -// sidebar -$menuText:#bfcbd9; -$menuActiveText:#409EFF; -$subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951 +// 榛樿鑿滃崟涓婚椋庢牸 +$base-menu-color:#bfcbd9; +$base-menu-color-active:#f4f4f5; +$base-menu-background:#304156; +$base-logo-title-color: #ffffff; -$menuBg:#304156; -$menuHover:#263445; -$sidebarTitle: #ffffff; +$base-menu-light-color:rgba(0,0,0,.70); +$base-menu-light-background:#ffffff; +$base-logo-light-title-color: #001529; -$menuLightBg:#ffffff; -$menuLightHover:#f0f1f5; -$sidebarLightTitle: #001529; +$base-sub-menu-background:#1f2d3d; +$base-sub-menu-hover:#001528; -$subMenuBg:#1f2d3d; -$subMenuHover:#001528; +// 鑷畾涔夋殫鑹茶彍鍗曢鏍� +/** +$base-menu-color:hsla(0,0%,100%,.65); +$base-menu-color-active:#fff; +$base-menu-background:#001529; +$base-logo-title-color: #ffffff; -$sideBarWidth: 200px; +$base-menu-light-color:rgba(0,0,0,.70); +$base-menu-light-background:#ffffff; +$base-logo-light-title-color: #001529; + +$base-sub-menu-background:#000c17; +$base-sub-menu-hover:#001528; +*/ + +$base-sidebar-width: 200px; // the :export directive is the magic sauce for webpack // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass :export { - menuText: $menuText; - menuActiveText: $menuActiveText; - subMenuActiveText: $subMenuActiveText; - menuBg: $menuBg; - menuHover: $menuHover; - menuLightBg: $menuLightBg; - menuLightHover: $menuLightHover; - subMenuBg: $subMenuBg; - subMenuHover: $subMenuHover; - sideBarWidth: $sideBarWidth; - sidebarTitle: $sidebarTitle; - sidebarLightTitle: $sidebarLightTitle + menuColor: $base-menu-color; + menuLightColor: $base-menu-light-color; + menuColorActive: $base-menu-color-active; + menuBackground: $base-menu-background; + menuLightBackground: $base-menu-light-background; + subMenuBackground: $base-sub-menu-background; + subMenuHover: $base-sub-menu-hover; + sideBarWidth: $base-sidebar-width; + logoTitleColor: $base-logo-title-color; + logoLightTitleColor: $base-logo-light-title-color } diff --git a/ruoyi-ui/src/components/ThemePicker/index.vue b/ruoyi-ui/src/components/ThemePicker/index.vue index b0df471..5589f5f 100644 --- a/ruoyi-ui/src/components/ThemePicker/index.vue +++ b/ruoyi-ui/src/components/ThemePicker/index.vue @@ -31,13 +31,24 @@ immediate: true }, async theme(val) { + await this.setTheme(val) + } + }, + created() { + if(this.defaultTheme !== ORIGINAL_THEME) { + this.setTheme(this.defaultTheme) + } + }, + + methods: { + async setTheme(val) { const oldVal = this.chalk ? this.theme : ORIGINAL_THEME if (typeof val !== 'string') return const themeCluster = this.getThemeCluster(val.replace('#', '')) const originalCluster = this.getThemeCluster(oldVal.replace('#', '')) const $message = this.$message({ - message: ' Compiling the theme', + message: ' 姝e湪鍒囨崲涓婚锛岃绋嶅悗...', customClass: 'theme-message', type: 'success', duration: 0, @@ -82,10 +93,9 @@ this.$emit('change', val) $message.close() - } - }, - methods: { + }, + updateStyle(style, oldCluster, newCluster) { let newStyle = style oldCluster.forEach((color, index) => { diff --git a/ruoyi-ui/src/layout/components/Sidebar/Logo.vue b/ruoyi-ui/src/layout/components/Sidebar/Logo.vue index 0de00ce..4169687 100644 --- a/ruoyi-ui/src/layout/components/Sidebar/Logo.vue +++ b/ruoyi-ui/src/layout/components/Sidebar/Logo.vue @@ -1,13 +1,13 @@ <template> - <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }"> + <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"> <transition name="sidebarLogoFade"> <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/"> <img v-if="logo" :src="logo" class="sidebar-logo" /> - <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.sidebarTitle : variables.sidebarLightTitle }">{{ title }} </h1> + <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1> </router-link> <router-link v-else key="expand" class="sidebar-logo-link" to="/"> <img v-if="logo" :src="logo" class="sidebar-logo" /> - <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.sidebarTitle : variables.sidebarLightTitle }">{{ title }} </h1> + <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1> </router-link> </transition> </div> diff --git a/ruoyi-ui/src/layout/components/Sidebar/index.vue b/ruoyi-ui/src/layout/components/Sidebar/index.vue index 9e5d2bb..51d0839 100644 --- a/ruoyi-ui/src/layout/components/Sidebar/index.vue +++ b/ruoyi-ui/src/layout/components/Sidebar/index.vue @@ -1,12 +1,12 @@ <template> - <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }"> + <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"> <logo v-if="showLogo" :collapse="isCollapse" /> <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper"> <el-menu :default-active="activeMenu" :collapse="isCollapse" - :background-color="settings.sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg" - :text-color="settings.sideTheme === 'theme-dark' ? variables.menuText : 'rgba(0,0,0,.65)'" + :background-color="settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground" + :text-color="settings.sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor" :unique-opened="true" :active-text-color="settings.theme" :collapse-transition="false" diff --git a/ruoyi-ui/src/layout/components/TagsView/index.vue b/ruoyi-ui/src/layout/components/TagsView/index.vue index 6caf350..99bb289 100644 --- a/ruoyi-ui/src/layout/components/TagsView/index.vue +++ b/ruoyi-ui/src/layout/components/TagsView/index.vue @@ -18,11 +18,12 @@ </router-link> </scroll-pane> <ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu"> - <li @click="refreshSelectedTag(selectedTag)">鍒锋柊椤甸潰</li> - <li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">鍏抽棴褰撳墠</li> - <li @click="closeOthersTags">鍏抽棴鍏朵粬</li> - <li v-if="!isLastView()" @click="closeRightTags">鍏抽棴鍙充晶</li> - <li @click="closeAllTags(selectedTag)">鍏抽棴鎵�鏈�</li> + <li @click="refreshSelectedTag(selectedTag)"><i class="el-icon-refresh-right"></i> 鍒锋柊椤甸潰</li> + <li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)"><i class="el-icon-close"></i> 鍏抽棴褰撳墠</li> + <li @click="closeOthersTags"><i class="el-icon-circle-close"></i> 鍏抽棴鍏朵粬</li> + <li v-if="!isFirstView()" @click="closeLeftTags"><i class="el-icon-back"></i> 鍏抽棴宸︿晶</li> + <li v-if="!isLastView()" @click="closeRightTags"><i class="el-icon-right"></i> 鍏抽棴鍙充晶</li> + <li @click="closeAllTags(selectedTag)"><i class="el-icon-circle-close"></i> 鍏ㄩ儴鍏抽棴</li> </ul> </div> </template> @@ -83,6 +84,13 @@ }, isAffix(tag) { return tag.meta && tag.meta.affix + }, + isFirstView() { + try { + return this.selectedTag.fullPath === this.visitedViews[1].fullPath || this.selectedTag.fullPath === '/index' + } catch (err) { + return false + } }, isLastView() { try { @@ -167,6 +175,13 @@ } }) }, + closeLeftTags() { + this.$store.dispatch('tagsView/delLeftTags', this.selectedTag).then(visitedViews => { + if (!visitedViews.find(i => i.fullPath === this.$route.fullPath)) { + this.toLastView(visitedViews) + } + }) + }, closeOthersTags() { this.$router.push(this.selectedTag).catch(()=>{}); this.$store.dispatch('tagsView/delOthersViews', this.selectedTag).then(() => { diff --git a/ruoyi-ui/src/layout/index.vue b/ruoyi-ui/src/layout/index.vue index 2db1a9b..214d86f 100644 --- a/ruoyi-ui/src/layout/index.vue +++ b/ruoyi-ui/src/layout/index.vue @@ -1,7 +1,7 @@ <template> <div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}"> <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/> - <sidebar class="sidebar-container" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }" /> + <sidebar class="sidebar-container"/> <div :class="{hasTagsView:needTagsView}" class="main-container"> <div :class="{'fixed-header':fixedHeader}"> <navbar /> @@ -93,7 +93,7 @@ top: 0; right: 0; z-index: 9; - width: calc(100% - #{$sideBarWidth}); + width: calc(100% - #{$base-sidebar-width}); transition: width 0.28s; } diff --git a/ruoyi-ui/src/store/modules/settings.js b/ruoyi-ui/src/store/modules/settings.js index 647a8ce..5f36d8e 100644 --- a/ruoyi-ui/src/store/modules/settings.js +++ b/ruoyi-ui/src/store/modules/settings.js @@ -1,4 +1,3 @@ -import variables from '@/assets/styles/element-variables.scss' import defaultSettings from '@/settings' const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings @@ -6,7 +5,7 @@ const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || '' const state = { title: '', - theme: storageSetting.theme || variables.theme, + theme: storageSetting.theme || '#409EFF', sideTheme: storageSetting.sideTheme || sideTheme, showSettings: showSettings, topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav, diff --git a/ruoyi-ui/src/store/modules/tagsView.js b/ruoyi-ui/src/store/modules/tagsView.js index 68bb81d..ef2fe4c 100644 --- a/ruoyi-ui/src/store/modules/tagsView.js +++ b/ruoyi-ui/src/store/modules/tagsView.js @@ -63,7 +63,7 @@ } } }, - + DEL_RIGHT_VIEWS: (state, view) => { const index = state.visitedViews.findIndex(v => v.path === view.path) if (index === -1) { @@ -71,6 +71,23 @@ } state.visitedViews = state.visitedViews.filter((item, idx) => { if (idx <= index || (item.meta && item.meta.affix)) { + return true + } + const i = state.cachedViews.indexOf(item.name) + if (i > -1) { + state.cachedViews.splice(i, 1) + } + return false + }) + }, + + DEL_LEFT_VIEWS: (state, view) => { + const index = state.visitedViews.findIndex(v => v.path === view.path) + if (index === -1) { + return + } + state.visitedViews = state.visitedViews.filter((item, idx) => { + if (idx >= index || (item.meta && item.meta.affix)) { return true } const i = state.cachedViews.indexOf(item.name) @@ -172,7 +189,14 @@ commit('DEL_RIGHT_VIEWS', view) resolve([...state.visitedViews]) }) - } + }, + + delLeftTags({ commit }, view) { + return new Promise(resolve => { + commit('DEL_LEFT_VIEWS', view) + resolve([...state.visitedViews]) + }) + }, } export default { diff --git a/ruoyi-ui/src/views/monitor/job/index.vue b/ruoyi-ui/src/views/monitor/job/index.vue index 03425f7..73bb375 100644 --- a/ruoyi-ui/src/views/monitor/job/index.vue +++ b/ruoyi-ui/src/views/monitor/job/index.vue @@ -95,7 +95,7 @@ <el-table v-loading="loading" :data="jobList" @selection-change="handleSelectionChange"> <el-table-column type="selection" width="55" align="center" /> - <el-table-column label="浠诲姟缂栧彿" align="center" prop="jobId" /> + <el-table-column label="浠诲姟缂栧彿" width="100" align="center" prop="jobId" /> <el-table-column label="浠诲姟鍚嶇О" align="center" prop="jobName" :show-overflow-tooltip="true" /> <el-table-column label="浠诲姟缁勫悕" align="center" prop="jobGroup"> <template slot-scope="scope"> @@ -240,7 +240,7 @@ </div> </el-dialog> - <el-dialog title="Cron琛ㄨ揪寮忕敓鎴愬櫒" :visible.sync="openCron"> + <el-dialog title="Cron琛ㄨ揪寮忕敓鎴愬櫒" :visible.sync="openCron" append-to-body class="scrollbar"> <crontab @hide="openCron=false" @fill="crontabFill" :expression="expression"></crontab> </el-dialog> diff --git a/ruoyi-ui/src/views/system/dept/index.vue b/ruoyi-ui/src/views/system/dept/index.vue index edb8d7c..037c998 100644 --- a/ruoyi-ui/src/views/system/dept/index.vue +++ b/ruoyi-ui/src/views/system/dept/index.vue @@ -37,14 +37,24 @@ v-hasPermi="['system:dept:add']" >鏂板</el-button> </el-col> + <el-col :span="1.5"> + <el-button + type="info" + plain + icon="el-icon-sort" + size="mini" + @click="toggleExpandAll" + >灞曞紑/鎶樺彔</el-button> + </el-col> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> </el-row> <el-table + v-if="refreshTable" v-loading="loading" :data="deptList" row-key="deptId" - default-expand-all + :default-expand-all="isExpandAll" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" > <el-table-column prop="deptName" label="閮ㄩ棬鍚嶇О" width="260"></el-table-column> @@ -164,6 +174,12 @@ title: "", // 鏄惁鏄剧ず寮瑰嚭灞� open: false, + // 鏄惁灞曞紑锛岄粯璁ゅ叏閮ㄥ睍寮� + isExpandAll: true, + // 閲嶆柊娓叉煋琛ㄦ牸鐘舵�� + refreshTable: true, + // 鏄惁灞曞紑 + expand: false, // 鐘舵�佹暟鎹瓧鍏� statusOptions: [], // 鏌ヨ鍙傛暟 @@ -267,6 +283,14 @@ this.deptOptions = this.handleTree(response.data, "deptId"); }); }, + /** 灞曞紑/鎶樺彔鎿嶄綔 */ + toggleExpandAll() { + this.refreshTable = false; + this.isExpandAll = !this.isExpandAll; + this.$nextTick(() => { + this.refreshTable = true; + }); + }, /** 淇敼鎸夐挳鎿嶄綔 */ handleUpdate(row) { this.reset(); diff --git a/ruoyi-ui/src/views/system/menu/index.vue b/ruoyi-ui/src/views/system/menu/index.vue index e59d1a6..f3aa64a 100644 --- a/ruoyi-ui/src/views/system/menu/index.vue +++ b/ruoyi-ui/src/views/system/menu/index.vue @@ -37,13 +37,24 @@ v-hasPermi="['system:menu:add']" >鏂板</el-button> </el-col> + <el-col :span="1.5"> + <el-button + type="info" + plain + icon="el-icon-sort" + size="mini" + @click="toggleExpandAll" + >灞曞紑/鎶樺彔</el-button> + </el-col> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> </el-row> <el-table + v-if="refreshTable" v-loading="loading" :data="menuList" row-key="menuId" + :default-expand-all="isExpandAll" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" > <el-table-column prop="menuName" label="鑿滃崟鍚嶇О" :show-overflow-tooltip="true" width="160"></el-table-column> @@ -275,6 +286,10 @@ title: "", // 鏄惁鏄剧ず寮瑰嚭灞� open: false, + // 鏄惁灞曞紑锛岄粯璁ゅ叏閮ㄦ姌鍙� + isExpandAll: false, + // 閲嶆柊娓叉煋琛ㄦ牸鐘舵�� + refreshTable: true, // 鏄剧ず鐘舵�佹暟鎹瓧鍏� visibleOptions: [], // 鑿滃崟鐘舵�佹暟鎹瓧鍏� @@ -384,6 +399,14 @@ this.open = true; this.title = "娣诲姞鑿滃崟"; }, + /** 灞曞紑/鎶樺彔鎿嶄綔 */ + toggleExpandAll() { + this.refreshTable = false; + this.isExpandAll = !this.isExpandAll; + this.$nextTick(() => { + this.refreshTable = true; + }); + }, /** 淇敼鎸夐挳鎿嶄綔 */ handleUpdate(row) { this.reset(); diff --git a/ruoyi-ui/src/views/tool/gen/index.vue b/ruoyi-ui/src/views/tool/gen/index.vue index b1cd1a0..1548704 100644 --- a/ruoyi-ui/src/views/tool/gen/index.vue +++ b/ruoyi-ui/src/views/tool/gen/index.vue @@ -161,7 +161,7 @@ @pagination="getList" /> <!-- 棰勮鐣岄潰 --> - <el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body> + <el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body class="scrollbar"> <el-tabs v-model="preview.activeName"> <el-tab-pane v-for="(value, key) in preview.data" -- Gitblit v1.9.3