import { computed, h, ref } from 'vue';
import { NProgress, NTag } from 'naive-ui';
import { FormSchema } from '@/components/Form';
import { useDictStore } from '@/store/modules/dict';
import { defRangeShortcuts } from '@/utils/dateUtil';
const dict = useDictStore();
export const schemas = ref<FormSchema[]>([
  { field: 'username', component: 'NInput', label: '用户名', componentProps: { clearable: true } },
  {
    field: 'mobile',
    component: 'NInput',
    label: '手机号',
    componentProps: { placeholder: '精确查询', clearable: true },
  },
  {
    field: 'submissionStatus',
    component: 'NSelect',
    label: '状态',
    componentProps: {
      options: computed(() => dict.getOptionUnRef('taskSubmissionStatus')),
      clearable: true,
    },
  },
  {
    field: 'createdAt',
    component: 'NDatePicker',
    label: '提交时间',
    componentProps: { type: 'datetimerange', shortcuts: defRangeShortcuts(), clearable: true },
  },
]);
const tag = (k, v) =>
  h(NTag, { type: dict.getType(k, v), bordered: false }, () => dict.getLabel(k, v) || '-');
export const columns = [
  { title: '记录ID', key: 'id', width: 90 },
  { title: '用户名', key: 'username', width: 130 },
  { title: '手机号', key: 'mobile', width: 130 },
  { title: '任务标题', key: 'taskTitle', width: 180 },
  { title: '等级', key: 'levelName', width: 110 },
  {
    title: '佣金',
    key: 'commissionAmount',
    width: 100,
    render: (r) => `¥${((r.commissionAmount || 0) / 100).toFixed(2)}`,
  },
  {
    title: '成功率',
    key: 'successRate',
    width: 130,
    render: (r) =>
      h(NProgress, { type: 'line', percentage: (r.successRate || 0) / 100, showIndicator: true }),
  },
  {
    title: '状态',
    key: 'submissionStatus',
    width: 100,
    render: (r) => tag('taskSubmissionStatus', r.submissionStatus),
  },
  { title: '备注', key: 'reviewReason', width: 180, ellipsis: { tooltip: true } },
  { title: '创建时间', key: 'createdAt', width: 180 },
];
export const loadOptions = () => dict.loadOptions(['taskSubmissionStatus', 'task_reject_reason']);