From e1aa0ecffbabd618c71e4ad94370fb8dffe6ee1c Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期日, 21 一月 2024 20:54:49 +0800 Subject: [PATCH] 优化 --- src/views/layout/components/Header/index.vue | 79 ++++++++++++++++++++++++++++++++++++--- 1 files changed, 73 insertions(+), 6 deletions(-) diff --git a/src/views/layout/components/Header/index.vue b/src/views/layout/components/Header/index.vue index 1fa1ed9..748bc83 100644 --- a/src/views/layout/components/Header/index.vue +++ b/src/views/layout/components/Header/index.vue @@ -6,6 +6,17 @@ <div class="menu-left__item" v-for="(item, index) in menuLeftList" :key="item.id" @click="changeActive(index)"> <span :class="item.checked ? 'my-active' : 'my-activeno'" @click="menuChange(item)">{{ item.label }}</span> </div> + <div class="menu-left__item" v-for="(item, index) in menuLinkList" :key="item.id+index" > + <span class="link-active" @click="menuOpen(item)">{{ item.name }}</span> + </div> + <el-dropdown trigger="click" @command="handleCommand" v-if="linkLeng"> + <span class="el-dropdown-link"> + <i class="el-icon-arrow-down el-icon--right"></i> + </span> + <el-dropdown-menu slot="dropdown" > + <el-dropdown-item v-for="(i,dx) in menuLinkLists" :key="i.id+dx" :command="i">{{i.name}}</el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> </div> <!-- 鍙充晶鑿滃崟 --> <div class="header-right"> @@ -37,7 +48,7 @@ <div class="menu-right__item user" @mousemove="flag.user = true" @mouseleave="flag.user = false"> <span class="user-span">|</span> <el-avatar :size="20" :src="user.user.icon" v-if="user.user.icon"></el-avatar> - <el-avatar :size="20" src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png" v-else> + <el-avatar :size="20" src="../../../../assets/imgs/login/3ea6beec64369c2642b92c6726f1epng.png" v-else> </el-avatar> <span style="padding: 0 5px;">{{ user.user.username }}</span> @@ -123,6 +134,7 @@ import updatePassword from "./updatePassword"; import users from "@/api/users"; import { Message } from "element-ui"; +import {searchexternalLinks} from "@/api/system/portal/externalLinks"; export default { components: { @@ -130,6 +142,9 @@ }, data() { return { + linkLeng:false, + menuLinkLists:[], + menuLinkList:[], baseInformationVisible: false, updatePasswordDialog: false, channelSettingVisible: false, @@ -138,7 +153,7 @@ { label: '椹鹃┒鑸�', checked: false, - url: '', + url: 'http://111.1.140.92:28081/cockpit/dist/board.html#/share-board/ze5EdUnw', id: '1f' }, { @@ -156,7 +171,7 @@ { label: '娌圭儫妫�娴�', checked: false, - url: '', + url: 'http://116.62.234.187:8120/#/SpecificLogin?subname=sccgj', id: '4f', }, ], @@ -177,6 +192,12 @@ }, created() { this.setLoginInfo(); + this.getExternalLinks() + }, + mounted(){ + window.eventBus.$on('setFeaturesData', ()=>{ // 涓嶅甫鍙傛暟 + this.getExternalLinks() + }) }, watch:{ $route() { @@ -186,6 +207,32 @@ }, }, methods: { + handleCommand(e){ + console.log(e) + this.menuOpen(e) + }, + menuOpen(row){ + window.open('http://'+row.url, '_blank'); + }, + async getExternalLinks() { + await searchexternalLinks().then((res) => { + let that = this + that.menuLinkList=[] + if (res.length > 5) { + that.linkLeng = true + } + that.menuLinkLists = res + for (let i = 0; i < res.length; i++) { + that.menuLinkList.push(res[i]) + if (i == 4) { + break; + } + } + // console.log(that.menuLinkLists) + // this.menuLinkList = res + + }); + }, cancelChannel(){ this.channelSettingVisible=false }, @@ -306,7 +353,7 @@ }, menuChange(data) { if (data.id === '1f') { - window.open('http://cockpit.patstech.net:28081/cockpit/dist/board.html#/share-board/zfu0LsJ9', '_blank'); + window.open('http://111.1.140.92:28081/cockpit/dist/board.html#/share-board/ze5EdUnw', '_blank'); } if (data.id === '2f') { this.$router.push({ path: "/home/video" }) @@ -314,12 +361,20 @@ if (data.id === '3f') { this.$router.push({ path: "/home/operate/casepool/pool" }) } + if (data.id === '4f') { + window.open('http://116.62.234.187:8120/#/SpecificLogin?subname=sccgj', '_blank'); + } + } } }; </script> <style lang="scss" scoped> +.el-dropdown-link { + cursor: pointer; + color: #409EFF; +} ::v-deep .el-form { padding: 3vh 5vw; @@ -341,7 +396,7 @@ .header-left { display: flex; flex: 1; - +align-items: center; .menu-left__item { width: 120px; @@ -356,7 +411,19 @@ } } } +.link-active{ + overflow:hidden; + white-space: nowrap; + + text-overflow: ellipsis; + + -o-text-overflow:ellipsis; +} + .link-active:hover{ + color: #2f54eb; + background-color: #313350; + } .my-active { border-radius: 20px; color: #2f54eb; @@ -403,7 +470,7 @@ .user { //margin-left: 20px; - flex: 1; + flex: 2; display: flex; align-items: center; justify-content: center; -- Gitblit v1.8.0