@teamix/pro 1.5.12 → 1.5.15

package/lib/global.scss

@@ -1,3 +1,5 @@
+@import "./xconsole.scss";
+@import "next-xconsole";
 // transition 切换主题优化，暂时先写到 pro 里，后面加到基础组件里
 
 // table 行背景色
@@ -42,4 +44,4 @@ button.next-btn.next-medium.next-btn-normal {
 // 可关闭tag
 .next-tag.next-tag.next-tag.next-tag-closable.next-tag-level-normal.next-tag-closable {
   transition: color 0s;
-}
+}

package/lib/index.d.ts

@@ -28,5 +28,5 @@ export * from './table';
 export * from './sidebar';
 export * from './utils';
 export * from './timeline';
-declare const version = "1.5.12";
+declare const version = "1.5.15";
 export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProSidebar, ProTimeline, TeamixIcon, hooks, nocode, templates, utils, };

package/lib/index.js

@@ -280,7 +280,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 if (!((_window = window) === null || _window === void 0 ? void 0 : _window.TEAMIXPRO_WITHOUT_ICON)) {
   _icon.default.setConfig(_utils.default.getTeamixIconConfig());
 }
-var version = '1.5.12';
+var version = '1.5.15';
 // By TeamixTest
 exports.version = version;
 window.postMessage({

package/lib/next-xconsole.scss

@@ -0,0 +1,34 @@
+.theme-xconsole {
+  //.next-drawer-header {
+  //  color: var(--color-text-1, #1A1A1A)
+  //}
+  //.next-message.next-message-success.next-toast .next-message-title {
+  //  color: var(--color-text-1, #1A1A1A)
+  //}
+
+  --message-success-color-border-toast: var(--color-border-4, #E5E5E5);
+
+  /* --card-border-color: var(--color-text1-4, #E3E4E6); */
+  --card-border-color: var(--color-border-4, #E5E5E5);
+  /* --tab-pure-divider-border-color: var(--color-text1-4, #e5e5e5); */
+  --tab-pure-divider-border-color: var(--color-border-4, #E5E5E5);
+  --drawer-title-border-color: var(--color-border-4, #E5E5E5);
+
+  --popup-local-border-color: var(--color-border-4, #E5E5E5);
+
+  --btn-pure-normal-bg-disabled: var(--color-fill-2, #F7F7F7);
+  --checkbox-disabled-bg-color: var(--color-border-1, #D9D9D9);
+
+  --btn-pure-normal-border-color-disabled: var(--color-border-1, #D9D9D9);
+  --btn-pure-primary-border-color-disabled: var(--color-border-1, #D9D9D9);
+
+  --tab-item-margin-lr-size-m: 16px;
+  --tab-pure-hover-bg: transparent;
+
+  --progress-line-underlay-color: var(--color-border-4, #E5E5E5);
+  --range-normal-unselected-color: var(--color-border-4, #E5E5E5);
+
+  .next-formily-item-inset {
+    border: 1px solid var(--color-border-1, #D9D9D9);
+  }
+}

package/lib/nocode/configurators/ProTable.js

@@ -6,28 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _common = require("./common");
 var initialValues = {
-  columns: [{
-    dataIndex: 'instanceName',
-    title: '实例ID/实例名称'
-  }, {
-    dataIndex: 'organizationName',
-    title: '组织',
-    tooltip: '我这一列是可以被复制的～',
-    render: {
-      copy: true
-    }
-  }],
-  url: 'https://oneapi.alibaba-inc.com/mock/teamix-pro/api/getTableResource',
-  formatResult: {
-    data: 'data',
-    total: 'pageInfo.total'
-  },
-  mainAction: {
-    actions: [{
-      key: 'action',
-      children: '操作按钮'
-    }]
-  }
+  columns: []
 };
 var defaultValues = {
   showSkeleton: true,

package/lib/nocode/pages/index.js

@@ -54,32 +54,7 @@ var PageMap = {
 // 全部页面模板默认初始值
 exports.PageMap = PageMap;
 var PageDefaultInitialValues = {
-  LIST: {
-    header: {
-      title: '页面标题'
-    },
-    content: {
-      header: {
-        title: '表格标题'
-      },
-      columns: [{
-        dataIndex: 'instanceName',
-        title: '实例ID/实例名称'
-      }, {
-        dataIndex: 'organizationName',
-        title: '组织',
-        tooltip: '我这一列是可以被复制的～',
-        render: {
-          copy: true
-        }
-      }],
-      url: 'https://oneapi.alibaba-inc.com/mock/teamix-pro/api/getTableResource',
-      formatResult: {
-        data: 'data',
-        total: 'pageInfo.total'
-      }
-    }
-  },
+  LIST: {},
   DETAIL: {},
   FORM: {}
 };

package/lib/page-header/index.scss

@@ -1,3 +1,4 @@
+@import "xconsole";
 $prefix: 'teamix-pro-page-header';
 
 .#{$prefix} {
@@ -12,7 +13,7 @@ $prefix: 'teamix-pro-page-header';
     justify-content: space-between;
     align-items: center;
     min-height: 18px;
-    height: var(--layout-header-height, auto);
+    height: auto;
     margin-bottom: var(--s-2, 8px);
 
     &.with-description {

package/lib/page-header/xconsole.scss

@@ -0,0 +1,5 @@
+.theme-xconsole {
+  .teamix-pro-page-header .teamix-pro-page-header-title{
+    color: var(--color-text-1, #1A1A1A);
+  }
+}

package/lib/table/components/Filter/index.d.ts

@@ -1,10 +1,12 @@
 import React from 'react';
 import './index.scss';
-import { ProTableColumnProps, ProTableActionType } from '../../typing';
+import { ProTableColumnProps, ProTableActionType, ProTableProps } from '../../typing';
 declare type ProTableFilterProps = {
     column: ProTableColumnProps;
     actionRef: React.MutableRefObject<ProTableActionType | undefined>;
     switchCardView?: 'table' | 'card';
+    bindUrl?: ProTableProps['bindUrl'];
+    bindUrlProps?: ProTableProps['bindUrlProps'];
 };
-declare const Filter: React.FC<ProTableFilterProps>;
-export default Filter;
+declare const _default: React.NamedExoticComponent<ProTableFilterProps>;
+export default _default;

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

@@ -10,6 +10,7 @@ var _icon = _interopRequireDefault(require("@teamix/icon"));
 var _components = require("@alicloudfe/components");
 var _utils = require("@teamix/utils");
 require("./index.scss");
+var _hooks = require("@teamix/hooks");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -30,13 +31,20 @@ var CheckboxItem = _components.Menu.CheckboxItem;
 var cls = (0, _utils.usePrefixCls)('teamix-pro-table-toolbar-filter');
 var RadioItem = _components.Menu.RadioItem;
 var Filter = function Filter(props) {
+  var _urlState$split, _urlState, _urlState$split2;
   var column = props.column,
     actionRef = props.actionRef,
-    switchCardView = props.switchCardView;
+    switchCardView = props.switchCardView,
+    bindUrlProps = props.bindUrlProps,
+    bindUrl = props.bindUrl;
   var _column$filtersWidth = column.filtersWidth,
     filtersWidth = _column$filtersWidth === void 0 ? 130 : _column$filtersWidth;
+  var _useUrlState = (0, _hooks.useUrlState)(),
+    _useUrlState2 = _slicedToArray(_useUrlState, 2),
+    urlState = _useUrlState2[0],
+    setUrlState = _useUrlState2[1];
   // 选中过滤项
-  var _useState = (0, _react.useState)([]),
+  var _useState = (0, _react.useState)((_urlState$split = urlState === null || urlState === void 0 ? void 0 : (_urlState = urlState["filter".concat(column === null || column === void 0 ? void 0 : column.dataIndex)]) === null || _urlState === void 0 ? void 0 : (_urlState$split2 = _urlState.split) === null || _urlState$split2 === void 0 ? void 0 : _urlState$split2.call(_urlState, ',')) !== null && _urlState$split !== void 0 ? _urlState$split : []),
     _useState2 = _slicedToArray(_useState, 2),
     selected = _useState2[0],
     setSelected = _useState2[1];
@@ -48,7 +56,10 @@ var Filter = function Filter(props) {
     var _actionRef$current$ge, _actionRef$current, _actionRef$current$ge2, _actionRef$current$ge3, _actionRef$current$ge4, _actionRef$current$ge5;
     // 从全局状态中读取上次存储的条件
     var rules = (_actionRef$current$ge = (_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$ge2 = _actionRef$current.getState) === null || _actionRef$current$ge2 === void 0 ? void 0 : (_actionRef$current$ge3 = _actionRef$current$ge2.call(_actionRef$current)) === null || _actionRef$current$ge3 === void 0 ? void 0 : (_actionRef$current$ge4 = _actionRef$current$ge3.filterRules) === null || _actionRef$current$ge4 === void 0 ? void 0 : (_actionRef$current$ge5 = _actionRef$current$ge4[column.dataIndex]) === null || _actionRef$current$ge5 === void 0 ? void 0 : _actionRef$current$ge5.rules) !== null && _actionRef$current$ge !== void 0 ? _actionRef$current$ge : [];
-    setSelected(rules);
+    // 全局状态中需要有值才赋值。优先级：全局状态 > urlState
+    if (rules && rules.length > 0) {
+      setSelected(rules);
+    }
   }, []);
   // 获取过滤项
   var filters = (0, _react.useMemo)(function () {
@@ -75,6 +86,72 @@ var Filter = function Filter(props) {
     // console.log(filters);
     return filters;
   }, []);
+  // 点击确定回调
+  var onFilterOk = function onFilterOk() {
+    var _actionRef$current2, _actionRef$current2$f, _actionRef$current$ge6, _actionRef$current3, _actionRef$current3$g, _actionRef$current3$g2, _actionRef$current4, _actionRef$current4$s, _actionRef$current5, _actionRef$current7, _actionRef$current7$r, _actionRef$current8, _actionRef$current8$r, _actionRef$current9, _actionRef$current9$c;
+    (_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$f = _actionRef$current2.filterDataSource) === null || _actionRef$current2$f === void 0 ? void 0 : _actionRef$current2$f.call(_actionRef$current2, column.dataIndex);
+    // 先获取此列的param
+    var param = '';
+    if (column.beforeFilter) {
+      var _column$beforeFilter;
+      param = (_column$beforeFilter = column.beforeFilter) === null || _column$beforeFilter === void 0 ? void 0 : _column$beforeFilter.call(column, selected);
+    } else {
+      param = selected.join(',');
+    }
+    // 需要带上其他所有的信息
+    var rules = (_actionRef$current$ge6 = (_actionRef$current3 = actionRef.current) === null || _actionRef$current3 === void 0 ? void 0 : (_actionRef$current3$g = _actionRef$current3.getState) === null || _actionRef$current3$g === void 0 ? void 0 : (_actionRef$current3$g2 = _actionRef$current3$g.call(_actionRef$current3)) === null || _actionRef$current3$g2 === void 0 ? void 0 : _actionRef$current3$g2.filterRules) !== null && _actionRef$current$ge6 !== void 0 ? _actionRef$current$ge6 : {};
+    // 再设置所有的列筛选状态
+    (_actionRef$current4 = actionRef.current) === null || _actionRef$current4 === void 0 ? void 0 : (_actionRef$current4$s = _actionRef$current4.setFilterRules) === null || _actionRef$current4$s === void 0 ? void 0 : _actionRef$current4$s.call(_actionRef$current4, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
+      rules: selected,
+      params: param
+    })));
+    var targetPageKey = 'currentPage';
+    var pageInfo = (_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : _actionRef$current5.pageInfo;
+    if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
+      targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
+    }
+    if (switchCardView === 'card') {
+      var _actionRef$current6, _actionRef$current6$s;
+      (_actionRef$current6 = actionRef.current) === null || _actionRef$current6 === void 0 ? void 0 : (_actionRef$current6$s = _actionRef$current6.setData) === null || _actionRef$current6$s === void 0 ? void 0 : _actionRef$current6$s.call(_actionRef$current6, []);
+    }
+    // 发送请求
+    (_actionRef$current7 = actionRef.current) === null || _actionRef$current7 === void 0 ? void 0 : (_actionRef$current7$r = _actionRef$current7.request) === null || _actionRef$current7$r === void 0 ? void 0 : _actionRef$current7$r.call(_actionRef$current7, _defineProperty({}, targetPageKey, 1));
+    (_actionRef$current8 = actionRef.current) === null || _actionRef$current8 === void 0 ? void 0 : (_actionRef$current8$r = _actionRef$current8.resetPage) === null || _actionRef$current8$r === void 0 ? void 0 : _actionRef$current8$r.call(_actionRef$current8);
+    // 清空表格选择
+    (_actionRef$current9 = actionRef.current) === null || _actionRef$current9 === void 0 ? void 0 : (_actionRef$current9$c = _actionRef$current9.clearRowSelection) === null || _actionRef$current9$c === void 0 ? void 0 : _actionRef$current9$c.call(_actionRef$current9);
+    setVisible(false);
+    // 设置 url
+    if (bindUrl && (bindUrlProps === null || bindUrlProps === void 0 ? void 0 : bindUrlProps.headerFilters) !== false && (urlState === null || urlState === void 0 ? void 0 : urlState["filter".concat(column === null || column === void 0 ? void 0 : column.dataIndex)]) !== selected.join(',')) {
+      setUrlState(_defineProperty({}, "filter".concat(column === null || column === void 0 ? void 0 : column.dataIndex), selected.join(',')));
+    }
+  };
+  // 重置回调
+  var onFilterReset = function onFilterReset() {
+    var _actionRef$current$ge7, _actionRef$current10, _actionRef$current10$, _actionRef$current10$2, _actionRef$current11, _actionRef$current11$, _actionRef$current12, _actionRef$current12$;
+    setSelected([]);
+    var rules = (_actionRef$current$ge7 = (_actionRef$current10 = actionRef.current) === null || _actionRef$current10 === void 0 ? void 0 : (_actionRef$current10$ = _actionRef$current10.getState) === null || _actionRef$current10$ === void 0 ? void 0 : (_actionRef$current10$2 = _actionRef$current10$.call(_actionRef$current10)) === null || _actionRef$current10$2 === void 0 ? void 0 : _actionRef$current10$2.filterRules) !== null && _actionRef$current$ge7 !== void 0 ? _actionRef$current$ge7 : {};
+    (_actionRef$current11 = actionRef.current) === null || _actionRef$current11 === void 0 ? void 0 : (_actionRef$current11$ = _actionRef$current11.setFilterRules) === null || _actionRef$current11$ === void 0 ? void 0 : _actionRef$current11$.call(_actionRef$current11, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
+      rules: [],
+      params: ''
+    })));
+    (_actionRef$current12 = actionRef.current) === null || _actionRef$current12 === void 0 ? void 0 : (_actionRef$current12$ = _actionRef$current12.filterDataSource) === null || _actionRef$current12$ === void 0 ? void 0 : _actionRef$current12$.call(_actionRef$current12, column.dataIndex);
+    if (selected.length > 0) {
+      var _actionRef$current13, _actionRef$current14, _actionRef$current14$, _actionRef$current15, _actionRef$current15$, _actionRef$current16, _actionRef$current16$;
+      var targetPageKey = 'currentPage';
+      var pageInfo = (_actionRef$current13 = actionRef.current) === null || _actionRef$current13 === void 0 ? void 0 : _actionRef$current13.pageInfo;
+      if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
+        targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
+      }
+      // 发送请求
+      (_actionRef$current14 = actionRef.current) === null || _actionRef$current14 === void 0 ? void 0 : (_actionRef$current14$ = _actionRef$current14.request) === null || _actionRef$current14$ === void 0 ? void 0 : _actionRef$current14$.call(_actionRef$current14, _defineProperty({}, targetPageKey, 1));
+      (_actionRef$current15 = actionRef.current) === null || _actionRef$current15 === void 0 ? void 0 : (_actionRef$current15$ = _actionRef$current15.resetPage) === null || _actionRef$current15$ === void 0 ? void 0 : _actionRef$current15$.call(_actionRef$current15);
+      // 清空表格选择
+      (_actionRef$current16 = actionRef.current) === null || _actionRef$current16 === void 0 ? void 0 : (_actionRef$current16$ = _actionRef$current16.clearRowSelection) === null || _actionRef$current16$ === void 0 ? void 0 : _actionRef$current16$.call(_actionRef$current16);
+      if (bindUrl && (bindUrlProps === null || bindUrlProps === void 0 ? void 0 : bindUrlProps.headerFilters) !== false) {
+        setUrlState(_defineProperty({}, "filter".concat(column === null || column === void 0 ? void 0 : column.dataIndex), undefined));
+      }
+    }
+  };
   // 渲染单选
   var renderSingle = function renderSingle() {
     return filters === null || filters === void 0 ? void 0 : filters.map(function (_ref3) {
@@ -154,71 +231,15 @@ var Filter = function Filter(props) {
     className: cls({
       btn: true
     }),
-    onClick: function onClick() {
-      var _actionRef$current2, _actionRef$current2$f, _actionRef$current$ge6, _actionRef$current3, _actionRef$current3$g, _actionRef$current3$g2, _actionRef$current4, _actionRef$current4$s, _actionRef$current5, _actionRef$current7, _actionRef$current7$r, _actionRef$current8, _actionRef$current8$r, _actionRef$current9, _actionRef$current9$c;
-      (_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$f = _actionRef$current2.filterDataSource) === null || _actionRef$current2$f === void 0 ? void 0 : _actionRef$current2$f.call(_actionRef$current2, column.dataIndex);
-      // 先获取此列的param
-      var param = '';
-      if (column.beforeFilter) {
-        var _column$beforeFilter;
-        param = (_column$beforeFilter = column.beforeFilter) === null || _column$beforeFilter === void 0 ? void 0 : _column$beforeFilter.call(column, selected);
-      } else {
-        param = selected.join(',');
-      }
-      // 需要带上其他所有的信息
-      var rules = (_actionRef$current$ge6 = (_actionRef$current3 = actionRef.current) === null || _actionRef$current3 === void 0 ? void 0 : (_actionRef$current3$g = _actionRef$current3.getState) === null || _actionRef$current3$g === void 0 ? void 0 : (_actionRef$current3$g2 = _actionRef$current3$g.call(_actionRef$current3)) === null || _actionRef$current3$g2 === void 0 ? void 0 : _actionRef$current3$g2.filterRules) !== null && _actionRef$current$ge6 !== void 0 ? _actionRef$current$ge6 : {};
-      // 再设置所有的列筛选状态
-      (_actionRef$current4 = actionRef.current) === null || _actionRef$current4 === void 0 ? void 0 : (_actionRef$current4$s = _actionRef$current4.setFilterRules) === null || _actionRef$current4$s === void 0 ? void 0 : _actionRef$current4$s.call(_actionRef$current4, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
-        rules: selected,
-        params: param
-      })));
-      var targetPageKey = 'currentPage';
-      var pageInfo = (_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : _actionRef$current5.pageInfo;
-      if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
-        targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
-      }
-      if (switchCardView === 'card') {
-        var _actionRef$current6, _actionRef$current6$s;
-        (_actionRef$current6 = actionRef.current) === null || _actionRef$current6 === void 0 ? void 0 : (_actionRef$current6$s = _actionRef$current6.setData) === null || _actionRef$current6$s === void 0 ? void 0 : _actionRef$current6$s.call(_actionRef$current6, []);
-      }
-      // 发送请求
-      (_actionRef$current7 = actionRef.current) === null || _actionRef$current7 === void 0 ? void 0 : (_actionRef$current7$r = _actionRef$current7.request) === null || _actionRef$current7$r === void 0 ? void 0 : _actionRef$current7$r.call(_actionRef$current7, _defineProperty({}, targetPageKey, 1));
-      (_actionRef$current8 = actionRef.current) === null || _actionRef$current8 === void 0 ? void 0 : (_actionRef$current8$r = _actionRef$current8.resetPage) === null || _actionRef$current8$r === void 0 ? void 0 : _actionRef$current8$r.call(_actionRef$current8);
-      // 清空表格选择
-      (_actionRef$current9 = actionRef.current) === null || _actionRef$current9 === void 0 ? void 0 : (_actionRef$current9$c = _actionRef$current9.clearRowSelection) === null || _actionRef$current9$c === void 0 ? void 0 : _actionRef$current9$c.call(_actionRef$current9);
-      setVisible(false);
-    }
+    onClick: onFilterOk
   }, (0, _utils.getMessage)('ok')), /*#__PURE__*/_react.default.createElement(_components.Button, {
     type: "normal",
     size: "small",
     className: cls({
       btn: true
     }),
-    onClick: function onClick() {
-      var _actionRef$current$ge7, _actionRef$current10, _actionRef$current10$, _actionRef$current10$2, _actionRef$current11, _actionRef$current11$, _actionRef$current12, _actionRef$current12$;
-      setSelected([]);
-      var rules = (_actionRef$current$ge7 = (_actionRef$current10 = actionRef.current) === null || _actionRef$current10 === void 0 ? void 0 : (_actionRef$current10$ = _actionRef$current10.getState) === null || _actionRef$current10$ === void 0 ? void 0 : (_actionRef$current10$2 = _actionRef$current10$.call(_actionRef$current10)) === null || _actionRef$current10$2 === void 0 ? void 0 : _actionRef$current10$2.filterRules) !== null && _actionRef$current$ge7 !== void 0 ? _actionRef$current$ge7 : {};
-      (_actionRef$current11 = actionRef.current) === null || _actionRef$current11 === void 0 ? void 0 : (_actionRef$current11$ = _actionRef$current11.setFilterRules) === null || _actionRef$current11$ === void 0 ? void 0 : _actionRef$current11$.call(_actionRef$current11, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
-        rules: [],
-        params: ''
-      })));
-      (_actionRef$current12 = actionRef.current) === null || _actionRef$current12 === void 0 ? void 0 : (_actionRef$current12$ = _actionRef$current12.filterDataSource) === null || _actionRef$current12$ === void 0 ? void 0 : _actionRef$current12$.call(_actionRef$current12, column.dataIndex);
-      if (selected.length > 0) {
-        var _actionRef$current13, _actionRef$current14, _actionRef$current14$, _actionRef$current15, _actionRef$current15$, _actionRef$current16, _actionRef$current16$;
-        var targetPageKey = 'currentPage';
-        var pageInfo = (_actionRef$current13 = actionRef.current) === null || _actionRef$current13 === void 0 ? void 0 : _actionRef$current13.pageInfo;
-        if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
-          targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
-        }
-        // 发送请求
-        (_actionRef$current14 = actionRef.current) === null || _actionRef$current14 === void 0 ? void 0 : (_actionRef$current14$ = _actionRef$current14.request) === null || _actionRef$current14$ === void 0 ? void 0 : _actionRef$current14$.call(_actionRef$current14, _defineProperty({}, targetPageKey, 1));
-        (_actionRef$current15 = actionRef.current) === null || _actionRef$current15 === void 0 ? void 0 : (_actionRef$current15$ = _actionRef$current15.resetPage) === null || _actionRef$current15$ === void 0 ? void 0 : _actionRef$current15$.call(_actionRef$current15);
-        // 清空表格选择
-        (_actionRef$current16 = actionRef.current) === null || _actionRef$current16 === void 0 ? void 0 : (_actionRef$current16$ = _actionRef$current16.clearRowSelection) === null || _actionRef$current16$ === void 0 ? void 0 : _actionRef$current16$.call(_actionRef$current16);
-      }
-      // setVisible(!visible);
-    }
+    onClick: onFilterReset
   }, (0, _utils.getMessage)('reset'))))));
 };
-var _default = Filter;
+var _default = /*#__PURE__*/(0, _react.memo)(Filter);
 exports.default = _default;

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

@@ -12,7 +12,7 @@ var _form = require("../../../form");
 var _ToolBar = _interopRequireDefault(require("../ToolBar"));
 var _QuickAction = _interopRequireDefault(require("../QuickAction"));
 require("./index.scss");
-var _excluded = ["header", "mainAction", "extra", "actionRef", "dataFilter", "dataFilterFormRef", "afterDataFilter", "rowSelection", "toolBar", "dataTeamixSpm"];
+var _excluded = ["header", "mainAction", "extra", "actionRef", "dataFilter", "dataFilterFormRef", "afterDataFilter", "rowSelection", "toolBar", "dataTeamixSpm", "bindUrl", "bindUrlProps"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -34,6 +34,8 @@ var Layout = function Layout(props) {
     rowSelection = props.rowSelection,
     toolBar = props.toolBar,
     dataTeamixSpm = props.dataTeamixSpm,
+    bindUrl = props.bindUrl,
+    bindUrlProps = props.bindUrlProps,
     otherProps = _objectWithoutProperties(props, _excluded);
   // 渲染主操作区
   var renderMainAction = function renderMainAction() {
@@ -112,7 +114,8 @@ var Layout = function Layout(props) {
             (dataFilter === null || dataFilter === void 0 ? void 0 : dataFilter.onExpand) && (dataFilter === null || dataFilter === void 0 ? void 0 : dataFilter.onExpand(expand));
           },
           addonBefore: renderMainAction(),
-          addonAfter: renderAddonAfter()
+          addonAfter: renderAddonAfter(),
+          bindUrl: bindUrl && (bindUrlProps === null || bindUrlProps === void 0 ? void 0 : bindUrlProps.filters) !== false
         }, dataFilter)), afterDataFilter && /*#__PURE__*/_react.default.createElement("div", {
           className: "mb8 ".concat(cls('after-data-filter-wrapper'))
         }, afterDataFilter));

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

@@ -43,5 +43,6 @@ $prefix: 'teamix-pro-table-layout';
   &-addon-after-wrapper {
     display: flex;
     align-items: center;
+    margin-bottom: 8px;
   }
 }

package/lib/table/index.js

@@ -24,6 +24,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _pageContainer = _interopRequireDefault(require("../page-container"));
 var _lodash = _interopRequireDefault(require("lodash.debounce"));
 var _CardView = _interopRequireDefault(require("./components/CardView"));
+var _hooks = require("@teamix/hooks");
+var _util = require("./utils/util");
 var _typing = require("./typing");
 Object.keys(_typing).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -36,7 +38,7 @@ Object.keys(_typing).forEach(function (key) {
     }
   });
 });
-var _excluded = ["header", "className", "tableClassName", "mainAction", "extra", "dataFilter", "afterDataFilter", "toolBar", "columns", "useRowSelection", "rowSelection", "onChangeRowSelection", "getRowSelection", "primaryKey", "footerAction", "footer", "url", "pageKey", "pageSizeKey", "method", "params", "formatSort", "formatParams", "formatResult", "requestConfig", "requestWhenMount", "showPagination", "pageSizeList", "responsivePaginationType", "showSkeleton", "skeletonSize", "actionRef", "dataSource", "filterDebounce", "footerSuction", "autoRefresh", "autoRefreshProps", "customRequest", "filterColumnType", "defaultFilterParams", "reserveSelectedRecords", "size", "disableSelectAll", "context", "fixedTableBody", "isTree", "toolBarAutoWidth", "data-teamix-spm", "switchCardView", "cardViewProps", "defaultView", "emptyProps"],
+var _excluded = ["header", "className", "tableClassName", "mainAction", "extra", "dataFilter", "afterDataFilter", "toolBar", "columns", "useRowSelection", "rowSelection", "onChangeRowSelection", "getRowSelection", "primaryKey", "footerAction", "footer", "url", "pageKey", "pageSizeKey", "method", "params", "formatSort", "formatParams", "formatResult", "requestConfig", "requestWhenMount", "showPagination", "pageSizeList", "responsivePaginationType", "showSkeleton", "skeletonSize", "actionRef", "dataSource", "filterDebounce", "footerSuction", "autoRefresh", "autoRefreshProps", "customRequest", "filterColumnType", "defaultFilterParams", "reserveSelectedRecords", "size", "disableSelectAll", "context", "fixedTableBody", "isTree", "toolBarAutoWidth", "data-teamix-spm", "switchCardView", "cardViewProps", "defaultView", "emptyProps", "bindUrlProps", "bindUrl"],
   _excluded2 = ["onChange"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -104,7 +106,7 @@ var globalFormatSort = function globalFormatSort(sort) {
   return {};
 };
 var ProTable = function ProTable(props) {
-  var _rowSelection$selecte;
+  var _urlState$currentPage, _rowSelection$selecte;
   var header = props.header,
     className = props.className,
     tableClassName = props.tableClassName,
@@ -177,15 +179,21 @@ var ProTable = function ProTable(props) {
     _props$defaultView = props.defaultView,
     defaultView = _props$defaultView === void 0 ? 'table' : _props$defaultView,
     emptyProps = props.emptyProps,
+    bindUrlProps = props.bindUrlProps,
+    bindUrl = props.bindUrl,
     otherProps = _objectWithoutProperties(props, _excluded);
   var targetPageKey = pageKey || globalPageKey;
   var targetPageSizeKey = pageSizeKey || globalPageSizeKey;
   var targetFormatSort = formatSort || globalFormatSort;
-  var _useState = (0, _react.useState)(1),
+  var _useUrlState = (0, _hooks.useUrlState)(),
+    _useUrlState2 = _slicedToArray(_useUrlState, 2),
+    urlState = _useUrlState2[0],
+    setUrlState = _useUrlState2[1];
+  var _useState = (0, _react.useState)((_urlState$currentPage = urlState === null || urlState === void 0 ? void 0 : urlState.currentPage) !== null && _urlState$currentPage !== void 0 ? _urlState$currentPage : 1),
     _useState2 = _slicedToArray(_useState, 2),
     currentPage = _useState2[0],
     setCurrentPage = _useState2[1];
-  var _useState3 = (0, _react.useState)(props.pageSize || 10),
+  var _useState3 = (0, _react.useState)((urlState === null || urlState === void 0 ? void 0 : urlState.pageSize) || props.pageSize || 10),
     _useState4 = _slicedToArray(_useState3, 2),
     pageSize = _useState4[0],
     setPageSize = _useState4[1];
@@ -227,6 +235,24 @@ var ProTable = function ProTable(props) {
     _useState20 = _slicedToArray(_useState19, 2),
     showLoading = _useState20[0],
     setShowLoading = _useState20[1];
+  // 表格内部用作存储的 Ref，标识 Table 组件是否被第一次渲染。用作 useUrlState filter 第一次渲染时使用 state 数据请求
+  var dataRef = (0, _react.useRef)({
+    flag: true
+  });
+  (0, _react.useEffect)(function () {
+    if (bindUrl && (bindUrlProps === null || bindUrlProps === void 0 ? void 0 : bindUrlProps.pagination) !== false) {
+      if ((urlState === null || urlState === void 0 ? void 0 : urlState.currentPage) !== currentPage) {
+        setUrlState({
+          currentPage: currentPage
+        });
+      }
+      if ((urlState === null || urlState === void 0 ? void 0 : urlState.pageSize) !== pageSize) {
+        setUrlState({
+          pageSize: pageSize
+        });
+      }
+    }
+  }, [currentPage, pageSize, urlState]);
   // 存储能够被 on 监听到的 ProTable 状态
   // 因为只做存储用。不需要更新视图以及需要同步更改。所以不使用 setState 更新
   var _useState21 = (0, _react.useState)({
@@ -555,7 +581,7 @@ var ProTable = function ProTable(props) {
       // card视角的刷新等于重新请求
       if (switchViewState === 'card' && !propsDataSource) {
         setCurrentPage(1);
-        _request(_objectSpread(_objectSpread({}, params), {}, _defineProperty({}, targetPageKey, 1)));
+        _request(_objectSpread(_objectSpread({}, params), {}, _defineProperty({}, targetPageKey, 1)), undefined, undefined, true);
         setShowSkeleton(true);
       } else {
         _request(params);
@@ -578,7 +604,7 @@ var ProTable = function ProTable(props) {
       (_actionRef$current4 = actionRef.current) === null || _actionRef$current4 === void 0 ? void 0 : (_actionRef$current4$s = _actionRef$current4.setFilterRules) === null || _actionRef$current4$s === void 0 ? void 0 : _actionRef$current4$s.call(_actionRef$current4, {});
       (_dataFilterFormRef$cu = dataFilterFormRef.current) === null || _dataFilterFormRef$cu === void 0 ? void 0 : _dataFilterFormRef$cu.reset();
       setCurrentPage(1);
-      _request(_defineProperty({}, targetPageKey, 1));
+      _request(_defineProperty({}, targetPageKey, 1), undefined, undefined, true);
     },
     resetPage: function resetPage() {
       setCurrentPage(1);
@@ -676,12 +702,12 @@ var ProTable = function ProTable(props) {
       (0, _utils2.emit)('PRO_TABLE_REFRESH_TIMER_FLAG', Number(time));
     }
     // 设置 dataSource、total
-    if (switchViewState === 'table' || currentPage === 1) {
+    if (switchViewState === 'table' || currentPage === 1 || (cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination)) {
       var _next$data;
       _setData(next.data || []);
       setTotal(next.total || ((_next$data = next.data) === null || _next$data === void 0 ? void 0 : _next$data.length));
     }
-    if (switchViewState === 'card' && currentPage !== 1) {
+    if (switchViewState === 'card' && currentPage !== 1 && !(cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination)) {
       var _next$data2;
       _setData([].concat(_toConsumableArray(data), _toConsumableArray(next.data || [])));
       setTotal(total + (next.total || ((_next$data2 = next.data) === null || _next$data2 === void 0 ? void 0 : _next$data2.length)));
@@ -753,8 +779,13 @@ var ProTable = function ProTable(props) {
     }
   });
   // 请求函数
-  function _request(params, noLoading, filterParams) {
+  function _request(params, noLoading, filterParams, isReset) {
     var _dataFilterFormRef$cu2, _actionRef$current$ge, _actionRef$current6, _actionRef$current6$g, _objectSpread3;
+    // 首次渲染表格，获取 urlState 上的 表头 filter 数据
+    if (bindUrl && (bindUrlProps === null || bindUrlProps === void 0 ? void 0 : bindUrlProps.headerFilters) !== false && dataRef.current.flag) {
+      (0, _util.getUrlStateFilter)(urlState, actionRef);
+      dataRef.current.flag = false;
+    }
     // 如果没有传 url 且没有 customRequest，直接返回
     if (!url && !customRequest) {
       return;
@@ -799,18 +830,22 @@ var ProTable = function ProTable(props) {
       }
       // 如果使用自定义请求
       if (customRequest && typeof customRequest === 'function') {
-        setCustomTableLoading(true);
+        if (isReset) {
+          setShowSkeleton(true);
+        } else {
+          setCustomTableLoading(true);
+        }
         customRequest(requestData).then(function (res) {
           var dataRes = res.data,
             totalRes = res.total,
             success = res.success;
           if (success === true) {
             // 设置 dataSource、total
-            if (switchViewState === 'table' || params['targetPageKey'] === 1) {
+            if (switchViewState === 'table' || params['targetPageKey'] === 1 || isReset || (cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination)) {
               _setData(dataRes || []);
               setTotal(totalRes || (dataRes === null || dataRes === void 0 ? void 0 : dataRes.length));
             }
-            if (switchViewState === 'card' && params['targetPageKey'] !== 1) {
+            if (switchViewState === 'card' && params['targetPageKey'] !== 1 && !isReset && !(cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination)) {
               _setData([].concat(_toConsumableArray(data), _toConsumableArray(dataRes || [])));
               setTotal(total + (totalRes || (dataRes === null || dataRes === void 0 ? void 0 : dataRes.length)));
             }
@@ -839,6 +874,8 @@ var ProTable = function ProTable(props) {
             }, Number(time));
             (0, _utils2.emit)('PRO_TABLE_REFRESH_TIMER_FLAG', Number(time));
           }
+        }).finally(function () {
+          setCustomTableLoading(false);
         });
       } else {
         getData.run(requestData);
@@ -921,11 +958,13 @@ var ProTable = function ProTable(props) {
         switchCardView: switchCardView,
         defaultView: defaultView,
         autoRefresh: autoRefresh,
-        autoRefreshProps: autoRefreshProps
+        autoRefreshProps: autoRefreshProps,
+        bindUrlProps: bindUrlProps,
+        bindUrl: bindUrl
       }), switchViewState === 'table' && /*#__PURE__*/_react.default.createElement(_components.Table.StickyLock, _objectSpread({
         hasBorder: false,
         dataSource: showSkeleton ? skeletonDataSource : data || props.dataSource,
-        columns: (0, _genProColumnToColumn.default)(filteredColumns, showSkeleton, actionRef, context, dataTeamixSpm),
+        columns: (0, _genProColumnToColumn.default)(filteredColumns, showSkeleton, actionRef, context, dataTeamixSpm, bindUrl, bindUrlProps),
         loading: getTableLoading(),
         className: (0, _classnames.default)('teamix-pro-table', tableClassName, {
           'with-row-select': rowSelection,

package/lib/table/typing.d.ts

@@ -168,6 +168,10 @@ export declare type ProTableProps = {
     defaultView?: 'table' | 'card';
     /** 空状态配置 **/
     emptyProps?: EmptyContentProps;
+    /** 是否绑定 url **/
+    bindUrl?: boolean;
+    /** 绑定 url 配置 **/
+    bindUrlProps?: ProTableBindUrlProps;
 } & Omit<TableProps, 'columns'> & ProTableTopAreaProps;
 export declare type rowSelectionType = {
     getProps?: (record: any, index: number) => any;
@@ -315,6 +319,8 @@ export declare type ProTableLayoutProps = {
     defaultView?: 'table' | 'card';
     autoRefresh?: ProTableProps['autoRefresh'];
     autoRefreshProps?: ProTableProps['autoRefreshProps'];
+    bindUrl?: ProTableProps['bindUrl'];
+    bindUrlProps?: ProTableProps['bindUrlProps'];
 } & ProTableTopAreaProps;
 /** columns 列过滤 */
 export declare type ProTableColumnsFilterItemProps = {
@@ -401,4 +407,12 @@ export declare type ProTableCardViewProps = {
     /** 表格分页器参数 **/
     tablePaginationProps?: PaginationProps;
 };
+export declare type ProTableBindUrlProps = {
+    /** 翻页器区域 **/
+    pagination?: boolean;
+    /** 搜索区域 **/
+    filters?: boolean;
+    /** 表格标题过滤器区域 **/
+    headerFilters?: boolean;
+};
 export {};

package/lib/table/utils/columnRender.d.ts

@@ -2,11 +2,11 @@
  * 渲染列的逻辑函数
  */
 import React from 'react';
-import { ProTableColumnProps, ProTableActionType } from '../typing';
+import { ProTableColumnProps, ProTableActionType, ProTableProps } from '../typing';
 /**
  * 增加了 icon 的功能 render title
  */
-export declare const renderColumnsTitle: (item: ProTableColumnProps, actionRef: React.MutableRefObject<ProTableActionType | undefined>) => JSX.Element;
+export declare const renderColumnsTitle: (item: ProTableColumnProps, actionRef: React.MutableRefObject<ProTableActionType | undefined>, bindUrl?: ProTableProps['bindUrl'], bindUrlProps?: ProTableProps['bindUrlProps']) => JSX.Element;
 /**
  * 负责单元格的具体渲染
  */