From b70e8509b2bcb6b3875e8b561d6ab297ac390a13 Mon Sep 17 00:00:00 2001
From: linfso <linfso@sina.com>
Date: Fri, 20 Jun 2025 04:27:25 +0800
Subject: [PATCH] md

---
 src/views/openpage/onlinePayQr.vue | 299 +++++++++++++++++++++++++++++
 1 file changed, 299 insertions(+)
 create mode 100644 src/views/openpage/onlinePayQr.vue

diff --git a/src/views/openpage/onlinePayQr.vue b/src/views/openpage/onlinePayQr.vue
new file mode 100644
index 0000000..6fe88d5
--- /dev/null
+++ b/src/views/openpage/onlinePayQr.vue
@@ -0,0 +1,299 @@
+<template>
+  <div style="overflow: auto;">
+    123213
+    <!-- v-if="settleBillItem!=null" -->
+    <el-form id="payPage" ref="form"  :model="form" size="mini" label-width="80px">
+         <el-row :gutter="0" style="display: flex;flex-wrap: wrap;">
+          <el-col :span="24">
+            <div style="text-align:center">
+              <div style="display: inline-flex;" >
+                <span><img :src="shortLogo" style="width: 30px;height: 30px;margin-top: 0px;"  /></span>
+                <span style="font-size: 20px;font-weight: bold;color: black;">探路供应链（江苏）有限公司</span>
+              </div>
+                <div style="width:150px;margin: 0 auto;">
+                  <img :src="wxPayQrImageUrl" width="100%" draggable="false"/>
+                 </div>
+                <div class="pay-title"><span style="color: black;font-size: 20px;">￥{{ settleBillItem.recMoney-settleBillItem.recedMoney }} </span></div>
+                <div style="text-align: center;" >
+                  <div>请使用微信[<span style="color:black;font-weight: bold;">24小时</span>]内完成支付</div>
+                </div>
+              </div>
+          </el-col>
+           <el-col :span="24">
+              <el-row :gutter="0" style="display: flex;flex-wrap: wrap;margin-top:10px">
+                  <el-col :span="12">
+                      <span class="item-label">账单编号:</span>
+                      <span class="item-value" style="font-size:14px;font-weight: bold;">{{ settleBillItem.settleBillNo }}</span>
+                  </el-col>
+
+                  <!-- <el-col :span="12">
+                      <span class="item-label">账单名称:</span><span class="item-value">{{ settleBillItem.settleBillName }}</span>
+                  </el-col> -->
+                  <el-col :span="12">
+                      <span class="item-label">账单日期:</span><span class="item-value">{{ settleBillItem.createTime }}</span>
+                  </el-col>
+                  <el-col :span="12">
+                      <span class="item-label">总票数:</span><span class="item-value">{{ settleBillItem.sendPieceSum }}</span>
+                  </el-col>
+                  <el-col :span="12">
+                      <span class="item-label">总件数:</span><span class="item-value">{{ settleBillItem.pieceNumber }}</span>
+                  </el-col>
+
+                   <el-col :span="12">
+                      <span class="item-label">结算重量:</span><span class="item-value">{{ settleBillItem.feeWeight }}KG</span>
+                  </el-col>
+
+                  <el-col :span="12">
+                      <span class="item-label">应付金额:</span><span class="item-value">￥{{ settleBillItem.recMoney }}</span>
+                  </el-col>
+                   <el-col :span="12">
+                      <span class="item-label">开票状态:</span>
+                      <span class="item-value">
+                          <span type="info" v-if="settleBillItem.openBillStatus==0">未开票</span>
+                          <span type="info" v-if="settleBillItem.openBillStatus==1">已开票</span>
+                          <span type="info" v-if="settleBillItem.openBillStatus==2">部分开票</span>
+                          <span type="info" v-if="settleBillItem.openBillStatus==3">不开票</span>
+                          <span type="info" v-if="settleBillItem.openBillStatus==4">已完成</span>
+                      </span>
+                  </el-col>
+
+                   <!-- <el-col :span="12">
+                  </el-col> -->
+                   <el-col :span="12">
+                      <span class="item-label">已付金额:</span><span class="item-value">￥{{ settleBillItem.recedMoney }}</span>
+                  </el-col>
+              </el-row>
+           </el-col>
+            <el-col :span="24" v-for="item in emisSettleSubBillList"  :key="item.id">
+              <el-row :gutter="0" style="display: flex;flex-wrap: wrap;margin-top:10px">
+                <el-col :span="12">
+                    <span class="item-label">运单号:</span><span class="item-value" style="font-size:14px;font-weight: bold;">{{ item.billCode }}</span>
+                </el-col>
+                <el-col :span="12">
+                    <span class="item-label">寄件日期:</span><span class="item-value">{{ parseTime(item.waybillDetail.sendDate, '{y}-{m}-{d}') }}</span>
+                </el-col>
+                 <el-col :span="12">
+                    <span class="item-label">发件人:</span><span class="item-value">{{ item.waybillDetail.sendName }}</span>
+                </el-col>
+                <el-col :span="12">
+                    <span class="item-label">快件类型:</span><span class="item-value">{{ item.waybillDetail.sendSiteName }}--{{ item.waybillDetail.dispatchUnderlingSiteName }}</span>
+                </el-col>
+                <el-col :span="12">
+                    <span class="item-label">总运费:</span><span class="item-value">{{ item.waybillDetail.freight }} CNY</span>
+                </el-col>
+
+                <el-col :span="12" v-for="feeItem in item.feeitemList"  :key="feeItem.id">
+                    <span class="item-label">{{ feeItem.feeName }}:</span><span class="item-value">{{ feeItem.billFee }}{{feeItem.currency}}</span>
+                </el-col>
+
+                <el-col :span="12">
+                    <span class="item-label">件数:</span><span class="item-value">{{ item.waybillDetail.parcelQty }}</span>
+                </el-col>
+                <el-col :span="12">
+                    <span class="item-label">实际重量:</span><span class="item-value">{{ item.waybillDetail.billWeight }}KG</span>
+                </el-col>
+                <el-col :span="12">
+                    <span class="item-label">产品类型:</span><span class="item-value">{{ item.waybillDetail.productTypeName }}</span>
+                </el-col>
+                <el-col :span="12">
+                    <span class="item-label">寄件公司:</span><span class="item-value">{{ item.waybillDetail.sendCompany }}</span>
+                </el-col>
+                <el-col :span="24">
+                    <span class="item-label">备注:</span><span class="item-value">{{ item.waybillDetail.remark }} {{ item.waybillDetail.feeRemark }}</span>
+                </el-col>
+              </el-row>
+           </el-col>
+        </el-row>
+    </el-form>
+    <div style="margin-bottom: 20px;">
+      <!-- <el-button type="primary" v-print="'#payPage'" >打印</el-button> -->
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { getBillPayInfo,getWxPayQrCode} from "@/api/oms/emisCommon";
+import shortLogoImg from '@/assets/logo/short_logo.png'
+
+import { parseTime } from "@/utils/custom";
+
+export default {
+  name: "OnlinePayQr",
+  props:{
+    settleBillNo:{
+        type:String
+    }
+  },
+  components: {  },
+  dicts: [],
+  data() {
+    return {
+      emisSettlePayRecordOptions: [],
+      settleBillItem:this.settleBillObj,
+      // 遮罩层
+      loading: true,
+      shortLogo: shortLogoImg,
+      // 表单参数
+      form: {},
+
+      wxPayQrImageUrl:null,
+
+      emisSettleSubBillList:[],
+      
+    };
+  },
+  computed: {
+  },
+  watch: {
+     
+  },
+  created() {
+    this.initData();
+  },
+
+  methods: {
+    initData() {
+          this.reset();
+          this.form.payScope='1';
+          this.form.payRelList=[];
+
+          this.form.recType=1;
+          if(this.settleBillNo){
+              this.loading = true;
+              getInfoBySettleBillNo(this.settleBillNo).then(response => {
+                this.settleBillItem = response.data;
+                this.loading = false;
+              });
+
+              getWxPayQrCode(this.settleBillNo).then(response => {
+                this.wxPayQrImageUrl = response.data;
+              });
+
+              let qParam ={
+                pageNum:1,
+                pageSize:500,
+                "settleBillNo":this.settleBillNo,
+              }
+              listEmisSettleSubBill(qParam).then(response => {
+                this.emisSettleSubBillList = response.rows;
+              });
+
+          }
+
+    },
+    // 取消按钮
+    cancel() {
+      this.reset();
+      this.$emit("on-cancel");
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        payScope:null,
+        params:{
+          billCodeStr:null,
+        },
+        payRelList:[],
+
+        id: null,
+        payId: null,
+        payType: null,
+        recType: null,
+        payMan: null,
+        payManCode: null,
+        settleBillNo: this.settleBillNo,
+        blAudit: null,
+        auditDate: null,
+        auditManCode: null,
+        auditSiteCode: null,
+        customerCode: null,
+        customerName: null,
+        payMoney: null,
+        payStatus: null,
+        payStatusDesc: null,
+        breakType: null,
+        breakReason: null,
+        breakEmpCode: null,
+        recManCode: null,
+        settleType: this.settleType,
+        refundDate: null,
+        refundManCode: null,
+        refundSeq: null,
+        refundMode: null,
+        refundMoney: null,
+        refundReason: null,
+        refundRemark: null,
+        refundOpManCode: null,
+        refundRegisterSiteCode: null,
+        refundRegisterManCode: null,
+        satisfyMoney: null,
+        satisfyReason: null,
+        allowanceMoney: null,
+        allowanceReason: null,
+        deductionMoney: null,
+        deductionReason: null,
+        otherMoney: null,
+        otherReason: null,
+        tradeDate: null,
+        remark: null,
+        delFlag: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        createSite: null,
+        updateSite: null
+      };
+      this.resetForm("form");
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$emit("on-changed");
+    },
+
+  }
+};
+</script>
+
+
+
+<style scoped lang="scss">
+
+
+.pay-dialog-center {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+}
+
+.pay-title {
+    font-size: 18px;
+    font-weight: 500;
+    color: #2e2f33;
+    text-align: center;
+}
+
+.pay-count{
+    color: #2962ff;
+}
+
+.item-label{
+    font-size: 12px;
+    color: #2e2f33;
+}
+
+.item-value{
+    font-size: 12px;
+    font-weight: 500;
+    color: #2e2f33;
+}
+
+
+</style>