import { mount } from '@vue/test-utils'
import { describe, expect, it } from 'vitest'
import AppointmentCalendarPanel from './AppointmentCalendarPanel.vue'

describe('appointment calendar interactions', () => {
  const render = () => mount(AppointmentCalendarPanel, {
    props: { initialDate: '2026-09-24', canCreate: true, events: [
      { key: 'a', type: 'delivery', date: '2026-09-24', time: '09:00-11:00', title: 'ONT8 预约送货', fields: [], canEdit: true, canDelete: true },
    ] },
    global: { stubs: { ElButton: { template: '<button><slot /></button>' } }, directives: { loading: {} } },
  })

  it('selects an already loaded date without requesting data again', async () => {
    const wrapper = render()
    await wrapper.get('[aria-label="2026-09-25，0 项安排"]').trigger('click')
    expect(wrapper.emitted('range')).toBeUndefined()
    expect(wrapper.get('[aria-label="当天安排"]').text()).toContain('当天暂无到港或送仓预约')
  })

  it('requests exactly one range for a view switch and navigates seven days', async () => {
    const wrapper = render()
    await wrapper.get('[aria-label="预约视图"]').findAll('button')[1]!.trigger('click')
    expect(wrapper.emitted('range')).toEqual([[{ from: '2026-09-21', to: '2026-09-28' }]])
    await wrapper.get('[aria-label="下一周"]').trigger('click')
    expect(wrapper.emitted('range')?.at(-1)).toEqual([{ from: '2026-09-28', to: '2026-10-05' }])
  })

  it('uses the selected day for creation and emits edit/delete only from detail actions', async () => {
    const wrapper = render()
    await wrapper.findAll('button').find(button => button.text() === '＋ 新增预约')!.trigger('click')
    expect(wrapper.emitted('create')).toEqual([['2026-09-24']])
    await wrapper.findAll('button').find(button => button.text() === '编辑')!.trigger('click')
    await wrapper.findAll('button').find(button => button.text() === '删除')!.trigger('click')
    expect(wrapper.emitted('edit')?.[0]?.[0]).toMatchObject({ key: 'a' })
    expect(wrapper.emitted('delete')?.[0]?.[0]).toMatchObject({ key: 'a' })
  })
})