import {
  MyButtons,
  MyColumns,
  MyPageContainer,
  MyProTableProps,
} from '@/common';
import { Apis } from '@/gen/Apis';
import {
  AssetCarPortsPropertyTypeEnum,
  AssetCarPortsTypeEnum,
} from '@/gen/Enums';
import { ProTable } from '@ant-design/pro-components';
import { useParams } from '@umijs/max';
import { Space } from 'antd';
import { useEffect, useState } from 'react';
import SpaceUpdate from '../../parking_space/modals/SpaceUpdate';

export default function AssetCarPorts({ title = '车位列表' }) {
  const { id } = useParams<{ id: string }>();
  const [data, setShow] = useState<any>({});
  // const { addTab } = usePageTabs({
  //   autoAdd: false,
  //   tabKey: `asset_car_ports-${id}`,
  //   tabLabel: '车位列表',
  // });

  const loadShow = () => {
    let paramsId: any = { id: id ?? 0 };
    Apis.Asset.AssetParkingPlaces.Show(paramsId).then((res) => {
      setShow(res?.data);
      // 更新标签页名称为API返回的name
      // if (res?.data?.name) {
      //   addTab({
      //     key: `asset_car_ports-${id}`,
      //     label: `${res.data.name}-车位`,
      //     path: `/asset/asset_car_ports/${id}`,
      //   });
      // }
    });
  };

  useEffect(() => {
    loadShow();
  }, [id]);

  return (
    <MyPageContainer title="车场-车位">
      <>
        <ProTable<Record<any, any>>
          {...MyProTableProps.props}
          request={async (params, sort) =>
            MyProTableProps.request(params, sort, Apis.Asset.AssetCarPorts.List)
          }
          headerTitle="车位列表"
          params={{
            asset_parking_places_id: data?.id,
            asset_projects_id: data?.asset_projects_id,
          }}
          columns={[
            MyColumns.ID({
              search: false,
            }),
            {
              title: '车位全称',
              dataIndex: 'full_name',
            },
            {
              title: '车位号',
              dataIndex: 'name',
              search: false,
            },
            {
              title: '建筑面积',
              dataIndex: 'built_area',
              search: false,
            },
            MyColumns.EnumTag({
              title: '类型',
              dataIndex: 'type',
              valueEnum: AssetCarPortsTypeEnum,
            }),
            MyColumns.EnumTag({
              title: '产权类型',
              dataIndex: 'property_type',
              valueEnum: AssetCarPortsPropertyTypeEnum,
            }),
            MyColumns.CreatedAt(),
            MyColumns.Option({
              render: (_, item: any, index, action) => (
                <Space key={index}>
                  <SpaceUpdate
                    item={item}
                    reload={action?.reload}
                    title={title}
                  />
                  <MyButtons.Delete
                    onConfirm={() =>
                      Apis.Asset.AssetCarPorts.Delete({
                        id: item.id,
                      }).then(() => action?.reload())
                    }
                  />
                </Space>
              ),
            }),
          ]}
        />
      </>
    </MyPageContainer>
  );
}
