加上传

src/components/Hotel/roomReservationsDetails.vue

@@ -106,10 +106,16 @@
             </div>
             <el-upload :http-request="uploadFileBtn" :multiple="true" :show-file-list="false" action="">
               <el-button size="small" type="danger" icon="el-icon-upload2">
-                <i class="el-icon-plus avatar-uploader-icon" @click="ClickItem=item"></i>
+                <!-- <i class="el-icon-plus avatar-uploader-icon" @click="ClickItem=item"></i> -->
                 <div class="el-upload__text" @click="ClickItem=item">点击上传</div>
               </el-button>
             </el-upload>
+            <div class="RoomfileList" v-for="(subItem,subIndex) in item.ContractUrlArray" v-if="item.ContractUrlArray!=null && item.ContractUrlArray.length>0">
+              <p  title="点击下载" @click="downLoadPZ(subItem)" style="cursor: pointer;">{{ '附件' + (index + 1)}}</p>
+              <span>
+                  <i class="iconfont icon-close" @click="deleteFile(item,subIndex)"></i>
+              </span>
+            </div>
           </td>
           <td>
             <div class="w80">
@@ -225,6 +231,20 @@
     },
     methods: {
       //联系op
+      downLoadPZ: function (src) {
+        let dom = document.querySelector("#blankLink")
+        dom.href=src
+        dom.click()
+      },
+      //删除
+      deleteFile(item,index){
+        item.ContractUrlArray.splice(index,1);
+          var str = "";
+          item.ContractUrlArray.forEach(subItem => {
+            str += subItem + ",";
+          })
+          item.ContractUrl = str != "" ? str.substring(0, str.length - 1) : str;
+      },
       openChart() {
         this.MsgBus.$emit('openChat', {
           account: this.CreateByAccount,
@@ -297,7 +317,6 @@
                 item.ReserveNo = this.$route.query.NewCombinationNum;
               }
             })
-            console.log("this.List", this.list);
           } else {
             this.$message.error(res.data.message);
           }
@@ -375,7 +394,6 @@
       },
       //合同上传
       uploadFileBtn(file) {
-        console.log("clickItem", this.ClickItem);
         if (file.file.size > 1024 * 1024 * 100) {
           this.$message.warning("文件大小不能超过100M！");
           return;
@@ -406,11 +424,29 @@
 
 </script>
 <style>
+  .RoomfileList{
+    width:100%;
+    height:20px;
+    text-align: center;
+    position: relative;
+    cursor: pointer;
+  }
+  .RoomfileList p{
+    display: inline-block;
+  }
+  .RoomfileList i:hover{
+    color:#E95252;
+  }
   .roomReservationsDetailsTalbe .el-button--small {
-    padding: 5px;
+    padding: 0 20px 0 10px;
     margin-top: 10px;
+    height:28px;
+    line-height: 10px;
+  }
+  .roomReservationsDetailsTalbe .el-button--small i{
+    float: left;
+    margin-top:9px;
   }
-
   .roomReservationsDetailsTalbe .roomBtn {
     color: #fff;
     padding: 0 10px !important;