@hzab/form-render 1.6.9 → 1.6.10

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/CHANGELOG.md CHANGED
@@ -1,3 +1,6 @@
1
+ # @hzab/form-render@1.6.10
2
+
3
+ feat: 富文本编辑器实例像外暴露
1
4
 
2
5
  # @hzab/form-render@1.6.9
3
6
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hzab/form-render",
3
- "version": "1.6.9",
3
+ "version": "1.6.10",
4
4
  "description": "",
5
5
  "main": "src",
6
6
  "scripts": {
@@ -5,8 +5,8 @@ import { IDomEditor, IEditorConfig, IToolbarConfig } from "@wangeditor/editor";
5
5
  import { getOssUploadRequest, getOfflineUploadRequest } from "../Upload/common/customRequest";
6
6
  import { handlePreviewUrls } from "../Upload/common/OfflineUpload";
7
7
  import "./index.less";
8
- import { Spin, message } from 'antd';
9
- import { connect, mapProps, observer } from "@formily/react";
8
+ import { Spin, message } from "antd";
9
+ import { connect, mapProps, observer, useField } from "@formily/react";
10
10
 
11
11
  interface AnyObject {
12
12
  [key: string]: any;
@@ -15,18 +15,18 @@ interface AnyObject {
15
15
  interface PropsType {
16
16
  toolbarConfig?: Partial<IToolbarConfig>;
17
17
  editorConfig?: Partial<IEditorConfig>;
18
- ossOpt: AnyObject,
19
- uploadParams: AnyObject,
20
- height: string,
21
- ossServerUrl: string,
22
- ossUrl: string,
23
- offlinePreviewUrl: string,
24
- offlineServerUrl: string,
25
- value: string,
26
- onChange: any,
27
- customRequest: any,
28
- uploadMode: string,
29
- zIndex: number
18
+ ossOpt: AnyObject;
19
+ uploadParams: AnyObject;
20
+ height: string;
21
+ ossServerUrl: string;
22
+ ossUrl: string;
23
+ offlinePreviewUrl: string;
24
+ offlineServerUrl: string;
25
+ value: string;
26
+ onChange: any;
27
+ customRequest: any;
28
+ uploadMode: string;
29
+ zIndex: number;
30
30
  }
31
31
 
32
32
  export const RichEditor = observer(function (props: PropsType, parentRef) {
@@ -44,7 +44,7 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
44
44
  // ossUrl = "https://test-abt.hzabjt.com:18091/api/v1/user/oss/getWebOssConfig",
45
45
  ossServerUrl = "/api/v1/user/oss/getWebOssConfig",
46
46
  ossUrl = "/api/v1/user/oss/getWebOssConfig",
47
- zIndex = 9999
47
+ zIndex = 9999,
48
48
  } = props;
49
49
  const isPrivateStore =
50
50
  props.uploadParams?.fileAcl === "private" || props.ossOpt?.signatureParams?.fileAcl === "private";
@@ -54,15 +54,16 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
54
54
  getEditorContent,
55
55
  }));
56
56
 
57
+ const field = useField<any>();
58
+
57
59
  // editor 实例
58
60
  const [editor, setEditor] = useState<IDomEditor | null>(null); // TS 语法
59
61
 
60
62
  // 编辑器内容
61
- const [html, setHtml] = useState<string>('');
63
+ const [html, setHtml] = useState<string>("");
62
64
 
63
65
  const [isLoading, setIsLoading] = useState<boolean>(false);
64
66
 
65
-
66
67
  const setEditorContent = (content) => {
67
68
  setHtml(content);
68
69
  };
@@ -71,7 +72,6 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
71
72
  return html;
72
73
  };
73
74
 
74
-
75
75
  const customUpload = async (file: File, insertFn) => {
76
76
  let customRequest = props.customRequest;
77
77
  if (uploadMode === "oss") {
@@ -95,15 +95,15 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
95
95
  file,
96
96
  onSuccess: (res) => {
97
97
  setIsLoading(false);
98
- console.log(res)
99
- insertFn(res.url, '', '');
98
+ console.log(res);
99
+ insertFn(res.url, "", "");
100
100
  },
101
101
  onError: () => {
102
102
  setIsLoading(false);
103
103
  message.error(`${file.name} 上传失败`);
104
- }
105
- })
106
- }
104
+ },
105
+ });
106
+ };
107
107
 
108
108
  const config: Partial<IEditorConfig> = {
109
109
  // TS 语法
@@ -111,13 +111,13 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
111
111
  MENU_CONF: {
112
112
  uploadImage: {
113
113
  // form-data fieldName ,默认值 'wangeditor-uploaded-image'
114
- fieldName: 'wangeditor-uploaded-image',
114
+ fieldName: "wangeditor-uploaded-image",
115
115
  // 单个文件的最大体积限制,默认为 2M
116
116
  maxFileSize: 1 * 1024 * 1024, // 1M
117
117
  // 最多可上传几个文件,默认为 100
118
118
  maxNumberOfFiles: 1,
119
119
  // 选择文件时的类型限制,默认为 ['image/*'] 。如不想限制,则设置为 []
120
- allowedFileTypes: ['image/*'],
120
+ allowedFileTypes: ["image/*"],
121
121
  // 跨域是否传递 cookie ,默认为 false
122
122
  withCredentials: false,
123
123
  // 超时时间,默认为 10 秒
@@ -126,11 +126,11 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
126
126
  },
127
127
  uploadVideo: {
128
128
  // form-data fieldName ,默认值 'wangeditor-uploaded-image'
129
- fieldName: 'wangeditor-uploaded-video',
129
+ fieldName: "wangeditor-uploaded-video",
130
130
  // 最多可上传几个文件,默认为 100
131
131
  maxNumberOfFiles: 1,
132
132
  // 选择文件时的类型限制,默认为 ['image/*'] 。如不想限制,则设置为 []
133
- allowedFileTypes: ['video/*'],
133
+ allowedFileTypes: ["video/*"],
134
134
  // 跨域是否传递 cookie ,默认为 false
135
135
  withCredentials: false,
136
136
  customUpload,
@@ -139,12 +139,11 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
139
139
  ...editorConfig,
140
140
  };
141
141
 
142
-
143
142
  const onEditorChange = (e) => {
144
143
  const content = e.getHtml();
145
144
  setHtml(content);
146
145
  onChange && onChange(content);
147
- }
146
+ };
148
147
 
149
148
  // 及时销毁 editor ,重要!
150
149
  useEffect(() => {
@@ -156,15 +155,17 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
156
155
  }, [editor]);
157
156
 
158
157
  useEffect(() => {
159
- setEditorContent(value)
158
+ setEditorContent(value);
160
159
  }, [value]);
161
160
 
162
161
  return (
163
162
  <>
164
163
  <div className="wang-editor-warpper" style={{ zIndex }}>
165
- {isLoading && <div className="spin-content">
166
- <Spin tip="Loading..." />
167
- </div>}
164
+ {isLoading && (
165
+ <div className="spin-content">
166
+ <Spin tip="Loading..." />
167
+ </div>
168
+ )}
168
169
  <Toolbar
169
170
  editor={editor}
170
171
  defaultConfig={toolbarConfig}
@@ -174,7 +175,10 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
174
175
  <WangEditor
175
176
  defaultConfig={config}
176
177
  value={html}
177
- onCreated={setEditor}
178
+ onCreated={(e) => {
179
+ setEditor(e);
180
+ field.editor = e;
181
+ }}
178
182
  onChange={(e) => onEditorChange(e)}
179
183
  mode="default"
180
184
  style={{ height }}
@@ -204,4 +208,3 @@ export default connect(
204
208
  );
205
209
 
206
210
  export const Editor = WangEditor;
207
-