<script setup lang="ts">
/**
 * 文件职责：自提设置页面主视图。
 * 1. 组合基础设置、模式切换、大时段/精细规则与预览区块。
 * 2. 承接门店维度切换与复制到其他门店弹窗。
 */
import { Page } from '@vben/common-ui';

import { Card, Empty, Spin } from 'ant-design-vue';

import CopyToStoresModal from '../../shared/components/CopyToStoresModal.vue';
import StoreScopeToolbar from '../../shared/components/StoreScopeToolbar.vue';
import PickupBasicSettingsCard from './components/PickupBasicSettingsCard.vue';
import PickupBigSlotSection from './components/PickupBigSlotSection.vue';
import PickupFineRuleSection from './components/PickupFineRuleSection.vue';
import PickupModeSwitch from './components/PickupModeSwitch.vue';
import PickupPreviewSection from './components/PickupPreviewSection.vue';
import PickupSlotDrawer from './components/PickupSlotDrawer.vue';
import { useStorePickupPage } from './composables/useStorePickupPage';

const {
  FINE_INTERVAL_OPTIONS,
  PICKUP_MODE_OPTIONS,
  WEEKDAY_OPTIONS,
  basicSettings,
  bigSlots,
  canOperate,
  calcReservedPercent,
  copyCandidates,
  copyTargetStoreIds,
  fineRule,
  formatDayOfWeeksText,
  handleCopyCheckAll,
  handleCopySubmit,
  handleDeleteSlot,
  handleSaveFineRule,
  handleSubmitSlot,
  handleToggleSlotEnabled,
  isCopyAllChecked,
  isCopyIndeterminate,
  isCopyModalOpen,
  isCopySubmitting,
  isConfigured,
  hasLoadedStoreSettings,
  isFineDaySelected,
  isPageLoading,
  isSavingBasic,
  isSavingFineRule,
  isModeSwitching,
  isSavingSlots,
  isSlotDaySelected,
  isSlotDrawerOpen,
  isStoreLoading,
  openCopyModal,
  openSlotDrawer,
  pickupMode,
  previewDays,
  quickSelectFineDays,
  quickSelectSlotDays,
  resetBasicSettings,
  resetFineRule,
  saveBasicSettings,
  selectedPreviewDate,
  selectedStoreId,
  selectedStoreName,
  setAllowSameDayPickup,
  setBookingDays,
  setFineDayEndTime,
  setFineDayStartTime,
  setFineIntervalMinutes,
  setFineMinAdvanceHours,
  setFineSlotCapacity,
  setMaxItemsPerOrder,
  setPickupMode,
  setSelectedPreviewDate,
  setSelectedStoreId,
  setSlotCapacity,
  setSlotCutoffMinutes,
  setSlotDrawerOpen,
  setSlotEnabled,
  setSlotEndTime,
  setSlotName,
  setSlotStartTime,
  slotDrawerTitle,
  slotForm,
  storeOptions,
  toggleCopyStore,
  toggleFineDay,
  toggleSlotDay,
} = useStorePickupPage();
</script>

<template>
  <Page title="自提设置" content-class="space-y-4 page-store-pickup">
    <StoreScopeToolbar
      :selected-store-id="selectedStoreId"
      :store-options="storeOptions"
      :is-store-loading="isStoreLoading"
      :copy-disabled="
        !canOperate || !isConfigured || copyCandidates.length === 0
      "
      @update:selected-store-id="setSelectedStoreId"
      @copy="openCopyModal"
    />

    <template v-if="storeOptions.length === 0">
      <Card :bordered="false">
        <Empty description="暂无门店，请先创建门店" />
      </Card>
    </template>

    <template v-else>
      <Spin :spinning="isPageLoading">
        <Card v-if="hasLoadedStoreSettings && !isConfigured" :bordered="false">
          <Empty
            description="当前门店尚未配置自提规则。请先完成配置并保存，之后可执行复制。"
          />
        </Card>

        <PickupBasicSettingsCard
          :settings="basicSettings"
          :is-saving="isSavingBasic"
          :on-set-allow-same-day-pickup="setAllowSameDayPickup"
          :on-set-booking-days="setBookingDays"
          :on-set-max-items-per-order="setMaxItemsPerOrder"
          @reset="resetBasicSettings"
          @save="saveBasicSettings"
        />

        <PickupModeSwitch
          :mode="pickupMode"
          :options="PICKUP_MODE_OPTIONS"
          :disabled="!canOperate"
          :is-switching="isModeSwitching"
          @change="setPickupMode"
        />

        <PickupBigSlotSection
          v-if="pickupMode === 'big'"
          :slots="bigSlots"
          :is-saving="isSavingSlots"
          :calc-reserved-percent="calcReservedPercent"
          :format-day-of-weeks-text="formatDayOfWeeksText"
          @add="openSlotDrawer('create')"
          @edit="(slot) => openSlotDrawer('edit', slot)"
          @delete="handleDeleteSlot"
          @toggle-enabled="
            ({ slotId, enabled }) => handleToggleSlotEnabled(slotId, enabled)
          "
        />

        <template v-else>
          <PickupFineRuleSection
            :fine-rule="fineRule"
            :interval-options="FINE_INTERVAL_OPTIONS"
            :week-day-options="WEEKDAY_OPTIONS"
            :is-day-selected="isFineDaySelected"
            :is-saving="isSavingFineRule"
            :on-set-interval-minutes="setFineIntervalMinutes"
            :on-set-slot-capacity="setFineSlotCapacity"
            :on-set-day-start-time="setFineDayStartTime"
            :on-set-day-end-time="setFineDayEndTime"
            :on-set-min-advance-hours="setFineMinAdvanceHours"
            :on-toggle-day="toggleFineDay"
            :on-quick-select-days="quickSelectFineDays"
            @reset="resetFineRule"
            @save="handleSaveFineRule"
          />

          <PickupPreviewSection
            :days="previewDays"
            :selected-date="selectedPreviewDate"
            @select-date="setSelectedPreviewDate"
          />
        </template>
      </Spin>
    </template>

    <PickupSlotDrawer
      :open="isSlotDrawerOpen"
      :title="slotDrawerTitle"
      :form="slotForm"
      :is-saving="isSavingSlots"
      :week-day-options="WEEKDAY_OPTIONS"
      :is-day-selected="isSlotDaySelected"
      :on-set-name="setSlotName"
      :on-set-start-time="setSlotStartTime"
      :on-set-end-time="setSlotEndTime"
      :on-set-cutoff-minutes="setSlotCutoffMinutes"
      :on-set-capacity="setSlotCapacity"
      :on-set-enabled="setSlotEnabled"
      :on-toggle-day="toggleSlotDay"
      :on-quick-select-days="quickSelectSlotDays"
      @update:open="setSlotDrawerOpen"
      @submit="handleSubmitSlot"
    />

    <CopyToStoresModal
      v-model:open="isCopyModalOpen"
      title="复制自提设置到其他门店"
      confirm-text="确认复制"
      :copy-candidates="copyCandidates"
      :target-store-ids="copyTargetStoreIds"
      :is-all-checked="isCopyAllChecked"
      :is-indeterminate="isCopyIndeterminate"
      :is-submitting="isCopySubmitting"
      :selected-store-name="selectedStoreName"
      @check-all="handleCopyCheckAll"
      @submit="handleCopySubmit"
      @toggle-store="
        ({ storeId, checked }) => toggleCopyStore(storeId, checked)
      "
    />
  </Page>
</template>

<style lang="less">
@import './styles/index.less';
</style>
