1 line
18 KiB
JSON
1 line
18 KiB
JSON
{"remainingRequest":"D:\\workspace\\car_web\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\workspace\\car_web\\src\\components\\Editor\\index.vue?vue&type=script&lang=js","dependencies":[{"path":"D:\\workspace\\car_web\\src\\components\\Editor\\index.vue","mtime":1708672711875},{"path":"D:\\workspace\\car_web\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\workspace\\car_web\\node_modules\\babel-loader\\lib\\index.js","mtime":456789000000},{"path":"D:\\workspace\\car_web\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\workspace\\car_web\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KDQppbXBvcnQgUXVpbGwgZnJvbSAicXVpbGwiOw0KaW1wb3J0ICJxdWlsbC9kaXN0L3F1aWxsLmNvcmUuY3NzIjsNCmltcG9ydCAicXVpbGwvZGlzdC9xdWlsbC5zbm93LmNzcyI7DQppbXBvcnQgInF1aWxsL2Rpc3QvcXVpbGwuYnViYmxlLmNzcyI7DQppbXBvcnQgeyBnZXRUb2tlbiB9IGZyb20gIkAvdXRpbHMvYXV0aCI7DQoNCmV4cG9ydCBkZWZhdWx0IHsNCiAgbmFtZTogIkVkaXRvciIsDQogIHByb3BzOiB7DQogICAgLyog57yW6L6R5Zmo55qE5YaF5a65ICovDQogICAgdmFsdWU6IHsNCiAgICAgIHR5cGU6IFN0cmluZywNCiAgICAgIGRlZmF1bHQ6ICIiLA0KICAgIH0sDQogICAgLyog6auY5bqmICovDQogICAgaGVpZ2h0OiB7DQogICAgICB0eXBlOiBOdW1iZXIsDQogICAgICBkZWZhdWx0OiBudWxsLA0KICAgIH0sDQogICAgLyog5pyA5bCP6auY5bqmICovDQogICAgbWluSGVpZ2h0OiB7DQogICAgICB0eXBlOiBOdW1iZXIsDQogICAgICBkZWZhdWx0OiBudWxsLA0KICAgIH0sDQogICAgLyog5Y+q6K+7ICovDQogICAgcmVhZE9ubHk6IHsNCiAgICAgIHR5cGU6IEJvb2xlYW4sDQogICAgICBkZWZhdWx0OiBmYWxzZSwNCiAgICB9LA0KICAgIC8qIOS4iuS8oOaWh+S7tuWkp+Wwj+mZkOWItihNQikgKi8NCiAgICBmaWxlU2l6ZTogew0KICAgICAgdHlwZTogTnVtYmVyLA0KICAgICAgZGVmYXVsdDogNSwNCiAgICB9LA0KICAgIC8qIOexu+Wei++8iGJhc2U2NOagvOW8j+OAgXVybOagvOW8j++8iSAqLw0KICAgIHR5cGU6IHsNCiAgICAgIHR5cGU6IFN0cmluZywNCiAgICAgIGRlZmF1bHQ6ICJ1cmwiLA0KICAgIH0NCiAgfSwNCiAgZGF0YSgpIHsNCiAgICByZXR1cm4gew0KICAgICAgdXBsb2FkVXJsOiBwcm9jZXNzLmVudi5WVUVfQVBQX0JBU0VfQVBJICsgIi9maWxlL3VwbG9hZCIsIC8vIOS4iuS8oOeahOWbvueJh+acjeWKoeWZqOWcsOWdgA0KICAgICAgaGVhZGVyczogew0KICAgICAgICBBdXRob3JpemF0aW9uOiAiQmVhcmVyICIgKyBnZXRUb2tlbigpDQogICAgICB9LA0KICAgICAgUXVpbGw6IG51bGwsDQogICAgICBjdXJyZW50VmFsdWU6ICIiLA0KICAgICAgb3B0aW9uczogew0KICAgICAgICB0aGVtZTogInNub3ciLA0KICAgICAgICBib3VuZHM6IGRvY3VtZW50LmJvZHksDQogICAgICAgIGRlYnVnOiAid2FybiIsDQogICAgICAgIG1vZHVsZXM6IHsNCiAgICAgICAgICAvLyDlt6XlhbfmoI/phY3nva4NCiAgICAgICAgICB0b29sYmFyOiBbDQogICAgICAgICAgICBbImJvbGQiLCAiaXRhbGljIiwgInVuZGVybGluZSIsICJzdHJpa2UiXSwgICAgICAgLy8g5Yqg57KXIOaWnOS9kyDkuIvliJLnur8g5Yig6Zmk57q/DQogICAgICAgICAgICBbImJsb2NrcXVvdGUiLCAiY29kZS1ibG9jayJdLCAgICAgICAgICAgICAgICAgICAgLy8g5byV55SoICDku6PnoIHlnZcNCiAgICAgICAgICAgIFt7IGxpc3Q6ICJvcmRlcmVkIiB9LCB7IGxpc3Q6ICJidWxsZXQiIH1dLCAgICAgICAvLyDmnInluo/jgIHml6Dluo/liJfooagNCiAgICAgICAgICAgIFt7IGluZGVudDogIi0xIiB9LCB7IGluZGVudDogIisxIiB9XSwgICAgICAgICAgICAvLyDnvKnov5sNCiAgICAgICAgICAgIFt7IHNpemU6IFsic21hbGwiLCBmYWxzZSwgImxhcmdlIiwgImh1Z2UiXSB9XSwgICAvLyDlrZfkvZPlpKflsI8NCiAgICAgICAgICAgIFt7IGhlYWRlcjogWzEsIDIsIDMsIDQsIDUsIDYsIGZhbHNlXSB9XSwgICAgICAgICAvLyDmoIfpopgNCiAgICAgICAgICAgIFt7IGNvbG9yOiBbXSB9LCB7IGJhY2tncm91bmQ6IFtdIH1dLCAgICAgICAgICAgICAvLyDlrZfkvZPpopzoibLjgIHlrZfkvZPog4zmma/popzoibINCiAgICAgICAgICAgIFt7IGFsaWduOiBbXSB9XSwgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvLyDlr7npvZDmlrnlvI8NCiAgICAgICAgICAgIFsiY2xlYW4iXSwgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvLyDmuIXpmaTmlofmnKzmoLzlvI8NCiAgICAgICAgICAgIFsibGluayIsICJpbWFnZSIsICJ2aWRlbyJdICAgICAgICAgICAgICAgICAgICAgICAvLyDpk77mjqXjgIHlm77niYfjgIHop4bpopENCiAgICAgICAgICBdLA0KICAgICAgICB9LA0KICAgICAgICBwbGFjZWhvbGRlcjogIuivt+i+k+WFpeWGheWuuSIsDQogICAgICAgIHJlYWRPbmx5OiB0aGlzLnJlYWRPbmx5LA0KICAgICAgfSwNCiAgICB9Ow0KICB9LA0KICBjb21wdXRlZDogew0KICAgIHN0eWxlcygpIHsNCiAgICAgIGxldCBzdHlsZSA9IHt9Ow0KICAgICAgaWYgKHRoaXMubWluSGVpZ2h0KSB7DQogICAgICAgIHN0eWxlLm1pbkhlaWdodCA9IGAke3RoaXMubWluSGVpZ2h0fXB4YDsNCiAgICAgIH0NCiAgICAgIGlmICh0aGlzLmhlaWdodCkgew0KICAgICAgICBzdHlsZS5oZWlnaHQgPSBgJHt0aGlzLmhlaWdodH1weGA7DQogICAgICB9DQogICAgICByZXR1cm4gc3R5bGU7DQogICAgfSwNCiAgfSwNCiAgd2F0Y2g6IHsNCiAgICB2YWx1ZTogew0KICAgICAgaGFuZGxlcih2YWwpIHsNCiAgICAgICAgaWYgKHZhbCAhPT0gdGhpcy5jdXJyZW50VmFsdWUpIHsNCiAgICAgICAgICB0aGlzLmN1cnJlbnRWYWx1ZSA9IHZhbCA9PT0gbnVsbCA/ICIiIDogdmFsOw0KICAgICAgICAgIGlmICh0aGlzLlF1aWxsKSB7DQogICAgICAgICAgICB0aGlzLlF1aWxsLnBhc3RlSFRNTCh0aGlzLmN1cnJlbnRWYWx1ZSk7DQogICAgICAgICAgfQ0KICAgICAgICB9DQogICAgICB9LA0KICAgICAgaW1tZWRpYXRlOiB0cnVlLA0KICAgIH0sDQogIH0sDQogIG1vdW50ZWQoKSB7DQogICAgdGhpcy5pbml0KCk7DQogIH0sDQogIGJlZm9yZURlc3Ryb3koKSB7DQogICAgdGhpcy5RdWlsbCA9IG51bGw7DQogIH0sDQogIG1ldGhvZHM6IHsNCiAgICBpbml0KCkgew0KICAgICAgY29uc3QgZWRpdG9yID0gdGhpcy4kcmVmcy5lZGl0b3I7DQogICAgICB0aGlzLlF1aWxsID0gbmV3IFF1aWxsKGVkaXRvciwgdGhpcy5vcHRpb25zKTsNCiAgICAgIC8vIOWmguaenOiuvue9ruS6huS4iuS8oOWcsOWdgOWImeiHquWumuS5ieWbvueJh+S4iuS8oOS6i+S7tg0KICAgICAgaWYgKHRoaXMudHlwZSA9PSAndXJsJykgew0KICAgICAgICBsZXQgdG9vbGJhciA9IHRoaXMuUXVpbGwuZ2V0TW9kdWxlKCJ0b29sYmFyIik7DQogICAgICAgIHRvb2xiYXIuYWRkSGFuZGxlcigiaW1hZ2UiLCAodmFsdWUpID0+IHsNCiAgICAgICAgICBpZiAodmFsdWUpIHsNCiAgICAgICAgICAgIHRoaXMuJHJlZnMudXBsb2FkLiRjaGlsZHJlblswXS4kcmVmcy5pbnB1dC5jbGljaygpOw0KICAgICAgICAgIH0gZWxzZSB7DQogICAgICAgICAgICB0aGlzLnF1aWxsLmZvcm1hdCgiaW1hZ2UiLCBmYWxzZSk7DQogICAgICAgICAgfQ0KICAgICAgICB9KTsNCiAgICAgIH0NCiAgICAgIHRoaXMuUXVpbGwucGFzdGVIVE1MKHRoaXMuY3VycmVudFZhbHVlKTsNCiAgICAgIHRoaXMuUXVpbGwub24oInRleHQtY2hhbmdlIiwgKGRlbHRhLCBvbGREZWx0YSwgc291cmNlKSA9PiB7DQogICAgICAgIGNvbnN0IGh0bWwgPSB0aGlzLiRyZWZzLmVkaXRvci5jaGlsZHJlblswXS5pbm5lckhUTUw7DQogICAgICAgIGNvbnN0IHRleHQgPSB0aGlzLlF1aWxsLmdldFRleHQoKTsNCiAgICAgICAgY29uc3QgcXVpbGwgPSB0aGlzLlF1aWxsOw0KICAgICAgICB0aGlzLmN1cnJlbnRWYWx1ZSA9IGh0bWw7DQogICAgICAgIHRoaXMuJGVtaXQoImlucHV0IiwgaHRtbCk7DQogICAgICAgIHRoaXMuJGVtaXQoIm9uLWNoYW5nZSIsIHsgaHRtbCwgdGV4dCwgcXVpbGwgfSk7DQogICAgICB9KTsNCiAgICAgIHRoaXMuUXVpbGwub24oInRleHQtY2hhbmdlIiwgKGRlbHRhLCBvbGREZWx0YSwgc291cmNlKSA9PiB7DQogICAgICAgIHRoaXMuJGVtaXQoIm9uLXRleHQtY2hhbmdlIiwgZGVsdGEsIG9sZERlbHRhLCBzb3VyY2UpOw0KICAgICAgfSk7DQogICAgICB0aGlzLlF1aWxsLm9uKCJzZWxlY3Rpb24tY2hhbmdlIiwgKHJhbmdlLCBvbGRSYW5nZSwgc291cmNlKSA9PiB7DQogICAgICAgIHRoaXMuJGVtaXQoIm9uLXNlbGVjdGlvbi1jaGFuZ2UiLCByYW5nZSwgb2xkUmFuZ2UsIHNvdXJjZSk7DQogICAgICB9KTsNCiAgICAgIHRoaXMuUXVpbGwub24oImVkaXRvci1jaGFuZ2UiLCAoZXZlbnROYW1lLCAuLi5hcmdzKSA9PiB7DQogICAgICAgIHRoaXMuJGVtaXQoIm9uLWVkaXRvci1jaGFuZ2UiLCBldmVudE5hbWUsIC4uLmFyZ3MpOw0KICAgICAgfSk7DQogICAgfSwNCiAgICAvLyDkuIrkvKDliY3moKHmo4DmoLzlvI/lkozlpKflsI8NCiAgICBoYW5kbGVCZWZvcmVVcGxvYWQoZmlsZSkgew0KICAgICAgY29uc3QgdHlwZSA9IFsiaW1hZ2UvanBlZyIsICJpbWFnZS9qcGciLCAiaW1hZ2UvcG5nIiwgImltYWdlL3N2ZyJdOw0KICAgICAgY29uc3QgaXNKUEcgPSB0eXBlLmluY2x1ZGVzKGZpbGUudHlwZSk7DQogICAgICAvLyDmo4Dpqozmlofku7bmoLzlvI8NCiAgICAgIGlmICghaXNKUEcpIHsNCiAgICAgICAgdGhpcy4kbWVzc2FnZS5lcnJvcihg5Zu+54mH5qC85byP6ZSZ6K+vIWApOw0KICAgICAgICByZXR1cm4gZmFsc2U7DQogICAgICB9DQogICAgICAvLyDmoKHmo4Dmlofku7blpKflsI8NCiAgICAgIGlmICh0aGlzLmZpbGVTaXplKSB7DQogICAgICAgIGNvbnN0IGlzTHQgPSBmaWxlLnNpemUgLyAxMDI0IC8gMTAyNCA8IHRoaXMuZmlsZVNpemU7DQogICAgICAgIGlmICghaXNMdCkgew0KICAgICAgICAgIHRoaXMuJG1lc3NhZ2UuZXJyb3IoYOS4iuS8oOaWh+S7tuWkp+Wwj+S4jeiDvei2hei/hyAke3RoaXMuZmlsZVNpemV9IE1CIWApOw0KICAgICAgICAgIHJldHVybiBmYWxzZTsNCiAgICAgICAgfQ0KICAgICAgfQ0KICAgICAgcmV0dXJuIHRydWU7DQogICAgfSwNCiAgICBoYW5kbGVVcGxvYWRTdWNjZXNzKHJlcywgZmlsZSkgew0KICAgICAgLy8g5aaC5p6c5LiK5Lyg5oiQ5YqfDQogICAgICBpZiAocmVzLmNvZGUgPT0gMjAwKSB7DQogICAgICAgIC8vIOiOt+WPluWvjOaWh+acrOe7hOS7tuWunuS+iw0KICAgICAgICBsZXQgcXVpbGwgPSB0aGlzLlF1aWxsOw0KICAgICAgICAvLyDojrflj5blhYnmoIfmiYDlnKjkvY3nva4NCiAgICAgICAgbGV0IGxlbmd0aCA9IHF1aWxsLmdldFNlbGVjdGlvbigpLmluZGV4Ow0KICAgICAgICAvLyDmj5LlhaXlm77niYcgIHJlcy51cmzkuLrmnI3liqHlmajov5Tlm57nmoTlm77niYflnLDlnYANCiAgICAgICAgcXVpbGwuaW5zZXJ0RW1iZWQobGVuZ3RoLCAiaW1hZ2UiLCByZXMuZGF0YS51cmwpOw0KICAgICAgICAvLyDosIPmlbTlhYnmoIfliLDmnIDlkI4NCiAgICAgICAgcXVpbGwuc2V0U2VsZWN0aW9uKGxlbmd0aCArIDEpOw0KICAgICAgfSBlbHNlIHsNCiAgICAgICAgdGhpcy4kbWVzc2FnZS5lcnJvcigi5Zu+54mH5o+S5YWl5aSx6LSlIik7DQogICAgICB9DQogICAgfSwNCiAgICBoYW5kbGVVcGxvYWRFcnJvcigpIHsNCiAgICAgIHRoaXMuJG1lc3NhZ2UuZXJyb3IoIuWbvueJh+aPkuWFpeWksei0pSIpOw0KICAgIH0sDQogIH0sDQp9Ow0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAoBA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/Editor","sourcesContent":["<template>\r\n <div>\r\n <el-upload\r\n :action=\"uploadUrl\"\r\n :before-upload=\"handleBeforeUpload\"\r\n :on-success=\"handleUploadSuccess\"\r\n :on-error=\"handleUploadError\"\r\n name=\"file\"\r\n :show-file-list=\"false\"\r\n :headers=\"headers\"\r\n style=\"display: none\"\r\n ref=\"upload\"\r\n v-if=\"this.type == 'url'\"\r\n >\r\n </el-upload>\r\n <div class=\"editor\" ref=\"editor\" :style=\"styles\"></div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport Quill from \"quill\";\r\nimport \"quill/dist/quill.core.css\";\r\nimport \"quill/dist/quill.snow.css\";\r\nimport \"quill/dist/quill.bubble.css\";\r\nimport { getToken } from \"@/utils/auth\";\r\n\r\nexport default {\r\n name: \"Editor\",\r\n props: {\r\n /* 编辑器的内容 */\r\n value: {\r\n type: String,\r\n default: \"\",\r\n },\r\n /* 高度 */\r\n height: {\r\n type: Number,\r\n default: null,\r\n },\r\n /* 最小高度 */\r\n minHeight: {\r\n type: Number,\r\n default: null,\r\n },\r\n /* 只读 */\r\n readOnly: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /* 上传文件大小限制(MB) */\r\n fileSize: {\r\n type: Number,\r\n default: 5,\r\n },\r\n /* 类型(base64格式、url格式) */\r\n type: {\r\n type: String,\r\n default: \"url\",\r\n }\r\n },\r\n data() {\r\n return {\r\n uploadUrl: process.env.VUE_APP_BASE_API + \"/file/upload\", // 上传的图片服务器地址\r\n headers: {\r\n Authorization: \"Bearer \" + getToken()\r\n },\r\n Quill: null,\r\n currentValue: \"\",\r\n options: {\r\n theme: \"snow\",\r\n bounds: document.body,\r\n debug: \"warn\",\r\n modules: {\r\n // 工具栏配置\r\n toolbar: [\r\n [\"bold\", \"italic\", \"underline\", \"strike\"], // 加粗 斜体 下划线 删除线\r\n [\"blockquote\", \"code-block\"], // 引用 代码块\r\n [{ list: \"ordered\" }, { list: \"bullet\" }], // 有序、无序列表\r\n [{ indent: \"-1\" }, { indent: \"+1\" }], // 缩进\r\n [{ size: [\"small\", false, \"large\", \"huge\"] }], // 字体大小\r\n [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题\r\n [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色\r\n [{ align: [] }], // 对齐方式\r\n [\"clean\"], // 清除文本格式\r\n [\"link\", \"image\", \"video\"] // 链接、图片、视频\r\n ],\r\n },\r\n placeholder: \"请输入内容\",\r\n readOnly: this.readOnly,\r\n },\r\n };\r\n },\r\n computed: {\r\n styles() {\r\n let style = {};\r\n if (this.minHeight) {\r\n style.minHeight = `${this.minHeight}px`;\r\n }\r\n if (this.height) {\r\n style.height = `${this.height}px`;\r\n }\r\n return style;\r\n },\r\n },\r\n watch: {\r\n value: {\r\n handler(val) {\r\n if (val !== this.currentValue) {\r\n this.currentValue = val === null ? \"\" : val;\r\n if (this.Quill) {\r\n this.Quill.pasteHTML(this.currentValue);\r\n }\r\n }\r\n },\r\n immediate: true,\r\n },\r\n },\r\n mounted() {\r\n this.init();\r\n },\r\n beforeDestroy() {\r\n this.Quill = null;\r\n },\r\n methods: {\r\n init() {\r\n const editor = this.$refs.editor;\r\n this.Quill = new Quill(editor, this.options);\r\n // 如果设置了上传地址则自定义图片上传事件\r\n if (this.type == 'url') {\r\n let toolbar = this.Quill.getModule(\"toolbar\");\r\n toolbar.addHandler(\"image\", (value) => {\r\n if (value) {\r\n this.$refs.upload.$children[0].$refs.input.click();\r\n } else {\r\n this.quill.format(\"image\", false);\r\n }\r\n });\r\n }\r\n this.Quill.pasteHTML(this.currentValue);\r\n this.Quill.on(\"text-change\", (delta, oldDelta, source) => {\r\n const html = this.$refs.editor.children[0].innerHTML;\r\n const text = this.Quill.getText();\r\n const quill = this.Quill;\r\n this.currentValue = html;\r\n this.$emit(\"input\", html);\r\n this.$emit(\"on-change\", { html, text, quill });\r\n });\r\n this.Quill.on(\"text-change\", (delta, oldDelta, source) => {\r\n this.$emit(\"on-text-change\", delta, oldDelta, source);\r\n });\r\n this.Quill.on(\"selection-change\", (range, oldRange, source) => {\r\n this.$emit(\"on-selection-change\", range, oldRange, source);\r\n });\r\n this.Quill.on(\"editor-change\", (eventName, ...args) => {\r\n this.$emit(\"on-editor-change\", eventName, ...args);\r\n });\r\n },\r\n // 上传前校检格式和大小\r\n handleBeforeUpload(file) {\r\n const type = [\"image/jpeg\", \"image/jpg\", \"image/png\", \"image/svg\"];\r\n const isJPG = type.includes(file.type);\r\n // 检验文件格式\r\n if (!isJPG) {\r\n this.$message.error(`图片格式错误!`);\r\n return false;\r\n }\r\n // 校检文件大小\r\n if (this.fileSize) {\r\n const isLt = file.size / 1024 / 1024 < this.fileSize;\r\n if (!isLt) {\r\n this.$message.error(`上传文件大小不能超过 ${this.fileSize} MB!`);\r\n return false;\r\n }\r\n }\r\n return true;\r\n },\r\n handleUploadSuccess(res, file) {\r\n // 如果上传成功\r\n if (res.code == 200) {\r\n // 获取富文本组件实例\r\n let quill = this.Quill;\r\n // 获取光标所在位置\r\n let length = quill.getSelection().index;\r\n // 插入图片 res.url为服务器返回的图片地址\r\n quill.insertEmbed(length, \"image\", res.data.url);\r\n // 调整光标到最后\r\n quill.setSelection(length + 1);\r\n } else {\r\n this.$message.error(\"图片插入失败\");\r\n }\r\n },\r\n handleUploadError() {\r\n this.$message.error(\"图片插入失败\");\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style>\r\n.editor, .ql-toolbar {\r\n white-space: pre-wrap !important;\r\n line-height: normal !important;\r\n}\r\n.quill-img {\r\n display: none;\r\n}\r\n.ql-snow .ql-tooltip[data-mode=\"link\"]::before {\r\n content: \"请输入链接地址:\";\r\n}\r\n.ql-snow .ql-tooltip.ql-editing a.ql-action::after {\r\n border-right: 0px;\r\n content: \"保存\";\r\n padding-right: 0px;\r\n}\r\n.ql-snow .ql-tooltip[data-mode=\"video\"]::before {\r\n content: \"请输入视频地址:\";\r\n}\r\n.ql-snow .ql-picker.ql-size .ql-picker-label::before,\r\n.ql-snow .ql-picker.ql-size .ql-picker-item::before {\r\n content: \"14px\";\r\n}\r\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=\"small\"]::before,\r\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=\"small\"]::before {\r\n content: \"10px\";\r\n}\r\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=\"large\"]::before,\r\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=\"large\"]::before {\r\n content: \"18px\";\r\n}\r\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=\"huge\"]::before,\r\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=\"huge\"]::before {\r\n content: \"32px\";\r\n}\r\n.ql-snow .ql-picker.ql-header .ql-picker-label::before,\r\n.ql-snow .ql-picker.ql-header .ql-picker-item::before {\r\n content: \"文本\";\r\n}\r\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]::before,\r\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]::before {\r\n content: \"标题1\";\r\n}\r\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]::before,\r\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]::before {\r\n content: \"标题2\";\r\n}\r\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]::before,\r\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]::before {\r\n content: \"标题3\";\r\n}\r\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]::before,\r\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]::before {\r\n content: \"标题4\";\r\n}\r\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]::before,\r\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]::before {\r\n content: \"标题5\";\r\n}\r\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]::before,\r\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]::before {\r\n content: \"标题6\";\r\n}\r\n.ql-snow .ql-picker.ql-font .ql-picker-label::before,\r\n.ql-snow .ql-picker.ql-font .ql-picker-item::before {\r\n content: \"标准字体\";\r\n}\r\n.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=\"serif\"]::before,\r\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=\"serif\"]::before {\r\n content: \"衬线字体\";\r\n}\r\n.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=\"monospace\"]::before,\r\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=\"monospace\"]::before {\r\n content: \"等宽字体\";\r\n}\r\n</style>\r\n"]}]} |