pxx-vue-quill 1.0.17 → 1.0.18
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/vue-quill.cjs.js +221 -50
- package/dist/vue-quill.cjs.prod.js +2 -2
- package/dist/vue-quill.esm-browser.js +408 -237
- package/dist/vue-quill.esm-browser.prod.js +2 -2
- package/dist/vue-quill.esm-bundler.js +222 -51
- package/dist/vue-quill.esm-bundler.prod.js +2 -2
- package/dist/vue-quill.global.js +491 -320
- package/dist/vue-quill.global.prod.js +2 -2
- package/dist/vue-quill.snow.css +49 -8
- package/dist/vue-quill.snow.prod.css +1 -1
- package/package.json +1 -1
|
@@ -7,31 +7,160 @@
|
|
|
7
7
|
*
|
|
8
8
|
* Copyright (c) 2025 Pxx-Team
|
|
9
9
|
* Released under the MIT license
|
|
10
|
-
* Date: 2025-08-
|
|
10
|
+
* Date: 2025-08-26T02:18:21.558Z
|
|
11
11
|
*/
|
|
12
12
|
import Quill from 'quill';
|
|
13
13
|
export { default as Quill } from 'quill';
|
|
14
14
|
import Delta from 'quill-delta';
|
|
15
15
|
export { default as Delta } from 'quill-delta';
|
|
16
|
-
import { defineComponent, onMounted, onBeforeUnmount, ref, computed, watch, nextTick
|
|
16
|
+
import { defineComponent, h, onMounted, onBeforeUnmount, ref, computed, watch, nextTick } from 'vue';
|
|
17
17
|
import BlotFormatter from 'quill-blot-formatter';
|
|
18
18
|
|
|
19
19
|
const toolbarOptions = {
|
|
20
|
+
// 完整的工具栏
|
|
20
21
|
full: [
|
|
21
|
-
// ['bold', 'italic', 'underline', 'strike'], // toggled buttons
|
|
22
22
|
['bold', 'italic', 'underline'],
|
|
23
|
+
[{ color: [] }],
|
|
24
|
+
['link'],
|
|
23
25
|
[{ list: 'ordered' }, { list: 'bullet' }],
|
|
24
|
-
// [{ direction: 'rtl' }], // text direction
|
|
25
|
-
// [{ size: ['small', false, 'large', 'huge'] }], // custom dropdown
|
|
26
|
-
// [{ header: [1, 2, 3, 4, 5, 6, false] }],
|
|
27
|
-
[{ color: [] }, { background: [] }],
|
|
28
|
-
// [{ font: [] }],
|
|
29
|
-
// [{ align: [] }],
|
|
30
26
|
['image'],
|
|
31
|
-
|
|
27
|
+
['undo', 'redo'],
|
|
28
|
+
['math'],
|
|
29
|
+
['ocr'],
|
|
32
30
|
],
|
|
31
|
+
// 如果编辑器宽度不够，就显示短的工具栏
|
|
32
|
+
short: [
|
|
33
|
+
['bold', 'italic', 'underline'],
|
|
34
|
+
[{ color: [] }],
|
|
35
|
+
['link'],
|
|
36
|
+
['more']
|
|
37
|
+
],
|
|
38
|
+
// 点击更多显示的第二栏工具
|
|
39
|
+
extend: [
|
|
40
|
+
[{ list: 'ordered' }, { list: 'bullet' }],
|
|
41
|
+
['image'],
|
|
42
|
+
['undo', 'redo'],
|
|
43
|
+
['math'],
|
|
44
|
+
]
|
|
33
45
|
};
|
|
34
46
|
|
|
47
|
+
// 加粗
|
|
48
|
+
const boldSVG = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="18" height="18" viewBox="0 0 18 18"><g><g style="opacity:0;"><rect x="0" y="0" width="18" height="18" rx="0" fill="#FFFFFF" fill-opacity="1"/></g><g><path d="M6.794999938146972,7.7800002288818355L9.045000038146974,7.7800002288818355Q9.855000038146972,7.7800002288818355,10.230000038146972,7.442500128881836Q10.605000038146972,7.105000028881836,10.605000038146972,6.505000128881836Q10.605000038146972,6.114999728881836,10.440000038146973,5.860000628881836Q10.275000138146972,5.6050005288818365,9.929999838146973,5.470000228881836Q9.585000038146973,5.335000028881836,9.045000038146974,5.335000028881836L7.139999938146973,5.335000028881836L7.139999938146973,3.385000228881836L9.045000038146974,3.385000228881836Q10.034999838146973,3.385000228881836,10.852499938146973,3.797500608881836Q11.670000038146974,4.2100000388818355,12.142499938146972,4.922500628881836Q12.614999738146974,5.635000228881836,12.614999738146974,6.505000128881836Q12.614999738146974,7.375000028881836,12.142499938146972,8.042500028881836Q11.670000038146974,8.710000028881836,10.860000138146972,9.070000128881837Q10.050000238146973,9.430000328881835,9.045000038146974,9.430000328881835L6.794999938146972,9.430000328881835L6.794999938146972,7.7800002288818355ZM7.139999938146973,12.550000228881835L9.329999938146972,12.550000228881835Q9.900000138146972,12.550000228881835,10.327499838146974,12.354999528881836Q10.755000138146972,12.159999828881835,10.987500238146973,11.807499928881835Q11.219999838146972,11.454999928881836,11.219999838146972,11.020000428881836Q11.219999838146972,10.600000428881836,10.987500238146973,10.232500028881836Q10.755000138146972,9.864999728881836,10.327499838146974,9.647500028881836Q9.900000138146972,9.430000328881835,9.329999938146972,9.430000328881835L6.975000038146972,9.430000328881835L6.975000038146972,7.7800002288818355L9.329999938146972,7.7800002288818355Q10.349999938146972,7.7800002288818355,11.250000038146972,8.200000328881835Q12.149999638146973,8.620000328881837,12.690000538146972,9.362500228881835Q13.229999538146973,10.104999528881836,13.229999538146973,11.034999828881837Q13.229999538146973,11.949999828881836,12.690000538146972,12.752500528881836Q12.149999638146973,13.555000228881836,11.250000038146972,14.027500228881836Q10.349999938146972,14.500000228881836,9.329999938146972,14.500000228881836L7.139999938146973,14.500000228881836L7.139999938146973,12.550000228881835ZM7.064999938146973,14.500000228881836Q6.284999968146972,14.500000228881836,5.872500058146973,14.095000228881837Q5.460000038146973,13.689999228881836,5.460000038146973,12.895000428881836L5.460000038146973,4.989999728881836Q5.460000038146973,4.195000648881836,5.872500058146973,3.789999958881836Q6.284999968146972,3.385000228881836,7.064999938146973,3.385000228881836L7.469999838146973,3.385000228881836L7.469999838146973,14.500000228881836L7.064999938146973,14.500000228881836Z" fill="#555555" fill-opacity="1"/></g></g></svg>`;
|
|
49
|
+
// 斜体
|
|
50
|
+
const italicSVG = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="18" height="18" viewBox="0 0 18 18"><g><g style="opacity:0;"><rect x="0" y="0" width="18" height="18" rx="0" fill="#FFFFFF" fill-opacity="1"/></g><g><path d="M8,3Q7.9015086,3,7.8049095,3.019214718Q7.7083106,3.038429435,7.6173165,3.076120459Q7.5263224,3.11381148,7.4444296,3.16853037Q7.3625371,3.2232492600000002,7.2928932,3.2928932Q7.2232492,3.36253715,7.1685302,3.4444297600000002Q7.1138113999999995,3.52632231,7.0761204,3.61731648Q7.0384293,3.70831072,7.0192146,3.80490965Q6.99999994,3.90150857,7,4Q6.99999994,4.0984913,7.0192146,4.1950902Q7.0384293,4.291689,7.0761204,4.3826833Q7.1138113999999995,4.4736774,7.1685302,4.5555699Q7.2232492,4.6374626,7.2928932,4.7071065999999995Q7.3625371,4.7767504,7.4444296,4.8314693Q7.5263224,4.8861883,7.6173165,4.9238794Q7.7083106,4.9615704,7.8049096,4.9807851Q7.9015086,4.9999999,8,5L9.137146,5L8,13L7,13Q6.90150857,13,6.80490965,13.019215Q6.70831072,13.038429,6.6173164799999995,13.07612Q6.52632231,13.113811,6.44442973,13.16853Q6.36253715,13.223249,6.2928932,13.292892Q6.22324926,13.362536,6.16853037,13.444429Q6.11381148,13.526321,6.076120459,13.617315Q6.038429435,13.708309,6.019214718,13.804909Q6,13.901508,6,14Q6,14.098491,6.019214718,14.195089Q6.038429435,14.291689,6.076120459,14.382683Q6.11381148,14.473677,6.16853037,14.555569Q6.22324926,14.637462,6.2928932,14.707106Q6.36253715,14.77675,6.44442976,14.831469Q6.52632231,14.886187,6.6173164799999995,14.923878Q6.70831072,14.961569,6.80490965,14.980784Q6.90150857,15,7,15L11,15Q11.0984912,15,11.1950898,14.980784Q11.2916889,14.961569,11.382682800000001,14.923878Q11.473677200000001,14.886187,11.5555696,14.831469Q11.6374626,14.77675,11.7071066,14.707106Q11.7767506,14.637462,11.8314691,14.555569Q11.8861876,14.473677,11.9238791,14.382683Q11.9615698,14.291689,11.9807849,14.195089Q12,14.098491,12,14Q12,13.901508,11.9807849,13.804909Q11.9615698,13.708309,11.9238791,13.617315Q11.8861876,13.526321,11.8314691,13.444428Q11.7767506,13.362536,11.7071066,13.292892Q11.6374626,13.223249,11.5555701,13.16853Q11.473677200000001,13.113811,11.382682800000001,13.07612Q11.2916889,13.038429,11.1950903,13.019215Q11.0984912,13,11,13L9.8626451,13L11,5L12,5Q12.0984907,4.9999999,12.1950893,4.9807851Q12.2916884,4.9615703,12.382682800000001,4.9238793Q12.4736767,4.8861883,12.5555696,4.8314693Q12.6374621,4.7767504,12.7071061,4.7071065999999995Q12.776750100000001,4.6374626,12.831468600000001,4.5555699Q12.8861876,4.4736774,12.9238787,4.3826833Q12.9615698,4.291689,12.9807849,4.1950902Q12.999999500000001,4.0984913,13,4Q12.999999500000001,3.90150857,12.980784400000001,3.80490965Q12.9615698,3.70831072,12.9238787,3.61731648Q12.8861876,3.52632231,12.8314691,3.44442973Q12.7767506,3.36253715,12.7071066,3.2928932Q12.6374626,3.2232492600000002,12.5555696,3.16853037Q12.4736767,3.11381148,12.382682800000001,3.076120459Q12.2916884,3.038429435,12.1950898,3.019214718Q12.0984907,3,12,3L8,3Z" fill-rule="evenodd" fill="#555555" fill-opacity="1"/></g></g></svg>`;
|
|
51
|
+
// 下划线
|
|
52
|
+
const underlineSVG = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="18" height="18" viewBox="0 0 18 18"><g><g style="opacity:0;"><rect x="0" y="0" width="18" height="18" rx="0" fill="#FFFFFF" fill-opacity="1"/></g><g><path d="M5.000117301940918,14.500022450683593L5.000117301940918,14.500022450683593Q5.000117301940918,14.450777450683594,5.009724660740918,14.402477450683593Q5.019332019940918,14.354177450683594,5.038177530940918,14.308679450683593Q5.057023040940918,14.263182450683594,5.084382488940918,14.222236450683594Q5.111741931940918,14.181290450683594,5.146563901940918,14.146469450683593Q5.181385871940918,14.111646450683594,5.222332181940918,14.084286450683594Q5.263278451940918,14.056927450683594,5.308775541940918,14.038082450683595Q5.354272661940918,14.019237450683594,5.402572121940918,14.009630450683593Q5.450871581940918,14.000022450683593,5.500117301940918,14.000022450683593L12.500117301940918,14.000022450683593Q12.549362201940918,14.000022450683593,12.597661501940918,14.009629450683594Q12.645960801940918,14.019237450683594,12.691457701940918,14.038082450683595Q12.736954701940917,14.056926450683594,12.777901601940918,14.084285450683593Q12.818847701940918,14.111645450683593,12.853670101940917,14.146468450683594Q12.888492101940919,14.181289450683593,12.915851601940918,14.222235450683593Q12.943210601940919,14.263181450683593,12.962056201940918,14.308679450683593Q12.980901701940919,14.354177450683594,12.990509501940917,14.402477450683593Q13.00011680194092,14.450777450683594,13.000117301940918,14.500022450683593L13.000117301940918,14.500022450683593Q13.00011680194092,14.549268450683593,12.990509001940918,14.597566450683594Q12.980901701940919,14.645866450683593,12.962056201940918,14.691363450683594Q12.943210601940919,14.736860450683594,12.915851601940918,14.777807450683595Q12.888492101940919,14.818753450683595,12.853670101940917,14.853575450683593Q12.818847701940918,14.888397450683593,12.777901601940918,14.915756450683594Q12.736954701940917,14.943115450683594,12.691457701940918,14.961960450683593Q12.645960801940918,14.980806450683593,12.597661501940918,14.990413450683594Q12.549362201940918,15.000021450683594,12.500117301940918,15.000022450683593L5.500117301940918,15.000022450683593Q5.450871581940918,15.000021450683594,5.402572121940918,14.990414450683593Q5.354272661940918,14.980806450683593,5.308775541940918,14.961960450683593Q5.263278451940918,14.943115450683594,5.222332161940918,14.915756450683594Q5.181385871940918,14.888397450683593,5.146563901940918,14.853574450683594Q5.111741931940918,14.818752450683593,5.084382488940918,14.777806450683594Q5.057023040940918,14.736860450683594,5.038177530940918,14.691363450683594Q5.019332019940918,14.645866450683593,5.009724660740918,14.597567450683593Q5.000117301940918,14.549268450683593,5.000117301940918,14.500022450683593ZM5.045039176940918,3.548906330683594Q5.045039176940918,3.1015625006835936,5.283039211940918,2.8637809706835937Q5.521039131940918,2.6259994506835938,5.969039081940918,2.6259994506835938L5.997039201940918,2.6259994506835938Q6.445039201940918,2.6259994506835938,6.6830393019409176,2.8637809706835937Q6.921039201940918,3.1015625006835936,6.921039201940918,3.548906330683594L6.921039201940918,9.010000250683593Q6.921039201940918,9.737999950683594,7.180039401940919,10.255999550683594Q7.439039201940918,10.774000150683595,7.908039101940918,11.053999950683593Q8.377039001940918,11.333999650683594,8.993039101940917,11.333999650683594Q9.609039301940918,11.333999650683594,10.085039101940918,11.060999850683594Q10.561039401940917,10.788000150683594,10.820039301940918,10.263000450683593Q11.079039101940918,9.737999950683594,11.079039101940918,9.010000250683593L11.079039101940918,3.548906330683594Q11.079039101940918,3.1015625006835936,11.317039501940918,2.8637809706835937Q11.555039401940917,2.6259994506835938,12.003039401940917,2.6259994506835938L12.031039201940917,2.6259994506835938Q12.479039201940918,2.6259994506835938,12.717039101940918,2.8637809706835937Q12.955039001940918,3.1015625006835936,12.955039001940918,3.548906330683594L12.955039001940918,9.010000250683593Q12.955039001940918,10.144000050683594,12.416039501940919,11.095999750683594Q11.877039901940918,12.048000350683594,10.967039101940918,12.600999850683595Q10.057039301940918,13.154000450683593,8.993039101940917,13.154000450683593Q7.929039001940918,13.154000450683593,7.0190392019409185,12.600999850683595Q6.109039201940918,12.048000350683594,5.577039361940918,11.095999750683594Q5.045039176940918,10.144000050683594,5.045039176940918,9.010000250683593L5.045039176940918,3.548906330683594Z" fill="#555555" fill-opacity="1"/></g></g></svg>`;
|
|
53
|
+
// 更多
|
|
54
|
+
const moreSVG = `<svg t="1756109058354" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11458" width="18" height="18"><path d="M512 320q-3.150769 0-6.301538-0.315077-3.111385-0.315077-6.183385-0.905846-3.072-0.630154-6.104615-1.536-2.993231-0.905846-5.907693-2.126769-2.914462-1.181538-5.671384-2.678154-2.756923-1.496615-5.395693-3.229539-2.599385-1.732923-5.04123-3.741538-2.441846-1.969231-4.647385-4.214154-2.244923-2.205538-4.214154-4.647385-1.969231-2.441846-3.741538-5.04123-1.732923-2.638769-3.229539-5.395693-1.496615-2.756923-2.678154-5.671384-1.181538-2.914462-2.126769-5.907693-0.905846-3.032615-1.536-6.104615-0.590769-3.072-0.905846-6.222769T448 256q0-3.150769 0.315077-6.301538 0.315077-3.111385 0.905846-6.183385 0.630154-3.072 1.536-6.104615 0.905846-2.993231 2.126769-5.907693 1.181538-2.914462 2.678154-5.671384 1.496615-2.756923 3.229539-5.395693 1.732923-2.599385 3.741538-5.04123 1.969231-2.441846 4.214154-4.647385 2.205538-2.205538 4.647385-4.214154 2.441846-1.969231 5.04123-3.741538 2.638769-1.732923 5.395693-3.229539 2.756923-1.496615 5.671384-2.678154 2.914462-1.181538 5.907693-2.126769 3.032615-0.905846 6.104615-1.536 3.072-0.590769 6.222769-0.905846T512 192q3.150769 0 6.301538 0.315077 3.111385 0.315077 6.183385 0.905846 3.072 0.630154 6.104615 1.536 2.993231 0.905846 5.907693 2.126769 2.914462 1.181538 5.671384 2.678154 2.756923 1.496615 5.395693 3.229539 2.599385 1.732923 5.04123 3.741538 2.441846 1.969231 4.647385 4.214154 2.205538 2.205538 4.214154 4.647385 1.969231 2.441846 3.741538 5.04123 1.732923 2.638769 3.229539 5.395693 1.496615 2.756923 2.678154 5.671384 1.181538 2.914462 2.126769 5.907693 0.905846 3.032615 1.536 6.104615 0.590769 3.072 0.905846 6.222769t0.315077 6.262154q0 3.150769-0.315077 6.301538-0.315077 3.111385-0.905846 6.183385-0.630154 3.072-1.536 6.104615-0.905846 2.993231-2.126769 5.907693-1.181538 2.914462-2.678154 5.671384-1.496615 2.756923-3.229539 5.395693-1.732923 2.599385-3.741538 5.04123-1.969231 2.441846-4.214154 4.647385-2.205538 2.244923-4.647385 4.214154-2.441846 1.969231-5.04123 3.741538-2.638769 1.732923-5.395693 3.229539-2.756923 1.496615-5.671384 2.678154-2.914462 1.181538-5.907693 2.126769-3.032615 0.905846-6.104615 1.536-3.072 0.590769-6.222769 0.905846T512 320z m0 256q-3.150769 0-6.301538-0.315077-3.111385-0.315077-6.183385-0.905846-3.072-0.630154-6.104615-1.536-2.993231-0.905846-5.907693-2.126769-2.914462-1.181538-5.671384-2.678154-2.756923-1.496615-5.395693-3.229539-2.599385-1.732923-5.04123-3.741538-2.441846-1.969231-4.647385-4.214154-2.244923-2.205538-4.214154-4.647385-1.969231-2.441846-3.741538-5.04123-1.732923-2.638769-3.229539-5.395693-1.496615-2.756923-2.678154-5.671384-1.181538-2.914462-2.126769-5.907693-0.905846-3.032615-1.536-6.104615-0.590769-3.072-0.905846-6.222769T448 512q0-3.150769 0.315077-6.301538 0.315077-3.111385 0.905846-6.183385 0.630154-3.072 1.536-6.104615 0.905846-2.993231 2.126769-5.907693 1.181538-2.914462 2.678154-5.671384 1.496615-2.756923 3.229539-5.395693 1.732923-2.599385 3.741538-5.04123 1.969231-2.441846 4.214154-4.647385 2.205538-2.244923 4.647385-4.214154 2.441846-1.969231 5.04123-3.741538 2.638769-1.732923 5.395693-3.229539 2.756923-1.496615 5.671384-2.678154 2.914462-1.181538 5.907693-2.126769 3.032615-0.905846 6.104615-1.536 3.072-0.590769 6.222769-0.905846T512 448q3.150769 0 6.301538 0.315077 3.111385 0.315077 6.183385 0.905846 3.072 0.630154 6.104615 1.536 2.993231 0.905846 5.907693 2.126769 2.914462 1.181538 5.671384 2.678154 2.756923 1.496615 5.395693 3.229539 2.599385 1.732923 5.04123 3.741538 2.441846 1.969231 4.647385 4.214154 2.205538 2.205538 4.214154 4.647385 1.969231 2.441846 3.741538 5.04123 1.732923 2.638769 3.229539 5.395693 1.496615 2.756923 2.678154 5.671384 1.181538 2.914462 2.126769 5.907693 0.905846 3.032615 1.536 6.104615 0.590769 3.072 0.905846 6.222769t0.315077 6.262154q0 3.150769-0.315077 6.301538-0.315077 3.111385-0.905846 6.183385-0.630154 3.072-1.536 6.104615-0.905846 2.993231-2.126769 5.907693-1.181538 2.914462-2.678154 5.671384-1.496615 2.756923-3.229539 5.395693-1.732923 2.599385-3.741538 5.04123-1.969231 2.441846-4.214154 4.647385-2.205538 2.244923-4.647385 4.214154-2.441846 1.969231-5.04123 3.741538-2.638769 1.732923-5.395693 3.229539-2.756923 1.496615-5.671384 2.678154-2.914462 1.181538-5.907693 2.126769-3.032615 0.905846-6.104615 1.536-3.072 0.590769-6.222769 0.905846T512 576z m0 256q-3.150769 0-6.301538-0.315077-3.111385-0.315077-6.183385-0.905846-3.072-0.630154-6.104615-1.536-2.993231-0.905846-5.907693-2.126769-2.914462-1.181538-5.671384-2.678154-2.756923-1.496615-5.395693-3.229539-2.599385-1.732923-5.04123-3.741538-2.441846-1.969231-4.647385-4.214154-2.244923-2.205538-4.214154-4.647385-1.969231-2.441846-3.741538-5.04123-1.732923-2.638769-3.229539-5.395693-1.496615-2.756923-2.678154-5.671384-1.181538-2.914462-2.126769-5.907693-0.905846-3.032615-1.536-6.104615-0.590769-3.072-0.905846-6.222769t-0.315077-6.262154q0-3.150769 0.315077-6.301538 0.315077-3.111385 0.905846-6.183385 0.630154-3.072 1.536-6.104615 0.905846-2.993231 2.126769-5.907693 1.181538-2.914462 2.678154-5.671384 1.496615-2.756923 3.229539-5.395693 1.732923-2.599385 3.741538-5.04123 1.969231-2.441846 4.214154-4.647385 2.205538-2.205538 4.647385-4.214154 2.441846-1.969231 5.04123-3.741538 2.638769-1.732923 5.395693-3.229539 2.756923-1.496615 5.671384-2.678154 2.914462-1.181538 5.907693-2.126769 3.032615-0.905846 6.104615-1.536 3.072-0.590769 6.222769-0.905846T512 704q3.150769 0 6.301538 0.315077 3.111385 0.315077 6.183385 0.905846 3.072 0.630154 6.104615 1.536 2.993231 0.905846 5.907693 2.126769 2.914462 1.181538 5.671384 2.678154 2.756923 1.496615 5.395693 3.229539 2.599385 1.732923 5.04123 3.741538 2.441846 1.969231 4.647385 4.214154 2.205538 2.205538 4.214154 4.647385 1.969231 2.441846 3.741538 5.04123 1.732923 2.638769 3.229539 5.395693 1.496615 2.756923 2.678154 5.671384 1.181538 2.914462 2.126769 5.907693 0.905846 3.032615 1.536 6.104615 0.590769 3.072 0.905846 6.222769t0.315077 6.262154q0 3.150769-0.315077 6.301538-0.315077 3.111385-0.905846 6.183385-0.630154 3.072-1.536 6.104615-0.905846 2.993231-2.126769 5.907693-1.181538 2.914462-2.678154 5.671384-1.496615 2.756923-3.229539 5.395693-1.732923 2.599385-3.741538 5.04123-1.969231 2.441846-4.214154 4.647385-2.205538 2.205538-4.647385 4.214154-2.441846 1.969231-5.04123 3.741538-2.638769 1.732923-5.395693 3.229539-2.756923 1.496615-5.671384 2.678154-2.914462 1.181538-5.907693 2.126769-3.032615 0.905846-6.104615 1.536-3.072 0.590769-6.222769 0.905846T512 832z" p-id="11459" fill="#555555"></path></svg>`;
|
|
55
|
+
// 链接
|
|
56
|
+
const linkSVG = `<svg t="1756107950494" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11245" width="18" height="18" style="padding:1px"><path d="M292.693333 564.906667L123.477333 395.648q-55.296-55.338667-54.272-134.4 1.066667-78.336 57.088-134.357333Q182.186667 70.912 260.608 69.845333q79.061333-1.066667 134.4 54.272l194.944 194.986667a40.533333 40.533333 0 0 1 0.938667 0.938667q54.4 55.04 53.333333 133.461333-1.066667 78.336-57.045333 134.357333a42.666667 42.666667 0 1 1-60.330667-60.330666q31.445333-31.488 32.042667-75.178667 0.597333-43.050667-29.269334-72.874667a44.458667 44.458667 0 0 1-0.853333-0.896l-194.133333-194.133333q-72.618667-72.618667-148.053334 2.773333-31.488 31.488-32.085333 75.178667-0.554667 43.050667 29.269333 72.874667l169.258667 169.301333a42.666667 42.666667 0 1 1-60.288 60.330667z m202.538667-69.674667a42.666667 42.666667 0 0 0-60.330667-60.373333q-55.978667 56.021333-57.045333 134.4-1.066667 79.018667 54.272 134.357333a40.362667 40.362667 0 0 0 0.981333 0.938667l1.706667 1.877333 194.986667 194.986667q55.338667 55.296 134.4 54.229333 78.336-1.066667 134.357333-57.045333 55.978667-56.021333 57.045333-134.4 1.066667-79.018667-54.272-134.357334l-169.258666-169.258666a42.666667 42.666667 0 1 0-60.373334 60.330666l169.301334 169.301334q29.866667 29.866667 29.269333 72.874666-0.597333 43.690667-32.042667 75.178667-31.488 31.445333-75.178666 32.042667-43.050667 0.597333-72.874667-29.269334l-194.986667-194.986666a39.68 39.68 0 0 0-0.981333-0.938667 43.52 43.52 0 0 0-1.749333-1.834667q-29.866667-29.866667-29.269334-72.917333 0.554667-43.690667 32.042667-75.136z" p-id="11246" fill="#555555"></path></svg>`;
|
|
57
|
+
// 撤销
|
|
58
|
+
const undoSVG = `<svg t="1756107888940" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10819" width="18" height="18"><path d="M220.086857 374.893714l102.473143 102.473143c10.605714 10.642286 28.818286 3.108571 28.818286-11.922286v-77.275428h261.851428l8.009143 0.146286c98.048 3.364571 169.216 68.754286 169.216 160.182857 0 93.952-75.044571 160.365714-177.225143 160.365714H241.883429l-3.437715 0.256a25.307429 25.307429 0 0 0 3.437715 50.395429h371.346285l8.374857-0.146286c124.708571-3.657143 219.501714-90.148571 219.501715-210.834286 0-123.392-99.035429-211.017143-227.876572-211.017143h-261.851428V260.498286a16.896 16.896 0 0 0-28.818286-11.922286L220.086857 351.049143a16.896 16.896 0 0 0 0 23.844571z" p-id="10820" fill="#555555"></path></svg>`;
|
|
59
|
+
// 重做
|
|
60
|
+
const redoSVG = `<svg t="1756107908999" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11032" width="18" height="18"><path d="M836.205714 374.893714l-102.473143 102.473143a16.896 16.896 0 0 1-28.818285-11.922286v-77.275428h-261.851429l-8.045714 0.146286c-98.011429 3.364571-169.179429 68.754286-169.179429 160.182857 0 93.952 75.044571 160.365714 177.225143 160.365714h371.346286l3.437714 0.256a25.307429 25.307429 0 0 1-3.437714 50.395429H443.062857l-8.374857-0.146286c-124.708571-3.657143-219.501714-90.148571-219.501714-210.834286 0-123.392 99.035429-211.017143 227.84-211.017143h261.888V260.498286c0-15.030857 18.176-22.564571 28.818285-11.922286l102.473143 102.473143c6.582857 6.582857 6.582857 17.261714 0 23.844571z" p-id="11033" fill="#555555"></path></svg>`;
|
|
61
|
+
// 图片识别
|
|
62
|
+
const ocrSVG = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="18" height="18" viewBox="0 0 18 18"><g><g style="opacity:0;"><rect x="0" y="0" width="18" height="18" rx="0" fill="#FFFFFF" fill-opacity="1"/></g><g><path d="M3.0000245140625,2.6000244140625L5.5000243140625,2.6000244140625C5.8313951140625,2.6000244140625,6.1000242140625,2.3313953240625,6.1000242140625,2.0000244340625C6.1000242140625,1.6686535440624999,5.8313951140625,1.4000244140625,5.5000243140625,1.4000244140625L3.0000245140625,1.4000244140625Q2.3372827740625,1.4000244140625,1.8686535940625,1.8686535940625Q1.4000244140625,2.3372827740625,1.4000244140625,3.0000245140625L1.4000244140625,5.5000243140625C1.4000244140625,5.8313951140625,1.6686535440624999,6.1000242140625,2.0000244340625,6.1000242140625C2.3313953240625,6.1000242140625,2.6000244140625,5.8313951140625,2.6000244140625,5.5000243140625L2.6000244140625,3.0000245140625Q2.6000244140625,2.6000244140625,3.0000245140625,2.6000244140625ZM12.5000244140625,1.4000244140625L15.0000244140625,1.4000244140625Q15.6627664140625,1.4000244140625,16.1313954140625,1.8686538940625Q16.6000244140625,2.3372834940625,16.6000244140625,3.0000245140625L16.6000244140625,5.5000243140625C16.6000244140625,5.6591539140625,16.5368104140625,5.8117661140625,16.424288414062502,5.9242883140625C16.3117674140625,6.0368099140625,16.1591544140625,6.1000242140625,16.0000244140625,6.1000242140625C15.6686534140625,6.1000242140625,15.4000244140625,5.8313951140625,15.4000244140625,5.5000243140625L15.4000234140625,3.0000245140625Q15.4000234140625,2.6000244140625,15.0000244140625,2.6000244140625L12.5000244140625,2.6000244140625C12.1686534140625,2.6000244140625,11.9000244140625,2.3313953240625,11.9000244140625,2.0000244340625C11.9000244140625,1.6686535440624999,12.1686534140625,1.4000244140625,12.5000244140625,1.4000244140625ZM8.6239776140625,6.4719930140625C8.5439777140625,6.1512432140625,8.3999777140625,5.7421179140625,8.2479777140625,5.4212432140625L9.4959774140625,5.052368214062501C9.6959782140625,5.4293680140625,9.9199772140625,5.9346180140625,9.9999771140625,6.2714929140625L9.3519778140625,6.4719930140625L12.7119784140625,6.4719930140625L12.7119784140625,7.6079931140625L11.5039774140625,7.6079931140625C11.1279774140625,8.6968679140625,10.6159782140625,9.6014929140625,9.9599781140625,10.3461180140625C10.7599773140625,10.9224930140625,11.7279774140625,11.3468685140625,12.8879774140625,11.6029934140625C12.6239774140625,11.8592434140625,12.2799774140625,12.3716184140625,12.1039784140625,12.6918684140625C10.8719778140625,12.3716184140625,9.8719778140625,11.8752434140625,9.0479779140625,11.2107429140625C8.175977714062501,11.8992434140625,7.1199779140625,12.4036184140625,5.8559775140625,12.7558684140625C5.7279777140625,12.4757434140625,5.3759775140625,11.9312434140625,5.1519775140625,11.6591184140625C6.3759775140625,11.3868685140625,7.3839779140625,10.9706182140625,8.1839781140625,10.3781185140625C7.5199776140625,9.6094932140625,7.0079775140625,8.6888685140625,6.5919776140625,7.6079931140625L5.3279776140625,7.6079931140625L5.3279776140625,6.4719930140625L8.6239776140625,6.4719930140625ZM7.7999778140625,7.6079931140625C8.1119776140625,8.344617814062499,8.5359778140625,9.0011186140625,9.0719776140625,9.5694933140625C9.5439777140625,9.0251179140625,9.9199772140625,8.3766184140625,10.1919784140625,7.6079931140625L7.7999778140625,7.6079931140625ZM2.6000244140625,12.5000244140625L2.6000244140625,15.0000244140625Q2.6000244140625,15.4000234140625,3.0000245140625,15.4000234140625L5.5000243140625,15.4000234140625C5.8313951140625,15.4000244140625,6.1000242140625,15.6686534140625,6.1000242140625,16.0000244140625C6.1000242140625,16.3313964140625,5.8313951140625,16.6000254140625,5.5000243140625,16.6000254140625L5.4989548140625,16.6000244140625L3.0000245140625,16.6000244140625Q2.3372834940625,16.6000244140625,1.8686538940625,16.1313954140625Q1.4000244140625,15.6627664140625,1.4000244140625,15.0000244140625L1.4000244140625,12.5000244140625C1.4000244140625,12.1686534140625,1.6686535440624999,11.9000244140625,2.0000244340625,11.9000244140625C2.3313953240625,11.9000244140625,2.6000244140625,12.1686534140625,2.6000244140625,12.5000244140625ZM16.6000244140625,12.5010944140625L16.6000244140625,15.0000244140625Q16.6000244140625,15.6627654140625,16.1313954140625,16.1313954140625Q15.6627654140625,16.6000244140625,15.0000244140625,16.6000244140625L12.5000244140625,16.6000244140625C12.3408944140625,16.6000244140625,12.1882824140625,16.5368104140625,12.0757594140625,16.424288414062502C11.9632384140625,16.3117664140625,11.9000244140625,16.1591544140625,11.9000244140625,16.0000244140625C11.9000244140625,15.6686534140625,12.1686534140625,15.4000244140625,12.5000244140625,15.4000244140625L15.0000244140625,15.4000234140625Q15.4000234140625,15.4000234140625,15.4000234140625,15.0000244140625L15.4000234140625,12.5000244140625C15.4000244140625,12.1686534140625,15.6686534140625,11.9000244140625,16.0000244140625,11.9000244140625C16.3313964140625,11.9000244140625,16.6000254140625,12.1686534140625,16.6000254140625,12.5000244140625L16.6000244140625,12.5010944140625Z" fill-rule="evenodd" fill="#555555" fill-opacity="1"/></g></g></svg>`;
|
|
63
|
+
// 数学公式
|
|
64
|
+
const mathSVG = `<svg t="1756107836493" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10608" width="18" height="18"><path d="M877.454222 856.177778q4.835556-4.835556 7.395556-11.093334 2.616889-6.257778 2.616889-13.084444 0-3.413333-0.625778-6.656-0.682667-3.299556-1.991111-6.428444-1.251556-3.072-3.128889-5.859556-1.877333-2.844444-4.266667-5.176889-2.332444-2.389333-5.12-4.266667-2.844444-1.877333-5.916444-3.128888-3.128889-1.308444-6.428445-1.934223-3.299556-0.682667-6.656-0.682666-6.826667 0-13.084444 2.616889-6.257778 2.56-11.036445 7.395555l-54.044444 53.987556H253.155556l325.688888-325.745778q2.389333-2.389333 4.266667-5.12 1.877333-2.844444 3.128889-5.916445 1.308444-3.128889 1.934222-6.428444 0.682667-3.299556 0.682667-6.656 0-3.413333-0.682667-6.656-0.625778-3.299556-1.934222-6.428444-1.251556-3.072-3.128889-5.859556-1.877333-2.844444-4.266667-5.176889L253.155556 162.133333h522.126222l53.930666 53.987556q4.835556 4.835556 11.093334 7.395555 6.257778 2.616889 13.084444 2.616889 3.413333 0 6.656-0.682666 3.299556-0.625778 6.428445-1.934223 3.072-1.251556 5.859555-3.128888 2.844444-1.877333 5.176889-4.266667 2.389333-2.389333 4.266667-5.12 1.877333-2.844444 3.128889-5.916445 1.308444-3.128889 1.934222-6.428444 0.682667-3.299556 0.682667-6.656 0-6.826667-2.616889-13.084444-2.56-6.257778-7.395556-11.036445l-64-64q-4.778667-4.835556-11.036444-7.395555-6.257778-2.616889-13.084445-2.616889H170.666667q-6.826667 0-13.084445 2.616889-6.257778 2.56-11.036444 7.395555-2.389333 2.389333-4.266667 5.12-1.877333 2.844444-3.128889 5.916445-1.308444 3.128889-1.934222 6.428444-0.682667 3.299556-0.682667 6.656 0 3.413333 0.682667 6.656 0.625778 3.299556 1.934222 6.428444 1.251556 3.072 3.128889 5.859556 1.877333 2.844444 4.266667 5.176889L506.311111 512l-359.822222 359.879111q-4.835556 4.778667-7.395556 11.036445-2.616889 6.257778-2.616889 13.084444 0 3.413333 0.682667 6.656 0.625778 3.299556 1.934222 6.428444 1.251556 3.072 3.128889 5.859556 1.877333 2.844444 4.266667 5.176889 2.389333 2.389333 5.12 4.266667 2.844444 1.877333 5.916444 3.128888 3.128889 1.308444 6.428445 1.991112 3.299556 0.625778 6.656 0.625777h618.666666q6.826667 0 13.084445-2.616889 6.257778-2.56 11.036444-7.395555l64-63.943111z" p-id="10609" fill="#555555"></path></svg>`;
|
|
65
|
+
// 无序列表
|
|
66
|
+
const listBulletSVG = `<svg viewbox="0 0 18 18"><line class="ql-stroke" x1="6" x2="15" y1="4" y2="4"/><line class="ql-stroke" x1="6" x2="15" y1="9" y2="9"/><line class="ql-stroke" x1="6" x2="15" y1="14" y2="14"/><line class="ql-stroke" x1="3" x2="3" y1="4" y2="4"/><line class="ql-stroke" x1="3" x2="3" y1="9" y2="9"/><line class="ql-stroke" x1="3" x2="3" y1="14" y2="14"/></svg>`;
|
|
67
|
+
// 有序列表
|
|
68
|
+
const listOrderedSVG = `<svg viewbox="0 0 18 18"><line class="ql-stroke" x1="7" x2="15" y1="4" y2="4"/><line class="ql-stroke" x1="7" x2="15" y1="9" y2="9"/><line class="ql-stroke" x1="7" x2="15" y1="14" y2="14"/><line class="ql-stroke ql-thin" x1="2.5" x2="4.5" y1="5.5" y2="5.5"/><path class="ql-fill" d="M3.5,6A0.5,0.5,0,0,1,3,5.5V3.085l-0.276.138A0.5,0.5,0,0,1,2.053,3c-0.124-.247-0.023-0.324.224-0.447l1-.5A0.5,0.5,0,0,1,4,2.5v3A0.5,0.5,0,0,1,3.5,6Z"/><path class="ql-stroke ql-thin" d="M4.5,10.5h-2c0-.234,1.85-1.076,1.85-2.234A0.959,0.959,0,0,0,2.5,8.156"/><path class="ql-stroke ql-thin" d="M2.5,14.846a0.959,0.959,0,0,0,1.85-.109A0.7,0.7,0,0,0,3.75,14a0.688,0.688,0,0,0,.6-0.736,0.959,0.959,0,0,0-1.85-.109"/></svg>`;
|
|
69
|
+
// 图片
|
|
70
|
+
const imageSVG = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="18" height="18" viewBox="0 0 18 18"><g><g style="opacity:0;"><rect x="0" y="0" width="18" height="18" rx="0" fill="#FFFFFF" fill-opacity="1"/></g><g><path d="M1.87471507,3.83578219Q1.5,4.18540478,1.5,4.6875L1.5,14.312503Q1.50000006,14.814598,1.874716,15.16422Q2.23459671,15.5,2.73684216,15.5L15.263157,15.5Q15.765403,15.5,16.125284,15.164218Q16.499999000000003,14.814597,16.499999000000003,14.312501L16.499999000000003,4.6875Q16.499999000000003,4.18540342,16.125284999999998,3.83578214Q15.765404,3.5,15.263157,3.5L2.73684216,3.5Q2.23459646,3.5,1.87471507,3.83578219ZM2.5,14.312503L2.5,4.6875Q2.5,4.5,2.73684216,4.5L15.263157,4.5Q15.5,4.5,15.5,4.6875L15.5,14.312501Q15.5,14.5,15.263157,14.5L2.73684216,14.5Q2.5,14.5,2.5,14.312503Z" fill-rule="evenodd" fill="#555555" fill-opacity="1" style="mix-blend-mode:passthrough"/></g><g><ellipse cx="5.4375" cy="7.4375" rx="0.4375" ry="0.4375" fill-opacity="0" stroke-opacity="1" stroke="#555555" fill="none" stroke-width="1" stroke-linecap="ROUND" stroke-linejoin="round" style="mix-blend-mode:passthrough"/></g><g><path d="M5.9053998,9.924615948146972L1.7143693,12.841608238146973Q1.61364189,12.911715538146973,1.55682093,13.020492338146973Q1.5,13.129269138146974,1.5,13.251992238146972L1.50000003,14.418008338146972Q1.50000003,14.876594038146973,1.84130602,15.195924738146973Q2.16843581,15.501991738146973,2.62437022,15.501991738146973L15.375628,15.501991738146973Q15.831564,15.501991738146973,16.158693,15.195924738146973Q16.5,14.876594038146973,16.5,14.418007838146973L16.5,13.251992238146972Q16.500000999999997,13.186988838146974,16.48338,13.124146438146973Q16.466759,13.061303638146972,16.434621,13.004799838146972Q16.402485,12.948296338146973,16.356969,12.901887938146972Q16.311453,12.855479738146972,16.255583,12.822251838146972L9.8796926,9.030259398146972Q9.842938400000001,9.008400078146973,9.8030057,8.993099628146974Q9.763073,8.977799118146972,9.721121799999999,8.969501908146972Q9.6791716,8.961204618146972,9.6364217,8.960151608146973Q9.5936708,8.959098578146973,9.551362000000001,8.965320438146973Q9.5090542,8.971542238146972,9.4684162,8.984858218146973Q9.427778199999999,8.998174158146973,9.3899918,9.018197478146973Q9.352206200000001,9.038220708146973,9.3183689,9.064369648146972Q9.284532500000001,9.090518598146973,9.2556267,9.122033748146972L7.6887164,10.830422738146973L6.4904227,9.934544588146972Q6.4273362,9.887379288146972,6.3528042,9.861893948146973Q6.2782726,9.836408678146972,6.1995153,9.835072038146972Q6.1207581,9.833735408146973,6.045404,9.856676968146973Q5.9700503000000005,9.879618528146972,5.9053998,9.924615948146972ZM2.5,13.513173138146973L2.50000006,14.418008338146972Q2.50000006,14.501992238146972,2.62437022,14.501992238146972L15.375628,14.501992238146972Q15.5,14.501992238146972,15.5,14.418007838146973L15.5,13.536368338146973L9.7178593,10.097503488146973L8.1200023,11.839632738146973Q8.0888524,11.873595438146973,8.052019600000001,11.901292338146973Q8.0151863,11.928988938146972,7.9739118,11.949486538146973Q7.9326363,11.969984038146972,7.88831,11.982591638146973Q7.8439837,11.995199238146974,7.7980995,11.999492138146973Q7.7522154,12.003785338146972,7.7063198,11.999619238146973Q7.6604242,11.995453338146973,7.6160631,11.982968338146973Q7.571702,11.970483338146973,7.5303702,11.950099938146973Q7.4890385,11.929716538146973,7.4521289,11.902122038146972L6.1805682,10.951467238146973L2.5,13.513173138146973Z" fill-rule="evenodd" fill="#555555" fill-opacity="1" style="mix-blend-mode:passthrough"/></g></g></svg>`;
|
|
71
|
+
|
|
72
|
+
const MoreTools = defineComponent({
|
|
73
|
+
name: 'MoreTools',
|
|
74
|
+
props: {
|
|
75
|
+
// 传入toolbar的自定义style
|
|
76
|
+
toolbarStyle: {
|
|
77
|
+
type: Object,
|
|
78
|
+
required: false,
|
|
79
|
+
default: () => ({})
|
|
80
|
+
},
|
|
81
|
+
needCollapse: {
|
|
82
|
+
type: Boolean,
|
|
83
|
+
default: false
|
|
84
|
+
},
|
|
85
|
+
onToolClick: {
|
|
86
|
+
type: Function,
|
|
87
|
+
required: true
|
|
88
|
+
}
|
|
89
|
+
},
|
|
90
|
+
setup(props) {
|
|
91
|
+
// 渲染工具按钮
|
|
92
|
+
const renderToolButton = (tool) => {
|
|
93
|
+
if (typeof tool === 'string') {
|
|
94
|
+
// 根据工具名称获取对应的SVG图标
|
|
95
|
+
let iconSVG = '';
|
|
96
|
+
switch (tool) {
|
|
97
|
+
case 'image':
|
|
98
|
+
iconSVG = imageSVG;
|
|
99
|
+
break;
|
|
100
|
+
case 'undo':
|
|
101
|
+
iconSVG = undoSVG;
|
|
102
|
+
break;
|
|
103
|
+
case 'redo':
|
|
104
|
+
iconSVG = redoSVG;
|
|
105
|
+
break;
|
|
106
|
+
case 'ocr':
|
|
107
|
+
iconSVG = ocrSVG;
|
|
108
|
+
break;
|
|
109
|
+
case 'math':
|
|
110
|
+
iconSVG = mathSVG;
|
|
111
|
+
break;
|
|
112
|
+
default:
|
|
113
|
+
iconSVG = '';
|
|
114
|
+
}
|
|
115
|
+
return h('button', {
|
|
116
|
+
class: `ql-${tool}`,
|
|
117
|
+
type: 'button',
|
|
118
|
+
onClick: () => props.onToolClick(tool)
|
|
119
|
+
}, [
|
|
120
|
+
iconSVG ? h('span', { innerHTML: iconSVG }) : null
|
|
121
|
+
]);
|
|
122
|
+
}
|
|
123
|
+
else if (typeof tool === 'object' && tool !== null) {
|
|
124
|
+
const toolName = Object.keys(tool)[0];
|
|
125
|
+
const toolValue = Object.values(tool)[0];
|
|
126
|
+
let iconSVG = '';
|
|
127
|
+
if (toolName === 'list') {
|
|
128
|
+
iconSVG = toolValue === 'ordered' ? listOrderedSVG : listBulletSVG;
|
|
129
|
+
}
|
|
130
|
+
return h('button', {
|
|
131
|
+
class: `ql-${toolName}`,
|
|
132
|
+
'data-value': toolValue,
|
|
133
|
+
type: 'button',
|
|
134
|
+
onClick: () => props.onToolClick(`${toolName}-${toolValue}`)
|
|
135
|
+
}, [
|
|
136
|
+
iconSVG ? h('span', { innerHTML: iconSVG }) : null
|
|
137
|
+
]);
|
|
138
|
+
}
|
|
139
|
+
return null;
|
|
140
|
+
};
|
|
141
|
+
// 渲染工具组
|
|
142
|
+
const renderToolGroup = (tools) => {
|
|
143
|
+
return h('span', {
|
|
144
|
+
class: 'ql-formats'
|
|
145
|
+
}, tools.map(tool => renderToolButton(tool)));
|
|
146
|
+
};
|
|
147
|
+
return () => h('div', {
|
|
148
|
+
class: 'ql-toolbar ql-snow more-tools',
|
|
149
|
+
style: props.toolbarStyle
|
|
150
|
+
}, [
|
|
151
|
+
h('div', {
|
|
152
|
+
class: 'more-tools-item'
|
|
153
|
+
}, [
|
|
154
|
+
// 渲染所有工具组
|
|
155
|
+
...toolbarOptions.extend.map(toolGroup => renderToolGroup(toolGroup)),
|
|
156
|
+
]),
|
|
157
|
+
h('div', {}, [
|
|
158
|
+
renderToolGroup(['ocr'])
|
|
159
|
+
])
|
|
160
|
+
]);
|
|
161
|
+
}
|
|
162
|
+
});
|
|
163
|
+
|
|
35
164
|
const QuillEditor = defineComponent({
|
|
36
165
|
name: 'QuillEditor',
|
|
37
166
|
inheritAttrs: false,
|
|
@@ -75,12 +204,22 @@ const QuillEditor = defineComponent({
|
|
|
75
204
|
return ['fixed-top', 'embedded'].includes(value);
|
|
76
205
|
},
|
|
77
206
|
},
|
|
207
|
+
needCollapse: {
|
|
208
|
+
type: Boolean,
|
|
209
|
+
default: true,
|
|
210
|
+
},
|
|
78
211
|
// 传入toolbar的自定义style
|
|
79
212
|
toolbarStyle: {
|
|
80
213
|
type: Object,
|
|
81
214
|
required: false,
|
|
82
215
|
default: () => ({})
|
|
83
216
|
},
|
|
217
|
+
// 编辑器输入内容的自定义style
|
|
218
|
+
editorStyle: {
|
|
219
|
+
type: Object,
|
|
220
|
+
required: false,
|
|
221
|
+
default: () => ({})
|
|
222
|
+
},
|
|
84
223
|
theme: {
|
|
85
224
|
type: String,
|
|
86
225
|
default: 'snow',
|
|
@@ -142,30 +281,17 @@ const QuillEditor = defineComponent({
|
|
|
142
281
|
let quill;
|
|
143
282
|
let options;
|
|
144
283
|
const editor = ref();
|
|
284
|
+
const showMoreToolbar = ref(false);
|
|
145
285
|
const editorWrapClass = computed(() => {
|
|
146
286
|
return {
|
|
147
287
|
'quill-editor-container': true,
|
|
148
288
|
'need-border': props.needBorder,
|
|
289
|
+
'more-toolbar': showMoreToolbar.value,
|
|
149
290
|
'fixed-top': props.toolbarMode === 'fixed-top',
|
|
150
291
|
'embedded': props.toolbarMode === 'embedded',
|
|
151
292
|
};
|
|
152
293
|
});
|
|
153
|
-
//
|
|
154
|
-
const updateEditorHeight = () => {
|
|
155
|
-
if (quill && editor.value) {
|
|
156
|
-
const editorElement = editor.value.querySelector('.ql-editor');
|
|
157
|
-
if (editorElement) {
|
|
158
|
-
editorElement.style.minHeight = `${props.minHeight}px`;
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
};
|
|
162
|
-
// 监听 minHeight 变化
|
|
163
|
-
watch(() => props.minHeight, () => {
|
|
164
|
-
nextTick(() => {
|
|
165
|
-
updateEditorHeight();
|
|
166
|
-
});
|
|
167
|
-
});
|
|
168
|
-
// 应用自定义toolbar样式
|
|
294
|
+
// 应用自定义toolbar样式，目前通过改dom的形式，因为h函数没有暴露更深的dom，无法绑定真正的toolbar
|
|
169
295
|
const applyToolbarStyle = () => {
|
|
170
296
|
var _a;
|
|
171
297
|
if (quill && props.toolbarStyle) {
|
|
@@ -175,24 +301,35 @@ const QuillEditor = defineComponent({
|
|
|
175
301
|
}
|
|
176
302
|
}
|
|
177
303
|
};
|
|
304
|
+
// 应用自定义editor样式，目前通过改dom的形式，因为h函数没有暴露更深的dom，无法绑定真正的editor
|
|
305
|
+
const applyEditorStyle = () => {
|
|
306
|
+
var _a;
|
|
307
|
+
if (quill && props.editorStyle) {
|
|
308
|
+
const editorElement = (_a = editor.value) === null || _a === void 0 ? void 0 : _a.querySelector('.ql-editor');
|
|
309
|
+
if (editorElement) {
|
|
310
|
+
Object.assign(editorElement.style, props.editorStyle);
|
|
311
|
+
}
|
|
312
|
+
}
|
|
313
|
+
};
|
|
178
314
|
// 监听 toolbarStyle 变化
|
|
179
315
|
watch(() => props.toolbarStyle, () => {
|
|
180
316
|
nextTick(() => {
|
|
181
317
|
applyToolbarStyle();
|
|
182
318
|
});
|
|
183
319
|
});
|
|
184
|
-
//
|
|
320
|
+
// 监听 editorStyle 变化
|
|
321
|
+
watch(() => props.editorStyle, () => {
|
|
322
|
+
nextTick(() => {
|
|
323
|
+
applyEditorStyle();
|
|
324
|
+
});
|
|
325
|
+
});
|
|
185
326
|
const registerModule = (moduleName, module) => {
|
|
186
|
-
// For Quill 1.x, we can't check if module is already registered
|
|
187
|
-
// So we'll just register it directly
|
|
188
327
|
Quill.register(moduleName, module);
|
|
189
328
|
};
|
|
190
|
-
// Initialize Quill
|
|
191
329
|
const initialize = () => {
|
|
192
330
|
var _a, _b;
|
|
193
331
|
if (!editor.value)
|
|
194
332
|
return;
|
|
195
|
-
// Create new Quill instance
|
|
196
333
|
quill = new Quill(editor.value, options);
|
|
197
334
|
// 初始隐藏toolbar
|
|
198
335
|
const toolbar = (_a = quill === null || quill === void 0 ? void 0 : quill.getModule('toolbar')) === null || _a === void 0 ? void 0 : _a.container;
|
|
@@ -200,10 +337,17 @@ const QuillEditor = defineComponent({
|
|
|
200
337
|
toolbar.style.display = 'none';
|
|
201
338
|
}
|
|
202
339
|
const icons = Quill.import('ui/icons');
|
|
203
|
-
icons['
|
|
204
|
-
icons['
|
|
340
|
+
icons['bold'] = boldSVG;
|
|
341
|
+
icons['italic'] = italicSVG;
|
|
342
|
+
icons['underline'] = underlineSVG;
|
|
343
|
+
icons['more'] = moreSVG;
|
|
344
|
+
icons['link'] = linkSVG;
|
|
345
|
+
icons['undo'] = undoSVG;
|
|
346
|
+
icons['redo'] = redoSVG;
|
|
347
|
+
icons['ocr'] = ocrSVG;
|
|
348
|
+
icons['math'] = mathSVG;
|
|
349
|
+
icons['image'] = imageSVG;
|
|
205
350
|
options = composeOptions();
|
|
206
|
-
// Register modules
|
|
207
351
|
if (props.modules) {
|
|
208
352
|
if (Array.isArray(props.modules)) {
|
|
209
353
|
for (const module of props.modules) {
|
|
@@ -214,29 +358,23 @@ const QuillEditor = defineComponent({
|
|
|
214
358
|
registerModule(`modules/${props.modules.name}`, props.modules.module);
|
|
215
359
|
}
|
|
216
360
|
}
|
|
217
|
-
// Create new Quill instance
|
|
218
361
|
quill = new Quill(editor.value, options);
|
|
219
|
-
// Set editor content
|
|
220
362
|
setContents(props.content);
|
|
221
|
-
// Set event handlers
|
|
222
363
|
quill.on('text-change', handleTextChange);
|
|
223
364
|
quill.on('selection-change', handleSelectionChange);
|
|
224
365
|
quill.on('editor-change', handleEditorChange);
|
|
225
|
-
// Remove editor class when theme changes
|
|
226
366
|
if (props.theme !== 'bubble')
|
|
227
367
|
editor.value.classList.remove('ql-bubble');
|
|
228
368
|
if (props.theme !== 'snow')
|
|
229
369
|
editor.value.classList.remove('ql-snow');
|
|
230
|
-
// Fix clicking the quill toolbar is detected as blur event
|
|
231
370
|
(_b = quill
|
|
232
371
|
.getModule('toolbar')) === null || _b === void 0 ? void 0 : _b.container.addEventListener('mousedown', (e) => {
|
|
233
372
|
e.preventDefault();
|
|
234
373
|
});
|
|
235
|
-
// 设置初始编辑器高度
|
|
236
|
-
updateEditorHeight();
|
|
237
374
|
// 应用初始toolbar样式
|
|
238
375
|
applyToolbarStyle();
|
|
239
|
-
//
|
|
376
|
+
// 应用初始editor样式
|
|
377
|
+
applyEditorStyle();
|
|
240
378
|
ctx.emit('ready', quill);
|
|
241
379
|
};
|
|
242
380
|
// Compose Options
|
|
@@ -251,12 +389,21 @@ const QuillEditor = defineComponent({
|
|
|
251
389
|
if (props.toolbar && props.toolbar !== '') {
|
|
252
390
|
clientOptions.modules = {
|
|
253
391
|
toolbar: {
|
|
254
|
-
|
|
392
|
+
// 需要展开的话显示完整的工具栏
|
|
393
|
+
container: props.needCollapse ? [
|
|
255
394
|
...toolbarOptions.full,
|
|
256
|
-
|
|
257
|
-
|
|
395
|
+
] : [
|
|
396
|
+
...toolbarOptions.short,
|
|
258
397
|
],
|
|
259
398
|
handlers: {
|
|
399
|
+
redo: function () {
|
|
400
|
+
var _a;
|
|
401
|
+
(_a = quill === null || quill === void 0 ? void 0 : quill.getModule('history')) === null || _a === void 0 ? void 0 : _a.redo();
|
|
402
|
+
},
|
|
403
|
+
undo: function () {
|
|
404
|
+
var _a;
|
|
405
|
+
(_a = quill === null || quill === void 0 ? void 0 : quill.getModule('history')) === null || _a === void 0 ? void 0 : _a.undo();
|
|
406
|
+
},
|
|
260
407
|
ocr: function () {
|
|
261
408
|
// 按钮点击逻辑
|
|
262
409
|
ctx.emit('ocr');
|
|
@@ -265,6 +412,9 @@ const QuillEditor = defineComponent({
|
|
|
265
412
|
// 按钮点击逻辑
|
|
266
413
|
ctx.emit('math');
|
|
267
414
|
},
|
|
415
|
+
more: function () {
|
|
416
|
+
showMoreToolbar.value = !showMoreToolbar.value;
|
|
417
|
+
}
|
|
268
418
|
},
|
|
269
419
|
},
|
|
270
420
|
};
|
|
@@ -293,7 +443,6 @@ const QuillEditor = defineComponent({
|
|
|
293
443
|
const deltaHasValuesOtherThanRetain = (delta) => {
|
|
294
444
|
return Object.values(delta.ops).some((v) => !v.retain || Object.keys(v).length !== 1);
|
|
295
445
|
};
|
|
296
|
-
// Doesn't need reactivity, but does need to be cloned to avoid deep mutations always registering as equal
|
|
297
446
|
let internalModel;
|
|
298
447
|
const internalModelEquals = (against) => {
|
|
299
448
|
if (typeof internalModel === typeof against) {
|
|
@@ -326,9 +475,10 @@ const QuillEditor = defineComponent({
|
|
|
326
475
|
const toolbar = (_a = quill === null || quill === void 0 ? void 0 : quill.getModule('toolbar')) === null || _a === void 0 ? void 0 : _a.container;
|
|
327
476
|
if (toolbar) {
|
|
328
477
|
if (isEditorFocus.value) {
|
|
329
|
-
toolbar.style.display = '
|
|
478
|
+
toolbar.style.display = 'block';
|
|
330
479
|
}
|
|
331
480
|
else {
|
|
481
|
+
showMoreToolbar.value = false;
|
|
332
482
|
toolbar.style.display = 'none';
|
|
333
483
|
}
|
|
334
484
|
}
|
|
@@ -431,7 +581,6 @@ const QuillEditor = defineComponent({
|
|
|
431
581
|
watch(() => props.content, (newContent) => {
|
|
432
582
|
if (!quill || !newContent || internalModelEquals(newContent))
|
|
433
583
|
return;
|
|
434
|
-
// Restore the selection and cursor position after updating the content
|
|
435
584
|
const selection = quill.getSelection();
|
|
436
585
|
if (selection) {
|
|
437
586
|
nextTick(() => quill === null || quill === void 0 ? void 0 : quill.setSelection(selection));
|
|
@@ -457,14 +606,36 @@ const QuillEditor = defineComponent({
|
|
|
457
606
|
setText,
|
|
458
607
|
reinit,
|
|
459
608
|
editorWrapClass,
|
|
609
|
+
showMoreToolbar,
|
|
460
610
|
};
|
|
461
611
|
},
|
|
462
612
|
render() {
|
|
463
|
-
var _a, _b;
|
|
464
613
|
return [
|
|
465
614
|
h('div', { class: this.editorWrapClass }, [
|
|
466
|
-
|
|
467
|
-
|
|
615
|
+
// this.$slots.toolbar?.(), // 工具栏内容固定
|
|
616
|
+
// 当 needCollapse 为 false 时，显示 MoreTools 组件
|
|
617
|
+
this.showMoreToolbar && h(MoreTools, {
|
|
618
|
+
needCollapse: this.needCollapse,
|
|
619
|
+
toolbarStyle: this.$props.toolbarStyle,
|
|
620
|
+
onToolClick: (tool) => {
|
|
621
|
+
var _a, _b, _c, _d;
|
|
622
|
+
if (tool === 'undo') {
|
|
623
|
+
(_b = (_a = this.getQuill()) === null || _a === void 0 ? void 0 : _a.getModule('history')) === null || _b === void 0 ? void 0 : _b.undo();
|
|
624
|
+
}
|
|
625
|
+
else if (tool === 'redo') {
|
|
626
|
+
(_d = (_c = this.getQuill()) === null || _c === void 0 ? void 0 : _c.getModule('history')) === null || _d === void 0 ? void 0 : _d.redo();
|
|
627
|
+
}
|
|
628
|
+
else if (tool === 'ocr') {
|
|
629
|
+
this.$emit('ocr');
|
|
630
|
+
}
|
|
631
|
+
else if (tool === 'math') {
|
|
632
|
+
this.$emit('math');
|
|
633
|
+
}
|
|
634
|
+
}
|
|
635
|
+
}),
|
|
636
|
+
h('div', {
|
|
637
|
+
ref: 'editor', ...this.$attrs
|
|
638
|
+
}),
|
|
468
639
|
]),
|
|
469
640
|
];
|
|
470
641
|
},
|