<script lang="ts" setup>
import { computed } from 'vue';

import { Page, useVbenDrawer } from '@vben/common-ui';
import { Button, Space } from 'ant-design-vue';

import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getAgentWithdrawalList } from '#/api/agent';

import ReviewModal from './modules/review-modal.vue';
import { useWithdrawalColumns, useWithdrawalFormSchema } from './data';

interface Props {
  agentId?: number;
}

interface QueryParams {
  currentPage: number;
  pageSize: number;
  [key: string]: any;
}

const props = defineProps<Props>();

const queryParams = computed(() => ({
  ...(props.agentId ? { agent_id: props.agentId } : {}),
}));

// 审核弹窗
const [ReviewDrawer, reviewDrawerApi] = useVbenDrawer({
  connectedComponent: ReviewModal,
  destroyOnClose: true,
});

// 操作处理
function onActionClick(e: any) {
  const { code, row } = e;
  switch (code) {
    case 'review':
      // 打开审核弹窗
      reviewDrawerApi.setData(row).open();
      break;
  }
}

// 刷新列表
function onRefresh() {
  gridApi.query();
}

const [Grid, gridApi] = useVbenVxeGrid({
  formOptions: {
    schema: useWithdrawalFormSchema(),
    submitOnChange: true,
  },
    gridOptions: {
    columns: useWithdrawalColumns(),
    proxyConfig: {
      ajax: {
        query: async ({
          page,
        }: {
          page: QueryParams;
        }) => {
          return await getAgentWithdrawalList({
            ...queryParams.value,
            page: page.currentPage,
            pageSize: page.pageSize,
          });
        },
      },
      props: {
        result: 'items',
        total: 'total',
      },
    },
    toolbarConfig: {
      custom: true,
      export: false,
      refresh: { code: 'query' },
      search: true,
      zoom: true,
    },
  },
});
</script>

<template>
  <Page :auto-content-height="!agentId">
    <ReviewDrawer @success="onRefresh" />
    <Grid :table-title="agentId ? '提现记录列表' : '所有提现记录'">
      <template #operation="{ row }">
        <Space>
          <Button
            v-if="row.status === 1"
            type="link"
            @click="onActionClick({ code: 'review', row })"
          >
            审核
          </Button>
        </Space>
      </template>
    </Grid>
  </Page>
</template>
