import React, { useRef, useState } from 'react';
import { Button } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import { queryAllRoleUsingPost } from '@/services/pop-b2b2c/pbcRoleController';
import Constants from '@/constants';
import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
import { handlePageQuery } from '@/utils/utils';
import { pbcBusinessApprovalPageUsingPost } from '@/services/pop-b2b2c/pbcBusinessApprovalController';
import { Link } from '@umijs/max';

/**
 * 查询表格
 * @param param0
 */
const fetchData = async (params: API.PageVO) => {
  const msg = await pbcBusinessApprovalPageUsingPost(params);
  return {
    data: msg.data?.records,
    total: msg.data?.total,
    success: msg.retcode,
  } as any;
};

// eslint-disable-next-line @typescript-eslint/ban-types
const TableList: React.FC<{}> = () => {
  const actionRef = useRef<ActionType>();
  const [tabActiveKey, setTabActiveKey] = useState<string>('0')

  const columns: ProColumns<API.PbcBusinessApproval>[] = [
    {
      title: '商户名称',
      dataIndex: 'pbcBusinessName',
    },
    {
      title: '联系人',
      dataIndex: 'pbcBusinessContact',
    },
    {
      title: '商户手机号',
      dataIndex: 'pbcBusinessContactMobile',
    },
    {
      title: '商户类别',
      dataIndex: 'pbcBusinessType',
      valueType: 'select',
      valueEnum: Constants.pbcBusinessType
    },
    {
      title: '主营品类',
      dataIndex: 'pbcBusinessMainCategory',
      ellipsis: true,
      search: false,
    },
    {
      title: '注册日期',
      dataIndex: 'pbcCreateAt',
      valueType: 'dateTimeRange',
      render: (text, record) => record.pbcCreateAt
    },
    {
      title: '状态',
      dataIndex: 'pbcBusinessApprovalResult',
      valueEnum: Constants.pbcBusinessApprovalResult,
      search: false
    },
    {
      title: '操作',
      fixed: 'right',
      valueType: 'option',
      render: (text, record) => (
        <span>
          <Link to={'/audits/detail/' + record.pbcId}>详情</Link>
        </span>
      ),
    },
  ];
  return (
    <PageContainer
      header={{
        title: '',
        breadcrumb: {},
      }}
      tabActiveKey={tabActiveKey}
      onTabChange={(key) => setTabActiveKey(key)}
      tabList={[
        {
          tab: "待审核",
          key: "0"
        },
        {
          tab: "审核通过",
          key: "1"
        },
        {
          tab: "审核驳回",
          key: "2"
        },
      ]}
    >
      <ProTable<API.PbcBusinessApproval>
        columns={columns}
        actionRef={actionRef}
        request={(param: any) => {
          const queryParam = handlePageQuery(param);
          return fetchData(queryParam);
        }}
        rowKey="pbcId"
        size="small"
        bordered
        search={{
          labelWidth: 'auto',
          span: 6
        }}
        params={{ pbcBusinessApprovalResult: tabActiveKey }}
        pagination={{
          defaultPageSize: 20,
          showSizeChanger: true,
        }}
        scroll={{
          y: 'calc(100vh - 320px)',
        }}
        dateFormatter="string"
        options={false}
        toolBarRender={() => []}
      />
    </PageContainer>
  );
};

export default TableList;