szld-libs 0.4.50 → 0.4.52
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/dist/szld-components.es.js +15155 -15065
- package/dist/szld-components.umd.js +126 -126
- package/es/components/DynamicForm/func.d.ts +2 -2
- package/es/components/DynamicForm/func.js +13 -8
- package/es/components/DynamicForm/index.d.ts +1 -0
- package/es/components/DynamicForm/index.js +41 -7
- package/es/components/DynamicForm/myCascader/index.d.ts +2 -1
- package/es/components/DynamicForm/myCascader/index.js +9 -11
- package/es/components/DynamicForm/myRadio/index.d.ts +5 -1
- package/es/components/DynamicForm/myRadio/index.js +63 -17
- package/es/components/DynamicForm/myRichText/index.d.ts +2 -1
- package/es/components/DynamicForm/myRichText/index.js +20 -30
- package/es/components/DynamicForm/mySelect/index.js +1 -1
- package/es/components/DynamicForm/selectModelBackfillFormItem/index.js +1 -1
- package/es/components/DynamicForm/useDynamicForm.d.ts +1 -0
- package/es/components/DynamicForm/useDynamicForm.js +23 -19
- package/es/index.js +5 -7
- package/es/mock/index.js +2 -2
- package/es/utils/szxkFunc.d.ts +11 -0
- package/es/utils/szxkFunc.js +25 -0
- package/lib/components/DynamicForm/func.d.ts +2 -2
- package/lib/components/DynamicForm/func.js +13 -8
- package/lib/components/DynamicForm/index.d.ts +1 -0
- package/lib/components/DynamicForm/index.js +38 -4
- package/lib/components/DynamicForm/myCascader/index.d.ts +2 -1
- package/lib/components/DynamicForm/myCascader/index.js +9 -11
- package/lib/components/DynamicForm/myRadio/index.d.ts +5 -1
- package/lib/components/DynamicForm/myRadio/index.js +61 -15
- package/lib/components/DynamicForm/myRichText/index.d.ts +2 -1
- package/lib/components/DynamicForm/myRichText/index.js +19 -29
- package/lib/components/DynamicForm/mySelect/index.js +1 -1
- package/lib/components/DynamicForm/selectModelBackfillFormItem/index.js +1 -1
- package/lib/components/DynamicForm/useDynamicForm.d.ts +1 -0
- package/lib/components/DynamicForm/useDynamicForm.js +19 -15
- package/lib/index.js +5 -7
- package/lib/mock/index.js +2 -2
- package/lib/utils/szxkFunc.d.ts +11 -0
- package/lib/utils/szxkFunc.js +25 -0
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { IformConfigItem, Ijson } from './index.d';
|
|
2
2
|
import { RangePickerProps } from 'antd/es/date-picker';
|
|
3
3
|
import { AxiosResponse } from 'axios';
|
|
4
|
-
export declare const handleGetPlaceholder: (itemWithJson: IformConfigItem, langId?: string) => string;
|
|
4
|
+
export declare const handleGetPlaceholder: (itemWithJson: IformConfigItem, langId?: string, langData?: Record<string, any>[]) => string;
|
|
5
5
|
/**
|
|
6
6
|
* 处理表单项目初始值
|
|
7
7
|
* 根据输入类型转换初始值为组件所需格式
|
|
@@ -23,7 +23,7 @@ export declare const handleGetSingleAttrListObj: (children: any[]) => {
|
|
|
23
23
|
* 20260325新增
|
|
24
24
|
* 匹配语言数据
|
|
25
25
|
*/
|
|
26
|
-
export declare const getTitle: (langConfig
|
|
26
|
+
export declare const getTitle: (langConfig?: any[], dataID?: string) => any;
|
|
27
27
|
/**
|
|
28
28
|
* 根据属性项配置处理成下拉数据
|
|
29
29
|
* @param param0
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import dayjs from "dayjs";
|
|
2
2
|
import { message } from "antd";
|
|
3
3
|
import { base64ToString } from "../../utils/method";
|
|
4
|
-
const handleGetPlaceholder = (itemWithJson, langId) => {
|
|
4
|
+
const handleGetPlaceholder = (itemWithJson, langId, langData) => {
|
|
5
5
|
const { input = "" } = (itemWithJson == null ? void 0 : itemWithJson.json) || {};
|
|
6
|
-
let
|
|
6
|
+
let dataId = "001";
|
|
7
|
+
let defaultMessage = "请输入";
|
|
7
8
|
if ([
|
|
8
9
|
"radio",
|
|
9
10
|
"checkbox",
|
|
@@ -24,14 +25,16 @@ const handleGetPlaceholder = (itemWithJson, langId) => {
|
|
|
24
25
|
"year-picker",
|
|
25
26
|
"second-picker"
|
|
26
27
|
].includes(input)) {
|
|
27
|
-
|
|
28
|
-
|
|
28
|
+
dataId = "002";
|
|
29
|
+
defaultMessage = "请选择";
|
|
29
30
|
}
|
|
30
31
|
if (["image", "file", "video", "audio"].includes(input)) {
|
|
31
|
-
|
|
32
|
-
|
|
32
|
+
dataId = "003";
|
|
33
|
+
defaultMessage = "请上传";
|
|
34
|
+
}
|
|
35
|
+
if (langId && (langData == null ? void 0 : langData.length)) {
|
|
36
|
+
defaultMessage = getTitle(langData, dataId);
|
|
33
37
|
}
|
|
34
|
-
const defaultMessage = langId === "10001" ? placeholderCn : placeholderEn;
|
|
35
38
|
return defaultMessage;
|
|
36
39
|
};
|
|
37
40
|
const handleSetFormItemInitialValue = (itemWithJson) => {
|
|
@@ -43,7 +46,7 @@ const handleSetFormItemInitialValue = (itemWithJson) => {
|
|
|
43
46
|
}
|
|
44
47
|
if (inputType === "range-picker" && initialValue) {
|
|
45
48
|
try {
|
|
46
|
-
initialValue = initialValue == null ? void 0 : initialValue.split("~");
|
|
49
|
+
initialValue = Array.isArray(initialValue) ? initialValue : initialValue == null ? void 0 : initialValue.split("~");
|
|
47
50
|
initialValue = initialValue.map((v) => v);
|
|
48
51
|
} catch (error) {
|
|
49
52
|
initialValue = void 0;
|
|
@@ -124,6 +127,8 @@ const handleGetSingleAttrListObj = (children) => {
|
|
|
124
127
|
return dealList(children);
|
|
125
128
|
};
|
|
126
129
|
const getTitle = (langConfig, dataID) => {
|
|
130
|
+
if (!(langConfig == null ? void 0 : langConfig.length))
|
|
131
|
+
return dataID;
|
|
127
132
|
const titleData = langConfig.find((x) => (x == null ? void 0 : x.dataid) === dataID);
|
|
128
133
|
return (titleData == null ? void 0 : titleData.content) ?? dataID;
|
|
129
134
|
};
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { forwardRef, useRef, useImperativeHandle, Fragment as Fragment$1 } from "react";
|
|
3
|
-
import { Form, Flex, Row } from "antd";
|
|
2
|
+
import { forwardRef, useRef, useState, useEffect, useImperativeHandle, Fragment as Fragment$1 } from "react";
|
|
3
|
+
import { Form, Flex, message, Row } from "antd";
|
|
4
4
|
import useDynamicForm from "./useDynamicForm";
|
|
5
|
+
import { getLangData } from "../../utils/szxkFunc";
|
|
6
|
+
import { getTitle } from "./func";
|
|
5
7
|
const DynamicForm = forwardRef((props, ref) => {
|
|
6
8
|
const {
|
|
7
9
|
formConfig,
|
|
@@ -28,13 +30,14 @@ const DynamicForm = forwardRef((props, ref) => {
|
|
|
28
30
|
formListItemWidth,
|
|
29
31
|
formListItemName,
|
|
30
32
|
isEdit = false,
|
|
31
|
-
langId
|
|
32
|
-
getTitle
|
|
33
|
+
langId,
|
|
34
|
+
getTitle: getTitle$1
|
|
33
35
|
} = props;
|
|
34
36
|
const delFileListRef = useRef([]);
|
|
35
37
|
const updateDelFileList = (file) => {
|
|
36
38
|
delFileListRef.current.push(file);
|
|
37
39
|
};
|
|
40
|
+
const [langData, setLangData] = useState([]);
|
|
38
41
|
const { handleRenderItem } = useDynamicForm({
|
|
39
42
|
commonRequestWidthParams,
|
|
40
43
|
uploadAction,
|
|
@@ -51,8 +54,26 @@ const DynamicForm = forwardRef((props, ref) => {
|
|
|
51
54
|
isEdit,
|
|
52
55
|
formShowType,
|
|
53
56
|
langId,
|
|
54
|
-
getTitle
|
|
57
|
+
getTitle: getTitle$1,
|
|
58
|
+
langData
|
|
59
|
+
// 新增:组件库固定文字语言匹配数据
|
|
55
60
|
});
|
|
61
|
+
useEffect(() => {
|
|
62
|
+
if (!formConfig || !langId) {
|
|
63
|
+
return;
|
|
64
|
+
}
|
|
65
|
+
handleGetLangData();
|
|
66
|
+
}, [formConfig, langId]);
|
|
67
|
+
const handleGetLangData = async () => {
|
|
68
|
+
const langData2 = await getLangData({
|
|
69
|
+
commonRequestWidthParams,
|
|
70
|
+
langId,
|
|
71
|
+
params: {
|
|
72
|
+
sysid: "3"
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
setLangData(langData2);
|
|
76
|
+
};
|
|
56
77
|
useImperativeHandle(ref, () => ({
|
|
57
78
|
getDelFileList: () => {
|
|
58
79
|
return delFileListRef.current;
|
|
@@ -111,9 +132,22 @@ const DynamicForm = forwardRef((props, ref) => {
|
|
|
111
132
|
}) }) }, field.key))
|
|
112
133
|
] }),
|
|
113
134
|
/* @__PURE__ */ jsxs(Flex, { className: "operation", vertical: true, children: [
|
|
114
|
-
/* @__PURE__ */ jsx("a", { className: "custom-form-list-add-btn", onClick: () => add(), children: langId
|
|
135
|
+
/* @__PURE__ */ jsx("a", { className: "custom-form-list-add-btn", onClick: () => add(), children: langId && getTitle(langData, "004") || "新增" }),
|
|
115
136
|
(fields == null ? void 0 : fields.length) > 0 && (fields == null ? void 0 : fields.map((v, i) => {
|
|
116
|
-
return /* @__PURE__ */ jsx(
|
|
137
|
+
return /* @__PURE__ */ jsx(
|
|
138
|
+
"a",
|
|
139
|
+
{
|
|
140
|
+
className: "custom-form-list-del-btn",
|
|
141
|
+
onClick: () => {
|
|
142
|
+
if (i === 0) {
|
|
143
|
+
return message.error(langId && getTitle(langData, "006") || "至少保留一个表单");
|
|
144
|
+
}
|
|
145
|
+
remove(v.key);
|
|
146
|
+
},
|
|
147
|
+
children: langId && getTitle(langData, "005") || "删除"
|
|
148
|
+
},
|
|
149
|
+
v.key
|
|
150
|
+
);
|
|
117
151
|
}))
|
|
118
152
|
] })
|
|
119
153
|
] }) }) : /* @__PURE__ */ jsx(Row, { gutter: colSpace, children: formConfig.map((item, index) => /* @__PURE__ */ jsx(Fragment$1, { children: handleRenderItem({
|
|
@@ -14,6 +14,7 @@ interface MyCascaderProps {
|
|
|
14
14
|
actionUrlKey: string;
|
|
15
15
|
actionUrlExtraParams: object;
|
|
16
16
|
langId?: string;
|
|
17
|
+
langData?: any[];
|
|
17
18
|
}
|
|
18
|
-
declare const MyCascader: ({ item, readonly, value, onChange, style, commonRequestWidthParams, commonRequest, interfaceTypeDict, interfaceTypeSysDict, actionUrlKey, actionUrlExtraParams, langId, }: MyCascaderProps) => import("react").JSX.Element;
|
|
19
|
+
declare const MyCascader: ({ item, readonly, value, onChange, style, commonRequestWidthParams, commonRequest, interfaceTypeDict, interfaceTypeSysDict, actionUrlKey, actionUrlExtraParams, langId, langData, }: MyCascaderProps) => import("react").JSX.Element;
|
|
19
20
|
export default MyCascader;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { App, Cascader } from "antd";
|
|
3
3
|
import { useState, useEffect } from "react";
|
|
4
|
+
import { getTitle } from "../func";
|
|
4
5
|
const MyCascader = ({
|
|
5
6
|
item,
|
|
6
7
|
readonly,
|
|
@@ -13,7 +14,8 @@ const MyCascader = ({
|
|
|
13
14
|
interfaceTypeSysDict,
|
|
14
15
|
actionUrlKey,
|
|
15
16
|
actionUrlExtraParams,
|
|
16
|
-
langId
|
|
17
|
+
langId,
|
|
18
|
+
langData
|
|
17
19
|
}) => {
|
|
18
20
|
const [options, setOptions] = useState([]);
|
|
19
21
|
const [loading, setLoading] = useState(false);
|
|
@@ -71,7 +73,7 @@ const MyCascader = ({
|
|
|
71
73
|
setOptions(dictionaryOptions);
|
|
72
74
|
}
|
|
73
75
|
} catch (error) {
|
|
74
|
-
message.error(langId
|
|
76
|
+
message.error(langId ? getTitle(langData, "008") : "加载数据失败");
|
|
75
77
|
} finally {
|
|
76
78
|
setLoading(false);
|
|
77
79
|
}
|
|
@@ -89,7 +91,7 @@ const MyCascader = ({
|
|
|
89
91
|
const searchFields = (item == null ? void 0 : item["search-field"]) || [];
|
|
90
92
|
const delimiter = ((_b = item == null ? void 0 : item["key-field"]) == null ? void 0 : _b.delimiter) || "-";
|
|
91
93
|
if (!list.length) {
|
|
92
|
-
message.error(langId
|
|
94
|
+
message.error(langId ? getTitle(langData, "009") : "请配置key-field");
|
|
93
95
|
return;
|
|
94
96
|
}
|
|
95
97
|
const params = {
|
|
@@ -124,7 +126,7 @@ const MyCascader = ({
|
|
|
124
126
|
}
|
|
125
127
|
reject([]);
|
|
126
128
|
} catch (error) {
|
|
127
|
-
message.error(langId
|
|
129
|
+
message.error(langId ? getTitle(langData, "008") : "加载数据失败");
|
|
128
130
|
reject([]);
|
|
129
131
|
} finally {
|
|
130
132
|
reject([]);
|
|
@@ -145,7 +147,7 @@ const MyCascader = ({
|
|
|
145
147
|
{
|
|
146
148
|
showSearch: { filter },
|
|
147
149
|
loading,
|
|
148
|
-
placeholder: "请选择",
|
|
150
|
+
placeholder: langId ? getTitle(langData, "002") : "请选择",
|
|
149
151
|
loadData,
|
|
150
152
|
disabled: readonly,
|
|
151
153
|
onChange: handleChange,
|
|
@@ -158,16 +160,12 @@ const MyCascader = ({
|
|
|
158
160
|
const list = ((_a = item == null ? void 0 : item["key-field"]) == null ? void 0 : _a.list) || [];
|
|
159
161
|
const searchFields = (item == null ? void 0 : item["search-field"]) || [];
|
|
160
162
|
if (!list.length || !searchFields.length) {
|
|
161
|
-
message.error(
|
|
162
|
-
langId === "10001" ? "请配置key-field和search-field" : "Please configure key-field and search-field"
|
|
163
|
-
);
|
|
163
|
+
message.error(langId ? getTitle(langData, "009") : "请配置key-field和search-field");
|
|
164
164
|
return;
|
|
165
165
|
}
|
|
166
166
|
const targetFieldIndex = list.findIndex((item2) => item2 === searchFields[0]);
|
|
167
167
|
if (targetFieldIndex === -1) {
|
|
168
|
-
message.error(
|
|
169
|
-
langId === "10001" ? "key-field与search-field配置不匹配" : "key-field and search-field configuration does not match"
|
|
170
|
-
);
|
|
168
|
+
message.error(langId ? getTitle(langData, "010") : "key-field与search-field配置不匹配");
|
|
171
169
|
return;
|
|
172
170
|
}
|
|
173
171
|
const values = value.map((v) => {
|
|
@@ -7,7 +7,7 @@ export interface IMYRadio {
|
|
|
7
7
|
value?: string | number;
|
|
8
8
|
item: Ijson;
|
|
9
9
|
readonly?: boolean;
|
|
10
|
-
|
|
10
|
+
params?: any;
|
|
11
11
|
radioAlign?: 'vertical' | 'horizontal';
|
|
12
12
|
handleUrlOptions: (val: any, delimiter: string, list: any[]) => string;
|
|
13
13
|
commonRequestWidthParams: (params: object, data?: any) => Promise<AxiosResponse<any, any>>;
|
|
@@ -16,6 +16,10 @@ export interface IMYRadio {
|
|
|
16
16
|
interfaceTypeSysDict: string;
|
|
17
17
|
actionUrlKey: string;
|
|
18
18
|
actionUrlExtraParams: object;
|
|
19
|
+
getTitle?: (pageID: string, dataID: string) => string;
|
|
20
|
+
attrid: string;
|
|
21
|
+
langId?: string;
|
|
22
|
+
langData?: any;
|
|
19
23
|
}
|
|
20
24
|
declare const MyRadio: (props: IMYRadio) => import("react").JSX.Element;
|
|
21
25
|
export default MyRadio;
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import { Radio } from "antd";
|
|
2
|
+
import { message, Spin, Radio } from "antd";
|
|
3
3
|
import { useState, useEffect } from "react";
|
|
4
|
-
import { handleSelectOptions } from "../func";
|
|
4
|
+
import { getTitle, handleSelectOptions } from "../func";
|
|
5
|
+
import { handleGetList, handleGetControlPanelConfig } from "szld-libs/es/utils/szxkFunc";
|
|
5
6
|
const MyRadio = (props) => {
|
|
6
7
|
const {
|
|
7
8
|
item,
|
|
8
9
|
onChange,
|
|
9
10
|
readonly = false,
|
|
10
|
-
|
|
11
|
+
params,
|
|
11
12
|
radioAlign = "horizontal",
|
|
12
13
|
commonRequestWidthParams,
|
|
13
14
|
commonRequest,
|
|
@@ -15,35 +16,80 @@ const MyRadio = (props) => {
|
|
|
15
16
|
interfaceTypeDict,
|
|
16
17
|
interfaceTypeSysDict,
|
|
17
18
|
actionUrlKey,
|
|
18
|
-
actionUrlExtraParams
|
|
19
|
+
actionUrlExtraParams,
|
|
20
|
+
getTitle: getTitle$1,
|
|
21
|
+
attrid,
|
|
22
|
+
langId,
|
|
23
|
+
langData
|
|
19
24
|
} = props;
|
|
25
|
+
const [loading, setLoading] = useState(false);
|
|
20
26
|
const [list, setList] = useState([]);
|
|
27
|
+
const [instanceList, setInstanceList] = useState([]);
|
|
21
28
|
useEffect(() => {
|
|
22
29
|
handleLoadOptions();
|
|
23
30
|
}, [item.inputType, item.classify, item.data, item.options]);
|
|
24
31
|
const handleLoadOptions = async () => {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
32
|
+
try {
|
|
33
|
+
setLoading(true);
|
|
34
|
+
if (item.inputType === "instance-url" && (item == null ? void 0 : item["instance-source-number"]) && attrid) {
|
|
35
|
+
const keyField = item == null ? void 0 : item["key-field"];
|
|
36
|
+
if (!keyField) {
|
|
37
|
+
message.warning(langId ? getTitle(langData, "010") : "请配置key-field");
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
const params2 = {
|
|
41
|
+
"source-number": item == null ? void 0 : item["instance-source-number"]
|
|
42
|
+
};
|
|
43
|
+
let list3 = await handleGetList(params2, commonRequestWidthParams);
|
|
44
|
+
const controlPanelConfig = await handleGetControlPanelConfig(item == null ? void 0 : item["instance-source-number"], commonRequest);
|
|
45
|
+
if (controlPanelConfig) {
|
|
46
|
+
const nonUniversalHeader = (controlPanelConfig == null ? void 0 : controlPanelConfig["non-universal-header"]) || [];
|
|
47
|
+
const labelConfig = (nonUniversalHeader == null ? void 0 : nonUniversalHeader["label"]) || [];
|
|
48
|
+
const valueConfig = (keyField == null ? void 0 : keyField[attrid]) || {};
|
|
49
|
+
const options = list3 == null ? void 0 : list3.map((v) => {
|
|
50
|
+
const label = labelConfig == null ? void 0 : labelConfig.map((x) => v == null ? void 0 : v[x]).join("-");
|
|
51
|
+
const { list: list4, delimiter } = valueConfig;
|
|
52
|
+
const value2 = list4 == null ? void 0 : list4.map((x) => v == null ? void 0 : v[x]).join(delimiter || "-");
|
|
53
|
+
if (!label) {
|
|
54
|
+
return null;
|
|
55
|
+
}
|
|
56
|
+
return {
|
|
57
|
+
label: getTitle$1 == null ? void 0 : getTitle$1((item == null ? void 0 : item["lang-page-id"]) || "5000000", label || label),
|
|
58
|
+
value: value2
|
|
59
|
+
};
|
|
60
|
+
});
|
|
61
|
+
setList(options);
|
|
62
|
+
setInstanceList(list3);
|
|
63
|
+
}
|
|
64
|
+
setLoading(false);
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
const list2 = await handleSelectOptions({
|
|
68
|
+
commonRequestWidthParams,
|
|
69
|
+
commonRequest,
|
|
70
|
+
interfaceTypeDict,
|
|
71
|
+
interfaceTypeSysDict,
|
|
72
|
+
actionUrlKey,
|
|
73
|
+
actionUrlExtraParams,
|
|
74
|
+
item
|
|
75
|
+
});
|
|
76
|
+
setList(list2);
|
|
77
|
+
setLoading(false);
|
|
78
|
+
} catch (error) {
|
|
79
|
+
setLoading(false);
|
|
80
|
+
}
|
|
35
81
|
};
|
|
36
|
-
return /* @__PURE__ */ jsx(
|
|
82
|
+
return /* @__PURE__ */ jsx(Spin, { spinning: loading, children: /* @__PURE__ */ jsx(
|
|
37
83
|
Radio.Group,
|
|
38
84
|
{
|
|
39
|
-
...
|
|
85
|
+
...params,
|
|
40
86
|
options: list,
|
|
41
87
|
onChange,
|
|
42
88
|
disabled: readonly,
|
|
43
89
|
value,
|
|
44
90
|
style: radioAlign === "vertical" ? { display: "flex", flexDirection: "column", gap: "8px", width: "100%" } : { width: "100%" }
|
|
45
91
|
}
|
|
46
|
-
);
|
|
92
|
+
) });
|
|
47
93
|
};
|
|
48
94
|
export {
|
|
49
95
|
MyRadio as default
|
|
@@ -6,6 +6,7 @@ interface IMyRichTextProps {
|
|
|
6
6
|
value: string;
|
|
7
7
|
langId?: string;
|
|
8
8
|
onChange: (val: string) => void;
|
|
9
|
+
langData?: any;
|
|
9
10
|
}
|
|
10
|
-
declare const MyRichText: ({ item, readonly, style, value, langId, onChange }: IMyRichTextProps) => import("react").JSX.Element | null;
|
|
11
|
+
declare const MyRichText: ({ item, readonly, style, value, langId, langData, onChange }: IMyRichTextProps) => import("react").JSX.Element | null;
|
|
11
12
|
export default MyRichText;
|
|
@@ -5,11 +5,12 @@ import { TextStyle } from "@tiptap/extension-text-style";
|
|
|
5
5
|
import TextAlign from "@tiptap/extension-text-align";
|
|
6
6
|
import Highlight from "@tiptap/extension-highlight";
|
|
7
7
|
import FontSize from "@tiptap/extension-font-size";
|
|
8
|
+
import { getTitle } from "../func";
|
|
8
9
|
import StarterKit from "@tiptap/starter-kit";
|
|
9
10
|
import Color from "@tiptap/extension-color";
|
|
10
11
|
import { useState, useEffect } from "react";
|
|
11
|
-
import { BoldOutlined, ItalicOutlined, UnderlineOutlined, StrikethroughOutlined, ClearOutlined, FontSizeOutlined, AlignLeftOutlined, AlignCenterOutlined, AlignRightOutlined, BlockOutlined, UnorderedListOutlined, OrderedListOutlined,
|
|
12
|
-
const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
12
|
+
import { BoldOutlined, ItalicOutlined, UnderlineOutlined, StrikethroughOutlined, ClearOutlined, FontSizeOutlined, AlignLeftOutlined, AlignCenterOutlined, AlignRightOutlined, BlockOutlined, UnorderedListOutlined, OrderedListOutlined, LinkOutlined, UndoOutlined, RedoOutlined } from "@ant-design/icons";
|
|
13
|
+
const MyRichText = ({ item, readonly, style, value, langId, langData, onChange }) => {
|
|
13
14
|
const [color, setColor] = useState("#1677ff");
|
|
14
15
|
useEffect(() => {
|
|
15
16
|
const styleSheet = document.createElement("style");
|
|
@@ -66,7 +67,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
66
67
|
}
|
|
67
68
|
return /* @__PURE__ */ jsxs("div", { style: { ...style, border: "1px solid #d9d9d9", borderRadius: 6, overflow: "hidden" }, children: [
|
|
68
69
|
/* @__PURE__ */ jsx("div", { style: { borderBottom: "1px solid #d9d9d9", padding: 8, background: "#fafafa" }, children: /* @__PURE__ */ jsxs(Space, { wrap: true, children: [
|
|
69
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "加粗", children: /* @__PURE__ */ jsx(
|
|
70
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "011") : "加粗", children: /* @__PURE__ */ jsx(
|
|
70
71
|
Button,
|
|
71
72
|
{
|
|
72
73
|
type: "text",
|
|
@@ -76,7 +77,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
76
77
|
className: editor.isActive("bold") ? "ant-btn-primary" : ""
|
|
77
78
|
}
|
|
78
79
|
) }),
|
|
79
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "斜体", children: /* @__PURE__ */ jsx(
|
|
80
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "012") : "斜体", children: /* @__PURE__ */ jsx(
|
|
80
81
|
Button,
|
|
81
82
|
{
|
|
82
83
|
type: "text",
|
|
@@ -86,7 +87,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
86
87
|
className: editor.isActive("italic") ? "ant-btn-primary" : ""
|
|
87
88
|
}
|
|
88
89
|
) }),
|
|
89
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "下划线", children: /* @__PURE__ */ jsx(
|
|
90
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "013") : "下划线", children: /* @__PURE__ */ jsx(
|
|
90
91
|
Button,
|
|
91
92
|
{
|
|
92
93
|
type: "text",
|
|
@@ -96,7 +97,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
96
97
|
className: editor.isActive("underline") ? "ant-btn-primary" : ""
|
|
97
98
|
}
|
|
98
99
|
) }),
|
|
99
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "删除线", children: /* @__PURE__ */ jsx(
|
|
100
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "014") : "删除线", children: /* @__PURE__ */ jsx(
|
|
100
101
|
Button,
|
|
101
102
|
{
|
|
102
103
|
type: "text",
|
|
@@ -106,7 +107,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
106
107
|
className: editor.isActive("strike") ? "ant-btn-primary" : ""
|
|
107
108
|
}
|
|
108
109
|
) }),
|
|
109
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "清除格式", children: /* @__PURE__ */ jsx(
|
|
110
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "015") : "清除格式", children: /* @__PURE__ */ jsx(
|
|
110
111
|
Button,
|
|
111
112
|
{
|
|
112
113
|
type: "text",
|
|
@@ -115,7 +116,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
115
116
|
disabled: readonly
|
|
116
117
|
}
|
|
117
118
|
) }),
|
|
118
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "文字颜色", children: /* @__PURE__ */ jsx(
|
|
119
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "016") : "文字颜色", children: /* @__PURE__ */ jsx(
|
|
119
120
|
ColorPicker,
|
|
120
121
|
{
|
|
121
122
|
value: color,
|
|
@@ -127,7 +128,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
127
128
|
}
|
|
128
129
|
}
|
|
129
130
|
) }),
|
|
130
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "字体大小", children: /* @__PURE__ */ jsx(
|
|
131
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "017") : "字体大小", children: /* @__PURE__ */ jsx(
|
|
131
132
|
Select,
|
|
132
133
|
{
|
|
133
134
|
defaultValue: "16px",
|
|
@@ -149,7 +150,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
149
150
|
suffixIcon: /* @__PURE__ */ jsx(FontSizeOutlined, {})
|
|
150
151
|
}
|
|
151
152
|
) }),
|
|
152
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "左对齐", children: /* @__PURE__ */ jsx(
|
|
153
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "018") : "左对齐", children: /* @__PURE__ */ jsx(
|
|
153
154
|
Button,
|
|
154
155
|
{
|
|
155
156
|
type: "text",
|
|
@@ -159,7 +160,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
159
160
|
className: editor.isActive({ textAlign: "left" }) ? "ant-btn-primary" : ""
|
|
160
161
|
}
|
|
161
162
|
) }),
|
|
162
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "居中对齐", children: /* @__PURE__ */ jsx(
|
|
163
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "019") : "居中对齐", children: /* @__PURE__ */ jsx(
|
|
163
164
|
Button,
|
|
164
165
|
{
|
|
165
166
|
type: "text",
|
|
@@ -169,7 +170,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
169
170
|
className: editor.isActive({ textAlign: "center" }) ? "ant-btn-primary" : ""
|
|
170
171
|
}
|
|
171
172
|
) }),
|
|
172
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "右对齐", children: /* @__PURE__ */ jsx(
|
|
173
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "020") : "右对齐", children: /* @__PURE__ */ jsx(
|
|
173
174
|
Button,
|
|
174
175
|
{
|
|
175
176
|
type: "text",
|
|
@@ -179,7 +180,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
179
180
|
className: editor.isActive({ textAlign: "right" }) ? "ant-btn-primary" : ""
|
|
180
181
|
}
|
|
181
182
|
) }),
|
|
182
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "两端对齐", children: /* @__PURE__ */ jsx(
|
|
183
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "021") : "两端对齐", children: /* @__PURE__ */ jsx(
|
|
183
184
|
Button,
|
|
184
185
|
{
|
|
185
186
|
type: "text",
|
|
@@ -190,7 +191,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
190
191
|
}
|
|
191
192
|
) }),
|
|
192
193
|
/* @__PURE__ */ jsx("span", { style: { width: 1, height: 20, background: "#d9d9d9", margin: "0 8px" } }),
|
|
193
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "无序列表", children: /* @__PURE__ */ jsx(
|
|
194
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "022") : "无序列表", children: /* @__PURE__ */ jsx(
|
|
194
195
|
Button,
|
|
195
196
|
{
|
|
196
197
|
type: "text",
|
|
@@ -200,7 +201,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
200
201
|
className: editor.isActive("bulletList") ? "ant-btn-primary" : ""
|
|
201
202
|
}
|
|
202
203
|
) }),
|
|
203
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "有序列表", children: /* @__PURE__ */ jsx(
|
|
204
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "023") : "有序列表", children: /* @__PURE__ */ jsx(
|
|
204
205
|
Button,
|
|
205
206
|
{
|
|
206
207
|
type: "text",
|
|
@@ -211,25 +212,14 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
211
212
|
}
|
|
212
213
|
) }),
|
|
213
214
|
/* @__PURE__ */ jsx("span", { style: { width: 1, height: 20, background: "#d9d9d9", margin: "0 8px" } }),
|
|
214
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "
|
|
215
|
-
Button,
|
|
216
|
-
{
|
|
217
|
-
type: "text",
|
|
218
|
-
icon: /* @__PURE__ */ jsx(ToolOutlined, {}),
|
|
219
|
-
onClick: () => editor.chain().focus().toggleHighlight().run(),
|
|
220
|
-
disabled: readonly,
|
|
221
|
-
className: editor.isActive("highlight") ? "ant-btn-primary" : ""
|
|
222
|
-
}
|
|
223
|
-
) }),
|
|
224
|
-
/* @__PURE__ */ jsx("span", { style: { width: 1, height: 20, background: "#d9d9d9", margin: "0 8px" } }),
|
|
225
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "链接", children: /* @__PURE__ */ jsx(
|
|
215
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "024") : "链接", children: /* @__PURE__ */ jsx(
|
|
226
216
|
Button,
|
|
227
217
|
{
|
|
228
218
|
type: "text",
|
|
229
219
|
icon: /* @__PURE__ */ jsx(LinkOutlined, {}),
|
|
230
220
|
onClick: () => {
|
|
231
221
|
const previousUrl = editor.getAttributes("link").href;
|
|
232
|
-
const url = window.prompt("请输入链接地址", previousUrl);
|
|
222
|
+
const url = window.prompt(langId ? getTitle(langData, "025") : " 请输入链接地址", previousUrl);
|
|
233
223
|
if (url === null) {
|
|
234
224
|
return;
|
|
235
225
|
}
|
|
@@ -243,7 +233,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
243
233
|
}
|
|
244
234
|
) }),
|
|
245
235
|
/* @__PURE__ */ jsx("span", { style: { width: 1, height: 20, background: "#d9d9d9", margin: "0 8px" } }),
|
|
246
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "撤销", children: /* @__PURE__ */ jsx(
|
|
236
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "026") : "撤销", children: /* @__PURE__ */ jsx(
|
|
247
237
|
Button,
|
|
248
238
|
{
|
|
249
239
|
type: "text",
|
|
@@ -252,7 +242,7 @@ const MyRichText = ({ item, readonly, style, value, langId, onChange }) => {
|
|
|
252
242
|
disabled: readonly || !editor.can().undo()
|
|
253
243
|
}
|
|
254
244
|
) }),
|
|
255
|
-
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: "前进", children: /* @__PURE__ */ jsx(
|
|
245
|
+
/* @__PURE__ */ jsx(Tooltip, { placement: "topLeft", title: langId ? getTitle(langData, "027") : "前进", children: /* @__PURE__ */ jsx(
|
|
256
246
|
Button,
|
|
257
247
|
{
|
|
258
248
|
type: "text",
|
|
@@ -54,7 +54,7 @@ const MySelect = ({
|
|
|
54
54
|
return null;
|
|
55
55
|
}
|
|
56
56
|
return {
|
|
57
|
-
label: getTitle == null ? void 0 : getTitle("5000000", label),
|
|
57
|
+
label: getTitle == null ? void 0 : getTitle((item == null ? void 0 : item["lang-page-id"]) || "5000000", label || label),
|
|
58
58
|
value: value2
|
|
59
59
|
};
|
|
60
60
|
});
|
|
@@ -19,6 +19,7 @@ interface IDynamicFormProps {
|
|
|
19
19
|
formShowType?: 'form' | 'table';
|
|
20
20
|
langId?: string;
|
|
21
21
|
getTitle?: (pageID: string, dataID: string) => string;
|
|
22
|
+
langData?: Record<string, any>[];
|
|
22
23
|
}
|
|
23
24
|
type NestedFormListFieldData = FormListFieldData & {
|
|
24
25
|
parentName?: (string | number)[];
|