@ecoding/components.antd 0.3.46 → 0.3.48

package/lib/core/form.list/index.d.ts

@@ -19,6 +19,7 @@ interface IProps {
     hideHeader?: boolean;
     afterRemove?: (index: any) => void;
     afterAdd?: (index: any) => void;
+    tStyle?: React.CSSProperties;
     operation?: {
         width?: number;
         render?: (field: FormListFieldData, index: number) => React.ReactNode;

package/lib/core/form.list/index.js

@@ -1,7 +1,8 @@
-import React, { useMemo } from 'react';
+import React, { useMemo, useRef } from 'react';
 import { Typography, Form, Button, Space, Tooltip } from 'antd';
 import { PlusCircleOutlined, QuestionCircleOutlined } from '@ant-design/icons';
-const C = ({ columns, rules, name, hideOperation, hideHeader, hideBottom, operation, i18n, afterRemove, afterAdd }) => {
+const C = ({ columns, rules, tStyle, name, hideOperation, hideHeader, hideBottom, operation, i18n, afterRemove, afterAdd }) => {
+    const tbodyRef = useRef(null);
     const tdStyle = {
         verticalAlign: 'top',
         lineHeight: '32px',
@@ -10,7 +11,10 @@ const C = ({ columns, rules, name, hideOperation, hideHeader, hideBottom, operat
     const thStyle = {
         textAlign: 'left',
         backgroundColor: '#fafafa',
-        padding: '8px'
+        padding: '8px',
+        position: "sticky",
+        top: 0,
+        zIndex: 1
     };
     const trStyle = {
         borderBottom: '1px solid #eee'
@@ -29,25 +33,31 @@ const C = ({ columns, rules, name, hideOperation, hideHeader, hideBottom, operat
         return w;
     }, []);
     return (React.createElement(Form.List, { name: name, rules: rules || [] }, (fields, { add, remove }, { errors }) => {
-        return (React.createElement(React.Fragment, null,
-            React.createElement("div", { className: "m-form-list", style: { overflowX: 'auto', marginBottom: '4px', paddingBottom: '12px', position: 'relative' } },
+        return (React.createElement("div", { className: 'm-form-list' },
+            React.createElement("div", { ref: tbodyRef, className: "m-form-list-table", style: Object.assign({}, { marginBottom: '4px', paddingBottom: '12px', overflow: "auto", position: 'relative' }, tStyle) },
                 React.createElement("table", { style: { width: widths } },
+                    React.createElement("colgroup", null,
+                        React.createElement("col", { style: Object.assign({}, { width: 60 }) }),
+                        columns.map((column) => {
+                            return (React.createElement("col", { style: Object.assign({}, { width: column.width || 200 }) }));
+                        }),
+                        hideOperation ? null : (React.createElement("col", { style: Object.assign({}, { width: (operation === null || operation === void 0 ? void 0 : operation.width) || 150 }) }))),
                     React.createElement("thead", null, hideHeader ? null : (React.createElement("tr", null,
-                        React.createElement("th", { style: Object.assign({}, thStyle, { width: '60px' }) }, i18n ? i18n.$t("global.num", "序号") : "序号"),
+                        React.createElement("th", { style: thStyle }, i18n ? i18n.$t("global.num", "序号") : "序号"),
                         columns.map((column, i) => {
                             if (column.require) {
-                                return (React.createElement("th", { style: Object.assign({}, thStyle, { width: column.width || 200 }) },
+                                return (React.createElement("th", { style: thStyle },
                                     React.createElement("span", { style: { color: '#ff4d4f' } }, "*"),
                                     column.title,
                                     column.tooltip ? (React.createElement(Tooltip, { placement: "top", title: column.tooltip || undefined },
                                         React.createElement(QuestionCircleOutlined, { style: { paddingLeft: 4, color: "rgba(0, 0, 0, 0.45)" } }))) : null));
                             }
-                            return (React.createElement("th", { style: Object.assign({}, thStyle, { width: column.width || 200 }) },
+                            return (React.createElement("th", { style: thStyle },
                                 column.title,
                                 column.tooltip ? (React.createElement(Tooltip, { placement: "top", title: column.tooltip || undefined },
                                     React.createElement(QuestionCircleOutlined, { style: { paddingLeft: 4, color: "rgba(0, 0, 0, 0.45)" } }))) : null));
                         }),
-                        hideOperation ? null : operation ? (React.createElement("th", { style: Object.assign({}, thStyle, { width: operation.width || 150, right: 0, position: "sticky" }) }, operation.title || "操作")) : (React.createElement("th", { style: Object.assign({}, thStyle, { width: 150, right: 0, position: "sticky" }) }, i18n ? i18n.$t("global.operation", "操作") : "操作"))))),
+                        hideOperation ? null : operation ? (React.createElement("th", { style: Object.assign({}, thStyle, { right: 0 }) }, operation.title || "操作")) : (React.createElement("th", { style: Object.assign({}, thStyle, { right: 0 }) }, i18n ? i18n.$t("global.operation", "操作") : "操作"))))),
                     React.createElement("tbody", null, fields.map((field, index) => {
                         return (React.createElement("tr", { style: trStyle },
                             React.createElement("td", { style: tdStyle }, index + 1),
@@ -70,6 +80,9 @@ const C = ({ columns, rules, name, hideOperation, hideHeader, hideBottom, operat
             hideBottom ? null : (React.createElement("div", null,
                 React.createElement(Button, { icon: React.createElement(PlusCircleOutlined, null), type: "dashed", onClick: () => {
                         add();
+                        setTimeout(() => {
+                            tbodyRef.current.scrollTop = tbodyRef.current.scrollHeight;
+                        }, 10);
                         afterAdd && afterAdd(fields.length);
                     } }, i18n ? i18n.$t("global.add", "添加") : "添加")))));
     }));

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

@@ -50,6 +50,14 @@ const FiltersHorizontal = ({ items, onFinish, onClear, y, setY, overMax, colOpts
         }
         return false;
     }, []);
+    const isLineAfter = useMemo(() => {
+        const len = items.length;
+        const temp = Math.floor(24 / colProps.span);
+        if (len == temp) {
+            return true;
+        }
+        return false;
+    }, []);
     useEffect(() => {
         if (ref.current) {
             if (items && items.length > overMax) {
@@ -64,7 +72,7 @@ const FiltersHorizontal = ({ items, onFinish, onClear, y, setY, overMax, colOpts
         }
     }, [y]);
     return (React.createElement(Form, { form: form, onFinish: finish, style: { width: '100%', position: "relative" } },
-        React.createElement("div", { style: { display: "flex" } },
+        React.createElement("div", { style: { display: "flex", justifyContent: "space-around", alignItems: "flex-start" } },
             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));
@@ -72,18 +80,10 @@ const FiltersHorizontal = ({ items, onFinish, onClear, y, setY, overMax, colOpts
                 isOpShowAfter ? (React.createElement(Col, Object.assign({}, colProps, { style: { paddingTop: 4 } }),
                     React.createElement(Button, { type: "primary", className: 'mr10', size: 'small', htmlType: "submit" }, "\u641C\u7D22"),
                     React.createElement(Button, { size: 'small', onClick: clear }, "\u6E05\u7A7A"))) : null),
-            !isOpShowAfter ? (React.createElement(Space, { direction: "vertical", size: "small", style: { textAlign: "right", width: 90 } },
+            !isOpShowAfter ? (React.createElement(Space, { size: "small", direction: isLineAfter ? undefined : "vertical", style: Object.assign({ width: 90, textAlign: "right" }, isLineAfter ? { width: 130, margin: "4px 0 0 12px" } : {}) },
                 React.createElement(Button, { type: "primary", size: 'small', htmlType: "submit" }, "\u641C\u7D22"),
                 React.createElement(Button, { size: 'small', onClick: clear }, "\u6E05\u7A7A"))) : null),
-        showMore ? (React.createElement(Button, { type: 'link', onClick: switchShow, style: { fontSize: 12, position: "absolute", bottom: -10, left: '50%', transform: "translateX(-50%)" }, size: 'small' }, moreFlag ? "收起" : "展开更多")) : null,
-        React.createElement("span", { style: {
-                position: "absolute",
-                height: 0,
-                width: "100%",
-                left: 0,
-                borderBottom: "1px dashed #efefef",
-                bottom: 4
-            } })));
+        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: [],

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ecoding/components.antd",
-    "version": "0.3.46",
+    "version": "0.3.48",
     "author": "cxc",
     "homepage": "",
     "license": "MIT",
@@ -43,5 +43,5 @@
         "antd": "^5.8.4",
         "axios": "^1.1.2"
     },
-    "gitHead": "bc713855b458f888f014acb50aea3040e36fd41e"
+    "gitHead": "8cba1e5d0bc72933d15c1f9b53343fbdbbb234b8"
 }