diff --git a/docs/zh/ecosystem-d2-crud/example.md b/docs/zh/ecosystem-d2-crud/example.md
index a5f2b910..fd81237e 100644
--- a/docs/zh/ecosystem-d2-crud/example.md
+++ b/docs/zh/ecosystem-d2-crud/example.md
@@ -13,3 +13,5 @@
 | 单选 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo9) |
 | 多选 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo10) |
 | 排序 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo11) |
+| 筛选 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo12) |
+| 展开行 | [点我查看](https://fairyever.gitee.io/d2-admin-preview/#/demo/d2-crud/demo13) |
diff --git a/src/menu/modules/demo-d2-crud.js b/src/menu/modules/demo-d2-crud.js
index 8c9c41d6..0b4d924e 100644
--- a/src/menu/modules/demo-d2-crud.js
+++ b/src/menu/modules/demo-d2-crud.js
@@ -15,6 +15,7 @@ export default {
     { path: `${pre}demo9`, title: '单选' },
     { path: `${pre}demo10`, title: '多选' },
     { path: `${pre}demo11`, title: '排序' },
-    { path: `${pre}demo12`, title: '筛选' }
+    { path: `${pre}demo12`, title: '筛选' },
+    { path: `${pre}demo13`, title: '表尾合计行' }
   ])('/demo/d2-crud/')
 }
diff --git a/src/pages/demo/d2-crud/demo10/index.vue b/src/pages/demo/d2-crud/demo10/index.vue
index 85b7b10b..84f3fb41 100644
--- a/src/pages/demo/d2-crud/demo10/index.vue
+++ b/src/pages/demo/d2-crud/demo10/index.vue
@@ -73,13 +73,3 @@ export default {
   }
 }
 </script>
-
-<style>
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.el-table .success-row {
-  background: #f0f9eb;
-}
-</style>
diff --git a/src/pages/demo/d2-crud/demo11/index.vue b/src/pages/demo/d2-crud/demo11/index.vue
index 4621a1b7..99e79f8c 100644
--- a/src/pages/demo/d2-crud/demo11/index.vue
+++ b/src/pages/demo/d2-crud/demo11/index.vue
@@ -74,13 +74,3 @@ export default {
   }
 }
 </script>
-
-<style>
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.el-table .success-row {
-  background: #f0f9eb;
-}
-</style>
diff --git a/src/pages/demo/d2-crud/demo12/index.vue b/src/pages/demo/d2-crud/demo12/index.vue
index 3a291e1c..9ccad190 100644
--- a/src/pages/demo/d2-crud/demo12/index.vue
+++ b/src/pages/demo/d2-crud/demo12/index.vue
@@ -82,13 +82,3 @@ export default {
   }
 }
 </script>
-
-<style>
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.el-table .success-row {
-  background: #f0f9eb;
-}
-</style>
diff --git a/src/pages/demo/d2-crud/demo13/code.js b/src/pages/demo/d2-crud/demo13/code.js
new file mode 100644
index 00000000..44a8b967
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo13/code.js
@@ -0,0 +1,105 @@
+export default `<template>
+  <div>
+    <d2-crud
+      :columns="columns"
+      :data="data"
+      :options="options"/>
+  </div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      columns: [
+        {
+          title: 'ID',
+          key: 'id'
+        },
+        {
+          title: '姓名',
+          key: 'name'
+        },
+        {
+          title: '数值 1',
+          key: 'amount1'
+        },
+        {
+          title: '数值 2',
+          key: 'amount2'
+        },
+        {
+          title: '数值 3',
+          key: 'amount3'
+        }
+      ],
+      data: [
+        {
+          id: '12987122',
+          name: '王小虎',
+          amount1: '234',
+          amount2: '3.2',
+          amount3: 10
+        },
+        {
+          id: '12987123',
+          name: '王小虎',
+          amount1: '165',
+          amount2: '4.43',
+          amount3: 12
+        },
+        {
+          id: '12987124',
+          name: '王小虎',
+          amount1: '324',
+          amount2: '1.9',
+          amount3: 9
+        },
+        {
+          id: '12987125',
+          name: '王小虎',
+          amount1: '621',
+          amount2: '2.2',
+          amount3: 17
+        },
+        {
+          id: '12987126',
+          name: '王小虎',
+          amount1: '539',
+          amount2: '4.1',
+          amount3: 15
+        }
+      ],
+      options: {
+        showSummary: true,
+        summaryMethod (param) {
+          const { columns, data } = param
+          const sums = []
+          columns.forEach((column, index) => {
+            if (index === 0) {
+              sums[index] = '总价'
+              return
+            }
+            const values = data.map(item => Number(item[column.property]))
+            if (!values.every(value => isNaN(value))) {
+              sums[index] = values.reduce((prev, curr) => {
+                const value = Number(curr)
+                if (!isNaN(value)) {
+                  return prev + curr
+                } else {
+                  return prev
+                }
+              }, 0)
+              sums[index] += ' 元'
+            } else {
+              sums[index] = 'N/A'
+            }
+          })
+
+          return sums
+        }
+      }
+    }
+  }
+}
+</script>`
diff --git a/src/pages/demo/d2-crud/demo13/doc.md b/src/pages/demo/d2-crud/demo13/doc.md
new file mode 100644
index 00000000..68774891
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo13/doc.md
@@ -0,0 +1 @@
+将 `options` 中的 `showSummary` 设置为 `true` 就会在表格尾部展示合计行。默认情况下，对于合计行，第一列不进行数据求合操作，而是显示「合计」二字（可通过 `sumText` 配置），其余列会将本列所有数值进行求合操作，并显示出来。当然，你也可以定义自己的合计逻辑。使用 `summaryMethod` 并传入一个方法，返回一个数组，这个数组中的各项就会显示在合计行的各列中。代码如下：
diff --git a/src/pages/demo/d2-crud/demo13/index.vue b/src/pages/demo/d2-crud/demo13/index.vue
new file mode 100644
index 00000000..c3e457c8
--- /dev/null
+++ b/src/pages/demo/d2-crud/demo13/index.vue
@@ -0,0 +1,121 @@
+<template>
+  <d2-container>
+    <template slot="header">表尾合计行</template>
+    <d2-crud
+      :columns="columns"
+      :data="data"
+      :options="options">
+    </d2-crud>
+    <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: 'ID',
+          key: 'id'
+        },
+        {
+          title: '姓名',
+          key: 'name'
+        },
+        {
+          title: '数值 1',
+          key: 'amount1'
+        },
+        {
+          title: '数值 2',
+          key: 'amount2'
+        },
+        {
+          title: '数值 3',
+          key: 'amount3'
+        }
+      ],
+      data: [
+        {
+          id: '12987122',
+          name: '王小虎',
+          amount1: '234',
+          amount2: '3.2',
+          amount3: 10
+        },
+        {
+          id: '12987123',
+          name: '王小虎',
+          amount1: '165',
+          amount2: '4.43',
+          amount3: 12
+        },
+        {
+          id: '12987124',
+          name: '王小虎',
+          amount1: '324',
+          amount2: '1.9',
+          amount3: 9
+        },
+        {
+          id: '12987125',
+          name: '王小虎',
+          amount1: '621',
+          amount2: '2.2',
+          amount3: 17
+        },
+        {
+          id: '12987126',
+          name: '王小虎',
+          amount1: '539',
+          amount2: '4.1',
+          amount3: 15
+        }
+      ],
+      options: {
+        showSummary: true,
+        summaryMethod (param) {
+          const { columns, data } = param
+          const sums = []
+          columns.forEach((column, index) => {
+            if (index === 0) {
+              sums[index] = '总价'
+              return
+            }
+            const values = data.map(item => Number(item[column.property]))
+            if (!values.every(value => isNaN(value))) {
+              sums[index] = values.reduce((prev, curr) => {
+                const value = Number(curr)
+                if (!isNaN(value)) {
+                  return prev + curr
+                } else {
+                  return prev
+                }
+              }, 0)
+              sums[index] += ' 元'
+            } else {
+              sums[index] = 'N/A'
+            }
+          })
+
+          return sums
+        }
+      }
+    }
+  }
+}
+</script>
diff --git a/src/pages/demo/d2-crud/demo5/index.vue b/src/pages/demo/d2-crud/demo5/index.vue
index beaad070..06cf0286 100644
--- a/src/pages/demo/d2-crud/demo5/index.vue
+++ b/src/pages/demo/d2-crud/demo5/index.vue
@@ -86,13 +86,3 @@ export default {
   }
 }
 </script>
-
-<style>
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.el-table .success-row {
-  background: #f0f9eb;
-}
-</style>
diff --git a/src/pages/demo/d2-crud/demo6/index.vue b/src/pages/demo/d2-crud/demo6/index.vue
index b51f9add..4f5ea924 100644
--- a/src/pages/demo/d2-crud/demo6/index.vue
+++ b/src/pages/demo/d2-crud/demo6/index.vue
@@ -96,13 +96,3 @@ export default {
   }
 }
 </script>
-
-<style>
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.el-table .success-row {
-  background: #f0f9eb;
-}
-</style>
diff --git a/src/pages/demo/d2-crud/demo7/index.vue b/src/pages/demo/d2-crud/demo7/index.vue
index 8a0547d3..8f4721f6 100644
--- a/src/pages/demo/d2-crud/demo7/index.vue
+++ b/src/pages/demo/d2-crud/demo7/index.vue
@@ -125,13 +125,3 @@ export default {
   }
 }
 </script>
-
-<style>
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.el-table .success-row {
-  background: #f0f9eb;
-}
-</style>
diff --git a/src/pages/demo/d2-crud/demo8/index.vue b/src/pages/demo/d2-crud/demo8/index.vue
index 4acd007f..47576475 100644
--- a/src/pages/demo/d2-crud/demo8/index.vue
+++ b/src/pages/demo/d2-crud/demo8/index.vue
@@ -119,13 +119,3 @@ export default {
   }
 }
 </script>
-
-<style>
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.el-table .success-row {
-  background: #f0f9eb;
-}
-</style>
diff --git a/src/pages/demo/d2-crud/demo9/index.vue b/src/pages/demo/d2-crud/demo9/index.vue
index f1ba5874..f68228fb 100644
--- a/src/pages/demo/d2-crud/demo9/index.vue
+++ b/src/pages/demo/d2-crud/demo9/index.vue
@@ -78,13 +78,3 @@ export default {
   }
 }
 </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 41a8e526..8e62dfeb 100644
--- a/src/router/routes.js.REMOVED.git-id
+++ b/src/router/routes.js.REMOVED.git-id
@@ -1 +1 @@
-d4bcc9f74429353eb00fc5a9e835c0e86842cdfa
\ No newline at end of file
+d83b0a5150e283432ed572257131cc3dcfadd519
\ No newline at end of file