parking_h5_all/pages/parkentrace/parkentrace.vue

<!-- 道闸无牌车入场 -->
<template>
  <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="park-entrace-box-item">
          <view>入口名称</view>
          <view>{{ infoData.entranceName }}</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>
</template>

<script>
export default {
  data() {
    return {
      infoData: null,
      code: ''
    };
  },
  onLoad(options) {
    const { parkNo, roadwayNo } = options;
    this.getOrderDetails(parkNo, roadwayNo);
  },
  methods: {
    /**
     * @description: 立即入场
     * @return {*}
     */
    onEntraceClick() {
      this.$u.api.entranceByNoVehicleApi({ orderId: this.infoData.id, codeNum: this.code }).then((res) => {
        if (res.code === 200) {
          uni.showModal({
            title: '提示',
            content: '入场成功',
            showCancel: false,
            success: function (res) {
              if (res.confirm) {
                uni.switchTab({
                  url: '/pages/index/index'
                });
              }
            }
          });
        }
      });
    },
    /**
     * @description: 查询订单信息
     * @param {*} parkNo 停车编号
     * @param {*} roadwayNo 车道编号
     * @return {*}
     */
    async getOrderDetails(parkNo, roadwayNo) {
      const { data } = await this.$u.api.getDetailEntranceApi({ parkNo, roadwayNo });
      this.infoData = data;
      this.code = data?.codeNum;
    }
  }
};
</script>

<style lang="scss" scoped>
@import './parkentrace.scss';
</style>