From 368dab2460ccbfbc7df75117a732d1b984441488 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?=
 <smith3816@gmail.com>
Date: Mon, 24 May 2021 14:17:50 +0800
Subject: [PATCH] feat: Table summary support sticky mode (#30631)

* chore: Bump rc-table

* feat: Patch summary fixed color

* fix: style className

* test: Update snapshot
---
 .../__tests__/__snapshots__/demo.test.js.snap | 37 ++++++++++++++++++-
 components/table/demo/sticky.md               | 20 +++++++++-
 components/table/style/index.less             | 12 ++++--
 package.json                                  |  2 +-
 4 files changed, 65 insertions(+), 6 deletions(-)

diff --git a/components/table/__tests__/__snapshots__/demo.test.js.snap b/components/table/__tests__/__snapshots__/demo.test.js.snap
index 693f61a61c..81b2e79dcf 100644
--- a/components/table/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/table/__tests__/__snapshots__/demo.test.js.snap
@@ -15882,7 +15882,7 @@ exports[`renders ./components/table/demo/sticky.md correctly 1`] = `
           class="ant-table-container"
         >
           <div
-            class="ant-table-header ant-table-sticky-header"
+            class="ant-table-header ant-table-sticky-holder"
             style="overflow:hidden;top:0"
           >
             <table
@@ -16756,6 +16756,41 @@ exports[`renders ./components/table/demo/sticky.md correctly 1`] = `
               </tbody>
             </table>
           </div>
+          <div
+            class="ant-table-summary ant-table-sticky-holder"
+            style="overflow:hidden;bottom:0"
+          >
+            <table
+              style="table-layout:fixed;visibility:hidden"
+            >
+              <colgroup />
+              <tfoot
+                class="ant-table-summary"
+              >
+                <tr>
+                  <td
+                    class="ant-table-cell ant-table-cell-fix-left ant-table-cell-fix-left-last ant-table-cell-fix-sticky"
+                    colspan="2"
+                    style="position:sticky;left:0"
+                  >
+                    Fix Left
+                  </td>
+                  <td
+                    class="ant-table-cell"
+                    colspan="8"
+                  >
+                    Scroll Context
+                  </td>
+                  <td
+                    class="ant-table-cell ant-table-cell-fix-right ant-table-cell-fix-right-first ant-table-cell-fix-sticky"
+                    style="position:sticky;right:0"
+                  >
+                    Fix Right
+                  </td>
+                </tr>
+              </tfoot>
+            </table>
+          </div>
         </div>
       </div>
       <ul
diff --git a/components/table/demo/sticky.md b/components/table/demo/sticky.md
index 4a2ff8483c..015d670dc0 100644
--- a/components/table/demo/sticky.md
+++ b/components/table/demo/sticky.md
@@ -94,7 +94,25 @@ for (let i = 0; i < 100; i++) {
 }
 
 ReactDOM.render(
-  <Table columns={columns} dataSource={data} scroll={{ x: 1500 }} sticky />,
+  <Table
+    columns={columns}
+    dataSource={data}
+    scroll={{ x: 1500 }}
+    summary={pageData => (
+      <Table.Summary fixed>
+        <Table.Summary.Row>
+          <Table.Summary.Cell index={0} colSpan={2}>
+            Fix Left
+          </Table.Summary.Cell>
+          <Table.Summary.Cell index={2} colSpan={8}>
+            Scroll Context
+          </Table.Summary.Cell>
+          <Table.Summary.Cell index={10}>Fix Right</Table.Summary.Cell>
+        </Table.Summary.Row>
+      </Table.Summary>
+    )}
+    sticky
+  />,
   mountNode,
 );
 ```
diff --git a/components/table/style/index.less b/components/table/style/index.less
index 45c604eaa3..b5d5f4b117 100644
--- a/components/table/style/index.less
+++ b/components/table/style/index.less
@@ -9,7 +9,7 @@
 @table-header-icon-color: #bfbfbf;
 @table-header-icon-color-hover: darken(@table-header-icon-color, 10%);
 @table-header-sort-active-filter-bg: lighten(@table-header-sort-active-bg, 2%);
-@table-sticky-zindex: calc(@zindex-table-fixed + 1);
+@table-sticky-zindex: (@zindex-table-fixed + 1);
 @table-sticky-scroll-bar-active-bg: fade(@table-sticky-scroll-bar-bg, 80%);
 
 .@{table-prefix-cls}-wrapper {
@@ -146,7 +146,13 @@
   }
 
   // =========================== Summary ============================
-  tfoot {
+  &-summary {
+    background: @table-bg;
+
+    div& {
+      box-shadow: 0 -@border-width-base 0 @table-border-color;
+    }
+
     > tr {
       > th,
       > td {
@@ -621,7 +627,7 @@
     }
   }
   &-sticky {
-    &-header {
+    &-holder {
       position: sticky;
       z-index: @table-sticky-zindex;
     }
diff --git a/package.json b/package.json
index 31adbb7d46..c816dd63cd 100644
--- a/package.json
+++ b/package.json
@@ -138,7 +138,7 @@
     "rc-slider": "~9.7.1",
     "rc-steps": "~4.1.0",
     "rc-switch": "~3.2.0",
-    "rc-table": "~7.14.0",
+    "rc-table": "~7.15.1",
     "rc-tabs": "~11.9.0",
     "rc-textarea": "~0.3.0",
     "rc-tooltip": "~5.1.1",