内容管理模块表单修改样式问题和增加字段

src/pages/content-manage/ads/index.vue

@@ -281,9 +281,6 @@ export default {
       this.drawerVisible = true
     },
     HandleDrawFormSubmit(val) {
-      Object.keys(val).forEach(key => {
-        if (val[key] === '') delete val[key]
-      })
       if (this.drawFormOptions.type === 'create') {
         this.fetchCreateAd(val)
       } else {

src/pages/content-manage/article/index.vue

@@ -291,9 +291,6 @@ export default {
       this.drawerVisible = true
     },
     HandleDrawFormSubmit(val) {
-      Object.keys(val).forEach(key => {
-        if (val[key] === '') delete val[key]
-      })
       if (this.drawFormOptions.type === 'create') {
         this.fetchCreateArticle(val)
       } else {

src/pages/content-manage/components/DrawerForm.vue

 <template>
-  <el-form :model="form" :rules="rules" ref="ruleForm" label-width="120px" :class="`form-container ${options.page}-form`" >
+  <el-form :model="form" :rules="rules" ref="ruleForm" label-width="120px" :class="`form-container ${options.type}`" >
     <div class="left">
       <el-form-item label="项目：" prop="project_id">
         <el-col :span="12">
@@ -38,7 +38,7 @@
           class="avatar-uploader"
           action="#"
           :show-file-list="false"
-          :before-upload="val => beforeUpload(val, 'web_img_uri')">
+          :before-upload="val => beforeUpload(val, 'web_img')">
           <img v-if="form.web_img_uri" :src="form.web_img_uri" class="avatar">
           <i v-else class="el-icon-plus avatar-uploader-icon"></i>
         </el-upload>
@@ -62,7 +62,7 @@
           action="#"
           class="avatar-uploader"
           :show-file-list="false"
-          :before-upload="val => beforeUpload(val, 'mobile_terminal_img_uri')">
+          :before-upload="val => beforeUpload(val, 'mobile_terminal_img')">
           <img v-if="form.mobile_terminal_img_uri" :src="form.mobile_terminal_img_uri" class="avatar">
           <i v-else class="el-icon-plus avatar-uploader-icon"></i>
         </el-upload>
@@ -88,36 +88,36 @@
             class="file-uploader"
             ref="upload"
             :show-file-list="false"
-            :before-upload="val => beforeUpload(val, 'enclosure_uri')">
+            :before-upload="val => beforeUpload(val, 'enclosure')">
             <el-button slot="trigger" size="small" type="primary" :disabled="isDetails">上传文件</el-button>
           </el-upload>
           <p class="des">
-            <i class="el-icon-loading" v-if="form.enclosure_uri_loading"></i>
-            <i class="el-icon-circle-check" v-if="!form.enclosure_uri_loading && form.enclosure_uri"></i>
+            <i class="el-icon-loading" v-if="enclosure_loading"></i>
+            <i class="el-icon-circle-check" v-if="!enclosure_loading && form.enclosure_uri"></i>
             请上传文件，最多上传一份<br>支持：word、excel、pdf
           </p>
         </div>
-        <div class="upload-file-display" v-if="form.enclosure_uri_name">
-          {{form.enclosure_uri_name}}
+        <div class="upload-file-display" v-if="form.enclosure_title">
+          {{form.enclosure_title}}
           <span class="upload-file-bar">
-            <i :class="isFilePreview(form.enclosure_uri_name) ? 'el-icon-view':'el-icon-download'" @click="handleDownloadFile('enclosure_uri')"></i>
+            <i :class="isFilePreview(form.enclosure_title) ? 'el-icon-view':'el-icon-download'" @click="handleDownloadFile('enclosure_uri')"></i>
             <i v-if="!isDetails" class="el-icon-circle-close" @click="handleClearFile('enclosure_uri')"></i>
           </span>
         </div>
       </el-form-item>
       <el-form-item label="上传视频：" class="file-upload">
         <div style="padding-top:6px;height:36px;">
-          <el-upload :disabled="isDetails" action="#" class="file-uploader" ref="upload" :show-file-list="false" :before-upload="val => beforeUpload(val, 'video_uri')">
+          <el-upload :disabled="isDetails" action="#" class="file-uploader" ref="upload" :show-file-list="false" :before-upload="val => beforeUpload(val, 'video')">
             <el-button slot="trigger" size="small" type="primary" :disabled="isDetails">上传视频</el-button>
           </el-upload>
           <p class="des">
-            <i class="el-icon-loading" v-if="form.video_uri_loading"></i>
-            <i class="el-icon-circle-check" v-if="!form.video_uri_loading && form.video_uri"></i>
+            <i class="el-icon-loading" v-if="video_loading"></i>
+            <i class="el-icon-circle-check" v-if="!video_loading && form.video_uri"></i>
             请上传文件，最多上传一份<br>支持：MP4
           </p>
         </div>
-        <div class="upload-file-display" v-if="form.video_uri_name">
-          {{form.video_uri_name}}
+        <div class="upload-file-display" v-if="form.video_title">
+          {{form.video_title}}
           <span class="upload-file-bar">
             <i class="el-icon-view" @click="handleDownloadFile('video_uri')"></i>
             <i v-if="!isDetails" class="el-icon-circle-close" @click="handleClearFile('video_uri')"></i>
@@ -199,15 +199,17 @@ const defaultForm = {
   remarks: '',
   content: '',
   web_img_uri: '',
-  web_img_uri_loading: '',
+  web_img_title: '',
+  web_img_size: '',
   mobile_terminal_img_uri: '',
-  mobile_terminal_img_uri_loading: '',
+  mobile_terminal_img_title: '',
+  mobile_terminal_img_size: '',
   enclosure_uri: '',
-  enclosure_uri_name: '',
-  enclosure_uri_loading: '',
+  enclosure_title: '',
+  enclosure_size: '',
   video_uri: '',
-  video_uri_name: '',
-  video_uri_loading: '',
+  video_title: '',
+  video_size: '',
   start_time: '',
   hasEndDate: 0,
   end_time: ''
@@ -237,6 +239,10 @@ export default {
     return {
       typeList: [],
       form: Object.assign({}, defaultForm),
+      web_img_loading: '',
+      mobile_terminal_img_loading: '',
+      enclosure_loading: '',
+      video_loading: '',
       rules: {
         project_id: [
           { required: true, message: '请选择项目', trigger: 'change' }
@@ -320,12 +326,12 @@ export default {
       } else {
         this.form.start_time = formatToDate(this.form.start_time)
       }
-      if (this.form.enclosure_uri) {
-        this.form.enclosure_uri_name = splitStrLast(this.form.enclosure_uri, '/')
-      }
-      if (this.form.video_uri) {
-        this.form.video_uri_name = splitStrLast(this.form.video_uri, '/')
-      }
+      // if (this.form.enclosure_uri) {
+      //   this.form.enclosure_title = splitStrLast(this.form.enclosure_uri, '/')
+      // }
+      // if (this.form.video_uri) {
+      //   this.form.video_title = splitStrLast(this.form.video_uri, '/')
+      // }
     }
   },
   methods: {
@@ -343,22 +349,15 @@ export default {
     beforeUpload(file, target) {
       let errorMsg = ''
       const suffix = splitStrLast(file.name, '.')
-      if (target === 'web_img_uri' || target === 'mobile_terminal_img_uri') {
+      if (target === 'web_img' || target === 'mobile_terminal_img') {
         if (['image/png', 'image/jpeg'].includes(file.type)) {
           this.fetchUpload(file, 'image', target)
         } else {
           errorMsg = '上传图片格式错误，只允许png/jpg格式'
         }
-      } else if (target === 'enclosure_uri') {
+      } else if (target === 'enclosure') {
         const typeList = ['doc', 'docx', 'pdf', 'xls', 'xlsx']
-        let isType = false
-        for (const i in typeList) {
-          if (typeList[i] === suffix) {
-            isType = true
-            break
-          }
-        }
-        if (isType) {
+        if (typeList.includes(suffix)) {
           this.fetchUpload(file, 'file', target)
         } else {
           errorMsg = '上传附件格式错误，只允许word/excel/pdf格式'
@@ -449,14 +448,13 @@ export default {
       const formData = new window.FormData()
       formData.append('file', file)
       formData.append('type', type)
-      this.form[target + '_loading'] = '1'
+      this[target + '_loading'] = '1'
       fileUpload(formData).then(res => {
-        this.form[target + '_loading'] = ''
+        this[target + '_loading'] = ''
         if (res.code === 0 && res.message === 'SUCCESS') {
-          this.form[target] = res.data[0].full_path
-          if (type === 'file') {
-            this.form[target + '_name'] = res.data[0].filename
-          }
+          this.form[target + '_uri'] = res.data[0].full_path
+          this.form[target + '_title'] = res.data[0].title
+          this.form[target + '_size'] = res.data[0].size + ''
         }
       })
     }
@@ -469,6 +467,15 @@ export default {
   display:flex;
   align-items: stretch;
 }
+.form-container.details ::-webkit-input-placeholder{
+  color:transparent;
+}
+.form-container.details :-ms-input-placeholder{
+  color:transparent;
+}
+.form-container.details ::placeholder{
+  color:transparent;
+}
 .form-container .left{
   width:60%;
 }

src/pages/content-manage/image-text/index.vue

@@ -254,9 +254,6 @@ export default {
       this.drawerVisible = true
     },
     HandleDrawFormSubmit(val) {
-      Object.keys(val).forEach(key => {
-        if (val[key] === '') delete val[key]
-      })
       if (this.drawFormOptions.type === 'create') {
         this.fetchCreateImgText(val)
       } else {