<template>
  <AdminTablePage
    eyebrow="COMMERCE ORDERS"
    title="订单管理"
    description="查看套餐订购订单、支付周期和待处理状态，方便运营快速跟进。"
    primary-action="创建订单"
    :columns="columns"
    :rows="rows"
    :loading="loading"
    :status-options="statusOptions"
    @refresh="load"
  />
</template>
<script setup>
import { onMounted, ref } from 'vue'
import AdminTablePage from './AdminTablePage.vue'
import { getAdminOrders } from '@/api/request/orders'
const columns = [
  { key: 'order_no', label: '订单号' },
  { key: 'tenant_name', label: '诊所名称' },
  { key: 'contact_name', label: '联系人' },
  { key: 'phone', label: '手机号' },
  { key: 'plan_code', label: '套餐', type: 'tag', map: { starter: '基础版', growth: '增长版', enterprise: '连锁版' } },
  { key: 'billing_cycle', label: '周期', type: 'cycle' },
  { key: 'amount', label: '金额', type: 'money' },
  { key: 'status', label: '状态', type: 'tag', map: { pending: '待支付', paid: '已支付', closed: '已关闭' } }
]
const statusOptions = [{ label: '待支付', value: 'pending' }, { label: '已支付', value: 'paid' }, { label: '已关闭', value: 'closed' }]
const rows = ref([])
const loading = ref(false)
const load = async () => {
  loading.value = true
  rows.value = await getAdminOrders().catch(() => [])
  loading.value = false
}
onMounted(load)
</script>
