import { useEffect, useMemo, useState } from 'react';
import { getChecklist } from '../../services/api/consolidations';
import { message, Modal, Table, TableColumnsType } from 'antd';
import { ChecklistBackendShape, type IVersionCard } from '../../types/consolidations/version_members';
import { DownloadOutlined } from '@ant-design/icons';
import { buildChecklistColumns, getMarksItems } from './checklist_utils';
// import { useMe } from '../../auth/useMe';

type ChecklistProps = {
	open: boolean;
	onDownload: () => void;
	consolidationData: IVersionCard;
	onClose: () => void;
};

export default function ChecklistModal({ open, onDownload, consolidationData, onClose }: ChecklistProps) {
	const [checklistData, setChecklistData] = useState<ChecklistBackendShape | null>(null);

	const displayedData = useMemo(() => {
		if (!checklistData) return;
		const result = [];
		for (const row of checklistData.rows) {
			const rowObj = {
				name: row.legal_entity_name,
				inn: row.legal_entity_inn,
				ofr: 'MISSING',
				balance: 'MISSING',
			};
			for (const cell of row.cells) {
				if (cell.document_type === 'OSV') {
					const code = cell.account;
					const key = `osv_${code}`;
					rowObj[key] = cell.status;
				} else if (cell.document_type === 'BALANCE') {
					rowObj.balance = cell.status;
				} else if (cell.document_type === 'OFR') {
					rowObj.ofr = cell.status;
				}
			}
			result.push(rowObj);
		}
		return result;
	}, [checklistData]);
	const columns: TableColumnsType = useMemo(() => {
		if (!checklistData) return [];
		return buildChecklistColumns(checklistData);
	}, [checklistData]);

	useEffect(() => {
		async function fetchChecklist() {
			if (!consolidationData.id || !open) return;
			try {
				const res = await getChecklist(consolidationData.id);
				setChecklistData(res);
			} catch (e) {
				message.error(e.message);
			}
		}
		fetchChecklist();
	}, [open, consolidationData.id]);
	return (
		<Modal
			width='100%'
			open={open}
			cancelText='Отмена'
			onCancel={onClose}
			title='Чеклист'
			destroyOnHidden
			onOk={() => {
				onDownload();
				onClose();
			}}
			okText='Скачать чек-лист'
			okButtonProps={{ icon: <DownloadOutlined /> }}>
			<div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>
				{getMarksItems()}
				<Table columns={columns} dataSource={displayedData} pagination={false} />
			</div>
		</Modal>
	);
}