@ecoding/components.antd 0.3.37 → 0.3.39

package/lib/core/table-pro/filters.horizontal.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 interface IProps {
-    items?: React.ReactElement[];
+    items: React.ReactElement[];
+    overMax?: number;
+    colOpts?: any;
     onFinish?: (v: any) => Promise<void>;
     onClear?: () => Promise<void>;
     y?: string | number;

package/lib/core/table-pro/filters.horizontal.js

@@ -7,15 +7,15 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import React, { useRef, useEffect, useState } from 'react';
-import { Button, Form, Row, Col } from 'antd';
-const FiltersHorizontal = ({ items, onFinish, onClear, y, setY }) => {
+import React, { useRef, useEffect, useState, useMemo } from 'react';
+import { Button, Form, Row, Col, Space } from 'antd';
+const FiltersHorizontal = ({ items, onFinish, onClear, y, setY, overMax, colOpts }) => {
     const [form] = Form.useForm(); // 该组件内form全局变量
     const ref = useRef(null);
     const refInitY = useRef(undefined);
     const [showMore, setShowMore] = useState(false);
     const [moreFlag, setMoreFlag] = useState(false);
-    const [wrapH, setWrapH] = useState(items && items.length > 6 ? 110 : 'auto');
+    const [wrapH, setWrapH] = useState(items && items.length > overMax ? 110 : 'auto');
     const finish = (v) => __awaiter(void 0, void 0, void 0, function* () {
         onFinish && (yield onFinish(v));
     });
@@ -38,14 +38,16 @@ const FiltersHorizontal = ({ items, onFinish, onClear, y, setY }) => {
             }, 50);
         }
     };
+    const colProps = useMemo(() => {
+        const colProps = colOpts ? colOpts : { span: 6 };
+        return colProps;
+    }, [colOpts]);
     useEffect(() => {
         if (ref.current) {
-            setTimeout(() => {
-                if (items && items.length > 6) {
-                    setShowMore(true);
-                    setWrapH(110);
-                }
-            }, 200);
+            if (items && items.length > overMax) {
+                setShowMore(true);
+                setWrapH(110);
+            }
         }
     }, []);
     useEffect(() => {
@@ -53,13 +55,18 @@ const FiltersHorizontal = ({ items, onFinish, onClear, y, setY }) => {
             refInitY.current = y;
         }
     }, [y]);
-    return (React.createElement(Form, { form: form, onFinish: finish, style: { width: '100%', paddingBottom: 18, position: "relative" } },
-        React.createElement(Row, { gutter: 20, style: { overflow: "hidden", width: '100%', height: Number(wrapH) > 0 ? wrapH : 'auto' }, ref: ref }, items && items.map((item) => {
-            return (React.createElement(Col, { span: 8 }, item));
-        })),
-        React.createElement("div", { style: { textAlign: "right" } },
-            React.createElement(Button, { className: "mr10", onClick: clear }, "\u6E05\u7A7A"),
-            React.createElement(Button, { type: "primary", htmlType: "submit" }, "\u641C\u7D22")),
-        showMore ? (React.createElement(Button, { type: 'link', onClick: switchShow, style: { position: "absolute", bottom: 20, left: '50%', transform: "translateX(-50%)" }, size: 'small' }, moreFlag ? "收起" : "展开更多")) : null));
+    return (React.createElement(Form, { form: form, onFinish: finish, style: { width: '100%', position: "relative" } },
+        React.createElement("div", { style: { display: "flex" } },
+            React.createElement(Row, { gutter: 20, style: { overflow: "hidden", width: '100%', height: Number(wrapH) > 0 ? wrapH : 'auto' }, ref: ref }, items && items.map((item) => {
+                return (React.createElement(Col, Object.assign({}, colProps), item));
+            })),
+            React.createElement(Space, { direction: "vertical", size: "small", style: { textAlign: "right", width: 90 } },
+                React.createElement(Button, { type: "primary", size: 'small', htmlType: "submit" }, "\u641C\u7D22"),
+                React.createElement(Button, { size: 'small', onClick: clear }, "\u6E05\u7A7A"))),
+        showMore ? (React.createElement(Button, { type: 'link', onClick: switchShow, style: { fontSize: 12, position: "absolute", bottom: -10, left: '50%', transform: "translateX(-50%)" }, size: 'small' }, moreFlag ? "收起" : "展开更多")) : null));
+};
+FiltersHorizontal.defaultProps = {
+    items: [],
+    overMax: 8,
 };
 export default FiltersHorizontal;

package/lib/core/table-pro/index.d.ts

@@ -1,10 +1,13 @@
 import React from 'react';
 import type { FilterValue, SorterResult, TableCurrentDataSource, TablePaginationConfig } from 'antd/lib/table/interface';
+import type { ColProps } from 'antd/lib/col';
 interface IProps {
     className?: string;
     header?: React.ReactNode;
     buttonArea?: React.ReactNode;
     filters?: {
+        overMax?: number;
+        colOpts?: ColProps;
         items: React.ReactElement[];
         onFinish?: (v: any) => Promise<void>;
         onClear?: () => Promise<void>;

package/lib/core/table-pro/index.js

@@ -19,7 +19,7 @@ const TablePro = memo(({ className, header, buttonArea, filterArea, filters, sea
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'space-between',
-        marginBottom: 20
+        marginBottom: 8
     };
     const [openFilter, setOpenFilter] = useState(false);
     const [openColumnFilter, setOpenColumnFilter] = useState(false);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ecoding/components.antd",
-    "version": "0.3.37",
+    "version": "0.3.39",
     "author": "cxc",
     "homepage": "",
     "license": "MIT",
@@ -43,5 +43,5 @@
         "antd": "^5.8.4",
         "axios": "^1.1.2"
     },
-    "gitHead": "571168c21c039e8eed8da932957c8b567fa22abb"
+    "gitHead": "85e72aba0357ed01704cb1a1e73356415e0f85aa"
 }