多页签

layouts/basic-layout/product.vue

@@ -16,14 +16,10 @@
                 <td>
                   <ul class="table_row_ul">
                     <li>
-                      <a class="a_goIndex" @click="goIndex">
-                        首页一
-                      </a>
+                      <a class="a_goIndex" @click="goIndex">首页一</a>
                     </li>
                     <li>
-                      <a class="a_goIndex" @click="goIndexTwo">
-                        首页二
-                      </a>
+                      <a class="a_goIndex" @click="goIndexTwo">首页二</a>
                     </li>
                   </ul>
                 </td>
@@ -35,32 +31,31 @@
                 <td>
                   <ul class="table_row_ul">
                     <li v-for="(li) in item.children">
-                      <a @click="goPage(item,li)" :class="{'active': li.id === isActive}">{{li.title}}</a>
+                      <a
+                        @click="goPage(item,li)"
+                        :class="{'active': li.id === isActive}"
+                      >{{li.title}}</a>
                     </li>
                   </ul>
                 </td>
               </tr>
             </table>
           </div>
-      </span>
-        </a>
+        </span>
+      </a>
       <!-- <i-header-breadcrumb v-if="showBreadcrumb && !headerMenu && !isMobile" ref="breadcrumb" /> -->
       <!-- {{}} -->
-      <Breadcrumb class="i-layout-header-breadcrumb" v-if="homeMenuItem==''"> 
+      <Breadcrumb class="i-layout-header-breadcrumb" v-if="homeMenuItem==''">
         <BreadcrumbItem to="/" class="white">
-            <Icon type="ios-home" />首页
+          <Icon type="ios-home" />首页
         </BreadcrumbItem>
       </Breadcrumb>
-      <Breadcrumb class="i-layout-header-breadcrumb" v-else-if="homeMenuItem!=''" separator=">"> 
+      <Breadcrumb class="i-layout-header-breadcrumb" v-else-if="homeMenuItem!=''" separator=">">
         <BreadcrumbItem to="/" class="white">
-            <Icon type="ios-home" />首页
-        </BreadcrumbItem>
-        <BreadcrumbItem>
-            {{homeMenu}}
-        </BreadcrumbItem>
-        <BreadcrumbItem :to="parthto" class="white">
-            {{homeMenuItem}}
+          <Icon type="ios-home" />首页
         </BreadcrumbItem>
+        <BreadcrumbItem>{{homeMenu}}</BreadcrumbItem>
+        <BreadcrumbItem :to="parthto" class="white">{{homeMenuItem}}</BreadcrumbItem>
       </Breadcrumb>
       <i-header-search v-if="showSearch && !headerMenu && !isMobile && !showBreadcrumb" />
       <div class="header_right">
@@ -77,6 +72,11 @@
         <i-header-setting v-if="enableSetting && !isMobile" />-->
       </div>
     </Header>
+    <div class="i-tabs">
+      <transition name="fade-quick">
+        <i-tabs v-if="tabs" v-show="showHeader" @on-reload="handleReload" />
+      </transition>
+    </div>
     <Content class="i-layout-content">
       <keep-alive :include="keepAlive">
         <nuxt v-if="loadRouter" />
@@ -137,9 +137,9 @@ export default {
       isDelayHideSider: false, // hack，当从隐藏侧边栏的 header 切换到正常 header 时，防止 Logo 抖动
       loadRouter: true,
 
-      homeMenu:'',
-      homeMenuItem:"",
-      parthto:'',
+      homeMenu: "",
+      homeMenuItem: "",
+      parthto: ""
     };
   },
   computed: {
@@ -248,7 +248,8 @@ export default {
       }, 0);
     },
     $route(to, from) {
-      if (to.name === from.name) {// 相同路由，不同参数，跳转时，重载页面
+      if (to.name === from.name) {
+        // 相同路由，不同参数，跳转时，重载页面
         if (Setting.sameRouteForceUpdate) {
           this.handleReload();
         }
@@ -267,7 +268,8 @@ export default {
     },
     handleScroll() {
       if (!this.headerHide) return;
-      const scrollTop = document.body.scrollTop + document.documentElement.scrollTop;
+      const scrollTop =
+        document.body.scrollTop + document.documentElement.scrollTop;
       if (!this.ticking) {
         this.ticking = true;
         requestAnimation(() => {
@@ -294,7 +296,8 @@ export default {
         // todo $menuHead.handleGetMenuHeight();
       }
     },
-    handleReload() {// 针对缓存的页面也生效
+    handleReload() {
+      // 针对缓存的页面也生效
       const isCurrentPageCache = this.keepAlive.indexOf(this.$route.name) > -1;
       const pageName = this.$route.name;
       if (isCurrentPageCache) {
@@ -308,24 +311,24 @@ export default {
         }
       });
     },
-    goPage(u,li) {
-      this.$router.push(li.path)
-      this.isActive = li.id
-      this.homeMenu = u.title
-      this.homeMenuItem = li.title
-      this.parthto = li.path
+    goPage(u, li) {
+      this.$router.push(li.path);
+      this.isActive = li.id;
+      this.homeMenu = u.title;
+      this.homeMenuItem = li.title;
+      this.parthto = li.path;
     },
-    goIndex(){
-      this.$router.push("/")
-      this.homeMenu = ''
-      this.homeMenuItem = ''
-      this.isActive = 0
+    goIndex() {
+      this.$router.push("/");
+      this.homeMenu = "";
+      this.homeMenuItem = "";
+      this.isActive = 0;
     },
-    goIndexTwo(){
-      this.$router.push("/home")
-      this.homeMenu = ''
-      this.homeMenuItem = ''
-      this.isActive = 0
+    goIndexTwo() {
+      this.$router.push("/home");
+      this.homeMenu = "";
+      this.homeMenuItem = "";
+      this.isActive = 0;
     }
   },
   mounted() {
@@ -341,22 +344,26 @@ export default {
 </script>
 
 <style lang="less">
-.i-layout-header-breadcrumb  {
-    color: #A7B8CC!important;//wheat
+.i-layout-header-breadcrumb {
+  color: #a7b8cc !important; //wheat
 }
 .i-layout-header-breadcrumb .white .ivu-breadcrumb-item-link {
-    color: #ffffff!important;//wheat
+  color: #ffffff !important; //wheat
 }
-.ivu-icon-ios-home{
+.ivu-icon-ios-home {
   font-size: 20px;
 }
-.white{
-  color: #ffffff!important;
+.white {
+  color: #ffffff !important;
 }
 .product-layout {
   .i-layout-content {
     padding: 5px 10px;
   }
+  .i-tabs {
+    width: 100% !important;
+    height: 40px;
+  }
   .ivu-layout-header {
     height: 50px;
     line-height: 50px;

pages/order/quotation/index.vue

@@ -363,7 +363,7 @@ export default {
   },
   created() {
     this.treeHeight = window.innerHeight - 140;
-    this.tableHeight = window.innerHeight - 210;
+    this.tableHeight = window.innerHeight - 250;
     this.newColumn = this.column;
     this.tableTata(this.selectName);
   },
@@ -376,7 +376,7 @@ export default {
       return (() => {
         window.screenHeight = window.innerHeight;
         this.treeHeight = window.screenHeight - 140;
-        this.tableHeight = window.innerHeight - 210;
+        this.tableHeight = window.innerHeight - 250;
       })();
     };
   },