pxx-vue-quill 1.0.21 → 1.0.22
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 +267 -155
- package/dist/vue-quill.cjs.prod.js +2 -2
- package/dist/vue-quill.esm-browser.js +550 -422
- package/dist/vue-quill.esm-browser.prod.js +2 -2
- package/dist/vue-quill.esm-bundler.js +268 -156
- package/dist/vue-quill.esm-bundler.prod.js +2 -2
- package/dist/vue-quill.global.js +300 -196
- package/dist/vue-quill.global.prod.js +2 -2
- package/package.json +1 -1
|
@@ -7,9 +7,9 @@
|
|
|
7
7
|
*
|
|
8
8
|
* Copyright (c) 2025 Pxx-Team
|
|
9
9
|
* Released under the MIT license
|
|
10
|
-
* Date: 2025-08-
|
|
10
|
+
* Date: 2025-08-26T09:46:02.957Z
|
|
11
11
|
*/
|
|
12
|
-
import { defineComponent, h, onMounted, onBeforeUnmount,
|
|
12
|
+
import { defineComponent, ref, h, onMounted, onBeforeUnmount, computed, watch, nextTick } from 'vue';
|
|
13
13
|
|
|
14
14
|
var global$1 = (typeof global !== "undefined" ? global :
|
|
15
15
|
typeof self !== "undefined" ? self :
|
|
@@ -18792,11 +18792,11 @@ Object.defineProperty(DefaultAligner$1, "__esModule", {
|
|
|
18792
18792
|
value: true
|
|
18793
18793
|
});
|
|
18794
18794
|
|
|
18795
|
-
var _createClass
|
|
18795
|
+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
18796
18796
|
|
|
18797
18797
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
18798
18798
|
|
|
18799
|
-
function _classCallCheck
|
|
18799
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
18800
18800
|
|
|
18801
18801
|
var LEFT_ALIGN = 'left';
|
|
18802
18802
|
var CENTER_ALIGN = 'center';
|
|
@@ -18807,7 +18807,7 @@ var DefaultAligner = function () {
|
|
|
18807
18807
|
var _this = this,
|
|
18808
18808
|
_alignments;
|
|
18809
18809
|
|
|
18810
|
-
_classCallCheck
|
|
18810
|
+
_classCallCheck(this, DefaultAligner);
|
|
18811
18811
|
|
|
18812
18812
|
this.applyStyle = options.aligner.applyStyle;
|
|
18813
18813
|
this.alignAttribute = options.attribute;
|
|
@@ -18835,7 +18835,7 @@ var DefaultAligner = function () {
|
|
|
18835
18835
|
}), _alignments);
|
|
18836
18836
|
}
|
|
18837
18837
|
|
|
18838
|
-
_createClass
|
|
18838
|
+
_createClass(DefaultAligner, [{
|
|
18839
18839
|
key: 'getAlignments',
|
|
18840
18840
|
value: function getAlignments() {
|
|
18841
18841
|
var _this2 = this;
|
|
@@ -19138,182 +19138,190 @@ function requireAlignAction () {
|
|
|
19138
19138
|
return AlignAction;
|
|
19139
19139
|
}
|
|
19140
19140
|
|
|
19141
|
-
var ResizeAction
|
|
19141
|
+
var ResizeAction = {};
|
|
19142
19142
|
|
|
19143
|
-
|
|
19144
|
-
value: true
|
|
19145
|
-
});
|
|
19143
|
+
var hasRequiredResizeAction;
|
|
19146
19144
|
|
|
19147
|
-
|
|
19145
|
+
function requireResizeAction () {
|
|
19146
|
+
if (hasRequiredResizeAction) return ResizeAction;
|
|
19147
|
+
hasRequiredResizeAction = 1;
|
|
19148
19148
|
|
|
19149
|
-
|
|
19149
|
+
Object.defineProperty(ResizeAction, "__esModule", {
|
|
19150
|
+
value: true
|
|
19151
|
+
});
|
|
19150
19152
|
|
|
19151
|
-
var
|
|
19153
|
+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
19152
19154
|
|
|
19153
|
-
var
|
|
19155
|
+
var _Action2 = requireAction();
|
|
19154
19156
|
|
|
19155
|
-
_interopRequireDefault
|
|
19157
|
+
var _Action3 = _interopRequireDefault(_Action2);
|
|
19156
19158
|
|
|
19157
|
-
|
|
19159
|
+
var _BlotFormatter = requireBlotFormatter();
|
|
19158
19160
|
|
|
19159
|
-
|
|
19161
|
+
_interopRequireDefault(_BlotFormatter);
|
|
19160
19162
|
|
|
19161
|
-
function
|
|
19163
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19162
19164
|
|
|
19163
|
-
function
|
|
19165
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
19164
19166
|
|
|
19165
|
-
|
|
19166
|
-
_inherits$1(ResizeAction, _Action);
|
|
19167
|
+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
|
19167
19168
|
|
|
19168
|
-
|
|
19169
|
-
_classCallCheck$1(this, ResizeAction);
|
|
19169
|
+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
|
19170
19170
|
|
|
19171
|
-
|
|
19171
|
+
var ResizeAction$1 = function (_Action) {
|
|
19172
|
+
_inherits(ResizeAction, _Action);
|
|
19172
19173
|
|
|
19173
|
-
|
|
19174
|
-
|
|
19175
|
-
return;
|
|
19176
|
-
}
|
|
19177
|
-
_this.dragHandle = event.target;
|
|
19178
|
-
_this.setCursor(_this.dragHandle.style.cursor);
|
|
19174
|
+
function ResizeAction(formatter) {
|
|
19175
|
+
_classCallCheck(this, ResizeAction);
|
|
19179
19176
|
|
|
19180
|
-
|
|
19181
|
-
return;
|
|
19182
|
-
}
|
|
19177
|
+
var _this = _possibleConstructorReturn(this, (ResizeAction.__proto__ || Object.getPrototypeOf(ResizeAction)).call(this, formatter));
|
|
19183
19178
|
|
|
19184
|
-
|
|
19185
|
-
|
|
19186
|
-
|
|
19187
|
-
|
|
19179
|
+
_this.onMouseDown = function (event) {
|
|
19180
|
+
if (!(event.target instanceof HTMLElement)) {
|
|
19181
|
+
return;
|
|
19182
|
+
}
|
|
19183
|
+
_this.dragHandle = event.target;
|
|
19184
|
+
_this.setCursor(_this.dragHandle.style.cursor);
|
|
19188
19185
|
|
|
19189
|
-
|
|
19186
|
+
if (!_this.formatter.currentSpec) {
|
|
19187
|
+
return;
|
|
19188
|
+
}
|
|
19190
19189
|
|
|
19191
|
-
|
|
19192
|
-
|
|
19193
|
-
|
|
19190
|
+
var target = _this.formatter.currentSpec.getTargetElement();
|
|
19191
|
+
if (!target) {
|
|
19192
|
+
return;
|
|
19193
|
+
}
|
|
19194
19194
|
|
|
19195
|
-
|
|
19196
|
-
document.addEventListener('mouseup', _this.onMouseUp);
|
|
19197
|
-
};
|
|
19195
|
+
var rect = target.getBoundingClientRect();
|
|
19198
19196
|
|
|
19199
|
-
|
|
19200
|
-
|
|
19201
|
-
|
|
19202
|
-
}
|
|
19197
|
+
_this.dragStartX = event.clientX;
|
|
19198
|
+
_this.preDragWidth = rect.width;
|
|
19199
|
+
_this.targetRatio = rect.height / rect.width;
|
|
19203
19200
|
|
|
19204
|
-
|
|
19205
|
-
|
|
19206
|
-
|
|
19207
|
-
}
|
|
19201
|
+
document.addEventListener('mousemove', _this.onDrag);
|
|
19202
|
+
document.addEventListener('mouseup', _this.onMouseUp);
|
|
19203
|
+
};
|
|
19208
19204
|
|
|
19209
|
-
|
|
19210
|
-
|
|
19205
|
+
_this.onDrag = function (event) {
|
|
19206
|
+
if (!_this.formatter.currentSpec) {
|
|
19207
|
+
return;
|
|
19208
|
+
}
|
|
19211
19209
|
|
|
19212
|
-
|
|
19213
|
-
|
|
19214
|
-
|
|
19215
|
-
|
|
19216
|
-
}
|
|
19210
|
+
var target = _this.formatter.currentSpec.getTargetElement();
|
|
19211
|
+
if (!target) {
|
|
19212
|
+
return;
|
|
19213
|
+
}
|
|
19217
19214
|
|
|
19218
|
-
|
|
19215
|
+
var deltaX = event.clientX - _this.dragStartX;
|
|
19216
|
+
var newWidth = 0;
|
|
19219
19217
|
|
|
19220
|
-
|
|
19221
|
-
|
|
19218
|
+
if (_this.dragHandle === _this.topLeftHandle || _this.dragHandle === _this.bottomLeftHandle) {
|
|
19219
|
+
newWidth = Math.round(_this.preDragWidth - deltaX);
|
|
19220
|
+
} else {
|
|
19221
|
+
newWidth = Math.round(_this.preDragWidth + deltaX);
|
|
19222
|
+
}
|
|
19222
19223
|
|
|
19223
|
-
|
|
19224
|
-
};
|
|
19224
|
+
var newHeight = _this.targetRatio * newWidth;
|
|
19225
19225
|
|
|
19226
|
-
|
|
19227
|
-
|
|
19228
|
-
document.removeEventListener('mousemove', _this.onDrag);
|
|
19229
|
-
document.removeEventListener('mouseup', _this.onMouseUp);
|
|
19230
|
-
};
|
|
19226
|
+
target.setAttribute('width', '' + newWidth);
|
|
19227
|
+
target.setAttribute('height', '' + newHeight);
|
|
19231
19228
|
|
|
19232
|
-
|
|
19233
|
-
|
|
19234
|
-
_this.bottomRightHandle = _this.createHandle('bottom-right', 'nwse-resize');
|
|
19235
|
-
_this.bottomLeftHandle = _this.createHandle('bottom-left', 'nesw-resize');
|
|
19236
|
-
_this.dragHandle = null;
|
|
19237
|
-
_this.dragStartX = 0;
|
|
19238
|
-
_this.preDragWidth = 0;
|
|
19239
|
-
_this.targetRatio = 0;
|
|
19240
|
-
return _this;
|
|
19241
|
-
}
|
|
19229
|
+
_this.formatter.update();
|
|
19230
|
+
};
|
|
19242
19231
|
|
|
19243
|
-
|
|
19244
|
-
|
|
19245
|
-
|
|
19246
|
-
|
|
19247
|
-
|
|
19248
|
-
this.formatter.overlay.appendChild(this.bottomRightHandle);
|
|
19249
|
-
this.formatter.overlay.appendChild(this.bottomLeftHandle);
|
|
19232
|
+
_this.onMouseUp = function () {
|
|
19233
|
+
_this.setCursor('');
|
|
19234
|
+
document.removeEventListener('mousemove', _this.onDrag);
|
|
19235
|
+
document.removeEventListener('mouseup', _this.onMouseUp);
|
|
19236
|
+
};
|
|
19250
19237
|
|
|
19251
|
-
|
|
19252
|
-
|
|
19253
|
-
|
|
19254
|
-
|
|
19255
|
-
|
|
19256
|
-
|
|
19257
|
-
|
|
19258
|
-
|
|
19259
|
-
|
|
19260
|
-
|
|
19261
|
-
}
|
|
19262
|
-
}, {
|
|
19263
|
-
key: 'createHandle',
|
|
19264
|
-
value: function createHandle(position, cursor) {
|
|
19265
|
-
var box = document.createElement('div');
|
|
19266
|
-
box.classList.add(this.formatter.options.resize.handleClassName);
|
|
19267
|
-
box.setAttribute('data-position', position);
|
|
19268
|
-
box.style.cursor = cursor;
|
|
19269
|
-
|
|
19270
|
-
if (this.formatter.options.resize.handleStyle) {
|
|
19271
|
-
Object.assign(box.style, this.formatter.options.resize.handleStyle);
|
|
19272
|
-
}
|
|
19238
|
+
_this.topLeftHandle = _this.createHandle('top-left', 'nwse-resize');
|
|
19239
|
+
_this.topRightHandle = _this.createHandle('top-right', 'nesw-resize');
|
|
19240
|
+
_this.bottomRightHandle = _this.createHandle('bottom-right', 'nwse-resize');
|
|
19241
|
+
_this.bottomLeftHandle = _this.createHandle('bottom-left', 'nesw-resize');
|
|
19242
|
+
_this.dragHandle = null;
|
|
19243
|
+
_this.dragStartX = 0;
|
|
19244
|
+
_this.preDragWidth = 0;
|
|
19245
|
+
_this.targetRatio = 0;
|
|
19246
|
+
return _this;
|
|
19247
|
+
}
|
|
19273
19248
|
|
|
19274
|
-
|
|
19249
|
+
_createClass(ResizeAction, [{
|
|
19250
|
+
key: 'onCreate',
|
|
19251
|
+
value: function onCreate() {
|
|
19252
|
+
this.formatter.overlay.appendChild(this.topLeftHandle);
|
|
19253
|
+
this.formatter.overlay.appendChild(this.topRightHandle);
|
|
19254
|
+
this.formatter.overlay.appendChild(this.bottomRightHandle);
|
|
19255
|
+
this.formatter.overlay.appendChild(this.bottomLeftHandle);
|
|
19275
19256
|
|
|
19276
|
-
|
|
19277
|
-
|
|
19278
|
-
|
|
19279
|
-
|
|
19280
|
-
|
|
19281
|
-
|
|
19282
|
-
|
|
19283
|
-
|
|
19284
|
-
|
|
19285
|
-
|
|
19286
|
-
|
|
19287
|
-
|
|
19288
|
-
|
|
19289
|
-
|
|
19290
|
-
|
|
19257
|
+
this.repositionHandles(this.formatter.options.resize.handleStyle);
|
|
19258
|
+
}
|
|
19259
|
+
}, {
|
|
19260
|
+
key: 'onDestroy',
|
|
19261
|
+
value: function onDestroy() {
|
|
19262
|
+
this.setCursor('');
|
|
19263
|
+
this.formatter.overlay.removeChild(this.topLeftHandle);
|
|
19264
|
+
this.formatter.overlay.removeChild(this.topRightHandle);
|
|
19265
|
+
this.formatter.overlay.removeChild(this.bottomRightHandle);
|
|
19266
|
+
this.formatter.overlay.removeChild(this.bottomLeftHandle);
|
|
19267
|
+
}
|
|
19268
|
+
}, {
|
|
19269
|
+
key: 'createHandle',
|
|
19270
|
+
value: function createHandle(position, cursor) {
|
|
19271
|
+
var box = document.createElement('div');
|
|
19272
|
+
box.classList.add(this.formatter.options.resize.handleClassName);
|
|
19273
|
+
box.setAttribute('data-position', position);
|
|
19274
|
+
box.style.cursor = cursor;
|
|
19275
|
+
|
|
19276
|
+
if (this.formatter.options.resize.handleStyle) {
|
|
19277
|
+
Object.assign(box.style, this.formatter.options.resize.handleStyle);
|
|
19278
|
+
}
|
|
19291
19279
|
|
|
19292
|
-
|
|
19293
|
-
Object.assign(this.topRightHandle.style, { right: handleXOffset, top: handleYOffset });
|
|
19294
|
-
Object.assign(this.bottomRightHandle.style, { right: handleXOffset, bottom: handleYOffset });
|
|
19295
|
-
Object.assign(this.bottomLeftHandle.style, { left: handleXOffset, bottom: handleYOffset });
|
|
19296
|
-
}
|
|
19297
|
-
}, {
|
|
19298
|
-
key: 'setCursor',
|
|
19299
|
-
value: function setCursor(value) {
|
|
19300
|
-
if (document.body) {
|
|
19301
|
-
document.body.style.cursor = value;
|
|
19302
|
-
}
|
|
19280
|
+
box.addEventListener('mousedown', this.onMouseDown);
|
|
19303
19281
|
|
|
19304
|
-
|
|
19305
|
-
|
|
19306
|
-
|
|
19307
|
-
|
|
19308
|
-
|
|
19309
|
-
|
|
19310
|
-
|
|
19311
|
-
|
|
19282
|
+
return box;
|
|
19283
|
+
}
|
|
19284
|
+
}, {
|
|
19285
|
+
key: 'repositionHandles',
|
|
19286
|
+
value: function repositionHandles(handleStyle) {
|
|
19287
|
+
var handleXOffset = '0px';
|
|
19288
|
+
var handleYOffset = '0px';
|
|
19289
|
+
if (handleStyle) {
|
|
19290
|
+
if (handleStyle.width) {
|
|
19291
|
+
handleXOffset = -parseFloat(handleStyle.width) / 2 + 'px';
|
|
19292
|
+
}
|
|
19293
|
+
if (handleStyle.height) {
|
|
19294
|
+
handleYOffset = -parseFloat(handleStyle.height) / 2 + 'px';
|
|
19295
|
+
}
|
|
19296
|
+
}
|
|
19312
19297
|
|
|
19313
|
-
|
|
19314
|
-
|
|
19298
|
+
Object.assign(this.topLeftHandle.style, { left: handleXOffset, top: handleYOffset });
|
|
19299
|
+
Object.assign(this.topRightHandle.style, { right: handleXOffset, top: handleYOffset });
|
|
19300
|
+
Object.assign(this.bottomRightHandle.style, { right: handleXOffset, bottom: handleYOffset });
|
|
19301
|
+
Object.assign(this.bottomLeftHandle.style, { left: handleXOffset, bottom: handleYOffset });
|
|
19302
|
+
}
|
|
19303
|
+
}, {
|
|
19304
|
+
key: 'setCursor',
|
|
19305
|
+
value: function setCursor(value) {
|
|
19306
|
+
if (document.body) {
|
|
19307
|
+
document.body.style.cursor = value;
|
|
19308
|
+
}
|
|
19315
19309
|
|
|
19316
|
-
|
|
19310
|
+
if (this.formatter.currentSpec) {
|
|
19311
|
+
var target = this.formatter.currentSpec.getOverlayElement();
|
|
19312
|
+
if (target) {
|
|
19313
|
+
target.style.cursor = value;
|
|
19314
|
+
}
|
|
19315
|
+
}
|
|
19316
|
+
}
|
|
19317
|
+
}]);
|
|
19318
|
+
|
|
19319
|
+
return ResizeAction;
|
|
19320
|
+
}(_Action3.default);
|
|
19321
|
+
|
|
19322
|
+
ResizeAction.default = ResizeAction$1;
|
|
19323
|
+
return ResizeAction;
|
|
19324
|
+
}
|
|
19317
19325
|
|
|
19318
19326
|
var DeleteAction = {};
|
|
19319
19327
|
|
|
@@ -19420,7 +19428,7 @@ function requireBlotSpec () {
|
|
|
19420
19428
|
|
|
19421
19429
|
var _AlignAction2 = _interopRequireDefault(_AlignAction);
|
|
19422
19430
|
|
|
19423
|
-
var _ResizeAction =
|
|
19431
|
+
var _ResizeAction = requireResizeAction();
|
|
19424
19432
|
|
|
19425
19433
|
var _ResizeAction2 = _interopRequireDefault(_ResizeAction);
|
|
19426
19434
|
|
|
@@ -19552,148 +19560,156 @@ function requireImageSpec () {
|
|
|
19552
19560
|
|
|
19553
19561
|
var IframeVideoSpec = {};
|
|
19554
19562
|
|
|
19555
|
-
var UnclickableBlotSpec
|
|
19563
|
+
var UnclickableBlotSpec = {};
|
|
19556
19564
|
|
|
19557
|
-
|
|
19558
|
-
value: true
|
|
19559
|
-
});
|
|
19565
|
+
var hasRequiredUnclickableBlotSpec;
|
|
19560
19566
|
|
|
19561
|
-
|
|
19567
|
+
function requireUnclickableBlotSpec () {
|
|
19568
|
+
if (hasRequiredUnclickableBlotSpec) return UnclickableBlotSpec;
|
|
19569
|
+
hasRequiredUnclickableBlotSpec = 1;
|
|
19562
19570
|
|
|
19563
|
-
|
|
19571
|
+
Object.defineProperty(UnclickableBlotSpec, "__esModule", {
|
|
19572
|
+
value: true
|
|
19573
|
+
});
|
|
19564
19574
|
|
|
19565
|
-
var
|
|
19575
|
+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
19566
19576
|
|
|
19567
|
-
var
|
|
19577
|
+
var _BlotSpec2 = requireBlotSpec();
|
|
19568
19578
|
|
|
19569
|
-
_interopRequireDefault(
|
|
19579
|
+
var _BlotSpec3 = _interopRequireDefault(_BlotSpec2);
|
|
19570
19580
|
|
|
19571
|
-
|
|
19581
|
+
var _BlotFormatter = requireBlotFormatter();
|
|
19572
19582
|
|
|
19573
|
-
|
|
19583
|
+
_interopRequireDefault(_BlotFormatter);
|
|
19574
19584
|
|
|
19575
|
-
function
|
|
19585
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19576
19586
|
|
|
19577
|
-
function
|
|
19587
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
19578
19588
|
|
|
19579
|
-
|
|
19580
|
-
var PROXY_IMAGE_CLASS = 'blot-formatter__proxy-image';
|
|
19589
|
+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
|
19581
19590
|
|
|
19582
|
-
|
|
19583
|
-
_inherits(UnclickableBlotSpec, _BlotSpec);
|
|
19591
|
+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
|
19584
19592
|
|
|
19585
|
-
|
|
19586
|
-
|
|
19593
|
+
var MOUSE_ENTER_ATTRIBUTE = 'data-blot-formatter-unclickable-bound';
|
|
19594
|
+
var PROXY_IMAGE_CLASS = 'blot-formatter__proxy-image';
|
|
19587
19595
|
|
|
19588
|
-
|
|
19596
|
+
var UnclickableBlotSpec$1 = function (_BlotSpec) {
|
|
19597
|
+
_inherits(UnclickableBlotSpec, _BlotSpec);
|
|
19589
19598
|
|
|
19590
|
-
|
|
19591
|
-
|
|
19592
|
-
unclickable.setAttribute(MOUSE_ENTER_ATTRIBUTE, 'true');
|
|
19593
|
-
unclickable.addEventListener('mouseenter', _this.onMouseEnter);
|
|
19594
|
-
});
|
|
19595
|
-
};
|
|
19599
|
+
function UnclickableBlotSpec(formatter, selector) {
|
|
19600
|
+
_classCallCheck(this, UnclickableBlotSpec);
|
|
19596
19601
|
|
|
19597
|
-
|
|
19598
|
-
var unclickable = event.target;
|
|
19599
|
-
if (!(unclickable instanceof HTMLElement)) {
|
|
19600
|
-
return;
|
|
19601
|
-
}
|
|
19602
|
+
var _this = _possibleConstructorReturn(this, (UnclickableBlotSpec.__proto__ || Object.getPrototypeOf(UnclickableBlotSpec)).call(this, formatter));
|
|
19602
19603
|
|
|
19603
|
-
|
|
19604
|
-
|
|
19605
|
-
|
|
19604
|
+
_this.onTextChange = function () {
|
|
19605
|
+
Array.from(document.querySelectorAll(_this.selector + ':not([' + MOUSE_ENTER_ATTRIBUTE + '])')).forEach(function (unclickable) {
|
|
19606
|
+
unclickable.setAttribute(MOUSE_ENTER_ATTRIBUTE, 'true');
|
|
19607
|
+
unclickable.addEventListener('mouseenter', _this.onMouseEnter);
|
|
19608
|
+
});
|
|
19609
|
+
};
|
|
19606
19610
|
|
|
19607
|
-
|
|
19608
|
-
|
|
19609
|
-
|
|
19610
|
-
|
|
19611
|
-
|
|
19612
|
-
};
|
|
19611
|
+
_this.onMouseEnter = function (event) {
|
|
19612
|
+
var unclickable = event.target;
|
|
19613
|
+
if (!(unclickable instanceof HTMLElement)) {
|
|
19614
|
+
return;
|
|
19615
|
+
}
|
|
19613
19616
|
|
|
19614
|
-
|
|
19615
|
-
|
|
19616
|
-
|
|
19617
|
-
return _this;
|
|
19618
|
-
}
|
|
19617
|
+
_this.nextUnclickable = unclickable;
|
|
19618
|
+
_this.repositionProxyImage(_this.nextUnclickable);
|
|
19619
|
+
};
|
|
19619
19620
|
|
|
19620
|
-
|
|
19621
|
-
|
|
19622
|
-
|
|
19623
|
-
|
|
19624
|
-
|
|
19625
|
-
|
|
19626
|
-
this prevents the click event from overlapping with ImageSpec
|
|
19627
|
-
*/
|
|
19628
|
-
document.body.appendChild(this.createProxyImage());
|
|
19629
|
-
}
|
|
19621
|
+
_this.onProxyImageClick = function () {
|
|
19622
|
+
_this.unclickable = _this.nextUnclickable;
|
|
19623
|
+
_this.nextUnclickable = null;
|
|
19624
|
+
_this.formatter.show(_this);
|
|
19625
|
+
_this.hideProxyImage();
|
|
19626
|
+
};
|
|
19630
19627
|
|
|
19631
|
-
|
|
19632
|
-
|
|
19633
|
-
|
|
19634
|
-
|
|
19635
|
-
|
|
19636
|
-
key: 'getTargetElement',
|
|
19637
|
-
value: function getTargetElement() {
|
|
19638
|
-
return this.unclickable;
|
|
19639
|
-
}
|
|
19640
|
-
}, {
|
|
19641
|
-
key: 'getOverlayElement',
|
|
19642
|
-
value: function getOverlayElement() {
|
|
19643
|
-
return this.unclickable;
|
|
19644
|
-
}
|
|
19645
|
-
}, {
|
|
19646
|
-
key: 'onHide',
|
|
19647
|
-
value: function onHide() {
|
|
19648
|
-
this.hideProxyImage();
|
|
19649
|
-
this.nextUnclickable = null;
|
|
19650
|
-
this.unclickable = null;
|
|
19651
|
-
}
|
|
19652
|
-
}, {
|
|
19653
|
-
key: 'createProxyImage',
|
|
19654
|
-
value: function createProxyImage() {
|
|
19655
|
-
var canvas = document.createElement('canvas');
|
|
19656
|
-
var context = canvas.getContext('2d');
|
|
19657
|
-
context.globalAlpha = 0;
|
|
19658
|
-
context.fillRect(0, 0, 1, 1);
|
|
19659
|
-
|
|
19660
|
-
this.proxyImage = document.createElement('img');
|
|
19661
|
-
this.proxyImage.src = canvas.toDataURL('image/png');
|
|
19662
|
-
this.proxyImage.classList.add(PROXY_IMAGE_CLASS);
|
|
19663
|
-
|
|
19664
|
-
Object.assign(this.proxyImage.style, {
|
|
19665
|
-
position: 'absolute',
|
|
19666
|
-
margin: '0'
|
|
19667
|
-
});
|
|
19628
|
+
_this.selector = selector;
|
|
19629
|
+
_this.unclickable = null;
|
|
19630
|
+
_this.nextUnclickable = null;
|
|
19631
|
+
return _this;
|
|
19632
|
+
}
|
|
19668
19633
|
|
|
19669
|
-
|
|
19670
|
-
|
|
19671
|
-
|
|
19672
|
-
|
|
19673
|
-
|
|
19674
|
-
|
|
19675
|
-
|
|
19676
|
-
|
|
19677
|
-
|
|
19678
|
-
|
|
19679
|
-
key: 'repositionProxyImage',
|
|
19680
|
-
value: function repositionProxyImage(unclickable) {
|
|
19681
|
-
var rect = unclickable.getBoundingClientRect();
|
|
19682
|
-
|
|
19683
|
-
Object.assign(this.proxyImage.style, {
|
|
19684
|
-
display: 'block',
|
|
19685
|
-
left: rect.left + window.pageXOffset + 'px',
|
|
19686
|
-
top: rect.top + window.pageYOffset + 'px',
|
|
19687
|
-
width: rect.width + 'px',
|
|
19688
|
-
height: rect.height + 'px'
|
|
19689
|
-
});
|
|
19690
|
-
}
|
|
19691
|
-
}]);
|
|
19634
|
+
_createClass(UnclickableBlotSpec, [{
|
|
19635
|
+
key: 'init',
|
|
19636
|
+
value: function init() {
|
|
19637
|
+
if (document.body) {
|
|
19638
|
+
/*
|
|
19639
|
+
it's important that this is attached to the body instead of the root quill element.
|
|
19640
|
+
this prevents the click event from overlapping with ImageSpec
|
|
19641
|
+
*/
|
|
19642
|
+
document.body.appendChild(this.createProxyImage());
|
|
19643
|
+
}
|
|
19692
19644
|
|
|
19693
|
-
|
|
19694
|
-
|
|
19645
|
+
this.hideProxyImage();
|
|
19646
|
+
this.proxyImage.addEventListener('click', this.onProxyImageClick);
|
|
19647
|
+
this.formatter.quill.on('text-change', this.onTextChange);
|
|
19648
|
+
}
|
|
19649
|
+
}, {
|
|
19650
|
+
key: 'getTargetElement',
|
|
19651
|
+
value: function getTargetElement() {
|
|
19652
|
+
return this.unclickable;
|
|
19653
|
+
}
|
|
19654
|
+
}, {
|
|
19655
|
+
key: 'getOverlayElement',
|
|
19656
|
+
value: function getOverlayElement() {
|
|
19657
|
+
return this.unclickable;
|
|
19658
|
+
}
|
|
19659
|
+
}, {
|
|
19660
|
+
key: 'onHide',
|
|
19661
|
+
value: function onHide() {
|
|
19662
|
+
this.hideProxyImage();
|
|
19663
|
+
this.nextUnclickable = null;
|
|
19664
|
+
this.unclickable = null;
|
|
19665
|
+
}
|
|
19666
|
+
}, {
|
|
19667
|
+
key: 'createProxyImage',
|
|
19668
|
+
value: function createProxyImage() {
|
|
19669
|
+
var canvas = document.createElement('canvas');
|
|
19670
|
+
var context = canvas.getContext('2d');
|
|
19671
|
+
context.globalAlpha = 0;
|
|
19672
|
+
context.fillRect(0, 0, 1, 1);
|
|
19673
|
+
|
|
19674
|
+
this.proxyImage = document.createElement('img');
|
|
19675
|
+
this.proxyImage.src = canvas.toDataURL('image/png');
|
|
19676
|
+
this.proxyImage.classList.add(PROXY_IMAGE_CLASS);
|
|
19677
|
+
|
|
19678
|
+
Object.assign(this.proxyImage.style, {
|
|
19679
|
+
position: 'absolute',
|
|
19680
|
+
margin: '0'
|
|
19681
|
+
});
|
|
19695
19682
|
|
|
19696
|
-
|
|
19683
|
+
return this.proxyImage;
|
|
19684
|
+
}
|
|
19685
|
+
}, {
|
|
19686
|
+
key: 'hideProxyImage',
|
|
19687
|
+
value: function hideProxyImage() {
|
|
19688
|
+
Object.assign(this.proxyImage.style, {
|
|
19689
|
+
display: 'none'
|
|
19690
|
+
});
|
|
19691
|
+
}
|
|
19692
|
+
}, {
|
|
19693
|
+
key: 'repositionProxyImage',
|
|
19694
|
+
value: function repositionProxyImage(unclickable) {
|
|
19695
|
+
var rect = unclickable.getBoundingClientRect();
|
|
19696
|
+
|
|
19697
|
+
Object.assign(this.proxyImage.style, {
|
|
19698
|
+
display: 'block',
|
|
19699
|
+
left: rect.left + window.pageXOffset + 'px',
|
|
19700
|
+
top: rect.top + window.pageYOffset + 'px',
|
|
19701
|
+
width: rect.width + 'px',
|
|
19702
|
+
height: rect.height + 'px'
|
|
19703
|
+
});
|
|
19704
|
+
}
|
|
19705
|
+
}]);
|
|
19706
|
+
|
|
19707
|
+
return UnclickableBlotSpec;
|
|
19708
|
+
}(_BlotSpec3.default);
|
|
19709
|
+
|
|
19710
|
+
UnclickableBlotSpec.default = UnclickableBlotSpec$1;
|
|
19711
|
+
return UnclickableBlotSpec;
|
|
19712
|
+
}
|
|
19697
19713
|
|
|
19698
19714
|
var hasRequiredIframeVideoSpec;
|
|
19699
19715
|
|
|
@@ -19705,7 +19721,7 @@ function requireIframeVideoSpec () {
|
|
|
19705
19721
|
value: true
|
|
19706
19722
|
});
|
|
19707
19723
|
|
|
19708
|
-
var _UnclickableBlotSpec2 =
|
|
19724
|
+
var _UnclickableBlotSpec2 = requireUnclickableBlotSpec();
|
|
19709
19725
|
|
|
19710
19726
|
var _UnclickableBlotSpec3 = _interopRequireDefault(_UnclickableBlotSpec2);
|
|
19711
19727
|
|
|
@@ -19905,7 +19921,7 @@ function requireOptions () {
|
|
|
19905
19921
|
}
|
|
19906
19922
|
});
|
|
19907
19923
|
|
|
19908
|
-
var _ResizeAction =
|
|
19924
|
+
var _ResizeAction = requireResizeAction();
|
|
19909
19925
|
|
|
19910
19926
|
Object.defineProperty(exports, 'ResizeAction', {
|
|
19911
19927
|
enumerable: true,
|
|
@@ -19932,7 +19948,7 @@ function requireOptions () {
|
|
|
19932
19948
|
}
|
|
19933
19949
|
});
|
|
19934
19950
|
|
|
19935
|
-
var _UnclickableBlotSpec =
|
|
19951
|
+
var _UnclickableBlotSpec = requireUnclickableBlotSpec();
|
|
19936
19952
|
|
|
19937
19953
|
Object.defineProperty(exports, 'UnclickableBlotSpec', {
|
|
19938
19954
|
enumerable: true,
|
|
@@ -19955,6 +19971,129 @@ function requireOptions () {
|
|
|
19955
19971
|
|
|
19956
19972
|
var BlotFormatter = /*@__PURE__*/getDefaultExportFromCjs(dist);
|
|
19957
19973
|
|
|
19974
|
+
const MoreToolbar = defineComponent({
|
|
19975
|
+
name: 'MoreToolbar',
|
|
19976
|
+
emits: ['toolClick'],
|
|
19977
|
+
setup(props, { emit }) {
|
|
19978
|
+
const showMoreTools = ref(false);
|
|
19979
|
+
const moreButtonClick = () => {
|
|
19980
|
+
showMoreTools.value = !showMoreTools.value;
|
|
19981
|
+
};
|
|
19982
|
+
return () => h('div', {
|
|
19983
|
+
id: 'toolbar'
|
|
19984
|
+
}, [
|
|
19985
|
+
h('div', {
|
|
19986
|
+
class: {
|
|
19987
|
+
'short-tools': true,
|
|
19988
|
+
'collapse': showMoreTools.value
|
|
19989
|
+
}
|
|
19990
|
+
}, [
|
|
19991
|
+
// 第一组:基础格式工具
|
|
19992
|
+
h('span', { class: 'ql-formats' }, [
|
|
19993
|
+
// 粗体按钮
|
|
19994
|
+
h('button', {
|
|
19995
|
+
class: 'ql-bold',
|
|
19996
|
+
type: 'button',
|
|
19997
|
+
}, ''),
|
|
19998
|
+
// 斜体按钮
|
|
19999
|
+
h('button', {
|
|
20000
|
+
class: 'ql-italic',
|
|
20001
|
+
type: 'button'
|
|
20002
|
+
}, ''),
|
|
20003
|
+
// 下划线按钮
|
|
20004
|
+
h('button', {
|
|
20005
|
+
class: 'ql-underline',
|
|
20006
|
+
type: 'button'
|
|
20007
|
+
}, '')
|
|
20008
|
+
]),
|
|
20009
|
+
// 第二组:颜色选择器
|
|
20010
|
+
h('span', { class: 'ql-formats' }, [
|
|
20011
|
+
h('select', {
|
|
20012
|
+
class: 'ql-color ql-picker ql-color-picker ql-expanded',
|
|
20013
|
+
type: 'button'
|
|
20014
|
+
}, [
|
|
20015
|
+
h('span', { class: 'ql-picker-label' }, ''),
|
|
20016
|
+
h('div', { class: 'ql-picker-options' })
|
|
20017
|
+
]),
|
|
20018
|
+
]),
|
|
20019
|
+
// 第三组:链接工具
|
|
20020
|
+
h('span', { class: 'ql-formats' }, [
|
|
20021
|
+
h('button', {
|
|
20022
|
+
class: 'ql-link',
|
|
20023
|
+
type: 'button'
|
|
20024
|
+
}, '')
|
|
20025
|
+
]),
|
|
20026
|
+
// 第四组:更多按钮
|
|
20027
|
+
h('span', { class: 'ql-formats' }, [
|
|
20028
|
+
h('button', {
|
|
20029
|
+
class: 'ql-more mr-0',
|
|
20030
|
+
type: 'button',
|
|
20031
|
+
onClick: moreButtonClick
|
|
20032
|
+
}, '')
|
|
20033
|
+
])
|
|
20034
|
+
]),
|
|
20035
|
+
h('div', {
|
|
20036
|
+
class: {
|
|
20037
|
+
"more-tools": true,
|
|
20038
|
+
"collapse": showMoreTools.value
|
|
20039
|
+
}, style: { display: showMoreTools.value ? 'block' : 'none' }
|
|
20040
|
+
}, [
|
|
20041
|
+
h('div', { class: "more-tools-item" }, [
|
|
20042
|
+
h('span', { class: 'ql-formats' }, [
|
|
20043
|
+
h('button', {
|
|
20044
|
+
class: 'ql-list',
|
|
20045
|
+
value: 'ordered',
|
|
20046
|
+
type: 'button'
|
|
20047
|
+
}, ''),
|
|
20048
|
+
h('button', {
|
|
20049
|
+
class: 'ql-list',
|
|
20050
|
+
value: 'bullet',
|
|
20051
|
+
type: 'button'
|
|
20052
|
+
}, '')
|
|
20053
|
+
]),
|
|
20054
|
+
// 第二组:图片工具
|
|
20055
|
+
h('span', { class: 'ql-formats' }, [
|
|
20056
|
+
h('button', {
|
|
20057
|
+
class: 'ql-image',
|
|
20058
|
+
type: 'button'
|
|
20059
|
+
}, '')
|
|
20060
|
+
]),
|
|
20061
|
+
// 第三组:撤销和重做
|
|
20062
|
+
h('span', { class: 'ql-formats' }, [
|
|
20063
|
+
h('button', {
|
|
20064
|
+
class: 'ql-undo',
|
|
20065
|
+
type: 'button',
|
|
20066
|
+
onClick: () => emit('toolClick', 'undo')
|
|
20067
|
+
}, ''),
|
|
20068
|
+
h('button', {
|
|
20069
|
+
class: 'ql-redo',
|
|
20070
|
+
type: 'button',
|
|
20071
|
+
onClick: () => emit('toolClick', 'redo')
|
|
20072
|
+
}, '')
|
|
20073
|
+
]),
|
|
20074
|
+
// 第四组:数学工具
|
|
20075
|
+
h('span', { class: 'ql-formats' }, [
|
|
20076
|
+
h('button', {
|
|
20077
|
+
class: 'ql-math mr-0',
|
|
20078
|
+
type: 'button',
|
|
20079
|
+
onClick: () => emit('toolClick', 'math')
|
|
20080
|
+
}, '')
|
|
20081
|
+
])
|
|
20082
|
+
]),
|
|
20083
|
+
h('div', {}, [
|
|
20084
|
+
h('span', { class: 'ql-formats' }, [
|
|
20085
|
+
h('button', {
|
|
20086
|
+
class: 'ql-ocr',
|
|
20087
|
+
type: 'button',
|
|
20088
|
+
onClick: () => emit('toolClick', 'ocr')
|
|
20089
|
+
}, '')
|
|
20090
|
+
])
|
|
20091
|
+
])
|
|
20092
|
+
])
|
|
20093
|
+
]);
|
|
20094
|
+
}
|
|
20095
|
+
});
|
|
20096
|
+
|
|
19958
20097
|
// 加粗
|
|
19959
20098
|
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>`;
|
|
19960
20099
|
// 斜体
|
|
@@ -19973,112 +20112,28 @@ const redoSVG = `<svg t="1756107908999" class="icon" viewBox="0 0 1024 1024" ver
|
|
|
19973
20112
|
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>`;
|
|
19974
20113
|
// 数学公式
|
|
19975
20114
|
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>`;
|
|
19976
|
-
// 无序列表
|
|
19977
|
-
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>`;
|
|
19978
|
-
// 有序列表
|
|
19979
|
-
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>`;
|
|
19980
20115
|
// 图片
|
|
19981
20116
|
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>`;
|
|
19982
20117
|
|
|
19983
|
-
const MoreTools = defineComponent({
|
|
19984
|
-
name: 'MoreTools',
|
|
19985
|
-
props: {
|
|
19986
|
-
// 传入toolbar的自定义style
|
|
19987
|
-
toolbarStyle: {
|
|
19988
|
-
type: Object,
|
|
19989
|
-
required: false,
|
|
19990
|
-
default: () => ({})
|
|
19991
|
-
},
|
|
19992
|
-
needCollapse: {
|
|
19993
|
-
type: Boolean,
|
|
19994
|
-
default: false
|
|
19995
|
-
},
|
|
19996
|
-
onToolClick: {
|
|
19997
|
-
type: Function,
|
|
19998
|
-
required: true
|
|
19999
|
-
}
|
|
20000
|
-
},
|
|
20001
|
-
setup(props) {
|
|
20002
|
-
// 渲染工具按钮
|
|
20003
|
-
const renderToolButton = (tool) => {
|
|
20004
|
-
if (typeof tool === 'string') {
|
|
20005
|
-
// 根据工具名称获取对应的SVG图标
|
|
20006
|
-
let iconSVG = '';
|
|
20007
|
-
switch (tool) {
|
|
20008
|
-
case 'image':
|
|
20009
|
-
iconSVG = imageSVG;
|
|
20010
|
-
break;
|
|
20011
|
-
case 'undo':
|
|
20012
|
-
iconSVG = undoSVG;
|
|
20013
|
-
break;
|
|
20014
|
-
case 'redo':
|
|
20015
|
-
iconSVG = redoSVG;
|
|
20016
|
-
break;
|
|
20017
|
-
case 'ocr':
|
|
20018
|
-
iconSVG = ocrSVG;
|
|
20019
|
-
break;
|
|
20020
|
-
case 'math':
|
|
20021
|
-
iconSVG = mathSVG;
|
|
20022
|
-
break;
|
|
20023
|
-
default:
|
|
20024
|
-
iconSVG = '';
|
|
20025
|
-
}
|
|
20026
|
-
return h('button', {
|
|
20027
|
-
class: `ql-${tool}`,
|
|
20028
|
-
type: 'button',
|
|
20029
|
-
onClick: () => props.onToolClick(tool)
|
|
20030
|
-
}, [
|
|
20031
|
-
iconSVG ? h('span', { innerHTML: iconSVG }) : null
|
|
20032
|
-
]);
|
|
20033
|
-
}
|
|
20034
|
-
else if (typeof tool === 'object' && tool !== null) {
|
|
20035
|
-
const toolName = Object.keys(tool)[0];
|
|
20036
|
-
const toolValue = Object.values(tool)[0];
|
|
20037
|
-
let iconSVG = '';
|
|
20038
|
-
if (toolName === 'list') {
|
|
20039
|
-
iconSVG = toolValue === 'ordered' ? listOrderedSVG : listBulletSVG;
|
|
20040
|
-
}
|
|
20041
|
-
return h('button', {
|
|
20042
|
-
class: `ql-${toolName}`,
|
|
20043
|
-
'data-value': toolValue,
|
|
20044
|
-
type: 'button',
|
|
20045
|
-
onClick: () => props.onToolClick(`${toolName}-${toolValue}`)
|
|
20046
|
-
}, [
|
|
20047
|
-
iconSVG ? h('span', { innerHTML: iconSVG }) : null
|
|
20048
|
-
]);
|
|
20049
|
-
}
|
|
20050
|
-
return null;
|
|
20051
|
-
};
|
|
20052
|
-
// 渲染工具组
|
|
20053
|
-
const renderToolGroup = (tools) => {
|
|
20054
|
-
return h('span', {
|
|
20055
|
-
class: 'ql-formats'
|
|
20056
|
-
}, tools.map(tool => renderToolButton(tool)));
|
|
20057
|
-
};
|
|
20058
|
-
return () => h('div', {
|
|
20059
|
-
class: 'ql-toolbar ql-snow more-tools',
|
|
20060
|
-
style: props.toolbarStyle
|
|
20061
|
-
}, [
|
|
20062
|
-
h('div', {
|
|
20063
|
-
class: 'more-tools-item'
|
|
20064
|
-
}, [
|
|
20065
|
-
// 渲染所有工具组
|
|
20066
|
-
...toolbarOptions.extend.map(toolGroup => renderToolGroup(toolGroup)),
|
|
20067
|
-
]),
|
|
20068
|
-
h('div', {}, [
|
|
20069
|
-
renderToolGroup(['ocr'])
|
|
20070
|
-
])
|
|
20071
|
-
]);
|
|
20072
|
-
}
|
|
20073
|
-
});
|
|
20074
|
-
|
|
20075
20118
|
const QuillEditor = defineComponent({
|
|
20076
20119
|
name: 'QuillEditor',
|
|
20077
20120
|
inheritAttrs: false,
|
|
20078
20121
|
props: {
|
|
20122
|
+
/**
|
|
20123
|
+
* 编辑器内容
|
|
20124
|
+
* 支持多种格式:字符串(HTML)、Delta对象、或undefined/null
|
|
20125
|
+
* 当传入内容时,编辑器会显示对应的内容
|
|
20126
|
+
*/
|
|
20079
20127
|
content: {
|
|
20080
20128
|
type: [String, Object],
|
|
20081
20129
|
},
|
|
20130
|
+
/**
|
|
20131
|
+
* 内容类型
|
|
20132
|
+
* - 'delta': 使用Quill的Delta格式(默认)
|
|
20133
|
+
* - 'html': 使用HTML字符串格式
|
|
20134
|
+
* - 'text': 使用纯文本格式
|
|
20135
|
+
* 影响内容的输入输出格式
|
|
20136
|
+
*/
|
|
20082
20137
|
contentType: {
|
|
20083
20138
|
type: String,
|
|
20084
20139
|
default: 'delta',
|
|
@@ -20086,28 +20141,41 @@ const QuillEditor = defineComponent({
|
|
|
20086
20141
|
return ['delta', 'html', 'text'].includes(value);
|
|
20087
20142
|
},
|
|
20088
20143
|
},
|
|
20144
|
+
/**
|
|
20145
|
+
* 是否启用编辑器
|
|
20146
|
+
* true: 编辑器可编辑(默认)
|
|
20147
|
+
* false: 编辑器禁用,不可编辑
|
|
20148
|
+
*/
|
|
20089
20149
|
enable: {
|
|
20090
20150
|
type: Boolean,
|
|
20091
20151
|
default: true,
|
|
20092
20152
|
},
|
|
20153
|
+
/**
|
|
20154
|
+
* 是否只读模式
|
|
20155
|
+
* true: 编辑器只读,不可编辑
|
|
20156
|
+
* false: 编辑器可编辑(默认)
|
|
20157
|
+
* 与enable的区别:readOnly只是禁止编辑,enable是禁用整个编辑器
|
|
20158
|
+
*/
|
|
20093
20159
|
readOnly: {
|
|
20094
20160
|
type: Boolean,
|
|
20095
20161
|
default: false,
|
|
20096
20162
|
},
|
|
20163
|
+
/**
|
|
20164
|
+
* 占位符文本
|
|
20165
|
+
* 当编辑器内容为空时显示的提示文字
|
|
20166
|
+
* 默认显示"请输入内容"
|
|
20167
|
+
*/
|
|
20097
20168
|
placeholder: {
|
|
20098
20169
|
type: String,
|
|
20099
20170
|
required: false,
|
|
20100
20171
|
default: "请输入内容"
|
|
20101
20172
|
},
|
|
20102
|
-
|
|
20103
|
-
|
|
20104
|
-
|
|
20105
|
-
|
|
20106
|
-
|
|
20107
|
-
|
|
20108
|
-
type: Boolean,
|
|
20109
|
-
default: false,
|
|
20110
|
-
},
|
|
20173
|
+
/**
|
|
20174
|
+
* 工具栏模式
|
|
20175
|
+
* - 'fixed-top': 工具栏固定在顶部,不随内容滚动
|
|
20176
|
+
* - 'embedded': 工具栏嵌入在编辑器中,随内容滚动(默认)
|
|
20177
|
+
* 影响工具栏的定位和滚动行为
|
|
20178
|
+
*/
|
|
20111
20179
|
toolbarMode: {
|
|
20112
20180
|
type: String,
|
|
20113
20181
|
default: "embedded",
|
|
@@ -20115,22 +20183,45 @@ const QuillEditor = defineComponent({
|
|
|
20115
20183
|
return ['fixed-top', 'embedded'].includes(value);
|
|
20116
20184
|
},
|
|
20117
20185
|
},
|
|
20186
|
+
/**
|
|
20187
|
+
* 是否需要折叠工具栏
|
|
20188
|
+
* true: 显示折叠工具栏,点击"更多"展开(默认)
|
|
20189
|
+
* false: 显示完整工具栏,不折叠
|
|
20190
|
+
* 影响工具栏的显示方式
|
|
20191
|
+
*/
|
|
20118
20192
|
needCollapse: {
|
|
20119
20193
|
type: Boolean,
|
|
20120
|
-
default:
|
|
20194
|
+
default: false,
|
|
20121
20195
|
},
|
|
20122
|
-
|
|
20196
|
+
/**
|
|
20197
|
+
* 工具栏自定义样式
|
|
20198
|
+
* 传入CSS样式对象,会应用到工具栏容器上
|
|
20199
|
+
* 例如:{ 'background-color': '#f0f0f0', 'border-radius': '8px' }
|
|
20200
|
+
* 支持所有CSS属性
|
|
20201
|
+
*/
|
|
20123
20202
|
toolbarStyle: {
|
|
20124
20203
|
type: Object,
|
|
20125
20204
|
required: false,
|
|
20126
20205
|
default: () => ({})
|
|
20127
20206
|
},
|
|
20128
|
-
|
|
20207
|
+
/**
|
|
20208
|
+
* 编辑器内容区域自定义样式
|
|
20209
|
+
* 传入CSS样式对象,会应用到编辑器内容区域(.ql-editor)上
|
|
20210
|
+
* 例如:{ 'font-size': '16px', 'line-height': '1.6' }
|
|
20211
|
+
* 支持所有CSS属性
|
|
20212
|
+
*/
|
|
20129
20213
|
editorStyle: {
|
|
20130
20214
|
type: Object,
|
|
20131
20215
|
required: false,
|
|
20132
20216
|
default: () => ({})
|
|
20133
20217
|
},
|
|
20218
|
+
/**
|
|
20219
|
+
* 编辑器主题
|
|
20220
|
+
* - 'snow': 雪花主题,经典工具栏样式(默认)
|
|
20221
|
+
* - 'bubble': 气泡主题,浮动工具栏样式
|
|
20222
|
+
* - '': 无主题,不应用任何样式
|
|
20223
|
+
* 影响编辑器的整体外观和交互方式
|
|
20224
|
+
*/
|
|
20134
20225
|
theme: {
|
|
20135
20226
|
type: String,
|
|
20136
20227
|
default: 'snow',
|
|
@@ -20138,6 +20229,15 @@ const QuillEditor = defineComponent({
|
|
|
20138
20229
|
return ['snow', 'bubble', ''].includes(value);
|
|
20139
20230
|
},
|
|
20140
20231
|
},
|
|
20232
|
+
/**
|
|
20233
|
+
* 工具栏配置
|
|
20234
|
+
* 支持多种格式:
|
|
20235
|
+
* - 字符串: 使用预定义的工具栏配置(如'full', 'short')
|
|
20236
|
+
* - 数组: 自定义工具栏按钮数组
|
|
20237
|
+
* - 对象: 自定义工具栏配置对象
|
|
20238
|
+
* - 布尔值: true显示默认工具栏,false隐藏工具栏
|
|
20239
|
+
* - 以'#'开头: 使用CSS选择器指定的DOM元素作为工具栏
|
|
20240
|
+
*/
|
|
20141
20241
|
toolbar: {
|
|
20142
20242
|
type: [String, Array, Object, Boolean],
|
|
20143
20243
|
required: false,
|
|
@@ -20152,6 +20252,12 @@ const QuillEditor = defineComponent({
|
|
|
20152
20252
|
return true;
|
|
20153
20253
|
},
|
|
20154
20254
|
},
|
|
20255
|
+
/**
|
|
20256
|
+
* Quill模块配置
|
|
20257
|
+
* 支持单个模块或模块数组
|
|
20258
|
+
* 每个模块包含:name(模块名)、module(模块对象)、options(模块选项)
|
|
20259
|
+
* 默认包含blotFormatter模块,用于图片拖拽调整
|
|
20260
|
+
*/
|
|
20155
20261
|
modules: {
|
|
20156
20262
|
type: Object,
|
|
20157
20263
|
required: false,
|
|
@@ -20162,10 +20268,21 @@ const QuillEditor = defineComponent({
|
|
|
20162
20268
|
};
|
|
20163
20269
|
},
|
|
20164
20270
|
},
|
|
20271
|
+
/**
|
|
20272
|
+
* 编辑器选项配置
|
|
20273
|
+
* 传入QuillOptionsStatic对象,用于配置编辑器的各种选项
|
|
20274
|
+
* 这些选项会与默认选项合并,优先级高于默认选项
|
|
20275
|
+
*/
|
|
20165
20276
|
options: {
|
|
20166
20277
|
type: Object,
|
|
20167
20278
|
required: false,
|
|
20168
20279
|
},
|
|
20280
|
+
/**
|
|
20281
|
+
* 全局选项配置
|
|
20282
|
+
* 传入QuillOptionsStatic对象,用于配置编辑器的全局选项
|
|
20283
|
+
* 这些选项会与默认选项合并,优先级最低
|
|
20284
|
+
* 通常用于设置全局默认值
|
|
20285
|
+
*/
|
|
20169
20286
|
globalOptions: {
|
|
20170
20287
|
type: Object,
|
|
20171
20288
|
required: false,
|
|
@@ -20181,6 +20298,7 @@ const QuillEditor = defineComponent({
|
|
|
20181
20298
|
'ready',
|
|
20182
20299
|
'ocr',
|
|
20183
20300
|
'math',
|
|
20301
|
+
'image',
|
|
20184
20302
|
],
|
|
20185
20303
|
setup: (props, ctx) => {
|
|
20186
20304
|
onMounted(() => {
|
|
@@ -20196,7 +20314,6 @@ const QuillEditor = defineComponent({
|
|
|
20196
20314
|
const editorWrapClass = computed(() => {
|
|
20197
20315
|
return {
|
|
20198
20316
|
'quill-editor-container': true,
|
|
20199
|
-
'need-border': props.needBorder,
|
|
20200
20317
|
'more-toolbar': showMoreToolbar.value,
|
|
20201
20318
|
'fixed-top': props.toolbarMode === 'fixed-top',
|
|
20202
20319
|
'embedded': props.toolbarMode === 'embedded',
|
|
@@ -20248,6 +20365,7 @@ const QuillEditor = defineComponent({
|
|
|
20248
20365
|
toolbar.style.display = 'none';
|
|
20249
20366
|
}
|
|
20250
20367
|
const icons = Quill.import('ui/icons');
|
|
20368
|
+
// 因为设计稿的图标样式和quill的图标样式不一致,所以需要手动替换
|
|
20251
20369
|
icons['bold'] = boldSVG;
|
|
20252
20370
|
icons['italic'] = italicSVG;
|
|
20253
20371
|
icons['underline'] = underlineSVG;
|
|
@@ -20298,37 +20416,42 @@ const QuillEditor = defineComponent({
|
|
|
20298
20416
|
if (props.placeholder)
|
|
20299
20417
|
clientOptions.placeholder = props.placeholder;
|
|
20300
20418
|
if (props.toolbar && props.toolbar !== '') {
|
|
20301
|
-
|
|
20302
|
-
|
|
20303
|
-
|
|
20304
|
-
|
|
20305
|
-
|
|
20306
|
-
|
|
20307
|
-
|
|
20308
|
-
|
|
20309
|
-
|
|
20310
|
-
|
|
20311
|
-
|
|
20312
|
-
|
|
20313
|
-
|
|
20314
|
-
|
|
20315
|
-
|
|
20316
|
-
|
|
20317
|
-
|
|
20318
|
-
|
|
20319
|
-
|
|
20320
|
-
|
|
20321
|
-
|
|
20322
|
-
|
|
20323
|
-
|
|
20324
|
-
|
|
20419
|
+
if (props.needCollapse) {
|
|
20420
|
+
clientOptions.modules = {
|
|
20421
|
+
toolbar: "#toolbar",
|
|
20422
|
+
};
|
|
20423
|
+
}
|
|
20424
|
+
else {
|
|
20425
|
+
clientOptions.modules = {
|
|
20426
|
+
toolbar: {
|
|
20427
|
+
// 需要展开的话显示完整的工具栏
|
|
20428
|
+
container: [
|
|
20429
|
+
...toolbarOptions.full,
|
|
20430
|
+
],
|
|
20431
|
+
handlers: {
|
|
20432
|
+
redo: function () {
|
|
20433
|
+
var _a;
|
|
20434
|
+
(_a = quill === null || quill === void 0 ? void 0 : quill.getModule('history')) === null || _a === void 0 ? void 0 : _a.redo();
|
|
20435
|
+
},
|
|
20436
|
+
undo: function () {
|
|
20437
|
+
var _a;
|
|
20438
|
+
(_a = quill === null || quill === void 0 ? void 0 : quill.getModule('history')) === null || _a === void 0 ? void 0 : _a.undo();
|
|
20439
|
+
},
|
|
20440
|
+
ocr: function () {
|
|
20441
|
+
// 按钮点击逻辑
|
|
20442
|
+
ctx.emit('ocr');
|
|
20443
|
+
},
|
|
20444
|
+
math: function () {
|
|
20445
|
+
// 按钮点击逻辑
|
|
20446
|
+
ctx.emit('math');
|
|
20447
|
+
},
|
|
20448
|
+
more: function () {
|
|
20449
|
+
showMoreToolbar.value = !showMoreToolbar.value;
|
|
20450
|
+
}
|
|
20325
20451
|
},
|
|
20326
|
-
more: function () {
|
|
20327
|
-
showMoreToolbar.value = !showMoreToolbar.value;
|
|
20328
|
-
}
|
|
20329
20452
|
},
|
|
20330
|
-
}
|
|
20331
|
-
}
|
|
20453
|
+
};
|
|
20454
|
+
}
|
|
20332
20455
|
}
|
|
20333
20456
|
if (props.modules) {
|
|
20334
20457
|
const modules = (() => {
|
|
@@ -20372,7 +20495,6 @@ const QuillEditor = defineComponent({
|
|
|
20372
20495
|
};
|
|
20373
20496
|
const handleTextChange = (delta, oldContents, source) => {
|
|
20374
20497
|
internalModel = maybeClone(getContents());
|
|
20375
|
-
// Update v-model:content when text changes
|
|
20376
20498
|
if (!internalModelEquals(props.content)) {
|
|
20377
20499
|
ctx.emit('update:content', internalModel);
|
|
20378
20500
|
}
|
|
@@ -20489,6 +20611,23 @@ const QuillEditor = defineComponent({
|
|
|
20489
20611
|
initialize();
|
|
20490
20612
|
});
|
|
20491
20613
|
};
|
|
20614
|
+
const moreToolbarToolClick = (tool) => {
|
|
20615
|
+
var _a, _b;
|
|
20616
|
+
if (!quill)
|
|
20617
|
+
return;
|
|
20618
|
+
if (tool === 'undo') {
|
|
20619
|
+
(_a = quill.getModule('history')) === null || _a === void 0 ? void 0 : _a.undo();
|
|
20620
|
+
}
|
|
20621
|
+
else if (tool === 'redo') {
|
|
20622
|
+
(_b = quill.getModule('history')) === null || _b === void 0 ? void 0 : _b.redo();
|
|
20623
|
+
}
|
|
20624
|
+
else if (tool === 'ocr') {
|
|
20625
|
+
ctx.emit('ocr');
|
|
20626
|
+
}
|
|
20627
|
+
else if (tool === 'math') {
|
|
20628
|
+
ctx.emit('math');
|
|
20629
|
+
}
|
|
20630
|
+
};
|
|
20492
20631
|
watch(() => props.content, (newContent) => {
|
|
20493
20632
|
if (!quill || !newContent || internalModelEquals(newContent))
|
|
20494
20633
|
return;
|
|
@@ -20518,30 +20657,19 @@ const QuillEditor = defineComponent({
|
|
|
20518
20657
|
reinit,
|
|
20519
20658
|
editorWrapClass,
|
|
20520
20659
|
showMoreToolbar,
|
|
20660
|
+
moreToolbarToolClick
|
|
20521
20661
|
};
|
|
20522
20662
|
},
|
|
20523
20663
|
render() {
|
|
20524
20664
|
return [
|
|
20525
20665
|
h('div', { class: this.editorWrapClass }, [
|
|
20526
20666
|
// this.$slots.toolbar?.(), // 工具栏内容固定
|
|
20527
|
-
// 当 needCollapse 为 false 时,显示
|
|
20528
|
-
this.
|
|
20667
|
+
// 当 needCollapse 为 false 时,显示 MoreToolbar 组件
|
|
20668
|
+
this.$props.needCollapse && h(MoreToolbar, {
|
|
20529
20669
|
needCollapse: this.needCollapse,
|
|
20530
20670
|
toolbarStyle: this.$props.toolbarStyle,
|
|
20531
20671
|
onToolClick: (tool) => {
|
|
20532
|
-
|
|
20533
|
-
if (tool === 'undo') {
|
|
20534
|
-
(_b = (_a = this.getQuill()) === null || _a === void 0 ? void 0 : _a.getModule('history')) === null || _b === void 0 ? void 0 : _b.undo();
|
|
20535
|
-
}
|
|
20536
|
-
else if (tool === 'redo') {
|
|
20537
|
-
(_d = (_c = this.getQuill()) === null || _c === void 0 ? void 0 : _c.getModule('history')) === null || _d === void 0 ? void 0 : _d.redo();
|
|
20538
|
-
}
|
|
20539
|
-
else if (tool === 'ocr') {
|
|
20540
|
-
this.$emit('ocr');
|
|
20541
|
-
}
|
|
20542
|
-
else if (tool === 'math') {
|
|
20543
|
-
this.$emit('math');
|
|
20544
|
-
}
|
|
20672
|
+
this.moreToolbarToolClick(tool);
|
|
20545
20673
|
}
|
|
20546
20674
|
}),
|
|
20547
20675
|
h('div', {
|