<template>
  <view
    class="quick-access border-box flex flex-nowrap items-center ml-12 pt-8 pb-8"
  >
    <view
      class="item border-box rounded-50 flex flex-row items-center"
      v-for="(item, index) in itemList"
      :key="index"
      @click="sendReply(item)"
    >
      <view class="flex items-center justify-center">
        <image v-if="item.icon" class="icon" :src="item.icon" />
        <text class="font-size-14 color-2D91FF line-height-20">
          {{ item.title }}
        </text>
      </view>
    </view>
  </view>
</template>

<script setup>
import { onMounted, ref } from "vue";
import { currentClientType, ClientType } from "@/constant/base";

const itemList = ref([
  {
    icon: "",
    title: "快速预定",
    type: "Command.quickBooking",
  },
  {
    icon: "",
    title: "探索发现",
    type: "Command.discovery",
  },
  {
    icon: "",
    title: "呼叫服务",
    type: "Command.createWorkOrderCard",
  },
  {
    icon: "https://oss.nianxx.cn/mp/static/version_101/home/more.png",
    title: "更多",
    type: "Command.more",
  },
]);

const emits = defineEmits(["replySent"]);

const sendReply = (item) => {
  if (item.type === "Command.more") {
    uni.$emit("SHOW_MORE_POPUP");
    return;
  }
  emits("replySent", item); // 向父组件传递数据
};

// onMounted(() => {
//   initData();
// });

const initData = () => {
  itemList.value =
    currentClientType() === ClientType.TIANMU
      ? [
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_yuding.png",
            showIcon: false,
            title: "快速预定",
            content: "预定门票、房间、餐食",
            type: "Command.quickBooking",
          },
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_find.png",
            showIcon: false,
            title: "探索发现",
            content: "探索玩法、出片佳地",
            type: "Command.discovery",
          },
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_call.png",
            showIcon: false,
            title: "反馈意见",
            content: "有意见告诉沐沐",
            type: "Command.feedbackCard",
          },
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_order.png",
            showIcon: false,
            title: "订单/工单",
            content: "我的订单/工单",
            type: "Command.myOrder",
          },
        ]
      : [
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_yuding.png",
            showIcon: false,
            title: "快速预定",
            content: "预定门票、房间、餐食",
            type: "Command.quickBooking",
          },
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_find.png",
            showIcon: false,
            title: "探索发现",
            content: "探索玩法、出片佳地",
            type: "Command.discovery",
          },
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_order.png",
            showIcon: false,
            title: "订单/工单",
            content: "我的订单/工单",
            type: "Command.myOrder",
          },
          {
            icon: "https://oss.nianxx.cn/mp/static/quick/quick_icon_call.png",
            showIcon: false,
            title: "反馈意见",
            content: "有意见告诉朵朵",
            type: "Command.feedbackCard",
          },
        ];
};
</script>

<style lang="scss" scoped>
@import "./styles/index.scss";
</style>
