pay-admin/src/pages/company/companies/$id.tsx

import { MyPageContainer } from '@/common';
import { Apis } from '@/gen/Apis';
import { ProCard } from '@ant-design/pro-components';
import { useParams } from '@umijs/max';
import { Tabs } from 'antd';
import { useEffect, useState } from 'react';
import ComponentsInfo from './components/ComponentsInfo';
import Employees from './components/Employees';
import Organizations from './components/Organizations';
import Positions from './components/Positions';
import Projects from './components/Projects';
import ReceiptAccounts from './components/ReceiptAccounts';
export default function Show({ title = '机构详情' }) {
  const { id } = useParams<{ id: string }>();
  const [data, setShow] = useState<any>({});

  const loadShow = () => {
    let paramsId: any = { id: id ?? 0 };
    Apis.Company.Companies.Show(paramsId).then((res) => {
      setShow(res?.data);
    });
  };
  useEffect(() => {
    loadShow();
  }, [id]);

  let items = [
    {
      label: '基本信息',
      key: '1',
      closable: false,
      children: <ComponentsInfo item={data} reload={() => loadShow()} />,
    },
    {
      label: '项目管理',
      key: '2',
      closable: false,
      children: <Projects item={data} />,
    },
    {
      label: '组织管理',
      key: '3',
      closable: false,
      children: <Organizations item={data} />,
    },
    {
      label: '员工管理',
      key: '4',
      closable: false,
      children: <Employees item={data} />,
    },
    {
      label: '岗位管理',
      key: '5',
      closable: false,
      children: <Positions item={data} />,
    },
    {
      label: '收款账号',
      key: '6',
      closable: false,
      children: <ReceiptAccounts item={data} />,
    },
  ];
  return (
    <MyPageContainer title={title}>
      <ProCard>
        <Tabs type="card" items={data?.id ? items : []} />
      </ProCard>
    </MyPageContainer>
  );
}