antd-crud-table 0.4.0 → 0.5.0
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.
- package/README.md +48 -89
- package/dist/CrudTable-DUfRGJW2.js +524 -0
- package/dist/CrudTable-TTRqkEoZ.cjs +1 -0
- package/dist/CrudTable.cjs +1 -1
- package/dist/CrudTable.d.ts +2 -2
- package/dist/CrudTable.js +3 -306
- package/dist/CrudTableLazy.cjs +1 -1
- package/dist/CrudTableLazy.d.ts +1 -1
- package/dist/CrudTableLazy.js +1 -1
- package/dist/exportData.cjs +12 -12
- package/dist/exportData.js +13 -17
- package/dist/fields/registry.d.ts +38 -0
- package/dist/hooks/useCrudTable.d.ts +2 -1
- package/dist/hooks/useCrudTable.test.d.ts +1 -0
- package/dist/hooks/useLocalStorageCrud.d.ts +5 -0
- package/dist/hooks/useLocalStorageCrud.test.d.ts +1 -0
- package/dist/index.cjs +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +6 -0
- package/dist/useCrudTable-CEY_riQg.cjs +1 -0
- package/dist/useCrudTable-DpF-oZHz.js +246 -0
- package/dist/useCrudTable.cjs +1 -1
- package/dist/useCrudTable.js +2 -235
- package/dist/useLocalStorageCrud.cjs +1 -1
- package/dist/useLocalStorageCrud.js +29 -176
- package/dist/utils/exportData.d.ts +5 -1
- package/dist/utils/exportData.test.d.ts +1 -0
- package/dist/utils/query.d.ts +13 -0
- package/dist/utils/query.test.d.ts +1 -0
- package/package.json +26 -11
package/dist/CrudTable.js
CHANGED
|
@@ -1,306 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
import { Button as o, DatePicker as s, Dropdown as c, Form as l, Input as u, InputNumber as d, Modal as f, Select as p, Switch as m, Tag as h, message as g } from "antd";
|
|
5
|
-
import { useEffect as _, useState as v } from "react";
|
|
6
|
-
import { format as y, formatISO as b, parseISO as x } from "date-fns";
|
|
7
|
-
import S from "dayjs";
|
|
8
|
-
import { jsx as C, jsxs as w } from "react/jsx-runtime";
|
|
9
|
-
//#region lib/CrudTable.tsx
|
|
10
|
-
var T = (T) => {
|
|
11
|
-
let { columns: E, rowKey: D, title: O, defaultPageSize: k = 10, hookConfig: A, enableBulkOperations: j = !1, customActions: M } = T, N = e(D, {
|
|
12
|
-
defaultPageSize: k,
|
|
13
|
-
...A
|
|
14
|
-
}), [P, F] = v(!1), [I, L] = v(null), [R, z] = v([]), [B] = l.useForm();
|
|
15
|
-
_(() => {
|
|
16
|
-
N.refresh();
|
|
17
|
-
}, []);
|
|
18
|
-
let V = E.map((e) => {
|
|
19
|
-
let t = {
|
|
20
|
-
...e,
|
|
21
|
-
dataIndex: e.dataIndex,
|
|
22
|
-
title: e.title,
|
|
23
|
-
search: e.searchable !== !1
|
|
24
|
-
};
|
|
25
|
-
switch (e.fieldType) {
|
|
26
|
-
case "date": return {
|
|
27
|
-
...t,
|
|
28
|
-
valueType: "dateTime",
|
|
29
|
-
render: (t, n) => {
|
|
30
|
-
let r = n[e.dataIndex];
|
|
31
|
-
if (!r) return "-";
|
|
32
|
-
try {
|
|
33
|
-
return /* @__PURE__ */ C("span", { children: y(x(r), "yyyy-MM-dd HH:mm") });
|
|
34
|
-
} catch {
|
|
35
|
-
return /* @__PURE__ */ C("span", { children: r });
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
};
|
|
39
|
-
case "enum": return {
|
|
40
|
-
...t,
|
|
41
|
-
valueType: "select",
|
|
42
|
-
valueEnum: e.enumOptions,
|
|
43
|
-
render: (t, n) => {
|
|
44
|
-
let r = n[e.dataIndex], i = e.enumOptions?.[r];
|
|
45
|
-
return i ? /* @__PURE__ */ C(h, {
|
|
46
|
-
color: i.color,
|
|
47
|
-
children: i.text
|
|
48
|
-
}) : r;
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
case "number": return {
|
|
52
|
-
...t,
|
|
53
|
-
valueType: "digit",
|
|
54
|
-
render: (t, n) => {
|
|
55
|
-
let r = n[e.dataIndex];
|
|
56
|
-
return typeof r == "number" ? r.toLocaleString() : r;
|
|
57
|
-
}
|
|
58
|
-
};
|
|
59
|
-
case "boolean": return {
|
|
60
|
-
...t,
|
|
61
|
-
valueType: "switch",
|
|
62
|
-
render: (t, n) => /* @__PURE__ */ C(h, {
|
|
63
|
-
color: n[e.dataIndex] ? "green" : "red",
|
|
64
|
-
children: n[e.dataIndex] ? "Yes" : "No"
|
|
65
|
-
})
|
|
66
|
-
};
|
|
67
|
-
case "custom": return {
|
|
68
|
-
...t,
|
|
69
|
-
render: (t, n) => e.customRender?.(n[e.dataIndex], n)
|
|
70
|
-
};
|
|
71
|
-
default: return t;
|
|
72
|
-
}
|
|
73
|
-
});
|
|
74
|
-
V.push({
|
|
75
|
-
title: "Actions",
|
|
76
|
-
valueType: "option",
|
|
77
|
-
width: 200,
|
|
78
|
-
render: (e, t) => {
|
|
79
|
-
let n = [/* @__PURE__ */ C(o, {
|
|
80
|
-
type: "link",
|
|
81
|
-
size: "small",
|
|
82
|
-
onClick: () => U(t),
|
|
83
|
-
children: "Edit"
|
|
84
|
-
}, "edit"), /* @__PURE__ */ C(o, {
|
|
85
|
-
type: "link",
|
|
86
|
-
size: "small",
|
|
87
|
-
danger: !0,
|
|
88
|
-
onClick: () => G(t[D]),
|
|
89
|
-
children: "Delete"
|
|
90
|
-
}, "delete")], r = M?.(t, N) || [];
|
|
91
|
-
return [...n, ...r];
|
|
92
|
-
}
|
|
93
|
-
});
|
|
94
|
-
let H = async (e, t, n) => {
|
|
95
|
-
try {
|
|
96
|
-
let r = {
|
|
97
|
-
current: e.current,
|
|
98
|
-
pageSize: e.pageSize,
|
|
99
|
-
sortBy: Object.keys(t)[0],
|
|
100
|
-
sortOrder: Object.values(t)[0],
|
|
101
|
-
...n,
|
|
102
|
-
...e
|
|
103
|
-
}, i = N.operations;
|
|
104
|
-
if (i?.getList) {
|
|
105
|
-
let e = await i.getList(r);
|
|
106
|
-
return {
|
|
107
|
-
data: e.data,
|
|
108
|
-
success: !0,
|
|
109
|
-
total: e.total
|
|
110
|
-
};
|
|
111
|
-
}
|
|
112
|
-
return {
|
|
113
|
-
data: N.state.data,
|
|
114
|
-
success: !0,
|
|
115
|
-
total: N.state.total
|
|
116
|
-
};
|
|
117
|
-
} catch {
|
|
118
|
-
return g.error("Failed to fetch data"), {
|
|
119
|
-
data: [],
|
|
120
|
-
success: !1,
|
|
121
|
-
total: 0
|
|
122
|
-
};
|
|
123
|
-
}
|
|
124
|
-
}, U = (e) => {
|
|
125
|
-
if (L(e || null), e) {
|
|
126
|
-
let t = { ...e };
|
|
127
|
-
E.forEach((e) => {
|
|
128
|
-
let n = e.dataIndex;
|
|
129
|
-
if (e.fieldType === "date" && t[n]) try {
|
|
130
|
-
t[n] = S(t[n]);
|
|
131
|
-
} catch {}
|
|
132
|
-
}), B.setFieldsValue(t);
|
|
133
|
-
} else B.resetFields();
|
|
134
|
-
F(!0);
|
|
135
|
-
}, W = async () => {
|
|
136
|
-
try {
|
|
137
|
-
let e = await B.validateFields(), t = { ...e };
|
|
138
|
-
E.forEach((n) => {
|
|
139
|
-
let r = n.dataIndex;
|
|
140
|
-
if (n.fieldType === "date" && e[r]) try {
|
|
141
|
-
t[r] = b(e[r]);
|
|
142
|
-
} catch {}
|
|
143
|
-
n.formConfig?.transform && (t[r] = n.formConfig.transform(e[r]));
|
|
144
|
-
}), I && I[D] ? await N.update(I[D], t) : await N.create(t), F(!1), N.actionRef.current?.reload();
|
|
145
|
-
} catch (e) {
|
|
146
|
-
console.error("Form validation failed:", e);
|
|
147
|
-
}
|
|
148
|
-
}, G = async (e) => {
|
|
149
|
-
f.confirm({
|
|
150
|
-
title: "Are you sure?",
|
|
151
|
-
content: "This action cannot be undone.",
|
|
152
|
-
okText: "Yes, Delete",
|
|
153
|
-
okType: "danger",
|
|
154
|
-
cancelText: "Cancel",
|
|
155
|
-
onOk: async () => {
|
|
156
|
-
await N.delete(e) && N.actionRef.current?.reload();
|
|
157
|
-
}
|
|
158
|
-
});
|
|
159
|
-
}, K = async () => {
|
|
160
|
-
if (R.length === 0) {
|
|
161
|
-
g.warning("Please select items to delete");
|
|
162
|
-
return;
|
|
163
|
-
}
|
|
164
|
-
f.confirm({
|
|
165
|
-
title: `Delete ${R.length} items?`,
|
|
166
|
-
content: "This action cannot be undone.",
|
|
167
|
-
okText: "Yes, Delete All",
|
|
168
|
-
okType: "danger",
|
|
169
|
-
cancelText: "Cancel",
|
|
170
|
-
onOk: async () => {
|
|
171
|
-
let e = R.map((e) => N.delete(e));
|
|
172
|
-
await Promise.allSettled(e), z([]), N.actionRef.current?.reload();
|
|
173
|
-
}
|
|
174
|
-
});
|
|
175
|
-
}, q = j ? {
|
|
176
|
-
selectedRowKeys: R,
|
|
177
|
-
onChange: z
|
|
178
|
-
} : void 0;
|
|
179
|
-
return /* @__PURE__ */ w(r, {
|
|
180
|
-
needDeps: !0,
|
|
181
|
-
intl: a,
|
|
182
|
-
children: [/* @__PURE__ */ C(i, {
|
|
183
|
-
headerTitle: O,
|
|
184
|
-
rowKey: D,
|
|
185
|
-
rowClassName: (e, t) => t % 2 == 0 ? "row-differentiator" : "",
|
|
186
|
-
actionRef: N.actionRef,
|
|
187
|
-
columns: V,
|
|
188
|
-
request: H,
|
|
189
|
-
search: { labelWidth: "auto" },
|
|
190
|
-
pagination: {
|
|
191
|
-
pageSize: k,
|
|
192
|
-
showSizeChanger: !0,
|
|
193
|
-
showQuickJumper: !0
|
|
194
|
-
},
|
|
195
|
-
loading: N.state.loading,
|
|
196
|
-
rowSelection: q,
|
|
197
|
-
toolBarRender: () => [
|
|
198
|
-
/* @__PURE__ */ C(o, {
|
|
199
|
-
type: "primary",
|
|
200
|
-
icon: /* @__PURE__ */ C(n, {}),
|
|
201
|
-
onClick: () => U(),
|
|
202
|
-
children: "New"
|
|
203
|
-
}, "add"),
|
|
204
|
-
...j && R.length > 0 ? [/* @__PURE__ */ w(o, {
|
|
205
|
-
danger: !0,
|
|
206
|
-
onClick: K,
|
|
207
|
-
children: [
|
|
208
|
-
"Delete Selected (",
|
|
209
|
-
R.length,
|
|
210
|
-
")"
|
|
211
|
-
]
|
|
212
|
-
}, "bulk-delete")] : [],
|
|
213
|
-
/* @__PURE__ */ C(c, {
|
|
214
|
-
menu: { items: [{
|
|
215
|
-
key: "export",
|
|
216
|
-
label: "Export",
|
|
217
|
-
disabled: !0
|
|
218
|
-
}, {
|
|
219
|
-
key: "refresh",
|
|
220
|
-
label: "Refresh",
|
|
221
|
-
onClick: () => N.refresh()
|
|
222
|
-
}] },
|
|
223
|
-
children: /* @__PURE__ */ C(o, { children: /* @__PURE__ */ C(t, {}) })
|
|
224
|
-
}, "menu")
|
|
225
|
-
],
|
|
226
|
-
options: {
|
|
227
|
-
setting: { listsHeight: 400 },
|
|
228
|
-
reload: () => N.refresh()
|
|
229
|
-
},
|
|
230
|
-
dateFormatter: "string"
|
|
231
|
-
}), /* @__PURE__ */ C(f, {
|
|
232
|
-
title: I ? "Edit Item" : "Create Item",
|
|
233
|
-
open: P,
|
|
234
|
-
onOk: W,
|
|
235
|
-
onCancel: () => F(!1),
|
|
236
|
-
destroyOnClose: !0,
|
|
237
|
-
width: 600,
|
|
238
|
-
children: /* @__PURE__ */ C(l, {
|
|
239
|
-
form: B,
|
|
240
|
-
layout: "vertical",
|
|
241
|
-
children: E.map((e) => {
|
|
242
|
-
if (!e.dataIndex) return null;
|
|
243
|
-
let t = e.dataIndex, n = e.title, r = !(e.fieldEditable ?? !0), i = e.formConfig?.rules || (e.formConfig?.required ? [{
|
|
244
|
-
required: !0,
|
|
245
|
-
message: `${n} is required`
|
|
246
|
-
}] : []);
|
|
247
|
-
if (e.formConfig?.component) return /* @__PURE__ */ C(l.Item, {
|
|
248
|
-
name: t,
|
|
249
|
-
label: n,
|
|
250
|
-
rules: i,
|
|
251
|
-
children: e.formConfig.component
|
|
252
|
-
}, t);
|
|
253
|
-
switch (e.fieldType) {
|
|
254
|
-
case "string": return /* @__PURE__ */ C(l.Item, {
|
|
255
|
-
name: t,
|
|
256
|
-
label: n,
|
|
257
|
-
rules: i,
|
|
258
|
-
children: /* @__PURE__ */ C(u, { disabled: r })
|
|
259
|
-
}, t);
|
|
260
|
-
case "number": return /* @__PURE__ */ C(l.Item, {
|
|
261
|
-
name: t,
|
|
262
|
-
label: n,
|
|
263
|
-
rules: i,
|
|
264
|
-
children: /* @__PURE__ */ C(d, {
|
|
265
|
-
style: { width: "100%" },
|
|
266
|
-
disabled: r
|
|
267
|
-
})
|
|
268
|
-
}, t);
|
|
269
|
-
case "date": return /* @__PURE__ */ C(l.Item, {
|
|
270
|
-
name: t,
|
|
271
|
-
label: n,
|
|
272
|
-
rules: i,
|
|
273
|
-
children: /* @__PURE__ */ C(s, {
|
|
274
|
-
style: { width: "100%" },
|
|
275
|
-
showTime: !0,
|
|
276
|
-
disabled: r
|
|
277
|
-
})
|
|
278
|
-
}, t);
|
|
279
|
-
case "boolean": return /* @__PURE__ */ C(l.Item, {
|
|
280
|
-
name: t,
|
|
281
|
-
label: n,
|
|
282
|
-
valuePropName: "checked",
|
|
283
|
-
children: /* @__PURE__ */ C(m, { disabled: r })
|
|
284
|
-
}, t);
|
|
285
|
-
case "enum": return /* @__PURE__ */ C(l.Item, {
|
|
286
|
-
name: t,
|
|
287
|
-
label: n,
|
|
288
|
-
rules: i,
|
|
289
|
-
children: /* @__PURE__ */ C(p, {
|
|
290
|
-
disabled: r,
|
|
291
|
-
placeholder: `Select ${n.toLowerCase()}`,
|
|
292
|
-
options: Object.entries(e.enumOptions || {}).map(([e, t]) => ({
|
|
293
|
-
label: t.text,
|
|
294
|
-
value: e
|
|
295
|
-
}))
|
|
296
|
-
})
|
|
297
|
-
}, t);
|
|
298
|
-
default: return null;
|
|
299
|
-
}
|
|
300
|
-
})
|
|
301
|
-
})
|
|
302
|
-
})]
|
|
303
|
-
});
|
|
304
|
-
};
|
|
305
|
-
//#endregion
|
|
306
|
-
export { T as default };
|
|
1
|
+
import { t as e } from "./CrudTable-DUfRGJW2.js";
|
|
2
|
+
import "./exportData.js";
|
|
3
|
+
export { e as default };
|
package/dist/CrudTableLazy.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
require(`./CrudTable.cjs`);let e=require(`react`),t=require(`react/jsx-runtime`);var n=(0,e.lazy)(()=>Promise.resolve().then(()=>require(`./CrudTable.cjs`))),r=r=>(0,t.jsx)(e.Suspense,{fallback:(0,t.jsx)(`div`,{style:{textAlign:`center`,padding:`2rem`},children:`Loading
|
|
1
|
+
require(`./CrudTable-TTRqkEoZ.cjs`);let e=require(`react`),t=require(`react/jsx-runtime`);var n=(0,e.lazy)(()=>Promise.resolve().then(()=>require(`./CrudTable.cjs`))),r=r=>(0,t.jsx)(e.Suspense,{fallback:(0,t.jsx)(`div`,{style:{textAlign:`center`,padding:`2rem`},children:`Loading CRUD table…`}),children:(0,t.jsx)(n,{...r})});module.exports=r;
|
package/dist/CrudTableLazy.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { CrudTableConfig, DataType } from './CrudTable';
|
|
2
|
-
declare const CrudTableLazy: <T extends DataType>(props: CrudTableConfig<T>) => import("react
|
|
2
|
+
declare const CrudTableLazy: <T extends DataType>(props: CrudTableConfig<T>) => import("react").JSX.Element;
|
|
3
3
|
export default CrudTableLazy;
|
|
4
4
|
export type { CrudTableConfig, DataType };
|
package/dist/CrudTableLazy.js
CHANGED
package/dist/exportData.cjs
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e=(e,t)=>{let n=t.filter(e=>e.fieldType!==`option`&&e.dataIndex),r=n.map(e=>String(e.title||e.dataIndex)),i=e.map(e=>n.map(t=>{let n=e[t.dataIndex];return n==null?``:t.fieldType===`boolean`?n?`Yes`:`No`:t.fieldType===`date`?String(n):t.fieldType===`enum`&&t.enumOptions&&t.enumOptions[n]?.text||String(n)}));return[r.map(e=>`"${e}"`).join(`,`),...i.map(e=>e.map(e=>`"${String(e).replace(/"/g,`""`)}"`).join(`,`))].join(`
|
|
2
|
-
`)},t=(e,t,n)=>{let r=new Blob([e],{type:n}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=t,document.body.appendChild(a),a.click(),document.body.removeChild(a),URL.revokeObjectURL(i)},n=n=>{let{data:r,columns:i,filename:a=`export`}=n;t(e(r,i),`${a}.csv`,`text/csv;charset=utf-8;`)},r=e=>{let{data:n,filename:r=`export`}=e;t(JSON.stringify(n,null,2),`${r}.json`,`application/json`)},i=e=>{let{data:n,columns:r,filename:i=`export`}=e,a=r.filter(e=>e.fieldType!==`option`&&e.dataIndex),o=a.map(e=>String(e.title||e.dataIndex)),s=n.map(e=>a.map(t=>{let n=e[t.dataIndex];return n==null?``:t.fieldType===`boolean`?n?`Yes`:`No`:t.fieldType===`enum`&&t.enumOptions
|
|
3
|
-
<?
|
|
4
|
-
<
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
</
|
|
2
|
+
`)},t=(e,t,n)=>{let r=new Blob([e],{type:n}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=t,document.body.appendChild(a),a.click(),document.body.removeChild(a),URL.revokeObjectURL(i)},n=n=>{let{data:r,columns:i,filename:a=`export`}=n;t(e(r,i),`${a}.csv`,`text/csv;charset=utf-8;`)},r=e=>{let{data:n,filename:r=`export`}=e;t(JSON.stringify(n,null,2),`${r}.json`,`application/json`)},i=e=>{let{data:n,columns:r,filename:i=`export`}=e,a=r.filter(e=>e.fieldType!==`option`&&e.dataIndex),o=a.map(e=>String(e.title||e.dataIndex)),s=n.map(e=>a.map(t=>{let n=e[t.dataIndex];return n==null?``:t.fieldType===`boolean`?n?`Yes`:`No`:t.fieldType===`enum`&&t.enumOptions?t.enumOptions[n]?.text||String(n):typeof n==`number`?n:String(n)})),c=e=>e.replace(/&/g,`&`).replace(/</g,`<`).replace(/>/g,`>`).replace(/"/g,`"`).replace(/'/g,`'`),l=e=>`<Cell><Data ss:Type="${typeof e==`number`?`Number`:`String`}">${typeof e==`number`?String(e):c(e)}</Data></Cell>`;t(`<?xml version="1.0"?>
|
|
3
|
+
<?mso-application progid="Excel.Sheet"?>
|
|
4
|
+
<Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet"
|
|
5
|
+
xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet">
|
|
6
|
+
<Worksheet ss:Name="Export">
|
|
7
|
+
<Table>
|
|
8
|
+
${`<Row>${o.map(e=>l(e)).join(``)}</Row>`}
|
|
9
|
+
${s.map(e=>`<Row>${e.map(e=>l(e)).join(``)}</Row>`).join(`
|
|
10
|
+
`)}
|
|
11
|
+
</Table>
|
|
12
|
+
</Worksheet>
|
|
13
|
+
</Workbook>`,`${i}.xls`,`application/vnd.ms-excel`)},a=e=>{let{format:t=`csv`}=e;switch(t){case`csv`:n(e);break;case`json`:r(e);break;case`xlsx`:i(e);break;default:n(e)}},o=async(e,t,n=`export`,r=`csv`)=>{try{a({data:await e(),columns:t,filename:n,format:r})}catch(e){throw console.error(`Export failed:`,e),e}};exports.default=a,exports.exportData=a,exports.exportAllData=o,exports.exportToCSV=n,exports.exportToJSON=r,exports.exportToXLSX=i;
|
package/dist/exportData.js
CHANGED
|
@@ -17,23 +17,19 @@ var e = (e, t) => {
|
|
|
17
17
|
}, i = (e) => {
|
|
18
18
|
let { data: n, columns: r, filename: i = "export" } = e, a = r.filter((e) => e.fieldType !== "option" && e.dataIndex), o = a.map((e) => String(e.title || e.dataIndex)), s = n.map((e) => a.map((t) => {
|
|
19
19
|
let n = e[t.dataIndex];
|
|
20
|
-
return n == null ? "" : t.fieldType === "boolean" ? n ? "Yes" : "No" : t.fieldType === "enum" && t.enumOptions
|
|
21
|
-
}));
|
|
22
|
-
t(
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
<
|
|
27
|
-
<
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
</sheet>
|
|
34
|
-
</sheets>
|
|
35
|
-
</workbook>`;
|
|
36
|
-
})(), `${i}.xls`, "application/vnd.ms-excel");
|
|
20
|
+
return n == null ? "" : t.fieldType === "boolean" ? n ? "Yes" : "No" : t.fieldType === "enum" && t.enumOptions ? t.enumOptions[n]?.text || String(n) : typeof n == "number" ? n : String(n);
|
|
21
|
+
})), c = (e) => e.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'"), l = (e) => `<Cell><Data ss:Type="${typeof e == "number" ? "Number" : "String"}">${typeof e == "number" ? String(e) : c(e)}</Data></Cell>`;
|
|
22
|
+
t(`<?xml version="1.0"?>
|
|
23
|
+
<?mso-application progid="Excel.Sheet"?>
|
|
24
|
+
<Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet"
|
|
25
|
+
xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet">
|
|
26
|
+
<Worksheet ss:Name="Export">
|
|
27
|
+
<Table>
|
|
28
|
+
${`<Row>${o.map((e) => l(e)).join("")}</Row>`}
|
|
29
|
+
${s.map((e) => `<Row>${e.map((e) => l(e)).join("")}</Row>`).join("\n")}
|
|
30
|
+
</Table>
|
|
31
|
+
</Worksheet>
|
|
32
|
+
</Workbook>`, `${i}.xls`, "application/vnd.ms-excel");
|
|
37
33
|
}, a = (e) => {
|
|
38
34
|
let { format: t = "csv" } = e;
|
|
39
35
|
switch (t) {
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { ProColumns } from '@ant-design/pro-components';
|
|
2
|
+
/** Every column type CrudTable understands. */
|
|
3
|
+
export type FieldType = 'string' | 'number' | 'date' | 'boolean' | 'enum' | 'custom' | 'textarea' | 'email' | 'url' | 'password' | 'money' | 'percent' | 'rating' | 'progress' | 'time' | 'dateRange' | 'tags' | 'image' | 'color' | 'json';
|
|
4
|
+
/** The slice of a CrudColumn a field-type definition may look at. */
|
|
5
|
+
export interface FieldColumn {
|
|
6
|
+
dataIndex?: unknown;
|
|
7
|
+
/** ProColumns allows ReactNode or a render function here, so stay loose. */
|
|
8
|
+
title?: unknown;
|
|
9
|
+
fieldType?: FieldType;
|
|
10
|
+
enumOptions?: Record<string, {
|
|
11
|
+
text: string;
|
|
12
|
+
[key: string]: any;
|
|
13
|
+
}>;
|
|
14
|
+
customRender?: (value: any, record: any) => React.ReactNode;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* A self-contained description of one field type: how it renders in the
|
|
18
|
+
* table, which control edits it in the modal form, and how values are
|
|
19
|
+
* converted between record shape and form shape. Adding a new column
|
|
20
|
+
* type to CrudTable means adding exactly one entry here.
|
|
21
|
+
*/
|
|
22
|
+
export interface FieldTypeDefinition {
|
|
23
|
+
/** Extra ProColumns props merged over the base column (valueType, render, ...). */
|
|
24
|
+
column?: (col: FieldColumn) => Partial<ProColumns<any>>;
|
|
25
|
+
/** The antd control used in the create/edit modal. Return null for "no form field". */
|
|
26
|
+
formControl: (col: FieldColumn, disabled: boolean) => React.ReactNode | null;
|
|
27
|
+
/** Convert a record value into what the form control expects. */
|
|
28
|
+
toFormValue?: (value: any) => any;
|
|
29
|
+
/** Convert the submitted form value back into the record shape. */
|
|
30
|
+
fromFormValue?: (value: any) => any;
|
|
31
|
+
/** Validation rules implied by the type itself (merged before user rules). */
|
|
32
|
+
rules?: (col: FieldColumn) => any[];
|
|
33
|
+
/** Form.Item valuePropName override (e.g. 'checked' for Switch). */
|
|
34
|
+
valuePropName?: string;
|
|
35
|
+
}
|
|
36
|
+
export declare const fieldRegistry: Record<FieldType, FieldTypeDefinition>;
|
|
37
|
+
/** Look up a field type, falling back to `string` so every column gets a form control. */
|
|
38
|
+
export declare const getFieldDefinition: (fieldType?: FieldType) => FieldTypeDefinition;
|
|
@@ -60,10 +60,11 @@ export type CrudTableActions<T> = {
|
|
|
60
60
|
create: (data: Partial<T>) => Promise<T | null>;
|
|
61
61
|
update: (id: any, data: Partial<T>) => Promise<T | null>;
|
|
62
62
|
delete: (id: any) => Promise<boolean>;
|
|
63
|
+
operations: Partial<CrudOperation<T>>;
|
|
63
64
|
setPageSize: (size: number) => void;
|
|
64
65
|
setCurrentPage: (page: number) => void;
|
|
65
66
|
state: CrudState<T>;
|
|
66
|
-
actionRef: React.
|
|
67
|
+
actionRef: React.MutableRefObject<ActionType | undefined>;
|
|
67
68
|
};
|
|
68
69
|
export declare const useCrudTable: <T extends Record<string, any>>(rowKey: keyof T, config: UseCrudTableConfig<T>) => CrudTableActions<T>;
|
|
69
70
|
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -5,5 +5,10 @@ export type UseLocalStorageCrudConfig = {
|
|
|
5
5
|
onSuccess?: (operation: 'create' | 'update' | 'delete' | 'fetch', data: any) => void;
|
|
6
6
|
onError?: (operation: 'create' | 'update' | 'delete' | 'fetch', error: any) => void;
|
|
7
7
|
};
|
|
8
|
+
/**
|
|
9
|
+
* localStorage-backed CRUD hook. A thin wrapper that builds
|
|
10
|
+
* localStorage operations and delegates all state management to the
|
|
11
|
+
* shared useCrudTable engine.
|
|
12
|
+
*/
|
|
8
13
|
export declare const useLocalStorageCrud: <T extends Record<string, any>>(rowKey: keyof T, storageKey: string, initialData?: T[], config?: UseLocalStorageCrudConfig) => CrudTableActions<T>;
|
|
9
14
|
export default useLocalStorageCrud;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`./CrudTable-TTRqkEoZ.cjs`),t=require(`./useCrudTable-CEY_riQg.cjs`),n=require(`./exportData.cjs`),r=require(`./CrudTableLazy.cjs`),i=require(`./useLocalStorageCrud.cjs`);exports.CrudTable=e.t,exports.default=e.t,exports.CrudTableLazy=r,exports.exportAllData=n.exportAllData,exports.exportData=n,exports.exportToCSV=n.exportToCSV,exports.exportToJSON=n.exportToJSON,exports.exportToXLSX=n.exportToXLSX,exports.fieldRegistry=e.n,exports.getFieldDefinition=e.r,exports.useCrudTable=t.t,exports.useLocalStorageCrud=i;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
export { default as CrudTable } from './CrudTable';
|
|
2
2
|
export { default as CrudTableLazy } from './CrudTableLazy';
|
|
3
|
+
export { default } from './CrudTable';
|
|
3
4
|
export { useCrudTable } from './hooks/useCrudTable';
|
|
4
5
|
export { useLocalStorageCrud } from './hooks/useLocalStorageCrud';
|
|
5
6
|
export { exportData, exportToCSV, exportToJSON, exportToXLSX, exportAllData } from './utils/exportData';
|
|
7
|
+
export { fieldRegistry, getFieldDefinition } from './fields/registry';
|
|
8
|
+
export type { FieldType, FieldTypeDefinition, FieldColumn } from './fields/registry';
|
|
6
9
|
export type { CrudTableConfig, CrudColumn, DataType } from './CrudTable';
|
|
7
10
|
export type { UseCrudTableConfig, CrudTableActions, CrudOperation, CrudParams, CrudResponse, CrudState } from './hooks/useCrudTable';
|
|
8
11
|
export type { UseLocalStorageCrudConfig } from './hooks/useLocalStorageCrud';
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { n as e, r as t, t as n } from "./CrudTable-DUfRGJW2.js";
|
|
2
|
+
import { t as r } from "./useCrudTable-DpF-oZHz.js";
|
|
3
|
+
import i, { exportAllData as a, exportToCSV as o, exportToJSON as s, exportToXLSX as c } from "./exportData.js";
|
|
4
|
+
import l from "./CrudTableLazy.js";
|
|
5
|
+
import u from "./useLocalStorageCrud.js";
|
|
6
|
+
export { n as CrudTable, n as default, l as CrudTableLazy, a as exportAllData, i as exportData, o as exportToCSV, s as exportToJSON, c as exportToXLSX, e as fieldRegistry, t as getFieldDefinition, r as useCrudTable, u as useLocalStorageCrud };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
require(`./CrudTable-TTRqkEoZ.cjs`);let e=require(`antd`),t=require(`react`);var n=(e,t)=>{let{current:n=1,pageSize:r=10,sortBy:i,sortOrder:a,...o}=t,s=e.filter(e=>Object.entries(o).every(([t,n])=>{if(n==null||n===``)return!0;let r=e[t];return r==null?!1:String(r).toLowerCase().includes(String(n).toLowerCase())}));i&&a&&(s=[...s].sort((e,t)=>{let n=e[i],r=t[i];if(n==null)return 1;if(r==null)return-1;let o=n>r?1:n<r?-1:0;return a===`ascend`?o:-o}));let c=(n-1)*r;return{data:s.slice(c,c+r),total:s.length,success:!0}},r=e=>{let{baseUrl:t=``,endpoints:n={},headers:r={},transform:i}=e,a={list:`/list`,create:`/create`,update:`/update`,delete:`/delete`,...n},o=async(e,n={})=>{let i=await fetch(`${t}${e}`,{headers:{"Content-Type":`application/json`,...r},...n});if(!i.ok)throw Error(`HTTP error! status: ${i.status}`);return i.json()};return{getList:async e=>{let t=new URLSearchParams;Object.entries(e).forEach(([e,n])=>{n!=null&&t.append(e,String(n))});let n=t.toString(),r=await o(n?`${a.list}?${n}`:a.list);return i?.response?i.response(r):r},create:async e=>{let t=i?.request?i.request(e):e;return o(a.create,{method:`POST`,body:JSON.stringify(t)})},update:async(e,t)=>{let n=i?.request?i.request(t):t;return o(`${a.update}/${e}`,{method:`PUT`,body:JSON.stringify(n)})},delete:async e=>{await o(`${a.delete}/${e}`,{method:`DELETE`})}}},i=(e,t)=>{let r=[...e],i=r.length>0?Math.max(...r.map(e=>Number(e[t])||0))+1:1;return{getList:async e=>n(r,e),create:async e=>{let n={[t]:i++,...e};return r.push(n),n},update:async(e,n)=>{let i=r.findIndex(n=>n[t]===e);if(i===-1)throw Error(`Item not found`);return r[i]={...r[i],...n},r[i]},delete:async e=>{let n=r.findIndex(n=>n[t]===e);if(n===-1)throw Error(`Item not found`);r.splice(n,1)}}},a=(n,a)=>{let o=(0,t.useRef)(void 0),[s,c]=(0,t.useState)({loading:!1,error:null,data:[],total:0,current:1,pageSize:a.defaultPageSize||10}),l=`operations`in a?a.operations:void 0,u=`staticData`in a?a.staticData:void 0,d=`api`in a?a.api:void 0,f=(0,t.useMemo)(()=>{if(l)return l;if(u)return i(u,n);if(d)return r(d);throw Error(`useCrudTable: Must provide either staticData, api config, or custom operations`)},[l,u,d,n]),{current:p,pageSize:m}=s,h=(0,t.useCallback)(async()=>{c(e=>({...e,loading:!0,error:null}));try{let e={current:p,pageSize:m},t=await f.getList(e);c(e=>({...e,data:t.data,total:t.total,loading:!1}))}catch(t){let n=t instanceof Error?t.message:`Failed to fetch data`;c(e=>({...e,loading:!1,error:n})),a.onError?.(`fetch`,t),e.message.error(n)}},[p,m,f,a]);return{refresh:h,create:(0,t.useCallback)(async t=>{if(!f.create)return e.message.error(`Create operation not supported`),null;try{c(e=>({...e,loading:!0}));let n=await f.create(t);return a.optimisticUpdates?c(e=>({...e,data:[...e.data,n],total:e.total+1,loading:!1})):await h(),a.onSuccess?.(`create`,n),e.message.success(`Created successfully`),n}catch(t){c(e=>({...e,loading:!1}));let n=t instanceof Error?t.message:`Create failed`;return a.onError?.(`create`,t),e.message.error(n),null}},[f,a,h]),update:(0,t.useCallback)(async(t,r)=>{if(!f.update)return e.message.error(`Update operation not supported`),null;try{c(e=>({...e,loading:!0}));let i=await f.update(t,r);return a.optimisticUpdates?c(e=>({...e,data:e.data.map(e=>e[n]===t?{...e,...i}:e),loading:!1})):await h(),a.onSuccess?.(`update`,i),e.message.success(`Updated successfully`),i}catch(t){c(e=>({...e,loading:!1}));let n=t instanceof Error?t.message:`Update failed`;return a.onError?.(`update`,t),e.message.error(n),null}},[f,a,n,h]),delete:(0,t.useCallback)(async t=>{if(!f.delete)return e.message.error(`Delete operation not supported`),!1;try{return c(e=>({...e,loading:!0})),await f.delete(t),a.optimisticUpdates?c(e=>({...e,data:e.data.filter(e=>e[n]!==t),total:e.total-1,loading:!1})):await h(),a.onSuccess?.(`delete`,t),e.message.success(`Deleted successfully`),!0}catch(t){c(e=>({...e,loading:!1}));let n=t instanceof Error?t.message:`Delete failed`;return a.onError?.(`delete`,t),e.message.error(n),!1}},[f,a,n,h]),operations:f,setPageSize:(0,t.useCallback)(e=>{c(t=>({...t,pageSize:e,current:1}))},[]),setCurrentPage:(0,t.useCallback)(e=>{c(t=>({...t,current:e}))},[]),state:s,actionRef:o}};Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
|