修复bug

package-lock.json

@@ -934,6 +934,15 @@
         "regenerator-runtime": "^0.13.4"
       }
     },
+    "@babel/runtime-corejs3": {
+      "version": "7.16.3",
+      "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.16.3.tgz",
+      "integrity": "sha512-IAdDC7T0+wEB4y2gbIL0uOXEYpiZEeuFUTVbdGq+UwCcF35T/tS8KrmMomEwEc5wBbyfH3PJVpTSUqrhPDXFcQ==",
+      "requires": {
+        "core-js-pure": "^3.19.0",
+        "regenerator-runtime": "^0.13.4"
+      }
+    },
     "@babel/template": {
       "version": "7.8.6",
       "resolved": "https://registry.npm.taobao.org/@babel/template/download/@babel/template-7.8.6.tgz",
@@ -3509,6 +3518,11 @@
         }
       }
     },
+    "core-js-pure": {
+      "version": "3.19.1",
+      "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.19.1.tgz",
+      "integrity": "sha512-Q0Knr8Es84vtv62ei6/6jXH/7izKmOrtrxH9WJTHLCMAVeU+8TF8z8Nr08CsH4Ot0oJKzBzJJL9SJBYIv7WlfQ=="
+    },
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "http://registry.npm.taobao.org/core-util-is/download/core-util-is-1.0.2.tgz",
@@ -8951,8 +8965,7 @@
     "regenerator-runtime": {
       "version": "0.13.5",
       "resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.13.5.tgz?cache=0&sync_timestamp=1584052481783&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fregenerator-runtime%2Fdownload%2Fregenerator-runtime-0.13.5.tgz",
-      "integrity": "sha1-2Hih0JS0MG0QuQlkhLM+vVXiZpc=",
-      "dev": true
+      "integrity": "sha1-2Hih0JS0MG0QuQlkhLM+vVXiZpc="
     },
     "regenerator-transform": {
       "version": "0.14.4",
@@ -10972,6 +10985,31 @@
         "quill": "^1.3.6"
       }
     },
+    "wangeditor": {
+      "version": "4.7.9",
+      "resolved": "https://registry.npmjs.org/wangeditor/-/wangeditor-4.7.9.tgz",
+      "integrity": "sha512-x8u/SJQ4pHLp597CzWm/0DrITUGpNaPk4jms03VYSaIt1mSoF5wd+dAxBsfPgmaYrYWx6CZtyGZA4Kv6s1vvlw==",
+      "requires": {
+        "@babel/runtime": "^7.11.2",
+        "@babel/runtime-corejs3": "^7.11.2",
+        "tslib": "^2.1.0"
+      },
+      "dependencies": {
+        "@babel/runtime": {
+          "version": "7.16.3",
+          "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.3.tgz",
+          "integrity": "sha512-WBwekcqacdY2e9AF/Q7WLFUWmdJGJTkbjqTjoMDgXkVZ3ZRUvOPsLb5KdwISoQVsbP+DQzVZW4Zhci0DvpbNTQ==",
+          "requires": {
+            "regenerator-runtime": "^0.13.4"
+          }
+        },
+        "tslib": {
+          "version": "2.3.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
+          "integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
+        }
+      }
+    },
     "watchpack": {
       "version": "1.7.2",
       "resolved": "https://registry.npm.taobao.org/watchpack/download/watchpack-1.7.2.tgz",

package.json

@@ -18,7 +18,8 @@
     "vue-layer": "^1.2.5",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "^3.1.6",
-    "vue2-editor": "^2.10.2"
+    "vue2-editor": "^2.10.2",
+    "wangeditor": "^4.7.9"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.3.0",

src/assets/css/reset.less

@@ -106,4 +106,16 @@ table th > .cell{
 
 textarea{
   height: 8rem!important;
+}
+.w-e-menu {
+	z-index: 2 !important;
+}
+.w-e-text-container {
+	z-index: 1 !important;
+}
+.w-e-toolbar {
+	z-index: 10 !important;
+}
+.w-e-toolbar .w-e-menu:nth-of-type(19) {
+	display: none !important;
 }

src/configue/http.js

@@ -11,8 +11,8 @@ let loading = ''
 // 不校验token的api
 const notTokenApis = ['/admin/login']
 // 配置请求域名
-const serverName = 'http://192.168.0.135:8001/'
-// const serverName = isProduction ? 'http://8.135.106.227:8001/' : 'http://8.135.106.227:8001/'
+// const serverName = 'http://192.168.0.135:8001/'
+const serverName = isProduction ? 'http://8.135.106.227:8001/' : 'http://8.135.106.227:8001/'
 // http://192.168.0.44:8100/web/index.html#/
 
 const serverLocation = window.location.hostname

src/pages/activity/activityEdit.vue

@@ -25,7 +25,22 @@
       <el-row style="margin-bottom: 100px">
         <el-col :span="24">
           <el-form-item label="内容" prop="content" maxlength="30">
-            <vue-editor class="quill-editor" v-model="form.content" />
+            <!-- <vue-editor class="quill-editor" v-model="form.content" /> -->
+            <el-upload
+              class="upload-demo"
+              action="http://192.168.0.135:8001//manage/activity/upload"
+              multiple
+              :before-upload="beforethumbUpload"
+              :on-success="upload_thumb_success"
+              :headers="headerObj"
+            >
+              <el-button size="small" type="primary">视频上传</el-button>
+              <div slot="tip" class="el-upload__tip">
+                只能上传MP4文件，且不超过500M
+              </div>
+            </el-upload>
+
+            <div id="div2" style="z-index: 1;margin-top: 40px;"></div>
           </el-form-item>
         </el-col>
       </el-row>
@@ -44,14 +59,16 @@
 </template>
 
 <script>
-import { VueEditor} from "vue2-editor";
+import E from "wangeditor";
+// import { VueEditor} from "vue2-editor";
 import * as common from "@/util/commonfn.js";
 export default {
   components: {
-    VueEditor
+    // VueEditor
   },
   data() {
     return {
+      editor: "",
       headerObj: {
         token: window.localStorage.getItem("token"),
       },
@@ -64,7 +81,7 @@ export default {
       rules: {
         name: [{ required: true, message: "请输入标题", trigger: "blur"},{max: 30,message: "不能超过30个字符"}],
         type: [{ required: true, message: "请选择类别", trigger: "blur" }],
-        content: [{ required: true, message: "请输入内容", trigger: "blur" }],
+        // content: [{ required: true, message: "请输入内容", trigger: "blur" }],
       },
       uploadUrl: `${this.$serverName}manage/activity/upload`,
     };
@@ -84,6 +101,32 @@ export default {
     },
   },
   methods: {
+    beforethumbUpload (file) {
+      // console.log('上传文件前校验', file)
+      // 限制图片大小和格式
+      const sizeOk = file.size / 1024 / 1024 < 500
+      const typeOk = file.type === 'video/mp4' 
+      return new Promise((resolve, reject) => {
+        if (!typeOk) {
+          this.$message.error('视频格式有误！')
+          reject(file)
+        } else if (!sizeOk) {
+          this.$message.error('视频大小超过500M！')
+          reject(file)
+        } else {
+          resolve(file)
+        }
+      })
+    },
+    upload_thumb_success (data) {
+      console.log('上传文件成功', data)
+      this.$message.success('上传成功')
+      // this.editor.txt.html(`${this.editor.txt.html()}<p><video src="${data.data.ossUrl}" controls style="width:50%"></video></p>`);
+     
+      this.editor.txt.append(`<video src="${data.data.ossUrl}" controls style="width:100%"></video><p>&emsp;&emsp;</p>`)
+      // this.editor.txt.append(`<p>123456</p>`)
+    },   
+     //上传视频方法
     quxiao(reload) {
       this.$layer.close(this.layerid);
       //点击取消 不刷新列表   点击确认 保存成功刷新列表
@@ -102,8 +145,9 @@ export default {
       });
     },
     async save() {
-      let { content, name, type, id,code } = this.form;
-      let data = { content, name, type, id,code };
+      let {  name, type, id,code } = this.form;
+      let data = {  name, type, id,code };
+      data.content = this.editor.txt.html();
       let result = await this.$http({
         method: "post",
         data,
@@ -121,6 +165,29 @@ export default {
     iframeData: {
       handler: function () {
         this.form = this.iframeData;
+        this.$nextTick(() => {
+          setTimeout(() => {
+            this.editor = new E("#div2");
+            // 配置字体
+            this.editor.config.fontNames = [
+              "黑体",
+              "仿宋",
+              "楷体",
+              "标楷体",
+              "华文仿宋",
+              "华文楷体",
+              "宋体",
+              "微软雅黑",
+              "Arial",
+              "Tahoma",
+              "Verdana",
+              "Times New Roman",
+            ];
+            this.editor.config.uploadImgShowBase64 = true; //图片地址
+            this.editor.create();
+            this.editor.txt.html(this.iframeData.content);
+          }, 100);
+        });
       },
       deep: true,
       immediate: true,
@@ -136,6 +203,15 @@ export default {
 </script>
 
 <style lang="less" scoped>
+/deep/.el-upload-list__item-name{
+  display: none !important;
+}
+/deep/.el-upload-list__item-status-label{
+  display: none !important;
+}
+// /deep/.el-icon-close{
+//   display: none !important;
+// }
 .quill-editor {
     line-height: normal;
 }

src/pages/collection/collectionEdit.vue

@@ -50,10 +50,7 @@
       <el-row>
         <el-col :span="11">
           <el-form-item prop="type" label="藏品形式">
-            <el-select
-              v-model="ruleForm.type"
-              placeholder="请选择藏品形式"
-            >
+            <el-select v-model="ruleForm.type" placeholder="请选择藏品形式">
               <el-option
                 v-for="item in typeList"
                 :key="item.id"
@@ -107,10 +104,11 @@
       </el-row>
       <el-row>
         <el-form-item label="藏品介绍" prop="description">
-          <vue-editor class="quill-editor" v-model="ruleForm.description" />
+          <!-- <vue-editor class="quill-editor" v-model="ruleForm.description" /> -->
+          <div id="div1" style="z-index: 1"></div>
         </el-form-item>
       </el-row>
-      
+
       <el-row>
         <el-form-item>
           <el-button type="primary" @click="submitForm('ruleForm')"
@@ -124,14 +122,16 @@
 </template>
 
 <script>
+import E from "wangeditor";
 import * as common from "@/util/commonfn.js";
-import { VueEditor } from "vue2-editor";
+// import { VueEditor } from "vue2-editor";
 export default {
   components: {
-    VueEditor,
+    // VueEditor,
   },
   data() {
     return {
+      editor: "",
       refresh: "未刷新",
       headerObj: {
         token: window.localStorage.getItem("token"),
@@ -145,14 +145,16 @@ export default {
         goodsTypeId: [
           { required: true, message: "请选择藏品分类", trigger: "blur" },
         ],
-        goodsAgeId: [{ required: true, message: "请选择年代", trigger: "blur" }],
-        description: [
-          { required: true, message: "请输入藏品介绍", trigger: "blur" },
+        goodsAgeId: [
+          { required: true, message: "请选择年代", trigger: "blur" },
         ],
+        // description: [
+        //   { required: true, message: "请输入藏品介绍", trigger: "blur" },
+        // ],
         modelUrl: [
           { required: true, message: "请输入3D模型", trigger: "blur" },
         ],
-        type:[{ required: true, message: "请选择藏品形式", trigger: "blur" }]
+        type: [{ required: true, message: "请选择藏品形式", trigger: "blur" }],
       },
       token: window.localStorage.getItem("token"),
       uploadUrl: `${this.$serverName}manage/goods/upload`,
@@ -160,8 +162,8 @@ export default {
       collectionSort: [],
       collectionYears: [],
       typeList: [
-        { id: 0, name: "图片", value:"img" },
-        { id: 1, name: "三维", value:"model" },
+        { id: 0, name: "图片", value: "img" },
+        { id: 1, name: "三维", value: "model" },
       ],
     };
   },
@@ -206,22 +208,21 @@ export default {
         name,
         id,
         goodsTypeId,
-        description,
         modelUrl,
         thumb,
         type,
-        goodsAgeId
+        goodsAgeId,
       } = this.ruleForm;
       let data = {
         name,
         id,
         goodsTypeId,
-        description,
         modelUrl,
         thumb,
         type,
-        goodsAgeId
+        goodsAgeId,
       };
+      data.description=this.editor.txt.html()
       let result = await this.$http({
         method: "post",
         data,
@@ -283,6 +284,31 @@ export default {
   watch: {
     iframeData: {
       handler: function () {
+        this.$nextTick(() => {
+          setTimeout(() => {
+            //富文本
+            this.editor = new E("#div1");
+            // 配置字体
+            this.editor.config.fontNames = [
+              "黑体",
+              "仿宋",
+              "楷体",
+              "标楷体",
+              "华文仿宋",
+              "华文楷体",
+              "宋体",
+              "微软雅黑",
+              "Arial",
+              "Tahoma",
+              "Verdana",
+              "Times New Roman",
+            ];
+            this.editor.config.uploadImgShowBase64 = true; //图片地址
+            this.editor.config.showLinkVideo = false;
+            this.editor.create();
+            this.editor.txt.html(this.iframeData.description)
+          }, 100);
+        });
         this.ruleForm = this.iframeData;
       },
       deep: true,

src/pages/exhibition/exhibitionEdit.vue

@@ -7,7 +7,6 @@
       label-width="100px"
       class="demo-ruleForm"
     >
-
       <el-row>
         <el-col :span="12">
           <el-form-item label="类型" prop="type">
@@ -19,7 +18,6 @@
         </el-col>
       </el-row>
 
-
       <el-row>
         <el-col :span="12">
           <el-form-item label="标题:" prop="name" maxlength="30">
@@ -27,7 +25,7 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <el-row v-show="form.type==='time'"> 
+      <el-row v-show="form.type === 'time'">
         <el-col :span="12">
           <el-form-item label="展览时间:" prop="startTime">
             <el-date-picker
@@ -94,7 +92,22 @@
       <el-row style="margin-bottom: 100px">
         <el-col :span="24">
           <el-form-item label="内容" prop="content" maxlength="30">
-            <vue-editor class="quill-editor" v-model="form.content" />
+            <el-upload
+              class="upload-demo"
+              action="http://192.168.0.135:8001//manage/activity/upload"
+              multiple
+              :before-upload="beforethumbUpload"
+              :on-success="upload_thumb_success"
+              :headers="headerObj"
+            >
+              <el-button size="small" type="primary">视频上传</el-button>
+              <div slot="tip" class="el-upload__tip">
+                只能上传MP4文件，且不超过500M
+              </div>
+            </el-upload>
+
+            <div id="div2" style="z-index: 1; margin-top: 40px"></div>
+            <!-- <vue-editor class="quill-editor" v-model="form.content" /> -->
           </el-form-item>
         </el-col>
       </el-row>
@@ -113,12 +126,13 @@
 </template>
 
 <script>
+import E from "wangeditor";
 import * as common from "@/util/commonfn.js";
-import { VueEditor } from "vue2-editor";
+// import { VueEditor } from "vue2-editor";
 export default {
-  name:'tanchuang',
+  name: "tanchuang",
   components: {
-    VueEditor,
+    // VueEditor,
   },
   data() {
     let startTimeRule = (rule, value, callback) => {
@@ -155,12 +169,13 @@ export default {
       }
     };
     return {
+      editor: "",
       refresh: "未刷新",
       headerObj: {
         token: window.localStorage.getItem("token"),
       },
       form: {
-        type:"time",
+        type: "time",
         name: "",
         content: "",
         startTime: "",
@@ -170,14 +185,14 @@ export default {
       rules: {
         name: [{ required: true, message: "请输入标题", trigger: "blur" }],
         startTime: [
-          // { required: true, message: "请输入开始时间", trigger: "blur"},
-          { validator: startTimeRule, trigger: "blur"},
+          { required: true, message: "请输入开始时间", trigger: "blur" },
+          { validator: startTimeRule, trigger: "blur" },
         ],
         endTime: [
-          // { required: true, message: "请输入结束时间", trigger: "blur" },
-          { validator: endTimeRule,  trigger: "blur" },
+          { required: true, message: "请输入结束时间", trigger: "blur" },
+          { validator: endTimeRule, trigger: "blur" },
         ],
-        content: [{ required: true, message: "请输入内容", trigger: "blur" }],
+        // content: [{ required: true, message: "请输入内容", trigger: "blur" }],
         type: [{ required: true, message: "请输入内容", trigger: "blur" }],
       },
       token: window.localStorage.getItem("token"),
@@ -200,6 +215,31 @@ export default {
     },
   },
   methods: {
+    beforethumbUpload(file) {
+      // console.log('上传文件前校验', file)
+      // 限制图片大小和格式
+      const sizeOk = file.size / 1024 / 1024 < 500;
+      const typeOk = file.type === "video/mp4";
+      return new Promise((resolve, reject) => {
+        if (!typeOk) {
+          this.$message.error("视频格式有误！");
+          reject(file);
+        } else if (!sizeOk) {
+          this.$message.error("视频大小超过500M！");
+          reject(file);
+        } else {
+          resolve(file);
+        }
+      });
+    },
+    upload_thumb_success(data) {
+      console.log("上传文件成功", data);
+      this.$message.success("上传成功");
+      this.editor.txt.append(
+        `<video src="${data.data.ossUrl}" controls style="width:100%"></video><p>&emsp;&emsp;</p>`
+      );
+    },
+    //上传视频方法
     quxiao(reload) {
       this.$layer.close(this.layerid);
       //点击取消 不刷新列表   点击确认 保存成功刷新列表
@@ -208,32 +248,38 @@ export default {
       }
     },
     submitForm(formName) {
-      if(this.form.type==='time'&&this.form.startTime==='') return this.$message.warning('开始时间不能为空')
-      if(this.form.type==='time'&&this.form.endTime==='') return this.$message.warning('结束时间不能为空')
-      this.$refs[formName].validate((valid) => {
-        if (valid) {
-          if (!this["form"].thumb) {
-            common.tip("warning", "请上传图片");
-            return;
+      //临时
+      if (this.form.type === "time") {
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            if (!this["form"].thumb) {
+              common.tip("warning", "请上传图片");
+              return;
+            }
+            this.save();
+          } else {
+            console.log("error submit!!");
+            return false;
           }
-          this.save();
-        } else {
-          console.log("error submit!!");
-          return false;
-        }
-      });
+        }); //固定
+      } else if (this.form.type === "fixed") {
+        if (!this["form"].thumb) return this.$message.warning("请上传图片");
+        if (this.form.name.trim() === "")
+          return this.$message.warning("标题不能为空");
+        this.save();
+      }
     },
     async save() {
-      let { content, name, startTime, id, endTime, thumb,type } = this.form;
+      let { name, startTime, id, endTime, thumb, type } = this.form;
       let data = {
         type,
-        content,
         name,
         startTime,
         id,
         endTime,
         thumb,
       };
+      data.content = this.editor.txt.html();
       let result = await this.$http({
         method: "post",
         data,
@@ -275,7 +321,33 @@ export default {
   watch: {
     iframeData: {
       handler: function () {
-        if(this.iframeData.id) this.form = this.iframeData;
+        this.$nextTick(() => {
+          setTimeout(() => {
+            this.editor = new E("#div2");
+            // 配置字体
+            this.editor.config.fontNames = [
+              "黑体",
+              "仿宋",
+              "楷体",
+              "标楷体",
+              "华文仿宋",
+              "华文楷体",
+              "宋体",
+              "微软雅黑",
+              "Arial",
+              "Tahoma",
+              "Verdana",
+              "Times New Roman",
+            ];
+            this.editor.config.uploadImgShowBase64 = true; //图片地址
+            this.editor.create();
+            this.editor.txt.html(this.iframeData.content);
+          }, 100);
+        });
+
+        if (this.iframeData.id) {
+          this.form = this.iframeData;
+        }
       },
       deep: true,
       immediate: true,
@@ -286,6 +358,15 @@ export default {
 </script>
 
 <style lang="less" scoped>
+/deep/.el-upload-list__item-name{
+  display: none !important;
+}
+/deep/.el-upload-list__item-status-label{
+  display: none !important;
+}
+// /deep/.el-icon-close{
+//   display: none !important;
+// }
 .Root {
   width: 100%;
   padding: 50px;

src/pages/leaveMessage/guide.vue

@@ -13,13 +13,14 @@
           label-width="100px"
           class="demo-ruleForm"
         >
-        <el-row>
-        <el-col :span="24">
-          <el-form-item label="内容" prop="content">
-            <vue-editor class="quill-editor" v-model="form.content" />
-          </el-form-item>
-        </el-col>
-      </el-row>
+          <el-row>
+            <el-col :span="24">
+              <el-form-item label="内容" prop="content">
+                <!-- <vue-editor class="quill-editor" v-model="form.content" /> -->
+                <div id="div1" style="z-index: 1"></div>
+              </el-form-item>
+            </el-col>
+          </el-row>
           <el-form-item>
             <el-button type="primary" @click="submitForm('form')"
               >保存</el-button
@@ -38,16 +39,18 @@ const crumbData = [
     id: 3,
   },
 ];
+import E from "wangeditor";
 import MainTop from "@/components/main-top";
 import * as common from "@/util/commonfn.js";
-import { VueEditor} from "vue2-editor";
+// import { VueEditor} from "vue2-editor";
 export default {
   components: {
     MainTop,
-    VueEditor
+    // VueEditor
   },
   data() {
     return {
+      editor: "",
       crumbData,
       form: {},
       rules: {
@@ -58,20 +61,42 @@ export default {
   },
   computed: {},
   watch: {},
-  mounted() {},
+  mounted() {
+    //富文本
+    this.editor = new E("#div1");
+    // 配置字体
+    this.editor.config.fontNames = [
+      "黑体",
+      "仿宋",
+      "楷体",
+      "标楷体",
+      "华文仿宋",
+      "华文楷体",
+      "宋体",
+      "微软雅黑",
+      "Arial",
+      "Tahoma",
+      "Verdana",
+      "Times New Roman",
+    ];
+    this.editor.config.uploadImgShowBase64 = true; //图片地址
+    this.editor.config.showLinkVideo = false;
+    this.editor.create();
+  },
   created() {
-      this.getDetail()
+    this.getDetail();
   },
   methods: {
     async getDetail() {
       let result = await this.$http({
         method: "get",
-        url: "/manage/guide/detail/4",
+        url: "/manage/guide/detail/1",
       });
-      if(result['code'] === 0){
-        this["form"] = result['data'];
+      if (result["code"] === 0) {
+        this["form"] = result["data"];
+        this.editor.txt.html(result.data.content);
       } else {
-        this["form"] = {}
+        this["form"] = {};
       }
     },
     submitForm(formName) {
@@ -86,20 +111,21 @@ export default {
     },
     async save() {
       let data = this["form"];
-      data.id =1
+      data.id = 1;
+      data.content =this.editor.txt.html()
       let result = await this.$http({
         method: "post",
         data,
-        url: "/manage/guide/save"
+        url: "/manage/guide/save",
       });
-      if(result['code'] === 0) {
-          common.tip('success','保存成功');
-          this.getDetail()
+      if (result["code"] === 0) {
+        common.tip("success", "保存成功");
+        this.getDetail();
       } else {
-        common.tip('error','保存失败，请联系管理员');
+        common.tip("error", "保存失败，请联系管理员");
       }
-    }
-  }
+    },
+  },
 };
 </script>
 
@@ -126,6 +152,7 @@ export default {
 </style>
 
 <style>
-
-.ck-content { height:500px; }
+.ck-content {
+  height: 500px;
+}
 </style>

src/pages/news/newEdit.vue

@@ -7,12 +7,11 @@
       label-width="100px"
       class="demo-ruleForm"
     >
-
       <el-row>
         <el-col :span="12">
           <el-form-item label="来源" prop="source">
             <el-radio-group v-model="form.source">
-              <el-radio label="edit">编辑</el-radio>
+              <el-radio label="edit">信息</el-radio>
               <el-radio label="wechat">微信公众号</el-radio>
             </el-radio-group>
           </el-form-item>
@@ -36,15 +35,30 @@
         </el-col>
       </el-row>
 
-      <el-row v-if="form.source === 'edit'">
+      <el-row v-show="form.source === 'edit'">
         <el-col :span="24">
           <el-form-item label="内容" prop="content" maxlength="30">
-            <vue-editor class="quill-editor" v-model="form.content" />
+            <el-upload
+              class="upload-demo"
+              action="http://192.168.0.135:8001//manage/activity/upload"
+              multiple
+              :before-upload="beforethumbUpload"
+              :on-success="upload_thumb_success"
+              :headers="headerObj"
+            >
+              <el-button size="small" type="primary">视频上传</el-button>
+              <div slot="tip" class="el-upload__tip">
+                只能上传MP4文件，且不超过500M
+              </div>
+            </el-upload>
+
+            <div id="div2" style="z-index: 1;margin-top: 40px;"></div>
+            <!-- <vue-editor class="quill-editor" v-model="form.content" /> -->
           </el-form-item>
         </el-col>
       </el-row>
 
-       <el-row v-if="form.source === 'wechat'">
+      <el-row v-if="form.source === 'wechat'">
         <el-col :span="24">
           <el-form-item label="链接" prop="wxUrl" maxlength="30">
             <el-input v-model="form.wxUrl"></el-input>
@@ -67,14 +81,16 @@
 </template>
 
 <script>
-import { VueEditor } from "vue2-editor";
+import E from "wangeditor";
+// import { VueEditor } from "vue2-editor";
 import * as common from "@/util/commonfn.js";
 export default {
   components: {
-    VueEditor,
+    // VueEditor,
   },
   data() {
     return {
+      editor: "",
       headerObj: {
         token: window.localStorage.getItem("token"),
       },
@@ -83,16 +99,15 @@ export default {
         name: "",
         content: "",
         type: "",
-        source:"edit",
-        wxUrl:""
-
+        source: "edit",
+        wxUrl: "",
       },
       rules: {
         name: [{ required: true, message: "请输入标题", trigger: "blur" }],
         type: [{ required: true, message: "请选择类别", trigger: "blur" }],
         source: [{ required: true, message: "请选择来源", trigger: "blur" }],
-        content: [{ required: true, message: "请输入内容", trigger: "blur" }],
-        wxUrl: [{ required: true, message: "请输入链接", trigger: "blur" }]
+        // content: [{ required: true, message: "请输入内容", trigger: "blur" }],
+        wxUrl: [{ required: true, message: "请输入链接", trigger: "blur" }],
       },
       uploadUrl: `${this.$serverName}manage/news/upload`,
     };
@@ -112,6 +127,32 @@ export default {
     },
   },
   methods: {
+    beforethumbUpload (file) {
+      // console.log('上传文件前校验', file)
+      // 限制图片大小和格式
+      const sizeOk = file.size / 1024 / 1024 < 500
+      const typeOk = file.type === 'video/mp4' 
+      return new Promise((resolve, reject) => {
+        if (!typeOk) {
+          this.$message.error('视频格式有误！')
+          reject(file)
+        } else if (!sizeOk) {
+          this.$message.error('视频大小超过500M！')
+          reject(file)
+        } else {
+          resolve(file)
+        }
+      })
+    },
+    upload_thumb_success (data) {
+      console.log('上传文件成功', data)
+      this.$message.success('上传成功')
+      // this.editor.txt.html(`${this.editor.txt.html()}<p><video src="${data.data.ossUrl}" controls style="width:50%"></video></p>`);
+     
+      this.editor.txt.append(`<video src="${data.data.ossUrl}" controls style="width:100%"></video><p>&emsp;&emsp;</p>`)
+      // this.editor.txt.append(`<p>123456</p>`)
+    },   
+     //上传视频方法
     quxiao(reload) {
       this.$layer.close(this.layerid);
       //点击取消 不刷新列表   点击确认 保存成功刷新列表
@@ -131,10 +172,12 @@ export default {
     },
     async save() {
       // console.log('this.form',this.form)
-      let { content, name, type, id, code,source,wxUrl } = this.form;
-      let data = { content, name, type, id, code,source,wxUrl};
-      console.log(666,data);
-      if(data.content===undefined) data.content=' '
+      let { name, type, id, code, source, wxUrl } = this.form;
+      let data = { name, type, id, code, source, wxUrl };
+      if (this.form.source === "edit") data.content = this.editor.txt.html();
+      else data.content = "";
+      // console.log(666,data);
+      if (data.content === undefined) data.content = " ";
       let result = await this.$http({
         method: "post",
         data,
@@ -152,17 +195,50 @@ export default {
     iframeData: {
       handler: function () {
         this.form = this.iframeData;
+        this.$nextTick(() => {
+          setTimeout(() => {
+            this.editor = new E("#div2");
+            // 配置字体
+            this.editor.config.fontNames = [
+              "黑体",
+              "仿宋",
+              "楷体",
+              "标楷体",
+              "华文仿宋",
+              "华文楷体",
+              "宋体",
+              "微软雅黑",
+              "Arial",
+              "Tahoma",
+              "Verdana",
+              "Times New Roman",
+            ];
+            this.editor.config.uploadImgShowBase64 = true; //图片地址
+            this.editor.create();
+            this.editor.txt.html(this.iframeData.content);
+          }, 100);
+        });
       },
       deep: true,
       immediate: true,
     },
   },
-  created() {
+  created() {},
+  mounted() {
   },
 };
 </script>
 
 <style lang="less" scoped>
+/deep/.el-upload-list__item-name{
+  display: none !important;
+}
+/deep/.el-upload-list__item-status-label{
+  display: none !important;
+}
+// /deep/.el-icon-close{
+//   display: none !important;
+// }
 .quill-editor {
   line-height: normal;
 }

src/pages/survey/surveyList.vue

@@ -28,10 +28,8 @@
           <el-row>
             <el-col :span="14">
               <el-form-item label="内容" prop="content">
-                <vue-editor
-                  class="quill-editor"
-                  v-model="form.content"
-                />
+                <!-- <vue-editor class="quill-editor" v-model="form.content" /> -->
+                <div id="div1" style="z-index:1"></div>
               </el-form-item>
             </el-col>
           </el-row>
@@ -54,36 +52,60 @@ const crumbData = [
     id: 3,
   },
 ];
+import E from 'wangeditor'
 import MainTop from "@/components/main-top";
 import * as common from "@/util/commonfn.js";
-import { VueEditor } from "vue2-editor";
+// import { VueEditor } from "vue2-editor";
 export default {
   components: {
     MainTop,
-    VueEditor,
+    // VueEditor,
   },
   data() {
     return {
+      editor:'',
       crumbData,
       form: {
-        type:'introduce'
+        type: "introduce",
+        content:''
       },
       rules: {
         type: [{ required: true, message: "请选择类别", trigger: "blur" }],
         content: [{ required: true, message: "请输入内容", trigger: "blur" }],
       },
-      token: window.localStorage.getItem("token")
+      token: window.localStorage.getItem("token"),
     };
   },
   computed: {},
   watch: {
-    'form.type':{
-      handler:function() {
+    "form.type": {
+      handler: function () {
         this.getDetail();
-      }
-    }
+      },
+    },
+  },
+  mounted() {
+    //富文本
+    this.editor = new E("#div1");
+    // 配置字体
+    this.editor.config.fontNames = [
+      "黑体",
+      "仿宋",
+      "楷体",
+      "标楷体",
+      "华文仿宋",
+      "华文楷体",
+      "宋体",
+      "微软雅黑",
+      "Arial",
+      "Tahoma",
+      "Verdana",
+      "Times New Roman",
+    ];
+    this.editor.config.uploadImgShowBase64 = true//图片地址
+    this.editor.config.showLinkVideo = false
+    this.editor.create();
   },
-  mounted() {},
   created() {
     this.getDetail();
   },
@@ -91,10 +113,12 @@ export default {
     async getDetail() {
       let result = await this.$http({
         method: "post",
-        url: `/manage/profile/list/${this.form.type}`
+        url: `/manage/profile/list/${this.form.type}`,
       });
+      // console.log(9999,result);
       if (result["code"] === 0) {
         this["form"] = result["data"];
+        this.editor.txt.html(result.data.content)
       } else {
         this["form"] = {};
       }
@@ -111,6 +135,8 @@ export default {
     },
     async save() {
       let data = this["form"];
+      // console.log(999,this.editor.txt.html());
+      data.content =this.editor.txt.html()
       let result = await this.$http({
         method: "post",
         data,