fix: #516 add dt-pagination-totalCount class (#517)

DTStack · May 31, 2023 · 2eacc49 · 2eacc49
1 parent 6430567
commit 2eacc49
Show file tree

Hide file tree

Showing 13 changed files with 25 additions and 11 deletions.
diff --git a/components/pagination/demo/basic.md b/components/pagination/demo/basic.md
@@ -9,6 +9,8 @@ title:
 
 最多显示 5 页内容，当数量多时默认显示前 5 页。
 
+- 为分页器总条数添加类名 `dt-pagination-totalCount`，高亮显示
+
 ## en-US
 
 The basic example.
@@ -19,7 +21,9 @@ import { Pagination } from 'antd';
 
 ReactDOM.render(
   <Pagination 
-    showTotal={total => `共条40数据，每页5条`}
+    showTotal={total => <span>
+        共<span className="dt-pagination-totalCount">{total}</span>条数据，每页5条
+    </span>}
     defaultCurrent={1} 
     pageSize={5}
     total={40} />,

diff --git a/components/pagination/demo/full.md b/components/pagination/demo/full.md
@@ -22,7 +22,9 @@ ReactDOM.render(
     total={85}
     showSizeChanger
     showQuickJumper
-    showTotal={total => `共条${total}数据`}
+    showTotal={total => <span>
+        共<span className="dt-pagination-totalCount">{total}</span>条数据
+    </span>}
   />,
   mountNode,
 );

diff --git a/components/pagination/demo/size.md b/components/pagination/demo/size.md
@@ -9,6 +9,7 @@ title:
 
 - 为分页器添加类名 `dt-pagination-right` ，使得分页器居右
 
+
 ```jsx
 import React from 'react';
 import { Pagination } from 'antd';
@@ -19,7 +20,9 @@ ReactDOM.render(
     total={40}
     pageSize={5}
     defaultCurrent={1}
-    showTotal={total => `共条40数据，每页5条`}
+    showTotal={total => <span>
+        共<span className="dt-pagination-totalCount">{total}</span>条数据，每页5条
+    </span>}
   />,
   mountNode,
 );

diff --git a/components/pagination/index.zh-CN.md b/components/pagination/index.zh-CN.md
@@ -15,3 +15,4 @@ cols: 1
 |类名  |说明  |使用示例  |
 |---------|---------|---------|
 |.dt-pagination-right  | 让分页器居右 | 居右 |
+|.dt-pagination-totalCount  | 高亮总条数 | 基础分页 |
diff --git a/components/table/demo/basic.md b/components/table/demo/basic.md
@@ -91,7 +91,7 @@ class App extends React.Component {
       size: 'small',
       total: 30,
       showTotal: (total) => <span>
-        共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示15条
+        共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示15条
       </span>
     };
     return (

diff --git a/components/table/demo/expand.md b/components/table/demo/expand.md
@@ -115,7 +115,7 @@ expandedRowRender = () => {
       size: 'small',
       total: 30,
       showTotal: (total) => <span>
-        共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示15条
+        共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示15条
       </span>
     }
 

diff --git a/components/table/demo/fixBase.md b/components/table/demo/fixBase.md
@@ -112,7 +112,7 @@ class App extends React.Component {
       size: 'small',
       total: isShowData ? 30 : 0,
       showTotal: (total) => <span>
-        共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示15条
+        共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示15条
       </span>
     };
     return (

diff --git a/components/table/demo/fixFooter.md b/components/table/demo/fixFooter.md
@@ -116,7 +116,7 @@ class App extends React.Component {
       size: 'small',
       total: isShowData ? 30 : 0,
       showTotal: (total) => <span>
-        共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示15条
+        共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示15条
       </span>
     };
     return (

diff --git a/components/table/demo/numberRight.md b/components/table/demo/numberRight.md
@@ -131,7 +131,7 @@ tableFooter =  () => (
         total={30}
         style={{ float: 'right' }}
         showTotal={(total) => <span>
-          共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示20条
+          共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示20条
         </span>}
       />
     </Col>

diff --git a/components/table/demo/scroll.md b/components/table/demo/scroll.md
@@ -77,7 +77,7 @@ const pagination = {
   size: 'small',
   total: 80,
   showTotal: (total) => <span>
-    共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示15条
+    共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示15条
   </span>
 }
 

diff --git a/components/table/demo/selectAndDeal.md b/components/table/demo/selectAndDeal.md
@@ -89,7 +89,7 @@ tableFooter =  () => (
         total={30}
         style={{ float: 'right' }}
         showTotal={(total) => <span>
-          共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示20条
+          共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示20条
         </span>}
       />
     </Col>

diff --git a/components/transfer/demo/basic.md b/components/transfer/demo/basic.md
@@ -44,7 +44,7 @@ const App = () => {
         size: 'small',
         total: 20,
         showTotal: (total) => <span>
-        共<span style={{ color: '#3F87FF' }}>{total}</span>条数据，每页显示15条
+        共<span className="dt-pagination-totalCount">{total}</span>条数据，每页显示15条
         </span>
     };
 

diff --git a/theme/dt-theme/default/pagination.less b/theme/dt-theme/default/pagination.less
@@ -144,3 +144,7 @@ ul.ant-pagination {
 .dt-pagination-right {
     justify-content: flex-end;
 }
+
+.dt-pagination-totalCount {
+    color: @blue;
+}