页面标签完成底座部署

examples/components/mainContent.vue

@@ -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>