szld-libs 0.2.4 → 0.2.6

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 (7) hide show
  1. package/dist/szld-components.es.js +2023 -2038
  2. package/dist/szld-components.umd.js +28 -29
  3. package/es/components/EditTable/index.js +2 -3
  4. package/es/index.js +56 -197
  5. package/lib/components/EditTable/index.js +2 -3
  6. package/lib/index.js +53 -194
  7. package/package.json +2 -3
package/es/components/EditTable/index.js CHANGED
@@ -2,6 +2,7 @@ import { jsx } from "react/jsx-runtime";
2
2
  import { Table, Form } from "antd";
3
3
  import React, { useRef, useContext } from "react";
4
4
  import { FormFields } from "../CreateForm";
5
+ import _ from "lodash";
5
6
  const editableCellValueWrap = "editable-module_editableCellValueWrap_3b3d9";
6
7
  const classes = {
7
8
  editableCellValueWrap
@@ -12,7 +13,6 @@ const EditableRow = ({ index, ...props }) => {
12
13
  return /* @__PURE__ */ jsx(Form, { form, component: false, children: /* @__PURE__ */ jsx(EditableContext.Provider, { value: form, children: /* @__PURE__ */ jsx("tr", { ...props }) }) });
13
14
  };
14
15
  function EditableCell(props) {
15
- console.log(props, "props");
16
16
  const {
17
17
  title,
18
18
  editable,
@@ -32,7 +32,6 @@ function EditableCell(props) {
32
32
  const values = await form.validateFields();
33
33
  onChange({ ...record, ...values });
34
34
  } catch (errInfo) {
35
- console.log("Save failed:", errInfo);
36
35
  }
37
36
  };
38
37
  const renderItem = () => {
@@ -55,7 +54,7 @@ function EditableCell(props) {
55
54
  Form.Item,
56
55
  {
57
56
  style: { margin: 0 },
58
- initialValue: record[dataIndex],
57
+ initialValue: _.get(record, dataIndex),
59
58
  name: dataIndex,
60
59
  rules,
61
60
  children: renderItem()
package/es/index.js CHANGED
@@ -1,14 +1,13 @@
1
- import { jsx, jsxs, Fragment } from "react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useState } from "react";
3
3
  import ReactDOM from "react-dom/client";
4
4
  import { BrowserRouter } from "react-router-dom";
5
- import { BackHeader, AuthButton, SearchTable, UploadFile, showWorkFlow } from "./main";
6
- import CoralButton from "./components/CoralButton";
7
- import { Form, Space, Input, Button } from "antd";
8
- import { fileToDataURL, compressionFile } from "./utils/compression-file";
5
+ import { EditTable } from "./main";
6
+ import { Form } from "antd";
7
+ import "./utils/compression-file";
9
8
  const Demo = () => {
10
- const [form] = Form.useForm();
11
- useState([
9
+ Form.useForm();
10
+ const [list, setList] = useState([
12
11
  {
13
12
  PNOrderNo: 1,
14
13
  PNName: "未分配",
@@ -28,6 +27,40 @@ const Demo = () => {
28
27
  Remark: ""
29
28
  }
30
29
  ]);
30
+ const columns = [
31
+ {
32
+ dataIndex: "PNOrderNo",
33
+ title: "序号",
34
+ width: 80
35
+ },
36
+ {
37
+ dataIndex: "PNName",
38
+ title: "节点名称"
39
+ },
40
+ {
41
+ dataIndex: "PlanFinishDate",
42
+ title: "预计完成时间",
43
+ editable: true,
44
+ width: 400,
45
+ type: "datePicker",
46
+ valueProps: {
47
+ placeholder: "请输入内容"
48
+ }
49
+ },
50
+ {
51
+ dataIndex: "Remark",
52
+ title: "备注",
53
+ editable: true,
54
+ type: "textarea",
55
+ width: 400,
56
+ valueProps: {
57
+ placeholder: "请输入内容",
58
+ autoSize: {
59
+ minRows: 3
60
+ }
61
+ }
62
+ }
63
+ ];
31
64
  useState(
32
65
  Array.from({ length: 1e5 }, (_, key) => ({
33
66
  key,
@@ -36,8 +69,8 @@ const Demo = () => {
36
69
  }))
37
70
  );
38
71
  useState(false);
39
- const [file, setFile] = useState("");
40
- const [file2, setFile2] = useState("");
72
+ useState("");
73
+ useState("");
41
74
  useState([
42
75
  {
43
76
  uid: "-1",
@@ -58,195 +91,21 @@ const Demo = () => {
58
91
  url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
59
92
  }
60
93
  ]);
61
- const handleClick = () => {
62
- showWorkFlow({
63
- data: Array(10).fill(0).map((v, index) => ({
64
- id: String(index),
65
- PNName: String(index),
66
- Remark: index,
67
- IsLatest: 2
68
- })),
69
- rowKey: (row) => row.id,
70
- current: "5",
71
- currentIndex: 5,
72
- wrapClassName: "confirmWrapper",
73
- renderContent: selfWorlflowItem
74
- });
75
- };
76
- const selfWorlflowItem = (item, index, currentIndex) => {
77
- let i = 0;
78
- if (index < currentIndex) {
79
- i = 1;
80
- } else if (index === currentIndex) {
81
- i = Number(item.IsLatest) === 2 ? 2 : 3;
94
+ return /* @__PURE__ */ jsx("div", { style: { height: "100vh" }, children: /* @__PURE__ */ jsx(
95
+ EditTable,
96
+ {
97
+ columns,
98
+ rowKey: "PNOrderNo",
99
+ onChange: (row) => {
100
+ const index = list.findIndex((v) => v.PNOrderNo === row.PNOrderNo);
101
+ const arr = [...list];
102
+ arr[index] = row;
103
+ setList(arr);
104
+ },
105
+ dataSource: list,
106
+ pagination: false
82
107
  }
83
- return /* @__PURE__ */ jsxs(Fragment, { children: [
84
- /* @__PURE__ */ jsx(
85
- "div",
86
- {
87
- style: {
88
- fontSize: "16px",
89
- color: ["#666", "#333", "#FF0000", "#1864ff"][i],
90
- fontWeight: 400,
91
- marginBottom: "8px"
92
- },
93
- children: item.PNName
94
- }
95
- ),
96
- /* @__PURE__ */ jsx(
97
- "div",
98
- {
99
- style: {
100
- display: "flex",
101
- alignItems: "center",
102
- gap: "20px",
103
- fontSize: "14px",
104
- color: "#666"
105
- },
106
- children: item.UpdateTime ? /* @__PURE__ */ jsxs("span", { style: { color: "#333", fontWeight: "bold" }, children: [
107
- "实际完成时间: ",
108
- item.UpdateTime
109
- ] }) : /* @__PURE__ */ jsxs("span", { children: [
110
- "预计完成时间: ",
111
- item.PlanFinishDate || "暂无"
112
- ] })
113
- }
114
- ),
115
- item.Remark && /* @__PURE__ */ jsx(
116
- "div",
117
- {
118
- style: {
119
- marginTop: "10px",
120
- background: "#ffffff",
121
- border: "4px solid #fafafa",
122
- borderRadius: "2px",
123
- fontSize: "14px",
124
- fontWeight: 400,
125
- color: "#666",
126
- padding: "20px",
127
- wordBreak: "break-all"
128
- },
129
- children: item.Remark
130
- }
131
- )
132
- ] });
133
- };
134
- const onChange = async (e) => {
135
- console.log(e);
136
- const file3 = e.target.files[0];
137
- const base64 = await fileToDataURL(file3);
138
- setFile(base64);
139
- const newFile = await compressionFile(file3, "image/jpeg", 0.2);
140
- console.log(newFile);
141
- const base64_2 = await fileToDataURL(newFile);
142
- setFile2(base64_2);
143
- };
144
- return /* @__PURE__ */ jsxs("div", { style: { height: "100vh" }, children: [
145
- /* @__PURE__ */ jsx(BackHeader, { title: "标题111", subTitle: /* @__PURE__ */ jsx("span", { children: "副标题" }) }),
146
- /* @__PURE__ */ jsx(AuthButton, { type: "primary", children: "按钮1" }),
147
- /* @__PURE__ */ jsx(CoralButton, { PId: 100, auths: [{ PId: 100 }], children: "123" }),
148
- /* @__PURE__ */ jsx(
149
- SearchTable,
150
- {
151
- searchProps: {
152
- items: [
153
- {
154
- dataIndex: "name",
155
- valueProps: {
156
- placeholder: "名称"
157
- },
158
- colProps: {
159
- span: 6
160
- }
161
- },
162
- {
163
- valueType: "custom",
164
- valueProps: {
165
- children: /* @__PURE__ */ jsxs(Space, { children: [
166
- /* @__PURE__ */ jsx(Form.Item, { name: "yzm", noStyle: true, children: /* @__PURE__ */ jsx(Input, { placeholder: "请输入验证码" }) }),
167
- /* @__PURE__ */ jsx(Button, { children: "发送验证码" })
168
- ] })
169
- },
170
- colProps: {
171
- span: 6
172
- }
173
- },
174
- {
175
- dataIndex: "mm",
176
- valueType: "password",
177
- colProps: {
178
- span: 6
179
- }
180
- },
181
- {
182
- dataIndex: "pic",
183
- valueType: "upload",
184
- valueProps: {
185
- maxCount: 1
186
- },
187
- colProps: {
188
- span: 12
189
- }
190
- },
191
- {
192
- dataIndex: "pic2",
193
- colProps: {
194
- span: 12
195
- }
196
- },
197
- {
198
- dataIndex: "qwe",
199
- valueProps: {
200
- placeholder: "name"
201
- },
202
- colProps: {
203
- span: 12
204
- }
205
- },
206
- {
207
- dataIndex: "btns",
208
- valueType: "btns",
209
- valueProps: [
210
- {
211
- btnType: "submit",
212
- title: "确定",
213
- type: "primary",
214
- onClick: (v) => console.log(v)
215
- }
216
- ]
217
- }
218
- ],
219
- formProps: { wrapperCol: { span: 24 }, form }
220
- },
221
- tableProps: {
222
- minColumnWidth: 100,
223
- columns: [
224
- { dataIndex: "A", title: "A", width: 100 },
225
- { dataIndex: "B", title: "B", width: 200 },
226
- { dataIndex: "C", title: "C", width: 200 },
227
- { dataIndex: "D", title: "D" },
228
- { dataIndex: "E", title: "E", width: 150 },
229
- { dataIndex: "F", title: "F", width: 150 }
230
- ],
231
- pagination: false,
232
- rowKey: "A",
233
- dataSource: Array(3).fill(0).map((v, i) => ({ A: i + 1 }))
234
- }
235
- }
236
- ),
237
- /* @__PURE__ */ jsx(Button, { onClick: handleClick, children: "click" }),
238
- /* @__PURE__ */ jsx(Input, { type: "file", onChange }),
239
- /* @__PURE__ */ jsx(
240
- UploadFile,
241
- {
242
- compression: { type: "image/jpeg", quality: 0.2, limit: 300 },
243
- maxSize: 100,
244
- onChange: (info) => console.log(info)
245
- }
246
- ),
247
- /* @__PURE__ */ jsx("img", { src: file, style: { width: 400 } }),
248
- /* @__PURE__ */ jsx("img", { src: file2, style: { width: 400 } })
249
- ] });
108
+ ) });
250
109
  };
251
110
  ReactDOM.createRoot(document.getElementById("root")).render(
252
111
  /* @__PURE__ */ jsx(BrowserRouter, { children: /* @__PURE__ */ jsx(Demo, {}) })
package/lib/components/EditTable/index.js CHANGED
@@ -3,6 +3,7 @@ const jsxRuntime = require("react/jsx-runtime");
3
3
  const antd = require("antd");
4
4
  const React = require("react");
5
5
  const CreateForm = require("../CreateForm");
6
+ const _ = require("lodash");
6
7
  const editableCellValueWrap = "editable-module_editableCellValueWrap_3b3d9";
7
8
  const classes = {
8
9
  editableCellValueWrap
@@ -13,7 +14,6 @@ const EditableRow = ({ index, ...props }) => {
13
14
  return /* @__PURE__ */ jsxRuntime.jsx(antd.Form, { form, component: false, children: /* @__PURE__ */ jsxRuntime.jsx(EditableContext.Provider, { value: form, children: /* @__PURE__ */ jsxRuntime.jsx("tr", { ...props }) }) });
14
15
  };
15
16
  function EditableCell(props) {
16
- console.log(props, "props");
17
17
  const {
18
18
  title,
19
19
  editable,
@@ -33,7 +33,6 @@ function EditableCell(props) {
33
33
  const values = await form.validateFields();
34
34
  onChange({ ...record, ...values });
35
35
  } catch (errInfo) {
36
- console.log("Save failed:", errInfo);
37
36
  }
38
37
  };
39
38
  const renderItem = () => {
@@ -56,7 +55,7 @@ function EditableCell(props) {
56
55
  antd.Form.Item,
57
56
  {
58
57
  style: { margin: 0 },
59
- initialValue: record[dataIndex],
58
+ initialValue: _.get(record, dataIndex),
60
59
  name: dataIndex,
61
60
  rules,
62
61
  children: renderItem()
package/lib/index.js CHANGED
@@ -4,12 +4,11 @@ const react = require("react");
4
4
  const ReactDOM = require("react-dom/client");
5
5
  const reactRouterDom = require("react-router-dom");
6
6
  const main = require("./main");
7
- const CoralButton = require("./components/CoralButton");
8
7
  const antd = require("antd");
9
- const compressionFile = require("./utils/compression-file");
8
+ require("./utils/compression-file");
10
9
  const Demo = () => {
11
- const [form] = antd.Form.useForm();
12
- react.useState([
10
+ antd.Form.useForm();
11
+ const [list, setList] = react.useState([
13
12
  {
14
13
  PNOrderNo: 1,
15
14
  PNName: "未分配",
@@ -29,6 +28,40 @@ const Demo = () => {
29
28
  Remark: ""
30
29
  }
31
30
  ]);
31
+ const columns = [
32
+ {
33
+ dataIndex: "PNOrderNo",
34
+ title: "序号",
35
+ width: 80
36
+ },
37
+ {
38
+ dataIndex: "PNName",
39
+ title: "节点名称"
40
+ },
41
+ {
42
+ dataIndex: "PlanFinishDate",
43
+ title: "预计完成时间",
44
+ editable: true,
45
+ width: 400,
46
+ type: "datePicker",
47
+ valueProps: {
48
+ placeholder: "请输入内容"
49
+ }
50
+ },
51
+ {
52
+ dataIndex: "Remark",
53
+ title: "备注",
54
+ editable: true,
55
+ type: "textarea",
56
+ width: 400,
57
+ valueProps: {
58
+ placeholder: "请输入内容",
59
+ autoSize: {
60
+ minRows: 3
61
+ }
62
+ }
63
+ }
64
+ ];
32
65
  react.useState(
33
66
  Array.from({ length: 1e5 }, (_, key) => ({
34
67
  key,
@@ -37,8 +70,8 @@ const Demo = () => {
37
70
  }))
38
71
  );
39
72
  react.useState(false);
40
- const [file, setFile] = react.useState("");
41
- const [file2, setFile2] = react.useState("");
73
+ react.useState("");
74
+ react.useState("");
42
75
  react.useState([
43
76
  {
44
77
  uid: "-1",
@@ -59,195 +92,21 @@ const Demo = () => {
59
92
  url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
60
93
  }
61
94
  ]);
62
- const handleClick = () => {
63
- main.showWorkFlow({
64
- data: Array(10).fill(0).map((v, index) => ({
65
- id: String(index),
66
- PNName: String(index),
67
- Remark: index,
68
- IsLatest: 2
69
- })),
70
- rowKey: (row) => row.id,
71
- current: "5",
72
- currentIndex: 5,
73
- wrapClassName: "confirmWrapper",
74
- renderContent: selfWorlflowItem
75
- });
76
- };
77
- const selfWorlflowItem = (item, index, currentIndex) => {
78
- let i = 0;
79
- if (index < currentIndex) {
80
- i = 1;
81
- } else if (index === currentIndex) {
82
- i = Number(item.IsLatest) === 2 ? 2 : 3;
95
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: "100vh" }, children: /* @__PURE__ */ jsxRuntime.jsx(
96
+ main.EditTable,
97
+ {
98
+ columns,
99
+ rowKey: "PNOrderNo",
100
+ onChange: (row) => {
101
+ const index = list.findIndex((v) => v.PNOrderNo === row.PNOrderNo);
102
+ const arr = [...list];
103
+ arr[index] = row;
104
+ setList(arr);
105
+ },
106
+ dataSource: list,
107
+ pagination: false
83
108
  }
84
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
85
- /* @__PURE__ */ jsxRuntime.jsx(
86
- "div",
87
- {
88
- style: {
89
- fontSize: "16px",
90
- color: ["#666", "#333", "#FF0000", "#1864ff"][i],
91
- fontWeight: 400,
92
- marginBottom: "8px"
93
- },
94
- children: item.PNName
95
- }
96
- ),
97
- /* @__PURE__ */ jsxRuntime.jsx(
98
- "div",
99
- {
100
- style: {
101
- display: "flex",
102
- alignItems: "center",
103
- gap: "20px",
104
- fontSize: "14px",
105
- color: "#666"
106
- },
107
- children: item.UpdateTime ? /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#333", fontWeight: "bold" }, children: [
108
- "实际完成时间: ",
109
- item.UpdateTime
110
- ] }) : /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
111
- "预计完成时间: ",
112
- item.PlanFinishDate || "暂无"
113
- ] })
114
- }
115
- ),
116
- item.Remark && /* @__PURE__ */ jsxRuntime.jsx(
117
- "div",
118
- {
119
- style: {
120
- marginTop: "10px",
121
- background: "#ffffff",
122
- border: "4px solid #fafafa",
123
- borderRadius: "2px",
124
- fontSize: "14px",
125
- fontWeight: 400,
126
- color: "#666",
127
- padding: "20px",
128
- wordBreak: "break-all"
129
- },
130
- children: item.Remark
131
- }
132
- )
133
- ] });
134
- };
135
- const onChange = async (e) => {
136
- console.log(e);
137
- const file3 = e.target.files[0];
138
- const base64 = await compressionFile.fileToDataURL(file3);
139
- setFile(base64);
140
- const newFile = await compressionFile.compressionFile(file3, "image/jpeg", 0.2);
141
- console.log(newFile);
142
- const base64_2 = await compressionFile.fileToDataURL(newFile);
143
- setFile2(base64_2);
144
- };
145
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { height: "100vh" }, children: [
146
- /* @__PURE__ */ jsxRuntime.jsx(main.BackHeader, { title: "标题111", subTitle: /* @__PURE__ */ jsxRuntime.jsx("span", { children: "副标题" }) }),
147
- /* @__PURE__ */ jsxRuntime.jsx(main.AuthButton, { type: "primary", children: "按钮1" }),
148
- /* @__PURE__ */ jsxRuntime.jsx(CoralButton, { PId: 100, auths: [{ PId: 100 }], children: "123" }),
149
- /* @__PURE__ */ jsxRuntime.jsx(
150
- main.SearchTable,
151
- {
152
- searchProps: {
153
- items: [
154
- {
155
- dataIndex: "name",
156
- valueProps: {
157
- placeholder: "名称"
158
- },
159
- colProps: {
160
- span: 6
161
- }
162
- },
163
- {
164
- valueType: "custom",
165
- valueProps: {
166
- children: /* @__PURE__ */ jsxRuntime.jsxs(antd.Space, { children: [
167
- /* @__PURE__ */ jsxRuntime.jsx(antd.Form.Item, { name: "yzm", noStyle: true, children: /* @__PURE__ */ jsxRuntime.jsx(antd.Input, { placeholder: "请输入验证码" }) }),
168
- /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { children: "发送验证码" })
169
- ] })
170
- },
171
- colProps: {
172
- span: 6
173
- }
174
- },
175
- {
176
- dataIndex: "mm",
177
- valueType: "password",
178
- colProps: {
179
- span: 6
180
- }
181
- },
182
- {
183
- dataIndex: "pic",
184
- valueType: "upload",
185
- valueProps: {
186
- maxCount: 1
187
- },
188
- colProps: {
189
- span: 12
190
- }
191
- },
192
- {
193
- dataIndex: "pic2",
194
- colProps: {
195
- span: 12
196
- }
197
- },
198
- {
199
- dataIndex: "qwe",
200
- valueProps: {
201
- placeholder: "name"
202
- },
203
- colProps: {
204
- span: 12
205
- }
206
- },
207
- {
208
- dataIndex: "btns",
209
- valueType: "btns",
210
- valueProps: [
211
- {
212
- btnType: "submit",
213
- title: "确定",
214
- type: "primary",
215
- onClick: (v) => console.log(v)
216
- }
217
- ]
218
- }
219
- ],
220
- formProps: { wrapperCol: { span: 24 }, form }
221
- },
222
- tableProps: {
223
- minColumnWidth: 100,
224
- columns: [
225
- { dataIndex: "A", title: "A", width: 100 },
226
- { dataIndex: "B", title: "B", width: 200 },
227
- { dataIndex: "C", title: "C", width: 200 },
228
- { dataIndex: "D", title: "D" },
229
- { dataIndex: "E", title: "E", width: 150 },
230
- { dataIndex: "F", title: "F", width: 150 }
231
- ],
232
- pagination: false,
233
- rowKey: "A",
234
- dataSource: Array(3).fill(0).map((v, i) => ({ A: i + 1 }))
235
- }
236
- }
237
- ),
238
- /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { onClick: handleClick, children: "click" }),
239
- /* @__PURE__ */ jsxRuntime.jsx(antd.Input, { type: "file", onChange }),
240
- /* @__PURE__ */ jsxRuntime.jsx(
241
- main.UploadFile,
242
- {
243
- compression: { type: "image/jpeg", quality: 0.2, limit: 300 },
244
- maxSize: 100,
245
- onChange: (info) => console.log(info)
246
- }
247
- ),
248
- /* @__PURE__ */ jsxRuntime.jsx("img", { src: file, style: { width: 400 } }),
249
- /* @__PURE__ */ jsxRuntime.jsx("img", { src: file2, style: { width: 400 } })
250
- ] });
109
+ ) });
251
110
  };
252
111
  ReactDOM.createRoot(document.getElementById("root")).render(
253
112
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.BrowserRouter, { children: /* @__PURE__ */ jsxRuntime.jsx(Demo, {}) })
package/package.json CHANGED
@@ -1,13 +1,12 @@
1
1
  {
2
2
  "name": "szld-libs",
3
3
  "private": false,
4
- "version": "0.2.4",
4
+ "version": "0.2.6",
5
5
  "type": "module",
6
6
  "scripts": {
7
7
  "dev": "vite",
8
8
  "clean": "rimraf lib es dist",
9
- "build": "npm run clean && vite build",
10
- "preview": "vite preview"
9
+ "build": "npm run clean && vite build"
11
10
  },
12
11
  "dependencies": {
13
12
  "ahooks": "^3.7.4",