支付方式

liuqimichale
1 parent 21bb7bf6
Showing 3 changed files with 98 additions and 54 deletions
src/components/orderPay.vue
src/components/parkRecord.vue
src/utils/utils.js
@@ -3,26 +3,26 @@
     <div class="car-wrap">
       <div class="carBG" :class="carWrapBG | formateColor">
         <p class="carNumber">{{carNumber}}</p>
-        <p class="payFee">{{payFee/100}}.00元</p>
+        <p class="payFee">{{(arrearageActFee/100).toFixed(2)}}元</p>
       </div>
     </div>
  
     <ul class="fee-wrap">
       <li>
         <span>待缴金额</span>
-        <span>36.00</span>
+        <span>{{(arrearageActFee/100).toFixed(2)}}</span>
       </li>
       <li>
         <span>优惠金额</span>
-        <span>36.00</span>
+        <span>{{(arrearageDiscFee/100).toFixed(2)}}</span>
       </li>
       <li>
         <span>应付金额</span>
-        <span>36.00</span>
+        <span>{{(arrearageActFee/100).toFixed(2)}}</span>
       </li>
     </ul>
     <div style="padding: 20px 18px">
-      <div class="toPay">微信支付</div>
+      <div class="toPay">{{clientBrowser}}支付</div>
     </div>
  
     <p class="tip">
@@ -44,11 +44,23 @@ export default {
     return {
       carWrapBG: 0,
       carNumber: '京A12312',
-      payFee: 0
+      arrearageActFee: 0,
+      arrearageDiscFee:0,
+      arrearageActFee:0,
+      clientBrowser:'', // 客户端
     }
   },
   created() {
-    this.carWrapBG = this.$route.query.carColor
+    this.carWrapBG = this.$route.query.carColor //车牌颜色
+    this.carNumber = this.$route.query.carNumber
+    this.arrearageTotalFee = this.$route.query.arrearageTotalFee
+    this.arrearageDiscFee = this.$route.query.arrearageDiscFee
+    this.arrearageActFee = this.$route.query.arrearageActFee
+    this.clientBrowser = this.$utils.clientBrowser() //支付方式
+      // arrearageTotalFee: res.arrearageTotalFee,//车牌颜色
+      // arrearageDiscFee: res.arrearageDiscFee,//车牌颜色
+      // arrearageActFee: res.arrearageActFee,//车牌颜色
+      // carNumber: this.carNumber // 车牌
   },
   filters:{
     formateColor(val){
@@ -56,9 +56,9 @@
  
           <div class="cost-main  cost-main-history" style="padding-left: 50px;"
  
-            v-for="(i, index) in historyList" :key="i.id"
-            @click="chooseHandle(i, index)"
-            :class="{isChecked: i.checked}"
+               v-for="(i, index) in historyList" :key="i.id"
+               @click="chooseHandle(i, index)"
+               :class="{isChecked: i.checked}"
           >
             <ul class="cost-header">
               <li :class="carColor | formateColor">{{i.carNumber}}</li>
@@ -160,20 +160,20 @@ export default {
   methods: {
     parkRecordList(){
       var salt = this.$utils.myCommonSalt(32);
-      var sortd = [
-        { keyname: 'app_id', value: this.$utils.myVarAppid },
-        { keyname: 'deviceInfo', value: this.$utils.myDeviceInfo },
-        { keyname: 'salt', value: salt },
-        { keyname: 'sign_type', value: 'md5' },
-        { keyname: 'pageNum', value: 1 },
-        { keyname: 'pageSize', value: 1000 },
-        { keyname: 'parkState', value: 10 },
-        { keyname: 'terminalSource', value: 7 },
-        { keyname: 'carNumber', value: this.carNumber },
-        { keyname: 'orgId', value: this.$utils.myOrgId },
-
-      ];
-      var md5sign = this.$utils.myGetSign(sortd);
+      // var sortd = [
+      //   { keyname: 'app_id', value: this.$utils.myVarAppid },
+      //   { keyname: 'deviceInfo', value: this.$utils.myDeviceInfo },
+      //   { keyname: 'salt', value: salt },
+      //   { keyname: 'sign_type', value: 'md5' },
+      //   { keyname: 'pageNum', value: 1 },
+      //   { keyname: 'pageSize', value: 1000 },
+      //   { keyname: 'parkState', value: 10 },
+      //   { keyname: 'terminalSource', value: 7 },
+      //   { keyname: 'carNumber', value: this.carNumber },
+      //   { keyname: 'orgId', value: this.$utils.myOrgId },
+      //
+      // ];
+      // var md5sign = this.$utils.myGetSign(sortd);
       var jsondata = {
         app_id: this.$utils.myVarAppid,
         deviceInfo: this.$utils.myDeviceInfo,
@@ -184,9 +184,11 @@ export default {
         parkState: 10,
         terminalSource: 7,
         carNumber: this.carNumber,
-        sign: md5sign,
+        // sign: md5sign,
         orgId: this.$utils.myOrgId
       }
+      jsondata.sign = this.$utils.signObject(jsondata)
+
  
  
       // jsondata.sign = md5sign
@@ -224,9 +226,13 @@ export default {
         me.historyCheckedLen ++
         if(me.historyCheckedLen == this.historyList.length){
           this.allChecked = true
+
         }
+        me.orderIds.push(i.orderId)
         me.historyCheckedMon += Number(i.totalFee)
       }else{ //单个不选中
+        let _i = me.orderIds.indexOf(i.orderId)
+        me.orderIds.splice(_i,1)
         this.allChecked = false
         me.historyCheckedLen --
         me.historyCheckedMon -= Number(i.totalFee)
@@ -265,27 +271,27 @@ export default {
       var list = "[" + this.orderIds + "]"
       // var orderlist = this.orderIds
       // var codes = "[" + fun.parkCodes + "]"
-
-      var sortd = [
-
-        { keyname: 'app_id', value: this.$utils.myVarAppid },
-        { keyname: 'deviceInfo', value: this.$utils.myDeviceInfo },
-        { keyname: 'salt', value: salt },
-        { keyname: 'sign_type', value: 'md5' },
-        { keyname: 'orderIds', value: list },
-        { keyname: 'terminalSource', value: 7 },
-        { keyname: 'orgId', value: this.$utils.myOrgId },
-        { keyname: 'payType', value:4 },
-        { keyname: 'appId', value: this.$utils.myVxAppId }
-
-      ];
-      var md5sign = this.$utils.myGetSign(sortd);
+      //
+      // var sortd = [
+      //
+      //   { keyname: 'app_id', value: this.$utils.myVarAppid },
+      //   { keyname: 'deviceInfo', value: this.$utils.myDeviceInfo },
+      //   { keyname: 'salt', value: salt },
+      //   { keyname: 'sign_type', value: 'md5' },
+      //   { keyname: 'orderIds', value: list },
+      //   { keyname: 'terminalSource', value: 7 },
+      //   { keyname: 'orgId', value: this.$utils.myOrgId },
+      //   { keyname: 'payType', value:4 },
+      //   { keyname: 'appId', value: this.$utils.myVxAppId }
+      //
+      // ];
+      // var md5sign = this.$utils.myGetSign(sortd);
  
       var jsondata = {
         app_id: this.$utils.myVarAppid,
         deviceInfo: this.$utils.myDeviceInfo,
         salt: salt,
-        sign: md5sign,
+        // sign: md5sign,
         sign_type: "md5",
         appId: this.$utils.myVxAppId,
         orderIds: list,
@@ -293,22 +299,28 @@ export default {
         payType: 4,
         orgId: this.$utils.myOrgId,
       }
+      jsondata.sign = this.$utils.signObject(jsondata)
  
       historyQuery(jsondata).then(response => {
         console.log(response)
-
+        let res = response.data.carArrearages
+        this.$router.push(
+          {
+            path:'orderPay',
+            query:{
+              carColor:0,// 车牌颜色
+              arrearageTotalFee: res.arrearageTotalFee,//车牌颜色
+              arrearageDiscFee: res.arrearageDiscFee,//车牌颜色
+              arrearageActFee: res.arrearageActFee,//车牌颜色
+              carNumber: this.carNumber // 车牌
+            }
+          }
+        )
       })
  
  
  
-      // this.$router.push(
-      //   {
-      //     path:'orderPay',
-      //     query:{
-      //       carColor:0
-      //     }
-      //   }
-      // )
+
     }
   },
   filters: {
@@ -434,7 +446,6 @@ export default {
     }
   }
  
-
   .history-con{
     height: calc(100% - 38px);
     overflow: hidden;
@@ -448,7 +459,6 @@ export default {
     background: #F8F8F8;
   }
  
-
   .cost-main-history{
     margin-bottom: 10px;
     background:#fff url("../assets/images/choose.png") no-repeat 10px center;
@@ -457,8 +467,6 @@ export default {
   }
  
  
-
-
   .isChecked{
     background:#fff url("../assets/images/choosed.png") no-repeat 10px center;
     background-size: 20px 20px;
@@ -86,6 +86,30 @@ export default {
     return time;
   },
  
+  signObject: function (jsonObj){ //签名字段
+    let sort = []
+    for(let k in jsonObj){
+      sort.push({
+        keyname: k,
+        value: jsonObj[k]
+      })
+    }
+    return this.myGetSign(sort)
+  },
+
+  clientBrowser: function () { // 判断客户端
+    if (/MicroMessenger/.test(window.navigator.userAgent)) {
+      console.log("微信客户端");
+      return '微信'
+    } else if (/AlipayClient/.test(window.navigator.userAgent)) {
+      console.log("支付宝客户端");
+      return '支付宝'
+    } else {
+      console.log("其他浏览器");
+      return '支付宝'
+    }
+  },
+
   myVarAppid:'ud8yq5tv0inxupc05xfeau39jywlqoj2',// 公共请求Appid
  
   myDeviceInfo: 'BC0703A4-AFB0-4B51-9089-9B7487C0CC6E', // 公共请求设备信息