@ccs-ui/rc-pro 2.3.6-alpha-8 → 2.3.6-alpha-9

package/es/ccs.d.ts

@@ -1,5 +1,6 @@
 import { ButtonProps, PaginationProps } from 'antd';
 import { Rule } from 'antd/es/form';
+import { NamePath } from 'antd/es/form/interface';
 import { CSSProperties, MutableRefObject, ReactElement, ReactNode } from 'react';
 import { TableColumn } from './pro-table/table';
 type MenuType = {
@@ -93,11 +94,11 @@ type ShowDependType = {
     name: string;
     value: any;
 };
-export type TableFormItem = {
+type FormItemType = {
     /** label 标题 */
     label?: string;
     /** form name */
-    name: string;
+    name?: string;
     /** form item element */
     value: ReactElement;
     /** 数据依赖、依赖项对应的name数组 */
@@ -108,7 +109,14 @@ export type TableFormItem = {
     rules?: Rule[];
     /** 在发起请求时调用方法，格式化值 */
     onFormat?: (e: any) => any;
+    /** 组表单项名称 */
+    groupItemNames?: NamePath[];
 };
+export type TableFormItem = ({
+    name: string;
+} & Partial<FormItemType>) | ({
+    groupItemNames: NamePath[];
+} & Partial<FormItemType>);
 type TableFormItems = TableFormItem[];
 type TableInstanceRef<T = any> = MutableRefObject<TableInstance<T> | undefined> | React.RefObject<TableInstance<T>>;
 type TableColumns<RecordType = any> = TableColumn<RecordType>[];

package/es/group-form-item/index.d.ts

@@ -0,0 +1,11 @@
+import { FormItemProps } from 'antd';
+import { NamePath } from 'antd/es/form/interface';
+export type GroupFormItemProps = FormItemProps & {
+    /** 组表单项名称 */
+    groupItemNames: NamePath[];
+};
+declare function GroupFormItem({ groupItemNames, name, ...formItemProps }: GroupFormItemProps): import("react/jsx-runtime").JSX.Element;
+declare namespace GroupFormItem {
+    var displayName: string;
+}
+export default GroupFormItem;

package/es/group-form-item/index.js

@@ -0,0 +1,124 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["groupItemNames", "name"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import { useUpdateEffect } from 'ahooks';
+import { Form } from 'antd';
+import { useEffect, useState } from 'react';
+import { getDataFromFields } from "../select";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var FormUpdateItem = function FormUpdateItem(_ref) {
+  var name = _ref.name,
+    getFieldsValue = _ref.getFieldsValue,
+    setFieldValue = _ref.setFieldValue,
+    getFieldValue = _ref.getFieldValue,
+    groupItemNames = _ref.groupItemNames;
+  var nameValue = getFieldValue(name);
+  useEffect(function () {
+    // 初始值
+    var initialValues = getFieldsValue(true);
+    var initNameValue = [];
+
+    // 根据子项初始值设置name的默认值
+    groupItemNames.forEach(function (item) {
+      initNameValue.push(getDataFromFields(initialValues, Array.isArray(item) ? item : [item]));
+    });
+
+    // 如果子项有初始值，则设置name的默认值
+    if (initNameValue.filter(function (n) {
+      return n !== undefined;
+    }).length > 0) {
+      setFieldValue(name, initNameValue);
+      return;
+    }
+
+    // 如果子项没有初始值，主项有初始值
+    var groupNameValue = getDataFromFields(initialValues, Array.isArray(name) ? name : [name]);
+    if (Array.isArray(groupNameValue)) {
+      groupItemNames.forEach(function (item, index) {
+        setFieldValue(item, groupNameValue[index]);
+      });
+    }
+  }, []);
+
+  // 依赖主字段变更，更新子项属性值
+  useUpdateEffect(function () {
+    setTimeout(function () {
+      groupItemNames.forEach(function (item, index) {
+        setFieldValue(item, Array.isArray(nameValue) ? nameValue[index] : undefined);
+      });
+    }, 1);
+  }, [nameValue]);
+  return null;
+};
+function onGetNameValue() {
+  var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var name = arguments.length > 1 ? arguments[1] : undefined;
+  if (!obj) return undefined;
+  if (Array.isArray(name)) {
+    var names = _toConsumableArray(name);
+    var newName = names.shift();
+    if (names.length === 0) return obj[newName];
+    return onGetNameValue(obj[newName], names);
+  }
+  return obj[name];
+}
+function GroupFormItem(_ref2) {
+  var groupItemNames = _ref2.groupItemNames,
+    name = _ref2.name,
+    formItemProps = _objectWithoutProperties(_ref2, _excluded);
+  var _useState = useState(name || "_".concat(JSON.stringify(groupItemNames).replace(/[^a-zA-Z]/g, ''))),
+    _useState2 = _slicedToArray(_useState, 1),
+    itemName = _useState2[0];
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Form.Item, _objectSpread({
+      name: itemName
+    }, formItemProps)), groupItemNames && groupItemNames.length > 0 && /*#__PURE__*/_jsxs(_Fragment, {
+      children: [/*#__PURE__*/_jsx(Form.Item, {
+        noStyle: true,
+        shouldUpdate: function shouldUpdate(l, r) {
+          return onGetNameValue(l, itemName) !== onGetNameValue(r, itemName);
+        },
+        children: function children(_ref3) {
+          var getFieldsValue = _ref3.getFieldsValue,
+            setFieldValue = _ref3.setFieldValue,
+            getFieldValue = _ref3.getFieldValue;
+          return /*#__PURE__*/_jsx(FormUpdateItem, {
+            getFieldsValue: getFieldsValue,
+            setFieldValue: setFieldValue,
+            getFieldValue: getFieldValue,
+            groupItemNames: groupItemNames,
+            name: itemName
+          });
+        }
+      }), groupItemNames.map(function (item, index) {
+        return /*#__PURE__*/_jsx(Form.Item, {
+          noStyle: true,
+          name: item,
+          hidden: true
+        }, index);
+      })]
+    })]
+  });
+}
+if (process.env.NODE_ENV !== 'production') {
+  GroupFormItem.displayName = 'CcsGroupFormItem';
+}
+export default GroupFormItem;

package/es/index.d.ts

@@ -9,6 +9,7 @@ export { default as CcsDialog } from './dialog';
 export { default as CcsEditor } from './editor';
 export { default as CcsEllipsis } from './ellipsis';
 export { default as CcsFullScreenButton } from './full-screen';
+export { default as CcsGroupFormItem } from './group-form-item';
 export { default as useAppConfig } from './hooks/use-app';
 export { default as useCcsOnceEvent } from './hooks/use-once-event';
 export { default as useCcsPage } from './hooks/use-page';

package/es/index.js

@@ -9,6 +9,7 @@ export { default as CcsDialog } from "./dialog";
 export { default as CcsEditor } from "./editor";
 export { default as CcsEllipsis } from "./ellipsis";
 export { default as CcsFullScreenButton } from "./full-screen";
+export { default as CcsGroupFormItem } from "./group-form-item";
 export { default as useAppConfig } from "./hooks/use-app";
 export { default as useCcsOnceEvent } from "./hooks/use-once-event";
 export { default as useCcsPage } from "./hooks/use-page";

package/es/pro-table/form-item.d.ts

@@ -3,5 +3,5 @@ import { CcsProTableProps } from './table';
 type PropsType = TableFormItem & {
     dependParam?: any;
 } & Pick<CcsProTableProps<any>, 'formItemLabelWidth'>;
-export default function HeadFormItem({ label, name, rules, value, dependParam, formItemLabelWidth, }: PropsType): import("react/jsx-runtime").JSX.Element;
+export default function HeadFormItem({ label, name, rules, value, dependParam, groupItemNames, formItemLabelWidth, }: PropsType): import("react/jsx-runtime").JSX.Element;
 export {};

package/es/pro-table/form-item.js

@@ -1,5 +1,12 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { Form } from 'antd';
 import { cloneElement } from 'react';
+import { CcsGroupFormItem } from '..';
 import { classPrefix } from "./table";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -9,19 +16,28 @@ export default function HeadFormItem(_ref) {
     rules = _ref.rules,
     value = _ref.value,
     dependParam = _ref.dependParam,
+    groupItemNames = _ref.groupItemNames,
     formItemLabelWidth = _ref.formItemLabelWidth;
+  var props = {
+    name: name,
+    rules: rules,
+    className: "".concat(classPrefix, "-form-label"),
+    label: formItemLabelWidth ? /*#__PURE__*/_jsx("div", {
+      style: {
+        width: formItemLabelWidth
+      },
+      children: label
+    }) : label
+  };
+  if (groupItemNames) {
+    return /*#__PURE__*/_jsx(CcsGroupFormItem, _objectSpread(_objectSpread({}, props), {}, {
+      groupItemNames: groupItemNames,
+      children: dependParam ? /*#__PURE__*/cloneElement(value, dependParam) : value
+    }));
+  }
   return /*#__PURE__*/_jsx(_Fragment, {
-    children: /*#__PURE__*/_jsx(Form.Item, {
-      name: name,
-      rules: rules,
-      className: "".concat(classPrefix, "-form-label"),
-      label: formItemLabelWidth ? /*#__PURE__*/_jsx("div", {
-        style: {
-          width: formItemLabelWidth
-        },
-        children: label
-      }) : label,
+    children: /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread({}, props), {}, {
       children: dependParam ? /*#__PURE__*/cloneElement(value, dependParam) : value
-    })
+    }))
   });
 }

package/es/pro-table/head.js

@@ -105,39 +105,44 @@ function HeadComponent(_ref) {
     }), toolbar ? null : tableOperation]
   });
   var renderFormItems = function renderFormItems() {
-    return allFormItems.map(function (item) {
-      if (item.depends || item.showDepends) {
+    return allFormItems.map(function (_ref2, index) {
+      var depends = _ref2.depends,
+        showDepends = _ref2.showDepends,
+        name = _ref2.name,
+        groupItemNames = _ref2.groupItemNames,
+        label = _ref2.label,
+        rules = _ref2.rules,
+        value = _ref2.value;
+      if (depends || showDepends) {
         return /*#__PURE__*/_jsx(React.Fragment, {
           children: /*#__PURE__*/_jsx(Form.Item, {
             noStyle: true,
             shouldUpdate: function shouldUpdate(l, n) {
-              var _item$depends, _item$showDepends;
-              return ((_item$depends = item.depends) === null || _item$depends === void 0 ? void 0 : _item$depends.some(function (i) {
+              return (depends === null || depends === void 0 ? void 0 : depends.some(function (i) {
                 return l[i] !== n[i];
-              })) || ((_item$showDepends = item.showDepends) === null || _item$showDepends === void 0 ? void 0 : _item$showDepends.some(function (i) {
+              })) || (showDepends === null || showDepends === void 0 ? void 0 : showDepends.some(function (i) {
                 return l[i.name] !== n[i.name];
               })) || false;
             },
-            children: function children(_ref2) {
-              var _item$depends2;
-              var getFieldValue = _ref2.getFieldValue;
+            children: function children(_ref3) {
+              var getFieldValue = _ref3.getFieldValue;
               var dependParam = {};
-              (_item$depends2 = item.depends) === null || _item$depends2 === void 0 || _item$depends2.forEach(function (i) {
+              depends === null || depends === void 0 || depends.forEach(function (i) {
                 var value = getFieldValue(i);
                 dependParam[i] = value;
               });
               var isShow = true;
-              if (item.showDepends && item.showDepends.length > 0) {
-                var _item$showDepends2;
-                isShow = (_item$showDepends2 = item.showDepends) === null || _item$showDepends2 === void 0 ? void 0 : _item$showDepends2.every(function (i) {
+              if (showDepends && showDepends.length > 0) {
+                isShow = showDepends === null || showDepends === void 0 ? void 0 : showDepends.every(function (i) {
                   return getFieldValue(i.name) === i.value;
                 });
               }
               var itemContent = /*#__PURE__*/_jsx(HeadFormItem, {
-                name: item.name,
-                label: item.label,
-                rules: item.rules,
-                value: item.value,
+                name: name,
+                groupItemNames: groupItemNames,
+                label: label,
+                rules: rules,
+                value: value,
                 dependParam: dependParam,
                 formItemLabelWidth: formItemLabelWidth
               });
@@ -145,18 +150,19 @@ function HeadComponent(_ref) {
               return itemContent;
             }
           })
-        }, item.name);
+        }, name);
       }
       var itemContent = /*#__PURE__*/_jsx(HeadFormItem, {
-        name: item.name,
-        value: item.value,
-        rules: item.rules,
-        label: item.label,
+        groupItemNames: groupItemNames,
+        name: name,
+        value: value,
+        rules: rules,
+        label: label,
         formItemLabelWidth: formItemLabelWidth
       });
       return /*#__PURE__*/_jsx(React.Fragment, {
         children: itemContent
-      }, item.name);
+      }, index);
     });
   };
   var formStyles = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ccs-ui/rc-pro",
-  "version": "2.3.6-alpha-8",
+  "version": "2.3.6-alpha-9",
   "description": "",
   "license": "MIT",
   "author": {