add footer-nav

examples/components/footer-nav.vue

@@ -0,0 +1,105 @@
+<template>
+  <div class="footer-nav">
+    <span
+      v-if="leftNav"
+      class="footer-nav-link footer-nav-left"
+      @click="handleNavClick('prev')">
+      <i class="el-icon-arrow-left"></i>
+      {{ leftNav.title || leftNav.name }}
+    </span>
+    <span
+      v-if="rightNav"
+      class="footer-nav-link footer-nav-right"
+      @click="handleNavClick('next')">
+      {{ rightNav.title || rightNav.name }}
+      <i class="el-icon-arrow-right"></i>
+    </span>
+  </div>
+</template>
+
+<style>
+  .footer-nav {
+    padding: 24px;
+    color: #99a9bf;
+    font-size: 14px;
+    
+    &::after {
+      content: '';
+      display: block;
+      clear: both;
+    }
+     
+    & i {
+      color: #d9def1;
+      vertical-align: baseline;
+    }
+  }
+  
+  .footer-nav-link {
+    cursor: pointer;
+    
+    &:hover {
+      color: #5e6d82;
+     
+      & i {
+        color: #5e6d82;
+      }
+    }
+  }
+  
+  .footer-nav-left {
+    float: left;
+  }
+  
+  .footer-nav-right {
+    float: right;
+  }
+</style>
+
+<script>
+  import navConfig from '../nav.config.json';
+
+  export default {
+    data() {
+      return {
+        currentComponent: null,
+        nav: [],
+        currentIndex: -1,
+        leftNav: null,
+        rightNav: null
+      };
+    },
+
+    watch: {
+      '$route.path'() {
+        this.updateNav();
+      }
+    },
+
+    methods: {
+      updateNav() {
+        this.currentComponent = '/' + this.$route.path.split('/')[2];
+        for (let i = 0, len = this.nav.length; i < len; i++) {
+          if (this.nav[i].path === this.currentComponent) {
+            this.currentIndex = i;
+            break;
+          }
+        }
+        this.leftNav = this.nav[this.currentIndex - 1];
+        this.rightNav = this.nav[this.currentIndex + 1];
+      },
+
+      handleNavClick(direction) {
+        this.$router.push(`/component${ direction === 'prev' ? this.leftNav.path : this.rightNav.path }`);
+      }
+    },
+
+    created() {
+      navConfig[0].groups.map(group => group.list).forEach(list => {
+        this.nav = this.nav.concat(list);
+      });
+      this.nav = this.nav.concat(navConfig[1].children);
+      this.updateNav();
+    }
+  }
+</script>

examples/docs/pagination.md

@@ -14,7 +14,7 @@
   </el-pagination>
 </div>
 <div class="block">
-  <span class="demonstration">大于7页时的效果</span>
+  <span class="demonstration">大于 7 页时的效果</span>
     <el-pagination
       layout="prev, pager, next"
       :total="1000">
@@ -129,7 +129,7 @@
   }
 </script>
 <style>
-  .demo-pagination .first {
+  .demo-pagination .source.first {
     padding: 0;
     display: flex;
   }
@@ -152,7 +152,7 @@
     margin-bottom: 20px;
   }
 
-  .demo-pagination .last {
+  .demo-pagination .source.last {
     padding: 0;
   }
 
@@ -174,7 +174,7 @@
   .demo-pagination .last .demonstration + .el-pagination {
     float: right;
     width: 70%;
-    margin-right: 20px;
+    margin: 5px 20px 0 0;
   }
 </style>
 

examples/entry.js

@@ -8,6 +8,7 @@ import demoBlock from './components/demo-block.vue';
 import MainFooter from './components/footer.vue';
 import MainHeader from './components/header.vue';
 import SideNav from './components/side-nav';
+import FooterNav from './components/footer-nav';
 
 Vue.use(Element);
 Vue.use(VueRouter);
@@ -15,6 +16,7 @@ Vue.component('demo-block', demoBlock);
 Vue.component('main-footer', MainFooter);
 Vue.component('main-header', MainHeader);
 Vue.component('side-nav', SideNav);
+Vue.component('footer-nav', FooterNav);
 
 const scrollBehavior = (to, from, savedPosition) => {
   if (savedPosition) {

examples/nav.config.json

@@ -6,7 +6,7 @@
       "list": [
         {
           "path": "/layout",
-          "name": "按钮 (button)",
+          "name": "布局 (layout)",
           "title": "Layout 布局",
           "description": ""
         },

examples/pages/component.vue

@@ -45,6 +45,7 @@
       </el-col>
       <el-col :span="18">
         <router-view class="content"></router-view>
+        <footer-nav></footer-nav>
       </el-col>
     </el-row>
   </div>
@@ -56,9 +57,6 @@
       return {
         navsData: navs
       };
-    },
-    updated() {
-      console.log(this.navsData);
     }
   };
 </script>

packages/table/src/table-body.js

@@ -120,11 +120,7 @@ export default {
       // 判断是否text-overflow, 如果是就显示tooltip
       const cellChild = getChild(event);
 
-      if (cellChild.scrollWidth > cellChild.offsetWidth) {
+      this.tooltipDisabled = cellChild.scrollWidth <= cellChild.offsetWidth;
-        this.tooltipDisabled = false;
-      } else {
-        this.tooltipDisabled = true;
-      }
     },
 
     handleCellMouseLeave(event) {

packages/theme-default/src/pagination.css

@@ -108,7 +108,7 @@
     }
 
     @e total {
-      margin-left: 10px;
+      margin: 0 10px;
     }
 
     @e rightwrapper {