<template>
  <AdminTablePage
    eyebrow="SAAS PLANS"
    title="套餐管理"
    description="维护官网展示套餐、月付年付价格和权益配置，后续可接入完整 CRUD。"
    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 { getAdminPlans } from '@/api/request/pricing'
const columns = [
  { key: 'name', label: '套餐名称' },
  { key: 'code', label: '套餐编码', type: 'tag' },
  { key: 'description', label: '说明' },
  { key: 'monthly_fee', label: '月付', type: 'money' },
  { key: 'yearly_fee', label: '年付', type: 'money' },
  { key: 'recommended', label: '推荐', type: 'bool' }
]
const statusOptions = [{ label: '推荐套餐', value: 'true' }, { label: '普通套餐', value: 'false' }]
const rows = ref([])
const loading = ref(false)
const load = async () => {
  loading.value = true
  rows.value = await getAdminPlans().catch(() => [])
  loading.value = false
}
onMounted(load)
</script>
