@keyblade/tinymce-editor-vue2 0.0.12-alpha.3 → 0.0.12-alpha.30

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 CHANGED
@@ -1,11 +1,17 @@
1
1
  # tinymce 富文本编辑器
2
- 封装 tinymce 编辑器,该库不包含任何组件库, 对于图片上传、视频上传等功能,可使用自定义插件实现。
2
+ 一码游 tinymce 编辑器
3
+
4
+ ## 前提
5
+ 必须将 `vue` 版本升级至 `2.7+`,按如下文档操作,一般来说只需要升级 vue、及 @vue/cli-xxx 版本即可
6
+
7
+ 升级指南:https://v2.cn.vuejs.org/v2/guide/migration-vue-2-7.html
3
8
 
4
9
  ## 一、安装
5
10
  ```shell
6
11
  yarn add @keyblade/tinymce-editor-vue2
7
- yarn add pic-viewer@0.5.1 (如项目中有,怎不需要再次安装)
8
- yarn add imgpond@0.6.2 (如项目中有,怎不需要再次安装)
12
+ # 下面两个是编辑器需要的第三方依赖,如原项目中有,可以不用安装,但要注意版本,必须匹配,否则css样式有问题。
13
+ yarn add pic-viewer@0.5.1
14
+ yarn add imgpond@0.6.2
9
15
  ```
10
16
 
11
17
  ## 二、使用
@@ -25,14 +31,50 @@ Vue.use(PicViewer, {})
25
31
  Vue.use(ImgPond, {})
26
32
 
27
33
  Vue.use(TinymceEditor, {
28
- // 配置图片上传
29
- imageUploadHandle: (file, filename, { extParameters }) => {
30
- return new Promise((resolve) => {
31
- resolve({
32
- success: true,
33
- url: 'https://object.gcongo.com.cn/onecode-travel/nonClassic/8cefe379c03b5f39cd8ef725293a3c02/2024/5/1715995588295/d0b5bb458b694130be0c63e2f1d0090b.png'
34
+ // 图片
35
+ imageUploadOptions: {
36
+ handleRequest: (file: File, filename: string, parameters: { extParameters: Record<string, any> }) => {
37
+ return new Promise((resolve) => {
38
+ setTimeout(() => {
39
+ resolve({
40
+ success: true,
41
+ url: 'https://object.gcongo.com.cn/onecode-travel/nonClassic/8cefe379c03b5f39cd8ef725293a3c02/2024/5/1715995588295/d0b5bb458b694130be0c63e2f1d0090b.png'
42
+ })
43
+ }, 1000)
34
44
  })
35
- })
45
+ }
46
+ },
47
+ // 音频
48
+ audioUploadOptions: {
49
+ action: '/api/man/file/upload',
50
+ headers: (parameters: { file: File | Blob, extParameters: Record<string, any> }) => {
51
+ return {
52
+ Appkey: 'dsy_2AeyG8N0CqEC',
53
+ Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJqdGkiOiJNell4T1RnNE1qSmtOVGhuWnpVM05qbGlaamM2WWpFMlpUTTBNak16Tnpkbk16RXhNVEkyTVRJek9VSk1SRnRNTjFZPTQ2VkdDWk84VzFDUSIsImlzcyI6IjM2MTFlY2IyYTY3NzMzZDk1OTI4OWQzYzM4ZjY0Y2Q3Iiwic3ViIjoiQVBQIiwiYXVkIjoiZHN5XzJBZXlHOE4wQ3FFQyIsImlhdCI6MTcxNjY4NzU2MCwiZXhwIjoxNzE3MjkyMzYwfQ.PPhupuc_X0yHB3ex1dVEGVdFyCMmlGYRvZHokVIGcaU'
54
+ }
55
+ },
56
+ data: (parameters: { file: File | Blob, extParameters: Record<string, any> }) => {
57
+ return {}
58
+ },
59
+ handlerResponse: (response: any) => {
60
+ return { url: response.data, errorMessage: response.msg }
61
+ }
62
+ },
63
+ // 视频
64
+ videoUploadOptions: {
65
+ action: '/api/man/file/upload',
66
+ headers: (parameters: { file: File | Blob, extParameters: Record<string, any> }) => {
67
+ return {
68
+ Appkey: 'dsy_2AeyG8N0CqEC',
69
+ Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJqdGkiOiJNell4T1RnNE1qSmtOVGhuWnpVM05qbGlaamM2WWpFMlpUTTBNak16Tnpkbk16RXhNVEkyTVRJek9VSk1SRnRNTjFZPTQ2VkdDWk84VzFDUSIsImlzcyI6IjM2MTFlY2IyYTY3NzMzZDk1OTI4OWQzYzM4ZjY0Y2Q3Iiwic3ViIjoiQVBQIiwiYXVkIjoiZHN5XzJBZXlHOE4wQ3FFQyIsImlhdCI6MTcxNjY4NzU2MCwiZXhwIjoxNzE3MjkyMzYwfQ.PPhupuc_X0yHB3ex1dVEGVdFyCMmlGYRvZHokVIGcaU'
70
+ }
71
+ },
72
+ data: (parameters: { file: File | Blob, extParameters: Record<string, any> }) => {
73
+ return {}
74
+ },
75
+ handlerResponse: (response: any) => {
76
+ return { url: response.data, errorMessage: response.msg }
77
+ }
36
78
  }
37
79
  })
38
80
  ```
@@ -40,14 +82,14 @@ Vue.use(TinymceEditor, {
40
82
  ### 2.使用组件
41
83
  ```text
42
84
  <template>
43
- <TinymceEditor
85
+ <KbTinymceEditor
44
86
  v-model="text"
87
+ :extParameters="{a: 1}"
45
88
  />
46
89
  </template>
47
90
 
48
91
  <script setup lang="ts">
49
92
  import { onMounted, ref } from 'vue'
50
- import TinymceEditor from '@keyblade/tinymce-editor-vue2'
51
93
 
52
94
  const text = ref<string>('')
53
95
 
@@ -61,74 +103,115 @@ onMounted(() => {
61
103
  ### 1.全局属性
62
104
  ```typescript
63
105
  interface TinymceEditorGlobalOptions {
64
- // 消息方法实例
65
- message?: {
66
- // 加载中
67
- loading?: (message?: string) => { close: () => void }
68
- // 成功
69
- success?: (message?: string) => void
70
- // 错误提示
71
- error?: (message?: string) => void
72
- // 销毁
73
- destroy?: () => void
74
- }
75
- /** 图片上传请求处理,需要返回图片地址 */
76
- imageUploadHandle?: (file: File | Blob, filename: string, options?: {
77
- extParameters?: Record<string, any>
78
- }) => Promise<{success: boolean; url?: string; errorMessage?: string}>;
79
- /** 接着默认配置进行处理 */
80
- paste_preprocess?: (editor: Editor, args: {
81
- content: string;
82
- readonly internal: boolean;
83
- }) => void;
84
- /** 接着默认配置进行处理 */
85
- paste_postprocess?: (editor: Editor, args: {
86
- node: HTMLElement;
87
- readonly internal: boolean;
88
- }) => void;
89
- /** tinyMCE编辑器配置 */
90
- tinymceOptions?: RawEditorOptions
106
+ /** 富文本编辑器选项 */
107
+ options?: RawEditorOptions;
108
+
109
+ /** 图片上传选项 */
110
+ imageUploadOptions?: ImageUploadOptions;
111
+
112
+ /** imgPond 选项 */
113
+ imgPondOptions?: Record<string, any>;
114
+
115
+ /** 音频上传选项 */
116
+ audioUploadOptions?: AudioUploadOptions;
117
+
118
+ /** 视频上传选项 */
119
+ videoUploadOptions?: VideoUploadOptions;
91
120
  }
92
121
  ```
93
122
 
94
- ### 2.全局属性
123
+ ### 2.组件属性
95
124
  ```typescript
96
- interface ComponentProps {
125
+ interface ComponentOptions {
97
126
  /** vue2 v-model */
98
127
  value?: string
99
- /** vue3 v-model */
100
- modelValue?: string
101
128
  /** 是否禁止编辑 */
102
129
  disabled?: boolean;
130
+ /** 额外参数 */
131
+ extParameters?: Record<string, any>;
132
+
133
+ /** 富文本编辑器选项 */
134
+ options?: Partial<RawEditorOptions>
135
+
136
+ /** 图片上传选项 */
137
+ imageUploadOptions?: ImageUploadOptions;
138
+
139
+ /** imgPond选项 */
140
+ imgPondOptions?: Record<string, any>;
141
+
142
+ /** 音频上传组件选项 */
143
+ audioUploadOptions?: AudioUploadOptions;
144
+
145
+ /** 视频上传选项 */
146
+ videoUploadOptions?: VideoUploadOptions;
147
+
148
+ /** 初始化完成 */
149
+ initComplete?: (params: { editorIns: Editor }) => void;
150
+ }
151
+ ```
152
+
153
+ ### 3.图片上传配置
154
+ ```typescript
155
+ export interface ImageUploadOptions {
156
+ /** 图片上传组件最大数量 */
157
+ maxCount?: number;
158
+ /** 图片上传组件下方文字 */
159
+ tipText?: string;
103
160
  /** 图片最大值(单位M,主要用于错误提示) */
104
- imageMaxSize?: number;
105
- /** 图片允许的类型 */
106
- imageAllowedType?: string[];
107
- /** 图片允许的类型 */
108
- imageAllowedMineType?: string[];
161
+ maxSize?: number;
162
+ /** 图片允许的后缀类型(小写,如: png、jpg) */
163
+ allowedType?: string[];
109
164
  /** 图片最小宽度 */
110
- imageMinWidth?: number;
165
+ minWidth?: number;
111
166
  /** 图片最小高度 */
112
- imageMinHeight?: number;
167
+ minHeight?: number;
113
168
  /** 图片最大宽度 */
114
- imageMaxWidth?: number;
169
+ maxWidth?: number;
115
170
  /** 图片最大高度 */
116
- imageMaxHeight?: number;
117
- /** 图片上传请求处理,需要返回图片地址 */
118
- imageUploadHandle?: (file: File | Blob, filename: string) => Promise<{success: boolean; url?: string; errorMessage?: string}>;
119
- /** 接着默认配置进行处理 */
120
- paste_preprocess?: (editor: Editor, args: {
121
- content: string;
122
- readonly internal: boolean;
123
- }) => void;
124
- /** 接着默认配置进行处理 */
125
- paste_postprocess?: (editor: Editor, args: {
126
- node: HTMLElement;
127
- readonly internal: boolean;
128
- }) => void;
129
- /** 初始化完成 */
130
- initComplete?: (params: { editorIns: Editor }) => void,
131
- /** tinyMCE选项 */
132
- options?: Partial<RawEditorOptions>
171
+ maxHeight?: number;
172
+ /** 图片上传请求处理 */
173
+ handleRequest?: (file: File, filename: string, options?: {
174
+ extParameters?: Record<string, any>
175
+ }) => Promise<{success: boolean; url?: string; errorMessage?: string}>;
176
+ }
177
+ ```
178
+
179
+ ### 4.视频上传配置
180
+ ```typescript
181
+ export interface VideoUploadOptions {
182
+ /** 是否启用 */
183
+ enable?: boolean;
184
+ /** 最大尺寸(M) */
185
+ maxSize?: number;
186
+ /** 允许的后缀类型(小写,如: mp4) */
187
+ allowedType?: string[];
188
+ /** 上传地址(启用必传) */
189
+ action?: string;
190
+ /** 请求头 */
191
+ headers?: (parameters: { file: File | Blob, extParameters?: Record<string, any> }) => Record<string, any>;
192
+ /** 额外请求体 */
193
+ data?: (parameters: { file: File | Blob, extParameters?: Record<string, any> }) => Record<string, any>;
194
+ /** 响应处理(启用必传) */
195
+ handlerResponse?: (response: any) => { url?: string; errorMessage?: string }
196
+ }
197
+ ```
198
+
199
+ ### 5.音频上传配置
200
+ ```typescript
201
+ export interface AudioUploadOptions {
202
+ /** 是否启用 */
203
+ enable?: boolean;
204
+ /** 最大尺寸(M) */
205
+ maxSize?: number;
206
+ /** 允许的后缀类型(小写,如: mp4) */
207
+ allowedType?: string[];
208
+ /** 上传地址(启用必传) */
209
+ action?: string;
210
+ /** 请求头 */
211
+ headers?: (parameters: { file: File | Blob, extParameters?: Record<string, any> }) => Record<string, any>;
212
+ /** 额外请求体 */
213
+ data?: (parameters: { file: File | Blob, extParameters?: Record<string, any> }) => Record<string, any>;
214
+ /** 响应处理(启用必传) */
215
+ handlerResponse?: (response: any) => { url?: string; errorMessage?: string }
133
216
  }
134
217
  ```
@@ -1,220 +1,64 @@
1
1
  import { Editor, RawEditorOptions } from 'tinymce';
2
+ import { AudioUploadOptions, ImageUploadOptions, VideoUploadOptions } from './types';
2
3
 
3
4
  declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
4
5
  /** vue2 v-model */
5
6
  value?: string | undefined;
6
- /** vue3 v-model */
7
- modelValue?: string | undefined;
8
7
  /** 是否禁止编辑 */
9
8
  disabled?: boolean | undefined;
10
9
  /** 额外参数 */
11
10
  extParameters?: Record<string, any> | undefined;
12
- /** 图片上传组件最大数量 */
13
- imageUploadMaxCount?: number | undefined;
14
- /** 图片上传提示 */
15
- imageUploadTip?: string | undefined;
16
- /** 图片最大值(单位M,主要用于错误提示) */
17
- imageMaxSize?: number | undefined;
18
- /** 图片允许的类型 */
19
- imageAllowedType?: string[] | undefined;
20
- /** 图片允许的类型 */
21
- imageAllowedMineType?: string[] | undefined;
22
- /** 图片最小宽度 */
23
- imageMinWidth?: number | undefined;
24
- /** 图片最小高度 */
25
- imageMinHeight?: number | undefined;
26
- /** 图片最大宽度 */
27
- imageMaxWidth?: number | undefined;
28
- /** 图片最大高度 */
29
- imageMaxHeight?: number | undefined;
30
- /** 音频最大尺寸(M) */
31
- audioMaxSize?: number | undefined;
32
- /** 音频结尾格式 */
33
- audioAllowedType?: string[] | undefined;
34
- /** 音频上传选项 */
35
- audioUploadOptions?: {
36
- action: string;
37
- handlerResponse: (response: any) => {
38
- url?: string;
39
- errorMessage?: string;
40
- };
41
- headers?: Record<string, any> | undefined;
42
- data?: Record<string, any> | undefined;
43
- } | undefined;
44
- /** 视频最大尺寸(M) */
45
- videoMaxSize?: number | undefined;
46
- /** 视频结尾格式 */
47
- videoAllowedType?: string[] | undefined;
11
+ /** 富文本编辑器选项 */
12
+ options?: Partial<RawEditorOptions> | undefined;
13
+ /** 图片上传选项 */
14
+ imageUploadOptions?: ImageUploadOptions | undefined;
15
+ /** imgPond选项 */
16
+ imgPondOptions?: Record<string, any> | undefined;
17
+ /** 音频上传组件选项 */
18
+ audioUploadOptions?: AudioUploadOptions | undefined;
48
19
  /** 视频上传选项 */
49
- videoUploadOptions?: {
50
- action: string;
51
- handlerResponse: (response: any) => {
52
- url?: string;
53
- errorMessage?: string;
54
- };
55
- headers?: Record<string, any> | undefined;
56
- data?: Record<string, any> | undefined;
57
- } | undefined;
58
- /** 图片上传请求处理,需要返回图片地址 */
59
- imageUploadHandle?: ((file: File | Blob, filename: string, options?: {
60
- extParameters?: Record<string, any>;
61
- }) => Promise<{
62
- success: boolean;
63
- url?: string;
64
- errorMessage?: string;
65
- }>) | undefined;
66
- /** 接着默认配置进行处理 */
67
- paste_preprocess?: ((editor: Editor, args: {
68
- content: string;
69
- readonly internal: boolean;
70
- }) => void) | undefined;
71
- /** 接着默认配置进行处理 */
72
- paste_postprocess?: ((editor: Editor, args: {
73
- node: HTMLElement;
74
- readonly internal: boolean;
75
- }) => void) | undefined;
20
+ videoUploadOptions?: VideoUploadOptions | undefined;
76
21
  /** 初始化完成 */
77
22
  initComplete?: ((params: {
78
23
  editorIns: Editor;
79
24
  }) => void) | undefined;
80
- /** 富文本编辑器选项 */
81
- options?: Partial<RawEditorOptions> | undefined;
82
- /** imgPond 选项 */
83
- imgPondOptions?: Record<string, any> | undefined;
84
25
  }>, {
85
26
  value: string;
86
- modelValue: string;
87
- imageUploadMaxCount: number;
88
- imageUploadTip: string;
89
- imageMaxSize: number;
90
- imageAllowedType: () => string[];
91
- imageAllowedMineType: () => string[];
92
- imageMinWidth: number;
93
- imageMinHeight: number;
94
- imageMaxWidth: number;
95
- imageMaxHeight: number;
96
- audioMaxSize: number;
97
- videoMaxSize: number;
98
- audioAllowedType: () => string[];
99
- videoAllowedType: () => string[];
27
+ disabled: boolean;
28
+ extParameters: () => {};
100
29
  options: () => {};
101
30
  }>, {}, {}, {}, {}, import('vue/types/v3-component-options').ComponentOptionsMixin, import('vue/types/v3-component-options').ComponentOptionsMixin, {
102
31
  input: (value: string) => void;
103
- "update:modelValue": (value: string) => void;
104
32
  }, string, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
105
33
  /** vue2 v-model */
106
34
  value?: string | undefined;
107
- /** vue3 v-model */
108
- modelValue?: string | undefined;
109
35
  /** 是否禁止编辑 */
110
36
  disabled?: boolean | undefined;
111
37
  /** 额外参数 */
112
38
  extParameters?: Record<string, any> | undefined;
113
- /** 图片上传组件最大数量 */
114
- imageUploadMaxCount?: number | undefined;
115
- /** 图片上传提示 */
116
- imageUploadTip?: string | undefined;
117
- /** 图片最大值(单位M,主要用于错误提示) */
118
- imageMaxSize?: number | undefined;
119
- /** 图片允许的类型 */
120
- imageAllowedType?: string[] | undefined;
121
- /** 图片允许的类型 */
122
- imageAllowedMineType?: string[] | undefined;
123
- /** 图片最小宽度 */
124
- imageMinWidth?: number | undefined;
125
- /** 图片最小高度 */
126
- imageMinHeight?: number | undefined;
127
- /** 图片最大宽度 */
128
- imageMaxWidth?: number | undefined;
129
- /** 图片最大高度 */
130
- imageMaxHeight?: number | undefined;
131
- /** 音频最大尺寸(M) */
132
- audioMaxSize?: number | undefined;
133
- /** 音频结尾格式 */
134
- audioAllowedType?: string[] | undefined;
135
- /** 音频上传选项 */
136
- audioUploadOptions?: {
137
- action: string;
138
- handlerResponse: (response: any) => {
139
- url?: string;
140
- errorMessage?: string;
141
- };
142
- headers?: Record<string, any> | undefined;
143
- data?: Record<string, any> | undefined;
144
- } | undefined;
145
- /** 视频最大尺寸(M) */
146
- videoMaxSize?: number | undefined;
147
- /** 视频结尾格式 */
148
- videoAllowedType?: string[] | undefined;
39
+ /** 富文本编辑器选项 */
40
+ options?: Partial<RawEditorOptions> | undefined;
41
+ /** 图片上传选项 */
42
+ imageUploadOptions?: ImageUploadOptions | undefined;
43
+ /** imgPond选项 */
44
+ imgPondOptions?: Record<string, any> | undefined;
45
+ /** 音频上传组件选项 */
46
+ audioUploadOptions?: AudioUploadOptions | undefined;
149
47
  /** 视频上传选项 */
150
- videoUploadOptions?: {
151
- action: string;
152
- handlerResponse: (response: any) => {
153
- url?: string;
154
- errorMessage?: string;
155
- };
156
- headers?: Record<string, any> | undefined;
157
- data?: Record<string, any> | undefined;
158
- } | undefined;
159
- /** 图片上传请求处理,需要返回图片地址 */
160
- imageUploadHandle?: ((file: File | Blob, filename: string, options?: {
161
- extParameters?: Record<string, any>;
162
- }) => Promise<{
163
- success: boolean;
164
- url?: string;
165
- errorMessage?: string;
166
- }>) | undefined;
167
- /** 接着默认配置进行处理 */
168
- paste_preprocess?: ((editor: Editor, args: {
169
- content: string;
170
- readonly internal: boolean;
171
- }) => void) | undefined;
172
- /** 接着默认配置进行处理 */
173
- paste_postprocess?: ((editor: Editor, args: {
174
- node: HTMLElement;
175
- readonly internal: boolean;
176
- }) => void) | undefined;
48
+ videoUploadOptions?: VideoUploadOptions | undefined;
177
49
  /** 初始化完成 */
178
50
  initComplete?: ((params: {
179
51
  editorIns: Editor;
180
52
  }) => void) | undefined;
181
- /** 富文本编辑器选项 */
182
- options?: Partial<RawEditorOptions> | undefined;
183
- /** imgPond 选项 */
184
- imgPondOptions?: Record<string, any> | undefined;
185
53
  }>, {
186
54
  value: string;
187
- modelValue: string;
188
- imageUploadMaxCount: number;
189
- imageUploadTip: string;
190
- imageMaxSize: number;
191
- imageAllowedType: () => string[];
192
- imageAllowedMineType: () => string[];
193
- imageMinWidth: number;
194
- imageMinHeight: number;
195
- imageMaxWidth: number;
196
- imageMaxHeight: number;
197
- audioMaxSize: number;
198
- videoMaxSize: number;
199
- audioAllowedType: () => string[];
200
- videoAllowedType: () => string[];
55
+ disabled: boolean;
56
+ extParameters: () => {};
201
57
  options: () => {};
202
58
  }>>>, {
203
- imageMaxSize: number;
204
- imageAllowedMineType: string[];
205
- imageMinWidth: number;
206
- imageMinHeight: number;
207
- imageMaxWidth: number;
208
- imageMaxHeight: number;
209
59
  value: string;
210
- modelValue: string;
211
- imageUploadMaxCount: number;
212
- imageUploadTip: string;
213
- imageAllowedType: string[];
214
- audioMaxSize: number;
215
- audioAllowedType: string[];
216
- videoMaxSize: number;
217
- videoAllowedType: string[];
60
+ disabled: boolean;
61
+ extParameters: Record<string, any>;
218
62
  options: Partial<RawEditorOptions>;
219
63
  }>;
220
64
  export default _default;
package/es/editor.vue.js CHANGED
@@ -1,22 +1,23 @@
1
- import d from "./editor.vue2.js";
2
- import "./editor.vue3.js";
3
- import s from "./_virtual/_plugin-vue2_normalizer.js";
4
- var r = function() {
5
- var l, i, u;
6
- var e = this, a = e._self._c, o = e._self._setupProxy;
7
- return a("div", { staticClass: "tinymce-editor" }, [a("textarea", { ref: "insRef" }), e._v(" "), a("el-dialog", { staticClass: "tinymce-editor-dialog tinymce-editor-upload-image-dialog", attrs: { visible: o.uploadImage.dialogVisible, title: "插入图片", "append-to-body": !0, "close-on-click-modal": !1, "destroy-on-close": "" }, on: { close: o.onUploadImageClose } }, [a("el-form", { ref: "uploadImageFormRef", staticClass: "uploadImageForm", attrs: { model: o.uploadImage.formData } }, [a("el-form-item", { attrs: { prop: "images", rules: { required: !0, message: "必填项" } } }, [a(o.ImgPond, e._b({ attrs: { valueType: "array", size: e.imageMaxSize, count: e.imageUploadMaxCount, upload: o.onImageUploadUpload }, model: { value: o.uploadImage.formData.images, callback: function(t) {
8
- e.$set(o.uploadImage.formData, "images", t);
9
- }, expression: "uploadImage.formData.images" } }, "ImgPond", o.mergeImgPondOptions, !1))], 1), a("div", { staticClass: "tips" }, [a("span", { staticStyle: { "font-size": "15px", "font-weight": "bold" } }, [e._v("注意:")]), a("span", [e._v("1. 单次最多可同时选择" + e._s(e.imageUploadMaxCount) + "张图片")]), a("span", [e._v("2. 仅支持" + e._s(e.imageAllowedType.map((t) => t.toUpperCase()).join("、")) + "格式")]), a("span", [e._v("3. 单张图片大小不可超过" + e._s(e.imageMaxSize) + "M")]), a("span", [e._v("4. 像素不低于" + e._s(e.imageMinWidth) + "*" + e._s(e.imageMinHeight) + "且像素不高于" + e._s(e.imageMaxWidth) + "*" + e._s(e.imageMaxHeight))])])], 1), a("div", { attrs: { slot: "footer" }, slot: "footer" }, [a("el-button", { on: { click: o.onUploadImageClose } }, [e._v("取消")]), a("el-button", { attrs: { type: "primary" }, on: { click: o.onUploadImageConfirm } }, [e._v("确定")])], 1)], 1), a("el-dialog", { staticClass: "tinymce-editor-dialog tinymce-editor-upload-audio-dialog", attrs: { visible: o.uploadAudio.dialogVisible, title: "插入音频", "append-to-body": !0, "close-on-click-modal": !1, "destroy-on-close": "" }, on: { close: o.onUploadAudioClose } }, [a("el-form", { ref: "uploadAudioFormRef", staticClass: "uploadAudioForm", attrs: { model: o.uploadAudio.formData, "label-width": "auto" } }, [a("el-form-item", { attrs: { label: "名称", prop: "name", rules: { required: !0, message: "必填项" } } }, [a("el-input", { attrs: { maxlength: "14", "show-word-limit": "", placeholder: "请输入" }, model: { value: o.uploadAudio.formData.name, callback: function(t) {
10
- e.$set(o.uploadAudio.formData, "name", t);
11
- }, expression: "uploadAudio.formData.name" } })], 1), a("el-form-item", { attrs: { label: "封面", prop: "cover", rules: { required: !0, message: "必填项" } } }, [a(o.ImgPond, e._b({ attrs: { valueType: "array", size: e.imageMaxSize, count: 1, upload: o.onImageUploadUpload }, model: { value: o.uploadAudio.formData.cover, callback: function(t) {
12
- e.$set(o.uploadAudio.formData, "cover", t);
13
- }, expression: "uploadAudio.formData.cover" } }, "ImgPond", o.mergeImgPondOptions, !1))], 1), a("el-form-item", { attrs: { label: "音频", prop: "file", rules: { required: !0, message: "必填项" } } }, [a("el-upload", { class: ["upload", { "upload-hide": o.uploadAudio.formData.file.length >= 1 }], attrs: { name: "file", "file-list": o.uploadAudio.formData.file, action: ((l = o.mergeAudioUploadOptions) == null ? void 0 : l.action) || "", data: (i = o.mergeAudioUploadOptions) == null ? void 0 : i.data, accept: "audio/*", "list-type": "headTextContent", "before-upload": o.onUploadAudioBeforeUpload, headers: (u = o.mergeAudioUploadOptions) == null ? void 0 : u.headers, "on-remove": o.onUploadAudioRemove, "on-success": o.onUploadAudioSuccess, "on-error": o.onUploadAudioError, limit: 1 } }, [a("el-button", { attrs: { size: "small", type: "primary" } }, [e._v("上传文件"), a("i", { staticClass: "el-icon-upload el-icon--right" })]), a("div", { staticClass: "el-upload__tip", attrs: { slot: "tip" }, slot: "tip" }, [e._v("支持音频格式:" + e._s(e.audioAllowedType.join("、")))])], 1)], 1)], 1), a("div", { attrs: { slot: "footer" }, slot: "footer" }, [a("el-button", { on: { click: o.onUploadAudioClose } }, [e._v("取消")]), a("el-button", { attrs: { type: "primary" }, on: { click: o.onUploadAudioConfirm } }, [e._v("确定")])], 1)], 1), a("el-dialog", { staticClass: "tinymce-editor-dialog tinymce-editor-upload-video-dialog", attrs: { visible: o.uploadVideo.dialogVisible, title: "插入视频", "append-to-body": !0, "close-on-click-modal": !1, "destroy-on-close": "" }, on: { close: o.onUploadVideoClose } }, [a("el-form", { ref: "uploadVideoFormRef", staticClass: "uploadVideoForm", attrs: { model: o.uploadVideo.formData, "label-width": "auto" } }, [a("el-form-item", { attrs: { label: "视频", prop: "file", rules: { required: !0, message: "必填项" } } }, [a("el-upload", { class: ["upload", { "upload-hide": o.uploadVideo.formData.file.length >= 1 }], attrs: { name: "file", "file-list": o.uploadVideo.formData.file, action: o.mergeVideoUploadOptions.action || "", data: o.mergeVideoUploadOptions.data, accept: "video/*", "list-type": "headTextContent", "before-upload": o.onUploadVideoBeforeUpload, headers: o.mergeVideoUploadOptions.headers, "on-remove": o.onUploadVideoRemove, "on-success": o.onUploadVideoSuccess, "on-error": o.onUploadVideoError, limit: 1 } }, [a("el-button", { attrs: { size: "small", type: "primary" } }, [e._v("上传文件"), a("i", { staticClass: "el-icon-upload el-icon--right" })]), a("div", { staticClass: "el-upload__tip", attrs: { slot: "tip" }, slot: "tip" }, [e._v("支持视频格式:" + e._s(e.videoAllowedType.join("、")))])], 1)], 1)], 1), a("div", { attrs: { slot: "footer" }, slot: "footer" }, [a("el-button", { on: { click: o.onUploadVideoClose } }, [e._v("取消")]), a("el-button", { attrs: { type: "primary" }, on: { click: o.onUploadVideoConfirm } }, [e._v("确定")])], 1)], 1)], 1);
14
- }, p = [], n = /* @__PURE__ */ s(
15
- d,
16
- r,
17
- p
1
+ import n from "./editor.vue2.js";
2
+ import m from "./_virtual/_plugin-vue2_normalizer.js";
3
+ var c = function() {
4
+ var l, i, s, u, d, r, p;
5
+ var a = this, e = a._self._c, o = a._self._setupProxy;
6
+ return e("div", { staticClass: "tinymce-editor" }, [e("textarea", { ref: "insRef" }), e("el-dialog", { staticClass: "tinymce-editor-dialog tinymce-editor-upload-image-dialog", attrs: { visible: o.uploadImage.dialogVisible, title: "插入图片", "append-to-body": !0, "close-on-click-modal": !1, "destroy-on-close": "" }, on: { close: o.onUploadImageClose } }, [e("el-form", { ref: "uploadImageFormRef", staticClass: "uploadImageForm", attrs: { model: o.uploadImage.formData } }, [e("el-form-item", { attrs: { prop: "images", rules: { required: !0, message: "必填项" } } }, [e(o.ImgPond, a._b({ ref: "uploadImageImgPondRef", attrs: { valueType: "array", accept: o.imgPondAccept, size: o.mergeImageUploadOptions.maxSize, count: o.mergeImageUploadOptions.maxCount, upload: o.onImageUploadUpload }, model: { value: o.uploadImage.formData.images, callback: function(t) {
7
+ a.$set(o.uploadImage.formData, "images", t);
8
+ }, expression: "uploadImage.formData.images" } }, "ImgPond", o.mergeImgPondOptions, !1))], 1), e("div", { staticClass: "tips" }, [e("span", { staticStyle: { "font-size": "15px", "font-weight": "bold" } }, [a._v("注意:")]), e("span", [a._v("1. 单次最多可同时选择" + a._s(o.mergeImageUploadOptions.maxCount) + "张图片")]), e("span", [a._v("2. 仅支持" + a._s((i = (l = o.mergeImageUploadOptions) == null ? void 0 : l.allowedType) == null ? void 0 : i.map((t) => t.toUpperCase()).join("、")) + "格式")]), e("span", [a._v("3. 单张图片大小不可超过" + a._s(o.mergeImageUploadOptions.maxSize) + "M")]), e("span", [a._v("4. 像素不低于" + a._s(o.mergeImageUploadOptions.minWidth) + "*" + a._s(o.mergeImageUploadOptions.minHeight) + "且像素不高于" + a._s(o.mergeImageUploadOptions.maxWidth) + "*" + a._s(o.mergeImageUploadOptions.maxHeight))])])], 1), e("div", { attrs: { slot: "footer" }, slot: "footer" }, [e("el-button", { on: { click: o.onUploadImageClose } }, [a._v("取消")]), e("el-button", { attrs: { type: "primary" }, on: { click: o.onUploadImageConfirm } }, [a._v("确定")])], 1)], 1), e("el-dialog", { staticClass: "tinymce-editor-dialog tinymce-editor-upload-audio-dialog", attrs: { visible: o.uploadAudio.dialogVisible, title: "插入音频", "append-to-body": !0, "close-on-click-modal": !1, "destroy-on-close": "" }, on: { close: o.onUploadAudioClose } }, [e("el-form", { ref: "uploadAudioFormRef", staticClass: "uploadAudioForm", attrs: { model: o.uploadAudio.formData, "label-width": "auto" } }, [e("el-form-item", { attrs: { label: "名称", prop: "name", rules: { required: !0, message: "必填项" } } }, [e("el-input", { attrs: { maxlength: "14", "show-word-limit": "", placeholder: "请输入" }, model: { value: o.uploadAudio.formData.name, callback: function(t) {
9
+ a.$set(o.uploadAudio.formData, "name", t);
10
+ }, expression: "uploadAudio.formData.name" } })], 1), e("el-form-item", { attrs: { label: "封面", prop: "cover", rules: { required: !0, message: "必填项" } } }, [e(o.ImgPond, a._b({ ref: "audioImageImgPondRef", attrs: { valueType: "array", accept: o.imgPondAccept, size: o.mergeImageUploadOptions.maxSize, count: 1, upload: o.onImageUploadUpload }, model: { value: o.uploadAudio.formData.cover, callback: function(t) {
11
+ a.$set(o.uploadAudio.formData, "cover", t);
12
+ }, expression: "uploadAudio.formData.cover" } }, "ImgPond", o.mergeImgPondOptions, !1))], 1), e("el-form-item", { attrs: { label: "音频", prop: "file", rules: { required: !0, message: "必填项" } } }, [e("el-upload", { class: ["upload", { "upload-hide": o.uploadAudio.formData.file.length >= 1 }], attrs: { name: "file", "file-list": o.uploadAudio.formData.file, action: ((s = o.mergeAudioUploadOptions) == null ? void 0 : s.action) || "", data: o.getUploadAudioData(), accept: "audio/*", "list-type": "headTextContent", "before-upload": o.onUploadAudioBeforeUpload, headers: o.getUploadAudioHeaders(), "on-remove": o.onUploadAudioRemove, "on-success": o.onUploadAudioSuccess, "on-error": o.onUploadAudioError, limit: 1 } }, [e("el-button", { attrs: { size: "small", type: "primary" } }, [a._v("上传文件"), e("i", { staticClass: "el-icon-upload el-icon--right" })]), e("div", { staticClass: "el-upload__tip", attrs: { slot: "tip" }, slot: "tip" }, [a._v("支持音频格式:" + a._s((d = (u = o.mergeAudioUploadOptions) == null ? void 0 : u.allowedType) == null ? void 0 : d.map((t) => t.toUpperCase()).join("、")))])], 1)], 1)], 1), e("div", { attrs: { slot: "footer" }, slot: "footer" }, [e("el-button", { on: { click: o.onUploadAudioClose } }, [a._v("取消")]), e("el-button", { attrs: { type: "primary" }, on: { click: o.onUploadAudioConfirm } }, [a._v("确定")])], 1)], 1), e("el-dialog", { staticClass: "tinymce-editor-dialog tinymce-editor-upload-video-dialog", attrs: { visible: o.uploadVideo.dialogVisible, title: "插入视频", "append-to-body": !0, "close-on-click-modal": !1, "destroy-on-close": "" }, on: { close: o.onUploadVideoClose } }, [e("el-form", { ref: "uploadVideoFormRef", staticClass: "uploadVideoForm", attrs: { model: o.uploadVideo.formData, "label-width": "auto" } }, [e("el-form-item", { attrs: { label: "视频", prop: "file", rules: { required: !0, message: "必填项" } } }, [e("el-upload", { class: ["upload", { "upload-hide": o.uploadVideo.formData.file.length >= 1 }], attrs: { name: "file", "file-list": o.uploadVideo.formData.file, action: o.mergeVideoUploadOptions.action || "", data: o.getUploadVideoData(), accept: "video/*", "list-type": "headTextContent", "before-upload": o.onUploadVideoBeforeUpload, headers: o.getUploadVideoHeaders(), "on-remove": o.onUploadVideoRemove, "on-success": o.onUploadVideoSuccess, "on-error": o.onUploadVideoError, limit: 1 } }, [e("el-button", { attrs: { size: "small", type: "primary" } }, [a._v("上传文件"), e("i", { staticClass: "el-icon-upload el-icon--right" })]), e("div", { staticClass: "el-upload__tip", attrs: { slot: "tip" }, slot: "tip" }, [a._v("支持视频格式:" + a._s((p = (r = o.mergeVideoUploadOptions) == null ? void 0 : r.allowedType) == null ? void 0 : p.map((t) => t.toUpperCase()).join("、")))])], 1)], 1)], 1), e("div", { attrs: { slot: "footer" }, slot: "footer" }, [e("el-button", { on: { click: o.onUploadVideoClose } }, [a._v("取消")]), e("el-button", { attrs: { type: "primary" }, on: { click: o.onUploadVideoConfirm } }, [a._v("确定")])], 1)], 1), e("el-dialog", { staticClass: "tinymce-editor-loading-dialog", attrs: { fullscreen: "", visible: o.uploadLoadingConfig.show, "show-close": !1, "close-on-press-escape": !1, "close-on-click-modal": !1, "destroy-on-close": "" }, on: { "update:visible": function(t) {
13
+ return a.$set(o.uploadLoadingConfig, "show", t);
14
+ } } }, [e("div", { staticClass: "tinymce-editor-loading-dialog-content" }, [e("div", { staticClass: "tinymce-editor-spinner" }, [e("div", { staticClass: "tinymce-editor-spinner-dot1" }), e("div", { staticClass: "tinymce-editor-spinner-dot2" }), e("div", { staticClass: "tinymce-editor-spinner-dot3" })]), e("span", [a._v(a._s(o.uploadLoadingConfig.text))])])])], 1);
15
+ }, g = [], f = /* @__PURE__ */ m(
16
+ n,
17
+ c,
18
+ g
18
19
  );
19
- const F = n.exports;
20
+ const _ = f.exports;
20
21
  export {
21
- F as default
22
+ _ as default
22
23
  };