tntd 2.7.19 → 2.7.20
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/es/ellipsis/index.js +8 -3
- package/es/ellipsis/index.js.map +1 -1
- package/es/tntd-cascader/AntdCascader/index.less +1 -1
- package/lib/ellipsis/index.d.ts.map +1 -1
- package/lib/ellipsis/index.js +7 -2
- package/lib/ellipsis/index.js.map +1 -1
- package/lib/mention/index.d.ts +5 -0
- package/lib/mention/index.d.ts.map +1 -0
- package/lib/mention/index.js.map +1 -0
- package/lib/query-form/Field/AloneSearch.d.ts +2 -0
- package/lib/query-form/Field/AloneSearch.d.ts.map +1 -0
- package/lib/query-form/Field/AloneSearch.js +22 -0
- package/lib/query-form/Field/AloneSearch.js.map +1 -0
- package/lib/tag/tag.less +61 -0
- package/lib/tnt-second-page/index.d.ts +17 -0
- package/lib/tnt-second-page/index.d.ts.map +1 -0
- package/lib/tnt-second-page/index.js +59 -0
- package/lib/tnt-second-page/index.js.map +1 -0
- package/lib/tntd-cascader/AntdCascader/index.less +1 -1
- package/lib/tntd-form/TntdForm/components/Item.d.ts +5 -0
- package/lib/tntd-form/TntdForm/components/Item.d.ts.map +1 -0
- package/lib/tntd-form/TntdForm/components/Item.js.map +1 -0
- package/lib/tntd-form/TntdForm/components/ItemComp.d.ts +5 -0
- package/lib/tntd-form/TntdForm/components/ItemComp.d.ts.map +1 -0
- package/lib/tntd-form/TntdForm/components/ItemComp.js.map +1 -0
- package/lib/tntd-form/TntdForm/components/List.d.ts +5 -0
- package/lib/tntd-form/TntdForm/components/List.d.ts.map +1 -0
- package/lib/tntd-form/TntdForm/components/List.js.map +1 -0
- package/lib/tntd-form/TntdForm/index.d.ts +10 -0
- package/lib/tntd-form/TntdForm/index.d.ts.map +1 -0
- package/lib/tntd-form/TntdForm/index.js.map +1 -0
- package/lib/tntd-form/TntdForm/interface.d.ts +93 -0
- package/lib/tntd-form/TntdForm/interface.d.ts.map +1 -0
- package/lib/tntd-form/TntdForm/store.d.ts +4 -0
- package/lib/tntd-form/TntdForm/store.d.ts.map +1 -0
- package/lib/tntd-form/TntdForm/store.js.map +1 -0
- package/lib/tntd-form/TntdForm/utils.d.ts +48 -0
- package/lib/tntd-form/TntdForm/utils.d.ts.map +1 -0
- package/lib/tntd-form/TntdForm/utils.js.map +1 -0
- package/lib/tntd-layout/tntdLayout.stories.d.ts +5 -0
- package/lib/tntd-layout/tntdLayout.stories.d.ts.map +1 -0
- package/lib/tntd-layout/tntdLayout.stories.js +326 -0
- package/lib/tntd-layout/tntdLayout.stories.js.map +1 -0
- package/package.json +1 -1
- package/es/handle/handle.js +0 -102
- package/es/handle/handle.js.map +0 -1
- package/es/mention/index.js +0 -4
- package/es/mention/index.js.map +0 -1
- package/es/tntd-form/TntdForm/components/Item.js +0 -55
- package/es/tntd-form/TntdForm/components/Item.js.map +0 -1
- package/es/tntd-form/TntdForm/components/ItemComp.js +0 -186
- package/es/tntd-form/TntdForm/components/ItemComp.js.map +0 -1
- package/es/tntd-form/TntdForm/components/List.js +0 -102
- package/es/tntd-form/TntdForm/components/List.js.map +0 -1
- package/es/tntd-form/TntdForm/index.js +0 -55
- package/es/tntd-form/TntdForm/index.js.map +0 -1
- package/es/tntd-form/TntdForm/interface.js +0 -1
- package/es/tntd-form/TntdForm/store.js +0 -2
- package/es/tntd-form/TntdForm/store.js.map +0 -1
- package/es/tntd-form/TntdForm/utils.js +0 -219
- package/es/tntd-form/TntdForm/utils.js.map +0 -1
- package/lib/handle/handle.d.ts +0 -3
- package/lib/handle/handle.d.ts.map +0 -1
- package/lib/handle/handle.js +0 -130
- package/lib/handle/handle.js.map +0 -1
- /package/{es → lib}/tntd-form/TntdForm/interface.js.map +0 -0
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import _isEqual from "lodash/isEqual";
|
|
2
|
-
/*
|
|
3
|
-
* @Descripttion: TntdForm.Item
|
|
4
|
-
* @Author: 郑泳健
|
|
5
|
-
* @Date: 2023-02-22 23:25:24
|
|
6
|
-
* @LastEditors: 郑泳健
|
|
7
|
-
* @LastEditTime: 2023-04-06 17:46:57
|
|
8
|
-
*/
|
|
9
|
-
import React, { memo, useRef, useContext, useEffect } from 'react';
|
|
10
|
-
import ItemComp from './ItemComp';
|
|
11
|
-
import { FormContext } from '../store';
|
|
12
|
-
import { getNames } from '../utils';
|
|
13
|
-
const Item = ({
|
|
14
|
-
name,
|
|
15
|
-
children,
|
|
16
|
-
style,
|
|
17
|
-
rules,
|
|
18
|
-
shouldUpdate,
|
|
19
|
-
initialValue,
|
|
20
|
-
dependencies
|
|
21
|
-
}) => {
|
|
22
|
-
const {
|
|
23
|
-
form,
|
|
24
|
-
initialValues,
|
|
25
|
-
updateRefs,
|
|
26
|
-
compsRefs
|
|
27
|
-
} = useContext(FormContext);
|
|
28
|
-
const ref = useRef();
|
|
29
|
-
useEffect(() => {
|
|
30
|
-
compsRefs.current[getNames(name).join('.')] = () => {
|
|
31
|
-
var _a, _b;
|
|
32
|
-
(_b = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.onRefresh) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
33
|
-
};
|
|
34
|
-
}, [compsRefs, name]);
|
|
35
|
-
return React.createElement(ItemComp, Object.assign({}, {
|
|
36
|
-
form,
|
|
37
|
-
initialValues,
|
|
38
|
-
updateRefs,
|
|
39
|
-
compsRefs,
|
|
40
|
-
style,
|
|
41
|
-
rules,
|
|
42
|
-
name,
|
|
43
|
-
ref,
|
|
44
|
-
children,
|
|
45
|
-
initialValue,
|
|
46
|
-
shouldUpdate,
|
|
47
|
-
dependencies
|
|
48
|
-
}));
|
|
49
|
-
};
|
|
50
|
-
export default memo(Item, (nextProps, prevProps) => {
|
|
51
|
-
if (_isEqual(nextProps.name, prevProps.name) && !!prevProps.name) {
|
|
52
|
-
return true;
|
|
53
|
-
}
|
|
54
|
-
return false;
|
|
55
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Item.js","sourceRoot":"","sources":["../../../../src/tntd-form/TntdForm/components/Item.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAChC,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAEtC,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAEnC,MAAM,IAAI,GAAwB,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,YAAY,GACb,EAAE,EAAE;IACH,MAAM,EAAE,IAAI,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,UAAU,CAAe,WAAW,CAAC,CAAA;IAC5F,MAAM,GAAG,GAAG,MAAM,EAAoB,CAAA;IAEtC,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,GAAG,EAAE;;YACjD,MAAA,MAAA,GAAG,CAAC,OAAO,0CAAE,SAAS,kDAAI,CAAA;QAC5B,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,CAAA;IAErB,OAAO,CACL,oBAAC,QAAQ,oBACH;QACF,IAAI;QACJ,aAAa;QACb,UAAU;QACV,SAAS;QACT,KAAK;QACL,KAAK;QACL,IAAI;QACJ,GAAG;QACH,QAAQ;QACR,YAAY;QACZ,YAAY;QACZ,YAAY;KACb,EACD,CACH,CAAA;AACH,CAAC,CAAA;AAED,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE;IACjD,IAAI,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,IAAI,EAAE;QAC/D,OAAO,IAAI,CAAA;KACZ;IACD,OAAO,KAAK,CAAA;AACd,CAAC,CAAC,CAAA","sourcesContent":["/*\n * @Descripttion: TntdForm.Item\n * @Author: 郑泳健\n * @Date: 2023-02-22 23:25:24\n * @LastEditors: 郑泳健\n * @LastEditTime: 2023-04-06 17:46:57\n */\n\nimport React, { memo, useRef, useContext, useEffect } from 'react'\nimport { isEqual } from 'lodash'\nimport ItemComp from './ItemComp'\nimport { FormContext } from '../store'\nimport type { IFormItem, IFormContext, IChildrenCompFun } from '../interface'\nimport { getNames } from '../utils'\n\nconst Item: React.FC<IFormItem> = ({\n name,\n children,\n style,\n rules,\n shouldUpdate,\n initialValue,\n dependencies,\n}) => {\n const { form, initialValues, updateRefs, compsRefs } = useContext<IFormContext>(FormContext)\n const ref = useRef<IChildrenCompFun>()\n\n useEffect(() => {\n compsRefs.current[getNames(name).join('.')] = () => {\n ref.current?.onRefresh?.()\n }\n }, [compsRefs, name])\n\n return (\n <ItemComp\n {...{\n form,\n initialValues,\n updateRefs,\n compsRefs,\n style,\n rules,\n name,\n ref,\n children,\n initialValue,\n shouldUpdate,\n dependencies,\n }}\n />\n )\n}\n\nexport default memo(Item, (nextProps, prevProps) => {\n if (isEqual(nextProps.name, prevProps.name) && !!prevProps.name) {\n return true\n }\n return false\n})\n"]}
|
|
@@ -1,186 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Descripttion: TntdForm.Item进行性能优化
|
|
3
|
-
* @Author: 郑泳健
|
|
4
|
-
* @Date: 2023-02-23 12:47:28
|
|
5
|
-
* @LastEditors: 郑泳健
|
|
6
|
-
* @LastEditTime: 2023-04-06 17:45:35
|
|
7
|
-
*/
|
|
8
|
-
import React, { useState, memo, useEffect, useImperativeHandle } from 'react';
|
|
9
|
-
import { getNames, handleCheckItem, getInitValue } from '../utils';
|
|
10
|
-
const ItemComp = React.forwardRef(({
|
|
11
|
-
name,
|
|
12
|
-
children,
|
|
13
|
-
style,
|
|
14
|
-
initialValue,
|
|
15
|
-
rules,
|
|
16
|
-
shouldUpdate,
|
|
17
|
-
dependencies,
|
|
18
|
-
form,
|
|
19
|
-
updateRefs,
|
|
20
|
-
initialValues,
|
|
21
|
-
compsRefs
|
|
22
|
-
}, ref) => {
|
|
23
|
-
const [value, setValue] = useState(undefined);
|
|
24
|
-
const [errorMsg, setErrorMsg] = useState(undefined);
|
|
25
|
-
const [refresh, setRefresh] = useState(false);
|
|
26
|
-
useImperativeHandle(ref, () => ({
|
|
27
|
-
onRefresh: () => {
|
|
28
|
-
setRefresh(!refresh);
|
|
29
|
-
}
|
|
30
|
-
}));
|
|
31
|
-
/** 根据shouldUpdate 和 dependencies收集修改某个字段后需要同步更新的字段 */
|
|
32
|
-
useEffect(() => {
|
|
33
|
-
var _a;
|
|
34
|
-
const nameStr = (_a = getNames(name)) === null || _a === void 0 ? void 0 : _a.join('.');
|
|
35
|
-
if (shouldUpdate) {
|
|
36
|
-
updateRefs.current.shouldUpdateList.push(nameStr);
|
|
37
|
-
}
|
|
38
|
-
if (Array.isArray(dependencies)) {
|
|
39
|
-
const arr = dependencies.map(i => getNames(i).join('.'));
|
|
40
|
-
if (Array.isArray(arr)) {
|
|
41
|
-
arr.forEach(i => {
|
|
42
|
-
if (Array.isArray(updateRefs.current.dependencies[i])) {
|
|
43
|
-
updateRefs.current.dependencies[i] = [...updateRefs.current.dependencies[i], getNames(name).join('.')];
|
|
44
|
-
} else {
|
|
45
|
-
updateRefs.current.dependencies[i] = [getNames(name).join('.')];
|
|
46
|
-
}
|
|
47
|
-
});
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
}, [shouldUpdate, dependencies, name, updateRefs]);
|
|
51
|
-
const updateRender = () => {
|
|
52
|
-
if (Array.isArray(updateRefs.current.shouldUpdateList)) {
|
|
53
|
-
updateRefs.current.shouldUpdateList.forEach(i => {
|
|
54
|
-
var _a, _b;
|
|
55
|
-
(_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
const list = updateRefs.current.dependencies[getNames(name).join('.')];
|
|
59
|
-
if (Array.isArray(list)) {
|
|
60
|
-
list.forEach(i => {
|
|
61
|
-
var _a, _b;
|
|
62
|
-
(_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
63
|
-
});
|
|
64
|
-
}
|
|
65
|
-
};
|
|
66
|
-
/**
|
|
67
|
-
* 动态修改form内部的值,为啥不在useEffect里面处理的原因是子组件的useEffect会比父组件useEffect先执行,需要保证在子组件useEffect监听value变化的时候获取到的formData永远是最新的
|
|
68
|
-
* @param name
|
|
69
|
-
* @param value
|
|
70
|
-
* @returns
|
|
71
|
-
*/
|
|
72
|
-
const generateFormData = (name, value) => {
|
|
73
|
-
if (!name || !form || typeof name !== 'object') return;
|
|
74
|
-
const [str, ...rest] = name;
|
|
75
|
-
rest.forEach(i => {
|
|
76
|
-
if (form.formData[str]) {
|
|
77
|
-
form.formData[str][i].value = value;
|
|
78
|
-
form.formData[str][i].checkItem = () => {
|
|
79
|
-
const error = handleCheckItem(value, rules);
|
|
80
|
-
setErrorMsg(error);
|
|
81
|
-
return error;
|
|
82
|
-
};
|
|
83
|
-
} else {
|
|
84
|
-
form.formData[str] = {
|
|
85
|
-
[i]: {
|
|
86
|
-
value,
|
|
87
|
-
checkItem: () => {
|
|
88
|
-
const error = handleCheckItem(value, rules);
|
|
89
|
-
setErrorMsg(error);
|
|
90
|
-
return error;
|
|
91
|
-
},
|
|
92
|
-
setItemValue: () => {},
|
|
93
|
-
errorMsg: undefined
|
|
94
|
-
}
|
|
95
|
-
};
|
|
96
|
-
}
|
|
97
|
-
});
|
|
98
|
-
};
|
|
99
|
-
// 为了给最外层提供方法去校验,比如保存的时候.
|
|
100
|
-
// 这里依赖不要添加value,因为子组件的useEffect会比父组件useEffect先执行,如果添加了依赖value会导致子组件获取到的formData永远是上一次的
|
|
101
|
-
useEffect(() => {
|
|
102
|
-
if (!name || !form || typeof name !== 'object') return;
|
|
103
|
-
const [str, ...rest] = name;
|
|
104
|
-
const addItem = {
|
|
105
|
-
setItemValue: (_val, callback) => {
|
|
106
|
-
const error = handleCheckItem(_val, rules);
|
|
107
|
-
setValue(_val);
|
|
108
|
-
setErrorMsg(error);
|
|
109
|
-
callback === null || callback === void 0 ? void 0 : callback();
|
|
110
|
-
updateRender();
|
|
111
|
-
},
|
|
112
|
-
checkItem: () => {
|
|
113
|
-
const error = handleCheckItem(value, rules);
|
|
114
|
-
setErrorMsg(error);
|
|
115
|
-
return error;
|
|
116
|
-
},
|
|
117
|
-
value,
|
|
118
|
-
errorMsg
|
|
119
|
-
};
|
|
120
|
-
rest.forEach(i => {
|
|
121
|
-
if (form.formData[str]) {
|
|
122
|
-
form.formData[str][i] = addItem;
|
|
123
|
-
} else {
|
|
124
|
-
form.formData[str] = {
|
|
125
|
-
[i]: addItem
|
|
126
|
-
};
|
|
127
|
-
}
|
|
128
|
-
});
|
|
129
|
-
}, [rules, name, errorMsg, form]);
|
|
130
|
-
/** 这段代码不能删除,当增加/删除列的时候有些默认值需要更新 */
|
|
131
|
-
useEffect(() => {
|
|
132
|
-
if (initialValue) {
|
|
133
|
-
setValue(initialValue);
|
|
134
|
-
generateFormData(name, initialValue);
|
|
135
|
-
updateRender();
|
|
136
|
-
}
|
|
137
|
-
}, [initialValue]);
|
|
138
|
-
// 初始化设置默认值,
|
|
139
|
-
useEffect(() => {
|
|
140
|
-
const initValue = getInitValue(initialValues, name);
|
|
141
|
-
// @ts-ignore
|
|
142
|
-
const _value = ['', null, undefined].includes(initValue) ? initialValue : initValue;
|
|
143
|
-
setValue(_value);
|
|
144
|
-
generateFormData(name, _value);
|
|
145
|
-
updateRender();
|
|
146
|
-
}, []);
|
|
147
|
-
// 默认方法
|
|
148
|
-
const handleChange = e => {
|
|
149
|
-
var _a;
|
|
150
|
-
let val;
|
|
151
|
-
if (typeof e === 'object') {
|
|
152
|
-
val = (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value;
|
|
153
|
-
} else {
|
|
154
|
-
val = e;
|
|
155
|
-
}
|
|
156
|
-
setValue(val);
|
|
157
|
-
generateFormData(name, val);
|
|
158
|
-
const error = handleCheckItem(val, rules);
|
|
159
|
-
setErrorMsg(error);
|
|
160
|
-
updateRender();
|
|
161
|
-
};
|
|
162
|
-
return React.createElement("div", {
|
|
163
|
-
className: errorMsg ? 'has-error custom-form-item-wrapper' : 'custom-form-item-wrapper',
|
|
164
|
-
style: style
|
|
165
|
-
}, React.Children.map(children, child => {
|
|
166
|
-
var _a;
|
|
167
|
-
if (React.isValidElement(child)) {
|
|
168
|
-
return React.cloneElement(child, Object.assign({
|
|
169
|
-
value,
|
|
170
|
-
form,
|
|
171
|
-
onChange: handleChange,
|
|
172
|
-
'data-key': (_a = getNames(name)) === null || _a === void 0 ? void 0 : _a.join('.')
|
|
173
|
-
}, child.props));
|
|
174
|
-
}
|
|
175
|
-
return null;
|
|
176
|
-
}), errorMsg && React.createElement("div", {
|
|
177
|
-
className: "ant-form-explain ant-form-item-explain-error"
|
|
178
|
-
}, errorMsg));
|
|
179
|
-
});
|
|
180
|
-
function arePropsEqual(prevProps, nextProps) {
|
|
181
|
-
if (!nextProps.shouldUpdate && Array.isArray(nextProps.dependencies)) {
|
|
182
|
-
return true;
|
|
183
|
-
}
|
|
184
|
-
return false;
|
|
185
|
-
}
|
|
186
|
-
export default memo(ItemComp);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ItemComp.js","sourceRoot":"","sources":["../../../../src/tntd-form/TntdForm/components/ItemComp.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * @Descripttion: TntdForm.Item进行性能优化\n * @Author: 郑泳健\n * @Date: 2023-02-23 12:47:28\n * @LastEditors: 郑泳健\n * @LastEditTime: 2023-04-06 17:45:35\n */\n\nimport React, { useState, memo, useEffect, useImperativeHandle } from 'react'\nimport { getNames, handleCheckItem, getInitValue } from '../utils'\nimport type { IFormItem, IFormItemData, TinitialValueType, IChildrenCompFun } from '../interface'\n\nconst ItemComp: React.FC<IFormItem> = React.forwardRef<IChildrenCompFun, IFormItem>(\n (\n {\n name,\n children,\n style,\n initialValue,\n rules,\n shouldUpdate,\n dependencies,\n form,\n updateRefs,\n initialValues,\n compsRefs,\n },\n ref\n ) => {\n const [value, setValue] = useState<TinitialValueType>(undefined)\n const [errorMsg, setErrorMsg] = useState<string | undefined>(undefined)\n const [refresh, setRefresh] = useState<boolean>(false)\n\n useImperativeHandle(ref, () => ({\n onRefresh: () => {\n setRefresh(!refresh)\n },\n }))\n\n /** 根据shouldUpdate 和 dependencies收集修改某个字段后需要同步更新的字段 */\n useEffect(() => {\n const nameStr = getNames(name)?.join('.')\n if (shouldUpdate) {\n updateRefs.current.shouldUpdateList.push(nameStr)\n }\n\n if (Array.isArray(dependencies)) {\n const arr = dependencies.map((i) => getNames(i).join('.'))\n if (Array.isArray(arr)) {\n arr.forEach((i) => {\n if (Array.isArray(updateRefs.current.dependencies[i])) {\n updateRefs.current.dependencies[i] = [\n ...updateRefs.current.dependencies[i],\n getNames(name).join('.'),\n ]\n } else {\n updateRefs.current.dependencies[i] = [getNames(name).join('.')]\n }\n })\n }\n }\n }, [shouldUpdate, dependencies, name, updateRefs])\n\n const updateRender = () => {\n if (Array.isArray(updateRefs.current.shouldUpdateList)) {\n updateRefs.current.shouldUpdateList.forEach((i) => {\n compsRefs?.current?.[i]?.()\n })\n }\n const list = updateRefs.current.dependencies[getNames(name).join('.')]\n\n if (Array.isArray(list)) {\n list.forEach((i) => {\n compsRefs?.current?.[i]?.()\n })\n }\n }\n\n /**\n * 动态修改form内部的值,为啥不在useEffect里面处理的原因是子组件的useEffect会比父组件useEffect先执行,需要保证在子组件useEffect监听value变化的时候获取到的formData永远是最新的\n * @param name\n * @param value\n * @returns\n */\n const generateFormData = (name: string[] | string, value: TinitialValueType) => {\n if (!name || !form || typeof name !== 'object') return\n const [str, ...rest] = name\n\n rest.forEach((i) => {\n if (form.formData[str]) {\n form.formData[str][i].value = value\n form.formData[str][i].checkItem = () => {\n const error = handleCheckItem(value, rules)\n setErrorMsg(error)\n return error\n }\n } else {\n form.formData[str] = {\n [i]: {\n value,\n checkItem: () => {\n const error = handleCheckItem(value, rules)\n setErrorMsg(error)\n return error\n },\n setItemValue: () => {},\n errorMsg: undefined,\n },\n }\n }\n })\n }\n\n // 为了给最外层提供方法去校验,比如保存的时候.\n // 这里依赖不要添加value,因为子组件的useEffect会比父组件useEffect先执行,如果添加了依赖value会导致子组件获取到的formData永远是上一次的\n useEffect(() => {\n if (!name || !form || typeof name !== 'object') return\n const [str, ...rest] = name\n\n const addItem: IFormItemData = {\n setItemValue: (_val, callback) => {\n const error = handleCheckItem(_val, rules)\n setValue(_val)\n setErrorMsg(error)\n callback?.()\n updateRender()\n },\n checkItem: () => {\n const error = handleCheckItem(value, rules)\n setErrorMsg(error)\n return error\n },\n value,\n errorMsg,\n }\n rest.forEach((i) => {\n if (form.formData[str]) {\n form.formData[str][i] = addItem\n } else {\n form.formData[str] = {\n [i]: addItem,\n }\n }\n })\n }, [rules, name, errorMsg, form])\n\n /** 这段代码不能删除,当增加/删除列的时候有些默认值需要更新 */\n useEffect(() => {\n if (initialValue) {\n setValue(initialValue)\n generateFormData(name, initialValue)\n updateRender()\n }\n }, [initialValue])\n\n // 初始化设置默认值,\n useEffect(() => {\n const initValue = getInitValue(initialValues, name)\n // @ts-ignore\n const _value = ['', null, undefined].includes(initValue) ? initialValue : initValue\n\n setValue(_value)\n generateFormData(name, _value)\n updateRender()\n }, [])\n\n // 默认方法\n const handleChange = (\n e:\n | React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>\n | string\n | number\n | undefined\n ) => {\n let val\n if (typeof e === 'object') {\n val = (e as React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>)\n ?.target?.value\n } else {\n val = e\n }\n setValue(val)\n generateFormData(name, val)\n const error = handleCheckItem(val, rules)\n setErrorMsg(error)\n updateRender()\n }\n\n return (\n <div\n className={errorMsg ? 'has-error custom-form-item-wrapper' : 'custom-form-item-wrapper'}\n style={style}\n >\n {React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n value,\n form,\n onChange: handleChange,\n 'data-key': getNames(name)?.join('.'),\n ...child.props,\n })\n }\n return null\n })}\n {errorMsg && <div className=\"ant-form-explain ant-form-item-explain-error\">{errorMsg}</div>}\n </div>\n )\n }\n)\n\nfunction arePropsEqual(prevProps: IFormItem, nextProps: IFormItem) {\n if (!nextProps.shouldUpdate && Array.isArray(nextProps.dependencies)) {\n return true\n }\n\n return false\n}\n\nexport default memo(ItemComp)\n"]}
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
import _isEqual from "lodash/isEqual";
|
|
2
|
-
import _cloneDeep from "lodash/cloneDeep";
|
|
3
|
-
/*
|
|
4
|
-
* @Descripttion: FormList
|
|
5
|
-
* @Author: 郑泳健
|
|
6
|
-
* @Date: 2023-03-06 18:42:08
|
|
7
|
-
* @LastEditors: 郑泳健
|
|
8
|
-
* @LastEditTime: 2023-04-06 17:42:31
|
|
9
|
-
*/
|
|
10
|
-
import React, { useState, useEffect, useRef, useContext, memo } from 'react';
|
|
11
|
-
import { getNames } from '../utils';
|
|
12
|
-
import { FormContext } from '../store';
|
|
13
|
-
const List = ({
|
|
14
|
-
name,
|
|
15
|
-
children
|
|
16
|
-
}) => {
|
|
17
|
-
const maxRef = useRef(-1);
|
|
18
|
-
const {
|
|
19
|
-
form,
|
|
20
|
-
initialValues,
|
|
21
|
-
compsRefs,
|
|
22
|
-
updateRefs
|
|
23
|
-
} = useContext(FormContext);
|
|
24
|
-
const [dataLevel, setDataLevel] = useState([]);
|
|
25
|
-
/** 根据一开始记录的渲染shouldUpdate 和 dependencies组件 */
|
|
26
|
-
const updateRender = () => {
|
|
27
|
-
if (Array.isArray(updateRefs.current.shouldUpdateList)) {
|
|
28
|
-
updateRefs.current.shouldUpdateList.forEach(i => {
|
|
29
|
-
var _a, _b;
|
|
30
|
-
(_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
const list = updateRefs.current.dependencies[getNames(name).join('.')];
|
|
34
|
-
if (Array.isArray(list)) {
|
|
35
|
-
list.forEach(i => {
|
|
36
|
-
var _a, _b;
|
|
37
|
-
(_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
|
|
38
|
-
});
|
|
39
|
-
}
|
|
40
|
-
};
|
|
41
|
-
/** 根据默认数值自动生成dataLevel */
|
|
42
|
-
useEffect(() => {
|
|
43
|
-
let dataSource = initialValues;
|
|
44
|
-
const attrs = getNames(name);
|
|
45
|
-
const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
|
|
46
|
-
for (const key of attrs) {
|
|
47
|
-
dataSource = (dataSource === null || dataSource === void 0 ? void 0 : dataSource[key]) || [{}];
|
|
48
|
-
}
|
|
49
|
-
if (Array.isArray(dataSource)) {
|
|
50
|
-
const _level = dataSource.map((i, index) => {
|
|
51
|
-
return {
|
|
52
|
-
key: index,
|
|
53
|
-
name: `${attrs.join('.')}.${index}`
|
|
54
|
-
};
|
|
55
|
-
});
|
|
56
|
-
setDataLevel(_level);
|
|
57
|
-
maxRef.current = dataSource.length - 1;
|
|
58
|
-
if (form) {
|
|
59
|
-
form.dataLevel[key] = _level;
|
|
60
|
-
}
|
|
61
|
-
updateRender();
|
|
62
|
-
}
|
|
63
|
-
}, [form, initialValues, name]);
|
|
64
|
-
/** 新增一列 */
|
|
65
|
-
const handleAdd = index => {
|
|
66
|
-
const tempDataLevel = _cloneDeep(dataLevel);
|
|
67
|
-
const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
|
|
68
|
-
maxRef.current++;
|
|
69
|
-
const attrs = getNames(name);
|
|
70
|
-
tempDataLevel.splice(index + 1, 0, {
|
|
71
|
-
key: maxRef.current,
|
|
72
|
-
name: `${attrs === null || attrs === void 0 ? void 0 : attrs.join('.')}.${maxRef.current}`
|
|
73
|
-
});
|
|
74
|
-
setDataLevel(tempDataLevel);
|
|
75
|
-
if (form) {
|
|
76
|
-
form.dataLevel[key] = tempDataLevel;
|
|
77
|
-
}
|
|
78
|
-
updateRender();
|
|
79
|
-
};
|
|
80
|
-
/** 删除一列 */
|
|
81
|
-
const handleDel = index => {
|
|
82
|
-
const temp = _cloneDeep(dataLevel);
|
|
83
|
-
const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
|
|
84
|
-
temp.splice(index, 1);
|
|
85
|
-
setDataLevel(temp);
|
|
86
|
-
if (form) {
|
|
87
|
-
form.dataLevel[key] = temp;
|
|
88
|
-
}
|
|
89
|
-
updateRender();
|
|
90
|
-
};
|
|
91
|
-
return React.createElement(React.Fragment, null, children === null || children === void 0 ? void 0 : children(dataLevel, {
|
|
92
|
-
add: handleAdd,
|
|
93
|
-
remove: handleDel
|
|
94
|
-
}));
|
|
95
|
-
};
|
|
96
|
-
// name 没有改变就不需要重复render
|
|
97
|
-
export default memo(List, (nextProps, prevProps) => {
|
|
98
|
-
if (_isEqual(nextProps.name, prevProps.name) && !!prevProps.name) {
|
|
99
|
-
return true;
|
|
100
|
-
}
|
|
101
|
-
return false;
|
|
102
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"List.js","sourceRoot":"","sources":["../../../../src/tntd-form/TntdForm/components/List.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * @Descripttion: FormList\n * @Author: 郑泳健\n * @Date: 2023-03-06 18:42:08\n * @LastEditors: 郑泳健\n * @LastEditTime: 2023-04-06 17:42:31\n */\n\nimport React, { useState, useEffect, useRef, useContext, memo } from 'react'\nimport { cloneDeep, isEqual } from 'lodash'\nimport { getNames } from '../utils'\nimport { FormContext } from '../store'\nimport type { IFormListProps, IFormContext, ILevel, TAddOrRemove, IObject } from '../interface'\n\nconst List: React.FC<IFormListProps> = ({ name, children }) => {\n const maxRef = useRef(-1)\n const { form, initialValues, compsRefs, updateRefs } = useContext<IFormContext>(FormContext)\n const [dataLevel, setDataLevel] = useState<ILevel[]>([])\n\n /** 根据一开始记录的渲染shouldUpdate 和 dependencies组件 */\n const updateRender = () => {\n if (Array.isArray(updateRefs.current.shouldUpdateList)) {\n updateRefs.current.shouldUpdateList.forEach((i) => {\n compsRefs?.current?.[i]?.()\n })\n }\n\n const list = updateRefs.current.dependencies[getNames(name).join('.')]\n\n if (Array.isArray(list)) {\n list.forEach((i) => {\n compsRefs?.current?.[i]?.()\n })\n }\n }\n\n /** 根据默认数值自动生成dataLevel */\n useEffect(() => {\n let dataSource = initialValues\n const attrs = getNames(name)\n const key: string = Array.isArray(name) ? name?.[0] : name\n\n for (const key of attrs) {\n dataSource = dataSource?.[key] || [{}]\n }\n\n if (Array.isArray(dataSource)) {\n const _level = dataSource.map((i, index) => {\n return {\n key: index,\n name: `${attrs.join('.')}.${index}`,\n }\n })\n setDataLevel(_level)\n maxRef.current = dataSource.length - 1\n if (form) {\n form.dataLevel[key] = _level\n }\n updateRender()\n }\n }, [form, initialValues, name])\n\n /** 新增一列 */\n const handleAdd: TAddOrRemove = (index) => {\n const tempDataLevel = cloneDeep(dataLevel)\n const key: string = Array.isArray(name) ? name?.[0] : name\n maxRef.current++\n const attrs = getNames(name)\n tempDataLevel.splice(index + 1, 0, {\n key: maxRef.current,\n name: `${attrs?.join('.')}.${maxRef.current}`,\n })\n setDataLevel(tempDataLevel)\n if (form) {\n form.dataLevel[key] = tempDataLevel\n }\n updateRender()\n }\n\n /** 删除一列 */\n const handleDel: TAddOrRemove = (index) => {\n const temp = cloneDeep(dataLevel)\n const key: string = Array.isArray(name) ? name?.[0] : name\n temp.splice(index, 1)\n setDataLevel(temp)\n if (form) {\n form.dataLevel[key] = temp\n }\n updateRender()\n }\n\n return <>{children?.(dataLevel, { add: handleAdd, remove: handleDel })}</>\n}\n\n// name 没有改变就不需要重复render\nexport default memo(List, (nextProps, prevProps) => {\n if (isEqual(nextProps.name, prevProps.name) && !!prevProps.name) {\n return true\n }\n return false\n})\n"]}
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Descripttion: 高性能动态增删form表单
|
|
3
|
-
* @Author: 郑泳健
|
|
4
|
-
* @Date: 2023-02-16 10:43:03
|
|
5
|
-
* @LastEditors: 郑泳健
|
|
6
|
-
* @LastEditTime: 2023-04-06 15:32:07
|
|
7
|
-
*/
|
|
8
|
-
import React, { useRef } from 'react';
|
|
9
|
-
import { validateFields, getFieldsValue, getFieldValue } from './utils';
|
|
10
|
-
import { FormContext } from './store';
|
|
11
|
-
import List from './components/List';
|
|
12
|
-
import Item from './components/Item';
|
|
13
|
-
const TntdForm = ({
|
|
14
|
-
form,
|
|
15
|
-
initialValues,
|
|
16
|
-
children
|
|
17
|
-
}) => {
|
|
18
|
-
const updateRefs = useRef({
|
|
19
|
-
shouldUpdateList: [],
|
|
20
|
-
dependencies: {}
|
|
21
|
-
});
|
|
22
|
-
const compsRefs = useRef({});
|
|
23
|
-
return React.createElement(FormContext.Provider, {
|
|
24
|
-
value: {
|
|
25
|
-
form,
|
|
26
|
-
initialValues,
|
|
27
|
-
updateRefs,
|
|
28
|
-
compsRefs
|
|
29
|
-
}
|
|
30
|
-
}, children);
|
|
31
|
-
};
|
|
32
|
-
TntdForm.useForm = () => {
|
|
33
|
-
const form = useRef({
|
|
34
|
-
dataLevel: {},
|
|
35
|
-
formData: {},
|
|
36
|
-
validateFields: () => validateFields(form.current),
|
|
37
|
-
getFieldsValue: () => getFieldsValue(form.current),
|
|
38
|
-
getFieldValue: field => getFieldValue(form.current, field),
|
|
39
|
-
setFieldsValue: obj => {
|
|
40
|
-
for (const i in obj) {
|
|
41
|
-
if (Object.prototype.hasOwnProperty.call(obj, i)) {
|
|
42
|
-
const prefix = (i === null || i === void 0 ? void 0 : i.split('.')) || [];
|
|
43
|
-
const attr = prefix.pop();
|
|
44
|
-
if (attr && form.current.formData[prefix.join('.')][attr]) {
|
|
45
|
-
form.current.formData[prefix.join('.')][attr].setItemValue(obj[i]);
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
return [form.current];
|
|
52
|
-
};
|
|
53
|
-
TntdForm.List = List;
|
|
54
|
-
TntdForm.Item = Item;
|
|
55
|
-
export default TntdForm;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tntd-form/TntdForm/index.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,KAAK,EAAE,EAAY,MAAM,EAAE,MAAM,OAAO,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvE,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAErC,OAAO,IAAI,MAAM,mBAAmB,CAAA;AACpC,OAAO,IAAI,MAAM,mBAAmB,CAAA;AAEpC,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAkB,EAAE,EAAE;IACrE,MAAM,UAAU,GAAG,MAAM,CAAa;QACpC,gBAAgB,EAAE,EAAE;QACpB,YAAY,EAAE,EAAE;KACjB,CAAC,CAAA;IAEF,MAAM,SAAS,GAAG,MAAM,CAAC,EAAE,CAAC,CAAA;IAE5B,OAAO,CACL,oBAAC,WAAW,CAAC,QAAQ,IACnB,KAAK,EAAE;YACL,IAAI;YACJ,aAAa;YACb,UAAU;YACV,SAAS;SACV,IAEA,QAAQ,CACY,CACxB,CAAA;AACH,CAAC,CAAA;AAED,QAAQ,CAAC,OAAO,GAAG,GAAG,EAAE;IACtB,MAAM,IAAI,GAAuB,MAAM,CAAQ;QAC7C,SAAS,EAAE,EAAE;QACb,QAAQ,EAAE,EAAE;QACZ,cAAc,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;QAClD,cAAc,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;QAClD,aAAa,EAAE,CAAC,KAAoB,EAAE,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC;QAC3E,cAAc,EAAE,CAAC,GAA+B,EAAE,EAAE;YAClD,KAAK,MAAM,CAAC,IAAI,GAAG,EAAE;gBACnB,IAAI,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE;oBAChD,MAAM,MAAM,GAAG,CAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,KAAK,CAAC,GAAG,CAAC,KAAI,EAAE,CAAA;oBAClC,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,EAAE,CAAA;oBACzB,IAAI,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE;wBACzD,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA;qBACnE;iBACF;aACF;QACH,CAAC;KACF,CAAC,CAAA;IAEF,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;AACvB,CAAC,CAAA;AAED,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAA;AACpB,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAA;AAEpB,eAAe,QAAQ,CAAA","sourcesContent":["/*\n * @Descripttion: 高性能动态增删form表单\n * @Author: 郑泳健\n * @Date: 2023-02-16 10:43:03\n * @LastEditors: 郑泳健\n * @LastEditTime: 2023-04-06 15:32:07\n */\nimport React, { useState, useRef } from 'react'\nimport { validateFields, getFieldsValue, getFieldValue } from './utils'\nimport { FormContext } from './store'\nimport type { IForm, ITntdFormProps, IObject, TinitialValueType, IUpdateObj } from './interface'\nimport List from './components/List'\nimport Item from './components/Item'\n\nconst TntdForm = ({ form, initialValues, children }: ITntdFormProps) => {\n const updateRefs = useRef<IUpdateObj>({\n shouldUpdateList: [],\n dependencies: {},\n })\n\n const compsRefs = useRef({})\n\n return (\n <FormContext.Provider\n value={{\n form,\n initialValues,\n updateRefs,\n compsRefs,\n }}\n >\n {children}\n </FormContext.Provider>\n )\n}\n\nTntdForm.useForm = () => {\n const form: { current: IForm } = useRef<IForm>({\n dataLevel: {},\n formData: {},\n validateFields: () => validateFields(form.current),\n getFieldsValue: () => getFieldsValue(form.current),\n getFieldValue: (field: Array<string>) => getFieldValue(form.current, field),\n setFieldsValue: (obj: IObject<TinitialValueType>) => {\n for (const i in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, i)) {\n const prefix = i?.split('.') || []\n const attr = prefix.pop()\n if (attr && form.current.formData[prefix.join('.')][attr]) {\n form.current.formData[prefix.join('.')][attr].setItemValue(obj[i])\n }\n }\n }\n },\n })\n\n return [form.current]\n}\n\nTntdForm.List = List\nTntdForm.Item = Item\n\nexport default TntdForm\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"store.js","sourceRoot":"","sources":["../../../src/tntd-form/TntdForm/store.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,MAAM,CAAC,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAe,EAAkB,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport type { IFormContext } from './interface'\n\nexport const FormContext = React.createContext<IFormContext>({} as IFormContext)\n"]}
|