szld-libs 0.3.21 → 0.3.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/dist/szld-components.es.js +14376 -14161
  2. package/dist/szld-components.umd.js +47 -47
  3. package/es/components/DynamicForm/index.js +12 -12
  4. package/es/hooks/useDetailRender.d.ts +13 -7
  5. package/es/hooks/useDetailRender.js +162 -83
  6. package/es/index.css +35 -9
  7. package/es/mock/index.js +83 -18
  8. package/lib/components/DynamicForm/index.js +12 -12
  9. package/lib/hooks/useDetailRender.d.ts +13 -7
  10. package/lib/hooks/useDetailRender.js +160 -81
  11. package/lib/index.css +35 -9
  12. package/lib/mock/index.js +83 -18
  13. package/package.json +1 -1
  14. package/es/hooks/useRenderAttrSetDetail.d.ts +0 -25
  15. package/es/hooks/useRenderAttrSetDetail.js +0 -204
  16. package/lib/hooks/useRenderAttrSetDetail.d.ts +0 -25
  17. package/lib/hooks/useRenderAttrSetDetail.js +0 -203
package/es/components/DynamicForm/index.js CHANGED
@@ -57,9 +57,9 @@ const DynamicForm = forwardRef((props, ref) => {
57
57
  return delFileListRef.current;
58
58
  }
59
59
  }));
60
- return /* @__PURE__ */ jsx(Fragment, { children: formShowType === "table" ? /* @__PURE__ */ jsx(Form.List, { name: formListItemName || "customFormList", initialValue: [{}], children: (fields, { add, remove }) => /* @__PURE__ */ jsxs(Flex, { className: "custom-form-body", children: [
61
- /* @__PURE__ */ jsxs("div", { className: "custom-form-list", children: [
62
- /* @__PURE__ */ jsx(Flex, { align: "center", style: { position: "relative" }, children: /* @__PURE__ */ jsx(Flex, { className: "custom-form-list-header", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
60
+ return /* @__PURE__ */ jsx(Fragment, { children: formShowType === "table" ? /* @__PURE__ */ jsx(Form.List, { name: formListItemName || "customFormList", initialValue: [{}], children: (fields, { add, remove }) => /* @__PURE__ */ jsx(Flex, { className: "custom-form-body", children: /* @__PURE__ */ jsxs("div", { className: "custom-form-list", children: [
61
+ /* @__PURE__ */ jsxs(Flex, { align: "center", style: { position: "relative", backgroundColor: "#004d32" }, children: [
62
+ /* @__PURE__ */ jsx(Flex, { className: "custom-form-list-header", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
63
63
  var _a, _b;
64
64
  const width = ((_a = child == null ? void 0 : child.json) == null ? void 0 : _a["input-width"]) && Number((_b = child == null ? void 0 : child.json) == null ? void 0 : _b["input-width"]) || defaultWidth;
65
65
  return /* @__PURE__ */ jsxs(
@@ -77,8 +77,11 @@ const DynamicForm = forwardRef((props, ref) => {
77
77
  },
78
78
  index
79
79
  );
80
- }) }) }),
81
- fields.map((field) => /* @__PURE__ */ jsx(Flex, { align: "center", className: "custom-form-list-item-container", children: /* @__PURE__ */ jsx(Flex, { className: "custom-form-list-item", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
80
+ }) }),
81
+ /* @__PURE__ */ jsx("a", { className: "custom-form-list-add-btn", onClick: () => add(), children: langId === "10001" ? "新增" : "Add" })
82
+ ] }),
83
+ fields.map((field) => /* @__PURE__ */ jsxs(Flex, { align: "center", className: "custom-form-list-item-container", children: [
84
+ /* @__PURE__ */ jsx(Flex, { className: "custom-form-list-item", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
82
85
  var _a, _b;
83
86
  const width = ((_a = child == null ? void 0 : child.json) == null ? void 0 : _a["input-width"]) && Number((_b = child == null ? void 0 : child.json) == null ? void 0 : _b["input-width"]) || defaultWidth;
84
87
  return /* @__PURE__ */ jsx(
@@ -107,13 +110,10 @@ const DynamicForm = forwardRef((props, ref) => {
107
110
  },
108
111
  child.attrid || `child-${index}`
109
112
  );
110
- }) }) }, field.key))
111
- ] }),
112
- /* @__PURE__ */ jsxs(Flex, { className: "custom-form-list-right", vertical: true, children: [
113
- /* @__PURE__ */ jsx("a", { className: "custom-form-list-add-btn", onClick: () => add(), children: langId === "10001" ? "新增" : "Add" }),
114
- fields.map((field) => /* @__PURE__ */ jsx("a", { className: "custom-form-list-del-btn", onClick: () => remove(field.key), children: langId === "10001" ? "删除" : "Delete" }))
115
- ] })
116
- ] }) }) : /* @__PURE__ */ jsx(Row, { gutter: colSpace, children: formConfig.map((item, index) => /* @__PURE__ */ jsx(Fragment$1, { children: handleRenderItem({
113
+ }) }),
114
+ /* @__PURE__ */ jsx("a", { className: "custom-form-list-del-btn", onClick: () => remove(field.key), children: langId === "10001" ? "删除" : "Delete" })
115
+ ] }, field.key))
116
+ ] }) }) }) : /* @__PURE__ */ jsx(Row, { gutter: colSpace, children: formConfig.map((item, index) => /* @__PURE__ */ jsx(Fragment$1, { children: handleRenderItem({
117
117
  item,
118
118
  readonly,
119
119
  colNum,
package/es/hooks/useDetailRender.d.ts CHANGED
@@ -1,19 +1,25 @@
1
1
  /**
2
2
  * 宠物详情渲染 Hook
3
- * @param dogInfo 宠物详情数据
3
+ * @param attrList 属性列表数据
4
4
  * @param config 配置信息（用于文件预览地址）
5
5
  * @returns 渲染函数
6
6
  */
7
- interface IDetailRenderProps {
8
- detailInfo: any;
9
- mainApplicationDomain: string;
7
+ interface IAttrSetDetailRendererProps {
10
8
  labelSpan?: number;
11
9
  valueSpan?: number;
12
10
  imgWidth?: number;
13
11
  imgHeight?: number;
14
- useGrid?: boolean;
12
+ layoutType?: 'row' | 'flex';
15
13
  }
16
- export default function useDetailRenderer({ detailInfo, labelSpan, valueSpan, imgWidth, imgHeight, useGrid, mainApplicationDomain, }: IDetailRenderProps): {
17
- renderDetail: () => import("react/jsx-runtime").JSX.Element | null;
14
+ export default function useDetailRender({ labelSpan, valueSpan, imgWidth, imgHeight, layoutType, }: IAttrSetDetailRendererProps): {
15
+ renderDetail: ({ attrList, detailList, span, type, universalHeader, beforeExtraValue, operationColumn, }: {
16
+ attrList?: any[] | undefined;
17
+ detailList?: any[] | undefined;
18
+ span?: number | undefined;
19
+ type?: "form" | "table" | undefined;
20
+ universalHeader?: any[] | undefined;
21
+ beforeExtraValue?: string | undefined;
22
+ operationColumn?: any;
23
+ }) => import("react/jsx-runtime").JSX.Element;
18
24
  };
19
25
  export {};
package/es/hooks/useDetailRender.js CHANGED
@@ -1,24 +1,43 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import { Row, Space, Image, Col } from "antd";
1
+ import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
2
+ import { getJson, base64ToString } from "szld-libs/lib/utils/method";
3
+ import { App, Row, Col, Flex, Table, Space, Image } from "antd";
4
+ import { handleSetTableRowColor } from "../utils/szxkFunc";
5
+ import { useMemoizedFn } from "ahooks";
3
6
  import { Fragment } from "react";
4
- function useDetailRenderer({
5
- detailInfo,
7
+ function useDetailRender({
6
8
  labelSpan = 3,
7
9
  valueSpan = 9,
8
10
  imgWidth = 93,
9
11
  imgHeight = 93,
10
- useGrid = true,
11
- mainApplicationDomain = ""
12
+ layoutType = "row"
12
13
  }) {
13
- const handlePreviewFile = (filePath) => {
14
- var _a;
15
- (_a = window.parent) == null ? void 0 : _a.postMessage({ type: "previewDoc", docurl: filePath }, mainApplicationDomain);
14
+ const { message } = App.useApp();
15
+ const renderRadioCardAttr = (item, span) => {
16
+ try {
17
+ const attrvalue = JSON.parse((item == null ? void 0 : item.attrvalue) || "{}") || "";
18
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
19
+ layoutType === "flex" && /* @__PURE__ */ jsx(Col, { span, children: /* @__PURE__ */ jsxs(Flex, { children: [
20
+ /* @__PURE__ */ jsxs("span", { style: { flexShrink: 0 }, children: [
21
+ item == null ? void 0 : item.attrname,
22
+ "："
23
+ ] }),
24
+ /* @__PURE__ */ jsx("span", { style: { wordWrap: "break-word" }, children: attrvalue == null ? void 0 : attrvalue.typename })
25
+ ] }) }),
26
+ layoutType === "row" && /* @__PURE__ */ jsxs(Fragment$1, { children: [
27
+ /* @__PURE__ */ jsx(Col, { span: labelSpan, children: item == null ? void 0 : item.attrname }),
28
+ /* @__PURE__ */ jsx(Col, { span: valueSpan, style: { wordWrap: "break-word" }, children: item == null ? void 0 : item.attrvalue })
29
+ ] })
30
+ ] }, item == null ? void 0 : item.attrid);
31
+ } catch (error) {
32
+ message.error("房型数据格式错误，转json失败");
33
+ return null;
34
+ }
16
35
  };
17
- const renderImageAttr = (item) => {
36
+ const renderImageAttr = (item, span) => {
18
37
  if (typeof (item == null ? void 0 : item.attrvalue) !== "string")
19
38
  return;
20
39
  const attrvalues = JSON.parse((item == null ? void 0 : item.attrvalue) || "[]");
21
- const renderItem = /* @__PURE__ */ jsx(Space, { children: attrvalues.map((el, index) => /* @__PURE__ */ jsx(
40
+ const valueNode = () => /* @__PURE__ */ jsx(Space, { wrap: true, children: attrvalues.map((el, index) => /* @__PURE__ */ jsx(
22
41
  "div",
23
42
  {
24
43
  style: {
@@ -33,93 +52,153 @@ function useDetailRenderer({
33
52
  height: imgHeight,
34
53
  src: el == null ? void 0 : el.FilePath,
35
54
  alt: (item == null ? void 0 : item.attrname) || "-"
36
- },
37
- index
55
+ }
38
56
  )
39
57
  },
40
58
  index
41
59
  )) });
42
- if (!useGrid) {
43
- return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Col, { span: labelSpan, children: [
44
- item == null ? void 0 : item.attrname,
45
- "：",
46
- renderItem
47
- ] }) }, item.attrid);
48
- }
49
60
  return /* @__PURE__ */ jsxs(Fragment, { children: [
50
- /* @__PURE__ */ jsx(Col, { span: labelSpan, children: item == null ? void 0 : item.attrname }),
51
- /* @__PURE__ */ jsx(Col, { span: valueSpan, style: { wordWrap: "break-word" }, children: renderItem })
52
- ] }, item.attrid);
61
+ layoutType === "flex" && /* @__PURE__ */ jsx(Col, { span, children: /* @__PURE__ */ jsxs(Flex, { children: [
62
+ /* @__PURE__ */ jsxs("span", { style: { flexShrink: 0 }, children: [
63
+ item == null ? void 0 : item.attrname,
64
+ "："
65
+ ] }),
66
+ valueNode()
67
+ ] }) }),
68
+ layoutType === "row" && /* @__PURE__ */ jsxs(Fragment$1, { children: [
69
+ /* @__PURE__ */ jsx(Col, { span: labelSpan, children: item == null ? void 0 : item.attrname }),
70
+ /* @__PURE__ */ jsx(Col, { span: valueSpan, style: { wordWrap: "break-word" }, children: valueNode() })
71
+ ] })
72
+ ] }, item == null ? void 0 : item.attrid);
53
73
  };
54
- const renderFileAttr = (item) => {
55
- if (typeof (item == null ? void 0 : item.attrvalue) !== "string")
56
- return;
74
+ const renderFileAttr = (item, span) => {
57
75
  const attrvalues = JSON.parse((item == null ? void 0 : item.attrvalue) || "[]");
58
- const renderItem = /* @__PURE__ */ jsx(Space, { children: attrvalues.map((el, index) => /* @__PURE__ */ jsx("a", { onClick: () => handlePreviewFile(el == null ? void 0 : el.FilePath), children: (el == null ? void 0 : el.FileName) || "-" }, index)) });
59
- if (!useGrid) {
60
- return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Col, { span: labelSpan, style: { wordWrap: "break-word" }, children: [
61
- item == null ? void 0 : item.attrname,
62
- "：",
63
- renderItem
64
- ] }) }, item.attrid);
65
- }
76
+ const valueNode = () => /* @__PURE__ */ jsx(Space, { wrap: true, children: attrvalues.map((el, index) => /* @__PURE__ */ jsx("a", { onClick: () => window.open(el == null ? void 0 : el.FilePath), children: (el == null ? void 0 : el.FileName) || "-" }, index)) });
66
77
  return /* @__PURE__ */ jsxs(Fragment, { children: [
67
- /* @__PURE__ */ jsx(Col, { span: labelSpan, children: item == null ? void 0 : item.attrname }),
68
- /* @__PURE__ */ jsx(Col, { span: valueSpan, style: { wordWrap: "break-word" }, children: renderItem })
69
- ] }, item.attrid);
78
+ layoutType === "flex" && /* @__PURE__ */ jsx(Col, { span, children: /* @__PURE__ */ jsxs(Flex, { children: [
79
+ /* @__PURE__ */ jsxs("span", { style: { flexShrink: 0 }, children: [
80
+ item == null ? void 0 : item.attrname,
81
+ "："
82
+ ] }),
83
+ valueNode()
84
+ ] }) }),
85
+ layoutType === "row" && /* @__PURE__ */ jsxs(Fragment$1, { children: [
86
+ /* @__PURE__ */ jsx(Col, { span: labelSpan, children: item == null ? void 0 : item.attrname }),
87
+ /* @__PURE__ */ jsx(Col, { span: valueSpan, style: { wordWrap: "break-word" }, children: valueNode() })
88
+ ] })
89
+ ] }, item == null ? void 0 : item.attrid);
70
90
  };
71
- const renderTextAttr = (item) => {
72
- if (!useGrid) {
73
- return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Col, { span: labelSpan, style: { wordWrap: "break-word" }, children: [
74
- item == null ? void 0 : item.attrname,
75
- "：",
76
- (item == null ? void 0 : item.attrvalue) || "-"
77
- ] }) }, item.attrid);
78
- }
91
+ const renderTextAttr = (item, span, beforeExtraValue) => {
79
92
  return /* @__PURE__ */ jsxs(Fragment, { children: [
80
- /* @__PURE__ */ jsx(Col, { span: labelSpan, children: item == null ? void 0 : item.attrname }),
81
- /* @__PURE__ */ jsx(Col, { span: valueSpan, style: { wordWrap: "break-word" }, children: (item == null ? void 0 : item.attrvalue) || "-" })
82
- ] }, item.attrid);
93
+ layoutType === "flex" && /* @__PURE__ */ jsx(Col, { span, children: /* @__PURE__ */ jsxs(Flex, { children: [
94
+ /* @__PURE__ */ jsxs("span", { style: { flexShrink: 0 }, children: [
95
+ item == null ? void 0 : item.attrname,
96
+ "："
97
+ ] }),
98
+ /* @__PURE__ */ jsxs("span", { style: { wordWrap: "break-word" }, children: [
99
+ beforeExtraValue || "",
100
+ " ",
101
+ (item == null ? void 0 : item.attrvalue) || "-",
102
+ " "
103
+ ] })
104
+ ] }) }),
105
+ layoutType === "row" && /* @__PURE__ */ jsxs(Fragment$1, { children: [
106
+ /* @__PURE__ */ jsx(Col, { span: labelSpan, children: item == null ? void 0 : item.attrname }),
107
+ /* @__PURE__ */ jsxs(Col, { span: valueSpan, style: { wordWrap: "break-word" }, children: [
108
+ beforeExtraValue || "",
109
+ (item == null ? void 0 : item.attrvalue) || "-"
110
+ ] })
111
+ ] })
112
+ ] }, item == null ? void 0 : item.attrid);
83
113
  };
84
- const renderDetail = () => {
85
- if (!detailInfo)
86
- return null;
87
- const renderAttrItems = (items) => {
88
- var _a;
89
- return (_a = items == null ? void 0 : items.filter((item) => (item == null ? void 0 : item.attrtype) === 0)) == null ? void 0 : _a.map((item) => {
90
- const info = (item == null ? void 0 : item.json) || (item == null ? void 0 : item.info) && JSON.parse(item.info);
91
- let content;
114
+ const renderTableDetail = ({
115
+ detailList = [],
116
+ attrList = [],
117
+ universalHeader = [],
118
+ operationColumn
119
+ }) => {
120
+ var _a;
121
+ let columns = [];
122
+ if (universalHeader == null ? void 0 : universalHeader.length) {
123
+ columns = universalHeader == null ? void 0 : universalHeader.map((item) => ({
124
+ title: item == null ? void 0 : item["header-name"],
125
+ dataIndex: item == null ? void 0 : item["header-attribute-id"],
126
+ key: item == null ? void 0 : item["header-attribute-id"],
127
+ width: item == null ? void 0 : item["header-width"]
128
+ }));
129
+ } else {
130
+ columns = (_a = attrList == null ? void 0 : attrList[0]) == null ? void 0 : _a.map((item) => {
131
+ var _a2;
132
+ return {
133
+ title: item == null ? void 0 : item.attrname,
134
+ dataIndex: item == null ? void 0 : item.attrid,
135
+ key: item == null ? void 0 : item.attrid,
136
+ width: ((_a2 = item == null ? void 0 : item.json) == null ? void 0 : _a2["input-width"]) || 200
137
+ };
138
+ });
139
+ }
140
+ if (operationColumn && (columns == null ? void 0 : columns.length)) {
141
+ columns.push(operationColumn);
142
+ }
143
+ let dataSource = detailList;
144
+ if (attrList == null ? void 0 : attrList.length) {
145
+ dataSource = attrList == null ? void 0 : attrList.map((v, i) => ({
146
+ jxqyglbh: i,
147
+ ...handleDealAttrList(v)
148
+ }));
149
+ }
150
+ return /* @__PURE__ */ jsx(Flex, { align: "center", style: { width: "100%" }, children: /* @__PURE__ */ jsx(
151
+ Table,
152
+ {
153
+ style: { width: "100%" },
154
+ columns,
155
+ scroll: { x: "max-content" },
156
+ size: "small",
157
+ rowKey: "jxqyglbh",
158
+ onRow: handleSetTableRowColor,
159
+ dataSource,
160
+ pagination: false
161
+ }
162
+ ) });
163
+ };
164
+ const handleDealAttrList = (attrList) => {
165
+ return attrList == null ? void 0 : attrList.reduce((pre, cur) => {
166
+ pre[cur == null ? void 0 : cur.attrid] = cur == null ? void 0 : cur.attrvalue;
167
+ return pre;
168
+ }, {});
169
+ };
170
+ const renderDetail = useMemoizedFn(
171
+ ({
172
+ attrList = [],
173
+ detailList = [],
174
+ span = 24,
175
+ type = "form",
176
+ universalHeader = [],
177
+ beforeExtraValue = "",
178
+ operationColumn
179
+ }) => {
180
+ if (type === "table") {
181
+ return /* @__PURE__ */ jsx(Fragment, { children: renderTableDetail({ detailList, attrList, universalHeader, operationColumn }) });
182
+ }
183
+ return /* @__PURE__ */ jsx(Row, { gutter: [10, 8], children: attrList == null ? void 0 : attrList.map((item) => {
184
+ if ((item == null ? void 0 : item.attrtype) !== 0)
185
+ return /* @__PURE__ */ jsx(Fragment, {}, item == null ? void 0 : item.attrid);
186
+ const info = item.info_base64 === 1 ? getJson(base64ToString(item.info)) : getJson(item.info);
92
187
  if ((info == null ? void 0 : info.input) === "image") {
93
- content = renderImageAttr(item);
94
- } else if (["file", "audio", "video"].includes(info == null ? void 0 : info.input)) {
95
- content = renderFileAttr(item);
96
- } else {
97
- content = renderTextAttr(item);
188
+ return renderImageAttr(item, span);
98
189
  }
99
- if ((item == null ? void 0 : item.children) && item.children.length > 0) {
100
- return /* @__PURE__ */ jsxs(Fragment, { children: [
101
- content,
102
- /* @__PURE__ */ jsx(
103
- "div",
104
- {
105
- style: {
106
- marginLeft: "16px",
107
- marginTop: "8px",
108
- borderLeft: "2px dashed #e8e8e8",
109
- paddingLeft: "16px"
110
- },
111
- children: renderAttrItems(item.children)
112
- }
113
- )
114
- ] }, item.attrid);
190
+ if (["file", "audio", "video"].includes(info == null ? void 0 : info.input)) {
191
+ return renderFileAttr(item, span);
115
192
  }
116
- return content;
117
- });
118
- };
119
- return /* @__PURE__ */ jsx(Row, { gutter: [15, 15], children: renderAttrItems(detailInfo == null ? void 0 : detailInfo.attr_list) });
120
- };
193
+ if ((info == null ? void 0 : info.input) === "radio-card") {
194
+ return renderRadioCardAttr(item, span);
195
+ }
196
+ return renderTextAttr(item, span, beforeExtraValue);
197
+ }) });
198
+ }
199
+ );
121
200
  return { renderDetail };
122
201
  }
123
202
  export {
124
- useDetailRenderer as default
203
+ useDetailRender as default
125
204
  };
package/es/index.css CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  .custom-form-body {
3
- width: 1236px;
3
+ width: 1300;
4
4
  }
5
5
  .custom-form-body .custom-form-list {
6
6
  position: relative;
@@ -25,10 +25,18 @@
25
25
  .custom-form-body .custom-form-list .custom-form-list-header-item:first-child {
26
26
  margin-left: 14px;
27
27
  }
28
+ .custom-form-body .custom-form-list .custom-form-list-item-container {
29
+ position: relative;
30
+ }
28
31
  .custom-form-body .custom-form-list .custom-form-list-item-container .custom-form-list-item {
29
32
  width: fit-content;
30
- min-width: 100%;
33
+ min-width: fit-content;
31
34
  /* 确保至少占满可视区域 */
35
+ min-height: 48px;
36
+ height: auto;
37
+ /* 或者 100%，确保高度撑满 */
38
+ display: flex;
39
+ align-items: center;
32
40
  }
33
41
  .custom-form-body .custom-form-list .custom-form-list-item-container .custom-form-list-item .custom-form-list-item-content {
34
42
  min-height: 48px;
@@ -39,9 +47,15 @@
39
47
  .custom-form-body .custom-form-list .custom-form-list-item-container .custom-form-list-item .custom-form-list-item-content .ant-form-item-control-input-content:nth-child(1) {
40
48
  margin-left: 14px;
41
49
  }
50
+ .custom-form-body .custom-form-list .custom-form-list-item-container:nth-child(even) .custom-form-list-item {
51
+ background: #d6e2de !important;
52
+ }
42
53
  .custom-form-body .custom-form-list .custom-form-list-item-container:nth-child(even) .custom-form-list-item .custom-form-list-item-content {
43
54
  background: #d6e2de !important;
44
55
  }
56
+ .custom-form-body .custom-form-list .custom-form-list-item-container:nth-child(odd) .custom-form-list-item {
57
+ background-color: #c2d4ce !important;
58
+ }
45
59
  .custom-form-body .custom-form-list .custom-form-list-item-container:nth-child(odd) .custom-form-list-item .custom-form-list-item-content {
46
60
  background-color: #c2d4ce !important;
47
61
  }
@@ -51,19 +65,31 @@
51
65
  width: 48px;
52
66
  height: 48px;
53
67
  line-height: 48px;
54
- text-align: center;
68
+ display: flex;
69
+ flex-direction: row-reverse;
70
+ flex-shrink: 0;
71
+ position: sticky;
72
+ text-decoration: underline;
73
+ text-align: right;
74
+ right: 0;
75
+ top: 0;
55
76
  }
56
77
  .custom-form-body .custom-form-list-del-btn {
57
- display: inline-block;
58
78
  background: #fff;
59
79
  width: 48px;
60
- height: 48px;
61
80
  line-height: 48px;
62
81
  text-align: center;
63
82
  color: #dc0000;
83
+ display: flex;
84
+ flex-direction: row-reverse;
85
+ align-items: center;
86
+ align-self: stretch;
87
+ /* 关键：让按钮高度填满父容器 */
64
88
  flex-shrink: 0;
65
- }
66
- .custom-form-body .custom-form-list-right {
67
- width: 48;
68
- background-color: '#fff';
89
+ position: sticky;
90
+ text-decoration: underline;
91
+ text-align: right;
92
+ right: 0;
93
+ top: 0;
94
+ bottom: 0;
69
95
  }
package/es/mock/index.js CHANGED
@@ -2,45 +2,110 @@ const baseAttrList = [];
2
2
  const attrList = [
3
3
  {
4
4
  xh: 1,
5
- asid: "DC6FAFA331D84484BCE19E21738AD767",
5
+ asid: "06C6CE201AB44B2CAAB11C753374AA40",
6
6
  astype: 0,
7
- tname: "fjffjc_table2",
8
- attrid: "B3C4795F7CA849CD839539249F74BCE3",
9
- attrname: "How Many times",
7
+ tname: "tsyy_table2",
8
+ attrid: "30BDE6E7977E40069B55DDE61C8795AE",
9
+ attrname: "Dates",
10
10
  attrtype: 0,
11
- info: '{"input":"text","dataType":"string","length":100,"input-width":396,"default":1}',
11
+ info: '{"input":"multiple-date-picker","range-picker-save":"single","dataType":"string","length":1000,"input-width":240,"must":true}',
12
12
  info_base64: 0,
13
- createtime: "2026-02-11 15:14:14",
13
+ createtime: "2026-02-11 15:12:26",
14
14
  attrvalue: "",
15
15
  serialnum: 1,
16
16
  children: [],
17
17
  json: {
18
- input: "text",
18
+ input: "multiple-date-picker",
19
+ "range-picker-save": "single",
19
20
  dataType: "string",
20
- length: 100,
21
- "input-width": 396,
22
- default: 1
21
+ length: 1e3,
22
+ "input-width": 240,
23
+ must: true
23
24
  }
24
25
  },
25
26
  {
26
27
  xh: 2,
27
- asid: "DC6FAFA331D84484BCE19E21738AD767",
28
+ asid: "06C6CE201AB44B2CAAB11C753374AA40",
28
29
  astype: 0,
29
- tname: "fjffjc_table2",
30
- attrid: "2A08BD562A9A48E3843A59D6396E2F21",
31
- attrname: "what time?",
30
+ tname: "tsyy_table2",
31
+ attrid: "38A7DADC6D64492D83DA607EC121A02D",
32
+ attrname: "How Many Times",
32
33
  attrtype: 0,
33
- info: '{"input":"text","dataType":"string","length":100,"input-width":396}',
34
+ info: '{"input":"text","dataType":"string","length":10,"input-width":140,"must":true}',
34
35
  info_base64: 0,
35
- createtime: "2026-02-11 15:14:14",
36
+ createtime: "2026-02-11 15:12:26",
37
+ attrvalue: "",
38
+ serialnum: 2,
39
+ children: [],
40
+ json: {
41
+ input: "text",
42
+ dataType: "string",
43
+ length: 10,
44
+ "input-width": 140,
45
+ must: true
46
+ }
47
+ },
48
+ {
49
+ xh: 3,
50
+ asid: "06C6CE201AB44B2CAAB11C753374AA40",
51
+ astype: 0,
52
+ tname: "tsyy_table2",
53
+ attrid: "7BB9BE8A96824CCF89B721C8F1AF9F38",
54
+ attrname: "Feeding Time",
55
+ attrtype: 0,
56
+ info: '{"input":"second-picker","dataType":"string","length":200,"input-width":240}',
57
+ info_base64: 0,
58
+ createtime: "2026-02-11 15:12:26",
36
59
  attrvalue: "",
37
60
  serialnum: 3,
38
61
  children: [],
62
+ json: {
63
+ input: "second-picker",
64
+ dataType: "string",
65
+ length: 200,
66
+ "input-width": 240
67
+ }
68
+ },
69
+ {
70
+ xh: 4,
71
+ asid: "06C6CE201AB44B2CAAB11C753374AA40",
72
+ astype: 0,
73
+ tname: "tsyy_table2",
74
+ attrid: "665F59E637664037939512C9877EAD75",
75
+ attrname: "Meds Info",
76
+ attrtype: 0,
77
+ info: '{"input":"text","dataType":"string","length":500,"input-width":240}',
78
+ info_base64: 0,
79
+ createtime: "2026-02-11 15:12:26",
80
+ attrvalue: "",
81
+ serialnum: 4,
82
+ children: [],
83
+ json: {
84
+ input: "text",
85
+ dataType: "string",
86
+ length: 500,
87
+ "input-width": 240
88
+ }
89
+ },
90
+ {
91
+ xh: 5,
92
+ asid: "06C6CE201AB44B2CAAB11C753374AA40",
93
+ astype: 0,
94
+ tname: "tsyy_table2",
95
+ attrid: "290CF33D2AAD45399987987FAB80900B",
96
+ attrname: "Feeding Instruction",
97
+ attrtype: 0,
98
+ info: '{"input":"text","dataType":"string","length":500,"input-width":340}',
99
+ info_base64: 0,
100
+ createtime: "2026-02-11 15:12:26",
101
+ attrvalue: "",
102
+ serialnum: 5,
103
+ children: [],
39
104
  json: {
40
105
  input: "text",
41
106
  dataType: "string",
42
- length: 100,
43
- "input-width": 396
107
+ length: 500,
108
+ "input-width": 340
44
109
  }
45
110
  }
46
111
  ];
package/lib/components/DynamicForm/index.js CHANGED
@@ -58,9 +58,9 @@ const DynamicForm = react.forwardRef((props, ref) => {
58
58
  return delFileListRef.current;
59
59
  }
60
60
  }));
61
- return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: formShowType === "table" ? /* @__PURE__ */ jsxRuntime.jsx(antd.Form.List, { name: formListItemName || "customFormList", initialValue: [{}], children: (fields, { add, remove }) => /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { className: "custom-form-body", children: [
62
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "custom-form-list", children: [
63
- /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { align: "center", style: { position: "relative" }, children: /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { className: "custom-form-list-header", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
61
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: formShowType === "table" ? /* @__PURE__ */ jsxRuntime.jsx(antd.Form.List, { name: formListItemName || "customFormList", initialValue: [{}], children: (fields, { add, remove }) => /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { className: "custom-form-body", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "custom-form-list", children: [
62
+ /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { align: "center", style: { position: "relative", backgroundColor: "#004d32" }, children: [
63
+ /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { className: "custom-form-list-header", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
64
64
  var _a, _b;
65
65
  const width = ((_a = child == null ? void 0 : child.json) == null ? void 0 : _a["input-width"]) && Number((_b = child == null ? void 0 : child.json) == null ? void 0 : _b["input-width"]) || defaultWidth;
66
66
  return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -78,8 +78,11 @@ const DynamicForm = react.forwardRef((props, ref) => {
78
78
  },
79
79
  index
80
80
  );
81
- }) }) }),
82
- fields.map((field) => /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { align: "center", className: "custom-form-list-item-container", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { className: "custom-form-list-item", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
81
+ }) }),
82
+ /* @__PURE__ */ jsxRuntime.jsx("a", { className: "custom-form-list-add-btn", onClick: () => add(), children: langId === "10001" ? "新增" : "Add" })
83
+ ] }),
84
+ fields.map((field) => /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { align: "center", className: "custom-form-list-item-container", children: [
85
+ /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { className: "custom-form-list-item", align: "center", children: formConfig == null ? void 0 : formConfig.map((child, index) => {
83
86
  var _a, _b;
84
87
  const width = ((_a = child == null ? void 0 : child.json) == null ? void 0 : _a["input-width"]) && Number((_b = child == null ? void 0 : child.json) == null ? void 0 : _b["input-width"]) || defaultWidth;
85
88
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -108,13 +111,10 @@ const DynamicForm = react.forwardRef((props, ref) => {
108
111
  },
109
112
  child.attrid || `child-${index}`
110
113
  );
111
- }) }) }, field.key))
112
- ] }),
113
- /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { className: "custom-form-list-right", vertical: true, children: [
114
- /* @__PURE__ */ jsxRuntime.jsx("a", { className: "custom-form-list-add-btn", onClick: () => add(), children: langId === "10001" ? "新增" : "Add" }),
115
- fields.map((field) => /* @__PURE__ */ jsxRuntime.jsx("a", { className: "custom-form-list-del-btn", onClick: () => remove(field.key), children: langId === "10001" ? "删除" : "Delete" }))
116
- ] })
117
- ] }) }) : /* @__PURE__ */ jsxRuntime.jsx(antd.Row, { gutter: colSpace, children: formConfig.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(react.Fragment, { children: handleRenderItem({
114
+ }) }),
115
+ /* @__PURE__ */ jsxRuntime.jsx("a", { className: "custom-form-list-del-btn", onClick: () => remove(field.key), children: langId === "10001" ? "删除" : "Delete" })
116
+ ] }, field.key))
117
+ ] }) }) }) : /* @__PURE__ */ jsxRuntime.jsx(antd.Row, { gutter: colSpace, children: formConfig.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(react.Fragment, { children: handleRenderItem({
118
118
  item,
119
119
  readonly,
120
120
  colNum,
package/lib/hooks/useDetailRender.d.ts CHANGED
@@ -1,19 +1,25 @@
1
1
  /**
2
2
  * 宠物详情渲染 Hook
3
- * @param dogInfo 宠物详情数据
3
+ * @param attrList 属性列表数据
4
4
  * @param config 配置信息（用于文件预览地址）
5
5
  * @returns 渲染函数
6
6
  */
7
- interface IDetailRenderProps {
8
- detailInfo: any;
9
- mainApplicationDomain: string;
7
+ interface IAttrSetDetailRendererProps {
10
8
  labelSpan?: number;
11
9
  valueSpan?: number;
12
10
  imgWidth?: number;
13
11
  imgHeight?: number;
14
- useGrid?: boolean;
12
+ layoutType?: 'row' | 'flex';
15
13
  }
16
- export default function useDetailRenderer({ detailInfo, labelSpan, valueSpan, imgWidth, imgHeight, useGrid, mainApplicationDomain, }: IDetailRenderProps): {
17
- renderDetail: () => import("react/jsx-runtime").JSX.Element | null;
14
+ export default function useDetailRender({ labelSpan, valueSpan, imgWidth, imgHeight, layoutType, }: IAttrSetDetailRendererProps): {
15
+ renderDetail: ({ attrList, detailList, span, type, universalHeader, beforeExtraValue, operationColumn, }: {
16
+ attrList?: any[] | undefined;
17
+ detailList?: any[] | undefined;
18
+ span?: number | undefined;
19
+ type?: "form" | "table" | undefined;
20
+ universalHeader?: any[] | undefined;
21
+ beforeExtraValue?: string | undefined;
22
+ operationColumn?: any;
23
+ }) => import("react/jsx-runtime").JSX.Element;
18
24
  };
19
25
  export {};