{"remainingRequest":"G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\src\\components\\common\\Editor.vue?vue&type=style&index=0&lang=css&","dependencies":[{"path":"G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\src\\components\\common\\Editor.vue","mtime":1703907394000},{"path":"G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\node_modules\\css-loader\\dist\\cjs.js","mtime":499162500000},{"path":"G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"G:\\bishe\\2024\\springboot\\143_论文\\039_springboot流浪天使乐园管理系统设计与实现\\vue\\admin\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKLmVkaXRvciB7CiAgbGluZS1oZWlnaHQ6IG5vcm1hbCAhaW1wb3J0YW50Owp9Ci5xbC1zbm93IC5xbC10b29sdGlwW2RhdGEtbW9kZT0ibGluayJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLor7fovpPlhaXpk77mjqXlnLDlnYA6IjsKfQoucWwtc25vdyAucWwtdG9vbHRpcC5xbC1lZGl0aW5nIGEucWwtYWN0aW9uOjphZnRlciB7CiAgYm9yZGVyLXJpZ2h0OiAwcHg7CiAgY29udGVudDogIuS/neWtmCI7CiAgcGFkZGluZy1yaWdodDogMHB4Owp9CgoucWwtc25vdyAucWwtdG9vbHRpcFtkYXRhLW1vZGU9InZpZGVvIl06OmJlZm9yZSB7CiAgY29udGVudDogIuivt+i+k+WFpeinhumikeWcsOWdgDoiOwp9Ci5xbC1jb250YWluZXIgewoJaGVpZ2h0OiA0MDBweDsKfQoKLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItbGFiZWw6OmJlZm9yZSwKLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItaXRlbTo6YmVmb3JlIHsKICBjb250ZW50OiAiMTRweCI7Cn0KLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItbGFiZWxbZGF0YS12YWx1ZT0ic21hbGwiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLXNpemUgLnFsLXBpY2tlci1pdGVtW2RhdGEtdmFsdWU9InNtYWxsIl06OmJlZm9yZSB7CiAgY29udGVudDogIjEwcHgiOwp9Ci5xbC1zbm93IC5xbC1waWNrZXIucWwtc2l6ZSAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9ImxhcmdlIl06OmJlZm9yZSwKLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItaXRlbVtkYXRhLXZhbHVlPSJsYXJnZSJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICIxOHB4IjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLXNpemUgLnFsLXBpY2tlci1sYWJlbFtkYXRhLXZhbHVlPSJodWdlIl06OmJlZm9yZSwKLnFsLXNub3cgLnFsLXBpY2tlci5xbC1zaXplIC5xbC1waWNrZXItaXRlbVtkYXRhLXZhbHVlPSJodWdlIl06OmJlZm9yZSB7CiAgY29udGVudDogIjMycHgiOwp9CgoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsOjpiZWZvcmUsCi5xbC1zbm93IC5xbC1waWNrZXIucWwtaGVhZGVyIC5xbC1waWNrZXItaXRlbTo6YmVmb3JlIHsKICBjb250ZW50OiAi5paH5pysIjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjEiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iMSJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLmoIfpopgxIjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjIiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iMiJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLmoIfpopgyIjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjMiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iMyJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLmoIfpopgzIjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjQiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iNCJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLmoIfpopg0IjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjUiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iNSJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLmoIfpopg1IjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWxhYmVsW2RhdGEtdmFsdWU9IjYiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLWhlYWRlciAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0iNiJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLmoIfpopg2IjsKfQoKLnFsLXNub3cgLnFsLXBpY2tlci5xbC1mb250IC5xbC1waWNrZXItbGFiZWw6OmJlZm9yZSwKLnFsLXNub3cgLnFsLXBpY2tlci5xbC1mb250IC5xbC1waWNrZXItaXRlbTo6YmVmb3JlIHsKICBjb250ZW50OiAi5qCH5YeG5a2X5L2TIjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWZvbnQgLnFsLXBpY2tlci1sYWJlbFtkYXRhLXZhbHVlPSJzZXJpZiJdOjpiZWZvcmUsCi5xbC1zbm93IC5xbC1waWNrZXIucWwtZm9udCAucWwtcGlja2VyLWl0ZW1bZGF0YS12YWx1ZT0ic2VyaWYiXTo6YmVmb3JlIHsKICBjb250ZW50OiAi6KGs57q/5a2X5L2TIjsKfQoucWwtc25vdyAucWwtcGlja2VyLnFsLWZvbnQgLnFsLXBpY2tlci1sYWJlbFtkYXRhLXZhbHVlPSJtb25vc3BhY2UiXTo6YmVmb3JlLAoucWwtc25vdyAucWwtcGlja2VyLnFsLWZvbnQgLnFsLXBpY2tlci1pdGVtW2RhdGEtdmFsdWU9Im1vbm9zcGFjZSJdOjpiZWZvcmUgewogIGNvbnRlbnQ6ICLnrYnlrr3lrZfkvZMiOwp9Cg=="},{"version":3,"sources":["Editor.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;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":"Editor.vue","sourceRoot":"src/components/common","sourcesContent":["<template>\n  <div>\n    <!-- 图片上传组件辅助-->\n    <el-upload\n      class=\"avatar-uploader\"\n      :action=\"getActionUrl\"\n      name=\"file\"\n      :headers=\"header\"\n      :show-file-list=\"false\"\n      :on-success=\"uploadSuccess\"\n      :on-error=\"uploadError\"\n      :before-upload=\"beforeUpload\"\n    ></el-upload>\n\n    <quill-editor\n      class=\"editor\"\n      v-model=\"value\"\n      ref=\"myQuillEditor\"\n      :options=\"editorOption\"\n      @blur=\"onEditorBlur($event)\"\n      @focus=\"onEditorFocus($event)\"\n      @change=\"onEditorChange($event)\"\n    ></quill-editor>\n  </div>\n</template>\n<script>\n// 工具栏配置\nconst toolbarOptions = [\n  [\"bold\", \"italic\", \"underline\", \"strike\"], // 加粗 斜体 下划线 删除线\n  [\"blockquote\", \"code-block\"], // 引用  代码块\n  [{ header: 1 }, { header: 2 }], // 1、2 级标题\n  [{ list: \"ordered\" }, { list: \"bullet\" }], // 有序、无序列表\n  [{ script: \"sub\" }, { script: \"super\" }], // 上标/下标\n  [{ indent: \"-1\" }, { indent: \"+1\" }], // 缩进\n  // [{'direction': 'rtl'}],                         // 文本方向\n  [{ size: [\"small\", false, \"large\", \"huge\"] }], // 字体大小\n  [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题\n  [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色\n  [{ font: [] }], // 字体种类\n  [{ align: [] }], // 对齐方式\n  [\"clean\"], // 清除文本格式\n  [\"link\", \"image\", \"video\"] // 链接、图片、视频\n];\n\nimport { quillEditor } from \"vue-quill-editor\";\nimport \"quill/dist/quill.core.css\";\nimport \"quill/dist/quill.snow.css\";\nimport \"quill/dist/quill.bubble.css\";\n\nexport default {\n  props: {\n    /*编辑器的内容*/\n    value: {\n      type: String\n    },\n    action: {\n      type: String\n    },\n    /*图片大小*/\n    maxSize: {\n      type: Number,\n      default: 4000 //kb\n    }\n  },\n\n  components: {\n    quillEditor\n  },\n\n  data() {\n    return {\n      content: this.value,\n      quillUpdateImg: false, // 根据图片上传状态来确定是否显示loading动画，刚开始是false,不显示\n      editorOption: {\n        placeholder: \"\",\n        theme: \"snow\", // or 'bubble'\n        modules: {\n          toolbar: {\n            container: toolbarOptions,\n            // container: \"#toolbar\",\n            handlers: {\n              image: function(value) {\n                if (value) {\n                  // 触发input框选择图片文件\n                  document.querySelector(\".avatar-uploader input\").click();\n                } else {\n                  this.quill.format(\"image\", false);\n                }\n              }\n              // link: function(value) {\n              //   if (value) {\n              //     var href = prompt('请输入url');\n              //     this.quill.format(\"link\", href);\n              //   } else {\n              //     this.quill.format(\"link\", false);\n              //   }\n              // },\n            }\n          }\n        }\n      },\n      // serverUrl: `${base.url}sys/storage/uploadSwiper?token=${storage.get('token')}`, // 这里写你要上传的图片服务器地址\n      header: {\n        // token: sessionStorage.token\n       'Token': this.$storage.get(\"Token\")\n      } // 有的图片服务器要求请求头需要有token\n    };\n  },\n  computed: {\n    // 计算属性的 getter\n    getActionUrl: function() {\n      // return this.$base.url + this.action + \"?token=\" + this.$storage.get(\"token\");\n      return `/${this.$base.name}/` + this.action;\n    }\n  },\n  methods: {\n    onEditorBlur() {\n      //失去焦点事件\n    },\n    onEditorFocus() {\n      //获得焦点事件\n    },\n    onEditorChange() {\n      console.log(this.value);\n      //内容改变事件\n      this.$emit(\"input\", this.value);\n    },\n    // 富文本图片上传前\n    beforeUpload() {\n      // 显示loading动画\n      this.quillUpdateImg = true;\n    },\n\n    uploadSuccess(res, file) {\n      // res为图片服务器返回的数据\n      // 获取富文本组件实例\n      let quill = this.$refs.myQuillEditor.quill;\n      // 如果上传成功\n      if (res.code === 0) {\n        // 获取光标所在位置\n        let length = quill.getSelection().index;\n        // 插入图片  res.url为服务器返回的图片地址\n        quill.insertEmbed(length, \"image\", this.$base.url+ \"upload/\" +res.file);\n        // 调整光标到最后\n        quill.setSelection(length + 1);\n      } else {\n        this.$message.error(\"图片插入失败\");\n      }\n      // loading动画消失\n      this.quillUpdateImg = false;\n    },\n    // 富文本图片上传失败\n    uploadError() {\n      // loading动画消失\n      this.quillUpdateImg = false;\n      this.$message.error(\"图片插入失败\");\n    }\n  }\n};\n</script> \n\n<style>\n.editor {\n  line-height: normal !important;\n}\n.ql-snow .ql-tooltip[data-mode=\"link\"]::before {\n  content: \"请输入链接地址:\";\n}\n.ql-snow .ql-tooltip.ql-editing a.ql-action::after {\n  border-right: 0px;\n  content: \"保存\";\n  padding-right: 0px;\n}\n\n.ql-snow .ql-tooltip[data-mode=\"video\"]::before {\n  content: \"请输入视频地址:\";\n}\n.ql-container {\n\theight: 400px;\n}\n\n.ql-snow .ql-picker.ql-size .ql-picker-label::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item::before {\n  content: \"14px\";\n}\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=\"small\"]::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=\"small\"]::before {\n  content: \"10px\";\n}\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=\"large\"]::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=\"large\"]::before {\n  content: \"18px\";\n}\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=\"huge\"]::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=\"huge\"]::before {\n  content: \"32px\";\n}\n\n.ql-snow .ql-picker.ql-header .ql-picker-label::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item::before {\n  content: \"文本\";\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]::before {\n  content: \"标题1\";\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]::before {\n  content: \"标题2\";\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]::before {\n  content: \"标题3\";\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]::before {\n  content: \"标题4\";\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]::before {\n  content: \"标题5\";\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]::before {\n  content: \"标题6\";\n}\n\n.ql-snow .ql-picker.ql-font .ql-picker-label::before,\n.ql-snow .ql-picker.ql-font .ql-picker-item::before {\n  content: \"标准字体\";\n}\n.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=\"serif\"]::before,\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=\"serif\"]::before {\n  content: \"衬线字体\";\n}\n.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=\"monospace\"]::before,\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=\"monospace\"]::before {\n  content: \"等宽字体\";\n}\n</style>"]}]}