@teamix/pro 1.4.10 → 1.4.13

package/lib/info/typing.d.ts

@@ -96,6 +96,8 @@ export interface ProInfoColumnsProps {
     extra?: React.ReactNode;
     /** 其他 ProField 配置 */
     props?: any;
+    /** 对齐方式 **/
+    alignItems?: 'center' | 'flex-start' | 'flex-end' | string;
 }
 export declare type ProInfoActionType = {
     /** 刷新Info */
@@ -113,7 +115,7 @@ export declare type IProProInfoItem = {
     headerInfoLayout?: ProHeaderInfoLayoutProps;
     /** loading 状态 */
     loading?: boolean;
-} & Pick<ProInfoColumnsProps, 'tooltip' | 'tooltipIcon'>;
+} & Pick<ProInfoColumnsProps, 'tooltip' | 'tooltipIcon' | 'render' | 'valueType' | 'alignItems'>;
 /** header info 定义 */
 export declare type IProHeaderInfo = {
     /** 布局值 */

package/lib/table/components/Layout/index.js

@@ -21,7 +21,7 @@ var _QuickAction = _interopRequireDefault(require("../QuickAction"));
 
 require("./index.scss");
 
-var _excluded = ["header", "mainAction", "extra", "actionRef", "dataFilter", "dataFilterFormRef", "afterDataFilter", "rowSelection"];
+var _excluded = ["header", "mainAction", "extra", "actionRef", "dataFilter", "dataFilterFormRef", "afterDataFilter", "rowSelection", "toolBar"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -52,6 +52,7 @@ var Layout = function Layout(props) {
       dataFilterFormRef = props.dataFilterFormRef,
       afterDataFilter = props.afterDataFilter,
       rowSelection = props.rowSelection,
+      toolBar = props.toolBar,
       otherProps = _objectWithoutProperties(props, _excluded); // 渲染主操作区
 
 
@@ -90,7 +91,8 @@ var Layout = function Layout(props) {
       quickAction: extra,
       rowSelection: rowSelection
     }), /*#__PURE__*/_react.default.createElement(_ToolBar.default, _objectSpread({
-      actionRef: actionRef
+      actionRef: actionRef,
+      toolBar: toolBar
     }, otherProps)));
   }; // 渲染新版 QueryFilter
 
@@ -191,7 +193,7 @@ var Layout = function Layout(props) {
     }
   };
 
-  if ((dataFilter === null || dataFilter === void 0 ? void 0 : dataFilter.schema) || mainAction || header || extra) {
+  if ((dataFilter === null || dataFilter === void 0 ? void 0 : dataFilter.schema) || mainAction || header || extra || toolBar !== false) {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: cls()
     }, renderLayout());

package/lib/table/index.js

@@ -40,6 +40,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _pageContainer = _interopRequireDefault(require("../page-container"));
 
+var _lodash = _interopRequireDefault(require("lodash.debounce"));
+
 var _typing = require("./typing");
 
 Object.keys(_typing).forEach(function (key) {
@@ -257,7 +259,7 @@ var ProTable = function ProTable(props) {
   var skeletonDataSource = new Array(skeletonSize).fill({});
   var requestDataKey = method.toLowerCase() === 'get' ? 'params' : 'data'; // 如果使用 customRequest 的话，内置 loading
 
-  var _useState13 = (0, _react.useState)(true),
+  var _useState13 = (0, _react.useState)(requestWhenMount),
       _useState14 = _slicedToArray(_useState13, 2),
       customTableLoading = _useState14[0],
       setCustomTableLoading = _useState14[1];
@@ -301,21 +303,45 @@ var ProTable = function ProTable(props) {
   var autoRefreshTimerRef = (0, _react.useRef)();
   var onResize = null;
   (0, _react.useEffect)(function () {
+    var _propsDataFilter$sche, _propsDataFilter$sche2;
+
     getHeaderHeight(fullscreenState);
+    getFooterSuctionState();
 
     if (window.onresize) {
       onResize = window.onresize;
-
-      window.onresize = function () {
+      window.onresize = (0, _lodash.default)(function () {
         var _onResize;
 
         (_onResize = onResize) === null || _onResize === void 0 ? void 0 : _onResize();
-        getHeaderHeight(fullscreenState);
-      };
+
+        if (footerSuction) {
+          getFooterSuctionState();
+        }
+
+        if (fixedTableBody) {
+          getHeaderHeight(fullscreenState);
+        }
+      }, 500);
     } else {
-      window.onresize = function () {
-        getHeaderHeight(fullscreenState);
-      };
+      window.onresize = (0, _lodash.default)(function () {
+        if (footerSuction) {
+          getFooterSuctionState();
+        }
+
+        if (fixedTableBody) {
+          getHeaderHeight(fullscreenState);
+        }
+      }, 500);
+    } // 如果不传 dataFilter，则在这里初始化请求
+
+
+    var hasDataFilter = (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : (_propsDataFilter$sche = propsDataFilter.schema) === null || _propsDataFilter$sche === void 0 ? void 0 : _propsDataFilter$sche.length) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : (_propsDataFilter$sche2 = propsDataFilter.schema) === null || _propsDataFilter$sche2 === void 0 ? void 0 : _propsDataFilter$sche2.length) > 0;
+
+    if (requestWhenMount && !hasDataFilter) {
+      (0, _utils2.processDefaultFilter)(propsColumns, actionRef, defaultFilterParams);
+
+      _request();
     }
 
     return function () {
@@ -324,6 +350,12 @@ var ProTable = function ProTable(props) {
       } else {
         window.onresize = null;
       }
+
+      if (autoRefreshTimerRef.current) {
+        clearTimeout(autoRefreshTimerRef.current);
+      }
+
+      actionRef.current = undefined;
     };
   }, []); // 获取header高度，用作全屏吸底吸底高度计算以及固定body高度计算（滚动条在底部）
 
@@ -339,6 +371,8 @@ var ProTable = function ProTable(props) {
     var pageContainerDom = document.querySelector('.teamix-pro-page-container-header');
     var teamixNavDom = document.querySelector('.teamix-nav-console');
     var footerRowSelectionDom = document.querySelector('.teamix-pro-page-container-footer');
+    var tableBodyDom = document.querySelector('.next-table-body');
+    var headerFixedTopSectionDom = document.querySelector('.teamix-pro-page-container-fixed-top');
     setTimeout(function () {
       var _headerDom$offsetHeig, _tableHeaderDom$offse;
 
@@ -352,11 +386,32 @@ var ProTable = function ProTable(props) {
 
         // 16px 为 padding
         var pageHeaderHeight = ((_pageContainerDom$off = pageContainerDom === null || pageContainerDom === void 0 ? void 0 : pageContainerDom.offsetHeight) !== null && _pageContainerDom$off !== void 0 ? _pageContainerDom$off : 0) + 16;
-        var teamixNavHeight = (_teamixNavDom$offsetH = teamixNavDom === null || teamixNavDom === void 0 ? void 0 : teamixNavDom.offsetHeight) !== null && _teamixNavDom$offsetH !== void 0 ? _teamixNavDom$offsetH : 0;
-        setHeaderHeight(headerHeight + tableHeaderHeight + pageHeaderHeight + teamixNavHeight + footerRowSelectionHeight + 16 + (offset !== null && offset !== void 0 ? offset : 0));
+        var teamixNavHeight = (_teamixNavDom$offsetH = teamixNavDom === null || teamixNavDom === void 0 ? void 0 : teamixNavDom.offsetHeight) !== null && _teamixNavDom$offsetH !== void 0 ? _teamixNavDom$offsetH : 0; // 1 为预留值，js无法取出精确高度，会被四舍五入
+
+        var offsetHeaderHeight = headerHeight + tableHeaderHeight + pageHeaderHeight + teamixNavHeight + footerRowSelectionHeight + 16 + (offset !== null && offset !== void 0 ? offset : 0) + 1;
+        var clientTableBodyHeight = document.body.clientHeight - offsetHeaderHeight;
+
+        if (tableBodyDom.clientHeight < clientTableBodyHeight) {
+          setFooterSuctionState(true);
+        } else {
+          setFooterSuctionState(false);
+        } // 如果有切换区tab，那么重新计算
+
+
+        if (headerFixedTopSectionDom.clientHeight) {
+          var _headerFixedTopSectio;
+
+          var headerFixedTopSectionHeight = (_headerFixedTopSectio = headerFixedTopSectionDom.clientHeight) !== null && _headerFixedTopSectio !== void 0 ? _headerFixedTopSectio : 0; // const clientTableBodyHeight =
+          //   document.body.clientHeight - offsetHeaderHeight;
+
+          setHeaderHeight(headerFixedTopSectionHeight + teamixNavHeight + footerRowSelectionHeight + tableHeaderHeight + 1);
+          return;
+        }
+
+        setHeaderHeight(offsetHeaderHeight);
       } else {
         // 24px 为 padding
-        setHeaderHeight(headerHeight + tableHeaderHeight + footerRowSelectionHeight + 24 + (offset !== null && offset !== void 0 ? offset : 0));
+        setHeaderHeight(headerHeight + tableHeaderHeight + footerRowSelectionHeight + 24 + (offset !== null && offset !== void 0 ? offset : 0) + 1);
       }
     }, 50);
   }; // header 区域高度。用作全屏计算吸顶吸底高度。默认不做计算
@@ -695,6 +750,10 @@ var ProTable = function ProTable(props) {
       if (footerSuction) {
         getFooterSuctionState();
       }
+
+      if (fixedTableBody) {
+        getHeaderHeight(fullscreenState);
+      }
     },
     onError: function onError(error) {
       setShowSkeleton(false);
@@ -708,6 +767,10 @@ var ProTable = function ProTable(props) {
       if (footerSuction) {
         getFooterSuctionState();
       }
+
+      if (fixedTableBody) {
+        getHeaderHeight(fullscreenState);
+      }
     }
   }); // 请求函数
 
@@ -773,6 +836,20 @@ var ProTable = function ProTable(props) {
           if (footerSuction) {
             getFooterSuctionState();
           }
+
+          if (fixedTableBody) {
+            getHeaderHeight(fullscreenState);
+          } // customRequest 中支持 autoRefresh
+
+
+          var time = autoRefresh ? autoRefresh(data) : false;
+
+          if (Number.isInteger(time) && time >= 1000) {
+            autoRefreshTimerRef.current = setTimeout(function () {
+              // 自动刷新不显示 loading
+              _request({}, true);
+            }, Number(time));
+          }
         });
       } else {
         getData.run(requestData);
@@ -780,40 +857,6 @@ var ProTable = function ProTable(props) {
     }
   }
 
-  (0, _react.useEffect)(function () {
-    var _propsDataFilter$sche, _propsDataFilter$sche2;
-
-    // 监听 浏览器变化 更吸底状态
-    if (footerSuction) {
-      getFooterSuctionState();
-
-      window.onresize = function () {
-        getFooterSuctionState();
-      };
-    } // 如果不传 dataFilter，则在这里初始化请求
-
-
-    var hasDataFilter = (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : (_propsDataFilter$sche = propsDataFilter.schema) === null || _propsDataFilter$sche === void 0 ? void 0 : _propsDataFilter$sche.length) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : (_propsDataFilter$sche2 = propsDataFilter.schema) === null || _propsDataFilter$sche2 === void 0 ? void 0 : _propsDataFilter$sche2.length) > 0;
-
-    if (requestWhenMount && !hasDataFilter) {
-      (0, _utils2.processDefaultFilter)(propsColumns, actionRef, defaultFilterParams);
-
-      _request();
-    }
-
-    return function () {
-      if (autoRefreshTimerRef.current) {
-        clearTimeout(autoRefreshTimerRef.current);
-      }
-
-      if (window.onresize) {
-        window.onresize = null;
-      }
-
-      actionRef.current = undefined;
-    };
-  }, []);
-
   function onSort(dataIndex, order) {
     var nextSort = _defineProperty({}, dataIndex, order);
 
@@ -879,7 +922,10 @@ var ProTable = function ProTable(props) {
   var renderTable = function renderTable(isFullScreen) {
     if (propsColumns) {
       return /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)('teamix-pro-table-container', className)
+        className: (0, _classnames.default)('teamix-pro-table-container', className, 'teamix-test-request'),
+        "data-teamix-test-request": "url=".concat(url, "&formatResult=").concat(!!formatResult),
+        "data-teamix-test-params": (0, _utils.getTestRequestParams)(propsParams),
+        "data-teamix-test-data": (0, _utils.getTestRequestData)(propsColumns)
       }, /*#__PURE__*/_react.default.createElement(_Layout.default, {
         header: header,
         mainAction: mainAction,
@@ -1005,7 +1051,7 @@ var ProTable = function ProTable(props) {
         })
       }, renderRowSelection(), /*#__PURE__*/_react.default.createElement("div", {
         className: cls('footer-right-wrapper')
-      }, showSkeleton ? /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Footer.Pagination, null) : /*#__PURE__*/_react.default.createElement(_Pagination.default, _objectSpread({
+      }, showSkeleton ? /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Footer.Pagination, null) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, data.length > 0 && /*#__PURE__*/_react.default.createElement(_Pagination.default, _objectSpread({
         className: cls('pagination'),
         onChange: function onChange(number) {
           return onChangePagination(number);
@@ -1027,7 +1073,7 @@ var ProTable = function ProTable(props) {
         onPageSizeChange: function onPageSizeChange(number) {
           return onChangePaginationSize(number);
         }
-      }, props.paginationProps))));
+      }, props.paginationProps)))));
     } else if (!showPagination) {
       return /*#__PURE__*/_react.default.createElement("div", {
         className: cls('footer', {
@@ -1050,7 +1096,7 @@ var ProTable = function ProTable(props) {
 
       }),
       ref: tableRef
-    }, renderTable(isFullScreen), (footerSuctionState && footerSuction && !fullscreenState || fixedTableBody) && /*#__PURE__*/_react.default.createElement(_pageContainer.default.FixedFooter, null, renderFooter()), !(footerSuctionState && footerSuction) && !fullscreenState && !fixedTableBody && renderFooter(), fullscreenState && renderFooter());
+    }, renderTable(isFullScreen), footerSuctionState && !fullscreenState && /*#__PURE__*/_react.default.createElement(_pageContainer.default.FixedFooter, null, renderFooter()), !(footerSuctionState && !fullscreenState) && renderFooter(), fullscreenState && renderFooter());
   });
 };
 

package/lib/table/index.scss

@@ -32,6 +32,11 @@ $fullscreenPadding: 24px;
     display: flex;
     justify-content: flex-end;
     width: 100%;
+    & > span {
+      display: flex;
+      justify-content: flex-end;
+      width: 100%;
+    }
   }
   &-footer-action {
     margin-left: 16px;

package/lib/table/typing.d.ts

@@ -69,7 +69,9 @@ export declare type ProTableProps = {
     /** 请求方法 */
     method?: Method;
     /** 请求参数 */
-    params?: object;
+    params?: {
+        [propName: string]: any;
+    };
     /** sort 排序请求参数处理函数 */
     formatSort?: (sort: object) => object;
     /** 如需自定义调用参数格式，则可以设定此值在请求前对 params 进行自定义，如果返回false则可以阻止请求 */

package/lib/table/utils/columnRender.js

@@ -55,8 +55,9 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 var renderColumnsTitle = function renderColumnsTitle(item, actionRef) {
   var filterMode = item.filterMode,
       filters = item.filters,
+      dataSource = item.dataSource,
       dataIndex = item.dataIndex,
-      dataSource = item.dataSource; // 为列过滤添加状态标题
+      valueType = item.valueType; // 为列过滤添加状态标题
 
   var getItemLabel = function getItemLabel() {
     if (filters && filterMode !== 'multiple') {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamix/pro",
-  "version": "1.4.10",
+  "version": "1.4.13",
   "description": "TeamixPro大包",
   "keywords": [
     "aliyun",