From f1379e707ddf66149e026e734375e2d3ae9efc27 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, 27 Aug 2018 14:30:53 +0800
Subject: [PATCH] =?UTF-8?q?d2-crud=20=E5=9B=BA=E5=AE=9A=E8=A1=A8=E5=A4=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Former-commit-id: 6e813a32d806c3153a4def37677c8a017d151e78 [formerly 6e813a32d806c3153a4def37677c8a017d151e78 [formerly 6e813a32d806c3153a4def37677c8a017d151e78 [formerly 6e813a32d806c3153a4def37677c8a017d151e78 [formerly 475b385a7c396bc6db5f2428cc40092996982ec1 [formerly 6f73e2109310b19624220cce2a255eddd82eb968]]]]]
Former-commit-id: 70c7b245c35e82091c21637d73d51abd0558ff1a
Former-commit-id: 1ab528bbc8f3ae48cb85b89fd988c2ff548a8bbf
Former-commit-id: ed732b6c562827a6701f497bc516eb7b4aad00d1 [formerly 5fa2b1e80d94f1a0a43e112308f89d6467c9b64a]
Former-commit-id: 213ba3df273d745cdbf9881c51f3181336b00c22
Former-commit-id: 37d6be18775d4cce10c02fd056a5e0452fdcc7c7
Former-commit-id: 0a40dfca74de82b788710cd5a591207bdee95c23
Former-commit-id: 0e85f76f6c36c9a03c99379055a137467f04f90d
Former-commit-id: 01450edd0e3818da8e0ced6c6815073b25f6d3f8
---
 docs/zh/ecosystem-d2-crud/example.md   |  8 ++-
 src/menu/modules/demo-d2-crud.js       |  3 +-
 src/pages/demo/d2-crud/demo5/code.js   | 73 +++++++++++++++++++
 src/pages/demo/d2-crud/demo5/doc.md    |  1 +
 src/pages/demo/d2-crud/demo5/index.vue | 98 ++++++++++++++++++++++++++
 src/router/routes.js.REMOVED.git-id    |  2 +-
 6 files changed, 180 insertions(+), 5 deletions(-)
 create mode 100644 src/pages/demo/d2-crud/demo5/code.js
 create mode 100644 src/pages/demo/d2-crud/demo5/doc.md
 create mode 100644 src/pages/demo/d2-crud/demo5/index.vue

diff --git a/docs/zh/ecosystem-d2-crud/example.md b/docs/zh/ecosystem-d2-crud/example.md
index c280f235..5aede81e 100644
--- a/docs/zh/ecosystem-d2-crud/example.md
+++ b/docs/zh/ecosystem-d2-crud/example.md
@@ -2,6 +2,8 @@
 
 | 示例 | 代码与演示 |
 | --- | --- |
-| 基础表格 | [点我查看](https://fairyever.gitee.io//d2-admin-preview/#/demo/d2-crud/demo1) |
-| 带斑马纹表格 | [点我查看](https://fairyever.gitee.io//d2-admin-preview/#/demo/d2-crud/demo2) |
-| 带边框表格 | [点我查看](https://fairyever.gitee.io//d2-admin-preview/#/demo/d2-crud/demo3) |
+| 基础表格 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo1) |
+| 带斑马纹表格 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo2) |
+| 带边框表格 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo3) |
+| 带状态表格 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo4) |
+| 固定表头 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo5) |
diff --git a/src/menu/modules/demo-d2-crud.js b/src/menu/modules/demo-d2-crud.js
index 92a28350..10a97d98 100644
--- a/src/menu/modules/demo-d2-crud.js
+++ b/src/menu/modules/demo-d2-crud.js
@@ -7,6 +7,7 @@ export default {
     { path: `${pre}demo1`, title: '基础表格' },
     { path: `${pre}demo2`, title: '带斑马纹表格' },
     { path: `${pre}demo3`, title: '带边框表格' },
-    { path: `${pre}demo4`, title: '带状态表格' }
+    { path: `${pre}demo4`, title: '带状态表格' },
+    { path: `${pre}demo5`, title: '固定表头' }
   ])('/demo/d2-crud/')
 }
diff --git a/src/pages/demo/d2-crud/demo5/code.js b/src/pages/demo/d2-crud/demo5/code.js
new file mode 100644
index 00000000..03eaf9b3
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo5/code.js
@@ -0,0 +1,73 @@
+export default `<template>
+  <div>
+    <d2-crud
+      :columns="columns"
+      :data="data"
+      :options="options"/>
+  </div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      columns: [
+        {
+          title: '日期',
+          key: 'date',
+          width: '180'
+        },
+        {
+          title: '姓名',
+          key: 'name',
+          width: '180'
+        },
+        {
+          title: '地址',
+          key: 'address'
+        }
+      ],
+      data: [
+        {
+          date: '2016-05-03',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-04',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-01',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-08',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-06',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-07',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        }
+      ],
+      options: {
+        height: '250'
+      }
+    }
+  }
+}
+</script>`
diff --git a/src/pages/demo/d2-crud/demo5/doc.md b/src/pages/demo/d2-crud/demo5/doc.md
new file mode 100644
index 00000000..27edca6f
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo5/doc.md
@@ -0,0 +1 @@
+只要在 `options` 对象中定义了 `height` 属性，即可实现固定表头的表格，而不需要额外的代码。代码如下：
\ No newline at end of file
diff --git a/src/pages/demo/d2-crud/demo5/index.vue b/src/pages/demo/d2-crud/demo5/index.vue
new file mode 100644
index 00000000..beaad070
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo5/index.vue
@@ -0,0 +1,98 @@
+<template>
+  <d2-container>
+    <template slot="header">固定表头</template>
+    <d2-crud
+      :columns="columns"
+      :data="data"
+      :options="options"/>
+    <el-card shadow="never" class="d2-mb">
+      <d2-markdown :source="doc"/>
+    </el-card>
+    <el-card shadow="never" class="d2-mb">
+      <d2-highlight :code="code"/>
+    </el-card>
+    <template slot="footer">
+      <d2-link-btn title="D2 CRUD" link="https://github.com/d2-projects/d2-crud"/>
+    </template>
+  </d2-container>
+</template>
+
+<script>
+import doc from './doc.md'
+import code from './code.js'
+
+export default {
+  data () {
+    return {
+      doc,
+      code,
+      columns: [
+        {
+          title: '日期',
+          key: 'date',
+          width: '180'
+        },
+        {
+          title: '姓名',
+          key: 'name',
+          width: '180'
+        },
+        {
+          title: '地址',
+          key: 'address'
+        }
+      ],
+      data: [
+        {
+          date: '2016-05-03',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-04',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-01',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-08',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-06',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        },
+        {
+          date: '2016-05-07',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        }
+      ],
+      options: {
+        height: '250'
+      }
+    }
+  }
+}
+</script>
+
+<style>
+.el-table .warning-row {
+  background: oldlace;
+}
+
+.el-table .success-row {
+  background: #f0f9eb;
+}
+</style>
diff --git a/src/router/routes.js.REMOVED.git-id b/src/router/routes.js.REMOVED.git-id
index b4c6f768..b88f596a 100644
--- a/src/router/routes.js.REMOVED.git-id
+++ b/src/router/routes.js.REMOVED.git-id
@@ -1 +1 @@
-8b9146b67b3500e79e3547a57199c9c38fa840e1
\ No newline at end of file
+c6d31f3d245387ef99e06f8e7d1b7a66cd18121d
\ No newline at end of file