From 34ec919649adfefeecd0418284dd7b02e9ed49b8 Mon Sep 17 00:00:00 2001 From: 马宇豪 <978517621@qq.com> Date: 星期三, 23 四月 2025 15:42:17 +0800 Subject: [PATCH] 添加批发仓库监测预警 --- src/views/layout/Layout.vue | 88 +++++++++++++++++++++++++++++++++++++++----- 1 files changed, 78 insertions(+), 10 deletions(-) diff --git a/src/views/layout/Layout.vue b/src/views/layout/Layout.vue index 99ba467..e2f1ad4 100644 --- a/src/views/layout/Layout.vue +++ b/src/views/layout/Layout.vue @@ -2,7 +2,7 @@ <el-container > <div v-title :data-title="titleName" class="main"/> <div :class="classObj" class="app-wrapper"> - <el-header style="text-align: left; padding: 0"> + <el-header style="text-align: left; padding: 0;height:80px"> <navbar /> </el-header> <el-container> @@ -10,18 +10,28 @@ <el-aside width="260px"> <sidebar class="sidebar-container"/> </el-aside> - <el-main style="background-color: #DFE5EB;padding: 30px"> - <div class="main-container"> - <app-main /> - </div> + <el-main style="background-color: #DFE5EB;padding: 10px 30px 30px"> + <el-tabs v-model="editableTabsValue" type="border-card" closable @tab-remove="removeTab" @tab-click="changePage"> + <el-tab-pane + v-for="(item, index) in editableTabs" + :key= item.name + :label="item.meta.title" + :name="item.path" + > + <div class="main-container" v-if="editableTabsValue == item.path"> + <app-main/> + </div> + </el-tab-pane> + </el-tabs> </el-main> </el-container> </el-container> <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" /> </div> - <el-footer height="20px"> + <el-footer height="auto"> <div class="bottom-container"> - <span>Copyright©2017 中国科学院苏州纳米技术与纳米仿生研究所 苏ICP备10220403号-6</span> + <span>Copyright ©2020-{{nowadayYear}} 技术保障</span><br/> + <span style="line-height:28px;">技术支持电话:0512-62872943 (工作日 8:30~17:30)</span> </div> </el-footer> </el-container> @@ -45,11 +55,19 @@ return { path: null, WarningInfo: null, - titleName: '新疆维吾尔自治区烟花爆竹流向管理信息实名登记系统' + titleName: '新疆维吾尔自治区烟花爆竹流向管理信息实名登记系统', + editableTabsValue: '/enterprise/basic', + editableTabs: [] } }, mounted() { + this.getBreadcrumb() }, + watch: { + $route() { + this.getBreadcrumb() + } + }, computed: { ...mapGetters([ 'userType', @@ -62,6 +80,10 @@ }, device() { return this.$store.state.app.device + }, + nowadayYear(){ + let date=new Date(); + return date.getFullYear() }, classObj() { return { @@ -76,6 +98,47 @@ handleClickOutside() { this.$store.dispatch('closeSideBar', { withoutAnimation: false }) }, + removeTab(targetName) { + let tabs = this.editableTabs; + if(tabs.length>1){ + let activeName = this.editableTabsValue; + if (activeName === targetName) { + tabs.forEach((tab, index) => { + if (tab.path === targetName) { + let nextTab = tabs[index + 1] || tabs[index - 1]; + if (nextTab) { + activeName = nextTab.path; + this.$router.push(activeName) + } + } + }); + } + this.editableTabsValue = activeName; + this.editableTabs = tabs.filter(tab => tab.path !== targetName); + }else{ + this.$message({ + type:'warning', + message: '最后一页无法关闭' + }) + } + }, + getBreadcrumb() { + let matched = this.$route.matched.filter(item => item.name) + + const first = matched[0] + if (first && first.name.trim().toLocaleLowerCase() !== 'Dashboard'.toLocaleLowerCase()) { + matched = [{ path: '/dashboard', meta: { title: '首页' }}].concat(matched) + } + + this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false) + if(!this.editableTabs.some(i=>i.path === this.levelList[2].path)){ + this.editableTabs.push(this.levelList[2]) + } + this.editableTabsValue = this.levelList[2].path + }, + changePage(tab,event){ + this.$router.push(this.editableTabsValue) + } } } </script> @@ -92,6 +155,9 @@ top: 0; } } + .el-tabs ::v-deep.el-tabs__content{ + padding: 0; + } .drawer-bg { background: #000; opacity: 0.3; @@ -102,7 +168,9 @@ z-index: 999; } .bottom-container{ - position: absolute; - left: 35%; + padding:25px; + text-align: center; + font-size:12px; + margin-left: 15%; } </style> -- Gitblit v1.9.2