import { UploadMaterial } from '@/components';
import {
	ProFormDependency,
	ProFormField,
	ProFormItemProps,
} from '@ant-design/pro-components';
import React from 'react';

interface ProFormUploadMaterialProps extends ProFormItemProps {
	mode?: 'string' | 'file';
	fieldProps: {
		maxCount: number;
		onChange?: (fileList: any[]) => void;
		fileList?: any[];
	};
}

const ProFormUploadMaterial: React.FC<ProFormUploadMaterialProps> = ({
	fieldProps,
	mode = 'string',
	...rest
}) => {
	return (
		<ProFormDependency name={[rest.name]}>
			{(data, form) => (
				<ProFormField {...rest}>
					<UploadMaterial
						onChange={(fileList) => {
							if (mode === 'string') {
								form.setFieldValue(
									rest.name,
									fileList?.map((file: any) => file.url),
								);
							}

							if (mode === 'file') {
								form.setFieldValue(rest.name, fileList);
							}
						}}
						fileList={data[rest.name]?.map((url: string, index: number) => {
							return {
								uid: index.toString(),
								name: url,
								// @ts-ignore
								status: 'success',
								thumbUrl: url,
								url: url,
							};
						})}
						{...fieldProps}
					/>
				</ProFormField>
			)}
		</ProFormDependency>
	);
};
export default ProFormUploadMaterial;
