@ccs-ui/rc-pro 1.1.21 → 1.1.22-beta-2

package/es/date-picker/index.js

@@ -17,7 +17,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import { DatePicker } from 'antd';
 import dayjs from 'dayjs';
 import _isArray from 'lodash/isArray';
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 function CcsDatePicker(_ref) {
   var value = _ref.value,
@@ -46,7 +46,9 @@ function RangePicker(_ref2) {
     restProps = _objectWithoutProperties(_ref2, _excluded2);
   var _useState3 = useState(function () {
       if (_isArray(value)) {
-        return [dayjs(value[0]), dayjs(value[1])];
+        var st = value[0] ? dayjs(value[0]) : value[0];
+        var et = value[1] ? dayjs(value[1]) : value[1];
+        return [st, et];
       }
     }),
     _useState4 = _slicedToArray(_useState3, 2),

package/es/dialog/HookModal.d.ts

@@ -2,7 +2,7 @@
 import { FormProps } from 'antd';
 import { DialogFormRef } from './form';
 import { CcsDialogModal, CcsDialogModalProps } from './hook';
-export declare const DialogSelfButton: ({ auth, formRef, formInitialValues, request, onCancel, onRequestBefore, }: Pick<CcsDialogModalProps, "request" | "auth" | "onRequestBefore" | "onCancel"> & {
+export declare const DialogSelfButton: ({ auth, formRef, formInitialValues, request, onCancel, onRequestBefore, }: Pick<CcsDialogModalProps, "auth" | "request" | "onRequestBefore" | "onCancel"> & {
     formRef: React.RefObject<DialogFormRef>;
     formInitialValues: FormProps['initialValues'];
 }) => import("react/jsx-runtime").JSX.Element;

package/es/pro-table/search.d.ts

@@ -2,7 +2,7 @@ import { EventEmitter } from 'ahooks/lib/useEventEmitter';
 import { FormInstance } from 'antd/lib/form';
 import { ReactElement } from 'react';
 import { CcsProTableProps } from './table';
-type PropsType<T> = Pick<CcsProTableProps<T>, 'toolbar' | 'formItems' | 'formInitValues' | 'expandForm' | 'disableCollapseForm' | 'formItemLabelWidth' | 'title'> & {
+type PropsType<T> = Pick<CcsProTableProps<T>, 'toolbar' | 'formItems' | 'formInitValues' | 'expandForm' | 'formItemLabelWidth' | 'formItemLayout' | 'formItemCol' | 'title'> & {
     /** 显示列 */
     columns?: any;
     /** 更多查询条件 */
@@ -18,5 +18,5 @@ type PropsType<T> = Pick<CcsProTableProps<T>, 'toolbar' | 'formItems' | 'formIni
     event$: EventEmitter<any>;
 };
 /** 操作按钮、查询，重置、列筛选、 */
-declare function SearchComponent<T>({ form, title, event$, toolbar, columns, children, expandForm, titleBordered, formItems, formInitValues, isInModalOrDrawer, formItemLabelWidth, disableCollapseForm, onReset, onSearch, }: PropsType<T>): import("react/jsx-runtime").JSX.Element;
+declare function SearchComponent<T>({ form, title, event$, toolbar, columns, children, expandForm, titleBordered, formItems, formInitValues, formItemLayout, formItemCol, isInModalOrDrawer, formItemLabelWidth, onReset, onSearch, }: PropsType<T>): import("react/jsx-runtime").JSX.Element;
 export default SearchComponent;

package/es/pro-table/search.js

@@ -16,9 +16,7 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { MoreOutlined, RedoOutlined, SettingOutlined, UpOutlined } from '@ant-design/icons';
 import { Button, Card, Checkbox, Col, Dropdown, Form, Row, Tooltip } from 'antd';
-import _debounce from 'lodash/debounce';
-import ResizeObserver from 'rc-resize-observer';
-import { cloneElement, useMemo, useRef, useState } from 'react';
+import React, { cloneElement, useMemo, useRef, useState } from 'react';
 import { CcsFullScreenButton } from '..';
 import { classPrefix } from "./table";
 
@@ -26,6 +24,7 @@ import { classPrefix } from "./table";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
 var getShowDpends = function getShowDpends(items, item, depends) {
   var showDepends = item.showDepends;
   if (showDepends) {
@@ -47,6 +46,14 @@ var getShowDpends = function getShowDpends(items, item, depends) {
   }
   return depends;
 };
+var DefaultItemCol = {
+  xs: 24,
+  sm: 12,
+  md: 8,
+  lg: 8,
+  xl: 6
+};
+
 /** 操作按钮、查询，重置、列筛选、 */
 function SearchComponent(_ref) {
   var form = _ref.form,
@@ -60,9 +67,12 @@ function SearchComponent(_ref) {
     _ref$formItems = _ref.formItems,
     formItems = _ref$formItems === void 0 ? [] : _ref$formItems,
     formInitValues = _ref.formInitValues,
+    _ref$formItemLayout = _ref.formItemLayout,
+    formItemLayout = _ref$formItemLayout === void 0 ? 'horizontal' : _ref$formItemLayout,
+    _ref$formItemCol = _ref.formItemCol,
+    formItemCol = _ref$formItemCol === void 0 ? DefaultItemCol : _ref$formItemCol,
     isInModalOrDrawer = _ref.isInModalOrDrawer,
     formItemLabelWidth = _ref.formItemLabelWidth,
-    disableCollapseForm = _ref.disableCollapseForm,
     onReset = _ref.onReset,
     onSearch = _ref.onSearch;
   var _useState = useState(false),
@@ -78,15 +88,10 @@ function SearchComponent(_ref) {
     isShowMore = _useState6[0],
     setIsShowMore = _useState6[1];
   var ref = useRef(null);
-  var _useState7 = useState(6),
-    _useState8 = _slicedToArray(_useState7, 2),
-    colSpan = _useState8[0],
-    setColSpan = _useState8[1];
   var onHasMore = function onHasMore() {
     var hasMain = formItems.filter(function (f) {
       return f.isMain;
     });
-
     // 所有都是主条件
     if (hasMain.length === formItems.length) {
       // 收起已展开
@@ -123,14 +128,14 @@ function SearchComponent(_ref) {
       return c.hidden;
     }));
   };
-  var _useState9 = useState(true),
+  var _useState7 = useState(true),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isCheckAll = _useState8[0],
+    setIsCheckAll = _useState8[1];
+  var _useState9 = useState(getHalfCheckState),
     _useState10 = _slicedToArray(_useState9, 2),
-    isCheckAll = _useState10[0],
-    setIsCheckAll = _useState10[1];
-  var _useState11 = useState(getHalfCheckState),
-    _useState12 = _slicedToArray(_useState11, 2),
-    isHalfCheck = _useState12[0],
-    setIsHalfCheck = _useState12[1];
+    isHalfCheck = _useState10[0],
+    setIsHalfCheck = _useState10[1];
 
   // 列选中事件
   var onCheckChange = function onCheckChange(checked, index) {
@@ -217,7 +222,7 @@ function SearchComponent(_ref) {
   // 操作按钮
   var renderOperation = /*#__PURE__*/_jsxs("div", {
     className: "".concat(classPrefix, "-header-buttons"),
-    children: [onHasMore() && !disableCollapseForm && /*#__PURE__*/_jsx(Button, {
+    children: [onHasMore() && !expandForm && /*#__PURE__*/_jsx(Button, {
       onClick: function onClick() {
         return setIsShowMore(!isShowMore);
       },
@@ -341,101 +346,84 @@ function SearchComponent(_ref) {
       })]
     });
   };
-
-  // 重设尺寸,当组件位于弹框中，根据容器宽度决定显示尺寸
-  var resizeFn = _debounce(function (width) {
-    if (!ref.current) return;
-    if (width === 0) return;
-    if (width > 1000) {
-      if (colSpan !== 6) setColSpan(6);
-      return;
-    }
-    if (width < 300) {
-      if (colSpan !== 24) setColSpan(24);
-      return;
-    }
-    if (width < 500) {
-      if (colSpan !== 12) setColSpan(12);
-      return;
-    }
-    if (width < 1000) {
-      if (colSpan !== 8) setColSpan(8);
-    }
-  }, 500);
-  var onResize = function onResize(size) {
-    if (size.width === 0) return;
-    resizeFn(size.width);
-  };
   var renderMoreForm = function renderMoreForm() {
-    return /*#__PURE__*/_jsx(ResizeObserver, {
-      onResize: onResize,
-      children: /*#__PURE__*/_jsx("div", {
-        className: "".concat(classPrefix, "-high-form"),
-        ref: ref,
-        style: {
-          maxHeight: isShowMore ? 500 : 0,
-          overflow: 'hidden',
-          marginBottom: isShowMore ? 10 : 0
-        },
-        children: /*#__PURE__*/_jsx(Form, {
-          initialValues: formInitValues,
-          form: form,
-          onFinish: onSearch,
-          layout: "horizontal",
-          children: /*#__PURE__*/_jsx(Row, {
-            gutter: 16,
-            style: {
-              justifyContent: 23 / colSpan > allFormItems.length ? 'flex-end' : 'flex-start'
-            },
-            children: allFormItems.map(function (item) {
-              return item.depends || item.showDepends ? /*#__PURE__*/_jsx(Form.Item, {
-                noStyle: true,
-                shouldUpdate: function shouldUpdate(l, n) {
-                  var _item$depends3, _item$showDepends3;
-                  return ((_item$depends3 = item.depends) === null || _item$depends3 === void 0 ? void 0 : _item$depends3.some(function (i) {
-                    return l[i] !== n[i];
-                  })) || ((_item$showDepends3 = item.showDepends) === null || _item$showDepends3 === void 0 ? void 0 : _item$showDepends3.some(function (i) {
-                    return l[i.name] !== n[i.name];
-                  })) || false;
-                },
-                children: function children(_ref3) {
-                  var _item$depends4;
-                  var getFieldValue = _ref3.getFieldValue;
-                  var dependParam = {};
-                  (_item$depends4 = item.depends) === null || _item$depends4 === void 0 ? void 0 : _item$depends4.forEach(function (i) {
-                    var value = getFieldValue(i);
-                    dependParam[i] = value;
-                  });
-                  var isShow = true;
-                  if (item.showDepends && item.showDepends.length > 0) {
-                    var _item$showDepends4;
-                    isShow = (_item$showDepends4 = item.showDepends) === null || _item$showDepends4 === void 0 ? void 0 : _item$showDepends4.every(function (i) {
-                      return getFieldValue(i.name) === i.value;
-                    });
-                  }
-                  return isShow ? /*#__PURE__*/_jsx(Col, {
-                    span: colSpan,
-                    children: /*#__PURE__*/_jsx(Form.Item, {
-                      className: "".concat(classPrefix, "-form-label"),
-                      label: renderLabel(item.label),
-                      name: item.name,
-                      rules: item.rules,
-                      children: /*#__PURE__*/cloneElement(item.value, dependParam)
-                    })
-                  }) : null;
-                }
-              }, item.name) : /*#__PURE__*/_jsx(Col, {
-                span: colSpan,
-                children: /*#__PURE__*/_jsx(Form.Item, {
-                  className: "".concat(classPrefix, "-form-label"),
-                  rules: item.rules,
-                  label: renderLabel(item.label),
-                  name: item.name,
-                  children: item.value
-                })
-              }, item.name);
-            })
-          })
+    // 需要使用row布局
+    var hasRow = formItemLayout !== 'inline';
+    var isArray = Array.isArray(formItemCol);
+    var renderItems = allFormItems.map(function (item, index) {
+      var colSpan = isArray ? formItemCol[index] || DefaultItemCol : formItemCol;
+      if (item.depends || item.showDepends) {
+        return /*#__PURE__*/_jsx(Form.Item, {
+          noStyle: true,
+          shouldUpdate: function shouldUpdate(l, n) {
+            var _item$depends3, _item$showDepends3;
+            return ((_item$depends3 = item.depends) === null || _item$depends3 === void 0 ? void 0 : _item$depends3.some(function (i) {
+              return l[i] !== n[i];
+            })) || ((_item$showDepends3 = item.showDepends) === null || _item$showDepends3 === void 0 ? void 0 : _item$showDepends3.some(function (i) {
+              return l[i.name] !== n[i.name];
+            })) || false;
+          },
+          children: function children(_ref3) {
+            var _item$depends4;
+            var getFieldValue = _ref3.getFieldValue;
+            var dependParam = {};
+            (_item$depends4 = item.depends) === null || _item$depends4 === void 0 ? void 0 : _item$depends4.forEach(function (i) {
+              var value = getFieldValue(i);
+              dependParam[i] = value;
+            });
+            var isShow = true;
+            if (item.showDepends && item.showDepends.length > 0) {
+              var _item$showDepends4;
+              isShow = (_item$showDepends4 = item.showDepends) === null || _item$showDepends4 === void 0 ? void 0 : _item$showDepends4.every(function (i) {
+                return getFieldValue(i.name) === i.value;
+              });
+            }
+            var itemContent = /*#__PURE__*/_jsx(Form.Item, {
+              className: "".concat(classPrefix, "-form-label"),
+              label: renderLabel(item.label),
+              name: item.name,
+              rules: item.rules,
+              children: /*#__PURE__*/cloneElement(item.value, dependParam)
+            });
+            if (!isShow) return null;
+            return hasRow ? /*#__PURE__*/_jsx(Col, _objectSpread(_objectSpread({}, colSpan), {}, {
+              children: itemContent
+            })) : itemContent;
+          }
+        }, item.name);
+      }
+      var itemContent = /*#__PURE__*/_jsx(Form.Item, {
+        className: "".concat(classPrefix, "-form-label"),
+        rules: item.rules,
+        label: renderLabel(item.label),
+        name: item.name,
+        children: item.value
+      });
+      if (hasRow) {
+        return /*#__PURE__*/_createElement(Col, _objectSpread(_objectSpread({}, colSpan), {}, {
+          key: item.name
+        }), itemContent);
+      }
+      return /*#__PURE__*/_jsx(React.Fragment, {
+        children: itemContent
+      }, item.name);
+    });
+    return /*#__PURE__*/_jsx("div", {
+      className: "".concat(classPrefix, "-high-form"),
+      ref: ref,
+      style: {
+        maxHeight: isShowMore ? 500 : 0,
+        overflow: 'hidden',
+        marginBottom: isShowMore ? 10 : 0
+      },
+      children: /*#__PURE__*/_jsx(Form, {
+        initialValues: formInitValues,
+        form: form,
+        onFinish: onSearch,
+        layout: formItemLayout,
+        children: /*#__PURE__*/_jsx(Row, {
+          gutter: 16,
+          children: renderItems
         })
       })
     });

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

@@ -1,4 +1,5 @@
-import { TableProps } from 'antd';
+import { ColProps, TableProps } from 'antd';
+import { FormLayout } from 'antd/es/form/Form';
 import { CSSProperties, ReactElement, ReactNode } from 'react';
 import CCS from '..';
 import { HttpPageResult } from '../ccs';
@@ -34,6 +35,10 @@ export type CcsProTableProps<T> = {
     title?: string;
     /** 查询条件集合 */
     formItems?: CCS.TableFormItems;
+    /** 查询条件布局模式，默认：horizontal */
+    formItemLayout?: FormLayout;
+    /** 查询条件栅格配置，默认：{ xs: 24, sm: 12, md: 8, lg: 8, xl: 6 } */
+    formItemCol?: ColProps | ColProps[];
     /** form item label 宽度 */
     formItemLabelWidth?: number | string;
     /** 查询form 初始值 */
@@ -44,8 +49,6 @@ export type CcsProTableProps<T> = {
     toolbarExtra?: ReactElement;
     /** 展开查询条件，默认false */
     expandForm?: boolean;
-    /** 禁止收起条件，默认false */
-    disableCollapseForm?: boolean;
     /** table 数据区域 */
     table?: CcsTableProps<T>;
     /** table style */

package/es/pro-table/table.js

@@ -485,7 +485,8 @@ var InternalProTable = function InternalProTable(props) {
       formInitValues: formInitValues,
       isInModalOrDrawer: isInModalOrDrawer,
       formItemLabelWidth: props.formItemLabelWidth,
-      disableCollapseForm: props.disableCollapseForm,
+      formItemLayout: props.formItemLayout,
+      formItemCol: props.formItemCol,
       event$: event$,
       onSearch: _onSearch,
       onReset: _onReset,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ccs-ui/rc-pro",
-  "version": "1.1.21",
-  "description": "ProTable在抽屉中吸顶异常;table排序参数修改保持与后端一致;table添加序号",
+  "version": "1.1.22-beta-2",
+  "description": "CcsDatePicker.RangePicker参数bug;CcsProTable删除disableCollapseForm参数;CcsProTable添加formItemLayout，formItemCol参数适应自定义布局",
   "license": "MIT",
   "author": {
     "name": "Hong",
@@ -21,6 +21,7 @@
     "lint": "npm run lint:es && npm run lint:css",
     "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
     "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
+    "prepare": "husky install && dumi setup",
     "prepublishOnly": "father doctor && npm run build",
     "publish:beta": "father build && npm publish --tag=beta && cnpm sync @ccs-ui/rc-pro",
     "publish:prod": "father build && npm publish && cnpm sync @ccs-ui/rc-pro",