@zat-design/sisyphus-react 3.0.16-beta.2 → 3.1.4

package/es/ProTable/style/index.less

@@ -1,4 +1,42 @@
 .pro-table {
+  &.pro-table-bordered {
+    .ant-table .ant-table-thead>tr>th {
+      border-bottom: 1px solid #f0f0f0
+    }
+
+    .ant-table>.ant-table-container>.ant-table-content>table,
+    .ant-table>.ant-table-container>.ant-table-header>table {
+      border-top: 1px solid rgba(0, 0, 0, 0.06);
+    }
+
+    .ant-table>.ant-table-container>.ant-table-content>table>thead>tr>th,
+    .ant-table>.ant-table-container>.ant-table-header>table>thead>tr>th,
+    .ant-table>.ant-table-container>.ant-table-body>table>thead>tr>th,
+    .ant-table>.ant-table-container>.ant-table-summary>table>thead>tr>th,
+    .ant-table>.ant-table-container>.ant-table-content>table>tbody>tr>td,
+    .ant-table>.ant-table-container>.ant-table-header>table>tbody>tr>td,
+    .ant-table>.ant-table-container>.ant-table-body>table>tbody>tr>td,
+    .ant-table>.ant-table-container>.ant-table-summary>table>tbody>tr>td,
+    .ant-table>.ant-table-container>.ant-table-content>table>tfoot>tr>th,
+    .ant-table>.ant-table-container>.ant-table-header>table>tfoot>tr>th,
+    .ant-table>.ant-table-container>.ant-table-body>table>tfoot>tr>th,
+    .ant-table>.ant-table-container>.ant-table-summary>table>tfoot>tr>th,
+    .ant-table>.ant-table-container>.ant-table-content>table>tfoot>tr>td,
+    .ant-table>.ant-table-container>.ant-table-header>table>tfoot>tr>td,
+    .ant-table>.ant-table-container>.ant-table-body>table>tfoot>tr>td,
+    .ant-table>.ant-table-container>.ant-table-summary>table>tfoot>tr>td {
+      border-right: 1px solid rgba(0, 0, 0, 0.06);
+    }
+
+    .ant-table .ant-table-tbody>tr:not(.ant-table-measure-row)>td {
+      border-bottom: 1px solid #f0f0f0;
+    }
+
+    .ant-table>.ant-table-container {
+      border-left: 1px solid rgba(0, 0, 0, 0.06);
+    }
+  }
+
   .custom-column-btn {
     display    : inline-flex;
     align-items: center;
@@ -48,7 +86,7 @@
 
   &.pro-table-no-stripe {
     .ant-table.ant-table-scroll-horizontal .ant-table-tbody .ant-table-row:nth-child(n)>td {
-      background: #fff;
+      background: var(--zaui-base-bg, #ffffff);
     }
   }
 
@@ -156,17 +194,36 @@
       align-items: center;
 
       .icon-tip {
-        svg {
-          margin-left   : 8px;
-          width         : 14px;
-          height        : 14px;
-          vertical-align: text-bottom;
-          fill          : #909090;
+
+        div {
+          width : 14px;
+          height: 14px;
+
+          svg {
+            margin-left: 8px;
+            width      : 14px;
+            height     : 14px;
+            fill       : #909090;
+          }
         }
       }
     }
   }
 
+  .ant-table.ant-table-bordered {
+    .ant-table-thead>tr>th {
+      border-bottom: 1px solid #f0f0f0;
+    }
+
+    .ant-table-tbody>tr:not(.ant-table-placeholder)>td {
+      border-bottom: 1px solid #f0f0f0;
+    }
+
+    .ant-table-tbody>tr:not(.ant-table-measure-row)>td {
+      border-bottom: 1px solid #f0f0f0;
+    }
+  }
+
   .ant-table-tbody .ant-table-placeholder {
     background: var(--zaui-base-bg, #ffffff) !important;
   }
@@ -233,7 +290,7 @@
   }
 
   .ant-pagination .ant-pagination-item-active a {
-    color        : #fff;
+    color        : #ffffff;
     background   : var(--zaui-brand, #006aff) !important;
     border-radius: var(--zaui-border-radius, 4px);
   }
@@ -259,29 +316,6 @@
   }
 }
 
-.setting-overlay {
-  .column-setting-title {
-    display        : flex;
-    align-items    : center;
-    justify-content: space-between;
-  }
-
-  .ant-popover-inner-content {
-    max-height: 280px;
-    overflow-y: auto;
-  }
-
-  .column-checkbox-item {
-    display        : flex;
-    align-items    : center;
-    justify-content: space-between;
-
-    .ant-checkbox-wrapper {
-      font-weight: 500;
-    }
-  }
-}
-
 .ant-dropdown-placement-bottomLeft {
   .ant-dropdown-menu-vertical.ant-dropdown-menu-light {
 
@@ -291,4 +325,4 @@
       }
     }
   }
-}
+}

package/es/ProTable/useAntdTable.d.ts

@@ -2,10 +2,12 @@ import { Key } from 'react';
 import { useRequest } from 'ahooks';
 import { RequestOptions, Service } from './propsType';
 declare function useAntdTable<I, R extends Record<string, any>, S extends Service<I, R>>(service: S, options?: RequestOptions<I, R>, useRequestOptions?: Parameters<typeof useRequest>[1]): {
-    data: any;
+    data: R[];
     params: any;
     rowSelection: {
-        type: import("antd/lib/table/interface").RowSelectionType;
+        fixed: boolean;
+        type: import("antd/es/table/interface").RowSelectionType;
+        columnWidth: number;
         selectedRowKeys: Key[];
         onChange(rowKeys: Key[], rows: any[]): void;
         onSelectAll: (selected: boolean) => void;
@@ -32,20 +34,22 @@ declare function useAntdTable<I, R extends Record<string, any>, S extends Servic
         showSizeChanger: boolean;
         showQuickJumper: boolean;
         onPaginationChange: boolean;
-        total: any;
+        total: number;
         showTotal: (total: any) => string;
         onShowSizeChange: (current: number, pageSize: number) => void;
         onChange: (current: number, pageSize: number) => void;
     };
     onReset: () => void;
     onSearch: (values: any) => void;
-    refresh: () => void;
+    refresh: () => Promise<void>;
     tableProps: {
         rowKey: string | import("rc-table/lib/interface").GetRowKey<R>;
         loading: boolean;
-        dataSource: any;
+        dataSource: R[];
         rowSelection: {
-            type: import("antd/lib/table/interface").RowSelectionType;
+            fixed: boolean;
+            type: import("antd/es/table/interface").RowSelectionType;
+            columnWidth: number;
             selectedRowKeys: Key[];
             onChange(rowKeys: Key[], rows: any[]): void;
             onSelectAll: (selected: boolean) => void;
@@ -64,7 +68,7 @@ declare function useAntdTable<I, R extends Record<string, any>, S extends Servic
             showSizeChanger: boolean;
             showQuickJumper: boolean;
             onPaginationChange: boolean;
-            total: any;
+            total: number;
             showTotal: (total: any) => string;
             onShowSizeChange: (current: number, pageSize: number) => void;
             onChange: (current: number, pageSize: number) => void;

package/es/ProTable/useAntdTable.js

@@ -1,13 +1,17 @@
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import "antd/es/message/style";
+import _message from "antd/es/message";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 var _excluded = ["page", "filters", "sorter"];
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import { useRequest, useSetState, useDeepCompareEffect } from 'ahooks';
+import { pickBy } from 'lodash';
 import { defaultPage } from './index';
+import { isListResult } from './utils';
 var useDefaultOptions = function useDefaultOptions(options) {
   var _useState = useState((options === null || options === void 0 ? void 0 : options.page) || defaultPage),
     _useState2 = _slicedToArray(_useState, 2),
@@ -21,6 +25,8 @@ var useDefaultOptions = function useDefaultOptions(options) {
 };
 function useAntdTable(service, options, useRequestOptions) {
   var _useSetState = useSetState({
+      data: [],
+      total: 0,
       selectedRecords: [],
       selectedRowKeys: [],
       searchValues: undefined,
@@ -29,6 +35,8 @@ function useAntdTable(service, options, useRequestOptions) {
     }),
     _useSetState2 = _slicedToArray(_useSetState, 2),
     _useSetState2$ = _useSetState2[0],
+    data = _useSetState2$.data,
+    total = _useSetState2$.total,
     selectedRecords = _useSetState2$.selectedRecords,
     selectedRowKeys = _useSetState2$.selectedRowKeys,
     searchValues = _useSetState2$.searchValues,
@@ -57,10 +65,8 @@ function useAntdTable(service, options, useRequestOptions) {
   var defaultParam = Array.isArray(defaultParams) ? defaultParams === null || defaultParams === void 0 ? void 0 : defaultParams[0] : defaultParams || {};
   var initPage = (options === null || options === void 0 ? void 0 : options.page) || defaultPage;
   var getTransformParams = useCallback(function (params) {
+    var _pickBy;
     var realParams = _objectSpread(_objectSpread(_objectSpread({}, defaultParam), extraParams), params);
-    if (transformParams) {
-      return transformParams(realParams);
-    }
     var _realParams$page = realParams.page,
       page = _realParams$page === void 0 ? initPage : _realParams$page,
       filters = realParams.filters,
@@ -70,9 +76,15 @@ function useAntdTable(service, options, useRequestOptions) {
       filters: JSON.stringify(filters) === '{}' ? undefined : filters,
       sorter: JSON.stringify(sorter) === '{}' ? undefined : sorter
     }, otherParams);
-    return _objectSpread(_objectSpread({}, page), {}, {
-      queryBean: queryBean !== null && queryBean !== void 0 ? queryBean : {}
+    var requestParams = _objectSpread(_objectSpread({}, page), {}, {
+      queryBean: (_pickBy = pickBy(queryBean, function (item) {
+        return item !== undefined;
+      })) !== null && _pickBy !== void 0 ? _pickBy : {}
     });
+    if (transformParams) {
+      return transformParams(realParams, requestParams);
+    }
+    return requestParams;
   }, [defaultParam, extraParams]);
   var params = useMemo(function () {
     var newQueryBean = _objectSpread(_objectSpread({}, searchValues), extraFilter);
@@ -83,25 +95,32 @@ function useAntdTable(service, options, useRequestOptions) {
   // 调接口
   var result = useRequest(service, _objectSpread(_objectSpread({}, useRequestOptions), {}, {
     debounceWait: 50,
-    defaultParams: [getTransformParams()]
+    defaultParams: [getTransformParams()],
+    onSuccess: function onSuccess(res, params) {
+      var transformResult = transformResponse ? transformResponse(res) : res || {};
+      var _ref2 = isListResult(transformResult) ? transformResult : (transformResult === null || transformResult === void 0 ? void 0 : transformResult.data) || {},
+        _ref2$list = _ref2.list,
+        list = _ref2$list === void 0 ? [] : _ref2$list,
+        _ref2$total = _ref2.total,
+        total = _ref2$total === void 0 ? 0 : _ref2$total;
+      if (list !== null && !Array.isArray(list)) {
+        return _message.error('请返回正确的数据类型');
+      }
+      setState({
+        total: total,
+        data: list || []
+      });
+      if (useRequestOptions === null || useRequestOptions === void 0 ? void 0 : useRequestOptions.onSuccess) {
+        useRequestOptions.onSuccess(res, params);
+      }
+    }
   }));
-  var _result$data = result.data,
-    data = _result$data === void 0 ? {} : _result$data,
-    run = result.run,
-    refresh = result.refresh;
-  var _ref2 = transformResponse ? transformResponse(data) : data || {},
-    _ref2$data = _ref2.data,
-    dataSource = _ref2$data === void 0 ? {} : _ref2$data;
-  var _ref3 = dataSource || {},
-    _ref3$list = _ref3.list,
-    newList = _ref3$list === void 0 ? [] : _ref3$list,
-    _ref3$total = _ref3.total,
-    total = _ref3$total === void 0 ? 0 : _ref3$total;
+  var run = result.run,
+    refreshAsync = result.refreshAsync;
   var curService = useMemo(function () {
     return service.toString();
   }, [service]);
   // service变化时触发 (禁止掉防止service变更时导致的死循环)
-  // const prevService = usePrevious(curService);
   var clearSelected = useCallback(function () {
     setState({
       allSelected: false,
@@ -109,9 +128,9 @@ function useAntdTable(service, options, useRequestOptions) {
       selectedRowKeys: []
     });
   }, []);
-  useEffect(function () {
+  useDeepCompareEffect(function () {
     if (allSelected) {
-      var filterList = newList.filter(function (item) {
+      var filterList = data.filter(function (item) {
         return !selectedRowKeys.includes(item === null || item === void 0 ? void 0 : item[rowKey]);
       });
       setState({
@@ -121,7 +140,7 @@ function useAntdTable(service, options, useRequestOptions) {
         })))
       });
     }
-  }, [allSelected, newList]);
+  }, [allSelected, data]);
   // 分页变更
   var handlePageChange = useCallback(function (current, pageSize) {
     var page = {
@@ -138,7 +157,7 @@ function useAntdTable(service, options, useRequestOptions) {
     run(getTransformParams(_objectSpread(_objectSpread({
       page: page
     }, searchValues), extraFilter)));
-  }, [allSelected, searchValues, extraFilter, newList, getTransformParams]);
+  }, [allSelected, searchValues, extraFilter, data, getTransformParams]);
   var handleTableChange = useCallback(function (pagination, filters, sorter, extra) {
     // 跳过分页改变，使用pagination的onChange
     if (extra.action === 'paginate') {
@@ -208,14 +227,49 @@ function useAntdTable(service, options, useRequestOptions) {
       }));
     }
   }, [page.pageSize, run, resetParams, getTransformParams]);
-  var handleRefresh = function handleRefresh() {
-    setState({
-      allSelected: false,
-      selectedRecords: [],
-      selectedRowKeys: []
-    });
-    refresh();
+  var refreshPage = function refreshPage(res) {
+    var transformResult = transformResponse ? transformResponse(res) : res || {};
+    var _ref3 = isListResult(transformResult) ? transformResult : (transformResult === null || transformResult === void 0 ? void 0 : transformResult.data) || {},
+      _ref3$total = _ref3.total,
+      total = _ref3$total === void 0 ? 0 : _ref3$total;
+    var totalPage = Math.floor((total + page.pageSize - 1) / page.pageSize) || 1;
+    if (page.pageNum > totalPage) {
+      var newPage = {
+        pageNum: totalPage,
+        pageSize: page.pageSize
+      };
+      onPageChange(newPage);
+      run(getTransformParams({
+        page: newPage
+      }));
+    }
   };
+  var handleRefresh = /*#__PURE__*/function () {
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+      var res;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            setState({
+              allSelected: false,
+              selectedRecords: [],
+              selectedRowKeys: []
+            });
+            _context.next = 3;
+            return refreshAsync();
+          case 3:
+            res = _context.sent;
+            refreshPage(res);
+          case 5:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function handleRefresh() {
+      return _ref4.apply(this, arguments);
+    };
+  }();
   useDeepCompareEffect(function () {
     if (!manual && curService) {
       // service改变时重新请求
@@ -238,20 +292,22 @@ function useAntdTable(service, options, useRequestOptions) {
     }
   }, [extraParams]);
   var rowSelection = {
+    fixed: true,
     type: rowSelectType,
+    columnWidth: rowSelections ? 64 : undefined,
     selectedRowKeys: selectedRowKeys,
     onChange: function onChange(rowKeys, rows) {
       if (crossPageSelect) {
-        var _newList$map, _Array$from, _ref4;
-        var removeKeys = newList === null || newList === void 0 ? void 0 : (_newList$map = newList.map(function (item) {
+        var _data$map, _Array$from, _ref5;
+        var removeKeys = data === null || data === void 0 ? void 0 : (_data$map = data.map(function (item) {
           return item === null || item === void 0 ? void 0 : item[rowKey];
-        })) === null || _newList$map === void 0 ? void 0 : _newList$map.filter(function (key) {
+        })) === null || _data$map === void 0 ? void 0 : _data$map.filter(function (key) {
           return !rowKeys.includes(key);
         });
         var newSelectedKeys = (_Array$from = Array.from(new Set([].concat(_toConsumableArray(selectedRowKeys), _toConsumableArray(rowKeys))))) === null || _Array$from === void 0 ? void 0 : _Array$from.filter(function (item) {
           return !removeKeys.includes(item);
         });
-        var selectedRecordObj = (_ref4 = [].concat(_toConsumableArray(selectedRecords), _toConsumableArray(rows))) === null || _ref4 === void 0 ? void 0 : _ref4.reduce(function (acc, cur) {
+        var selectedRecordObj = (_ref5 = [].concat(_toConsumableArray(selectedRecords), _toConsumableArray(rows))) === null || _ref5 === void 0 ? void 0 : _ref5.reduce(function (acc, cur) {
           acc[cur === null || cur === void 0 ? void 0 : cur[rowKey]] = cur;
           return acc;
         }, {});
@@ -284,11 +340,11 @@ function useAntdTable(service, options, useRequestOptions) {
     },
     selections: rowSelections ? [{
       key: 'currentPage',
-      text: "\u9009\u62E9\u5F53\u524D\u9875(".concat((newList === null || newList === void 0 ? void 0 : newList.length) || 0, "\u6761)"),
+      text: "\u9009\u62E9\u5F53\u524D\u9875(".concat((data === null || data === void 0 ? void 0 : data.length) || 0, "\u6761)"),
       onSelect: function onSelect(changeableRowKeys) {
         setState({
           allSelected: false,
-          selectedRecords: _toConsumableArray(newList),
+          selectedRecords: _toConsumableArray(data),
           selectedRowKeys: changeableRowKeys
         });
       }
@@ -296,20 +352,20 @@ function useAntdTable(service, options, useRequestOptions) {
       key: 'all',
       text: "\u9009\u62E9\u5168\u90E8(".concat(total, "\u6761)"),
       onSelect: function () {
-        var _onSelect = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(changeableRowKeys) {
-          return _regeneratorRuntime().wrap(function _callee$(_context) {
-            while (1) switch (_context.prev = _context.next) {
+        var _onSelect = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(changeableRowKeys) {
+          return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+            while (1) switch (_context2.prev = _context2.next) {
               case 0:
                 setState({
                   allSelected: true,
-                  selectedRecords: _toConsumableArray(newList),
+                  selectedRecords: _toConsumableArray(data),
                   selectedRowKeys: changeableRowKeys
                 });
               case 1:
               case "end":
-                return _context.stop();
+                return _context2.stop();
             }
-          }, _callee);
+          }, _callee2);
         }));
         function onSelect(_x) {
           return _onSelect.apply(this, arguments);
@@ -320,9 +376,9 @@ function useAntdTable(service, options, useRequestOptions) {
       key: 'uncheckAll',
       text: '取消选择',
       onSelect: function () {
-        var _onSelect2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-          return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-            while (1) switch (_context2.prev = _context2.next) {
+        var _onSelect2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
+          return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+            while (1) switch (_context3.prev = _context3.next) {
               case 0:
                 setState({
                   allSelected: false,
@@ -331,9 +387,9 @@ function useAntdTable(service, options, useRequestOptions) {
                 });
               case 1:
               case "end":
-                return _context2.stop();
+                return _context3.stop();
             }
-          }, _callee2);
+          }, _callee3);
         }));
         function onSelect() {
           return _onSelect2.apply(this, arguments);
@@ -358,7 +414,7 @@ function useAntdTable(service, options, useRequestOptions) {
     onChange: handlePageChange
   };
   return _objectSpread(_objectSpread({}, result), {}, {
-    data: newList,
+    data: data,
     params: params,
     rowSelection: rowSelection,
     searchValues: searchValues,
@@ -384,7 +440,7 @@ function useAntdTable(service, options, useRequestOptions) {
     tableProps: {
       rowKey: rowKey,
       loading: result.loading,
-      dataSource: newList,
+      dataSource: data,
       rowSelection: returnRowSelection || rowSelections ? rowSelection : undefined,
       pagination: pagination,
       onChange: handleTableChange

package/es/ProTable/utils.d.ts

@@ -10,3 +10,11 @@ export declare const getColumnDataIndex: (dataIndex: string | string[]) => strin
  * @returns ReactNode 父级element
  */
 export declare const getParentElement: (element: any, name: any, type?: string) => React.ReactNode;
+/**
+ * 判断数据是否为Response<List<any>>结构
+ * @param data { [key: string]: any } 需要判断数据
+ * @returns boolean 是否
+ */
+export declare const isListResult: (data: {
+    [key: string]: any;
+}) => boolean;