| | |
| | | <!-- update-end- author:sunjianlei --- date:20191009 --- for: æåå³é®èåçå±çº§ --> |
| | | <a-tabs |
| | | @contextmenu.native="e => onContextmenu(e)" |
| | | v-if="multipage" |
| | | v-if="$route.meta.title!=='é¦é¡µ'&&multipage" |
| | | :active-key="activePage" |
| | | class="tab-layout-tabs" |
| | | style="height:52px" |
| | |
| | | @change="changePage" |
| | | @tabClick="tabCallBack" |
| | | @edit="editPage"> |
| | | <a-tab-pane :id="page.fullPath" :key="page.fullPath" v-for="page in pageList" :closable="!(page.meta.title=='é¦é¡µ')"> |
| | | <span slot="tab" :pagekey="page.fullPath">{{ page.meta.title }}</span> |
| | | <a-tab-pane :id="page.path" :key="page.path" v-for="page in pageList" |
| | | :closable="!(page.meta.title=='é¦é¡µ')"> |
| | | <span slot="tab" :pagekey="page.path">{{ page.meta.title }}</span> |
| | | </a-tab-pane> |
| | | </a-tabs> |
| | | <div style="margin: 12px 12px 0;"> |
| | | <div :style="{padding: $route.meta.title=='é¦é¡µ'?'0':'12px 12px 0'}"> |
| | | <!-- update-begin-author:taoyan date:20201221 for:æ¤å¤å ætransitionæ ç¾ ä¸ç¥é为ä»ä¹å ä¸å 页é¢è·¯ç±åæ¢çæ¶åå³1åèååå°2åèåçæ¶å 两个èå页é¢ä¼åæ¶åºç°300-500ç§å·¦å³ --> |
| | | <keep-alive v-if="multipage"> |
| | | <router-view v-if="reloadFlag"/> |
| | |
| | | </template> |
| | | <!-- update-end-author:taoyan date:20201221 for:æ¤å¤å ætransitionæ ç¾ ä¸ç¥é为ä»ä¹å ä¸å 页é¢è·¯ç±åæ¢çæ¶åå³1åèååå°2åèåçæ¶å 两个èå页é¢ä¼åæ¶åºç°300-500ç§å·¦å³ --> |
| | | </div> |
| | | <!-- update-begin-author:zyf date:20211129 for:qiankun æè½½ååºç¨çå --> |
| | | <div id="content" class="app-view-box"></div> |
| | | <!-- update-end-author:zyf date:20211129 for: qiankun æè½½ååºç¨çå--> |
| | | </global-layout> |
| | | </template> |
| | | |
| | |
| | | import { triggerWindowResizeEvent } from '@/utils/util' |
| | | import Vue from 'vue' |
| | | import { CACHE_INCLUDED_ROUTES } from '@/store/mutation-types' |
| | | import registerApps from "@/qiankun"; |
| | | |
| | | const indexKey = '/dashboard/analysis' |
| | | |
| | |
| | | /* update_begin author:wuxianquan date:20190828 for: å
³éå½åtab页ï¼ä¾å页é¢è°ç¨ ->æèåè½é
ç½®å¤é¾ï¼ç´æ¥å¼¹åºæ°é¡µé¢è䏿¯åµå
¥iframe #428 */ |
| | | provide(){ |
| | | return{ |
| | | closeCurrent:this.closeCurrent, |
| | | changeTitle: this.changeTitle, |
| | | changeTabTitle: this.changeTabTitle, |
| | | closeCurrent: this.closeCurrent |
| | | } |
| | | }, |
| | | /* update_end author:wuxianquan date:20190828 for: å
³éå½åtab页ï¼ä¾å页é¢è°ç¨->æèåè½é
ç½®å¤é¾ï¼ç´æ¥å¼¹åºæ°é¡µé¢è䏿¯åµå
¥iframe #428 */ |
| | |
| | | this.pageList.push(currentRoute) |
| | | this.linkList.push(currentRoute.fullPath) |
| | | this.activePage = currentRoute.fullPath |
| | | this.$bus.$on('clickMenuTitleSelected', this.clickMenuTitleSelected) |
| | | }, |
| | | mounted() { |
| | | if (process.env.VUE_APP_QIANKUN == 'true') { |
| | | //update-begin-author:zyf date:20211129 for:qiankun 注åååºç¨ |
| | | if (!window.qiankunStarted) { |
| | | window.qiankunStarted = true; |
| | | registerApps(); |
| | | } |
| | | //update-end-author:zyf date:20211129 for:qiankun 注åååºç¨ |
| | | } |
| | | }, |
| | | watch: { |
| | | '$route': function(newRoute) { |
| | |
| | | let index = this.linkList.lastIndexOf(key) |
| | | let waitRouter = this.pageList[index] |
| | | // ãTESTA-523ãä¿®å¤ï¼ä¸å
许éå¤è·³è½¬è·¯ç±å¼å¸¸ |
| | | if (waitRouter.fullPath !== this.$route.fullPath) { |
| | | if (waitRouter.path !== this.$route.fullPath) { |
| | | this.$router.push(Object.assign({}, waitRouter)) |
| | | } |
| | | this.changeTitle(waitRouter.meta.title) |
| | |
| | | if (this.multipage && this.linkList.indexOf(indexKey) === -1) { |
| | | this.addIndexToFirst() |
| | | } |
| | | }, |
| | | } |
| | | // update-end-author:sunjianlei date:20191223 for: ä¿®å¤ä»å页模å¼åæ¢åå¤é¡µæ¨¡å¼åé¦é¡µä¸å±
第ä¸ä½ç BUG |
| | | }, |
| | | methods: { |
| | |
| | | // update-end-author:sunjianlei date:20191223 for: ä¿®å¤ä»å页模å¼åæ¢åå¤é¡µæ¨¡å¼åé¦é¡µä¸å±
第ä¸ä½ç BUG |
| | | |
| | | // update-begin-author:sunjianlei date:20200120 for: å¨ææ´æ¹é¡µé¢æ é¢ |
| | | /** |
| | | * ä¿®æ¹å½å页é¢ççªå£æ é¢ |
| | | * @param title è¦ä¿®æ¹çæ°æ é¢ |
| | | */ |
| | | changeTitle(title) { |
| | | let projectTitle = "MDCæºæ
§è½¦é´" |
| | | let projectTitle = 'MDCæºæ
§è½¦é´' |
| | | // é¦é¡µç¹æ®å¤ç |
| | | if (this.$route.path === indexKey) { |
| | | document.title = projectTitle |
| | | } else { |
| | | document.title = title + ' · ' + projectTitle |
| | | } |
| | | }, |
| | | /** |
| | | * ä¿®æ¹tabæ ç¾çæ é¢ |
| | | * @param title è¦ä¿®æ¹çæ°æ é¢ |
| | | * @param fullPath è¦ä¿®æ¹çè·¯ç±å
¨è·¯å¾ï¼å¦æä¸å¡«å°±æ¯ä¿®æ¹å½åè·¯ç± |
| | | */ |
| | | changeTabTitle(title, fullPath = '') { |
| | | if (title) { |
| | | let currentRoute = this.pageList.find((r) => r.fullPath === (fullPath ? fullPath : this.$route.fullPath)) |
| | | if (currentRoute != null) { |
| | | currentRoute.meta = {...currentRoute.meta, title} |
| | | } |
| | | } |
| | | }, |
| | | // update-end-author:sunjianlei date:20200120 for: å¨ææ´æ¹é¡µé¢æ é¢ |
| | |
| | | this.$message.warning('è¿æ¯æåä¸é¡µï¼ä¸è½åå
³éäºå¦') |
| | | return |
| | | } |
| | | console.log("this.pageList ",this.pageList ); |
| | | let removeRoute = this.pageList.filter(item => item.fullPath == key) |
| | | this.pageList = this.pageList.filter(item => item.fullPath !== key) |
| | | let removeRoute = this.pageList.filter(item => item.path == key) |
| | | this.pageList = this.pageList.filter(item => item.path !== key) |
| | | let index = this.linkList.indexOf(key) |
| | | this.linkList = this.linkList.filter(item => item !== key) |
| | | index = index >= this.linkList.length ? this.linkList.length - 1 : index |
| | |
| | | let cacheRouterArray = Vue.ls.get(CACHE_INCLUDED_ROUTES) || [] |
| | | if (removeRoute && removeRoute[0]) { |
| | | let componentName = removeRoute[0].meta.componentName |
| | | console.log("key: ", key); |
| | | console.log("componentName: ", componentName); |
| | | if(cacheRouterArray.includes(componentName)){ |
| | | cacheRouterArray.splice(cacheRouterArray.findIndex(item => item === componentName), 1) |
| | | Vue.ls.set(CACHE_INCLUDED_ROUTES, cacheRouterArray) |
| | |
| | | this.emitPageClosed(removeRoute[0]) |
| | | } |
| | | //update-end--Author:scott Date:20201015 forï¼è·¯ç±ç¼åé®é¢ï¼å
³éäºtab页æ¶åæå¼å°±ä¸å·æ° #842 |
| | | |
| | | this.tabCallBack() |
| | | }, |
| | | // 触å page-closed ï¼é¡µé¢å
³éï¼å
¨å±äºä»¶ |
| | | emitPageClosed(closedRoute) { |
| | |
| | | }, |
| | | /* update_begin author:wuxianquan date:20190828 for: å
³éå½åtab页ï¼ä¾å页é¢è°ç¨->æèåè½é
ç½®å¤é¾ï¼ç´æ¥å¼¹åºæ°é¡µé¢è䏿¯åµå
¥iframe #428 */ |
| | | closeCurrent(){ |
| | | this.remove(this.activePage); |
| | | this.remove(this.activePage) |
| | | }, |
| | | /* update_end author:wuxianquan date:20190828 for: å
³éå½åtab页ï¼ä¾å页é¢è°ç¨->æèåè½é
ç½®å¤é¾ï¼ç´æ¥å¼¹åºæ°é¡µé¢è䏿¯åµå
¥iframe #428 */ |
| | | closeOthers(pageKey) { |
| | |
| | | let indexContent = this.pageList.slice(0, 1)[0] |
| | | this.linkList = this.linkList.slice(index, index + 1) |
| | | this.pageList = this.pageList.slice(index, index + 1) |
| | | this.linkList.unshift(indexContent.fullPath) |
| | | this.linkList.unshift(indexContent.path) |
| | | this.pageList.unshift(indexContent) |
| | | this.activePage = this.linkList[1] |
| | | } |
| | |
| | | let index = this.linkList.indexOf(pageKey) |
| | | this.linkList = this.linkList.slice(index) |
| | | this.pageList = this.pageList.slice(index) |
| | | this.linkList.unshift(indexContent.fullPath) |
| | | this.linkList.unshift(indexContent.path) |
| | | this.pageList.unshift(indexContent) |
| | | // è¥å°æ¿æ´»é¡µä¸å¹¶å
³éåæ¾ç¤ºå¯¼èªæ é¤é¦é¡µç¬¬ä¸ä¸ªé¡µé¢ |
| | | if (this.linkList.indexOf(this.activePage) < 0) { |
| | | this.activePage = this.linkList[0] |
| | | this.activePage = this.linkList[1] |
| | | } |
| | | }, |
| | | closeRight(pageKey) { |
| | | let index = this.linkList.indexOf(pageKey) |
| | | this.linkList = this.linkList.slice(0, index + 1) |
| | | this.pageList = this.pageList.slice(0, index + 1) |
| | | if (this.linkList.indexOf(this.activePage < 0)) { |
| | | // è¥å°æ¿æ´»é¡µä¸å¹¶å
³éåæ¾ç¤ºå¯¼èªæ æåä¸ä¸ªé¡µé¢ |
| | | if (this.linkList.indexOf(this.activePage) < 0) { |
| | | this.activePage = this.linkList[this.linkList.length - 1] |
| | | } |
| | | }, |
| | |
| | | //update-begin-author:taoyan date:20191008 for:è·¯ç±å·æ° |
| | | routeReload(){ |
| | | this.reloadFlag = false |
| | | let ToggleMultipage = "ToggleMultipage" |
| | | let ToggleMultipage = 'ToggleMultipage' |
| | | this.$store.dispatch(ToggleMultipage,false) |
| | | this.$nextTick(()=>{ |
| | | this.$store.dispatch(ToggleMultipage,true) |
| | |
| | | excuteCallback(callback){ |
| | | callback() |
| | | }, |
| | | |
| | | clickMenuTitleSelected(selectedMenus) { |
| | | //console.log("æ°çè·¯ç±",newRoute) |
| | | this.activePage = selectedMenus[0].path |
| | | if (!this.multipage) { |
| | | this.linkList = [this.linkList[0], selectedMenus[0].path] |
| | | this.pageList = [this.pageList[0], Object.assign({}, selectedMenus[0])] |
| | | // update-begin-author:taoyan date:20200211 for: TASK #3368 ãè·¯ç±ç¼åãé¦é¡µçç¼å设置æé®é¢ï¼éè¦æ ¹æ®åå°çè·¯ç±é
ç½®æ¥å®ç°æ¯å¦ç¼å |
| | | } else if (indexKey == selectedMenus[0].path) { |
| | | //é¦é¡µæ¶ 夿æ¯å¦ç¼å 没æç¼å å·æ°ä¹ |
| | | if (selectedMenus[0].meta.keepAlive === false) { |
| | | this.routeReload() |
| | | } |
| | | // update-end-author:taoyan date:20200211 for: TASK #3368 ãè·¯ç±ç¼åãé¦é¡µçç¼å设置æé®é¢ï¼éè¦æ ¹æ®åå°çè·¯ç±é
ç½®æ¥å®ç°æ¯å¦ç¼å |
| | | } else { |
| | | // selectedMenus.forEach(menuItem => { |
| | | // if (!this.linkList.includes(menuItem.path)) { |
| | | // console.log('触åå¢å ') |
| | | // this.linkList.push(menuItem.path) |
| | | // this.pageList.push(menuItem) |
| | | // } else { |
| | | // console.log('è§¦åæ²¡æå¢å ') |
| | | // let oldIndex = this.linkList.indexOf(menuItem.path) |
| | | // let oldPositionRoute = this.pageList[oldIndex] |
| | | // this.pageList.splice(oldIndex, 1, Object.assign({}, menuItem, { meta: oldPositionRoute.meta })) |
| | | // } |
| | | // }) |
| | | // ç¹å»æ é¢åå¨å¯¼èªæ è¦çåä¸ä¸ªæ 颿å±å¼çä¸çº§èå |
| | | this.linkList = [this.linkList[0], ...selectedMenus.map(item => item.path)] |
| | | this.pageList = [this.pageList[0], ...selectedMenus] |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | |
| | | &.ant-tabs-card .ant-tabs-tab { |
| | | |
| | | padding: 0 24px !important; |
| | | padding: 0 20px 0 2px !important; |
| | | background-color: white !important; |
| | | margin-right: 10px !important; |
| | | /*margin-right: 10px !important;*/ |
| | | |
| | | .ant-tabs-close-x { |
| | | width: 12px !important; |