购买会员卡

刘淇
1 parent 8b40a4fc
Showing 10 changed files with 517 additions and 102 deletions
src/api/cards/cards.js
src/main.js
src/utils/request.js
src/utils/utils.js
src/views/carManage/addCar.vue
src/views/carManage/certification.vue
src/views/cards/CardList.vue
src/views/cards/Cards.vue
src/views/cards/buyCard.vue
src/views/mySelf/selfNav.vue
@@ -20,6 +20,66 @@ export function queryVipAreaCardByOrgId(params) {
   })
 }
+//
+// // 搜索有会员卡的停车场
+// export function queryParkListForVipCard(params) {
+//   return request({
+//     url: 'applyVipCard/queryParkListForVipCard',
+//     method: 'post',
+//     data: params
+//   })
+// }
+
+
+// 搜索停车场
+export function queryParkListForVipCard(params) {
+  return request({
+    url: 'applyVipCard/queryParkListForVipCard',
+    method: 'post',
+    data: params
+  })
+}
+
+// 搜索卡类型
+export function queryVipCardInfoByPlNo(params) {
+  return request({
+    url: 'applyVipCard/queryVipCardInfoByPlNo',
+    method: 'post',
+    data: params
+  })
+}
+
+// 获取用户车牌
+export function queryUserCars(params) {
+  return request({
+    url: 'user/queryUserCars',
+    method: 'post',
+    data: params
+  })
+}
+
+// 创建订单
+export function createVipCardOrder(params) {
+  return request({
+    url: 'vip/createVipCardOrder',
+    method: 'post',
+    data: params
+  })
+}
+
+
+// 会员卡-微信支付
+export function weixinpay(params) {
+  return request({
+    url: 'weixinpay/publicUnifiedOrder',
+    method: 'post',
+    data: params
+  })
+}
+
+
+
+
@@ -69,9 +69,10 @@ import {
   Toast,
   dateFormat,
   Loading,
+  XDialog
 }from 'vux'
-
+Vue.component('x-dialog', XDialog)
 Vue.component('loading', Loading)
 Vue.component('Toast', Toast)
 Vue.component('Confirm', Confirm)
@@ -5,7 +5,7 @@ import axios from &#39;axios&#39;
 const service = axios.create({
   // http://dev.renniting.cn/pay/  赤峰测试
   // http://pay.service.renniting.cn/  赤峰
-  baseURL: 'http://dev.renniting.cn/pay/', // url = base url + request url
+  baseURL: 'http://pay.service.renniting.cn/', // url = base url + request url
   // withCredentials: true, // send cookies when cross-domain requests
   timeout: 6000 // request timeout
 })
@@ -25,6 +25,7 @@ service.interceptors.request.use(
 service.interceptors.response.use(
   response => {
     const res = response.data
+    // console.log(res)
     // if the custom code is not 20000, it is judged as an error.
     if (res.code != '8888') {
       return res
@@ -41,9 +41,14 @@ export default {
     }
   },
   timestampToTime: function(timestamp) {
-    var d = new Date(timestamp);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
-    var youWant = d.getFullYear() + "-" + this.completedString(d.getMonth() + 1) + "-" + this.completedString(d.getDate());
-    return youWant;
+    if(timestamp){
+      var d = new Date(timestamp);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
+      var youWant = d.getFullYear() + "-" + this.completedString(d.getMonth() + 1) + "-" + this.completedString(d.getDate());
+      return youWant;
+    }else{
+      return ''
+    }
+
   },
   timestampTransformTime: function(timestamp) {
     var d = new Date(timestamp);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
@@ -150,13 +155,14 @@ export default {
   // ud8yq5tv0inxupc05xfeau39jywlqoj2  新的id
   // ny1u72b6k374sg379z0kqjgfxe2ycnpw 新的签名
   myVarAppid: "65grtq5tv0wewec05xfeau39jyghhjm",// 公共请求Appid
-  myDeviceInfo: "BC0703A4-AFB0-4B51-9089-9B7487C0CC6E", // 公共请求设备信息
+  myDeviceInfo: "BC0703A4-AFB0-4B51-9089-9B7487C0CC6E", // 公共请求设备信息 80ac1a4218beb19a BC0703A4-AFB0-4B51-9089-9B7487C0CC6E
   myVxAppId: "wxdfb0276f85514ea3",
   // 测试环境 微信赤峰 appid   wxff4cebaedbf4f886
   // 微信赤峰 appid   wx2af2bab90d433c86
   // 黄石 appid    wxa1a66cc7d263afe6
   // 阳明 wxdfb0276f85514ea3
-  myOrgId: "10193", // 归属地 赤峰id  10003    黄石 10079 无锡10005
+  // 无锡 wx1e9001e5940605b1
+  myOrgId: "10193", // 归属地 赤峰id  10003    黄石 10079  无锡10005    扬明10193
   myGetSign: function(objb) { // 获取签名
     var compare = function(obj1, obj2) {
       var val1 = obj1.keyname;
@@ -203,7 +209,7 @@ export default {
       deviceInfo: this.myDeviceInfo,
       salt: salt,
       sign_type: "md5",
-      token: '7f61e743f9e24f86b1673e32c16e181e',  //7f61e743f9e24f86b1673e32c16e181e   sessionStorage.getItem("wx_Token")
+      token: sessionStorage.getItem("wx_Token"),  //de8eb9cce14b4c8f81d027fcda0b78f8   sessionStorage.getItem("wx_Token")
       orgId: this.myOrgId
     };
     return reqData;
@@ -457,13 +457,23 @@ export default {
       userCarsInfoEdit(jsondata).then(data => {
         console.log(data)
         if (data.code == 0) {
-          this.$router.push({
-            path: "myCars",
-            // query: {
-            //   carNumber: plateLicense,
-            //   carNumberColor: this.currentColor
-            // }
-          });
+
+          // source:1  // 1表示来源是购买车牌页面
+
+          if(this.$route.query.source){
+            this.$router.push({
+              path: "buyCard",
+            });
+          }else{
+            this.$router.push({
+              path: "myCars",
+              // query: {
+              //   carNumber: plateLicense,
+              //   carNumberColor: this.currentColor
+              // }
+            });
+          }
+
         }else{
           this.$vux.toast.text(data.message, 'top')
         }
@@ -66,7 +66,7 @@ export default {
         let params = new FormData();
         params.append("picFile", this.fil);
         params.append("fileType", 7);
-        params.append("token", "7f61e743f9e24f86b1673e32c16e181e");
+        params.append("token", sessionStorage.getItem("wx_Token")); // sessionStorage.getItem("wx_Token")
         uploadPic(params).then(data => {
           console.log(data);
           if (data.code == 0) {
@@ -46,12 +46,12 @@ export default {
     }
   },
   mounted(){
-    this.queryVipAreaCardByOrgId()
+    this.queryParkListForVipCard()
   },
   methods:{
-    queryVipAreaCardByOrgId: function() {
+    queryParkListForVipCard: function() {
       let jsondata = this.$utils.commonParams();
-      jsondata.saleChannel = '3' // 售卖渠道:1-APP、2-公众号、3-平台
+      jsondata.saleChannel = '2' // 售卖渠道:1-APP、2-公众号、3-平台
       jsondata.sign = this.$utils.signObject(jsondata);
       queryVipAreaCardByOrgId(jsondata).then(data => {
         console.log(data);
 <template>
   <div style="height: 100%;display: flex;flex-direction: column;">
     <div style="flex: 1;overflow-y: auto;padding: 15px">
-      <div v-if="cardList.length == 0" class="noCardData">
+      <div  class="noCardData" v-if="cardList.length == 0">
         <p>您目前没有任何会员卡,</p>
         <p>请绑定车牌通过认证后再购买会员卡!</p>
       </div>
-      <div class="cardBg">
-        <ul class="cardList">
-          <li>
-            会员卡- 月卡
-          </li>
-          <li>
-            绑定车牌号： 京A12312
-          </li>
-          <li>
-            有效时间段： 2021-11-11 至 2021-12-10
-          </li>
-          <li>
-            适用停车场： 万达停车场
-          </li>
-        </ul>
-      </div>
-      <div class="cardBg">
-        <ul class="cardList">
-          <li>
-            会员卡- 月卡
-          </li>
-          <li>
-            绑定车牌号： 京A12312
-          </li>
-          <li>
-            有效时间段： 2021-11-11 至 2021-12-10
-          </li>
-          <li>
-            适用停车场： 万达停车场
-          </li>
-        </ul>
+
+      <div v-else>
+        <div class="cardBg"  v-for="(i ,index) in cardList">
+          <ul class="cardList">
+            <li>
+              会员卡- {{i.cardType=='1'?'年卡':(i.cardType=='2'?'半年卡':(i.cardType=='3'?'季卡':(i.cardType=='4'?'月卡':(i.cardType=='5'?'日卡':''))))}}
+            </li>
+            <li>
+              绑定车牌号： {{ i.carNumber }}
+            </li>
+            <li>
+              有效时间段： {{i.effDate}} 至 {{i.expDate}}
+            </li>
+            <li>
+              卡名称： {{ i.cardName }}
+            </li>
+          </ul>
+        </div>
+        <!--cardType=='1'?'年卡':(cardType=='2'?'半年卡':(cardType=='3'?'季卡':(cardType=='4'?'月卡':(cardType=='5'?'日卡':''))))-->
+
+
       </div>
+
+
+
     </div>
-    <x-button type="primary" @click.native="$router.push({path:'CardList'})">购买会员卡</x-button>
+    <x-button type="primary" @click.native="$router.push({path:'buyCard'})">购买会员卡</x-button>
   </div>
 </template>
@@ -62,6 +55,7 @@ export default {
         console.log(data);
         if (data.code == 0) {
           let res = data.data;
+          this.cardList = res
         } else {
           this.$vux.toast.text(data.message, "top");
         }
 <template>
   <div>
     <ul class="choose-area">
+
+
       <li>
-        <div style="color: #666">卡名称</div>
-        <div>微纳园卡</div>
+        <div style="color: #666">选择停车场</div>
+        <div @click="parkNameVisible = true">{{parkName}}</div>
+        <div class="arrow">></div>
+        <!--<div class="arrow">></div>-->
       </li>
+
+      <!--<li>-->
+      <!--<div style="color: #666">卡名称</div>-->
+      <!--<div>微纳园卡</div>-->
+      <!--</li>-->
+
       <li>
         <div style="color: #666">选择卡类型</div>
-        <div>{{carType}}</div>
+        <div @click="cardTypeListVisible = true">{{carType}}</div>
+        <div class="arrow">></div>
         <!--<div class="arrow">></div>-->
       </li>
@@ -27,7 +38,7 @@
       <li>
         <div style="color: #666">有效期至</div>
-        <div>{{ $utils.timestampToTime(endDate)}}</div>
+        <div>{{ $utils.timestampToTime(endTimeFunc) }}</div>
       </li>
@@ -42,33 +53,41 @@
       <li>
         <div style="color: #666">单价</div>
-        <div>￥{{unitPrice}}</div>
+        <div>￥{{ (unitPrice/100).toFixed(2)}}</div>
       </li>
       <li>
         <div style="color: #666">优惠金额</div>
-        <div>￥0.00</div>
+        <div>￥{{(disPrice/100).toFixed(2)}}</div>
       </li>
       <li>
         <div style="color: #666">应付金额</div>
-        <div style="color: #A31414">￥{{needPay}}</div>
+        <div style="color: #A31414">￥{{(needPay/100).toFixed(2)}}</div>
       </li>
     </ul>
-    <div class="parkArea leftRightPadding">
-      <p class="parkAreaTitle">
-        <span>本卡同时适用于以下停车场：</span>
-        <span class="parkMore" @click="parkMoreVisible = true">查看更多</span>
+    <!--<div class="parkArea leftRightPadding">-->
+    <!--<p class="parkAreaTitle">-->
+    <!--<span>本卡同时适用于以下停车场：</span>-->
+    <!--<span class="parkMore" @click="parkMoreVisible = true">查看更多</span>-->
+    <!--</p>-->
+
+    <!--<p>停车场停车场停车停车场</p>-->
+    <!--</div>-->
+    <div style="padding:15px;text-align: center">
+      <check-icon :value.sync="agreement">
+      </check-icon>
+      <p style="display: inline-block;height: 23px;line-height: 23px;">我已阅读并同意 <span style="color: blue"
+                                                                                     @click="showHideOnBlur=true">《购买须知》</span>
       </p>
-
-      <p>停车场停车场停车停车场</p>
     </div>
+
     <div style="margin-top: 34px" class="leftRightPadding">
-      <mt-button type="danger" size="large">确定购买</mt-button>
+      <mt-button type="danger" size="large" @click="toPay">确定购买</mt-button>
     </div>
     <!-- @touchmove.prevent 阻止默认事件，在选择时间时阻止页面也跟着滚动-->
@@ -86,12 +105,19 @@
       ></mt-datetime-picker>
     </div>
+    <!--停车场-->
+    <mt-actionsheet
+      :actions="parkNameList"
+      v-model="parkNameVisible">
+    </mt-actionsheet>
+    <!--卡类型-->
     <mt-actionsheet
-      :actions="actions"
-      v-model="popupVisible">
+      :actions="cardTypeList"
+      v-model="cardTypeListVisible">
     </mt-actionsheet>
+    <!--车牌号-->
     <mt-actionsheet
       :actions="carNumList"
       v-model="carNumberVisible">
@@ -105,76 +131,371 @@
       </ul>
     </mt-popup>
+    <div v-transfer-dom>
+      <x-dialog v-model="showHideOnBlur" class="dialog-demo" hide-on-blur>
+        <div class="agreen-box">
+          <p>
+            1. 本停车卡为指定停车场有效使用，为特定的场地停车权限，请按照停车场场地自主选择购买。
+          </p>
+          <p>
+            2. 月卡（季卡）一经售出，概不退卡，允许车牌变更1次（有效期内）。
+          </p>
+          <p>
+            3. 年卡可以支持车牌变更3次（有效期内），年卡退卡需要按照原价扣除已经使用月份（不满一个月按照一个月计算）并退回已开具发票。
+          </p>
+          <p>
+            4. 停车场管理方对车辆及车内财务无看管保全义务，车主须遵守停车场管理规定将车辆停在车场的停车位内，乱停车辆引起的贴条和拖车等后果由车主自行承担。
+          </p>
+          <p>
+            5. 友情提醒：妥善关闭和锁定已停车入位的车辆，不在车内放置现金和其它贵重物品，其它停车规定须遵守所辖停车场的管理规定（参见停车场公示）。
+          </p>
+        </div>
+        <div @click="showHideOnBlur=false">
+          <span class="vux-close">X</span>
+        </div>
+      </x-dialog>
+    </div>
+
+
   </div>
 </template>
 <script>
+import { TransferDomDirective as TransferDom } from "vux";
+import {
+  queryParkListForVipCard,
+  queryVipCardInfoByPlNo,
+  queryUserCars,
+  weixinpay,
+  createVipCardOrder
+} from "@/api/cards/cards";
 import { timestampToTime } from "../../utils/utils.js";
 export default {
   name: "buyCard",
+  directives: {
+    TransferDom
+  },
   data() {
     return {
       startDate: new Date(),
       dateVal: "",
       selectedValue: "",
-      startData: new Date(),
-      endDate: new Date(),
-      popupVisible: false,
-      actions: [
-        { name: "月卡", num: 1, method: this.clickAction },
-        { name: "季卡", num: 3, method: this.clickAction },
-        { name: "年卡", num: 12, method: this.clickAction }
-      ],
-      carType: "月卡",
+      startData: "",
+      endDate: "",
+      parkName: "请点击选择",
+      parkNameVisible: false,
+      parkNameList: [], // 停车场
+      parkNo: "",
+      cardTypeListVisible: false,
+      cardTypeList: [], // 卡类型
+      carType: "请点击选择",
       carNumList: [
-        { name: "停车场1", method: this.clickActionCarNum },
-        { name: "停车场2", method: this.clickActionCarNum },
-        { name: "停车场3", method: this.clickActionCarNum },
-        { name: "停车场4", method: this.clickActionCarNum },
-        { name: "停车场5", method: this.clickActionCarNum }
+        { name: "前往绑定车牌", method: this.addCar }
       ],
-      carNumber: "京A12334",
+      carNumber: "请选择车牌",
       carNumberVisible: false,
       parkMoreVisible: false,
-      cardNum: 1,
-      unitPrice: 10,
-      needPay: 0
+      cardNum: 1, // 卡数量
+      unitPrice: 10, // 单价
+      disPrice: 9, // 优惠金额
+      needPay: 1, // 应付
+      agreement: false,
+      typeNum: 1, // 卡类型判断
+      showHideOnBlur: false, // 购买协议
+      createVipCardOrder: {}, // 创建订单对象
+      orderId: "" // 订单号
     };
   },
+  mounted() {
+    this.queryParkListForVipCard();  // 获取停车场
+    this.queryUserCars();  // 获取用户车牌
+  },
+  computed: {
+    // 卡类型 1-年卡；2-半年卡；3-季卡；4-月卡；5-日卡；
+    endTimeFunc() {
+      if (this.startData) {
+        switch (this.typeNum) {
+          case 1:
+            this.endDate = this.$moment(this.startData).add(12, "month").format("YYYY-MM-DD");
+            return this.$moment(this.startData).add(12, "month").format("YYYY-MM-DD");
+            break;
+          case 2:
+            this.endDate = this.$moment(this.startData).add(6, "month").format("YYYY-MM-DD");
+            return this.$moment(this.startData).add(6, "month").format("YYYY-MM-DD");
+            break;
+          case 3:
+            this.endDate = this.$moment(this.startData).add(3, "month").format("YYYY-MM-DD");
+            return this.$moment(this.startData).add(3, "month").format("YYYY-MM-DD");
+            break;
+          case 4:
+            this.endDate = this.$moment(this.startData).add(1, "month").format("YYYY-MM-DD");
+            return this.$moment(this.startData).add(1, "month").format("YYYY-MM-DD");
+            break;
+          case 5:
+            this.endDate = this.$moment(this.startData).add(1, "days").format("YYYY-MM-DD");
+            return this.$moment(this.startData).add(1, "days").format("YYYY-MM-DD");
+            break;
+        }
+        // return  this.$moment(this.startData).add(1,"month").format("YYYY-MM-DD");
+        // return this.startData.getMonth()+1
+      }
+      // switch (val){
+      //   case 2:
+      //     return this.startData.setMonth(this.startData.getMonth()+1);
+      //     break;
+      // }
+    }
+  },
   methods: {
-    //打开时间选择器
+    // 获取用户绑定车牌
+    queryUserCars() {
+      let jsondata = this.$utils.commonParams();
+      jsondata.sign = this.$utils.signObject(jsondata);
+      queryUserCars(jsondata).then(data => {
+        console.log(data);
+        let res = data.data;
+        if (data.code == 0) {
+          if (res.length > 0) {
+            if (res.length == 3) {
+              this.carNumList = [];
+            }
+            res.forEach((item, index) => {
+              this.carNumList.unshift({
+                name: item.carNumber,
+                method: this.bandingCar
+              });
+            });
+          }
+          console.log(this.carNumList);
+        } else {
+          this.$vux.toast.text(data.message, "top");
+        }
+      });
+    },
+    // 打开时间选择器
     selectData() {
+      // this.dateVal = this.startData
       this.$refs["datePicker"].open();
       // console.log(this.startData)
       // this.endDate = this.startData.setMonth(this.startData.getMonth()+1)
       // console.log(this.endDate)
     },
+    //
+    queryParkListForVipCard() {
+      let jsondata = this.$utils.commonParams();
+      jsondata.parkName = ""; //搜索的停车场名称
+      jsondata.sign = this.$utils.signObject(jsondata);
+      queryParkListForVipCard(jsondata).then(data => {
+        console.log(data);
+        if (data.code == 0) {
+          let res = data.data;
+          res.parkList.forEach((item, i) => {
+            this.parkNameList.push({
+              name: item.plName,
+              parkNo: item.plNo,
+              method: this.parkNameAction
+            });
+          });
+        } else {
+          this.$vux.toast.text(data.message, "top");
+        }
+      });
+    },
     handleConfirm() {
       console.log(this.dateVal);
       this.startData = this.$utils.timestampToTime(this.dateVal);
-      this.endDate = this.dateVal.setMonth(this.dateVal.getMonth() + 1);
+      // this.endDate = this.dateVal.setMonth(this.dateVal.getMonth() + 1);
+    },
+    // 停车场选择事件
+    parkNameAction(e) {
+      console.log(e);
+      this.parkName = e.name;
+      this.parkNo = e.parkNo;
+      // alert(this.parkNo)
+      this.queryVipCardInfoByPlNo();
     },
-    clickAction(e) {
-      console.log(e.name);
+    //  根据停车场搜卡类型
+    queryVipCardInfoByPlNo() {
+      let me = this;
+      let jsondata = this.$utils.commonParams();
+      jsondata.plNo = this.parkNo;
+      jsondata.plNo = this.parkNo;
+      jsondata.sign = this.$utils.signObject(jsondata);
+      queryVipCardInfoByPlNo(jsondata).then(data => {
+        console.log(data);
+        if (data.code == 0) {
+          // res.vipCardList =
+          // this.cardTypeList = res.vipCardList
+          // { name: "月卡", num: 1, method: this.clickAction },
+          let vipCardList = data.data.vipCardList;
+          vipCardList.forEach((item, index) => {
+            me.$set(item, "name", item.cardName);
+            me.$set(item, "method", me.vipCardAction);
+            me.cardTypeList.push(item);
+          });
+          console.log(me.cardTypeList);
+        } else {
+          this.$vux.toast.text(data.message, "top");
+        }
+      });
+    },
+    bandingCar(e) {
+      this.carNumber = e.name;
+    },
+    addCar(e) {
+      this.$router.push({
+        path: "addCar",
+        query: {
+          source: 1  // 1表示来源是购买车牌页面
+        }
+      });
+    },
+    vipCardAction(e) {
+      console.log(e);
       this.carType = e.name;
-      this.endDate = this.startData;
+      // this.startData = e.expDate;
+      // this.endDate = e.effDate;
+      // this.cardNum = e.validNum;
+      this.unitPrice = e.price;
+      this.disPrice = e.price * ((10 - e.discValue) / 10);
+      this.needPay = this.unitPrice - this.disPrice;
+      this.startData = new Date();
+      this.typeNum = e.cardType;
+      this.createVipCardOrder = e;
+      // this.endDate = this.endTimeFunc(e.carType);
+      // this.endDate = this.startData;
+      // 卡类型 1-年卡；2-半年卡；3-季卡；4-月卡；5-日卡；
     },
     clickActionCarNum(e) {
       this.carNumber = e.name;
     },
     addCardNum() { // 增加购买数量
       this.cardNum++;
-      this.calcMoney()
+      this.calcMoney();
     },
     reduceCarNum() { // 增加购买数量
       if (this.cardNum == 1) {
         return;
       }
       this.cardNum--;
-      this.calcMoney()
+      this.calcMoney();
     },
     calcMoney() {
-      this.needPay = this.cardNum*this.unitPrice
+      this.needPay = this.cardNum * (this.unitPrice - this.disPrice);
+    },
+    //  购买
+    toPay() {
+      if (this.parkName == "请点击选择") {
+        this.$vux.toast.text("请选择停车场", "top");
+        return;
+      }
+      if (this.carType == "请点击选择") {
+        this.$vux.toast.text("请选择卡类型", "top");
+        return;
+      }
+      if (this.carNumber == "请选择车牌") {
+        this.$vux.toast.text("请选择车牌", "top");
+        return;
+      }
+      if (!this.agreement) {
+        this.$vux.toast.text("请同意购买须知", "top");
+        return;
+      }
+      this.createOrder();
+    },
+    createOrder() {
+      console.log(this.createVipCardOrder);
+      let me = this;
+      let jsondata = this.$utils.commonParams();
+      jsondata.plNo = this.parkNo; // 停车场id
+      jsondata.cardNo = this.createVipCardOrder.cardNo; // 卡券编码
+      jsondata.cardType = (this.createVipCardOrder.cardType).toString(); // 卡类型
+      jsondata.carType = (this.createVipCardOrder.carType).toString(); //  1-大型车；2-小型车
+      // jsondata.plNo = this.createVipCardOrder.id; // 1-大型车；2-小型车
+      jsondata.price = (this.createVipCardOrder.price).toString(); // 卡单价
+      jsondata.totalAmount = (this.needPay).toString(); // 购买的总金额
+      jsondata.num = this.cardNum; // 购买数量
+      jsondata.effDate = this.$utils.timestampToTime(this.startData); // 生效时间
+      jsondata.expDate = this.$utils.timestampToTime(this.endDate); // 失效时间
+      jsondata.carNumber = this.carNumber; // 卡适用车牌
+      jsondata.optType = "1"; // 操作类型 1 购买 2 续费
+      jsondata.forceBuy = "1";
+      jsondata.sign = this.$utils.signObject(jsondata);
+      createVipCardOrder(jsondata).then(data => {
+        console.log(data);
+        // orderId
+        if (data.code == 0) {
+          this.orderId = data.data.orderId;
+          this.vxPay();
+        } else {
+          this.$vux.toast.text(data.message, "top");
+        }
+      });
+    },
+    vxPay() {
+      let vm = this;
+      let jsondata = this.$utils.commonParams();
+      jsondata.orderId = this.orderId; // 订单号
+      jsondata.payType = "4"; // 支付方式-- 1:支付宝 2：微信 3：银联.
+      jsondata.paySrcType = "301"; // 支付单来源 101：停车付款单 102：停车预付单 103：停车补缴单 104 共享车位 201 余额充值单 202 押金充值单 301 会员卡购买单 302 会员卡续费
+      jsondata.appId = this.$utils.myVxAppId; // 微信标识符
+      jsondata.terminalSource = "3"; // 请求端来源 1： 任你停 2：pda 3：微信公共号
+      jsondata.paySource = "3";
+      jsondata.couponPersonId = "";
+      jsondata.openId = sessionStorage.getItem("wx_openId");
+      jsondata.sign = this.$utils.signObject(jsondata);
+      weixinpay(jsondata).then(res => {
+        console.log(data);
+        if (res.code == 0) { //
+          if (res.data) {
+            var data = res.data;
+            console.log(JSON.stringify(data));
+            if (typeof WeixinJSBridge === "undefined") { // 微信浏览器内置对象。参考微信官方文档
+              if (document.addEventListener) {
+                document.addEventListener("WeixinJSBridgeReady", vm.onBridgeReady(data), false);
+              } else if (document.attachEvent) {
+                document.attachEvent("WeixinJSBridgeReady", vm.onBridgeReady(data));
+                document.attachEvent("onWeixinJSBridgeReady", vm.onBridgeReady(data));
+              }
+            } else {
+              console.log("准备调用微信支付");
+              vm.onBridgeReady(data);
+            }
+          } else {
+            alert("没有找到返回值");
+          }
+        } else {
+          alert(res.message);
+        }
+      });
+    },
+    onBridgeReady(params) {
+      let me = this;
+      console.log("调用微信支付WeixinJSBridge");
+      WeixinJSBridge.invoke(
+        "getBrandWCPayRequest", params,
+        //
+        // 'getBrandWCPayRequest', { // 下面参数内容都是后台返回的
+        //   'appId': data.appId, // 公众号名称，由商户传入
+        //   'timeStamp': data.timeStamp, // 时间戳
+        //   'nonceStr': data.nonceStr, // 随机串
+        //   'package': data.package, // 预支付id
+        //   'signType': data.signType, // 微信签名方式
+        //   'paySign': data.paySign // 微信签名
+        // },
+        function(res) {
+          // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
+          if (res.err_msg === "get_brand_wcpay_request:ok") {
+            console.log("成功");
+            this.$vux.toast.text("支付成功", "top");
+            me.$router.go(-2);
+          } else {
+            console.log("失败");
+            alert("支付失败");
+            me.$router.go(-2);
+          }
+        }
+      );
     }
   },
   filters: {
@@ -266,7 +587,6 @@ export default {
   }
   .park-list {
-
     /*width: 80%;*/
     li {
       padding-left: 20px;
@@ -274,4 +594,23 @@ export default {
     }
   }
+  .agreen-box {
+    padding: 15px;
+    text-align: left;
+    p {
+      margin-bottom: 15px;
+    }
+  }
+
+  .vux-close {
+    margin-top: 8px;
+    margin-bottom: 8px;
+    font-size: 18px;
+  }
+
+  /deep/ .picker-items {
+    width: 100%
+  }
+
+
 </style>
@@ -40,13 +40,13 @@ export default {
   data() {
     return {
       menuList: [
-        { name: "会员卡", path: "" },
-        { name: "车辆管理", path: "" },
+        { name: "会员卡", path: "Cards" },
+        { name: "车辆管理", path: "myCars" },
         { name: "发票管理", path: "eInvoiceWrap" },
         { name: "停车记录", path: "parkNotes" },
         { name: "建议反馈", path: "suggestionBack" }
       ],
-      webAppCode: "",
+      webAppCode: "", // 071hQo0w34xoYX21CP2w3RRw7U1hQo02
       couponNum: 0, // 卡券数量
       acctBalance: 0, // 账户余额
       userPhone: "--",// 账户手机号
@@ -57,9 +57,9 @@ export default {
     };
   },
   created() {
-    this.$vux.loading.show({
-      text: "数据加载中..."
-    });
+    // this.$vux.loading.show({
+    //   text: "数据加载中..."
+    // });
     if (this.$utils.clientBrowser() == "微信") {
       this.webAppCode = this.getCode();
     }
@@ -68,7 +68,7 @@ export default {
     let that = this;
     if(sessionStorage.getItem("wx_openId")){
       this.getTokenByOpenId(sessionStorage.getItem("wx_openId"));
-      // this.getinfoself()
+      this.getinfoself()
     }else{
       if (this.webAppCode) {
         this.getopenid();
@@ -126,6 +126,7 @@ export default {
           let _token = data.data.token;
           console.log('getTokenByOpenId获取到的'+_token)
           sessionStorage.setItem("wx_Token", data.data.token);
+          // alert(data.data.token)
           sessionStorage.setItem("WXPhone", data.data.phoneNum);
           that.getinfoself(); //获取用户信息
         } else {
@@ -231,6 +232,9 @@ export default {
         });
       } else {
         this.$vux.toast.text("请先绑定手机号", "top");
+        this.$router.push({
+          path: "binDing"
+        });
       }
     }
   }