admin-web/src/modules/dashboard/pages/DashboardView.test.ts

import { flushPromises, mount } from '@vue/test-utils'
import { beforeEach, describe, expect, it, vi } from 'vitest'
import DashboardView from './DashboardView.vue'

vi.mock('../api/dashboard', () => ({
  getTodayNewOrderCount: vi.fn().mockResolvedValue(12),
  getActiveCustomerCount: vi.fn().mockResolvedValue(8),
  getDashboardOperationalMetrics: vi.fn().mockResolvedValue({
    inTransitContainerCount: 3,
    inTransitTeu: 4.25,
    unknownContainerTypeCount: 1,
    pendingCustomsOrderCount: 7,
    asOf: '2026-09-11T12:00:00',
  }),
}))

describe('DashboardView', () => {
  beforeEach(() => vi.clearAllMocks())

  it('renders the four live metrics and keeps unfinished task actions non-operational', async () => {
    const wrapper = mount(DashboardView)
    await flushPromises()

    expect(wrapper.text()).toContain('四项核心指标已接入实时业务数据')
    expect(wrapper.text()).toContain('数据更新时间：2026-09-11 12:00')
    expect(wrapper.findAll('.dashboard-metric')).toHaveLength(4)
    expect(wrapper.text()).toContain('12 票')
    expect(wrapper.text()).toContain('4.25 TEU')
    expect(wrapper.text()).toContain('8 家')
    expect(wrapper.text()).toContain('7 票')
    expect(wrapper.text()).toContain('1 柜箱型未知')
    const taskActions = wrapper.findAll('.dashboard-task-action')
    expect(taskActions).toHaveLength(3)
    expect(taskActions.every((button) => button.attributes('disabled') !== undefined)).toBe(true)
  })

  it('switches transport series and exposes the chart values as a data table', async () => {
    const wrapper = mount(DashboardView)
    const airButton = wrapper.findAll('button').find((button) => button.text() === '空运')

    expect(airButton).toBeDefined()
    await airButton!.trigger('click')

    expect(airButton!.attributes('aria-pressed')).toBe('true')
    expect(wrapper.text()).toContain('空运普货')
    const caption = wrapper.get('.dashboard-line-chart table caption')
    expect(caption.text()).toBe('空运近 30 天运单量演示数据')
    expect(wrapper.findAll('.dashboard-line-chart tbody tr')).toHaveLength(30)
  })

  it('preserves semantic route names and values in the volume ranking', () => {
    const wrapper = mount(DashboardView)
    const ranking = wrapper.get('.dashboard-bars')

    expect(ranking.attributes('role')).toBeUndefined()
    expect(ranking.text()).toContain('上海 → 洛杉矶')
    expect(ranking.text()).toContain('850')
  })
})