91 lines
2.3 KiB
TypeScript
91 lines
2.3 KiB
TypeScript
import {
|
|
CheckCircleOutlined,
|
|
DownloadOutlined,
|
|
ExclamationCircleOutlined,
|
|
} from '@ant-design/icons';
|
|
import { Button, Tag } from 'antd';
|
|
|
|
const FileCard = ({ file, isSelected, onClick, setIsReasonModalOpen }) => {
|
|
const fileName = file['File Name'];
|
|
const extensionType = fileName.split('.').pop();
|
|
let status = true;
|
|
if (file['Is Required'] && !file['Is Reviewed']) {
|
|
status = false;
|
|
}
|
|
return (
|
|
<div
|
|
style={{
|
|
border: `1px solid #ccc`,
|
|
backgroundColor: isSelected ? '#f4f4f4' : '#fff',
|
|
padding: '4px 8px',
|
|
margin: '0 8px 4px',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
cursor: 'pointer',
|
|
}}
|
|
onClick={onClick}
|
|
>
|
|
<div>
|
|
<div>
|
|
<p
|
|
style={{
|
|
fontSize: '12px',
|
|
color: '#333',
|
|
fontWeight: 'bold',
|
|
cursor: 'default',
|
|
margin: '4px 8px 4px 0',
|
|
display: 'inline-block',
|
|
}}
|
|
>
|
|
{file['Doc Type'].toUpperCase()}
|
|
</p>
|
|
<span
|
|
style={{
|
|
fontSize: '12px',
|
|
color: '#aaa',
|
|
fontWeight: 'bold',
|
|
cursor: 'default',
|
|
maxWidth: '40px',
|
|
overflow: 'hidden',
|
|
textOverflow: 'ellipsis',
|
|
}}
|
|
>
|
|
{fileName
|
|
? fileName.substring(0, 25).replace('temp_', '')
|
|
: fileName}
|
|
{' '}({extensionType})
|
|
</span>
|
|
</div>
|
|
<Tag
|
|
color={status ? 'success' : 'warning'}
|
|
icon={
|
|
status ? <CheckCircleOutlined /> : <ExclamationCircleOutlined />
|
|
}
|
|
style={{ display: 'inline-block', fontWeight: 'bold' }}
|
|
// bordered={false}
|
|
>
|
|
{status ? 'Good' : 'Warning'}{' '}
|
|
</Tag>
|
|
</div>
|
|
<Button
|
|
style={{
|
|
width: '24px',
|
|
height: '24px',
|
|
display: 'flex',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
marginLeft: '8px',
|
|
}}
|
|
onClick={() => {
|
|
const downloadUrl = file['File URL'];
|
|
window.open(downloadUrl, '_blank');
|
|
}}
|
|
>
|
|
<DownloadOutlined />
|
|
</Button>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default FileCard;
|