无车牌入场

common/apiurl.js

@@ -187,5 +187,10 @@ export const apiurl = {
     updateInvoiceHeaderUrl: '/client/orderInvoHead',
     // 删除发票开头
     deleteInvoiceHeaderUrl: '/client/orderInvoHead/',
+  },
+  // 道闸出入场获取验证码
+  gateCodeModule: {
+    // 获取道闸入场验证码
+    getGateCodeUrl: ''
   }
 };

common/http.api.js

@@ -162,6 +162,11 @@ const install = (Vue, vm) => {
     // 删除发票开头
     deleteInvoiceHeaderApi: (params = {}) => vm.$u.delete(apiurl.invoiceModule.deleteInvoiceHeaderUrl + params.id)
   };
+  // 道闸出入场获取验证码
+  let gateCodeModuleApi = {
+    // 获取道闸入场验证码
+    getGateCodeUApi: (params = {}) => vm.$u.get(apiurl.gateCodeModule.getGateCodeUrl, params)
+  };
   // 将各个定义的接口名称，统一放进对象挂载到vm.$u.api(因为vm就是this，也即this.$u.api)下
   vm.$u.api = {
     feedbackAdd,
@@ -235,7 +240,8 @@ const install = (Vue, vm) => {
     getOrderInfoByParknoApi,
     indoorPaymentApi,
     adBannerModuleApi,
-    invoiceModuleApi
+    invoiceModuleApi,
+    gateCodeModuleApi
   };
 };
 

pages/VehicleInquiry/VehicleInquiry20230427..vue

@@ -1,225 +0,0 @@
-<!-- 车辆查询 -->
-<template>
-  <view class="container">
-    <view class="container-title">
-      <text>输入车牌，查询车费</text>
-    </view>
-    <!-- 车牌输入 -->
-    <view class="container-input" @click="vehicleNoInputClick">
-      <u-message-input :maxlength="8" width="60" font-size="40" :disabled-keyboard="true" v-model="form.vehicleNo" />
-    </view>
-    <!-- 车辆下拉 -->
-    <view class="container-select">
-      <u-collapse ref="refValue" :head-style="{ fontSize: '28rpx' }">
-        <u-collapse-item title="点击选择车牌" align="center">
-          <scroll-view class="container-select-scroll" scroll-y="true">
-            <u-cell-group v-if="vehicleList.length">
-              <u-cell-item :title="item.value" v-for="(item, index) in vehicleList" :key="index" :arrow="false">
-                <u-radio-group v-model="form.vehicleNo" @change="radioGroupChange">
-                  <u-radio :name="item.value" :key="index" />
-                </u-radio-group>
-              </u-cell-item>
-            </u-cell-group>
-            <template v-else>
-              <view class="container-select-empty">暂无绑定车牌</view>
-            </template>
-          </scroll-view>
-        </u-collapse-item>
-      </u-collapse>
-    </view>
-    <view class="container-btn">
-      <u-button type="primary" :loading="loading" :disabled="!form.vehicleNo" @click="submitVehicleInquiry">确定</u-button>
-    </view>
-    <!-- 选择颜色 -->
-    <u-action-sheet :list="bindVehiclePop.colorList" @click="confirmColor" v-model="bindVehiclePop.colorShow" />
-    <!-- 车牌号键盘 -->
-    <u-keyboard ref="uKeyboard" mode="car" @change="keyboardChange" @confirm="keyboardConfirm" @backspace="backspace" v-model="keyboardshow" />
-    <u-toast ref="uToast" />
-  </view>
-</template>
-
-<script>
-import { base64Encrypt } from '@/utils';
-export default {
-  data() {
-    return {
-      form: {
-        vehicleNo: '',
-        parkNo: ''
-      },
-      vehicleList: [],
-      keyboardshow: false,
-      loading: false,
-      showChangeVehicleNo: false,
-      bindVehiclePop: {
-        colorShow: false,
-        colorList: [
-          {
-            text: '蓝色',
-            colorCode: 0
-          },
-          {
-            text: '黄色',
-            colorCode: 1
-          },
-          {
-            text: '黑色',
-            colorCode: 2
-          },
-          {
-            text: '白色',
-            colorCode: 3
-          },
-          {
-            text: '绿色',
-            colorCode: 4
-          },
-          {
-            text: '其他',
-            colorCode: 99
-          }
-        ]
-      },
-      parkNo: null,
-      parkInfo: {}
-    };
-  },
-  onLoad(options) {
-    const { parkNo } = options;
-    if (parkNo) {
-      this.form.parkNo = parkNo;
-      this.getVehicleInquiryList(parkNo);
-    } else {
-      uni.showModal({
-        title: '提示',
-        content: '参数丢失, 返回首页',
-        showCancel: false,
-        success: function (res) {
-          if (res.confirm) {
-            uni.switchTab({
-              url: '/pages/index/index'
-            });
-          }
-        }
-      });
-    }
-  },
-  methods: {
-    /**
-     * @description: 车牌输入框点击
-     * @return {*}
-     */
-    vehicleNoInputClick() {
-      this.keyboardshow = true;
-      this.form.vehicleNo = '';
-    },
-    /**
-     * @description: 单击车牌
-     * @param {*} e
-     * @return {*}
-     */
-    radioGroupChange(e) {
-      this.form.vehicleNo = e;
-    },
-    /**
-     * @description: 颜色下拉确认
-     * @return {*}
-     */
-    confirmColor() {
-      this.bindVehiclePop.colorShow = false;
-    },
-    /**
-     * @description: 车牌键盘输入变化
-     * @param {*} val
-     * @return {*}
-     */
-    keyboardChange(val) {
-      // 将每次按键的值拼接到value变量中，注意+=写法
-      this.form.vehicleNo += val;
-    },
-    /**
-     * @description: 键盘输入完成确认时
-     * @return {*}
-     */
-    keyboardConfirm() {
-      this.bindVehiclePop.colorShow = true;
-    },
-    /**
-     * @description: 退格键被点击
-     * @return {*}
-     */
-    backspace() {
-      // 删除value的最后一个字符
-      if (this.form.vehicleNo.length) this.form.vehicleNo = this.form.vehicleNo.substr(0, this.form.vehicleNo.length - 1);
-    },
-    /**
-     * @description: 获取当前用户车辆
-     * @return {*}
-     */
-    async getVehicleInquiryList(parkNo) {
-      try {
-        const { data, code } = await this.$u.api.getVehicleInquiryListApi({ parkNo });
-        if (code === 200) {
-          this.parkInfo = data;
-          this.vehicleList = data.vehicleList.map((item) => {
-            return { label: item, value: item };
-          });
-          await this.$nextTick();
-          this.$refs.refValue.init();
-        }
-      } catch (error) {}
-    },
-    /**
-     * @description: 确认车费查询
-     * @return {*}
-     */
-    async submitVehicleInquiry() {
-      const { vehicleNo } = this.form;
-      const reg =
-        /^([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[a-zA-Z](([DF]((?![IO])[a-zA-Z0-9](?![IO]))[0-9]{4})|([0-9]{5}[DF]))|[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1})$/;
-      if (reg.test(vehicleNo)) {
-        this.loading = true;
-        try {
-          const { code } = await this.$u.api.getOrderInfoByParknoApi({ ...this.form });
-          if (code === 200) {
-            this.$refs.uToast.show({
-              title: '查询成功!',
-              type: 'success',
-              url: '/pages/OnsitePayment/OnsitePayment',
-              params: {
-                ...this.form,
-                vehicleNo: base64Encrypt(this.form.vehicleNo)
-              },
-              callback: () => {
-                this.loading = false;
-              }
-            });
-          }
-        } catch (error) {
-          this.loading = false;
-          // this.showToast(error?.msg, 'error');
-        }
-      } else {
-        this.loading = false;
-        this.showToast('请输入有效的车牌号!', 'error');
-      }
-    },
-    /**
-     * @description: 提示
-     * @param {*} title
-     * @param {*} type
-     * @return {*}
-     */
-    showToast(title = '操作失败!', type = 'error') {
-      this.$refs.uToast.show({
-        title,
-        type
-      });
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import './VehicleInquiry.scss';
-</style>

pages/VehicleInquiry/VehicleInquiry20230427.scss

@@ -1,30 +0,0 @@
-.container {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  height: calc(100vh - 44px);
-  &-title {
-    text-align: center;
-    font-size: 30rpx;
-    color: #888;
-    margin-bottom: 40rpx;
-  }
-  &-select {
-    width: 620rpx;
-    text-align: center;
-    color: #777777;
-    padding: 20rpx 0x;
-    &-empty {
-      text-align: center;
-      font-size: 26rpx;
-    }
-    &-scroll {
-      height: 600rpx;
-    }
-  }
-  &-btn {
-    width: 680rpx;
-    margin-top: 40rpx;
-  }
-}

pages/parkentrace/parkentrace.scss

@@ -1,309 +1,52 @@
-.parking-lock {
-  height: calc(100vh - 88rpx);
+page {
   background-color: #f6f6ff;
-  padding-top: 133rpx;
-  .parking-lock-title {
-    font-size: 46rpx;
-    color: #292929;
-    text-align: center;
-    padding-top: 31rpx;
-    line-height: 65rpx;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-  }
-  .parking-lock-tips {
-    width: calc(100% - 72rpx);
-    font-size: 30rpx;
-    color: #777777;
-    text-align: center;
-    margin: 10rpx auto;
-    line-height: 47rpx;
-  }
-  .parking-lock-info {
-    width: calc(100% - 72rpx);
-    margin: 31rpx auto 54rpx;
+}
+.park-entrace {
+  padding: 133rpx 30rpx 0;
+  &-box {
     background-color: #fff;
     border-radius: 15rpx;
     padding: 39rpx 41rpx;
-    .parking-lock-info-item {
-      display: flex;
+    margin-bottom: 80rpx;
+    &-item {
       margin-bottom: 16rpx;
+      display: flex;
       view {
-        font-size: 28rpx;
+        color: #2a2a2a;
         &:first-child {
-          width: 30%;
-          color: #2a2a2a;
-          font-weight: 500;
+          width: 150rpx;
         }
         &:last-child {
           color: #6e6e6e;
         }
       }
-      .weight {
-        color: #2a2a2a !important;
-        font-weight: 500;
-      }
-      .really-money {
-        color: #fa7319 !important;
-      }
-    }
-  }
-  .parking-lock-pay-btn {
-    width: calc(100% - 72rpx);
-    margin: 0 auto;
-    button {
-      width: 100%;
-      height: 100rpx;
-      line-height: 100rpx;
-      background-color: #008cff;
-      border: none;
-      color: #fff;
-      box-shadow: 0px 7px 13px 0px rgba(16, 153, 250, 0.31);
-      font-size: 28rpx;
-      font-weight: 500;
-    }
-  }
-  .parking-lock-begin-box {
-    width: 441rpx;
-    height: 441rpx;
-    line-height: 441rpx;
-    background: #31a2ff;
-    background: linear-gradient(270deg, rgba(49, 162, 255, 0.1) 20%, rgba(49, 162, 255, 1) 100%);
-    border-radius: 50%;
-    text-align: center;
-    margin: 0 auto;
-    // animation: spin 3s linear infinite;
-    .parking-lock-begin-bg {
-      display: inline-block;
-      width: 420rpx;
-      height: 420rpx;
-      line-height: 420rpx;
-      vertical-align: middle;
-      border: solid 12rpx #fff;
-      background: linear-gradient(346deg, #008cff 0%, #95cfff 100%);
-      border-radius: 50%;
-      image {
-        width: 194rpx;
-        height: 239rpx;
-        vertical-align: middle;
-      }
     }
   }
-  .parking-lock-begin-info {
-    text-align: center;
-    font-size: 50rpx;
-    color: #008cff;
-    margin-top: 57rpx;
-  }
-  .parking-lock-loading-box {
-    width: 441rpx;
-    height: 441rpx;
-    line-height: 441rpx;
-    background: #31a2ff;
-    background: linear-gradient(0deg, rgba(49, 162, 255, 0.1) 20%, rgba(49, 162, 255, 1) 100%);
-    border-radius: 50%;
-    text-align: center;
-    margin: 0 auto;
-    animation: spin 3s linear infinite;
-    .parking-lock-loading-bg {
-      display: inline-block;
-      width: 420rpx;
-      height: 420rpx;
-      line-height: 420rpx;
-      vertical-align: middle;
-      border: solid 12rpx #fff;
-      background: linear-gradient(346deg, #008cff 0%, #95cfff 100%);
-      border-radius: 50%;
-      image {
-        width: 194rpx;
-        height: 239rpx;
-        vertical-align: middle;
-      }
-    }
+  &-number {
+    margin: 0 auto 40rpx;
   }
-  .parking-lock-loading-info {
+  &-tips {
+    color: #999999;
+    font-size: 28rpx;
     text-align: center;
-    font-size: 50rpx;
-    color: #008cff;
-    margin-top: 57rpx;
-  }
-  .parking-lock-success {
-    .parking-lock-success-box {
-      width: 441rpx;
-      height: 441rpx;
-      margin: 0 auto;
-      image {
-        width: 100%;
-        height: 100%;
-      }
-    }
-    .parking-lock-success-info {
-      color: #4ccd8a;
-      font-size: 50rpx;
-      text-align: center;
-      margin: 56rpx 0 202rpx;
+    text {
+      color: #fa3534;
+      font-weight: bold;
     }
-    .parking-lock-success-button {
-      width: calc(100% - 80rpx);
-      margin: 0 auto;
-      button {
-        width: 100%;
-        height: 100rpx;
-        line-height: 100rpx;
-        background-color: #008cff;
-        font-size: 28rpx;
-        color: #fff;
-      }
-    }
-  }
-}
-.pay-way {
-  display: flex;
-  justify-content: space-between;
-  width: calc(100% - 34rpx);
-  border-top: solid 1px #979797;
-  margin: 23rpx auto;
-  padding: 38rpx 86rpx;
-  .pay-way-item {
-    text-align: center;
-    font-size: 30rpx;
-    color: #5f5f5f;
-    image {
-      width: 143rpx;
-      height: 143rpx;
-    }
-  }
-}
-.pay-way-close-btn {
-  width: calc(100% - 34rpx);
-  margin: 0 auto 68rpx;
-  border: none;
-  background-color: #3397fa;
-  color: #fff;
-  border-radius: 10rpx;
-}
-@keyframes rotate {
-  0% {
-    transform: rotate(0);
-  }
-  50% {
-    transform: rotate(200deg);
-  }
-  100% {
-    transform: rotate(0);
-  }
-}
-@keyframes spin {
-  from {
-    transform: rotate(0);
-  }
-  to {
-    transform: rotate(359deg);
-  }
-}
-.loadingSelect {
-  text-align: center;
-  margin-top: 20rpx;
-}
-.spinner {
-  margin: auto;
-  width: 50px;
-  height: 60px;
-  text-align: center;
-  font-size: 10px;
-}
-
-.spinner > view {
-  background-color: #6495ed;
-  height: 100%;
-  width: 10rpx;
-  margin-right: 2rpx;
-  display: inline-block;
-
-  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
-  animation: stretchdelay 1.2s infinite ease-in-out;
-}
-
-.spinner .rect2 {
-  -webkit-animation-delay: -1.1s;
-  animation-delay: -1.1s;
-}
-
-.spinner .rect3 {
-  -webkit-animation-delay: -1s;
-  animation-delay: -1s;
-}
-
-.spinner .rect4 {
-  -webkit-animation-delay: -0.9s;
-  animation-delay: -0.9s;
-}
-
-.spinner .rect5 {
-  -webkit-animation-delay: -0.8s;
-  animation-delay: -0.8s;
-}
-
-@-webkit-keyframes stretchdelay {
-  0%,
-  40%,
-  100% {
-    -webkit-transform: scaleY(0.4);
-  }
-  20% {
-    -webkit-transform: scaleY(1);
   }
-}
-
-@keyframes stretchdelay {
-  0%,
-  40%,
-  100% {
-    transform: scaleY(0.4);
-    -webkit-transform: scaleY(0.4);
+  &-btn {
+    margin-top: 40rpx;
   }
-  20% {
-    transform: scaleY(1);
-    -webkit-transform: scaleY(1);
+  &-info {
+    background-color: #fff;
+    border-radius: 15rpx;
+    padding: 39rpx 41rpx;
+    margin-bottom: 80rpx;
+    font-size: 32rpx;
+    color: #fa3534;
   }
 }
-.new-plate-number {
-  margin-bottom: 70rpx;
-}
-.message-input-wrap {
-  margin: 0 -40rpx;
-}
-.message-input-wrap /deep/ .u-input ~ uni-view:last-of-type .u-char-item {
-  background-color: #e8ffe8;
-}
-.really-license-txt {
-  color: #008cff;
-}
-.really-license-txt1 {
-  color: #008cff;
-  margin: 20rpx;
-}
-.popup-vehicleNo-title {
-  font-size: 48rpx;
-  text-align: center;
-  padding-top: 20rpx;
-}
-.popup-vehicleNo-center {
-  width: 95%;
-  height: 2rpx;
-  border-top: solid rgb(146, 146, 146) 2rpx;
-  margin: 30rpx 20rpx 50rpx 20rpx;
-}
-.popup-vehicleNo-select {
-  text-align: center;
-  color: #777777;
-}
-.vehicleNo-btn {
-  display: flex;
-  margin: 40rpx 0;
-}
-.parking-lock-pay-attention {
-  margin: 50rpx;
-  line-height: 48rpx;
-  color: #777777;
+.weight {
+  color: #000 !important;
+  font-weight: 500;
 }

pages/parkentrace/parkentrace.vue

@@ -1,40 +1,39 @@
+<!-- 道闸无牌车入场 -->
 <template>
-  <!-- 地磁 -->
-  <view class="parking-lock">
-    <!-- 地磁支付 -->
-    <template>
-      <view class="parking-lock-pay" v-if="infoData">
-        <!-- <view class="parking-lock-title">支付停车费</view> -->
-        <!-- <view class="parking-lock-tips">请您确认停车费用，确认后请支付费用，结束停车。谢谢您的使用！</view> -->
-        <view class="parking-lock-info">
-          <view class="parking-lock-info-item">
-            <view>停车场</view>
-            <view class="weight">{{ infoData.parkingName }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>入口名称</view>
-            <view>{{ infoData.entranceName }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>通道名称</view>
-            <view>{{ infoData.roadwayName }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>入场时间</view>
-            <view>{{ infoData.inTime }}</view>
-          </view>
+  <view class="park-entrace">
+    <template v-if="infoData">
+      <view class="park-entrace-box">
+        <view class="park-entrace-box-item">
+          <view>停车场</view>
+          <view class="weight">{{ infoData.parkingName }}</view>
         </view>
-        <view class="parking-lock-pay-btn">
-          <button type="default" @click="onEntraceClick">立即入场</button>
+        <view class="park-entrace-box-item">
+          <view>入口名称</view>
+          <view>{{ infoData.entranceName }}</view>
         </view>
-      </view>
-      <view v-else>
-        <view class="parking-lock-info">
-          <view class="parking-lock-info-item">
-            <view>入口无车辆</view>
-          </view>
+        <view class="park-entrace-box-item">
+          <view>通道名称</view>
+          <view>{{ infoData.roadwayName }}</view>
+        </view>
+        <view class="park-entrace-box-item">
+          <view>入场时间</view>
+          <view>{{ infoData.inTime }}</view>
         </view>
       </view>
+      <view class="park-entrace-number">
+        <u-message-input :maxlength="6" :value="code" :disabled-keyboard="true" inactive-color="#008CFF" />
+      </view>
+      <view class="park-entrace-tips">
+        提示：车辆出场时需要使用同一微信/支付宝扫码出场， 若不是， <text>请保存上面6位数字，用于出场时使用。</text></view
+      >
+      <view class="park-entrace-btn">
+        <u-button type="primary" shape="circle" @click="onEntraceClick">立即入场</u-button>
+      </view>
+    </template>
+    <template v-else>
+      <view class="park-entrace-info">
+        <text>入口无车辆</text>
+      </view>
     </template>
     <u-toast ref="uToast" />
   </view>
@@ -42,64 +41,49 @@
 
 <script>
 export default {
-  components: {},
   data() {
     return {
-      intoInfo: {
-        parkNo: '',
-        roadwayNo: ''
-      },
-      infoData: undefined
+      infoData: null,
+      code: ''
     };
   },
-  onLoad(page) {
-    this.intoInfo.parkNo = page?.parkNo;
-    this.intoInfo.roadwayNo = page?.roadwayNo;
+  onLoad(options) {
+    const { parkNo, roadwayNo } = options;
+    this.getOrderDetails(parkNo, roadwayNo);
   },
-  onShow() {
-    this.getOrderDetails(this.intoInfo.parkNo, this.intoInfo.roadwayNo);
-  },
-  onUnload() {},
   methods: {
+    /**
+     * @description: 立即入场
+     * @return {*}
+     */
     onEntraceClick() {
-      let askParams = {
-        orderId: this.infoData.id
-      };
-
-      this.$u.api.entranceByNoVehicleApi(askParams).then((res) => {
+      this.$u.api.entranceByNoVehicleApi({ orderId: this.infoData.id, codeNum: this.code }).then((res) => {
         if (res.code === 200) {
-          this.$refs.uToast.show({
-            title: res.msg || '入场成功',
-            type: 'success'
-          });
-          uni.reLaunch({
-            url: '/pages/parkroadgate/parkroadgate'
-          });
-        } else {
-          this.$refs.uToast.show({
-            title: res.msg || '入场失败',
-            type: 'error'
+          uni.showModal({
+            title: '提示',
+            content: '入场成功',
+            showCancel: false,
+            success: function (res) {
+              if (res.confirm) {
+                uni.switchTab({
+                  url: '/pages/index/index'
+                });
+              }
+            }
           });
         }
       });
     },
     /**
-     * 查询订单信息
-     * @param { String } tqgThree 车位ID
-     * @param { String } orderId 订单id
-     * @param { String } payeeId 收费员ID
+     * @description: 查询订单信息
+     * @param {*} parkNo 停车编号
+     * @param {*} roadwayNo 车道编号
+     * @return {*}
      */
-    getOrderDetails(parkNo, roadwayNo) {
-      this.$u.api.getDetailEntranceApi({ parkNo, roadwayNo }).then((res) => {
-        if (res.code === 200) {
-          this.infoData = res.data;
-        } else {
-          this.$refs.uToast.show({
-            title: res.msg || '订单无数据',
-            type: 'error'
-          });
-        }
-      });
+    async getOrderDetails(parkNo, roadwayNo) {
+      const { data } = await this.$u.api.getDetailEntranceApi({ parkNo, roadwayNo });
+      this.infoData = data;
+      this.code = data?.codeNum;
     }
   }
 };

pages/parkexport/parkexport.scss

@@ -1,318 +1,106 @@
-.parking-lock {
-  height: calc(100vh - 88rpx);
+page {
   background-color: #f6f6ff;
-  padding-top: 10rpx;
-	
-	&-pay {
-		margin-bottom: 30rpx;
-	}
-  .parking-lock-title {
-    font-size: 46rpx;
-    color: #292929;
-    text-align: center;
-    padding-top: 31rpx;
-    line-height: 65rpx;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-  }
-  .parking-lock-tips {
-    width: calc(100% - 72rpx);
-    font-size: 30rpx;
-    color: #777777;
-    text-align: center;
-    margin: 10rpx auto;
-    line-height: 47rpx;
-  }
-  .parking-lock-info {
-    width: calc(100% - 72rpx);
-    margin: 30rpx auto;
-    background-color: #fff;
-    border-radius: 15rpx;
-    padding: 39rpx 41rpx;
-    .parking-lock-info-item {
-      display: flex;
-      margin-bottom: 16rpx;
-      view {
-        font-size: 28rpx;
-        &:first-child {
-          width: 30%;
-          color: #2a2a2a;
-          font-weight: 500;
-        }
-        &:last-child {
-          color: #6e6e6e;
-        }
-      }
-      .weight {
-        color: #2a2a2a !important;
-        font-weight: 500;
-      }
-      .really-money {
-        color: #fa7319 !important;
-      }
-      .vehicle-no {
-        color: #f00 !important;
-        font-weight: 500;
-				font-size: 34rpx;
-      }
+}
+.park-export {
+  padding: 0 30rpx;
+
+  &-number {
+    &-icon {
+      width: 478rpx;
+      height: 478rpx;
+      margin: 63rpx auto 30rpx;
     }
-  }
-  .parking-lock-pay-btn {
-    width: calc(100% - 72rpx);
-    margin: 0 auto;
-    button {
-      width: 100%;
-      height: 100rpx;
-      line-height: 100rpx;
-      background-color: #008cff;
-      border: none;
-      color: #fff;
-      box-shadow: 0px 7px 13px 0px rgba(16, 153, 250, 0.31);
-      font-size: 28rpx;
-      font-weight: 500;
+
+    &-text {
+      color: #999999;
+      font-size: 50rpx;
+      text-align: center;
+      margin-bottom: 80rpx;
     }
-  }
-  .parking-lock-begin-box {
-    width: 441rpx;
-    height: 441rpx;
-    line-height: 441rpx;
-    background: #31a2ff;
-    background: linear-gradient(270deg, rgba(49, 162, 255, 0.1) 20%, rgba(49, 162, 255, 1) 100%);
-    border-radius: 50%;
-    text-align: center;
-    margin: 0 auto;
-    // animation: spin 3s linear infinite;
-    .parking-lock-begin-bg {
-      display: inline-block;
-      width: 420rpx;
-      height: 420rpx;
-      line-height: 420rpx;
-      vertical-align: middle;
-      border: solid 12rpx #fff;
-      background: linear-gradient(346deg, #008cff 0%, #95cfff 100%);
-      border-radius: 50%;
-      image {
-        width: 194rpx;
-        height: 239rpx;
-        vertical-align: middle;
-      }
+
+    &-input {
+      margin-bottom: 40rpx;
     }
-  }
-  .parking-lock-begin-info {
-    text-align: center;
-    font-size: 50rpx;
-    color: #008cff;
-    margin-top: 57rpx;
-  }
-  .parking-lock-loading-box {
-    width: 441rpx;
-    height: 441rpx;
-    line-height: 441rpx;
-    background: #31a2ff;
-    background: linear-gradient(0deg, rgba(49, 162, 255, 0.1) 20%, rgba(49, 162, 255, 1) 100%);
-    border-radius: 50%;
-    text-align: center;
-    margin: 0 auto;
-    animation: spin 3s linear infinite;
-    .parking-lock-loading-bg {
-      display: inline-block;
-      width: 420rpx;
-      height: 420rpx;
-      line-height: 420rpx;
-      vertical-align: middle;
-      border: solid 12rpx #fff;
-      background: linear-gradient(346deg, #008cff 0%, #95cfff 100%);
-      border-radius: 50%;
-      image {
-        width: 194rpx;
-        height: 239rpx;
-        vertical-align: middle;
+
+    &-tips {
+      font-size: 28rpx;
+      color: #999;
+      margin-bottom: 40rpx;
+
+      text {
+        color: #fa3534;
       }
     }
-  }
-  .parking-lock-loading-info {
-    text-align: center;
-    font-size: 50rpx;
-    color: #008cff;
-    margin-top: 57rpx;
-  }
-  .parking-lock-success {
-    .parking-lock-success-box {
-      width: 441rpx;
-      height: 441rpx;
-      margin: 0 auto;
-      image {
-        width: 100%;
-        height: 100%;
-      }
+
+    &-btn {
+      margin-bottom: 40rpx;
     }
-    .parking-lock-success-info {
-      color: #4ccd8a;
-      font-size: 50rpx;
+    &-error {
+      color: #FF6D6D;
+      font-size: 30rpx;
       text-align: center;
-      margin: 56rpx 0 202rpx;
+      margin-bottom: 20rpx;
     }
-    .parking-lock-success-button {
-      width: calc(100% - 80rpx);
-      margin: 0 auto;
-      button {
-        width: 100%;
-        height: 100rpx;
-        line-height: 100rpx;
-        background-color: #008cff;
-        font-size: 28rpx;
-        color: #fff;
-      }
-    }
-  }
-}
-.pay-way {
-  display: flex;
-  justify-content: space-between;
-  width: calc(100% - 34rpx);
-  border-top: solid 1px #979797;
-  margin: 23rpx auto;
-  padding: 38rpx 86rpx;
-  .pay-way-item {
-    text-align: center;
-    font-size: 30rpx;
-    color: #5f5f5f;
-    image {
-      width: 143rpx;
-      height: 143rpx;
-    }
-  }
-}
-.pay-way-close-btn {
-  width: calc(100% - 34rpx);
-  margin: 0 auto 30rpx;
-  border: none;
-  background-color: #3397fa;
-  color: #fff;
-  border-radius: 10rpx;
-}
-@keyframes rotate {
-  0% {
-    transform: rotate(0);
-  }
-  50% {
-    transform: rotate(200deg);
   }
-  100% {
-    transform: rotate(0);
-  }
-}
-@keyframes spin {
-  from {
-    transform: rotate(0);
-  }
-  to {
-    transform: rotate(359deg);
-  }
-}
-.loadingSelect {
-  text-align: center;
-  margin-top: 20rpx;
-}
-.spinner {
-  margin: auto;
-  width: 50px;
-  height: 60px;
-  text-align: center;
-  font-size: 10px;
-}
-
-.spinner > view {
-  background-color: #6495ed;
-  height: 100%;
-  width: 10rpx;
-  margin-right: 2rpx;
-  display: inline-block;
-
-  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
-  animation: stretchdelay 1.2s infinite ease-in-out;
-}
 
-.spinner .rect2 {
-  -webkit-animation-delay: -1.1s;
-  animation-delay: -1.1s;
-}
-
-.spinner .rect3 {
-  -webkit-animation-delay: -1s;
-  animation-delay: -1s;
-}
+  &-order {
+    &-title {
+      font-size: 46rpx;
+      color: #292929;
+      text-align: center;
+      padding-top: 31rpx;
+      line-height: 65rpx;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+    }
+    &-tips {
+      width: calc(100% - 72rpx);
+      font-size: 30rpx;
+      color: #777777;
+      text-align: center;
+      margin: 10rpx auto;
+      line-height: 47rpx;
+    }
+    &-info {
+      margin: 30rpx auto;
+      background-color: #fff;
+      border-radius: 15rpx;
+      padding: 39rpx 41rpx;
 
-.spinner .rect4 {
-  -webkit-animation-delay: -0.9s;
-  animation-delay: -0.9s;
-}
+      &-item {
+        display: flex;
+        margin-bottom: 16rpx;
 
-.spinner .rect5 {
-  -webkit-animation-delay: -0.8s;
-  animation-delay: -0.8s;
-}
-
-@-webkit-keyframes stretchdelay {
-  0%,
-  40%,
-  100% {
-    -webkit-transform: scaleY(0.4);
-  }
-  20% {
-    -webkit-transform: scaleY(1);
-  }
-}
+        view {
+          color: #2a2a2a;
 
-@keyframes stretchdelay {
-  0%,
-  40%,
-  100% {
-    transform: scaleY(0.4);
-    -webkit-transform: scaleY(0.4);
-  }
-  20% {
-    transform: scaleY(1);
-    -webkit-transform: scaleY(1);
+          &:first-child {
+            width: 30%;
+          }
+          &:last-child {
+            color: #6e6e6e;
+          }
+        }
+      }
+    }
+    &-btn {
+      margin-bottom: 40rpx;
+    }
+    &-info {
+      color: #fa3534;
+      font-size: 32rpx;
+    }
   }
 }
-.new-plate-number {
-  margin-bottom: 70rpx;
-}
-.message-input-wrap {
-  margin: 0 -40rpx;
-}
-.message-input-wrap /deep/ .u-input ~ uni-view:last-of-type .u-char-item {
-  background-color: #e8ffe8;
-}
-.really-license-txt {
-  color: #008cff;
-}
-.really-license-txt1 {
-  color: #008cff;
-  margin: 20rpx;
-}
-.popup-vehicleNo-title {
-  font-size: 48rpx;
-  text-align: center;
-  padding-top: 20rpx;
-}
-.popup-vehicleNo-center {
-  width: 95%;
-  height: 2rpx;
-  border-top: solid rgb(146, 146, 146) 2rpx;
-  margin: 30rpx 20rpx 50rpx 20rpx;
-}
-.popup-vehicleNo-select {
-  text-align: center;
-  color: #777777;
+.weight {
+  color: #2a2a2a !important;
+  font-weight: 500;
 }
-.vehicleNo-btn {
-  display: flex;
-  margin: 40rpx 0;
+.really-money {
+  color: #fa7319 !important;
 }
-.parking-lock-pay-attention {
-  margin: 50rpx;
-  line-height: 48rpx;
-  color: #777777;
+.vehicle-no {
+  color: #f00 !important;
+  font-weight: 500;
+  font-size: 34rpx;
 }

pages/parkexport/parkexport.vue

@@ -1,77 +1,90 @@
+<!-- 道闸无牌车出场 -->
 <template>
-  <!-- 地磁 -->
-  <view class="parking-lock">
-    <!-- 地磁支付 -->
+  <view class="park-export">
     <template v-if="infoData">
-      <view class="parking-lock-pay">
-        <view class="parking-lock-title">支付停车费</view>
-        <view class="parking-lock-tips">请您确认停车费用，确认后请支付费用，结束停车。谢谢您的使用！</view>
-        <view class="parking-lock-info">
-          <view class="parking-lock-info-item">
-            <view>车牌号</view>
-            <view class="weight vehicle-no">{{ infoData.vehicleNo }}</view>
+      <template v-if="infoData.needCode">
+        <view class="park-export-number">
+          <view class="park-export-number-icon">
+            <u-image width="100%" height="100%" src="/static/img/no-found-enter-info.png" />
           </view>
-          <view class="parking-lock-info-item">
-            <view>停车场名称</view>
-            <view class="weight">{{ infoData.parkingName }}</view>
+          <view class="park-export-number-text"> 查询不到入场信息 </view>
+          <view class="park-export-number-error" v-if="isInputError">输入错误，请重新输入</view>
+          <view class="park-export-number-input">
+            <u-message-input :maxlength="6" :value="codeNum" inactive-color="#008CFF" @finish="codeInputFinish" />
           </view>
-          <view class="parking-lock-info-item">
-            <view>入场车道</view>
-            <view class="weight">{{ infoData.entranceName }}</view>
+          <view class="park-export-number-tips">
+            提示：未查询到该微信/支付宝扫码入场的信息，<text>请输入车辆扫码入场时页面中的6位数进行结算出场。</text>
           </view>
-          <view class="parking-lock-info-item">
-            <view>入场时间</view>
-            <view class="weight">{{ infoData.inTime }}</view>
+          <view class="park-export-number-btn">
+            <u-button type="primary" shape="circle" :disabled="codeNum.length === 0" @click="codeInputFinishConfirm">确 定</u-button>
           </view>
-          <view class="parking-lock-info-item">
-            <view>出场车道</view>
-            <view class="weight">{{ infoData.outEntranceName }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>出场时间</view>
-            <view class="weight">{{ infoData.outTime }}</view>
-          </view>
-          <!-- <view class="parking-lock-info-item">
-						<view>通道名称</view>
-						<view class="weight">{{infoData.roadwayName}}</view>
-					</view> -->
-          <view class="parking-lock-info-item">
-            <view>免费时长</view>
-            <view class="weight">{{ infoData.freeDuration || `0天0时${free_time}分0秒` }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view class="weight">计费时长</view>
-            <view class="weight">{{ infoData.calcDuration }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>累计停车时长</view>
-            <view class="weight">{{ infoData.duration }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>应收金额</view>
-            <view class="weight">{{ infoData.totalAmount }}元</view>
+        </view>
+      </template>
+      <template v-else>
+        <view class="park-export-order">
+          <view class="park-export-order-title">支付停车费</view>
+          <view class="park-export-order-tips">请您确认停车费用，确认后请支付费用，结束停车。谢谢您的使用！</view>
+          <view class="park-export-order-info">
+            <view class="park-export-order-info-item">
+              <view>车牌号</view>
+              <view class="vehicle-no">{{ infoData.vehicleNo }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>停车场名称</view>
+              <view class="weight">{{ infoData.parkingName }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>入场车道</view>
+              <view class="weight">{{ infoData.entranceName }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>入场时间</view>
+              <view class="weight">{{ infoData.inTime }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>出场车道</view>
+              <view class="weight">{{ infoData.outEntranceName }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>出场时间</view>
+              <view class="weight">{{ infoData.outTime }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>免费时长</view>
+              <view class="weight">{{ infoData.freeDuration || `0天0时${free_time}分0秒` }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view class="weight">计费时长</view>
+              <view class="weight">{{ infoData.calcDuration }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>累计停车时长</view>
+              <view class="weight">{{ infoData.duration }}</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>应收金额</view>
+              <view class="weight">{{ infoData.totalAmount || 0 }}元</view>
+            </view>
+            <view class="park-export-order-info-item">
+              <view>订单编号</view>
+              <view class="weight">{{ infoData.id }}</view>
+            </view>
           </view>
-          <view class="parking-lock-info-item">
-            <view>订单编号</view>
-            <view class="weight">{{ infoData.id }}</view>
+          <view class="park-export-order-btn">
+            <u-button type="primary" shape="circle" v-if="isPay" @click="onEntraceClick">支付出场</u-button>
+            <u-button type="primary" shape="circle" v-else @click="jumpHome">支付成功，返回首页</u-button>
           </view>
         </view>
-        <view class="parking-lock-pay-btn">
-          <button type="default" v-if="isPay" @click="onEntraceClick">支付出场</button>
-          <button type="default" v-else @click="jumpHome('/pages/index/index')">支付成功，返回首页</button>
-        </view>
-      </view>
+      </template>
     </template>
     <template v-else>
-      <view class="parking-lock-info">
-        <view class="parking-lock-info-item-1">
-          <view>{{ tipTxt }}</view>
-        </view>
+      <view class="park-export-order-info">
+        <text>{{ tipTxt }}</text>
       </view>
     </template>
     <!-- 支付方式 -->
     <ChoosePayment
-			v-if="choosePayment"
+      v-if="choosePayment"
       ref="choosePayment"
       :payWayPop="payWayPop"
       :curOrderList="orderList"
@@ -100,16 +113,20 @@ export default {
         parkNo: '',
         roadwayNo: '',
         polyOrderId: '',
-        isBack: 0,
+        isBack: 0
       },
       payWayPop: false, // 支付弹框
-      infoData: undefined, // 订单信息
+      infoData: {
+        needCode: true
+      }, // 订单信息
       orderList: [], // 支付订单列表
       jumpUrl: location.href + '&isBack=1', // 回调地址
       timer: null, // 轮询
       isPay: false, // 支付按钮显示
-			choosePayment: false,
-			tipTxt: '出口无车辆'
+      choosePayment: false,
+      tipTxt: '出口无车辆',
+      codeNum: '',
+      isInputError: false
     };
   },
   onLoad(page) {
@@ -137,7 +154,7 @@ export default {
      * 立即支付
      */
     onEntraceClick() {
-			this.choosePayment = true;
+      this.choosePayment = true;
       this.$nextTick(() => {
         this.$refs['choosePayment'].openPopup({ ...this.infoData }, 'single', 'parking');
       });
@@ -180,14 +197,15 @@ export default {
      * @param { String } parkNo 停车场编号
      * @param { String } roadwayNo 出口编号
      */
-    getOrderDetails(parkNo, roadwayNo) {
+    getOrderDetails(parkNo, roadwayNo, codeNum) {
       uni.showLoading({
         title: '订单查询中...'
       });
       this.$u.api
         .getDetailExportApi({
           parkNo,
-          roadwayNo
+          roadwayNo,
+          codeNum
         })
         .then((res) => {
           if (res.code === 200) {
@@ -198,16 +216,11 @@ export default {
             } else {
               this.isPay = false;
             }
-          } else {
-            this.$refs.uToast.show({
-              title: res.msg || '订单无数据',
-              type: 'error'
-            });
           }
           uni.hideLoading();
         })
         .catch((err) => {
-					this.tipTxt = err?.msg ?? '出口无车辆'
+          this.tipTxt = err?.msg ?? '出口无车辆';
           uni.hideLoading();
         });
     },
@@ -217,10 +230,28 @@ export default {
     closePaymentMethod() {
       this.choosePayment = false;
     },
-    jumpHome(url) {
+    /**
+     * @description: 返回首页
+     * @param {*} url
+     * @return {*}
+     */
+    jumpHome() {
       uni.switchTab({
-        url: url
+        url: '/pages/index/index'
       });
+    },
+    /**
+     * @description: 验证码输入完成
+     * @param {*} code
+     * @return {*}
+     */
+    codeInputFinish(code) {
+      this.codeNum = code;
+      this.codeInputFinishConfirm();
+    },
+    codeInputFinishConfirm() {
+      this.isInputError = this.codeNum.length !== 6;
+      this.getOrderDetails(this.intoInfo.parkNo, this.intoInfo.roadwayNo, this.codeNum);
     }
   }
 };

pages/parkexport/parkexport20230220.vue

@@ -1,222 +0,0 @@
-
-<template>
-  <!-- 地磁 -->
-  <view class="parking-lock">
-    <!-- 地磁支付 -->
-    <template v-if="infoData">
-      <view class="parking-lock-pay">
-        <view class="parking-lock-title">支付停车费</view>
-        <view class="parking-lock-tips">请您确认停车费用，确认后请支付费用，结束停车。谢谢您的使用！</view>
-        <view class="parking-lock-info">
-          <view class="parking-lock-info-item">
-            <view>车牌号</view>
-            <view class="weight">{{ infoData.vehicleNo }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>停车场名称</view>
-            <view class="weight">{{ infoData.parkingName }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>入场车道</view>
-            <view class="weight">{{ infoData.entranceName }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>入场时间</view>
-            <view class="weight">{{ infoData.inTime }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>出场车道</view>
-            <view class="weight">{{ infoData.outEntranceName }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>出场时间</view>
-            <view class="weight">{{ infoData.outTime }}</view>
-          </view>
-          <!-- <view class="parking-lock-info-item">
-						<view>通道名称</view>
-						<view class="weight">{{infoData.roadwayName}}</view>
-					</view> -->
-          <view class="parking-lock-info-item">
-            <view>免费时长</view>
-            <view class="weight">{{ infoData.freeDuration || `0天0时${free_time}分0秒` }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view class="weight">计费时长</view>
-            <view class="weight">{{ infoData.calcDuration }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>累计停车时长</view>
-            <view class="weight">{{ infoData.duration }}</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>应收金额</view>
-            <view class="weight">{{ infoData.totalAmount }}元</view>
-          </view>
-          <view class="parking-lock-info-item">
-            <view>订单编号</view>
-            <view class="weight">{{ infoData.id }}</view>
-          </view>
-        </view>
-        <view class="parking-lock-pay-btn">
-          <button type="default" v-if="isPay" @click="onEntraceClick">支付出场</button>
-          <button type="default" v-else @click="jumpHome('/pages/index/index')">支付成功，返回首页</button>
-        </view>
-      </view>
-    </template>
-    <template v-else>
-      <view class="parking-lock-info">
-        <view class="parking-lock-info-item">
-          <view>出口无车辆</view>
-        </view>
-      </view>
-    </template>
-    <!-- 支付方式 -->
-    <PaymentMethod
-      :payWayPop="payWayPop"
-      :curOrderList="orderList"
-      :jumpUrl="jumpUrl"
-      :exportFlag="true"
-      :sanPay="saopay"
-			:otherParams="{ parkType: 'export' }"
-      @closePaymentMethod="closePaymentMethod"
-    ></PaymentMethod>
-    <u-toast ref="uToast" />
-  </view>
-</template>
-
-<script>
-import PaymentMethod from '@/pages/paymentMethod/paymentMethod.vue';
-export default {
-  components: {
-    PaymentMethod,
-  },
-  data() {
-    return {
-      intoInfo: {
-        parkNo: '',
-        roadwayNo: '',
-        polyOrderId: '',
-        isBack: 0
-      },
-      saopay: true,
-      payWayPop: false, // 支付弹框
-      infoData: undefined, // 订单信息
-      orderList: [], // 支付订单列表
-      jumpUrl: location.href + '&isBack=1', // 回调地址
-      timer: null, // 轮询
-      isPay: false // 支付按钮显示
-    };
-  },
-  onLoad(page) {
-    this.intoInfo.parkNo = page?.parkNo;
-    this.intoInfo.roadwayNo = page?.roadwayNo;
-    this.intoInfo.polyOrderId = page?.polyOrderId;
-    this.intoInfo.isBack = page?.isBack;
-  },
-  onShow() {
-    this.getOrderDetails(this.intoInfo.parkNo, this.intoInfo.roadwayNo);
-    if (this.intoInfo.polyOrderId && this.intoInfo.isBack == 1) {
-      uni.showLoading({
-        title: '订单状态查询中...'
-      });
-      this.timer = setInterval(() => {
-        this.handlePayStatus(this.intoInfo.polyOrderId);
-      }, 1000);
-    }
-  },
-  onUnload() {
-    clearInterval(this.timer);
-  },
-  methods: {
-    /**
-     * 立即支付
-     */
-    onEntraceClick() {
-      this.payWayPop = true;
-    },
-    /**
-     * 反复查询支付状态
-     * @param { String } orderId
-     */
-    handlePayStatus(orderId) {
-      this.$u.api
-        .getOrderStateExportApi({
-          orderId
-        })
-        .then((res) => {
-          if (res.code === 200) {
-            if (res.data.payStatus === 1 || res.data.payStatus === 3) {
-              clearInterval(this.timer);
-              uni.hideLoading();
-              this.getOrderDetails(this.intoInfo.parkNo, this.intoInfo.roadwayNo);
-            } else if (res.data.payStatus === 2) {
-              this.isPay = true;
-              uni.hideLoading();
-            }
-          } else {
-            clearInterval(this.timer);
-            uni.hideLoading();
-            this.$refs.uToast.show({
-              title: res.msg || '支付失败!',
-              type: 'error'
-            });
-          }
-        })
-        .catch(() => {
-          uni.hideLoading();
-          clearInterval(this.timer);
-        });
-    },
-    /**
-     * 查询订单信息
-     * @param { String } parkNo 停车场编号
-     * @param { String } roadwayNo 出口编号
-     */
-    getOrderDetails(parkNo, roadwayNo) {
-      uni.showLoading({
-        title: '订单查询中...'
-      });
-      this.$u.api
-        .getDetailExportApi({
-          parkNo,
-          roadwayNo
-        })
-        .then((res) => {
-          if (res.code === 200) {
-            this.infoData = res.data;
-            this.orderList = [res.data.id];
-            if (res.data.orderStatus == 2 || res.data.orderStatus == 3) {
-              this.isPay = true;
-            } else {
-              this.isPay = false;
-            }
-          } else {
-            this.$refs.uToast.show({
-              title: res.msg || '订单无数据',
-              type: 'error'
-            });
-          }
-          uni.hideLoading();
-        })
-        .catch((err) => {
-          uni.hideLoading();
-        });
-    },
-    /**
-     * 关闭支付弹框
-     */
-    closePaymentMethod() {
-      this.payWayPop = false;
-    },
-    jumpHome(url) {
-      uni.switchTab({
-        url: url
-      });
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import './parkexport.scss';
-</style>

pages/parkroadgate/parkroadgate.scss

@@ -1,30 +1,52 @@
-	.parking-lock-success {
-		padding-top: 80rpx;
-		.parking-lock-success-box {
-			width: 441rpx;
-			height: 441rpx;
-			margin: 0 auto;
-			image {
-				width: 100%;
-				height: 100%;
-			}
-		}
-		.parking-lock-success-info {
-			color: #4CCD8A;
+page {
+  background-color: #f6f6ff;
+}
+.gate {
+  padding: 0 30rpx;
+  &-icon {
+    width: 440rpx;
+    height: 440rpx;
+    margin: 100rpx auto 30rpx;
+  }
+  &-text {
+    text-align: center;
+    color: #008cff;
+    font-size: 50rpx;
+		&-opened {
+			color: #52BD4E;
 			font-size: 50rpx;
 			text-align: center;
-			margin: 56rpx 0 202rpx;
-		}
-		.parking-lock-success-button {
-			width: calc(100% - 80rpx);
-			margin: 0 auto;
-			button {
-				width: 100%;
-				height: 100rpx;
-				line-height: 100rpx;
-				background-color: #008CFF;
-				font-size: 28rpx;
-				color: #fff;
-			}
 		}
-	}
+  }
+  &-number {
+    margin: 100rpx 0 40rpx;
+  }
+  &-tips {
+    color: #999999;
+    font-size: 28rpx;
+    text-align: center;
+    text {
+      color: #ff9c3d;
+    }
+  }
+  &-cancel {
+    margin-top: 100rpx;
+  }
+}
+.rotate-image {
+  -webkit-animation: spin 3s linear infinite;
+  animation: spin 3s linear infinite;
+}
+/* 设置动画 */
+@-webkit-keyframes spin {
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+@keyframes spin {
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}

pages/parkroadgate/parkroadgate.vue

@@ -1,14 +1,26 @@
+<!-- 道闸 -->
 <template>
-  <!-- 道闸 -->
-  <view class="parking-roadgate">
-    <view class="parking-lock-success">
-      <view class="parking-lock-success-box">
-        <image src="../../static/img/parking-lock-achieve.png" mode=""></image>
-      </view>
-      <view class="parking-lock-success-info">已开闸，请入场</view>
-      <view class="parking-lock-success-button">
-        <button @click="cancel">返回</button>
-      </view>
+  <view class="gate" id="page">
+    <view class="gate-icon">
+      <template v-if="status === 'opening'">
+        <u-image width="100%" height="100%" src="/static/img/open-gate-icon.svg" />
+      </template>
+      <template v-else>
+        <u-image width="100%" height="100%" src="/static/img/opened-gate-icon.svg" />
+      </template>
+    </view>
+    <template v-if="status === 'opening'">
+      <view class="gate-text">开闸中，请稍等！</view>
+    </template>
+    <template v-else>
+      <view class="gate-text-opened">已开闸，请入场！</view>
+    </template>
+    <view class="gate-number">
+      <u-message-input :maxlength="6" :value="code" :disabled-keyboard="true" inactive-color="#008CFF" />
+    </view>
+    <view class="gate-tips"> 提示：车辆出场时需要使用同一微信/支付宝扫码出场， 若不是， <text>请保存上面6位数字，用于出场时使用。</text></view>
+    <view class="gate-cancel" v-if="status === 'opened'">
+      <u-button type="primary" shape="circle" @click="handleCancel">返回</u-button>
     </view>
   </view>
 </template>
@@ -16,11 +28,18 @@
 <script>
 export default {
   data() {
-    return {};
+    return {
+      code: '',
+      status: 'opening' // opening:开启中  opened:开启成功
+    };
   },
   methods: {
-    cancel() {
-      uni.reLaunch({
+    /**
+     * @description: 返回
+     * @return {*}
+     */
+    handleCancel() {
+      uni.switchTab({
         url: '/pages/index/index'
       });
     }
@@ -29,5 +48,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import './parkroadgate';
+@import './parkroadgate.scss';
 </style>

static/img/opened-gate-icon.svg

@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="442px" height="441px" viewBox="0 0 442 441" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 3备份</title>
+    <defs>
+        <linearGradient x1="60.4722943%" y1="100%" x2="34.9913817%" y2="0%" id="linearGradient-1">
+            <stop stop-color="#4ACC89" offset="0%"></stop>
+            <stop stop-color="#AEF1CD" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="道闸2" transform="translate(-154.000000, -276.000000)">
+            <g id="编组-3备份" transform="translate(154.500000, 276.000000)">
+                <g id="编组">
+                    <circle id="椭圆形" fill="url(#linearGradient-1)" cx="220.9375" cy="220.9375" r="192.9375"></circle>
+                    <g id="putongtingchewei_huabanfuben" transform="translate(121.000000, 121.000000)" fill="#FFFFFF" fill-opacity="0.105059003" fill-rule="nonzero">
+                        <path d="M190.1,142.1 L181.1,119 C179.4,114.6 175.7,110.8 168.7,110.8 L121.2,110.8 C114.2,110.8 110.6,114.6 108.9,119 L99.8,142.1 C96.2,142.6 89.9,146.7 89.9,154.6 L89.9,184 L100,184 L100,191.3 C100,202.9 113.8,202.7 113.8,191.3 L113.8,184 L176,184 L176,191.3 C176,202.7 189.8,202.9 189.8,191.3 L189.8,184 L200,184 L200,154.6 C200,146.8 193.6,142.6 190.1,142.1 Z M116,123.7 C116.9,121.1 118.1,119.3 121.1,119.3 L168.8,119.3 C171.8,119.3 173.1,121.2 173.9,123.7 L180.7,141.6 L109.2,141.6 L116,123.7 L116,123.7 Z M112,166.3 C107.7,166.3 104.2,162.7 104.2,158.3 C104.2,153.9 107.7,150.3 112,150.3 C116.3,150.3 119.8,153.9 119.8,158.3 C119.8,162.7 116.3,166.3 112,166.3 Z M177.8,166.3 C173.5,166.3 170,162.7 170,158.3 C170,153.9 173.5,150.3 177.8,150.3 C182.1,150.3 185.6,153.9 185.6,158.3 C185.7,162.7 182.2,166.3 177.8,166.3 Z M133.2,54.3 C133.2,24.3 108.5,0 78,0 C76.6,0 75.2,0.1 73.9,0.2 L25,0.2 L25,0.3 L0,0.3 L0,199.8 L28.1,199.8 L28.1,108.7 L73.7,108.7 C75.8,108.9 75.8,108.8 78,108.8 C108.5,108.8 133.2,84.4 133.2,54.3 L133.2,54.3 Z M73.5,80.6 L28.1,80.6 L28.1,28.1 L73.7,28.1 C87,28.7 99.2,40.9 99.2,54.2 C99.2,67.5 86.9,80 73.5,80.6 Z" id="形状"></path>
+                    </g>
+                    <circle id="椭圆形" stroke="#4FCD8C" stroke-width="8" cx="220.5" cy="220.5" r="216.5"></circle>
+                </g>
+                <g id="gou" transform="translate(96.000000, 133.000000)" fill="#FFFFFF" fill-rule="nonzero">
+                    <path d="M87.8274207,175 C84.5050377,174.938305 81.3225037,173.646986 78.8910871,171.374053 L3.80398605,96.3113079 C1.42336497,94.0284617 0.0537851625,90.8833934 0,87.5794913 C-0.0506842356,84.2755893 1.21878422,81.0885048 3.5260417,78.7310231 C8.35987684,73.9080993 16.1290425,73.7848806 21.112342,78.4521052 L21.3902864,78.7310231 L87.5494764,144.859941 L228.778922,3.67673022 C233.562103,-1.15350833 241.32381,-1.23490187 246.206534,3.49397468 C251.089258,8.22285122 251.283721,16.0097257 246.643167,20.9780972 L246.365222,21.2570151 L96.4436972,171.103587 C94.2635871,173.585329 91.1242336,175.004988 87.8274207,175 Z" id="路径"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>