From 3188b0c740e0bdecdf5824e059f7679eea290838 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AD=99=E6=98=8A=E7=BF=94?= <673686754@qq.com>
Date: Mon, 24 Dec 2018 11:18:55 +0800
Subject: [PATCH] demo29

Former-commit-id: a9f8bbdf8b4b9f2075e005dc9a03b1171da75855 [formerly a9f8bbdf8b4b9f2075e005dc9a03b1171da75855 [formerly a9f8bbdf8b4b9f2075e005dc9a03b1171da75855 [formerly a9f8bbdf8b4b9f2075e005dc9a03b1171da75855 [formerly b3bdc87a2f18e53072592fa312e07a2ec04e719a [formerly 684b4bc4b2918167745c6f055dec0d7ccdcc4bf3]]]]]
Former-commit-id: dc666ca9fa04a27c129b44ec33fb8fc423db0f15
Former-commit-id: e6d2525875d3343098fdafb1bb9c82ed88243753
Former-commit-id: d025e35937306d24ce8e699df81d5b3b1adbe238 [formerly a22591c2cedc03954f656ab4388738b1c5037304]
Former-commit-id: d0c4aa7a71bc61439aac3dd0d10f1543678790bb
Former-commit-id: 7e1b884f39e9f0f6e364a89ec4b1840792e18fb2
Former-commit-id: bcedb771d6808168e3746eada50483b1d9c9c765
Former-commit-id: 9d76d6a9de76e409e1f34efbd1451a9291840eec
Former-commit-id: 7f6a2103013a57c5e79d8f533fff95c39e8ca7f1
---
 src/pages/demo/d2-crud/demo24/index.vue |  50 ++++-----
 src/pages/demo/d2-crud/demo29/code.js   | 134 +++++++++---------------
 src/pages/demo/d2-crud/demo29/index.vue | 127 ++++++++--------------
 3 files changed, 115 insertions(+), 196 deletions(-)

diff --git a/src/pages/demo/d2-crud/demo24/index.vue b/src/pages/demo/d2-crud/demo24/index.vue
index 30d2ec28..051eab05 100644
--- a/src/pages/demo/d2-crud/demo24/index.vue
+++ b/src/pages/demo/d2-crud/demo24/index.vue
@@ -22,54 +22,54 @@
 </template>
 
 <script>
-import doc from "./doc.md";
-import code from "./code.js";
+import doc from './doc.md'
+import code from './code.js'
 
 export default {
-  data() {
+  data () {
     return {
       filename: __filename,
       doc,
       code,
       columns: [
         {
-          title: "日期",
-          key: "date",
-          width: "180"
+          title: '日期',
+          key: 'date',
+          width: '180'
         },
         {
-          title: "姓名",
-          key: "name",
-          width: "180"
+          title: '姓名',
+          key: 'name',
+          width: '180'
         },
         {
-          title: "地址",
-          key: "address"
+          title: '地址',
+          key: 'address'
         }
       ],
       data: [
         {
-          date: "2016-05-02",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1518 弄"
+          date: '2016-05-02',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
         },
         {
-          date: "2016-05-04",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1517 弄"
+          date: '2016-05-04',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1517 弄'
         },
         {
-          date: "2016-05-01",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1519 弄"
+          date: '2016-05-01',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1519 弄'
         },
         {
-          date: "2016-05-03",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1516 弄"
+          date: '2016-05-03',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1516 弄'
         }
       ]
-    };
+    }
   }
-};
+}
 </script>
diff --git a/src/pages/demo/d2-crud/demo29/code.js b/src/pages/demo/d2-crud/demo29/code.js
index a8a10b8d..3f4e3450 100644
--- a/src/pages/demo/d2-crud/demo29/code.js
+++ b/src/pages/demo/d2-crud/demo29/code.js
@@ -1,113 +1,73 @@
 export default `<template>
   <div>
-  <d2-crud
-    :columns="columns"
-    :data="data"
-    :pagination="pagination"/>
+    <d2-crud
+      :columns="columns"
+      :data="data"
+      :loading="loading"
+      :pagination="pagination"
+      @pagination-current-change="paginationCurrentChange"/>
   </div>
 </template>
 
 <script>
+import { BusinessTable1List } from '@api/demo.business.table.1'
+
 export default {
   data () {
     return {
       columns: [
         {
-          title: 'ID',
-          key: 'id'
+          title: '卡密',
+          key: 'key',
+          width: 320
         },
         {
-          title: '日期',
-          key: 'date'
+          title: '面值',
+          key: 'value'
         },
         {
-          title: '姓名',
-          key: 'name'
+          title: '管理员',
+          key: 'admin'
         },
         {
-          title: '地址',
-          key: 'address'
-        }
-      ],
-      data: [
-        {
-          id: 1,
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          id: 2,
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        },
-        {
-          id: 3,
-          date: '2016-05-01',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1519 弄'
-        },
-        {
-          id: 4,
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1516 弄'
-        },
-        {
-          id: 5,
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          id: 6,
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        },
-        {
-          id: 7,
-          date: '2016-05-01',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1519 弄'
-        },
-        {
-          id: 8,
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1516 弄'
-        },
-        {
-          id: 9,
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          id: 10,
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        },
-        {
-          id: 11,
-          date: '2016-05-01',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1519 弄'
-        },
-        {
-          id: 12,
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1516 弄'
+          title: '创建时间',
+          key: 'dateTimeCreat'
+        },
+        {
+          title: '使用时间',
+          key: 'dateTimeUse'
         }
       ],
+      data: [],
+      loading: false,
       pagination: {
+        currentPage: 1,
         pageSize: 5,
-        layout: 'prev, pager, next, total'
+        total: 0
       }
     }
+  },
+  mounted () {
+    this.fetchData()
+  },
+  methods: {
+    paginationCurrentChange (currentPage) {
+      this.pagination.currentPage = currentPage
+      this.fetchData()
+    },
+    fetchData () {
+      this.loading = true
+      BusinessTable1List({
+        ...this.pagination
+      }).then(res => {
+        this.data = res.list
+        this.pagination.total = res.page.total
+        this.loading = false
+      }).catch(err => {
+        console.log('err', err)
+        this.loading = falser
+      })
+    }
   }
 }
 </script>`
diff --git a/src/pages/demo/d2-crud/demo29/index.vue b/src/pages/demo/d2-crud/demo29/index.vue
index 5d48fba8..525b4982 100644
--- a/src/pages/demo/d2-crud/demo29/index.vue
+++ b/src/pages/demo/d2-crud/demo29/index.vue
@@ -4,7 +4,9 @@
     <d2-crud
       :columns="columns"
       :data="data"
-      :pagination="pagination"/>
+      :loading="loading"
+      :pagination="pagination"
+      @pagination-current-change="paginationCurrentChange"/>
     <el-card shadow="never" class="d2-mb">
       <d2-markdown :source="doc"/>
     </el-card>
@@ -20,6 +22,7 @@
 <script>
 import doc from './doc.md'
 import code from './code.js'
+import { BusinessTable1List } from '@api/demo.business.table.1'
 
 export default {
   data () {
@@ -29,101 +32,57 @@ export default {
       code,
       columns: [
         {
-          title: 'ID',
-          key: 'id'
+          title: '卡密',
+          key: 'key',
+          width: 320
         },
         {
-          title: '日期',
-          key: 'date'
+          title: '面值',
+          key: 'value'
         },
         {
-          title: '姓名',
-          key: 'name'
+          title: '管理员',
+          key: 'admin'
         },
         {
-          title: '地址',
-          key: 'address'
-        }
-      ],
-      data: [
-        {
-          id: 1,
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          id: 2,
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        },
-        {
-          id: 3,
-          date: '2016-05-01',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1519 弄'
-        },
-        {
-          id: 4,
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1516 弄'
-        },
-        {
-          id: 5,
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          id: 6,
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        },
-        {
-          id: 7,
-          date: '2016-05-01',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1519 弄'
-        },
-        {
-          id: 8,
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1516 弄'
-        },
-        {
-          id: 9,
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          id: 10,
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        },
-        {
-          id: 11,
-          date: '2016-05-01',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1519 弄'
-        },
-        {
-          id: 12,
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1516 弄'
+          title: '创建时间',
+          key: 'dateTimeCreat'
+        },
+        {
+          title: '使用时间',
+          key: 'dateTimeUse'
         }
       ],
+      data: [],
+      loading: false,
       pagination: {
+        currentPage: 1,
         pageSize: 5,
-        layout: 'prev, pager, next, total'
+        total: 0
       }
     }
+  },
+  mounted () {
+    this.fetchData()
+  },
+  methods: {
+    paginationCurrentChange (currentPage) {
+      this.pagination.currentPage = currentPage
+      this.fetchData()
+    },
+    fetchData () {
+      this.loading = true
+      BusinessTable1List({
+        ...this.pagination
+      }).then(res => {
+        this.data = res.list
+        this.pagination.total = res.page.total
+        this.loading = false
+      }).catch(err => {
+        console.log('err', err)
+        this.loading = falser
+      })
+    }
   }
 }
 </script>