From b3619cae597ee13ecc6ce6c8269422b2e7a798e1 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 15:03:21 +0800
Subject: [PATCH] =?UTF-8?q?d2-crud=20=E5=9B=BA=E5=AE=9A=E5=88=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Former-commit-id: 9580078744e0754596b1fd6033b8f629bafc7586 [formerly 9580078744e0754596b1fd6033b8f629bafc7586 [formerly 9580078744e0754596b1fd6033b8f629bafc7586 [formerly 9580078744e0754596b1fd6033b8f629bafc7586 [formerly fe9bf4599ffb224a6983b1cc4434e6c484b4aaa8 [formerly d52c371ee5984497d6809af06233ab6943f03806]]]]]
Former-commit-id: b36975c128f03f42e521e4b52f2ab0ec74d59d92
Former-commit-id: 0cf7a415bfc607d50498df9493dca7e9f06e40d8
Former-commit-id: 9ef0b33daa0298a5c8139c9929dcd711e3930a12 [formerly 19aab21ccb172f8eabc8213773af1568b544b02d]
Former-commit-id: 5fd16510be907a6ad52fe17f19f4b300eb36ec9f
Former-commit-id: 49627931456a9a76b3cc60ff51737af1359c5b76
Former-commit-id: a8086c569b6372ad64d7c5218193a7866d4aad9d
Former-commit-id: 9913f1ff9966abe7df7c12d18019afdc2db1ac03
Former-commit-id: 7d8d50c492d0a008d3a041e323aac2746bfc08e1
---
 docs/zh/ecosystem-d2-crud/example.md   |   1 +
 src/menu/modules/demo-d2-crud.js       |   3 +-
 src/pages/demo/d2-crud/demo6/code.js   |  83 +++++++++++++++++++
 src/pages/demo/d2-crud/demo6/doc.md    |   1 +
 src/pages/demo/d2-crud/demo6/index.vue | 108 +++++++++++++++++++++++++
 src/router/routes.js.REMOVED.git-id    |   2 +-
 6 files changed, 196 insertions(+), 2 deletions(-)
 create mode 100644 src/pages/demo/d2-crud/demo6/code.js
 create mode 100644 src/pages/demo/d2-crud/demo6/doc.md
 create mode 100644 src/pages/demo/d2-crud/demo6/index.vue

diff --git a/docs/zh/ecosystem-d2-crud/example.md b/docs/zh/ecosystem-d2-crud/example.md
index 5aede81e..3e0e55de 100644
--- a/docs/zh/ecosystem-d2-crud/example.md
+++ b/docs/zh/ecosystem-d2-crud/example.md
@@ -7,3 +7,4 @@
 | 带边框表格 | [点我查看](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) |
+| 固定列 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo6) |
diff --git a/src/menu/modules/demo-d2-crud.js b/src/menu/modules/demo-d2-crud.js
index 10a97d98..c0a064c7 100644
--- a/src/menu/modules/demo-d2-crud.js
+++ b/src/menu/modules/demo-d2-crud.js
@@ -8,6 +8,7 @@ export default {
     { path: `${pre}demo2`, title: '带斑马纹表格' },
     { path: `${pre}demo3`, title: '带边框表格' },
     { path: `${pre}demo4`, title: '带状态表格' },
-    { path: `${pre}demo5`, title: '固定表头' }
+    { path: `${pre}demo5`, title: '固定表头' },
+    { path: `${pre}demo6`, title: '固定列' }
   ])('/demo/d2-crud/')
 }
diff --git a/src/pages/demo/d2-crud/demo6/code.js b/src/pages/demo/d2-crud/demo6/code.js
new file mode 100644
index 00000000..ddc91de9
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo6/code.js
@@ -0,0 +1,83 @@
+export default `<template>
+  <div>
+    <d2-crud
+      :columns="columns"
+      :data="data"/>
+  </div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      columns: [
+        {
+          title: '日期',
+          key: 'date',
+          width: '180',
+          fixed: true
+        },
+        {
+          title: '姓名',
+          key: 'name',
+          width: '180'
+        },
+        {
+          title: '省份',
+          key: 'province',
+          width: '300'
+        },
+        {
+          title: '市区',
+          key: 'city',
+          width: '300'
+        },
+        {
+          title: '地址',
+          key: 'address',
+          width: '300'
+        },
+        {
+          title: '邮编',
+          key: 'zip',
+          fixed: 'right'
+        }
+      ],
+      data: [
+        {
+          date: '2016-05-03',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-04',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-01',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        }
+      ]
+    }
+  }
+}
+</script>`
diff --git a/src/pages/demo/d2-crud/demo6/doc.md b/src/pages/demo/d2-crud/demo6/doc.md
new file mode 100644
index 00000000..1cf1f937
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo6/doc.md
@@ -0,0 +1 @@
+固定列需要在 `columns` 对象数组中给需要固定的列传入 `fixed` 属性，它接受 `Boolean` 值或者 `left` `right` ，表示左边固定还是右边固定。代码如下：
\ No newline at end of file
diff --git a/src/pages/demo/d2-crud/demo6/index.vue b/src/pages/demo/d2-crud/demo6/index.vue
new file mode 100644
index 00000000..b51f9add
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo6/index.vue
@@ -0,0 +1,108 @@
+<template>
+  <d2-container>
+    <template slot="header">固定列</template>
+    <d2-crud
+      :columns="columns"
+      :data="data"/>
+    <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',
+          fixed: true
+        },
+        {
+          title: '姓名',
+          key: 'name',
+          width: '180'
+        },
+        {
+          title: '省份',
+          key: 'province',
+          width: '300'
+        },
+        {
+          title: '市区',
+          key: 'city',
+          width: '300'
+        },
+        {
+          title: '地址',
+          key: 'address',
+          width: '300'
+        },
+        {
+          title: '邮编',
+          key: 'zip',
+          fixed: 'right'
+        }
+      ],
+      data: [
+        {
+          date: '2016-05-03',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-04',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-01',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        }
+      ]
+    }
+  }
+}
+</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 b88f596a..b6ed8a9a 100644
--- a/src/router/routes.js.REMOVED.git-id
+++ b/src/router/routes.js.REMOVED.git-id
@@ -1 +1 @@
-c6d31f3d245387ef99e06f8e7d1b7a66cd18121d
\ No newline at end of file
+acdde45a330bcab093eb4d812dc4966c000537f1
\ No newline at end of file