Merge branch 'master' into deploy
This commit is contained in:
		| @@ -12,7 +12,7 @@ import chartsRouter from './modules/charts' | ||||
| import tableRouter from './modules/table' | ||||
| import nestedRouter from './modules/nested' | ||||
|  | ||||
| /** note: Submenu only appear when children.length>=1 | ||||
| /** note: sub-menu only appear when children.length>=1 | ||||
|  *  detail see  https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html | ||||
|  **/ | ||||
|  | ||||
| @@ -25,10 +25,11 @@ import nestedRouter from './modules/nested' | ||||
| * name:'router-name'             the name is used by <keep-alive> (must set!!!) | ||||
| * meta : { | ||||
|     roles: ['admin','editor']    will control the page roles (you can set multiple roles) | ||||
|     title: 'title'               the name show in submenu and breadcrumb (recommend set) | ||||
|     title: 'title'               the name show in sub-menu and breadcrumb (recommend set) | ||||
|     icon: 'svg-name'             the icon show in the sidebar | ||||
|     noCache: true                if true, the page will no be cached(default is false) | ||||
|     breadcrumb: false            if false, the item will hidden in breadcrumb(default is true) | ||||
|     affix: true                  if true, the tag will affix in the tags-view | ||||
|   } | ||||
| **/ | ||||
| export const constantRouterMap = [ | ||||
| @@ -72,7 +73,7 @@ export const constantRouterMap = [ | ||||
|         path: 'dashboard', | ||||
|         component: () => import('@/views/dashboard/index'), | ||||
|         name: 'Dashboard', | ||||
|         meta: { title: 'dashboard', icon: 'dashboard', noCache: true } | ||||
|         meta: { title: 'dashboard', icon: 'dashboard', noCache: true, affix: true } | ||||
|       } | ||||
|     ] | ||||
|   }, | ||||
| @@ -85,7 +86,7 @@ export const constantRouterMap = [ | ||||
|         path: 'index', | ||||
|         component: () => import('@/views/documentation/index'), | ||||
|         name: 'Documentation', | ||||
|         meta: { title: 'documentation', icon: 'documentation', noCache: true } | ||||
|         meta: { title: 'documentation', icon: 'documentation', affix: true } | ||||
|       } | ||||
|     ] | ||||
|   }, | ||||
|   | ||||
| @@ -38,12 +38,9 @@ const tagsView = { | ||||
|     }, | ||||
|  | ||||
|     DEL_OTHERS_VISITED_VIEWS: (state, view) => { | ||||
|       for (const [i, v] of state.visitedViews.entries()) { | ||||
|         if (v.path === view.path) { | ||||
|           state.visitedViews = state.visitedViews.slice(i, i + 1) | ||||
|           break | ||||
|         } | ||||
|       } | ||||
|       state.visitedViews = state.visitedViews.filter(v => { | ||||
|         return v.meta.affix || v.path === view.path | ||||
|       }) | ||||
|     }, | ||||
|     DEL_OTHERS_CACHED_VIEWS: (state, view) => { | ||||
|       for (const i of state.cachedViews) { | ||||
| @@ -56,7 +53,9 @@ const tagsView = { | ||||
|     }, | ||||
|  | ||||
|     DEL_ALL_VISITED_VIEWS: state => { | ||||
|       state.visitedViews = [] | ||||
|       // keep affix tags | ||||
|       const affixTags = state.visitedViews.filter(tag => tag.meta.affix) | ||||
|       state.visitedViews = affixTags | ||||
|     }, | ||||
|     DEL_ALL_CACHED_VIEWS: state => { | ||||
|       state.cachedViews = [] | ||||
|   | ||||
| @@ -5,16 +5,16 @@ export default { | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
|     // In order to fix the click on menu on the ios device will trigger the mouseeleave bug | ||||
|     // In order to fix the click on menu on the ios device will trigger the mouseleave bug | ||||
|     // https://github.com/PanJiaChen/vue-element-admin/issues/1135 | ||||
|     this.fixBugIniOS() | ||||
|   }, | ||||
|   methods: { | ||||
|     fixBugIniOS() { | ||||
|       const $submenu = this.$refs.submenu | ||||
|       if ($submenu) { | ||||
|         const handleMouseleave = $submenu.handleMouseleave | ||||
|         $submenu.handleMouseleave = (e) => { | ||||
|       const $subMenu = this.$refs.subMenu | ||||
|       if ($subMenu) { | ||||
|         const handleMouseleave = $subMenu.handleMouseleave | ||||
|         $subMenu.handleMouseleave = (e) => { | ||||
|           if (this.device === 'mobile') { | ||||
|             return | ||||
|           } | ||||
|   | ||||
| @@ -9,7 +9,7 @@ | ||||
|       </app-link> | ||||
|     </template> | ||||
|  | ||||
|     <el-submenu v-else ref="submenu" :index="resolvePath(item.path)"> | ||||
|     <el-submenu v-else ref="subMenu" :index="resolvePath(item.path)"> | ||||
|       <template slot="title"> | ||||
|         <item v-if="item.meta" :icon="item.meta.icon" :title="generateTitle(item.meta.title)" /> | ||||
|       </template> | ||||
|   | ||||
| @@ -1,7 +1,6 @@ | ||||
| <template> | ||||
|   <el-scrollbar wrap-class="scrollbar-wrapper"> | ||||
|     <el-menu | ||||
|       :show-timeout="200" | ||||
|       :default-active="$route.path" | ||||
|       :collapse="isCollapse" | ||||
|       :background-color="variables.menuBg" | ||||
|   | ||||
| @@ -12,14 +12,15 @@ | ||||
|         @click.middle.native="closeSelectedTag(tag)" | ||||
|         @contextmenu.prevent.native="openMenu(tag,$event)"> | ||||
|         {{ generateTitle(tag.title) }} | ||||
|         <span class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)" /> | ||||
|         <span v-if="!tag.meta.affix" class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)" /> | ||||
|       </router-link> | ||||
|     </scroll-pane> | ||||
|     <ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu"> | ||||
|       <li @click="refreshSelectedTag(selectedTag)">{{ $t('tagsView.refresh') }}</li> | ||||
|       <li @click="closeSelectedTag(selectedTag)">{{ $t('tagsView.close') }}</li> | ||||
|       <li v-if="!(selectedTag.meta&&selectedTag.meta.affix)" @click="closeSelectedTag(selectedTag)">{{ | ||||
|       $t('tagsView.close') }}</li> | ||||
|       <li @click="closeOthersTags">{{ $t('tagsView.closeOthers') }}</li> | ||||
|       <li @click="closeAllTags">{{ $t('tagsView.closeAll') }}</li> | ||||
|       <li @click="closeAllTags(selectedTag)">{{ $t('tagsView.closeAll') }}</li> | ||||
|     </ul> | ||||
|   </div> | ||||
| </template> | ||||
| @@ -27,6 +28,7 @@ | ||||
| <script> | ||||
| import ScrollPane from '@/components/ScrollPane' | ||||
| import { generateTitle } from '@/utils/i18n' | ||||
| import path from 'path' | ||||
|  | ||||
| export default { | ||||
|   components: { ScrollPane }, | ||||
| @@ -35,17 +37,21 @@ export default { | ||||
|       visible: false, | ||||
|       top: 0, | ||||
|       left: 0, | ||||
|       selectedTag: {} | ||||
|       selectedTag: {}, | ||||
|       affixTags: [] | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     visitedViews() { | ||||
|       return this.$store.state.tagsView.visitedViews | ||||
|     }, | ||||
|     routers() { | ||||
|       return this.$store.state.permission.routers | ||||
|     } | ||||
|   }, | ||||
|   watch: { | ||||
|     $route() { | ||||
|       this.addViewTags() | ||||
|       this.addTags() | ||||
|       this.moveToCurrentTag() | ||||
|     }, | ||||
|     visible(value) { | ||||
| @@ -57,14 +63,44 @@ export default { | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
|     this.addViewTags() | ||||
|     this.initTags() | ||||
|     this.addTags() | ||||
|   }, | ||||
|   methods: { | ||||
|     generateTitle, // generateTitle by vue-i18n | ||||
|     isActive(route) { | ||||
|       return route.path === this.$route.path | ||||
|     }, | ||||
|     addViewTags() { | ||||
|     filterAffixTags(routes, basePath = '/') { | ||||
|       let tags = [] | ||||
|       routes.forEach(route => { | ||||
|         if (route.meta && route.meta.affix) { | ||||
|           tags.push({ | ||||
|             path: path.resolve(basePath, route.path), | ||||
|             name: route.name, | ||||
|             meta: { ...route.meta } | ||||
|           }) | ||||
|         } | ||||
|         if (route.children) { | ||||
|           const tempTags = this.filterAffixTags(route.children, route.path) | ||||
|           if (tempTags.length >= 1) { | ||||
|             tags = [...tags, ...tempTags] | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|  | ||||
|       return tags | ||||
|     }, | ||||
|     initTags() { | ||||
|       const affixTags = this.affixTags = this.filterAffixTags(this.routers) | ||||
|       for (const tag of affixTags) { | ||||
|         // Must have tag name | ||||
|         if (tag.name) { | ||||
|           this.$store.dispatch('addVisitedView', tag) | ||||
|         } | ||||
|       } | ||||
|     }, | ||||
|     addTags() { | ||||
|       const { name } = this.$route | ||||
|       if (name) { | ||||
|         this.$store.dispatch('addView', this.$route) | ||||
| @@ -101,12 +137,7 @@ export default { | ||||
|     closeSelectedTag(view) { | ||||
|       this.$store.dispatch('delView', view).then(({ visitedViews }) => { | ||||
|         if (this.isActive(view)) { | ||||
|           const latestView = visitedViews.slice(-1)[0] | ||||
|           if (latestView) { | ||||
|             this.$router.push(latestView) | ||||
|           } else { | ||||
|             this.$router.push('/') | ||||
|           } | ||||
|           this.toLastView(visitedViews) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
| @@ -116,9 +147,22 @@ export default { | ||||
|         this.moveToCurrentTag() | ||||
|       }) | ||||
|     }, | ||||
|     closeAllTags() { | ||||
|       this.$store.dispatch('delAllViews') | ||||
|       this.$router.push('/') | ||||
|     closeAllTags(view) { | ||||
|       this.$store.dispatch('delAllViews').then(({ visitedViews }) => { | ||||
|         if (this.affixTags.some(tag => tag.path === view.path)) { | ||||
|           return | ||||
|         } | ||||
|         this.toLastView(visitedViews) | ||||
|       }) | ||||
|     }, | ||||
|     toLastView(visitedViews) { | ||||
|       const latestView = visitedViews.slice(-1)[0] | ||||
|       if (latestView) { | ||||
|         this.$router.push(latestView) | ||||
|       } else { | ||||
|         // You can set another route | ||||
|         this.$router.push('/') | ||||
|       } | ||||
|     }, | ||||
|     openMenu(tag, e) { | ||||
|       const menuMinWidth = 105 | ||||
|   | ||||
		Reference in New Issue
	
	Block a user