2022-1-11

src/Form/promotion/edit.vue

@@ -2,7 +2,7 @@
   <div>
     <el-button size="mini" type="primary" @click="editBtn">编 辑</el-button>
     <el-drawer
-        title="编辑促销方案"
+        title="创建促销方案"
         :visible.sync="dialogFormVisible"
         size="40%"
         direction="rtl"
@@ -103,6 +103,24 @@
                 <el-input v-model="form.remarks" type="textarea" rows="5" placeholder="请输入方案描述"></el-input>
               </el-form-item>
             </el-col>
+            <el-col :span="24">
+              <el-form-item label="封面" prop="cover">
+                <input v-show="false" type="text" v-model="form.cover">
+                <uploadFile
+                  :one="true"
+                  :multiple="false"
+                  ref="upload"
+                  style="margin-top:10px"
+                  :folderid="folderid"
+                  accept=".JPG,.PNG,.jpg,.png"
+                  type="image"
+                  :bindData="bindData"
+                  @onSuccess="uploadSuccess"
+                  @deleteSuccess="deleteSuccess"
+                  @onChange="coverChange">
+                </uploadFile>
+              </el-form-item>
+            </el-col>
           </el-form>
         </el-row>
       </div>
@@ -115,9 +133,10 @@
 </template>
 
 <script>
+import uploadFile from '@/HDrpManagement/promotion/components/upload'
 export default {
   name: "add",
-  components:{},
+  components:{uploadFile},
   props:['data'],
   data(){
     var checkBegTimer = (rule, value, callback) => {
@@ -138,7 +157,9 @@ export default {
       tradefieldList:[],
       brandList:[],
       accountList:[],
+      bindData:{},
       dialogFormVisible:false,
+      folderid:JSON.parse(sessionStorage.getItem('folderid')).appfolderid,
       form:{
         "sa_promotionid":0,     //sat_notice_classid<=0时 为新增
         "sa_accountclassid": "",
@@ -151,7 +172,8 @@ export default {
         "orderaddqty": '',
         "orderminamount": '',
         "begdate": '',
-        "enddate": ""
+        "enddate": "",
+        "cover":''
       },
       rules:{
         promname:[
@@ -186,18 +208,32 @@ export default {
         tradefield:[
           { required: true, message: '请选择领域', trigger: 'change'},
         ],
+        cover:[
+          { required: true, message: '请上传封面', trigger: 'change'},
+        ],
       },
     }
   },
   watch: {
     dialogFormVisible (val) {
-      !val && this.$refs.form.resetFields()
+      if (!val) {
+        this.$refs.form.resetFields()
+        this.$refs.upload.fileLinkList = []
+        this.$refs.upload.$refs.upload.clearFiles()
+      }
     }
   },
   methods:{
     editBtn () {
       this.dialogFormVisible = true
       this.form = Object.assign({},this.form,this.data)
+      this.form.cover = this.form.attinfos
+      console.log(this.form);
+      
+      this.$nextTick(() => {
+        this.$refs.upload.fileLinkList = this.form.attinfos
+        this.$refs.upload.fileList = this.form.attinfos
+      })
     },
     onSubmit(){
       console.log(this.form)
@@ -211,11 +247,23 @@ export default {
         this.tool.showMessage(res,()=>{
           this.$emit('onSuccess')
           this.dialogFormVisible = false
+          this.bindData = {
+            "ownertable": 'sa_promotion',
+            "ownerid": res.data.sa_promotionid,
+            "usetype": 'default',
+          }
+          this.$refs['upload'].toUpload(() => {
+            // this.$emit('onSuccess')
+            this.dialogFormVisible = false
+          })
         })
       })
     },
     brandChange (val) {
 
+    },
+    coverChange (data) {
+      this.form.cover = data
     },
     /* 领域 */
     async getTradefield () {
@@ -253,6 +301,12 @@ export default {
       this.accountList = res.data
       console.log(this.accountList,'账户');
       
+    },
+    uploadSuccess (data) {
+      this.$emit('onSuccess')
+    },
+    deleteSuccess () {
+      this.form.cover = ''
     }
   },
   created() {

src/HDrpManagement/promotion/components/upload.vue

@@ -3,7 +3,7 @@
     <div v-if="type === 'button'" class="picture_list">
       <div class="flex-align-center flex-between pionter" v-for="(img,index) in fileLinkList" :key="img.index">
         <div class="flex-align-center">
-          <img width="30" :src="img.type.split('/')[0] === 'image'?img.url:require('@/assets/file_icons/file.svg')" class="inline-16" alt="">
+          <img width="30" :src="img.url" class="inline-16" alt="">
           <div class="file__link inline-16">
             <p>{{img.name}}</p>
           </div>
@@ -22,7 +22,7 @@
     </div>
     <div v-else class="flex-align-stretch">
       <div v-for="(img,index) in fileLinkList" :key="index" class="upload_image__panel">
-        <img :src="img.type.split('/')[0] === 'image'?img.url:require('@/assets/file_icons/file.svg')" alt="">
+        <img :src="img.url" alt="">
         <div class="upload_image__panel_mod flex-align-center flex-around">
           <i class="el-icon-delete" style="font-size:16px" @click="handleRemove(index)"></i>
         </div>
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import removeFile from '@/utils/removeFile'
 export default {
   props:['folderid','bindData','type','accept','multiple','one'],
   data() {
@@ -50,6 +51,7 @@ export default {
       imageUrl:'',
       fileList:[],
       fileLinkList:[],
+      deleteArr:[],
       params: {
         "classname": "system.attachment.huawei.OBS",
         "method": "getFileName",
@@ -78,12 +80,19 @@ export default {
       fileReader.onload = function(e) {
         var result = e.target.result;
         that.fileLinkList.unshift({url:result,type:file.type,name:file.name})
+        console.log(that.fileLinkList,'111');
+        
         if (that.fileLinkList.length > 1 && that.one) {
-          that.fileLinkList = that.fileLinkList.splice(0,1)
+          that.deleteArr[0] = that.fileLinkList.pop()
+          console.log(that.deleteArr);
+          
         }
       }
     },
     handleRemove (index) {
+      removeFile.removeFileList([this.fileList[index]]).then(() => {
+        this.$emit('deleteSuccess')
+      })
       this.fileList = this.fileList.filter((e,idx)=>{
         if (idx !== index) {
           return e
@@ -129,6 +138,12 @@ export default {
 
     // 上传成功以后生成附件记录
     async createFileRecord (obsfilename,attinfos) {
+      console.log(this.deleteArr.length,this.one);
+      
+      if(this.deleteArr.length && this.one) {
+        this.deleteFun()
+      }
+
       let obj = {
         "serialfilename": obsfilename
       }
@@ -148,6 +163,11 @@ export default {
       console.log(this.fileList)
       
     },
+    deleteFun () {
+      console.log(this.deleteArr,'删除数据');
+      
+      removeFile.removeFileList(this.deleteArr)
+    }
   }
 }