<script lang="ts" setup>
import { useTemplateRef } from 'vue';
import { NDatePicker, useDialog, useMessage } from 'naive-ui';
import { client, safeClient } from '@/service/api';
import type { TableBaseColumns, TableFetchData, TableFilterColumns, TableInst } from '@/components/table';

const dialog = useDialog();
const message = useMessage();
const tableInst = useTemplateRef<TableInst>('tableInst');

const fetchData: TableFetchData = ({ pagination, filter }) => {
  return safeClient(() =>
    client.api.admin.rwa.issuance.products.get({
      query: {
        ...pagination,
        ...filter
      }
    })
  );
};

const columns: TableBaseColumns = [
  {
    title: 'ID',
    key: 'id'
  },
  {
    title: 'Code',
    key: 'code'
  },
  {
    title: '产品名称',
    key: 'name'
  },
  {
    title: '估值',
    key: 'estimatedValue'
  },
  {
    title: '产品分类',
    key: 'categoryId'
  },
  {
    title: '创建人',
    key: 'createdBy'
  },
  {
    title: '创建时间',
    key: 'createdAt',
    render: (row: any) => {
      return new Date(row.createdAt).toLocaleDateString();
    }
  },
  {
    title: '状态',
    key: 'status'
  },
  {
    title: '描述',
    key: 'description'
  },
  {
    title: '操作',
    fixed: 'right',
    key: 'operation',
    width: 230,
    operations: (row: any) => [
      {
        contentText: '批准',
        size: 'small',
        onClick: async () => {
          safeClient(() =>
            client.api.admin.rwa.issuance.approve.post({
              productId: row.id as string
            })
          );
          tableInst.value?.reload();
        }
      },
      {
        contentText: '拒绝',
        size: 'small',
        onClick: async () => {
          safeClient(() =>
            client.api.admin.rwa.issuance.reject.post({
              productId: row.id as string,
              rejectionReason: '不符合要求'
            })
          );
          tableInst.value?.reload();
        }
      },
      {
        contentText: '编辑',
        size: 'small',
        onClick: () => {
          tableInst.value?.reload();
        }
      }
    ]
  }
];

const filterColumns: TableFilterColumns = [
  {
    title: '产品名称',
    key: 'name'
  },
  {
    title: '产品Code',
    key: 'Code'
  },
  {
    title: '创建时间',
    key: 'createdAt',
    component: NDatePicker
  }
];
</script>

<template>
  <TableBase
    ref="tableInst"
    show-header-operation
    :columns="columns"
    :filter-columns="filterColumns"
    :fetch-data="fetchData"
  />
</template>

<style lang="css" scoped></style>
