import { ref, reactive } from 'vue'

export interface OrderItem {
  model?: string
  quantity?: number
  exteriorColor?: string
  interiorColor?: string
  modification?: string
  unitPrice?: number
  totalPrice?: number
  officialPrice?: number
  discount?: string
}

export interface PaymentItem {
  country?: string
  date?: string
  currency?: string
  account?: string
  remitter?: string
  amount?: number
}

export interface OrderData {
  contract_file_url: { name: string; url: string }[]
  orderNo?: string
  salesperson?: string
  piNo?: string
  date?: string
  clearanceCountry?: string
  customerSource?: string
  customerName?: string
  customerCountry?: string
  items?: OrderItem[]
  contractRate?: string
  totalCif?: number
  declarant?: string
  etaShipDate?: string
  shippingMethod?: string
  domesticPort?: string
  tradeTerms?: string
  latestArrival?: string
  payments?: PaymentItem[]
}

export function useOrderDetailDialog() {
  const visible = ref(false)
  const title = ref('订单详情')
  const orderData = ref<OrderData>({
    contract_file_url: [],
    items: [],
    payments: []
  })

  const show = (data: OrderData, dialogTitle?: string) => {
    orderData.value = data
    title.value = dialogTitle || '订单详情'
    visible.value = true
  }

  const hide = () => {
    visible.value = false
  }

  const print = () => {
    // 可以在这里添加打印逻辑
    window.print()
  }

  return {
    visible,
    title,
    orderData,
    show,
    hide,
    print
  }
}