General-AI-Platform-Web/src/pages/Business/BusinessState/components/detailServerStateLog.tsx

/*
 * @Author: donghao donghao@supervision.ltd
 * @Date: 2024-04-22 15:23:36
 * @LastEditors: donghao donghao@supervision.ltd
 * @LastEditTime: 2024-05-10 14:44:54
 * @FilePath: \general-ai-platform-web\src\pages\Business\BusinessState\components\detailServerStateLog.tsx
 * @Description: 服务器日志
 * @交互说明
 * 1、服务器日志列表的分页展示
 */

import { getServerStateLogList } from '@/services/testApi/businessState';
import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { ProCard, ProTable } from '@ant-design/pro-components';
import { FormattedMessage } from '@umijs/max';
import { useRef, useState } from 'react';
import { proTablePaginationOptions } from '../../../../../config/defaultTable';

const DetailServerStateLog: React.FC = () => {
  const actionRef = useRef<ActionType>();
  //  动态设置每页数量
  const [currentPageSize, setCurrentPageSize] = useState<number>(10);
  // 业务模型列表信息
  const columns: ProColumns<Record<string, any>>[] = [
    {
      title: <FormattedMessage id="server_state.table.stateLog.list.ip" defaultMessage="名称" />,
      dataIndex: 'IP',
      hideInSearch: true,
      key: 'fixedName',
      fixed: 'left',
    },
    {
      title: (
        <FormattedMessage id="server_state.table.stateLog.list.defaultPort" defaultMessage="端口" />
      ),
      dataIndex: 'port',
      hideInSearch: true,
    },

    {
      title: (
        <FormattedMessage
          id="server_state.table.stateLog.list.createTime"
          defaultMessage="创建时间"
        />
      ),
      dataIndex: 'createTime',
      hideInSearch: true,
      valueType: 'dateTime',
    },
  ];
  return (
    <div className="detailServerStateLog_wrap">
      <ProCard className="gn_card" bodyStyle={{ padding: 0 }}>
        <ProTable
          className="gn_pro_table"
          cardProps={{
            bodyStyle: { padding: 0 },
          }}
          // 标题栏
          search={false}
          options={{ fullScreen: false, setting: false, density: false, reload: false }}
          actionRef={actionRef}
          rowKey="key"
          pagination={{
            ...proTablePaginationOptions,
            pageSize: currentPageSize,
            onChange: (page, pageSize) => setCurrentPageSize(pageSize),
          }}
          columnsState={{
            persistenceKey: 'bs_server_log_list',
            persistenceType: 'localStorage',
          }}
          request={async (params = {}) => {
            const { current, ...rest } = params;
            const reqParams = {
              page: current,
              ...rest,
            };
            let resp = await getServerStateLogList({ ...reqParams });
            console.log(resp, 'getServerStateLogList_resp');
            return {
              data: resp.data?.results.map((v: Record<string, any>) => {
                return { ...v, key: v.id };
              }),
              success: resp.success,
              total: resp.data.count,
              current: current,
              pageSize: currentPageSize,
            };
          }}
          columns={columns}
        />
      </ProCard>
    </div>
  );
};

export default DetailServerStateLog;