import {
  logisticscontrollerGetservicelist,
  logisticscontrollerSyncservices,
  logisticscontrollerToggleactive,
} from '@/servers/api/logistics';
import {
  ActionType,
  PageContainer,
  ProColumns,
  ProFormSwitch,
  ProTable,
} from '@ant-design/pro-components';
import { App, Button } from 'antd';
import { useRef } from 'react';

const ListPage: React.FC = () => {
  const actionRef = useRef<ActionType>();
  const { message } = App.useApp();

  const columns: ProColumns<API.Service>[] = [
    {
      title: '服务商 ID',
      dataIndex: 'id',
      hideInSearch: true,
    },
    {
      title: '运营商名称',
      dataIndex: 'carrier_name',
    },
    {
      title: '服务商名称',
      dataIndex: 'service_name',
      hideInSearch: true,
    },
    {
      title: '启用',
      dataIndex: 'isActive',
      valueType: 'switch',
      render(_, record) {
        return (
          <ProFormSwitch
            fieldProps={{
              checked: record.isActive,
              onChange: async (value) => {
                try {
                  const { success } = await logisticscontrollerToggleactive({
                    id: record.id,
                    isActive: value,
                  });
                  if (!success) {
                    throw new Error('启动失败');
                  }
                  actionRef.current?.reload();
                } catch (e: any) {
                  message.error(e?.message || '启动失败');
                }
              },
            }}
          />
        );
      },
    },
  ];
  return (
    <PageContainer ghost>
      <ProTable
        headerTitle="查询表格"
        actionRef={actionRef}
        rowKey="id"
        toolBarRender={() => [
          <Button
            key="syncSite"
            type="primary"
            onClick={async () => {
              try {
                const { success } = await logisticscontrollerSyncservices();
                if (!success) {
                  throw new Error('同步失败');
                }
                actionRef.current?.reload();
              } catch (e: any) {
                message.error(e?.message || '同步失败');
              }
            }}
          >
            同步服务商
          </Button>,
        ]}
        request={async (values) => {
          console.log(values);
          const { data, success } = await logisticscontrollerGetservicelist(
            values,
          );
          if (success) {
            return {
              total: data?.total || 0,
              data: data?.items || [],
            };
          }
          return {
            data: [],
          };
        }}
        columns={columns}
      />
    </PageContainer>
  );
};

export default ListPage;