合并标题后的合计,且支持多字段统计

demo/demolist/Demo18.js

@@ -0,0 +1,119 @@
+/**
+ *
+ * @title 合并标题后的合计,且支持多字段统计
+ * @description 合计（通过使用的封装好的功能方法实现复杂功能，简单易用！）
+ *
+ */
+
+import React, { Component } from "react";
+import Table from "../../src"; 
+import sum from "../../src/lib/sum.js";
+ 
+let ComplexTable = sum(Table);
+
+const columns = [
+  {
+    title: "Name",
+    dataIndex: "name",
+    key: "name",
+    width: 100,
+    fixed: "left"
+  },
+  {
+    title: "Other",
+    children: [
+      {
+        title: "Age",
+        dataIndex: "age",
+        key: "age",
+        width: 200,
+        sumCol: true,
+      },
+      {
+        title: "Address",
+        children: [
+          {
+            title: "Street",
+            dataIndex: "street",
+            key: "street",
+            width: 200
+          },
+          {
+            title: "Block",
+            children: [
+              {
+                title: "Building",
+                dataIndex: "building",
+                key: "building",
+                width: 100
+              },
+              {
+                title: "Door No.",
+                dataIndex: "number",
+                key: "number",
+                width: 100,
+                sumCol: true,
+              }
+            ]
+          }
+        ]
+      }
+    ]
+  },
+  {
+    title: "Company",
+    children: [
+      {
+        title: "Company Address",
+        dataIndex: "companyAddress",
+        key: "companyAddress"
+      },
+      {
+        title: "Company Name",
+        dataIndex: "companyName",
+        key: "companyName"
+      }
+    ]
+  },
+  {
+    title: "Gender",
+    dataIndex: "gender",
+    key: "gender",
+    width: 60,
+    fixed: "right"
+  }
+];
+
+const data = [];
+for (let i = 0; i < 5; i++) {
+  data.push({
+    key: i,
+    name: "John Brown",
+    age: i + 1,
+    street: "Lake Park",
+    building: "C",
+    number: 2035,
+    companyAddress: "Lake Street 42",
+    companyName: "SoftLake Co",
+    gender: "M"
+  });
+}
+
+class Demo18 extends Component {
+   
+  render() {
+    let multiObj = {
+      type: "checkbox"
+    };
+    return (
+      <div>
+         <ComplexTable 
+          columns={columns}
+          data={data}
+          bordered
+        />
+      </div>
+    );
+  }
+}
+export default Demo18;

src/lib/sum.js

@@ -12,6 +12,8 @@ export default function sum(Table) {
     //无状态
     constructor(props) {
       super(props);
+      //array , tree
+      this.tableType = "array";
     }
     //合计数字列,并将计算所得数据存储到一个obj对象中
     currentFooter = () => {
@@ -53,6 +55,67 @@ export default function sum(Table) {
       });
       return <Table{...this.props} loading={false} footerScroll showHeader={false} columns={columns_sum} data={obj} />;
     };
+
+    currentTreeFooter =()=>{
+      const {columns,data} = this.props;
+      let _columns = [];
+      this.getNodeItem(columns,_columns);
+      let _countObj = {};
+      for (let column of _columns) {
+        if (typeof column.render == "function" && !column.sumCol) {
+          column.render = "";
+        }
+        if(column.sumCol){
+          let count = 0;
+          data.forEach((da,i)=>{
+            let _num = da[column.key];
+            count += _num;
+          })
+          _countObj[column.key] = count;
+        }
+      }
+      let _sumArray = [{key:"sumData",showSum:"合计",..._countObj}];
+      columns[0] = Object.assign({}, columns[0], columns2);
+      return <Table{...this.props} bordered={false} loading={false} footerScroll showHeader={false} columns={columns} data={_sumArray} />;
+    }
+
+    getNodeItem =(array,newArray)=>{
+      array.forEach((da,i)=>{
+        if(da.children){
+          this.getNodeItem(da.children,newArray);
+        }else{
+          newArray.push(da);
+        }
+      });
+    }
+
+    /**
+     * 获取当前的表格类型。
+     * 
+     */
+    getTableType=()=>{
+      const {columns} = this.props;
+      let type = "array";
+      columns.find((da,i)=>{
+        if(da.children){
+          type = "tree";
+          return type;
+        }
+      })
+      return type;
+    }
+
+    setFooterRender=()=>{
+      const {columns} = this.props;
+      if (!Array.isArray(columns)) {console.log("data type is error !");return;}
+      let type = this.getTableType();
+      if(type == "tree"){
+        return this.currentTreeFooter();
+      }else{
+        return this.currentFooter();
+      }
+    }
+
     render() {
       return (
         <Table
@@ -60,7 +123,7 @@ export default function sum(Table) {
           footerScroll
           columns={this.props.columns}
           data={this.props.data}
-          footer={this.currentFooter}
+          footer={this.setFooterRender}
         />
       );
     }