续费会员卡

刘淇
1 parent aabd3df4
Showing 10 changed files with 774 additions and 112 deletions
src/api/parkNotes/parkNotes.js
src/api/suggest/suggest.js
src/router/index.js
src/utils/utils.js
src/views/cards/Cards.vue
src/views/cards/renew.vue
src/views/mySelf/feedback/suggestionBack.vue
src/views/mySelf/parkNotes/parkNotes.vue
src/views/mySelf/selfNav.vue
src/views/parkPay/plateNumber.vue
+import request from '@/utils/request'
+
+// 通过车牌查询历史欠费单
+export function queryParkingRecordCarNumbers(params) {
+  return request({
+    url: 'queryParkOrder/queryParkingRecordCarNumbers',
+    method: 'post',
+    data: params
+  })
+}
+
+
+
+
+
+
+
+
+
+import request from '@/utils/request'
+
+// 获取反馈建议问题类型
+export function getFeedbackType(params) {
+  return request({
+    url: 'suggest/getFeedbackType',
+    method: 'post',
+    data: params
+  })
+}
+
+// 保存用户的反馈建议
+export function saveFeedbackAndSuggest(params) {
+  return request({
+    url: 'suggest/saveFeedbackAndSuggest',
+    method: 'post',
+    data: params
+  })
+}
+
+
+
+
+
+
+
+
+
@@ -30,7 +30,10 @@ export default new Router({
     {
       path: '/plateNumber',
       name: 'plateNumber',
-      component: plateNumber
+      component: plateNumber,
+      meta:{
+        title:'停车缴费'
+      }
     },
  
     {
@@ -109,7 +112,10 @@ export default new Router({
     {
       path: '/selfNav',
       name: 'selfNav',
-      component: () => import("@/views/mySelf/selfNav.vue")
+      component: () => import("@/views/mySelf/selfNav.vue"),
+      meta:{
+        title:'个人中心'
+      }
     },
     //
     // ------------------------建议反馈
@@ -126,7 +132,10 @@ export default new Router({
     {
       path: '/parkNotes',
       name: 'parkNotes',
-      component: () => import("@/views/mySelf/parkNotes/parkNotes.vue")
+      component: () => import("@/views/mySelf/parkNotes/parkNotes.vue"),
+      meta:{
+        title:'停车记录'
+      }
     },
     //
     //
@@ -184,6 +193,18 @@ export default new Router({
       }
     },
  
+    {
+      path: '/renew',
+      name: 'renew',
+      component: () => import("@/views/cards/renew.vue"),
+      meta:{
+        title:'续费会员卡'
+      }
+    },
+
+
+
+
  
  
  
@@ -209,7 +209,7 @@ export default {
       deviceInfo: this.myDeviceInfo,
       salt: salt,
       sign_type: "md5",
-      token: sessionStorage.getItem("wx_Token"),  //de8eb9cce14b4c8f81d027fcda0b78f8   sessionStorage.getItem("wx_Token")
+      token: sessionStorage.getItem("wx_Token"),  //c23849735f3442f3b95f7bec816317ae   sessionStorage.getItem("wx_Token")
       orgId: this.myOrgId
     };
     return reqData;
 <template>
   <div style="height: 100%;display: flex;flex-direction: column;">
     <div style="flex: 1;overflow-y: auto;padding: 15px">
-      <div  class="noCardData" v-if="cardList.length == 0">
+      <div class="noCardData" v-if="cardList.length == 0">
         <p>您目前没有任何会员卡,</p>
         <p>请绑定车牌通过认证后再购买会员卡!</p>
       </div>
  
       <div v-else>
-        <div class="cardBg"  v-for="(i ,index) in cardList">
+        <div v-for="(i ,index) in cardList" class="cardBg"
+             :class="{'nianka':i.cardType==1,'bannianka':i.cardType==2,'jika':i.cardType==3,'yueka':i.cardType==4,'rika':i.cardType==5,shixiao:i.cardStatus==0}"
+        >
           <ul class="cardList">
-            <li>
-              会员卡- {{i.cardType=='1'?'年卡':(i.cardType=='2'?'半年卡':(i.cardType=='3'?'季卡':(i.cardType=='4'?'月卡':(i.cardType=='5'?'日卡':''))))}}
+            <li style="padding-left: 25px;">
+              会员卡-
+              {{i.cardType=="1"?"年卡":(i.cardType=="2"?"半年卡":(i.cardType=="3"?"季卡":(i.cardType=="4"?"月卡":(i.cardType=="5"?"日卡":""))))}}
             </li>
             <li>
               绑定车牌号： {{ i.carNumber }}
@@ -22,6 +25,17 @@
               卡名称： {{ i.cardName }}
             </li>
           </ul>
+          <div class="cardStatus"
+               v-if="i.cardStatus==1"
+               :class="{'niankaStatus':i.cardType==1,'banniankaStatus':i.cardType==2,'jikaStatus':i.cardType==3,'yuekaStatus':i.cardType==4,'rikaStatus':i.cardType==5}"
+          >
+            月卡生效中
+          </div>
+          <div class="cardStatus shixiaocardStatus" v-else>月卡已失效</div>
+          <div class="renewBtn" @click="toReNew(i)"
+               v-if="i.cardStatus==1"
+               :class="{'niankaStatus':i.cardType==1,'banniankaStatus':i.cardType==2,'jikaStatus':i.cardType==3,'yuekaStatus':i.cardType==4,'rikaStatus':i.cardType==5}"
+          >续费</div>
         </div>
         <!--cardType=='1'?'年卡':(cardType=='2'?'半年卡':(cardType=='3'?'季卡':(cardType=='4'?'月卡':(cardType=='5'?'日卡':''))))-->
  
@@ -29,7 +43,6 @@
       </div>
  
  
-
     </div>
     <x-button type="primary" @click.native="$router.push({path:'buyCard'})">购买会员卡</x-button>
   </div>
@@ -48,6 +61,7 @@ export default {
     this.queryVipCardsByCustId();
   },
   methods: {
+    // 获取会员卡列表
     queryVipCardsByCustId: function() {
       let jsondata = this.$utils.commonParams();
       jsondata.sign = this.$utils.signObject(jsondata);
@@ -55,11 +69,17 @@ export default {
         console.log(data);
         if (data.code == 0) {
           let res = data.data;
-          this.cardList = res
+          this.cardList = res;
         } else {
           this.$vux.toast.text(data.message, "top");
         }
       });
+    },
+    // 续费
+    toReNew: function(i) {
+      console.log(i);
+      sessionStorage.setItem("renewData", JSON.stringify(i));
+      this.$router.push("renew");
     }
   }
 };
@@ -76,17 +96,82 @@ export default {
   .cardBg {
     width: 100%;
     height: 150px;
-    background: #26a2ff url("../../assets/images/cards/cards.png") no-repeat 20px 20px;
+    position: relative;
+    background-image: url("../../assets/images/cards/cards.png");
+    background-repeat: no-repeat;
+    background-position: 20px 20px;
     background-size: 90% 90%;
     border-radius: 8px;
     margin-bottom: 15px;
+    overflow: hidden;
+  }
+  .nianka{
+    background-color: #dd6c1e;
   }
-  .cardList{
+  .bannianka{
+    background-color: #2A1DD2;
+  }
+  .jika{
+    background-color: #DF6B1B;
+  }
+
+  .yueka{
+    background-color:  #33CCFF;
+  }
+  .rika{
+    background-color: #498816;
+  }
+  .shixiao{
+    background-color: #ccc;
+  }
+
+  .cardList {
     padding: 20px 0 0 20px;
     color: #fff;
-    li{
+    li {
       line-height: 30px;
     }
   }
+  .cardStatus{
+    position: absolute;
+    left: -22px;
+    top: 21px;
+    font-size: 12px;
+    -webkit-transform: rotate(30deg);
+    transform: rotate(-43deg);
+    width: 100px;
+    text-align: center;
+    color: #fff;
+  }
+  .niankaStatus{
+    background-color: #c17b12;
+  }
+  .yuekaStatus{
+    background-color: #3989a3;
+  }
+  .banniankaStatus{
+    background-color: #7972cb;
+  }
+  .jikaStatus{
+    background-color: #f19f67;
+  }
+  .rikaStatus{
+    background-color: #7edb33;
+  }
+  .shixiaocardStatus{
+    background-color: #a59d9d;
+  }
+
+  .renewBtn {
+    position: absolute;
+    top: 20px;
+    right: 20px;
+    /*border: 1px solid #ffbe00;*/
+    /*background: #ffbe00;*/
+    color: #fff;
+    padding: 2px 10px;
+    border-radius: 4px;
+    cursor: pointer;
+  }
  
 </style>
+<template>
+  <div>
+    <ul class="choose-area">
+
+
+      <li>
+        <div style="color: #666">选择停车场</div>
+        <div >{{renewData.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 >{{renewData.cardName}}</div>
+
+        <!--<div class="arrow">></div>-->
+      </li>
+
+
+      <li>
+        <div style="color: #666">绑定车牌</div>
+        <div>{{renewData.carNumber}}</div>
+        <!--<div class="arrow">></div>-->
+      </li>
+
+      <li>
+        <div style="color: #A31414">生效时间</div>
+        <div style="color: #A31414" >{{renewData.expDate }}</div>
+        <!--<div class="arrow">></div>-->
+      </li>
+
+      <li>
+        <div style="color: #666">有效期至</div>
+        <div>{{ $utils.timestampToTime(endTimeFunc) }}</div>
+      </li>
+
+
+      <li>
+        <div style="color: #666">购买数量</div>
+        <div class="choose-num">
+          <span @click="addCardNum">+</span>
+          <span>{{cardNum}}</span>
+          <span @click="reduceCarNum">-</span>
+        </div>
+      </li>
+
+      <li>
+        <div style="color: #666">单价</div>
+        <div>￥{{ (unitPrice/100).toFixed(2)}}</div>
+      </li>
+
+
+      <li>
+        <div style="color: #666">优惠金额</div>
+        <div>￥{{(disPrice/100).toFixed(2)}}</div>
+      </li>
+
+      <li>
+        <div style="color: #666">应付金额</div>
+        <div style="color: #A31414">￥{{(needPay/100).toFixed(2)}}</div>
+      </li>
+
+    </ul>
+
+    <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>
+    </div>
+
+
+    <div style="margin-top: 34px" class="leftRightPadding">
+      <mt-button type="danger" size="large" @click="toPay">确定购买</mt-button>
+    </div>
+
+
+
+    <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: "renew",
+  directives: {
+    TransferDom
+  },
+  data() {
+    return {
+      startDate:new Date(),
+      dateVal: "",
+      startData: "",
+      endDate: "",
+      parkName: "",
+      parkNo: "",
+      cardNum: 1, // 卡数量
+      unitPrice: 0, // 单价
+      disPrice: 0, // 优惠金额
+      needPay: 0, // 应付
+      agreement: false,
+      typeNum: 1, // 卡类型判断
+      showHideOnBlur: false, // 购买协议
+      createVipCardOrder: {}, // 创建订单对象
+      orderId: "", // 订单号
+      renewData: {} // 续费数据
+    };
+  },
+  mounted() {
+    this.renewData = JSON.parse(sessionStorage.getItem("renewData"));
+    console.log(this.renewData);
+    this.unitPrice = this.renewData.price;
+    this.disPrice = this.renewData.price * ((10 - this.renewData.discount) / 10);
+    this.needPay = this.unitPrice - this.disPrice;
+    this.typeNum = this.renewData.cardType
+    this.startData = this.renewData.expDate
+    // 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: {
+
+
+
+
+    clickActionCarNum(e) {
+      this.carNumber = e.name;
+    },
+    addCardNum() { // 增加购买数量
+      this.cardNum++;
+      this.calcMoney();
+    },
+    reduceCarNum() { // 增加购买数量
+      if (this.cardNum == 1) {
+        return;
+      }
+      this.cardNum--;
+      this.calcMoney();
+    },
+    calcMoney() {
+      this.needPay = this.cardNum * (this.unitPrice - this.disPrice);
+    },
+    //  购买
+    toPay() {
+
+      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.renewData.parkNo; // 停车场id
+      jsondata.cardNo = this.renewData.cardNo; // 卡券编码
+      jsondata.cardType = this.renewData.cardType; // 卡类型
+      jsondata.carType = this.renewData.carType; //  1-大型车；2-小型车
+      // jsondata.plNo = this.createVipCardOrder.id; // 1-大型车；2-小型车
+      jsondata.price = this.renewData.price; // 卡单价
+      jsondata.totalAmount = (this.needPay).toString(); // 购买的总金额
+      jsondata.num = (this.cardNum).toString(); // 购买数量
+      jsondata.effDate = this.renewData.expDate; // 生效时间
+      jsondata.expDate = this.$utils.timestampToTime(this.endTimeFunc); // 失效时间
+      jsondata.carNumber = this.renewData.carNumber; // 卡适用车牌
+      jsondata.optType = "2"; // 操作类型 1 购买 2 续费
+      jsondata.forceBuy = "1";
+      jsondata.cardCouponsId = this.renewData.custCardNo
+      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 = "302"; // 支付单来源 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 = 'o0Moh6eQhTm5bZVqT6wjdSUsZonM'; // o0Moh6eQhTm5bZVqT6wjdSUsZonM   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);
+          }
+        }
+      );
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+  .choose-area {
+    background: #fff;
+    padding: 0 10px;
+  }
+
+  .choose-area > li {
+    padding-right: 20px;
+    position: relative;
+    height: 38px;
+    line-height: 38px;
+    border-bottom: 1px solid #EFEFEF;
+    display: flex;
+    justify-content: space-between;
+    .arrow {
+      position: absolute;
+      right: 0;
+      top: 0;
+      font-size: 16px;
+    }
+    &:last-child {
+      border-bottom: 0;
+    }
+  }
+
+  .choose-num {
+    height: 28px;
+    margin-top: 5px;
+    line-height: 28px;
+    display: flex;
+    border: 1px solid #D8D8D8;
+    span {
+      display: inline-block;
+      &:nth-of-type(1) {
+        width: 28px;
+        height: 28px;
+        text-align: center;
+        cursor: pointer;
+      }
+      &:nth-of-type(2) {
+        width: 50px;
+        text-align: center;
+        border-left: 1px solid #D8D8D8;
+        border-right: 1px solid #D8D8D8;
+      }
+      &:nth-of-type(3) {
+        width: 28px;
+        height: 28px;
+        text-align: center;
+        cursor: pointer;
+      }
+    }
+  }
+
+  .parkArea {
+    padding-top: 10px;
+    padding-bottom: 10px;
+    margin-top: 10px;
+    background: #fff;
+    color: #999;
+  }
+
+  .parkAreaTitle {
+    display: flex;
+    justify-content: space-between;
+    color: #666;
+  }
+
+  .parkMore {
+    cursor: pointer;
+  }
+
+  .park-list-wrap {
+    width: 80%;
+    max-height: 70%;
+    overflow-y: scroll;
+    border-radius: 5px;
+  }
+
+  .park-list {
+    /*width: 80%;*/
+    li {
+      padding-left: 20px;
+      line-height: 25px;
+    }
+  }
+
+  .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>
@@ -3,46 +3,80 @@
     <p class="suggestion-tip">请选择您反馈的问题类型</p>
     <ul class="suggestionList">
       <li
-        @click="chooseHandle(index)"
         v-for="(i, index) in suggestionList"
-        :key="i.id"
+        @click="chooseHandle(index,i.code)"
+        :key="i.name"
         :class="{choosedActive: currentIndex==index}"
       >
-        {{i.text}}
+        {{i.name}}
       </li>
     </ul>
  
     <div class="clear"></div>
  
-    <mt-field label="" placeholder="请详细描述反馈问题，或提出改进建议。（300字以内）" type="textarea" rows="4" v-model="introduction" :attr="{ maxlength: 2 }"></mt-field>
+    <mt-field label="" placeholder="请详细描述反馈问题，或提出改进建议。（300字以内）" type="textarea" rows="4" v-model.trim="introduction" :attr="{ maxlength: 300 }"></mt-field>
  
     <div  style="margin-top: 34px">
-      <mt-button type="danger" size="large">提交</mt-button>
+      <mt-button type="danger" size="large" @click="saveHandle">提交</mt-button>
     </div>
   </div>
 </template>
  
 <script>
+import {
+  getFeedbackType,
+  saveFeedbackAndSuggest
+} from "@/api/suggest/suggest";
+
 export default {
   name: 'suggestionBack',
   data() {
     return {
-      suggestionList: [
-        { id: 1, text: 'APP问题' },
-        { id: 2, text: '支付问题' },
-        { id: 3, text: '停车场问题' },
-        { id: 4, text: '服务投诉' },
-        { id: 5, text: '改进建议' },
-        { id: 6, text: '其他问题' },
-      ],
+      suggestionList: [],
       currentIndex: 0,
+      feedbackCode:1,
       introduction: '',
     }
   },
+  mounted(){
+    this.getFeedbackType1()
+  },
   methods: {
-    chooseHandle: function (i) {
-      console.log(i)
+    // 获取反馈建议问题类型
+    getFeedbackType1: function(){
+      let jsondata =  this.$utils.commonParams();
+      console.log(jsondata)
+      jsondata.sign = this.$utils.signObject(jsondata);
+      getFeedbackType(jsondata).then(data => {
+        console.log(data)
+        this.suggestionList = data.data
+      })
+    },
+    // 反馈建议问题类型切换事件
+    chooseHandle: function (i,code) {
+      console.log(code)
       this.currentIndex = i
+      this.feedbackCode = code
+    },
+    // 提交建议反馈事件
+    saveHandle: function() {
+      if(this.introduction){
+        let jsondata =  this.$utils.commonParams();
+        jsondata.feedbackCode = this.feedbackCode
+        jsondata.suggestDesc = this.introduction
+        jsondata.sign = this.$utils.signObject(jsondata);
+        saveFeedbackAndSuggest(jsondata).then(data => {
+          console.log(data)
+          if (data.code == 0) {
+            this.introduction = ''
+            this.$vux.toast.text('提交反馈成功', "top");
+          }else{
+            this.$vux.toast.text(data.message, "top");
+          }
+        })
+      }else{
+        this.$vux.toast.text('请输入反馈内容后再提交', "top");
+      }
     }
   }
 }
 <template>
   <div>
-    <ul class="notesList">
-      <li>车牌号: <span>蒙DMW169</span></li>
-      <li>车牌颜色: <span>蓝色</span></li>
-      <li>进场时间: <span>2020-12-19 12：59：18</span></li>
-      <li>出场时间: <span>2020-12-19 12：59：18</span></li>
-      <li>停车时长: <span>18分33秒</span></li>
-    </ul>
-    <ul class="notesList">
-      <li>车牌号: <span>蒙DMW169</span></li>
-      <li>车牌颜色: <span>蓝色</span></li>
-      <li>进场时间: <span>2020-12-19 12：59：18</span></li>
-      <li>出场时间: <span>2020-12-19 12：59：18</span></li>
-      <li>停车时长: <span>18分33秒</span></li>
-    </ul>
+    <div v-if="notesList.length>0">
+      <ul class="notesList" v-for="(i, index) in notesList">
+        <li>车牌号: <span>{{i.carNumber}}</span></li>
+        <li>车牌颜色: <span>蓝色</span></li>
+        <li>进场时间: <span>{{i.parkInTime}}</span></li>
+        <li>出场时间: <span>{{i.parkOutTime}}</span></li>
+        <li>停车时长: <span>{{i.parkDuration}}</span></li>
+      </ul>
+      <ul class="notesList">
+        <li>车牌号: <span>蒙DMW169</span></li>
+        <li>车牌颜色: <span>蓝色</span></li>
+        <li>进场时间: <span>2020-12-19 12：59：18</span></li>
+        <li>出场时间: <span>2020-12-19 12：59：18</span></li>
+        <li>停车时长: <span>18分33秒</span></li>
+      </ul>
+    </div>
  
-    <div class="noRecord" >暂无记录</div>
+
+    <div class="noRecord" v-else>暂无记录</div>
  
   </div>
 </template>
  
 <script>
+import {
+  queryParkingRecordCarNumbers
+} from "@/api/parkNotes/parkNotes";
 export default {
-  name: 'parkRecord'
-}
+  name: "parkRecord",
+  data() {
+    return {
+      notesList: []
+    };
+  },
+  mounted() {
+    this.getRecord();
+  },
+  methods: {
+    getRecord: function() {
+      let jsondata = this.$utils.commonParams();
+      console.log(jsondata);
+      jsondata.parkState = "20";
+      /**停车状态 10:在场 ,20:离场.*/
+      jsondata.orderState = "40";
+      /**订单状态[字典表:ORDER_STATE]:10:待核算,20：待支付,30:支付中,40：支付完成,52:欠费逃逸, 53:已补缴 60:退款中 70:退款成功*/
+      jsondata.sign = this.$utils.signObject(jsondata);
+      queryParkingRecordCarNumbers(jsondata).then(data => {
+        console.log(data);
+        this.notesList = data.data;
+        console.log(this.notesList)
+      });
+    }
+  }
+};
 </script>
  
 <style scoped lang="scss">
@@ -40,6 +40,7 @@ export default {
   data() {
     return {
       menuList: [
+        { name: "停车缴费", path: "plateNumber" },
         { name: "会员卡", path: "Cards" },
         { name: "车辆管理", path: "myCars" },
         { name: "发票管理", path: "eInvoiceWrap" },
@@ -68,7 +69,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();
@@ -18,20 +18,20 @@
     <div class="wrap">
       <!--<p style="margin-bottom: 18px;margin-top: 18px;">请选择车牌颜色</p>-->
  
-      <!--<ul class="color-choose">-->
-        <!--<li v-for="(i,index) in colorList" :key="i.name" @click="chooseColor(index)"-->
-        <!--:style="{color:currentColor==index?'#FFF':'',background:  currentColor==index?activeBG:'' }"-->
-        <!--&gt;-->
-          <!--{{i.name}}-->
-        <!--</li>-->
+      <ul class="color-choose">
+        <li v-for="(i,index) in colorList" :key="i.name" @click="chooseColor(index)"
+            :style="{color:currentColor==index?'#FFF':'',background:  currentColor==index?activeBG:'' }"
+        >
+          {{i.name}}
+        </li>
  
-      <!--</ul>-->
+      </ul>
  
  
  
  
-
-      <p style="margin-bottom: 18px;margin-top: 18px;">请输入车牌号码</p>
+      <p style="margin-bottom: 18px;margin-top: 18px;"></p>
+      <!--<p style="margin-bottom: 18px;margin-top: 18px;">请输入车牌号码</p>-->
       <div class="num-box">
         <div class="num0" @click="clickFirstWrap()">
           <span>{{formData.num0}}</span>
@@ -47,30 +47,30 @@
       </div>
  
  
-      <div class="radio-box">
-        <label class="flex-items-center">
-          <img v-if="formData.commonCard == 1"
-               src="../../assets/images/parkPay/icon_chose_s@2x.png"
-               alt="">
-          <img v-else
-               src="../../assets/images/parkPay/icon_chose_n@2x.png"
-               alt="">
-          <input type="radio"
-                 v-model="formData.commonCard"
-                 value="1" />普通车牌
-        </label>
-        <label class="flex-items-center">
-          <img v-if="formData.commonCard == 2"
-               src="../../assets/images/parkPay/icon_chose_s@2x.png"
-               alt="">
-          <img v-else
-               src="../../assets/images/parkPay/icon_chose_n@2x.png"
-               alt="">
-          <input type="radio"
-                 v-model="formData.commonCard"
-                 value="2" />新能源车牌
-        </label>
-      </div>
+      <!--<div class="radio-box">-->
+      <!--<label class="flex-items-center">-->
+      <!--<img v-if="formData.commonCard == 1"-->
+      <!--src="../../assets/images/parkPay/icon_chose_s@2x.png"-->
+      <!--alt="">-->
+      <!--<img v-else-->
+      <!--src="../../assets/images/parkPay/icon_chose_n@2x.png"-->
+      <!--alt="">-->
+      <!--<input type="radio"-->
+      <!--v-model="formData.commonCard"-->
+      <!--value="1" />普通车牌-->
+      <!--</label>-->
+      <!--<label class="flex-items-center">-->
+      <!--<img v-if="formData.commonCard == 2"-->
+      <!--src="../../assets/images/parkPay/icon_chose_s@2x.png"-->
+      <!--alt="">-->
+      <!--<img v-else-->
+      <!--src="../../assets/images/parkPay/icon_chose_n@2x.png"-->
+      <!--alt="">-->
+      <!--<input type="radio"-->
+      <!--v-model="formData.commonCard"-->
+      <!--value="2" />新能源车牌-->
+      <!--</label>-->
+      <!--</div>-->
  
  
       <div class="submit-box" @click="submitFn()">
@@ -97,7 +97,7 @@
       <div class="first-word"
            @click="selectFirstWord($event)">
         <div class="word">
-          <span>苏</span>
+          <span>蒙</span>
         </div>
         <div class="word">
           <span>湘</span>
@@ -157,7 +157,7 @@
           <span>甘</span>
         </div>
         <div class="word">
-          <span>蒙</span>
+          <span>苏</span>
         </div>
         <div class="word">
           <span>青</span>
@@ -199,38 +199,38 @@
           <span>新</span>
         </div>
         <!--<div class="word">-->
-          <!--<span>学</span>-->
+        <!--<span>学</span>-->
         <!--</div>-->
         <div class="word bordernone">
-        <!-- <img src="../assets/images/icon-switch.png" alt=""> -->
+          <!-- <img src="../assets/images/icon-switch.png" alt=""> -->
         </div>
       </div>
  
       <!--<div class="first-word"-->
-           <!--@click="selectFirstWord($event)">-->
-        <!--<div class="word">-->
-          <!--<span>港</span>-->
-        <!--</div>-->
-        <!--<div class="word">-->
-          <!--<span>澳</span>-->
-        <!--</div>-->
-        <!--<div class="word">-->
-          <!--<span>领</span>-->
-        <!--</div>-->
+      <!--@click="selectFirstWord($event)">-->
+      <!--<div class="word">-->
+      <!--<span>港</span>-->
+      <!--</div>-->
+      <!--<div class="word">-->
+      <!--<span>澳</span>-->
+      <!--</div>-->
+      <!--<div class="word">-->
+      <!--<span>领</span>-->
+      <!--</div>-->
  
-        <!--<div class="word">-->
-          <!--<span>警</span>-->
-        <!--</div>-->
+      <!--<div class="word">-->
+      <!--<span>警</span>-->
+      <!--</div>-->
  
  
-        <!--<div class="word bordernone">-->
-        <!--</div>-->
-        <!--<div class="word bordernone">-->
-        <!--</div>-->
-        <!--<div class="word bordernone">-->
-        <!--</div>-->
-        <!--<div class="word bordernone">-->
-        <!--</div>-->
+      <!--<div class="word bordernone">-->
+      <!--</div>-->
+      <!--<div class="word bordernone">-->
+      <!--</div>-->
+      <!--<div class="word bordernone">-->
+      <!--</div>-->
+      <!--<div class="word bordernone">-->
+      <!--</div>-->
       <!--</div>-->
     </div>
     <div class="keyboard-wrap" v-if="keyBoardStatus === true">
@@ -301,6 +301,8 @@ import {swiperQuery} from &#39;../../api/plateNumber/plateNumber&#39;
 export default {
   data () {
     return {
+
+      //  0:蓝牌;1:黄牌;2:白牌;3:黑牌;4:绿色
       colorList:[
         {
           name:'蓝牌',
@@ -310,16 +312,17 @@ export default {
           name:'黄牌',
           id:'2'
         },
+
         {
-          name:'绿牌',
+          name:'白牌',
           id:'3'
         },
         {
-          name:'白牌',
+          name:'黑牌',
           id:'4'
         },
         {
-          name:'黑牌',
+          name:'绿牌',
           id:'5'
         },
       ],
@@ -420,23 +423,28 @@ export default {
         }
       })
     },
-    chooseColor (index){ // 颜色选择
+    chooseColor (index){ // 颜色选择    0:蓝牌;1:黄牌;2:白牌;3:黑牌;4:绿色
       this.currentColor = index
       switch (this.currentColor) {
         case 0 :
+          this.formData.commonCard = '1'
           return this.activeBG = '#0054C0'
           break;
         case 1 :
+          this.formData.commonCard = '1'
           return this.activeBG = '#FEBE00'
           break;
         case 2 :
-          return this.activeBG = '#97DEA1'
+          this.formData.commonCard = '1'
+          return this.activeBG = '#E4E5E7'
           break;
         case 3 :
-          return this.activeBG = '#E4E5E7'
+          this.formData.commonCard = '1'
+          return this.activeBG = '#333333'
           break;
         case 4 :
-          return this.activeBG = '#333333'
+          this.formData.commonCard = '2'
+          return this.activeBG = '#97DEA1'
           break;
       }
     },
@@ -504,7 +512,7 @@ export default {
         plateLicense = this.plate_license_2
         plateLicense = this.palindrome(plateLicense)
         if (plateLicense.length < 8) {
-           this.$msgbox('提示', '请输入正确的车牌号')
+          this.$msgbox('提示', '请输入正确的车牌号')
           return
         }
       }