<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>
        <view class="parking-lock-pay-btn">
          <button type="default" @click="onEntraceClick">立即入场</button>
        </view>
      </view>
      <view v-else>
        <view class="parking-lock-info">
          <view class="parking-lock-info-item">
            <view>入口无车辆</view>
          </view>
        </view>
      </view>
    </template>
    <u-toast ref="uToast" />
  </view>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      intoInfo: {
        parkNo: '',
        roadwayNo: ''
      },
      infoData: undefined
    };
  },
  onLoad(page) {
    this.intoInfo.parkNo = page?.parkNo;
    this.intoInfo.roadwayNo = page?.roadwayNo;
  },
  onShow() {
    this.getOrderDetails(this.intoInfo.parkNo, this.intoInfo.roadwayNo);
  },
  onUnload() {},
  methods: {
    onEntraceClick() {
      let askParams = {
        orderId: this.infoData.id
      };

      this.$u.api.entranceByNoVehicleApi(askParams).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'
          });
        }
      });
    },
    /**
     * 查询订单信息
     * @param { String } tqgThree 车位ID
     * @param { String } orderId 订单id
     * @param { String } payeeId 收费员ID
     */
    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'
          });
        }
      });
    }
  }
};
</script>

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