<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.parkName }}</view>
          </view>
          <view class="parking-lock-info-item">
            <input type="text" placeholder="请输入车牌" v-model="formInfo.vehicleNo" />
          </view>
        </view>
        <view class="parking-lock-pay-btn">
          <button type="default" @click="onSearchClick">查询</button>
        </view>
      </view>
      <view v-else>
        <view class="parking-lock-info">
          <view class="parking-lock-info-item">
            <view>入口无车辆</view>
          </view>
        </view>
      </view>
    </template>
  </view>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      intoInfo: {
        parkNo: ''
      },
      formInfo: {
        vehicleNo: ''
      },
      infoData: undefined
    };
  },
  onLoad(page) {
    this.intoInfo.parkNo = page?.parkNo;
  },
  onShow() {
    this.getOrderDetails(this.intoInfo.parkNo);
  },
  onUnload() {},
  methods: {
    onSearchClick() {
      let askParams = {
        parkNo: this.intoInfo.parkNo,
        vehicleNo: this.formInfo.vehicleNo
      };
      this.$u.api.getOrderInfoByParknoApi(askParams).then((res) => {
        if (res.code === 200) {
        }
      });
    },
    /**
     * 查询订单信息
     * @param { String } tqgThree 车位ID
     * @param { String } orderId 订单id
     * @param { String } payeeId 收费员ID
     */
    getOrderDetails(parkNo) {
      this.$u.api.getDetailAdvanceApi({ parkNo }).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 './parkadvance.scss';
</style>
