<!-- 文件职责：订单大厅页面入口。 -->
<script setup lang="ts">
import type { BoardColumnKey } from './types';

import BoardColumn from './components/BoardColumn.vue';
import BoardStatsBar from './components/BoardStatsBar.vue';
import BoardToolbar from './components/BoardToolbar.vue';
import RejectOrderModal from './components/RejectOrderModal.vue';
import { HALL_COLUMNS } from './composables/order-hall-page/constants';
import { useOrderHallPage } from './composables/useOrderHallPage';

import './styles/index.less';

const {
  state,
  stats,
  isRejectModalOpen,
  isConnected,
  loadFullBoard,
  loadStats,
  handleAccept,
  handleCompletePreparation,
  handleConfirmDelivery,
  openRejectModal,
  confirmReject,
  cancelReject,
} = useOrderHallPage();

/** 判断卡片是否符合当前履约筛选。 */
function matchesDeliveryFilter(deliveryType: number) {
  switch (state.deliveryFilter) {
    case 'delivery': {
      return deliveryType === 2;
    }
    case 'dineIn': {
      return deliveryType === 0;
    }
    case 'pickup': {
      return deliveryType === 1;
    }
    default: {
      return true;
    }
  }
}

/** 根据列键获取对应卡片列表。 */
function getCards(key: BoardColumnKey) {
  let cards = [] as typeof state.pendingCards;
  switch (key) {
    case 'completed': {
      cards = state.completedCards;
      break;
    }
    case 'delivering': {
      cards = state.deliveringCards;
      break;
    }
    case 'making': {
      cards = state.makingCards;
      break;
    }
    case 'pending': {
      cards = state.pendingCards;
      break;
    }
    default: {
      cards = [];
    }
  }

  return cards.filter((card) => matchesDeliveryFilter(card.deliveryType));
}

/** 手动刷新看板。 */
async function handleRefresh() {
  await Promise.all([loadFullBoard(), loadStats()]);
}
</script>

<template>
  <div class="ob-page">
    <!-- 1. 统计条 + 控制区 -->
    <BoardStatsBar
      :today-total="stats.todayTotal"
      :pending-count="stats.pendingCount"
      :making-count="stats.makingCount"
      :delivering-count="stats.deliveringCount"
      :completed-count="stats.completedCount"
    >
      <template #actions>
        <BoardToolbar
          v-model:store-id="state.selectedStoreId"
          v-model:delivery-filter="state.deliveryFilter"
          v-model:is-sound-enabled="state.isSoundEnabled"
          :store-options="state.storeOptions"
          :is-store-loading="state.isStoreLoading"
          :is-connected="isConnected"
          @refresh="handleRefresh"
        />
      </template>
    </BoardStatsBar>

    <!-- 2. 看板四列 -->
    <div class="ob-board">
      <BoardColumn
        v-for="col in HALL_COLUMNS"
        :key="col.key"
        :title="col.title"
        :color-class="col.colorClass"
        :column-key="col.key"
        :cards="getCards(col.key)"
        :is-loading="state.isLoading"
        @accept="handleAccept"
        @reject="openRejectModal"
        @complete-preparation="handleCompletePreparation"
        @confirm-delivery="handleConfirmDelivery"
      />
    </div>

    <!-- 3. 拒单弹窗 -->
    <RejectOrderModal
      :open="isRejectModalOpen"
      @confirm="confirmReject"
      @cancel="cancelReject"
    />
  </div>
</template>
