瀏覽代碼

增加对公支付功能

gcz 1 年之前
父節點
當前提交
0dbb97012c

+ 9 - 0
src/api/order/groupBuyingMr.js

@@ -17,3 +17,12 @@ export function getSelectById(id) {
     method: 'get'
   })
 }
+
+// 对公支付
+export const gotoCorporatePay = (data) => {
+  return request({
+    url: '/order/orderInfo/gotoCorporatePay',
+    method: 'post',
+    data: data
+  })
+}

+ 43 - 5
src/views/order/groupBuyingMr/dialog/details.vue

@@ -2,9 +2,9 @@
  * @Description: 详情弹框
  * @Author: Sugar.
  * @Date: 2023-11-24 13:55:00
- * @LastEditors: Sugar.
- * @LastEditTime: 2023-11-24 13:55:00
- * @FilePath: \cattle_webui\src\views\order\groupBuyingMr\dialog\AddOrEditDialog.vue
+ * @LastEditors: gcz
+ * @LastEditTime: 2024-01-15 20:36:37
+ * @FilePath: \great_webui\src\views\order\groupBuyingMr\dialog\details.vue
  * @Copyright: Copyright (c) 2016~2023 by Sugar., All Rights Reserved.
 -->
 <template>
@@ -94,8 +94,30 @@
           </el-table>
         </el-col>
       </el-row>
+
+       <!-- 对公支付信息 -->
+       <div v-if="form.payWay=='corporate'&&form.status>0&&form.corporate">
+        <div class="title-class">对公支付信息</div>
+          <el-row>
+            <el-col :span="24">
+              <div class="voucher-list">
+                <el-image 
+                  v-for="(item,index) in voucherUrl" :key="index"
+                  style="width: 100px; height: 100px"
+                  :src="item" 
+                  :preview-src-list="voucherUrl">
+                </el-image>
+              </div>
+            </el-col>
+            <el-col class="pay-type-remark" :span="24">
+              对公支付备注:{{corporateRremark}}
+            </el-col>
+          </el-row>
+       </div>
+       
     </div>
 
+
     <span slot="footer" class="dialog-footer">
       <el-button type="primary" @click="cancel">确定</el-button>
     </span>
@@ -120,8 +142,9 @@ export default {
       open: false,
       loading: false,
       form: {
-        id: undefined,
+        id: undefined
       },
+      corporateRremark:'',
       performerVisible: false,
       performerList: [],
       refund: false,
@@ -149,6 +172,7 @@ export default {
         'alipay': '支付宝OTA',
         'wecaht.h5': '微信公众号支付',
         'meituan': '美团支付',
+        'corporate': '对公支付',
       },
       sourceList: {
         1: '小程序',
@@ -157,7 +181,8 @@ export default {
         4: '携程',
         5: '团购',
       },
-      dataList: []
+      dataList: [],
+      voucherUrl:[]
     };
   },
   methods: {
@@ -176,6 +201,10 @@ export default {
       const id = row.id
       getSelectById(id).then(response => {
         this.form = response.data;
+        if(response.data.corporate){
+          this.voucherUrl = response.data.corporate.voucherUrl.split(',')||[];
+          this.corporateRremark =  response.data.corporate.remark;
+        }
       });
     },
     /**
@@ -226,4 +255,13 @@ export default {
     margin-bottom: 20px;
   }
 }
+
+.voucher-list{
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 24rpx;
+}
+.pay-type-remark{
+  margin:14px 0;
+}
 </style>

+ 157 - 2
src/views/order/groupBuyingMr/index.vue

@@ -91,6 +91,12 @@
       </el-table-column>
       <el-table-column label="支付方式" align="center" prop="type">
         <template slot-scope="scope">
+          <!-- <el-tooltip placement="top">
+            <div slot="content">
+               <span>{{ payWayList[scope.row.payWay] }}</span>
+            </div>
+            <span>{{ payWayList[scope.row.payWay] }}</span>
+          </el-tooltip> -->
           <span>{{ payWayList[scope.row.payWay] }}</span>
         </template>
       </el-table-column>
@@ -112,6 +118,13 @@
             @click="openDetails(scope.row)"
             v-hasPermi="['groupBuyingMr:groupBuyingMr:details']"
           >详情</el-button>
+          <el-button
+          v-if="scope.row.status===0"
+            size="mini"
+            type="text"
+            @click="handleCorporatePay(scope.row)"
+            v-hasPermi="['groupBuyingMr:groupBuyingMr:details']"
+          >对公转账</el-button>
           <el-button
               size="mini"
               type="text"
@@ -151,12 +164,45 @@
           <el-button type="primary" :loading="dialogVisibleLoading" @click="print(viewerList)">{{ dialogVisibleLoading?'打印中...':'打印' }}</el-button>
         </span>
       </el-dialog>
+
+      <el-dialog
+        title="对公信息凭证"
+        :visible.sync="showCorporatePay"
+        width="50%"
+        @close="handleCorporatePayClose"
+        :before-close="handleCorporatePayClose">
+        <el-form :model="ruleForm" :rules="corporatePayRules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
+          <el-form-item label="凭证上传" prop="photoList" required>
+            <el-upload
+                ref="upload"
+                :action="uploadObj.url"
+                :headers="uploadObj.headers"
+                accept=".jpg,.png"
+                :on-success="handlePhotoListSuccess"
+                :before-upload="beforeAvatarUpload"
+                list-type="picture-card"
+                :file-list="form.photoList"
+                :on-remove="handleRemove"
+                :limit="2"
+              >
+                <i class="el-icon-plus"></i>
+              </el-upload>
+          </el-form-item>
+          <el-form-item label="备注">
+            <el-input placeholder="请备注" type="textarea" maxlength="300" show-word-limit v-model="form.corporate.remark"></el-input>
+          </el-form-item>
+        </el-form>
+        <span slot="footer" class="dialog-footer">
+          <el-button @click="showCorporatePay = false">取 消</el-button>
+          <el-button type="primary" :loading="corporatePayLoading" @click="corporatePay">{{ dialogVisibleLoading?'操作中...':'确定' }}</el-button>
+        </span>
+      </el-dialog>
   </div>
 </template>
 
 <script>
-
-import { pageList } from '@/api/order/groupBuyingMr'
+import { getToken } from "@/utils/auth";
+import { pageList,gotoCorporatePay } from '@/api/order/groupBuyingMr'
 import detailsDia from "./dialog/details.vue";
 
 import { printApi } from '@/api/order/orderMr'
@@ -231,6 +277,7 @@ export default {
         'alipay': '支付宝OTA',
         'wecaht.h5': '微信公众号支付',
         'meituan': '美团支付',
+        'corporate': '对公支付',
       },
       sourceList: {
         1: '小程序',
@@ -261,6 +308,23 @@ export default {
           ],
         },
         dialogVisibleLoading: false,
+        showCorporatePay:false,
+        form:{
+          orderId:'',
+          photoList:[],
+          corporate:{
+            voucherUrl:'',
+            remark:'',
+          }
+        },
+        corporatePayRules: {
+          photoList: [{ required: true, message: "请上传凭证", trigger: ["change","blur"] }],
+      },
+      uploadObj: {
+        url: process.env.VUE_APP_UPLOAD_FILE_API + "/upload/single/minio",
+        Headers: { Authorization: "Bearer " + getToken() },
+      },
+      corporatePayLoading:false
     };
   },
   created() {
@@ -407,7 +471,98 @@ export default {
             this.dialogVisible = false
             this.dialogVisibleLoading = false
           })
+        },
+        handleCorporatePay(row){
+          console.log('corporatePay',row);
+          this.form.orderId = row.id;
+          this.showCorporatePay = true;
+
+        },
+        handleCorporatePayClose(){
+          console.log('1111');
+          this.corporatePayLoading = false;
+          this.showCorporatePay = false;
+        },
+        corporatePay(){
+          console.log('form',this.form);
+          if(this.form.photoList.length<1){
+            this.$message.error('请上传凭证');
+            return
+          }
+          this.corporatePayLoading = true;
+          const voucherUrl = this.form.photoList.map(item => item.url).join(",");
+          this.form.corporate.voucherUrl = voucherUrl;
+          gotoCorporatePay(this.form).then((res)=>{
+            this.$message.success(res.msg);
+            this.corporatePayLoading = false;
+            this.handleCorporatePayClose();
+          }).catch((err)=>{
+            this.corporatePayLoading = false;
+            this.$message.error(err.msg);
+            console.log('corporatePay err',err);
+          })
+        },
+      /**
+     * 剧目海报上传成功
+     * @date 2023-11-22
+     * @param {any} res
+     * @returns {any}
+     */
+    handlePhotoListSuccess(res) {
+      if (res.code === 200) {
+        let photo = {
+          imageUrl: res?.data?.url,
+          url: res?.data?.url,
+          photoType: '2'
+        }
+        if(!this.form.photoList){
+          this.form.photoList = []
+        }
+        // this.form.photoList.push(photo);
+        this.$set(this.form.photoList, this.form.photoList.length, photo);
+      }
+    },
+    handleRemove(file, fileList) {
+      this.form.photoList.forEach((item, index) => {
+        if(item.uid == file.uid){
+          this.form.photoList.splice(index, 1)
         }
+      })
+    },
+    /**
+     * 上传文件之前之前
+     * @date 2023-11-22
+     * @param {any} file
+     * @returns {any}
+     */
+    beforeAvatarUpload(file) {
+      const isJPG = file.type === "image/jpeg" || "image/png";
+      if (!isJPG) {
+        this.$message.error("上传头像图片只能是jpg或png格式!");
+      }
+      return isJPG;
+    },
   }
 };
 </script>
+<style lang="scss">
+
+  .upload-btn {
+    width: 100px;
+    height: 100px;
+    background-color: #fbfdff;
+    border: dashed 1px #c0ccda;
+    border-radius: 5px;
+    i {
+      font-size: 30px;
+      margin-top: 20px;
+    }
+    &-text {
+      margin-top: -10px;
+    }
+  }
+  .avatar {
+    cursor: pointer;
+  }
+
+</style>