<template>
  <div class="px-15 pt-15">
    <CarSearchBaseFilter />
    <CarSearchTypeTab class="mt-10" />
    <div class="py-10 text-base text-black-3 font-semibold">选择车型</div>
    <van-divider />
    <CarSearchCarFilter />
    <CarSearchCarList @on-select="handleSelectCar" />
    <van-popup
      v-model:show="selectDriverOption.show"
      position="bottom"
      :style="{ height: '80%' }"
      ><CarSearchDriverList
        v-if="selectDriverOption.show"
        @on-select="handleSelectDriver"
        @close="selectDriverOption.show = false"
    /></van-popup>
  </div>
</template>

<script setup>
const route = useRoute();

// const authStore = useAuthStore();
// const { token } = storeToRefs(authStore);

const selectedCar = ref({});
const selectedDriver = ref({});

const selectDriverOption = reactive({
  show: false,
});

async function handleSelectCar(car) {
  selectedCar.value = car;
  if (route.query.type == "2") {
    // 三方
    // 获取司机信息
    showLoadingToast({
      message: "加载中...",
      duration: 100000,
    });
    try {
      const { data } = await request("/website/app/tourCarDriver/list", {
        query: {
          id: car.relationDriverId,
        },
      });
      selectedDriver.value = data.dataList.length ? data.dataList[0] : {};
      toBookOrder();
      closeToast();
    } catch (error) {
      closeToast();
    }
  } else {
    // 自营
    selectDriverOption.show = true;
  }
}

function handleSelectDriver(driver) {
  selectedDriver.value = driver;
  toBookOrder();
}

async function toBookOrder() {
  // if (!token.value) {
  //   await navigateTo({
  //     path: "/login",
  //     replace: true,
  //     query: {
  //       redirect: route.fullPath,
  //     },
  //   });

  //   return;
  // }
  navigateTo({
    path: "/car/submit-order",
    query: {
      ...route.query,
      carInfo: JSON.stringify(selectedCar.value),
      driverInfo: JSON.stringify(selectedDriver.value),
    },
  });
}
</script>

<style lang="scss" scoped></style>
