This commit is contained in:
yanran200730
2023-02-02 16:42:06 +08:00
2 changed files with 9 additions and 77 deletions

View File

@@ -1,6 +1,6 @@
<template>
<section class="mainContent">
<ai-nav-tab/>
<ai-nav-tab :routes="apps"/>
<div class="fill">
<router-view/>
<ai-empty v-if="isHome">欢迎使用村微产品库</ai-empty>
@@ -10,11 +10,13 @@
<script>
import AiNavTab from "dui/packages/basic/AiNavTab";
import {mapState} from "vuex"
export default {
name: "mainContent",
components: {AiNavTab},
computed: {
...mapState(['apps']),
isHome: v => v.$route.path == '/',
},
}
@@ -26,76 +28,5 @@ export default {
width: 100%;
display: flex;
flex-direction: column;
:deep(.layout ) {
background: #F5F6F9;
display: flex;
flex-direction: column;
& > .el-tabs__header {
margin-bottom: 0;
background: linear-gradient(180deg, #FCFCFC 0%, #E0E2E4 100%);
height: 40px;
display: flex;
align-items: flex-end;
border: none;
.el-tabs__nav {
border: none;
}
.el-tabs__item {
padding: 0 8px 0 12px !important;
text-align: left;
min-width: 130px;
height: 36px;
line-height: 36px;
border: none;
color: #555;
font-size: 12px;
& + .el-tabs__item {
margin-left: 2px;
}
.el-icon-close {
float: right;
width: auto;
height: 100%;
line-height: 36px;
background: transparent;
font-size: 16px;
color: #89b;
&:hover {
color: #000;
}
}
&.is-active {
border: 1px solid #D8DCE3;
border-bottom: none;
border-radius: 4px 4px 0 0;
background: #F5F6F9;
color: #222;
&:after {
display: none;
}
}
&:after {
position: absolute;
right: 0;
content: " ";
width: 1px;
background: #D8DCE3;
height: 24px;
top: 50%;
transform: translateY(-50%);
}
}
}
}
}
</style>

View File

@@ -14,16 +14,17 @@
</template>
<script>
import {mapState, mapMutations} from "vuex";
import {mapMutations, mapState} from "vuex";
export default {
name: "AiNavTab",
props: {
routes: {default: () => []},
fixed: {default: () => ({label: "首页", id: "/"})}
},
computed: {
...mapState(['apps', 'logs']),
currentTab: v => v.isHome ? "/" : v.$route.fullPath,
...mapState(['logs']),
currentTab: v => v.isHome ? v.fixed.id : v.$route.fullPath,
tabs: v => [{...v.fixed, fixed: 1}, v.logs.pages].flat(),
isHome: v => v.fixed.id == v.$route.fullPath
},
@@ -36,7 +37,7 @@ export default {
$route: {
immediate: true,
handler(v) {
const currentPage = this.apps.find(e => e.name == v.name);
const currentPage = this.routes.find(e => e.name == v.name);
currentPage && this.addPage(currentPage)
}
}
@@ -45,7 +46,7 @@ export default {
...mapMutations(['addPage', 'deletePage']),
handleTabClick(pageTab) {
const {name} = pageTab
this.$router.push(name)
name != this.$route.fullPath && this.$router.push(name)
},
handleTabRemove(id) {
const {pages} = this.logs