From 7036cc397adccb4907b80a30143f7751b4e68db8 Mon Sep 17 00:00:00 2001 From: zhuzhuanzhuan Date: 星期三, 20 三月 2024 11:21:54 +0800 Subject: [PATCH] 实现首页公司级与分厂级看板布局及相关功能 --- src/components/layouts/TabLayout.vue | 81 ++++++++++++++++++++-------------------- 1 files changed, 41 insertions(+), 40 deletions(-) diff --git a/src/components/layouts/TabLayout.vue b/src/components/layouts/TabLayout.vue index 9f619a5..0340721 100644 --- a/src/components/layouts/TabLayout.vue +++ b/src/components/layouts/TabLayout.vue @@ -4,8 +4,8 @@ <contextmenu :itemList="menuItemList" :visible.sync="menuVisible" style="z-index: 9999;" @select="onMenuSelect"/> <!-- update-end- author:sunjianlei --- date:20191009 --- for: 鎻愬崌鍙抽敭鑿滃崟鐨勫眰绾� --> <a-tabs + v-if="$route.meta.title!=='棣栭〉'&&multipage" @contextmenu.native="e => onContextmenu(e)" - v-if="multipage" :active-key="activePage" class="tab-layout-tabs" style="height:52px" @@ -14,11 +14,12 @@ @change="changePage" @tabClick="tabCallBack" @edit="editPage"> - <a-tab-pane :id="page.fullPath" :key="page.fullPath" v-for="page in pageList" :closable="!(page.meta.title=='棣栭〉')"> + <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> </a-tabs> - <div style="margin: 12px 12px 0;"> + <div> <!-- update-begin-author:taoyan date:20201221 for:姝ゅ鍒犳帀transition鏍囩 涓嶇煡閬撲负浠�涔堝姞涓婂悗 椤甸潰璺敱鍒囨崲鐨勬椂鍊欏嵆1鍙婅彍鍗曞垏鍒�2鍙婅彍鍗曠殑鏃跺�� 涓や釜鑿滃崟椤甸潰浼氬悓鏃跺嚭鐜�300-500绉掑乏鍙� --> <keep-alive v-if="multipage"> <router-view v-if="reloadFlag"/> @@ -60,13 +61,13 @@ { key: '2', icon: 'arrow-right', text: '鍏抽棴鍙充晶' }, { key: '3', icon: 'close', text: '鍏抽棴鍏跺畠' } ], - reloadFlag:true + reloadFlag: true } }, /* update_begin author:wuxianquan date:20190828 for: 鍏抽棴褰撳墠tab椤碉紝渚涘瓙椤甸潰璋冪敤 ->鏈涜彍鍗曡兘閰嶇疆澶栭摼锛岀洿鎺ュ脊鍑烘柊椤甸潰鑰屼笉鏄祵鍏frame #428 */ - provide(){ - return{ - closeCurrent:this.closeCurrent + provide() { + return { + closeCurrent: this.closeCurrent } }, /* update_end author:wuxianquan date:20190828 for: 鍏抽棴褰撳墠tab椤碉紝渚涘瓙椤甸潰璋冪敤->鏈涜彍鍗曡兘閰嶇疆澶栭摼锛岀洿鎺ュ脊鍑烘柊椤甸潰鑰屼笉鏄祵鍏frame #428 */ @@ -99,17 +100,17 @@ this.activePage = newRoute.fullPath if (!this.multipage) { this.linkList = [newRoute.fullPath] - this.pageList = [Object.assign({},newRoute)] - // update-begin-author:taoyan date:20200211 for: TASK #3368 銆愯矾鐢辩紦瀛樸�戦椤电殑缂撳瓨璁剧疆鏈夐棶棰橈紝闇�瑕佹牴鎹悗鍙扮殑璺敱閰嶇疆鏉ュ疄鐜版槸鍚︾紦瀛� - } else if(indexKey==newRoute.fullPath) { + this.pageList = [Object.assign({}, newRoute)] + // update-begin-author:taoyan date:20200211 for: TASK #3368 銆愯矾鐢辩紦瀛樸�戦椤电殑缂撳瓨璁剧疆鏈夐棶棰橈紝闇�瑕佹牴鎹悗鍙扮殑璺敱閰嶇疆鏉ュ疄鐜版槸鍚︾紦瀛� + } else if (indexKey == newRoute.fullPath) { //棣栭〉鏃� 鍒ゆ柇鏄惁缂撳瓨 娌℃湁缂撳瓨 鍒锋柊涔� if (newRoute.meta.keepAlive === false) { this.routeReload() } - // update-end-author:taoyan date:20200211 for: TASK #3368 銆愯矾鐢辩紦瀛樸�戦椤电殑缂撳瓨璁剧疆鏈夐棶棰橈紝闇�瑕佹牴鎹悗鍙扮殑璺敱閰嶇疆鏉ュ疄鐜版槸鍚︾紦瀛� - }else if (this.linkList.indexOf(newRoute.fullPath) < 0) { + // update-end-author:taoyan date:20200211 for: TASK #3368 銆愯矾鐢辩紦瀛樸�戦椤电殑缂撳瓨璁剧疆鏈夐棶棰橈紝闇�瑕佹牴鎹悗鍙扮殑璺敱閰嶇疆鏉ュ疄鐜版槸鍚︾紦瀛� + } else if (this.linkList.indexOf(newRoute.fullPath) < 0) { this.linkList.push(newRoute.fullPath) - this.pageList.push(Object.assign({},newRoute)) + this.pageList.push(Object.assign({}, newRoute)) //// update-begin-author:sunjianlei date:20200103 for: 濡傛灉鏂板鐨勯〉闈㈤厤缃簡缂撳瓨璺敱锛岄偅涔堝氨寮哄埗鍒锋柊涓�閬� #842 // if (newRoute.meta.keepAlive) { // this.routeReload() @@ -118,7 +119,7 @@ } else if (this.linkList.indexOf(newRoute.fullPath) >= 0) { let oldIndex = this.linkList.indexOf(newRoute.fullPath) let oldPositionRoute = this.pageList[oldIndex] - this.pageList.splice(oldIndex, 1, Object.assign({},newRoute,{meta:oldPositionRoute.meta})) + this.pageList.splice(oldIndex, 1, Object.assign({}, newRoute, { meta: oldPositionRoute.meta })) } }, 'activePage': function(key) { @@ -131,7 +132,7 @@ this.changeTitle(waitRouter.meta.title) }, 'multipage': function(newVal) { - if(this.reloadFlag){ + if (this.reloadFlag) { if (!newVal) { this.linkList = [this.$route.fullPath] this.pageList = [this.$route] @@ -143,7 +144,7 @@ if (this.multipage && this.linkList.indexOf(indexKey) === -1) { this.addIndexToFirst() } - }, + } // update-end-author:sunjianlei date:20191223 for: 淇浠庡崟椤垫ā寮忓垏鎹㈠洖澶氶〉妯″紡鍚庨椤典笉灞呯涓�浣嶇殑 BUG }, methods: { @@ -165,7 +166,7 @@ // update-begin-author:sunjianlei date:20200120 for: 鍔ㄦ�佹洿鏀归〉闈㈡爣棰� changeTitle(title) { - let projectTitle = "MDC鏅烘収杞﹂棿" + let projectTitle = 'MDC鏅烘収杞﹂棿' // 棣栭〉鐗规畩澶勭悊 if (this.$route.path === indexKey) { document.title = projectTitle @@ -181,10 +182,10 @@ tabCallBack() { this.$nextTick(() => { //update-begin-author:taoyan date: 20201211 for:銆愭柊鐗堛�憃nline鎶ラ敊 JT-100 - setTimeout(()=>{ - //鐪佸競鍖虹粍浠堕噷闈㈢粰window缁戝畾浜嗕釜resize浜嬩欢 瀵艰嚧鍒囨崲椤甸潰鐨勬椂鍊欒Е鍙戜簡浠栫殑resize锛屼絾鏄垏鎹㈤〉闈紝鐪佸競鍖虹粍浠惰繕娌¤閿�姣佸墠灏辫Е鍙戜簡璇ヤ簨浠讹紝瀵艰嚧鎺у埗鍙版姤閿欙紝鍔犱釜寤惰繜 - triggerWindowResizeEvent() - },20) + setTimeout(() => { + //鐪佸競鍖虹粍浠堕噷闈㈢粰window缁戝畾浜嗕釜resize浜嬩欢 瀵艰嚧鍒囨崲椤甸潰鐨勬椂鍊欒Е鍙戜簡浠栫殑resize锛屼絾鏄垏鎹㈤〉闈紝鐪佸競鍖虹粍浠惰繕娌¤閿�姣佸墠灏辫Е鍙戜簡璇ヤ簨浠讹紝瀵艰嚧鎺у埗鍙版姤閿欙紝鍔犱釜寤惰繜 + triggerWindowResizeEvent() + }, 20) //update-end-author:taoyan date: 20201211 for:銆愭柊鐗堛�憃nline鎶ラ敊 JT-100 }) }, @@ -200,7 +201,7 @@ this.$message.warning('杩欐槸鏈�鍚庝竴椤碉紝涓嶈兘鍐嶅叧闂簡鍟�') return } - console.log("this.pageList ",this.pageList ); + 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 index = this.linkList.indexOf(key) @@ -213,9 +214,9 @@ 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)){ + 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) } @@ -269,13 +270,13 @@ } }, /* update_begin author:wuxianquan date:20190828 for: 鍏抽棴褰撳墠tab椤碉紝渚涘瓙椤甸潰璋冪敤->鏈涜彍鍗曡兘閰嶇疆澶栭摼锛岀洿鎺ュ脊鍑烘柊椤甸潰鑰屼笉鏄祵鍏frame #428 */ - closeCurrent(){ - this.remove(this.activePage); + closeCurrent() { + this.remove(this.activePage) }, /* update_end author:wuxianquan date:20190828 for: 鍏抽棴褰撳墠tab椤碉紝渚涘瓙椤甸潰璋冪敤->鏈涜彍鍗曡兘閰嶇疆澶栭摼锛岀洿鎺ュ脊鍑烘柊椤甸潰鑰屼笉鏄祵鍏frame #428 */ closeOthers(pageKey) { let index = this.linkList.indexOf(pageKey) - if (pageKey == indexKey || pageKey.indexOf('?ticke=')>=0) { + if (pageKey == indexKey || pageKey.indexOf('?ticke=') >= 0) { this.linkList = this.linkList.slice(index, index + 1) this.pageList = this.pageList.slice(index, index + 1) this.activePage = this.linkList[0] @@ -312,12 +313,12 @@ } }, //update-begin-author:taoyan date:20190430 for:鍔ㄦ�佽矾鐢眛itle鏄剧ず閰嶇疆鐨勮彍鍗晅itle鑰屼笉鏄叾瀵瑰簲璺敱鐨則itle - dynamicRouterShow(key,title){ + dynamicRouterShow(key, title) { let keyIndex = this.linkList.indexOf(key) - if(keyIndex>=0){ + if (keyIndex >= 0) { let currRouter = this.pageList[keyIndex] - let meta = Object.assign({},currRouter.meta,{title:title}) - this.pageList.splice(keyIndex, 1, Object.assign({},currRouter,{meta:meta})) + let meta = Object.assign({}, currRouter.meta, { title: title }) + this.pageList.splice(keyIndex, 1, Object.assign({}, currRouter, { meta: meta })) if (key === this.activePage) { this.changeTitle(title) } @@ -326,20 +327,20 @@ //update-end-author:taoyan date:20190430 for:鍔ㄦ�佽矾鐢眛itle鏄剧ず閰嶇疆鐨勮彍鍗晅itle鑰屼笉鏄叾瀵瑰簲璺敱鐨則itle //update-begin-author:taoyan date:20191008 for:璺敱鍒锋柊 - routeReload(){ + routeReload() { this.reloadFlag = false - let ToggleMultipage = "ToggleMultipage" - this.$store.dispatch(ToggleMultipage,false) - this.$nextTick(()=>{ - this.$store.dispatch(ToggleMultipage,true) + let ToggleMultipage = 'ToggleMultipage' + this.$store.dispatch(ToggleMultipage, false) + this.$nextTick(() => { + this.$store.dispatch(ToggleMultipage, true) this.reloadFlag = true }) }, //update-end-author:taoyan date:20191008 for:璺敱鍒锋柊 //鏂板涓�涓繑鍥炴柟娉� - excuteCallback(callback){ + excuteCallback(callback) { callback() - }, + } } } </script> @@ -422,7 +423,7 @@ border-bottom: 1px solid transparent !important; } .ant-tabs-tab-active { - border-color: @primary-color!important; + border-color: @primary-color !important; } } -- Gitblit v1.9.3