Update from Vibe Studio

node_modules/@ant-design/pro-table/lib/components/ToolBar/DensityIcon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export type DensitySize = 'middle' | 'small' | 'large' | undefined;
+declare const _default: React.MemoExoticComponent<(props: {
+    icon?: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

node_modules/@ant-design/pro-table/lib/components/ToolBar/DensityIcon.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _icons = require("@ant-design/icons");
+var _proProvider = require("@ant-design/pro-provider");
+var _proUtils = require("@ant-design/pro-utils");
+var _antd = require("antd");
+var _react = _interopRequireWildcard(require("react"));
+var _Provide = require("../../Store/Provide");
+var _jsxRuntime = require("react/jsx-runtime");
+var DensityIcon = function DensityIcon(props) {
+  var _props$icon = props.icon,
+    icon = _props$icon === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ColumnHeightOutlined, {}) : _props$icon;
+  var counter = (0, _react.useContext)(_Provide.TableContext);
+  var intl = (0, _proProvider.useIntl)();
+  var dropdownProps = (0, _proUtils.menuOverlayCompatible)({
+    selectedKeys: [counter.tableSize],
+    onClick: function onClick(_ref) {
+      var _counter$setTableSize;
+      var key = _ref.key;
+      (_counter$setTableSize = counter.setTableSize) === null || _counter$setTableSize === void 0 || _counter$setTableSize.call(counter, key);
+    },
+    style: {
+      width: 80
+    },
+    items: [{
+      key: 'large',
+      label: intl.getMessage('tableToolBar.densityLarger', '宽松')
+    }, {
+      key: 'middle',
+      label: intl.getMessage('tableToolBar.densityMiddle', '中等')
+    }, {
+      key: 'small',
+      label: intl.getMessage('tableToolBar.densitySmall', '紧凑')
+    }]
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Dropdown, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, dropdownProps), {}, {
+    trigger: ['click'],
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
+      title: intl.getMessage('tableToolBar.density', '表格密度'),
+      children: icon
+    })
+  }));
+};
+var _default = exports.default = /*#__PURE__*/_react.default.memo(DensityIcon);

node_modules/@ant-design/pro-table/lib/components/ToolBar/FullscreenIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+export default _default;

node_modules/@ant-design/pro-table/lib/components/ToolBar/FullscreenIcon.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _icons = require("@ant-design/icons");
+var _proProvider = require("@ant-design/pro-provider");
+var _proUtils = require("@ant-design/pro-utils");
+var _antd = require("antd");
+var _react = _interopRequireWildcard(require("react"));
+var _jsxRuntime = require("react/jsx-runtime");
+var FullScreenIcon = function FullScreenIcon() {
+  var intl = (0, _proProvider.useIntl)();
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    fullscreen = _useState2[0],
+    setFullscreen = _useState2[1];
+  (0, _react.useEffect)(function () {
+    if (!(0, _proUtils.isBrowser)()) {
+      return;
+    }
+    document.onfullscreenchange = function () {
+      setFullscreen(!!document.fullscreenElement);
+    };
+  }, []);
+  return fullscreen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
+    title: intl.getMessage('tableToolBar.exitFullScreen', '全屏'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.FullscreenExitOutlined, {})
+  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
+    title: intl.getMessage('tableToolBar.fullScreen', '全屏'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.FullscreenOutlined, {})
+  });
+};
+var _default = exports.default = /*#__PURE__*/_react.default.memo(FullScreenIcon);

node_modules/@ant-design/pro-table/lib/components/ToolBar/index.d.ts

@@ -0,0 +1,70 @@
+import type { TableColumnType } from 'antd';
+import type { LabelTooltipType } from 'antd/lib/form/FormItemLabel';
+import React from 'react';
+import type { ActionType, OptionSearchProps, ProTableProps } from '../../typing';
+import type { ListToolBarProps } from '../ListToolBar';
+export type SettingOptionType = {
+    draggable?: boolean;
+    checkable?: boolean;
+    showListItemOption?: boolean;
+    checkedReset?: boolean;
+    listsHeight?: number;
+    extra?: React.ReactNode;
+    children?: React.ReactNode;
+    settingIcon?: React.ReactNode;
+};
+export type OptionConfig = {
+    density?: boolean;
+    fullScreen?: OptionsType;
+    reload?: OptionsType;
+    setting?: boolean | SettingOptionType;
+    search?: (OptionSearchProps & {
+        name?: string;
+    }) | boolean;
+    reloadIcon?: React.ReactNode;
+    densityIcon?: React.ReactNode;
+};
+export type OptionsFunctionType = (e: React.MouseEvent<HTMLSpanElement>, action?: ActionType) => void;
+export type OptionsType = OptionsFunctionType | boolean;
+export type ToolBarProps<T = unknown> = {
+    headerTitle?: React.ReactNode;
+    tooltip?: string | LabelTooltipType;
+    /** @deprecated 你可以使用 tooltip，这个更改是为了与 antd 统一 */
+    tip?: string;
+    toolbar?: ListToolBarProps;
+    toolBarRender?: (action: ActionType | undefined, rows: {
+        selectedRowKeys?: (string | number)[];
+        selectedRows?: T[];
+    }) => React.ReactNode[];
+    action: React.MutableRefObject<ActionType | undefined>;
+    options?: OptionConfig | false;
+    optionsRender?: ToolbarRenderProps<T>['optionsRender'];
+    selectedRowKeys?: (string | number)[];
+    selectedRows?: T[];
+    className?: string;
+    onSearch?: (keyWords: string) => void;
+    columns: TableColumnType<T>[];
+};
+export type ToolbarRenderProps<T> = {
+    hideToolbar: boolean;
+    onFormSearchSubmit: (params: any) => void;
+    searchNode: React.ReactNode;
+    tableColumn: any[];
+    tooltip?: string | LabelTooltipType;
+    selectedRows: T[];
+    selectedRowKeys: React.Key[] | (string | number)[];
+    headerTitle: React.ReactNode;
+    toolbar: ProTableProps<T, any, any>['toolbar'];
+    options: ProTableProps<T, any, any>['options'];
+    optionsRender?: (props: ToolBarProps<T>, defaultDom: React.ReactNode[]) => React.ReactNode[];
+    toolBarRender?: ToolBarProps<T>['toolBarRender'];
+    actionRef: React.MutableRefObject<ActionType | undefined>;
+};
+/** 这里负责与table交互，并且减少 render次数 */
+declare class ToolbarRender<T> extends React.Component<ToolbarRenderProps<T>> {
+    onSearch: (keyword: string) => void;
+    isEquals: (next: ToolbarRenderProps<T>) => boolean;
+    shouldComponentUpdate: (next: ToolbarRenderProps<T>) => boolean;
+    render: () => import("react/jsx-runtime").JSX.Element | null;
+}
+export default ToolbarRender;

node_modules/@ant-design/pro-table/lib/components/ToolBar/index.js

@@ -0,0 +1,304 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _icons = require("@ant-design/icons");
+var _proProvider = require("@ant-design/pro-provider");
+var _proUtils = require("@ant-design/pro-utils");
+var _antd = require("antd");
+var _react = _interopRequireWildcard(require("react"));
+var _Provide = require("../../Store/Provide");
+var _ColumnSetting = _interopRequireDefault(require("../ColumnSetting"));
+var _ListToolBar = _interopRequireDefault(require("../ListToolBar"));
+var _DensityIcon = _interopRequireDefault(require("./DensityIcon"));
+var _FullscreenIcon = _interopRequireDefault(require("./FullscreenIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["headerTitle", "tooltip", "toolBarRender", "action", "options", "selectedRowKeys", "selectedRows", "toolbar", "onSearch", "columns", "optionsRender"];
+function getButtonText(_ref, options) {
+  var _options$reloadIcon;
+  var intl = _ref.intl;
+  return {
+    reload: {
+      text: intl.getMessage('tableToolBar.reload', '刷新'),
+      icon: (_options$reloadIcon = options.reloadIcon) !== null && _options$reloadIcon !== void 0 ? _options$reloadIcon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ReloadOutlined, {})
+    },
+    density: {
+      text: intl.getMessage('tableToolBar.density', '表格密度'),
+      icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DensityIcon.default, {
+        icon: options.densityIcon
+      })
+    },
+    fullScreen: {
+      text: intl.getMessage('tableToolBar.fullScreen', '全屏'),
+      icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullscreenIcon.default, {})
+    }
+  };
+}
+
+/**
+ * 渲染默认的 工具栏
+ *
+ * @param options
+ * @param className
+ */
+function renderDefaultOption(options, defaultOptions, actions, columns) {
+  return Object.keys(options).filter(function (item) {
+    return item;
+  }).map(function (key) {
+    var value = options[key];
+    if (!value) {
+      return null;
+    }
+    var onClick = value === true ? defaultOptions[key] : function (event) {
+      value === null || value === void 0 || value(event, actions.current);
+    };
+    if (typeof onClick !== 'function') {
+      onClick = function onClick() {};
+    }
+    if (key === 'setting') {
+      return /*#__PURE__*/(0, _react.createElement)(_ColumnSetting.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, options[key]), {}, {
+        columns: columns,
+        key: key
+      }));
+    }
+    if (key === 'fullScreen') {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        onClick: onClick,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FullscreenIcon.default, {})
+      }, key);
+    }
+    var optionItem = getButtonText(defaultOptions, options)[key];
+    if (optionItem) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        onClick: onClick,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
+          title: optionItem.text,
+          children: optionItem.icon
+        })
+      }, key);
+    }
+    return null;
+  }).filter(function (item) {
+    return item;
+  });
+}
+function ToolBar(_ref2) {
+  var headerTitle = _ref2.headerTitle,
+    tooltip = _ref2.tooltip,
+    toolBarRender = _ref2.toolBarRender,
+    action = _ref2.action,
+    propsOptions = _ref2.options,
+    selectedRowKeys = _ref2.selectedRowKeys,
+    selectedRows = _ref2.selectedRows,
+    toolbar = _ref2.toolbar,
+    onSearch = _ref2.onSearch,
+    columns = _ref2.columns,
+    optionsRender = _ref2.optionsRender,
+    rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  var counter = (0, _react.useContext)(_Provide.TableContext);
+  var intl = (0, _proProvider.useIntl)();
+  var optionDom = (0, _react.useMemo)(function () {
+    var defaultOptions = {
+      reload: function reload() {
+        var _action$current;
+        return action === null || action === void 0 || (_action$current = action.current) === null || _action$current === void 0 ? void 0 : _action$current.reload();
+      },
+      density: true,
+      setting: true,
+      search: false,
+      fullScreen: function fullScreen() {
+        var _action$current2, _action$current2$full;
+        return action === null || action === void 0 || (_action$current2 = action.current) === null || _action$current2 === void 0 || (_action$current2$full = _action$current2.fullScreen) === null || _action$current2$full === void 0 ? void 0 : _action$current2$full.call(_action$current2);
+      }
+    };
+    if (propsOptions === false) {
+      return [];
+    }
+    var options = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, defaultOptions), {}, {
+      fullScreen: false
+    }, propsOptions);
+    var settings = renderDefaultOption(options, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, defaultOptions), {}, {
+      intl: intl
+    }), action, columns);
+    if (optionsRender) {
+      return optionsRender((0, _objectSpread2.default)({
+        headerTitle: headerTitle,
+        tooltip: tooltip,
+        toolBarRender: toolBarRender,
+        action: action,
+        options: propsOptions,
+        selectedRowKeys: selectedRowKeys,
+        selectedRows: selectedRows,
+        toolbar: toolbar,
+        onSearch: onSearch,
+        columns: columns,
+        optionsRender: optionsRender
+      }, rest), settings);
+    }
+    return settings;
+  }, [action, columns, headerTitle, intl, onSearch, optionsRender, propsOptions, rest, selectedRowKeys, selectedRows, toolBarRender, toolbar, tooltip]);
+  // 操作列表
+  var actions = toolBarRender ? toolBarRender(action === null || action === void 0 ? void 0 : action.current, {
+    selectedRowKeys: selectedRowKeys,
+    selectedRows: selectedRows
+  }) : [];
+  var searchConfig = (0, _react.useMemo)(function () {
+    if (!propsOptions) {
+      return false;
+    }
+    if (!propsOptions.search) return false;
+
+    /** 受控的value 和 onChange */
+    var defaultSearchConfig = {
+      value: counter.keyWords,
+      onChange: function onChange(e) {
+        return counter.setKeyWords(e.target.value);
+      }
+    };
+    if (propsOptions.search === true) return defaultSearchConfig;
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, defaultSearchConfig), propsOptions.search);
+  }, [counter, propsOptions]);
+  (0, _react.useEffect)(function () {
+    if (counter.keyWords === undefined) {
+      onSearch === null || onSearch === void 0 || onSearch('');
+    }
+  }, [counter.keyWords, onSearch]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListToolBar.default, (0, _objectSpread2.default)({
+    title: headerTitle,
+    tooltip: tooltip || rest.tip,
+    search: searchConfig,
+    onSearch: onSearch,
+    actions: actions,
+    settings: optionDom
+  }, toolbar));
+}
+/** 这里负责与table交互，并且减少 render次数 */
+var ToolbarRender = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2.default)(ToolbarRender, _React$Component);
+  var _super = (0, _createSuper2.default)(ToolbarRender);
+  function ToolbarRender() {
+    var _this;
+    (0, _classCallCheck2.default)(this, ToolbarRender);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onSearch", function (keyword) {
+      var _options$search, _options$search$onSea, _actionRef$current, _actionRef$current$se;
+      var _this$props = _this.props,
+        options = _this$props.options,
+        onFormSearchSubmit = _this$props.onFormSearchSubmit,
+        actionRef = _this$props.actionRef;
+      if (!options || !options.search) {
+        return;
+      }
+      var _ref3 = options.search === true ? {} : options.search,
+        _ref3$name = _ref3.name,
+        name = _ref3$name === void 0 ? 'keyword' : _ref3$name;
+
+      /** 如果传入的 onSearch 返回值为 false，应该直接拦截请求 */
+      var success = (_options$search = options.search) === null || _options$search === void 0 || (_options$search$onSea = _options$search.onSearch) === null || _options$search$onSea === void 0 ? void 0 : _options$search$onSea.call(_options$search, keyword);
+      if (success === false) return;
+
+      // 查询的时候的回到第一页
+      actionRef === null || actionRef === void 0 || (_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 || (_actionRef$current$se = _actionRef$current.setPageInfo) === null || _actionRef$current$se === void 0 || _actionRef$current$se.call(_actionRef$current, {
+        current: 1
+      });
+      onFormSearchSubmit((0, _proUtils.omitUndefined)((0, _defineProperty2.default)({
+        _timestamp: Date.now()
+      }, name, keyword)));
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isEquals", function (next) {
+      var _this$props2 = _this.props,
+        hideToolbar = _this$props2.hideToolbar,
+        tableColumn = _this$props2.tableColumn,
+        options = _this$props2.options,
+        tooltip = _this$props2.tooltip,
+        toolbar = _this$props2.toolbar,
+        selectedRows = _this$props2.selectedRows,
+        selectedRowKeys = _this$props2.selectedRowKeys,
+        headerTitle = _this$props2.headerTitle,
+        actionRef = _this$props2.actionRef,
+        toolBarRender = _this$props2.toolBarRender;
+      return (0, _proUtils.isDeepEqualReact)({
+        hideToolbar: hideToolbar,
+        tableColumn: tableColumn,
+        options: options,
+        tooltip: tooltip,
+        toolbar: toolbar,
+        selectedRows: selectedRows,
+        selectedRowKeys: selectedRowKeys,
+        headerTitle: headerTitle,
+        actionRef: actionRef,
+        toolBarRender: toolBarRender
+      }, {
+        hideToolbar: next.hideToolbar,
+        tableColumn: next.tableColumn,
+        options: next.options,
+        tooltip: next.tooltip,
+        toolbar: next.toolbar,
+        selectedRows: next.selectedRows,
+        selectedRowKeys: next.selectedRowKeys,
+        headerTitle: next.headerTitle,
+        actionRef: next.actionRef,
+        toolBarRender: next.toolBarRender
+      }, ['render', 'renderFormItem']);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "shouldComponentUpdate", function (next) {
+      if (next.searchNode) {
+        return true;
+      }
+      return !_this.isEquals(next);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "render", function () {
+      var _this$props3 = _this.props,
+        hideToolbar = _this$props3.hideToolbar,
+        tableColumn = _this$props3.tableColumn,
+        options = _this$props3.options,
+        searchNode = _this$props3.searchNode,
+        tooltip = _this$props3.tooltip,
+        toolbar = _this$props3.toolbar,
+        selectedRows = _this$props3.selectedRows,
+        selectedRowKeys = _this$props3.selectedRowKeys,
+        headerTitle = _this$props3.headerTitle,
+        actionRef = _this$props3.actionRef,
+        toolBarRender = _this$props3.toolBarRender,
+        optionsRender = _this$props3.optionsRender;
+
+      // 不展示 toolbar
+      if (hideToolbar) {
+        return null;
+      }
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolBar, {
+        tooltip: tooltip,
+        columns: tableColumn,
+        options: options,
+        headerTitle: headerTitle,
+        action: actionRef,
+        onSearch: _this.onSearch,
+        selectedRows: selectedRows,
+        selectedRowKeys: selectedRowKeys,
+        toolBarRender: toolBarRender,
+        toolbar: (0, _objectSpread2.default)({
+          filter: searchNode
+        }, toolbar),
+        optionsRender: optionsRender
+      });
+    });
+    return _this;
+  }
+  return (0, _createClass2.default)(ToolbarRender);
+}(_react.default.Component);
+var _default = exports.default = ToolbarRender;