110 lines
3.1 KiB
TypeScript
110 lines
3.1 KiB
TypeScript
|
import {
|
||
|
|
MyBetaModalFormProps,
|
||
|
|
MyButtons,
|
||
|
|
MyColumns,
|
||
|
|
MyProTableProps,
|
||
|
|
} from '@/common';
|
||
|
|
import { MyModal } from '@/components/MyModal';
|
||
|
|
import { Apis } from '@/gen/Apis';
|
||
|
|
import { AssetProjectsPropertyTypeEnum } from '@/gen/Enums';
|
||
|
|
import { ProTable } from '@ant-design/pro-components';
|
||
|
|
import { useRef, useState } from 'react';
|
||
|
|
interface DataType {
|
||
|
|
key?: React.Key;
|
||
|
|
id?: React.Key;
|
||
|
|
}
|
||
|
|
export default function SurveysSelectList(
|
||
|
|
props: MyBetaModalFormProps & {
|
||
|
|
onChange?: (selectedRows: DataType[]) => void;
|
||
|
|
type?: 'checkbox' | 'radio';
|
||
|
|
},
|
||
|
|
) {
|
||
|
|
const modalRef = useRef<any>();
|
||
|
|
// const [selectedDataRow, setSelectedDataRow] = useState<any>({});
|
||
|
|
const [getSelectedRow, setSelectedRow] = useState<any>([]);
|
||
|
|
const rowSelection: any = {
|
||
|
|
onChange: (selectedRowKeys: React.Key[], selectedRows: DataType[]) => {
|
||
|
|
console.log(selectedRows, 'selectedRows[0]');
|
||
|
|
setSelectedRow(selectedRows);
|
||
|
|
},
|
||
|
|
getCheckboxProps: (record: any) => ({
|
||
|
|
disabled: record.deleted_at,
|
||
|
|
checked: props?.item?.some((item: any) => {
|
||
|
|
console.log(item, record);
|
||
|
|
return item?.id === record?.id;
|
||
|
|
}),
|
||
|
|
}),
|
||
|
|
defaultSelectedRowKeys: props?.item?.map((item: any) => item?.id) || [],
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<MyModal
|
||
|
|
title={'选择关联项目'}
|
||
|
|
width="1000px"
|
||
|
|
myRef={modalRef}
|
||
|
|
size="middle"
|
||
|
|
onOpen={() => {
|
||
|
|
setSelectedRow(props?.item);
|
||
|
|
console.log(props?.item, 'props?.item?.id');
|
||
|
|
}}
|
||
|
|
node={
|
||
|
|
<ProTable
|
||
|
|
{...MyProTableProps.props}
|
||
|
|
request={async (params, sort) =>
|
||
|
|
MyProTableProps.request(params, sort, Apis.Asset.AssetProjects.List)
|
||
|
|
}
|
||
|
|
rowSelection={{
|
||
|
|
type: props?.type ? props?.type : 'checkbox',
|
||
|
|
...rowSelection,
|
||
|
|
}}
|
||
|
|
options={false}
|
||
|
|
tableAlertOptionRender={() => {
|
||
|
|
return (
|
||
|
|
<MyButtons.Default
|
||
|
|
key="okSelect"
|
||
|
|
size="middle"
|
||
|
|
type="primary"
|
||
|
|
onClick={() => {
|
||
|
|
let res: any = getSelectedRow;
|
||
|
|
props?.onChange?.(res);
|
||
|
|
modalRef.current?.close();
|
||
|
|
}}
|
||
|
|
title="确定选项"
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
}}
|
||
|
|
columns={[
|
||
|
|
MyColumns.ID({
|
||
|
|
search: false,
|
||
|
|
}),
|
||
|
|
{
|
||
|
|
title: '项目名称',
|
||
|
|
dataIndex: 'name',
|
||
|
|
},
|
||
|
|
MyColumns.EnumTag({
|
||
|
|
title: '类型',
|
||
|
|
dataIndex: 'property_type',
|
||
|
|
valueEnum: AssetProjectsPropertyTypeEnum,
|
||
|
|
search: false,
|
||
|
|
}),
|
||
|
|
{
|
||
|
|
title: '地址',
|
||
|
|
render: (_, i: any) => {
|
||
|
|
return `${i?.province || ''} ${i?.city || ''} ${
|
||
|
|
i?.district || ''
|
||
|
|
}${i?.address || ''}`;
|
||
|
|
},
|
||
|
|
search: false,
|
||
|
|
},
|
||
|
|
MyColumns.DeletedAt({
|
||
|
|
title: '启/禁用',
|
||
|
|
dataIndex: 'deleted_at',
|
||
|
|
search: false,
|
||
|
|
}),
|
||
|
|
]}
|
||
|
|
/>
|
||
|
|
}
|
||
|
|
></MyModal>
|
||
|
|
);
|
||
|
|
}
|