缴费凭证联调

src/views/caseManagement/components/payDialog.vue

@@ -36,9 +36,9 @@
       <div class="payupload">
         <span>上传支付凭证：</span>
         <div class="uploadBtn">
-          <el-upload class="upload-demo" ref="upload" action="https://jsonplaceholder.typicode.com/posts/"
-            :on-preview="handlePreview" :on-remove="handleRemove" :on-change="beforeUpload" :file-list="fileList"
-            :auto-upload="false">
+          <el-upload class="upload-demo" ref="upload" :action="UploadUrl()" :headers="headers" :data="filedata"
+            :on-preview="handlePreview" :on-remove="handleRemove" :on-change="beforeUpload"  :on-success="handlSuccess" :file-list="fileList"
+           >
             <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
             <!-- <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button> -->
             <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
@@ -63,39 +63,68 @@
 </template>
 
 <script>
-import { casePay, selectCaseApplicationConfirm } from "@/api/pay/pay";
+import { casePay, confirmPayDig } from "@/api/pay/pay";
 import QRCode from "qrcodejs2";
 import { getToken } from "@/utils/auth";
 export default {
-  props: ["openPay", "payTitle", "form", "payForm", "queryParams"],
+  props: ["openPay", "payTitle", "form", "payForm", "queryParams","payId"],
   data() {
     return {
       // key: value
       // 支付文字
       payMain: "",
       timer: null,
-      paySelect: 0,//支付线上/线下
-      fileList: []
+      paySelect: 1,//支付线上/线下
+      fileList: [],
+      headers: {
+        Authorization: "Bearer " + getToken(),
+      },
+      filedata: {
+        annexType: 8,
+      },
+      submitForm:{
+        payType:1,
+        payOrderList:[],
+        caseId:null
+      }
     };
   },
   methods: {
+    UploadUrl() {
+      return window.location.origin + "/API/evidence/upload";
+    },
     //选择支付方式(线上,线下)
     changPayType(data) {
-      console.log(data, "PPPPPPPPPPPPP");
+      this.submitForm.payType = data;
     },
     beforeUpload(flie, fileList) {
-      console.log(flie, fileList, "PPPPPPPPPPPPPP");
       this.fileList = fileList;
     },
+    // 文件上传成功
+    handlSuccess(res, file) {
+      this.submitForm.payOrderList.push({
+        annexId: res.data.annexId,
+        annexName:res.data.annexName
+      });
+    },
     submitUpload() {
       if (this.fileList.length < 1) {
         this.$modal.msgError("请上传缴费凭证");
         return
       }
-      this.$refs.upload.submit();
+      confirmPayDig(this.submitForm).then(res=>{
+        this.$modal.msgSuccess("成功");
+        this.payCancel()
+        this.$emit("getcaseApply", this.queryParams);
+        // console.log(res,":::::::::::::::::::::::::::::::");
+      })
     },
     handleRemove(file, fileList) {
-      console.log(file, fileList);
+      (this.submitForm.payOrderList = []),
+      fileList.forEach((item) => {
+        console.log(item.response.data,"item");
+          this.submitForm.payOrderList.push({ annexId:item.response.data.annexId,annexName:item.response.data.annexName });
+        });
     },
     handlePreview(file) {
       console.log(file);
@@ -113,21 +142,21 @@ export default {
       });
     },
     // 查询缴费状态
-    selectCaseApplicationConfirmFn(parms) {
-      selectCaseApplicationConfirm(parms).then(res => {
-        console.log(res, this.form, "KKKKKKKKKKKKKKKKKKKK");
-        if (res && res.data && res.data.paymentStatus == 1) {
-          clearInterval(this.timer);
-          // this.openPay = false;
-          this.payCancel()
-          this.$message({
-            message: "缴费成功",
-            type: "success",
-          });
-          this.$emit("getcaseApply", this.queryParams);
-        }
-      })
-    },
+    // selectCaseApplicationConfirmFn(parms) {
+    //   selectCaseApplicationConfirm(parms).then(res => {
+    //     // console.log(res, this.form, "KKKKKKKKKKKKKKKKKKKK");
+    //     if (res && res.data && res.data.paymentStatus == 1) {
+    //       // clearInterval(this.timer);
+    //       // this.openPay = false;
+    //       this.payCancel()
+    //       this.$message({
+    //         message: "缴费成功",
+    //         type: "success",
+    //       });
+    //       this.$emit("getcaseApply", this.queryParams);
+    //     }
+    //   })
+    // },
     // 支付
     pay(val) {
       if (this.payForm.feePayable == 0 || !this.payForm.feePayable) {
@@ -153,12 +182,12 @@ export default {
       }).then((res) => {
         this.paySrc = res.data.code_url;
         this.qrcode(this.paySrc);
-        this.timer = setInterval(() => {
-          this.selectCaseApplicationConfirmFn({ id: this.form.id })
-        }, 3000);
-        setTimeout(() => {
-          clearInterval(this.timer);
-        }, 1000 * 60);
+        // this.timer = setInterval(() => {
+        //   this.selectCaseApplicationConfirmFn({ id: this.form.id })
+        // }, 3000);
+        // setTimeout(() => {
+        //   clearInterval(this.timer);
+        // }, 1000 * 60);
       });
     },
     payCancel() {
@@ -166,6 +195,14 @@ export default {
       this.payMain = "";
     },
   },
+  watch:{
+    openPay(val){
+      if(val){
+      this.filedata.id = this.payId;
+      this.submitForm.caseId = this.payId;
+      }
+    }
+  }
 };
 </script>