@antscorp/antsomi-ui 1.3.5-beta.162 → 1.3.5-beta.163
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.
|
@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
12
|
// Libraries
|
|
13
|
-
import React, { useEffect, useState } from 'react';
|
|
13
|
+
import React, { useEffect, useMemo, useState } from 'react';
|
|
14
14
|
import { Form } from 'antd';
|
|
15
15
|
import dayjs from 'dayjs';
|
|
16
16
|
// Components
|
|
@@ -23,7 +23,6 @@ import { Category, ImageSlider } from './components';
|
|
|
23
23
|
import { cloneDeep } from 'lodash';
|
|
24
24
|
const { Text } = Typography;
|
|
25
25
|
export const TemplateSaveAs = props => {
|
|
26
|
-
var _a;
|
|
27
26
|
const { className, shareAccess, saveOptions, imageReview, isLoadingCategories, categories, omitCategories, templateNames: templateNameList, templateNamesOptions, descriptionOptions,
|
|
28
27
|
// form,
|
|
29
28
|
form: formProps, value, onChange, onEvent, } = props;
|
|
@@ -37,20 +36,34 @@ export const TemplateSaveAs = props => {
|
|
|
37
36
|
const { saveOption = saveNewValue, templateName = saveOption === saveNewValue || !saveOption
|
|
38
37
|
? { id: undefined, label: defaultNewTemplateName }
|
|
39
38
|
: templateNameList === null || templateNameList === void 0 ? void 0 : templateNameList[0], description: defaultTemplateDesc, defaultThumbnail = 0, categories: categoriesValue = {}, accessInfo, } = value || {};
|
|
40
|
-
const initFormValue = {
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
39
|
+
const initFormValue = useMemo(() => {
|
|
40
|
+
var _a;
|
|
41
|
+
return ({
|
|
42
|
+
saveOption,
|
|
43
|
+
templateName: defaultNewTemplateName,
|
|
44
|
+
templateNameSelect: (templateName === null || templateName === void 0 ? void 0 : templateName.id) || ((_a = templateNameList === null || templateNameList === void 0 ? void 0 : templateNameList[0]) === null || _a === void 0 ? void 0 : _a.id),
|
|
45
|
+
description: defaultTemplateDesc || '',
|
|
46
|
+
categories: categoriesValue,
|
|
47
|
+
defaultThumbnail,
|
|
48
|
+
});
|
|
49
|
+
}, [
|
|
50
|
+
categoriesValue,
|
|
51
|
+
defaultNewTemplateName,
|
|
52
|
+
defaultTemplateDesc,
|
|
46
53
|
defaultThumbnail,
|
|
47
|
-
|
|
54
|
+
saveOption,
|
|
55
|
+
templateName === null || templateName === void 0 ? void 0 : templateName.id,
|
|
56
|
+
templateNameList,
|
|
57
|
+
]);
|
|
48
58
|
const [searchValue, setSearchValue] = useState('');
|
|
49
59
|
const searchValueDebounce = useDebounce(searchValue, 1000);
|
|
50
60
|
useEffect(() => {
|
|
51
61
|
if (searchValueDebounce && onSearch)
|
|
52
62
|
onSearch(searchValueDebounce);
|
|
53
63
|
}, [searchValueDebounce, onSearch]);
|
|
64
|
+
useEffect(() => {
|
|
65
|
+
form.setFieldsValue(initFormValue);
|
|
66
|
+
}, [form, initFormValue]);
|
|
54
67
|
// const [templateNameNew, setTemplateNameNew] = useState(defaultNewTemplateName);
|
|
55
68
|
// const [templateNameExist, setTemplateNameExist] = useState(
|
|
56
69
|
// templateName?.id ? templateName : templateNameList?.[0],
|
|
@@ -62,23 +75,11 @@ export const TemplateSaveAs = props => {
|
|
|
62
75
|
// }
|
|
63
76
|
// }, [templateName]);
|
|
64
77
|
const handleChangeValue = (newValue) => {
|
|
65
|
-
var _a;
|
|
66
78
|
if (onEvent) {
|
|
67
79
|
onEvent(newValue);
|
|
68
80
|
}
|
|
69
81
|
if (onChange) {
|
|
70
|
-
|
|
71
|
-
formValue.templateName =
|
|
72
|
-
formValue.saveOption === saveNewValue
|
|
73
|
-
? { id: undefined, label: formValue.templateName }
|
|
74
|
-
: {
|
|
75
|
-
id: formValue.templateNameSelect,
|
|
76
|
-
label: ((_a = templateNameList.find(item => item.id === formValue.templateNameSelect)) === null || _a === void 0 ? void 0 : _a.label) ||
|
|
77
|
-
formValue.templateName ||
|
|
78
|
-
'',
|
|
79
|
-
};
|
|
80
|
-
delete formValue.templateNameSelect;
|
|
81
|
-
onChange(Object.assign(Object.assign(Object.assign({}, value), formValue), newValue), form.getFieldsError().flatMap(item => item.errors));
|
|
82
|
+
onChange(Object.assign(Object.assign({}, value), newValue), form.getFieldsError().flatMap(item => item.errors));
|
|
82
83
|
}
|
|
83
84
|
};
|
|
84
85
|
const handleAddCategory = ({ parentKey, childKey }) => {
|
|
@@ -102,7 +103,16 @@ export const TemplateSaveAs = props => {
|
|
|
102
103
|
React.createElement(TemplateSaveAsStyled, { className: className || '', vertical: true },
|
|
103
104
|
React.createElement(Flex, { className: "save-options-container" },
|
|
104
105
|
React.createElement(Form.Item, { name: "saveOption", noStyle: true },
|
|
105
|
-
React.createElement(RadioGroup, { onChange: e =>
|
|
106
|
+
React.createElement(RadioGroup, { onChange: e => {
|
|
107
|
+
var _a;
|
|
108
|
+
const { value } = e.target;
|
|
109
|
+
const draftTemplateName = cloneDeep(templateName);
|
|
110
|
+
if (value === saveExistValue) {
|
|
111
|
+
const selectedTemplate = templateNameList.find(template => template.id === (templateName === null || templateName === void 0 ? void 0 : templateName.id));
|
|
112
|
+
draftTemplateName.id = (selectedTemplate === null || selectedTemplate === void 0 ? void 0 : selectedTemplate.id) || ((_a = templateNameList === null || templateNameList === void 0 ? void 0 : templateNameList[0]) === null || _a === void 0 ? void 0 : _a.id);
|
|
113
|
+
}
|
|
114
|
+
handleChangeValue({ saveOption: value, templateName: draftTemplateName });
|
|
115
|
+
} },
|
|
106
116
|
React.createElement(Radio, { value: saveNewValue }, saveNewText),
|
|
107
117
|
React.createElement(Radio, { value: saveExistValue }, saveExistText)))),
|
|
108
118
|
React.createElement(Flex, null,
|
|
@@ -126,11 +136,7 @@ export const TemplateSaveAs = props => {
|
|
|
126
136
|
React.createElement(Input, { placeholder: placeholder, maxLength: 255, debounce: 1000, onAfterChange: value => handleChangeValue({
|
|
127
137
|
templateName: { id: undefined, label: value },
|
|
128
138
|
}) }))) : (React.createElement(Form.Item, { name: "templateNameSelect" },
|
|
129
|
-
React.createElement(Select
|
|
130
|
-
// className="field-input"
|
|
131
|
-
, {
|
|
132
|
-
// className="field-input"
|
|
133
|
-
placeholder: selectPlaceholder, showSearch: true, searchValue: searchValue, onSearch: setSearchValue, onPopupScroll: e => {
|
|
139
|
+
React.createElement(Select, { placeholder: selectPlaceholder, showSearch: true, searchValue: searchValue, onSearch: setSearchValue, onPopupScroll: e => {
|
|
134
140
|
if (onNamePopupScroll)
|
|
135
141
|
onNamePopupScroll(e);
|
|
136
142
|
if (onScrollToBottom) {
|
|
@@ -147,24 +153,10 @@ export const TemplateSaveAs = props => {
|
|
|
147
153
|
justifyContent: 'center',
|
|
148
154
|
alignItems: 'center',
|
|
149
155
|
} },
|
|
150
|
-
React.createElement(Spin, { size: "small" }))) : null)), options:
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
...(templateNameList.find(item => item.id === getFieldValue('templateNameSelect'))
|
|
155
|
-
? []
|
|
156
|
-
: [
|
|
157
|
-
{
|
|
158
|
-
value: getFieldValue('templateNameSelect'),
|
|
159
|
-
label: getFieldValue('templateName'),
|
|
160
|
-
},
|
|
161
|
-
]),
|
|
162
|
-
...templateNameList.map(item => ({
|
|
163
|
-
value: item.id,
|
|
164
|
-
label: item.label,
|
|
165
|
-
})),
|
|
166
|
-
]
|
|
167
|
-
: [], onChange: value => {
|
|
156
|
+
React.createElement(Spin, { size: "small" }))) : null)), options: templateNameList === null || templateNameList === void 0 ? void 0 : templateNameList.map(item => ({
|
|
157
|
+
value: item.id,
|
|
158
|
+
label: item.label,
|
|
159
|
+
})), onChange: value => {
|
|
168
160
|
const newTemplateSelected = templateNameList.find(item => item.id === value);
|
|
169
161
|
form.setFieldValue('description', newTemplateSelected === null || newTemplateSelected === void 0 ? void 0 : newTemplateSelected.description);
|
|
170
162
|
handleChangeValue({
|