import { readFileSync } from 'node:fs'
import { resolve } from 'node:path'
import { describe, expect, it } from 'vitest'

const source = readFileSync(resolve(process.cwd(), 'src/modules/ocean-bookings/pages/OceanBookingDetailView.vue'), 'utf8')

describe('OceanBookingDetailView interaction contract', () => {
  it('selects business objects and automatically keeps their ids and names together', () => {
    expect(source).toContain('placeholder="请选择客户"')
    expect(source).toContain('placeholder="请选择船公司"')
    expect(source).toContain('placeholder="请选择订舱代理"')
    expect(source).toContain("selectPartner('shippingCompany'")
    expect(source).toContain("selectPartner('bookingAgent'")
    expect(source).not.toContain('label="客户 ID"')
    expect(source).not.toContain('label="船公司 ID"')
    expect(source).not.toContain('label="订舱代理 ID"')
  })

  it('hides unavailable customers instead of filling the selector with disabled options', () => {
    expect(source).toContain("customer.status === 'ACTIVE' || String(customer.id) === String(form.data.customerId)")
    expect(source).toContain('v-for="customer in selectableCustomers"')
    expect(source).not.toContain(':disabled="customer.status !== \'ACTIVE\'"')
  })

  it('renders the translated status once in the detail heading', () => {
    expect(source).toContain('<StatusBadge :status="statusLabel(detail.status)" />')
    expect(source).not.toContain('<StatusBadge :status="detail.status" />')
  })

  it('provides guidance for every free-text booking field', () => {
    for (const placeholder of [
      '请输入提单号（可选）', '请输入船名', '请输入航次', '例如：CNNGB', '例如：宁波港',
      '例如：USLAX', '例如：洛杉矶港', '请输入最终交货地点', '例如：CY-CY',
      '例如：PREPAID', '请输入订舱备注（可选）',
    ]) expect(source).toContain(`placeholder="${placeholder}"`)
  })
})