相关配置

src/views/base/aboutUs-detail.vue

@@ -17,10 +17,22 @@
           :label-width="'100px'"
         >
         <el-form-item label="标题" prop="title">
-            <el-input v-model="formModel.title" placeholder="请输入客服电话" style="width: 300px"></el-input>
+            <el-input v-model="formModel.title" placeholder="请输入标题" style="width: 300px"></el-input>
           </el-form-item>
-          <el-form-item label="用户协议" prop="content">
+          <el-form-item label="内容类型" prop="contentType">
+            <el-select v-model="formModel.contentType" placeholder="请选择" style="width: 300px">
+              <el-option
+                v-for="item in contentTypeList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="内容" prop="content">
+            <el-input v-if="formModel.contentType=='1'" v-model="formModel.content"  placeholder="请输入内容" style="width: 300px"></el-input>
             <mce-editor
+                v-if="formModel.contentType=='2'"
                 ref="editor"
                 uploadName="upfile"
                 v-model="formModel.content"
@@ -28,6 +40,20 @@
                 :config="editorConfig"
                 style="width: 90%"
             ></mce-editor>
+            <el-upload
+              v-if="formModel.contentType=='3'"
+              style="width:300px"
+              class="avatar-uploader"
+              name="photoFile"
+              :action="uploadUrl"
+              :headers="headers"
+              :data="uploadData"
+              :show-file-list="false"
+              :on-success="handleAvatarSuccess"
+              :before-upload="beforeAvatarUpload">
+              <img v-if="imageUrl" :src="imageUrl" class="avatar">
+              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+            </el-upload>
           </el-form-item>
 
         </el-form>
@@ -52,14 +78,11 @@
       return {
           showPwd: true,
           ruleValidate: {
-              name: [
-              { required: true, message: "姓名不能为空", trigger: "blur" },
-              ],
-              phone: [
-              { required: true, message: "联系电话不能为空", trigger: "blur" },
+              title: [
+              { required: true, message: "标题不能为空", trigger: "blur" },
               ],
-              idCard: [
-              { required: true, message: "身份证号不能为空", trigger: "blur" },
+              contentType: [
+              { required: true, message: "内容类型不能为空", trigger: "blur" },
               ],
           },
           roleList: [],
@@ -82,6 +105,21 @@
             height: 300,
             width: 660,
           },
+          contentTypeList:[
+            {
+              "label":"文本",
+              "value":"1"
+            },
+            {
+              "label":"富文本",
+              "value":"2"
+            },
+            {
+              "label":"图片",
+              "value":"3"
+            }
+          ],
+          imageUrl: ''
       };
     },
     created() {
@@ -127,9 +165,10 @@
       },
       handleAvatarSuccess(res, file) {
           var self = this;
-          self.formModel.image = res.data;
+
+          self.formModel.content = res.data;
   
-          self.fileUrl =
+          self.imageUrl =
             res.data + "?x-oss-process=image/resize,m_lfit,h_300,w_300";
       },
       beforeAvatarUpload(file) {
@@ -157,9 +196,11 @@
   
           if (jsonData.result) {
               self.formModel = jsonData.data;
-  
-              if (self.formModel.content != null) {
-                self.$refs.editor.setContent(self.formModel.content);
+
+             if(self.formModel.contentType=='3'){
+                if (self.formModel.content != null) {
+                  self.imageUrl = self.formModel.content;
+                }
               }
           } else {
             self.$message.error(jsonData.message + "");