From 47bee858993346074d26331f5815cd153f86533d Mon Sep 17 00:00:00 2001
From: Your Name <123456>
Date: 星期四, 25 八月 2022 10:51:12 +0800
Subject: [PATCH] 合并
---
.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44__Default_Changelist_.xml | 4
.env.development | 2
src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue | 279 ++++++++++++------------
.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44_[Default_Changelist]/shelved.patch | 343 +++++++++++++++++++++++++++++++
4 files changed, 490 insertions(+), 138 deletions(-)
diff --git a/.env.development b/.env.development
index e88bf91..2fd7878 100644
--- a/.env.development
+++ b/.env.development
@@ -27,6 +27,8 @@
#VITE_API_URL_OUT = 'http://192.168.0.52:8011/safeplatform-out'
#本地外包预发接口地址
+VITE_API_URL_OUT = 'http://192.168.0.52:7021/safeplatform-out'
+
#VITE_API_URL = 'http://192.168.0.52:7021/safeplatform'
#本地测试接口地址
diff --git "a/.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44_\133Default_Changelist\135/shelved.patch" "b/.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44_\133Default_Changelist\135/shelved.patch"
new file mode 100644
index 0000000..956a1a0
--- /dev/null
+++ "b/.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44_\133Default_Changelist\135/shelved.patch"
@@ -0,0 +1,343 @@
+Index: .env.development
+IDEA additional info:
+Subsystem: com.intellij.openapi.diff.impl.patch.BaseRevisionTextPatchEP
+<+># 本地环境\r\nENV = 'development'\r\n\r\nVITE_API_URL = 'http://192.168.0.35:8008'\r\n#李宇飞接口地址\r\n\r\n#VITE_API_URL = 'http://192.168.0.50:8008'\r\n#张凤接口地址\r\n\r\n#VITE_API_URL = 'http://192.168.0.29:8008'\r\n#黄振接口地址\r\n\r\n#VITE_API_URL = 'http://192.168.0.179:8008'\r\n#施正红接口地址\r\n\r\n#VITE_API_URL = 'http://192.168.0.69:8008'\r\n#戚会山接口地址\r\n\r\n#VITE_API_URL = 'http://121.239.169.27:16006/safeplatform'\r\n#线上正式环境接口地址\r\n\r\n#VITE_API_URL_OUT = 'http://121.239.169.27:16006/safeplatform-out'\r\n#线上正式环境外包接口地址\r\n\r\n#VITE_API_URL = 'http://192.168.0.52:8011/safeplatform'\r\n#本地预发接口地址\r\n\r\n#VITE_API_URL_OUT = 'http://192.168.0.52:8011/safeplatform-out'\r\n#本地外包预发接口地址\r\n\r\n#VITE_API_URL = 'http://192.168.0.52:7021/safeplatform'\r\n#本地测试接口地址\r\n\r\n#VITE_API_URL_SOCKET = 'http://192.168.0.52:7021/safeplatform'\r\n#本地测试websocket接口地址\r\n\r\n#VITE_API_URL = 'http://192.168.0.29:7008'\r\n#黄振接口test地址\r\n\r\n#VITE_API_URL_SOCKET = 'http://192.168.0.29:16107'\r\n#黄振websocket test接口地址\r\n\r\n#VITE_API_URL_SOCKET = 'http://192.168.0.29:8018'\r\n#黄振websocket接口地址\r\n
+Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
+<+>UTF-8
+===================================================================
+diff --git a/.env.development b/.env.development
+--- a/.env.development (revision 0203ef4d930ba7a56996debad9d14c9528390fba)
++++ b/.env.development (date 1661395377427)
+@@ -27,6 +27,8 @@
+
+ #VITE_API_URL_OUT = 'http://192.168.0.52:8011/safeplatform-out'
+ #本地外包预发接口地址
++VITE_API_URL_OUT = 'http://192.168.0.52:7021/safeplatform-out'
++
+
+ #VITE_API_URL = 'http://192.168.0.52:7021/safeplatform'
+ #本地测试接口地址
+Index: src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue
+IDEA additional info:
+Subsystem: com.intellij.openapi.diff.impl.patch.BaseRevisionTextPatchEP
+<+><template>\r\n <div class=\"editor\">\r\n <div ref=\"toolbar\" class=\"toolbar\" :class=\"showTop\"></div>\r\n <div ref=\"editor\" class=\"text\"></div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport E from 'wangeditor';\r\n// import {uploadNew,downloadNew} from '@/api/upload';\r\n// import defaultUrl from \"@/api/defaultUrl\";\r\nexport default {\r\n name: 'editoritem',\r\n data() {\r\n return {\r\n // uploadPath,\r\n editor: null,\r\n info_: null,\r\n // defaultUrl:defaultUrl,\r\n defaultUrl: ''\r\n };\r\n },\r\n model: {\r\n prop: 'value',\r\n event: 'change'\r\n },\r\n props: {\r\n value: {\r\n type: String,\r\n default: ''\r\n },\r\n isClear: {\r\n type: Boolean,\r\n default: false\r\n },\r\n showTop: {\r\n type: String,\r\n default: ''\r\n }\r\n },\r\n watch: {\r\n isClear(val) {\r\n // 触发清除文本域内容\r\n if (val) {\r\n this.editor.txt.clear();\r\n this.info_ = null;\r\n }\r\n },\r\n value: function (value) {\r\n if (value !== this.editor.txt.html()) {\r\n this.editor.txt.html(this.value);\r\n }\r\n }\r\n //value为编辑框输入的内容，这里我监听了一下值，当父组件调用得时候，如果给value赋值了，子组件将会显示父组件赋给的值\r\n },\r\n mounted() {\r\n var that = this;\r\n that.setEditor();\r\n that.editor.txt.html(that.value);\r\n },\r\n methods: {\r\n setEditor() {\r\n var that = this;\r\n this.editor = new E(this.$refs.toolbar, this.$refs.editor);\r\n // 配置菜单\r\n this.editor.config.menus = [\r\n 'head', // 标题\r\n 'bold', // 粗体\r\n 'fontSize', // 字号\r\n 'fontName', // 字体\r\n 'italic', // 斜体\r\n 'underline', // 下划线\r\n 'strikeThrough', // 删除线\r\n 'foreColor', // 文字颜色\r\n 'backColor', // 背景颜色\r\n 'link', // 插入链接\r\n 'list', // 列表\r\n 'justify', // 对齐方式\r\n 'quote', // 引用\r\n 'emoticon', // 表情\r\n // 'image', // 插入图片\r\n 'table', // 表格\r\n // 'video', // 插入视频\r\n 'code', // 插入代码\r\n 'undo', // 撤销\r\n 'redo' // 重复\r\n ];\r\n\r\n //配置上传图片\r\n this.editor.config.uploadImgShowBase64 = false; // base 64 存储图片\r\n this.editor.config.uploadImgServer = 'http://otp.cdinfotech.top/file/upload_images'; // 配置服务器端地址\r\n this.editor.config.uploadImgHeaders = {}; // 自定义 header\r\n this.editor.config.uploadFileName = 'file'; // 后端接受上传文件的参数名\r\n this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024; // 将图片大小限制为 2M\r\n this.editor.config.uploadImgMaxLength = 1; // 限制一次最多上传 3 张图片\r\n this.editor.config.uploadImgTimeout = 3 * 60 * 1000; // 设置超时时间\r\n this.editor.config.uploadImgHooks = {\r\n fail: (xhr, editor, result) => {\r\n // 插入图片失败回调\r\n },\r\n success: (xhr, editor, result) => {\r\n // 图片上传成功回调\r\n },\r\n timeout: (xhr, editor) => {\r\n // 网络超时的回调\r\n },\r\n error: (xhr, editor) => {\r\n // 图片上传错误的回调\r\n },\r\n customInsert: (insertImg, result, editor) => {\r\n // 图片上传成功，插入图片的回调\r\n //result为上传图片成功的时候返回的数据，这里我打印了一下发现后台返回的是data：[{url:\"路径的形式\"},...]\r\n // console.log(result.data[0].url)\r\n //insertImg()为插入图片的函数\r\n //循环插入图片\r\n // for (let i = 0; i < 1; i++) {\r\n // console.log(result)\r\n let url = 'http://otp.cdinfotech.top' + result.url;\r\n insertImg(url);\r\n // }\r\n }\r\n };\r\n this.editor.config.customUploadImg = function (files, insert) {\r\n let form = new FormData();\r\n form.append('file', files[0]);\r\n form.append('dir', 'temp1');\r\n // uploadNew(form).then(res=>{\r\n // if(res.result){\r\n // let url = that.defaultUrl+`/upload/downloadNew?path=`+encodeURI(res.data.fileUrl)\r\n // insert(url)\r\n // that.$message(\"上传成功\", 'success');\r\n // }else {\r\n // that.$message.error(\"上传失败\");\r\n // }\r\n //\r\n // })\r\n };\r\n\r\n this.editor.config.onchange = (html) => {\r\n this.info_ = html; // 绑定当前逐渐地值\r\n this.$emit('change', this.info_); // 将内容同步到父组件中\r\n };\r\n // 创建富文本编辑器\r\n this.editor.create();\r\n //是否可编辑\r\n if (this.showTop == 'hiddenClass') {\r\n this.editor.disable();\r\n }\r\n }\r\n }\r\n};\r\n</script>\r\n\r\n<style scoped>\r\n.editor {\r\n /*margin: 0 auto;*/\r\n position: relative;\r\n z-index: 100;\r\n}\r\n.toolbar {\r\n width: 100%;\r\n border: 1px solid #ccc;\r\n}\r\n.text {\r\n border: 1px solid #ccc;\r\n min-height: 250px;\r\n}\r\n.hiddenClass {\r\n display: none;\r\n}\r\n</style>\r\n
+Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
+<+>UTF-8
+===================================================================
+diff --git a/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue b/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue
+--- a/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue (revision 0203ef4d930ba7a56996debad9d14c9528390fba)
++++ b/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue (date 1661395034096)
+@@ -1,171 +1,174 @@
+ <template>
+- <div class="editor">
+- <div ref="toolbar" class="toolbar" :class="showTop"></div>
+- <div ref="editor" class="text"></div>
++ <div class="editor">
++ <div ref="toolbar" class="toolbar" :class="showTop">
++ </div>
++ <div ref="editor" class="text">
+ </div>
++ </div>
+ </template>
+
+ <script>
+-import E from 'wangeditor';
+-// import {uploadNew,downloadNew} from '@/api/upload';
+-// import defaultUrl from "@/api/defaultUrl";
+-export default {
++ import E from 'wangeditor'
++ // import {uploadNew,downloadNew} from '@/api/upload';
++ // import defaultUrl from "@/api/defaultUrl";
++ export default {
+ name: 'editoritem',
+ data() {
+- return {
+- // uploadPath,
+- editor: null,
+- info_: null,
+- // defaultUrl:defaultUrl,
+- defaultUrl: ''
+- };
++ return {
++ // uploadPath,
++ editor: null,
++ info_: null,
++ // defaultUrl:defaultUrl,
++ defaultUrl:'',
++ }
+ },
+ model: {
+- prop: 'value',
+- event: 'change'
++ prop: 'value',
++ event: 'change'
+ },
+ props: {
+- value: {
+- type: String,
+- default: ''
+- },
+- isClear: {
+- type: Boolean,
+- default: false
+- },
+- showTop: {
+- type: String,
+- default: ''
+- }
++ value: {
++ type: String,
++ default: ''
++ },
++ isClear: {
++ type: Boolean,
++ default: false
++ },
++ showTop: {
++ type: String,
++ default: ''
++ },
+ },
+ watch: {
+- isClear(val) {
+- // 触发清除文本域内容
+- if (val) {
+- this.editor.txt.clear();
+- this.info_ = null;
+- }
+- },
+- value: function (value) {
+- if (value !== this.editor.txt.html()) {
+- this.editor.txt.html(this.value);
+- }
+- }
+- //value为编辑框输入的内容，这里我监听了一下值，当父组件调用得时候，如果给value赋值了，子组件将会显示父组件赋给的值
++ isClear(val) {
++ // 触发清除文本域内容
++ if (val) {
++ this.editor.txt.clear()
++ this.info_ = null
++ }
++ },
++ value: function(value) {
++ if (value !== this.editor.txt.html()) {
++ this.editor.txt.html(this.value)
++ }
++ }
++ //value为编辑框输入的内容，这里我监听了一下值，当父组件调用得时候，如果给value赋值了，子组件将会显示父组件赋给的值
+ },
+ mounted() {
+- var that = this;
+- that.setEditor();
+- that.editor.txt.html(that.value);
++ var that =this
++ that.setEditor()
++ that.editor.txt.html(that.value)
+ },
+ methods: {
+- setEditor() {
+- var that = this;
+- this.editor = new E(this.$refs.toolbar, this.$refs.editor);
+- // 配置菜单
+- this.editor.config.menus = [
+- 'head', // 标题
+- 'bold', // 粗体
+- 'fontSize', // 字号
+- 'fontName', // 字体
+- 'italic', // 斜体
+- 'underline', // 下划线
+- 'strikeThrough', // 删除线
+- 'foreColor', // 文字颜色
+- 'backColor', // 背景颜色
+- 'link', // 插入链接
+- 'list', // 列表
+- 'justify', // 对齐方式
+- 'quote', // 引用
+- 'emoticon', // 表情
+- // 'image', // 插入图片
+- 'table', // 表格
+- // 'video', // 插入视频
+- 'code', // 插入代码
+- 'undo', // 撤销
+- 'redo' // 重复
+- ];
++ setEditor() {
++ var that =this
++ this.editor = new E(this.$refs.toolbar, this.$refs.editor)
++ // 配置菜单
++ this.editor.config.menus = [
++ 'head', // 标题
++ 'bold', // 粗体
++ 'fontSize', // 字号
++ 'fontName', // 字体
++ 'italic', // 斜体
++ 'underline', // 下划线
++ 'strikeThrough', // 删除线
++ 'foreColor', // 文字颜色
++ 'backColor', // 背景颜色
++ 'link', // 插入链接
++ 'list', // 列表
++ 'justify', // 对齐方式
++ 'quote', // 引用
++ 'emoticon', // 表情
++ // 'image', // 插入图片
++ 'table', // 表格
++ // 'video', // 插入视频
++ 'code', // 插入代码
++ 'undo', // 撤销
++ 'redo' // 重复
++ ]
+
+- //配置上传图片
+- this.editor.config.uploadImgShowBase64 = false; // base 64 存储图片
+- this.editor.config.uploadImgServer = 'http://otp.cdinfotech.top/file/upload_images'; // 配置服务器端地址
+- this.editor.config.uploadImgHeaders = {}; // 自定义 header
+- this.editor.config.uploadFileName = 'file'; // 后端接受上传文件的参数名
+- this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024; // 将图片大小限制为 2M
+- this.editor.config.uploadImgMaxLength = 1; // 限制一次最多上传 3 张图片
+- this.editor.config.uploadImgTimeout = 3 * 60 * 1000; // 设置超时时间
+- this.editor.config.uploadImgHooks = {
+- fail: (xhr, editor, result) => {
+- // 插入图片失败回调
+- },
+- success: (xhr, editor, result) => {
+- // 图片上传成功回调
+- },
+- timeout: (xhr, editor) => {
+- // 网络超时的回调
+- },
+- error: (xhr, editor) => {
+- // 图片上传错误的回调
+- },
+- customInsert: (insertImg, result, editor) => {
+- // 图片上传成功，插入图片的回调
+- //result为上传图片成功的时候返回的数据，这里我打印了一下发现后台返回的是data：[{url:"路径的形式"},...]
+- // console.log(result.data[0].url)
+- //insertImg()为插入图片的函数
+- //循环插入图片
+- // for (let i = 0; i < 1; i++) {
+- // console.log(result)
+- let url = 'http://otp.cdinfotech.top' + result.url;
+- insertImg(url);
+- // }
+- }
+- };
+- this.editor.config.customUploadImg = function (files, insert) {
+- let form = new FormData();
+- form.append('file', files[0]);
+- form.append('dir', 'temp1');
+- // uploadNew(form).then(res=>{
+- // if(res.result){
+- // let url = that.defaultUrl+`/upload/downloadNew?path=`+encodeURI(res.data.fileUrl)
+- // insert(url)
+- // that.$message("上传成功", 'success');
+- // }else {
+- // that.$message.error("上传失败");
+- // }
+- //
+- // })
+- };
++ //配置上传图片
++ this.editor.config.uploadImgShowBase64 = false // base 64 存储图片
++ this.editor.config.uploadImgServer = 'http://otp.cdinfotech.top/file/upload_images'// 配置服务器端地址
++ this.editor.config.uploadImgHeaders = { }// 自定义 header
++ this.editor.config.uploadFileName = 'file' // 后端接受上传文件的参数名
++ this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024 // 将图片大小限制为 2M
++ this.editor.config.uploadImgMaxLength = 1 // 限制一次最多上传 3 张图片
++ this.editor.config.uploadImgTimeout = 3 * 60 * 1000 // 设置超时时间
++ this.editor.config.uploadImgHooks = {
++ fail: (xhr, editor, result) => {
++ // 插入图片失败回调
++ },
++ success: (xhr, editor, result) => {
++ // 图片上传成功回调
++ },
++ timeout: (xhr, editor) => {
++ // 网络超时的回调
++ },
++ error: (xhr, editor) => {
++ // 图片上传错误的回调
++ },
++ customInsert: (insertImg, result, editor) => {
++ // 图片上传成功，插入图片的回调
++ //result为上传图片成功的时候返回的数据，这里我打印了一下发现后台返回的是data：[{url:"路径的形式"},...]
++ // console.log(result.data[0].url)
++ //insertImg()为插入图片的函数
++ //循环插入图片
++ // for (let i = 0; i < 1; i++) {
++ // console.log(result)
++ let url = "http://otp.cdinfotech.top"+result.url
++ insertImg(url)
++ // }
++ }
++ }
++ this.editor.config.customUploadImg = function (files, insert) {
++ let form = new FormData();
++ form.append('file', files[0]);
++ form.append('dir', 'temp1')
++ // uploadNew(form).then(res=>{
++ // if(res.result){
++ // let url = that.defaultUrl+`/upload/downloadNew?path=`+encodeURI(res.data.fileUrl)
++ // insert(url)
++ // that.$message("上传成功", 'success');
++ // }else {
++ // that.$message.error("上传失败");
++ // }
++ //
++ // })
++ }
+
+- this.editor.config.onchange = (html) => {
+- this.info_ = html; // 绑定当前逐渐地值
+- this.$emit('change', this.info_); // 将内容同步到父组件中
+- };
+- // 创建富文本编辑器
+- this.editor.create();
+- //是否可编辑
+- if (this.showTop == 'hiddenClass') {
+- this.editor.disable();
+- }
+- }
++ this.editor.config.onchange = (html) => {
++ this.info_ = html // 绑定当前逐渐地值
++ this.$emit('change', this.info_) // 将内容同步到父组件中
++ }
++ // 创建富文本编辑器
++ this.editor.create()
++ //是否可编辑
++ if (this.showTop=='hiddenClass'){
++ this.editor.disable()
++ }
++ }
+ }
+-};
++ }
+ </script>
+
+ <style scoped>
+-.editor {
++ .editor {
+ /*margin: 0 auto;*/
+ position: relative;
+ z-index: 100;
+-}
+-.toolbar {
++ }
++ .toolbar {
+ width: 100%;
+ border: 1px solid #ccc;
+-}
+-.text {
++ }
++ .text {
+ border: 1px solid #ccc;
+ min-height: 250px;
+-}
+-.hiddenClass {
++ }
++ .hiddenClass{
+ display: none;
+-}
++
++ }
+ </style>
diff --git a/.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44__Default_Changelist_.xml b/.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44__Default_Changelist_.xml
new file mode 100644
index 0000000..561dcf1
--- /dev/null
+++ b/.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44__Default_Changelist_.xml
@@ -0,0 +1,4 @@
+<changelist name="Uncommitted_changes_before_Update_at_2022_8_25_10_44_[Default_Changelist]" date="1661395456701" recycled="true" deleted="true">
+ <option name="PATH" value="$PROJECT_DIR$/.idea/shelf/Uncommitted_changes_before_Update_at_2022_8_25_10_44_[Default_Changelist]/shelved.patch" />
+ <option name="DESCRIPTION" value="Uncommitted changes before Update at 2022/8/25 10:44 [Default Changelist]" />
+</changelist>
\ No newline at end of file
diff --git a/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue b/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue
index 9fd7c9e..3953efc 100644
--- a/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue
+++ b/src/views/accidentManagementSystem/accidentCases/component/wangEditor/index.vue
@@ -1,171 +1,174 @@
<template>
- <div class="editor">
- <div ref="toolbar" class="toolbar" :class="showTop"></div>
- <div ref="editor" class="text"></div>
+ <div class="editor">
+ <div ref="toolbar" class="toolbar" :class="showTop">
</div>
+ <div ref="editor" class="text">
+ </div>
+ </div>
</template>
<script>
-import E from 'wangeditor';
-// import {uploadNew,downloadNew} from '@/api/upload';
-// import defaultUrl from "@/api/defaultUrl";
-export default {
+ import E from 'wangeditor'
+ // import {uploadNew,downloadNew} from '@/api/upload';
+ // import defaultUrl from "@/api/defaultUrl";
+ export default {
name: 'editoritem',
data() {
- return {
- // uploadPath,
- editor: null,
- info_: null,
- // defaultUrl:defaultUrl,
- defaultUrl: ''
- };
+ return {
+ // uploadPath,
+ editor: null,
+ info_: null,
+ // defaultUrl:defaultUrl,
+ defaultUrl:'',
+ }
},
model: {
- prop: 'value',
- event: 'change'
+ prop: 'value',
+ event: 'change'
},
props: {
- value: {
- type: String,
- default: ''
- },
- isClear: {
- type: Boolean,
- default: false
- },
- showTop: {
- type: String,
- default: ''
- }
+ value: {
+ type: String,
+ default: ''
+ },
+ isClear: {
+ type: Boolean,
+ default: false
+ },
+ showTop: {
+ type: String,
+ default: ''
+ },
},
watch: {
- isClear(val) {
- // 触发清除文本域内容
- if (val) {
- this.editor.txt.clear();
- this.info_ = null;
- }
- },
- value: function (value) {
- if (value !== this.editor.txt.html()) {
- this.editor.txt.html(this.value);
- }
+ isClear(val) {
+ // 触发清除文本域内容
+ if (val) {
+ this.editor.txt.clear()
+ this.info_ = null
}
- //value为编辑框输入的内容，这里我监听了一下值，当父组件调用得时候，如果给value赋值了，子组件将会显示父组件赋给的值
+ },
+ value: function(value) {
+ if (value !== this.editor.txt.html()) {
+ this.editor.txt.html(this.value)
+ }
+ }
+ //value为编辑框输入的内容，这里我监听了一下值，当父组件调用得时候，如果给value赋值了，子组件将会显示父组件赋给的值
},
mounted() {
- var that = this;
- that.setEditor();
- that.editor.txt.html(that.value);
+ var that =this
+ that.setEditor()
+ that.editor.txt.html(that.value)
},
methods: {
- setEditor() {
- var that = this;
- this.editor = new E(this.$refs.toolbar, this.$refs.editor);
- // 配置菜单
- this.editor.config.menus = [
- 'head', // 标题
- 'bold', // 粗体
- 'fontSize', // 字号
- 'fontName', // 字体
- 'italic', // 斜体
- 'underline', // 下划线
- 'strikeThrough', // 删除线
- 'foreColor', // 文字颜色
- 'backColor', // 背景颜色
- 'link', // 插入链接
- 'list', // 列表
- 'justify', // 对齐方式
- 'quote', // 引用
- 'emoticon', // 表情
- // 'image', // 插入图片
- 'table', // 表格
- // 'video', // 插入视频
- 'code', // 插入代码
- 'undo', // 撤销
- 'redo' // 重复
- ];
+ setEditor() {
+ var that =this
+ this.editor = new E(this.$refs.toolbar, this.$refs.editor)
+ // 配置菜单
+ this.editor.config.menus = [
+ 'head', // 标题
+ 'bold', // 粗体
+ 'fontSize', // 字号
+ 'fontName', // 字体
+ 'italic', // 斜体
+ 'underline', // 下划线
+ 'strikeThrough', // 删除线
+ 'foreColor', // 文字颜色
+ 'backColor', // 背景颜色
+ 'link', // 插入链接
+ 'list', // 列表
+ 'justify', // 对齐方式
+ 'quote', // 引用
+ 'emoticon', // 表情
+ // 'image', // 插入图片
+ 'table', // 表格
+ // 'video', // 插入视频
+ 'code', // 插入代码
+ 'undo', // 撤销
+ 'redo' // 重复
+ ]
- //配置上传图片
- this.editor.config.uploadImgShowBase64 = false; // base 64 存储图片
- this.editor.config.uploadImgServer = 'http://otp.cdinfotech.top/file/upload_images'; // 配置服务器端地址
- this.editor.config.uploadImgHeaders = {}; // 自定义 header
- this.editor.config.uploadFileName = 'file'; // 后端接受上传文件的参数名
- this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024; // 将图片大小限制为 2M
- this.editor.config.uploadImgMaxLength = 1; // 限制一次最多上传 3 张图片
- this.editor.config.uploadImgTimeout = 3 * 60 * 1000; // 设置超时时间
- this.editor.config.uploadImgHooks = {
- fail: (xhr, editor, result) => {
- // 插入图片失败回调
- },
- success: (xhr, editor, result) => {
- // 图片上传成功回调
- },
- timeout: (xhr, editor) => {
- // 网络超时的回调
- },
- error: (xhr, editor) => {
- // 图片上传错误的回调
- },
- customInsert: (insertImg, result, editor) => {
- // 图片上传成功，插入图片的回调
- //result为上传图片成功的时候返回的数据，这里我打印了一下发现后台返回的是data：[{url:"路径的形式"},...]
- // console.log(result.data[0].url)
- //insertImg()为插入图片的函数
- //循环插入图片
- // for (let i = 0; i < 1; i++) {
- // console.log(result)
- let url = 'http://otp.cdinfotech.top' + result.url;
- insertImg(url);
- // }
- }
- };
- this.editor.config.customUploadImg = function (files, insert) {
- let form = new FormData();
- form.append('file', files[0]);
- form.append('dir', 'temp1');
- // uploadNew(form).then(res=>{
- // if(res.result){
- // let url = that.defaultUrl+`/upload/downloadNew?path=`+encodeURI(res.data.fileUrl)
- // insert(url)
- // that.$message("上传成功", 'success');
- // }else {
- // that.$message.error("上传失败");
- // }
- //
- // })
- };
-
- this.editor.config.onchange = (html) => {
- this.info_ = html; // 绑定当前逐渐地值
- this.$emit('change', this.info_); // 将内容同步到父组件中
- };
- // 创建富文本编辑器
- this.editor.create();
- //是否可编辑
- if (this.showTop == 'hiddenClass') {
- this.editor.disable();
- }
+ //配置上传图片
+ this.editor.config.uploadImgShowBase64 = false // base 64 存储图片
+ this.editor.config.uploadImgServer = 'http://otp.cdinfotech.top/file/upload_images'// 配置服务器端地址
+ this.editor.config.uploadImgHeaders = { }// 自定义 header
+ this.editor.config.uploadFileName = 'file' // 后端接受上传文件的参数名
+ this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024 // 将图片大小限制为 2M
+ this.editor.config.uploadImgMaxLength = 1 // 限制一次最多上传 3 张图片
+ this.editor.config.uploadImgTimeout = 3 * 60 * 1000 // 设置超时时间
+ this.editor.config.uploadImgHooks = {
+ fail: (xhr, editor, result) => {
+ // 插入图片失败回调
+ },
+ success: (xhr, editor, result) => {
+ // 图片上传成功回调
+ },
+ timeout: (xhr, editor) => {
+ // 网络超时的回调
+ },
+ error: (xhr, editor) => {
+ // 图片上传错误的回调
+ },
+ customInsert: (insertImg, result, editor) => {
+ // 图片上传成功，插入图片的回调
+ //result为上传图片成功的时候返回的数据，这里我打印了一下发现后台返回的是data：[{url:"路径的形式"},...]
+ // console.log(result.data[0].url)
+ //insertImg()为插入图片的函数
+ //循环插入图片
+ // for (let i = 0; i < 1; i++) {
+ // console.log(result)
+ let url = "http://otp.cdinfotech.top"+result.url
+ insertImg(url)
+ // }
+ }
}
+ this.editor.config.customUploadImg = function (files, insert) {
+ let form = new FormData();
+ form.append('file', files[0]);
+ form.append('dir', 'temp1')
+ // uploadNew(form).then(res=>{
+ // if(res.result){
+ // let url = that.defaultUrl+`/upload/downloadNew?path=`+encodeURI(res.data.fileUrl)
+ // insert(url)
+ // that.$message("上传成功", 'success');
+ // }else {
+ // that.$message.error("上传失败");
+ // }
+ //
+ // })
+ }
+
+ this.editor.config.onchange = (html) => {
+ this.info_ = html // 绑定当前逐渐地值
+ this.$emit('change', this.info_) // 将内容同步到父组件中
+ }
+ // 创建富文本编辑器
+ this.editor.create()
+ //是否可编辑
+ if (this.showTop=='hiddenClass'){
+ this.editor.disable()
+ }
+ }
}
-};
+ }
</script>
<style scoped>
-.editor {
+ .editor {
/*margin: 0 auto;*/
position: relative;
z-index: 100;
-}
-.toolbar {
+ }
+ .toolbar {
width: 100%;
border: 1px solid #ccc;
-}
-.text {
+ }
+ .text {
border: 1px solid #ccc;
min-height: 250px;
-}
-.hiddenClass {
+ }
+ .hiddenClass{
display: none;
-}
+
+ }
</style>
--
Gitblit v1.9.2