import { CrudPage } from '../components/Crud'
import { Badge, TENANTS } from '../components/ui'
import { getAdSchedules, createAdSchedule, updateAdSchedule, deleteAdSchedule } from '../api/client'

// 광고 스케줄 편성 — 매장별 광고/미디어 재생 스케줄.
const MEDIA = ['IMAGE', 'VIDEO', 'TEMPLATE']
const STATUS = ['SCHEDULED', 'ACTIVE', 'ENDED', 'PAUSED']
const stTone = (s: string) => s === 'ACTIVE' ? 'green' : s === 'SCHEDULED' ? 'blue' : s === 'PAUSED' ? 'yellow' : 'gray'

export default function AdScheduleList() {
  return (
    <CrudPage
      title="광고 스케줄"
      subtitle="매장별 광고·미디어 재생 편성 관리"
      addLabel="스케줄 추가"
      queryKey={['ad-schedules']}
      fetcher={() => getAdSchedules()}
      onCreate={createAdSchedule} onUpdate={updateAdSchedule} onDelete={deleteAdSchedule}
      defaults={{ tenantCode: 'ZIOINFO', mediaType: 'IMAGE', status: 'SCHEDULED', priority: 5 }}
      columns={[
        { key: 'adName', header: '광고명', render: r => <span className="text-white">{r.adName}</span> },
        { key: 'storeCode', header: '매장', render: r => <span className="font-mono text-xs text-gray-400">{r.storeCode || 'ALL'}</span> },
        { key: 'mediaType', header: '미디어', render: r => <Badge tone="blue">{r.mediaType}</Badge> },
        { key: 'period', header: '기간', render: r => <span className="text-xs text-gray-400">{(r.startAt || '').slice(0, 10)} ~ {(r.endAt || '').slice(0, 10)}</span> },
        { key: 'priority', header: '우선', align: 'center' },
        { key: 'status', header: '상태', render: r => <Badge tone={stTone(r.status)}>{r.status}</Badge> },
      ]}
      form={[
        { key: 'tenantCode', label: '테넌트', type: 'select', opts: TENANTS },
        { key: 'storeCode', label: '매장코드 (ALL=전체)', placeholder: 'ALL' },
        { key: 'adName', label: '광고명' },
        { key: 'mediaType', label: '미디어 유형', type: 'select', opts: MEDIA },
        { key: 'mediaPath', label: '미디어 경로' },
        { key: 'templateCode', label: '템플릿코드' },
        { key: 'startAt', label: '시작 일시', type: 'datetime-local' },
        { key: 'endAt', label: '종료 일시', type: 'datetime-local' },
        { key: 'dailyStart', label: '일일 시작 시각', type: 'time' },
        { key: 'dailyEnd', label: '일일 종료 시각', type: 'time' },
        { key: 'priority', label: '우선순위(1~10)', type: 'number' },
        { key: 'status', label: '상태', type: 'select', opts: STATUS },
      ]}
    />
  )
}