Browse Source

feat: s-table Page URI mode

Sendya 6 years ago
parent
commit
201f1884a5
2 changed files with 21 additions and 5 deletions
  1. 20 4
      src/components/Table/index.js
  2. 1 1
      src/config/router.config.js

+ 20 - 4
src/components/Table/index.js

@@ -17,7 +17,7 @@ export default {
   props: Object.assign({}, T.props, {
     rowKey: {
       type: [String, Function],
-      default: 'id'
+      default: 'key'
     },
     data: {
       type: Function,
@@ -40,7 +40,7 @@ export default {
       default: 'default'
     },
     /**
-     * {
+     * alert: {
      *   show: true,
      *   clear: Function
      * }
@@ -61,11 +61,25 @@ export default {
     showPagination: {
       type: String | Boolean,
       default: 'auto'
+    },
+    /**
+     * enable page URI mode
+     *
+     * e.g:
+     * /users/1
+     * /users/2
+     * /users/3?queryParam=test
+     * ...
+     */
+    pageURI: {
+      type: Boolean,
+      default: false
     }
   }),
   watch: {
     'localPagination.current' (val) {
-      this.$router.push({
+      this.pageURI && this.$router.push({
+        ...this.$route,
         name: this.$route.name,
         params: Object.assign({}, this.$route.params, {
           pageNo: val
@@ -89,8 +103,10 @@ export default {
     }
   },
   created () {
+    const { pageNo } = this.$route.params
+    const localPageNum = this.pageURI && (pageNo && parseInt(pageNo)) || this.pageNum
     this.localPagination = ['auto', true].includes(this.showPagination) && Object.assign({}, this.localPagination, {
-      current: this.pageNum,
+      current: localPageNum,
       pageSize: this.pageSize,
       showSizeChanger: this.showSizeChanger
     })

+ 1 - 1
src/config/router.config.js

@@ -77,7 +77,7 @@ export const asyncRouterMap = [
         meta: { title: '列表页', icon: 'table', permission: [ 'table' ] },
         children: [
           {
-            path: '/list/table-list',
+            path: '/list/table-list/:pageNo([1-9]\\d*)?',
             name: 'TableListWrapper',
             hideChildrenInMenu: true, // 强制显示 MenuItem 而不是 SubMenu
             component: () => import('@/views/list/TableList'),