| 1 |
- {"remainingRequest":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\boman-framwork\\ruoyi-ui\\src\\components\\Editor\\index.vue?vue&type=style&index=0&lang=css&","dependencies":[{"path":"E:\\boman-framwork\\ruoyi-ui\\src\\components\\Editor\\index.vue","mtime":1619333322695},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\css-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\boman-framwork\\ruoyi-ui\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKDQouZWRpdG9yLCAucWwtdG9vbGJhciB7DQogIHdoaXRlLXNwYWNlOiBwcmUtd3JhcCFpbXBvcnRhbnQ7DQogIGxpbmUtaGVpZ2h0OiBub3JtYWwgIWltcG9ydGFudDsNCn0NCi5xdWlsbC1pbWcgew0KICBkaXNwbGF5OiBub25lOw0KfQ0KLnFsLXNub3cgLnFsLXRvb2x0aXBbZGF0YS1tb2RlPSJsaW5rIl06OmJlZm9yZSB7DQogIGNvbnRlbnQ6ICLor7fovpPlhaXpk77mjqXlnLDlnYA6IjsNCn0NCi5xbC1zbm93IC5xbC10b29sdGlwLnFsLWVkaXRpbmcgYS5xbC1hY3Rpb246OmFmdGVyIHsNCiAgYm9yZGVyLXJpZ2h0OiAwcHg7DQogIGNvbnRlbnQ6ICLkv53lrZgiOw0KICBwYWRkaW5nLXJpZ2h0OiAwcHg7DQp9DQoNCi5xbC1zbm93IC5xbC10b29sdGlwW2RhdGEtbW9kZT0idmlkZW8iXTo6YmVmb3JlIHsNCiAgY29udGVudDogIuivt+i+k+WFpeinhumikeWcsOWdgDoiOw0KfQ0KDQoucWwtc25vdyAucWwtcGlja2VyLnFsLXNpemUgLnFsLXBpY2tlci1sYWJlbDo6YmVmb3JlLA0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItaXRlbTo6YmVmb3JlIHsNCiAgY29udGVudDogIjE0cHgiOw0KfQ0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItbGFiZWxbZGF0YS12YWx1ZT0ic21hbGwiXTo6YmVmb3JlLA0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItaXRlbVtkYXRhLXZhbHVlPSJzbWFsbCJdOjpiZWZvcmUgew0KICBjb250ZW50OiAiMTBweCI7DQp9DQoucWwtc25vdyAucWwtcGlja2VyLnFsLXNpemUgLnFsLXBpY2tlci1sYWJlbFtkYXRhLXZhbHVlPSJsYXJnZSJdOjpiZWZvcmUsDQoucWwtc25vdyAucWwtcGlja2VyLnFsLXNpemUgLnFsLXBpY2tlci1pdGVtW2RhdGEtdmFsdWU9ImxhcmdlIl06OmJlZm9yZSB7DQogIGNvbnRlbnQ6ICIxOHB4IjsNCn0NCi5xbC1zbm93IC5xbC1waWNrZXIucWwtc2l6ZSAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9Imh1Z2UiXTo6YmVmb3JlLA0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItaXRlbVtkYXRhLXZhbHVlPSJodWdlIl06OmJlZm9yZSB7DQogIGNvbnRlbnQ6ICIzMnB4IjsNCn0NCg0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1oZWFkZXIgLnFsLXBpY2tlci1sYWJlbDo6YmVmb3JlLA0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1oZWFkZXIgLnFsLXBpY2tlci1pdGVtOjpiZWZvcmUgew0KICBjb250ZW50OiAi5paH5pysIjsNCn0NCi5xbC1zbm93IC5xbC1waWNrZXIucWwtaGVhZGVyIC5xbC1waWNrZXItbGFiZWxbZGF0YS12YWx1ZT0iMSJdOjpiZWZvcmUsDQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iMSJdOjpiZWZvcmUgew0KICBjb250ZW50OiAi5qCH6aKYMSI7DQp9DQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjIiXTo6YmVmb3JlLA0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1oZWFkZXIgLnFsLXBpY2tlci1pdGVtW2RhdGEtdmFsdWU9IjIiXTo6YmVmb3JlIHsNCiAgY29udGVudDogIuagh+mimDIiOw0KfQ0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1oZWFkZXIgLnFsLXBpY2tlci1sYWJlbFtkYXRhLXZhbHVlPSIzIl06OmJlZm9yZSwNCi5xbC1zbm93IC5xbC1waWNrZXIucWwtaGVhZGVyIC5xbC1waWNrZXItaXRlbVtkYXRhLXZhbHVlPSIzIl06OmJlZm9yZSB7DQogIGNvbnRlbnQ6ICLmoIfpopgzIjsNCn0NCi5xbC1zbm93IC5xbC1waWNrZXIucWwtaGVhZGVyIC5xbC1waWNrZXItbGFiZWxbZGF0YS12YWx1ZT0iNCJdOjpiZWZvcmUsDQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iNCJdOjpiZWZvcmUgew0KICBjb250ZW50OiAi5qCH6aKYNCI7DQp9DQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjUiXTo6YmVmb3JlLA0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1oZWFkZXIgLnFsLXBpY2tlci1pdGVtW2RhdGEtdmFsdWU9IjUiXTo6YmVmb3JlIHsNCiAgY29udGVudDogIuagh+mimDUiOw0KfQ0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1oZWFkZXIgLnFsLXBpY2tlci1sYWJlbFtkYXRhLXZhbHVlPSI2Il06OmJlZm9yZSwNCi5xbC1zbm93IC5xbC1waWNrZXIucWwtaGVhZGVyIC5xbC1waWNrZXItaXRlbVtkYXRhLXZhbHVlPSI2Il06OmJlZm9yZSB7DQogIGNvbnRlbnQ6ICLmoIfpopg2IjsNCn0NCg0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1mb250IC5xbC1waWNrZXItbGFiZWw6OmJlZm9yZSwNCi5xbC1zbm93IC5xbC1waWNrZXIucWwtZm9udCAucWwtcGlja2VyLWl0ZW06OmJlZm9yZSB7DQogIGNvbnRlbnQ6ICLmoIflh4blrZfkvZMiOw0KfQ0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1mb250IC5xbC1waWNrZXItbGFiZWxbZGF0YS12YWx1ZT0ic2VyaWYiXTo6YmVmb3JlLA0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1mb250IC5xbC1waWNrZXItaXRlbVtkYXRhLXZhbHVlPSJzZXJpZiJdOjpiZWZvcmUgew0KICBjb250ZW50OiAi6KGs57q/5a2X5L2TIjsNCn0NCi5xbC1zbm93IC5xbC1waWNrZXIucWwtZm9udCAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9Im1vbm9zcGFjZSJdOjpiZWZvcmUsDQoucWwtc25vdyAucWwtcGlja2VyLnFsLWZvbnQgLnFsLXBpY2tlci1pdGVtW2RhdGEtdmFsdWU9Im1vbm9zcGFjZSJdOjpiZWZvcmUgew0KICBjb250ZW50OiAi562J5a695a2X5L2TIjsNCn0NCg=="},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyHA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/Editor","sourcesContent":["<template>\r\n <div class=\"editor\" ref=\"editor\" :style=\"styles\"></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\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 },\r\n data() {\r\n return {\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 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};\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\r\n.ql-snow .ql-tooltip[data-mode=\"video\"]::before {\r\n content: \"请输入视频地址:\";\r\n}\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\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\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"]}]}
|
