84 lines
1.9 KiB
TypeScript
84 lines
1.9 KiB
TypeScript
![]() |
import { DownloadOutlined } from "@ant-design/icons";
|
||
|
import { Button } from "antd";
|
||
|
|
||
|
const FileCard = ({ file, isSelected, onClick, setIsReasonModalOpen }) => {
|
||
|
const fileName = file['File Name'];
|
||
|
|
||
|
return (
|
||
|
<div
|
||
|
style={{
|
||
|
border: '1px solid #ccc',
|
||
|
width: '200px',
|
||
|
backgroundColor: isSelected ? '#d4ecff' : '#fff',
|
||
|
padding: '4px 8px',
|
||
|
marginRight: '4px',
|
||
|
marginTop: '2px',
|
||
|
position: 'relative',
|
||
|
height: '100px',
|
||
|
overflow: 'hidden',
|
||
|
}}
|
||
|
onClick={onClick}
|
||
|
>
|
||
|
<div>
|
||
|
<span
|
||
|
style={{
|
||
|
fontSize: '12px',
|
||
|
color: '#333',
|
||
|
fontWeight: 'bold',
|
||
|
padding: '4px 8px',
|
||
|
cursor: 'default',
|
||
|
}}
|
||
|
>
|
||
|
{file['Doc Type'].toUpperCase()}
|
||
|
</span>
|
||
|
<span
|
||
|
style={{
|
||
|
fontSize: '12px',
|
||
|
color: '#aaa',
|
||
|
fontWeight: 'bold',
|
||
|
padding: '4px 8px',
|
||
|
cursor: 'default',
|
||
|
maxWidth: '50px',
|
||
|
overflow: 'hidden',
|
||
|
textOverflow: 'ellipsis',
|
||
|
}}
|
||
|
>
|
||
|
{fileName ? fileName.substring(0, 25).replace('temp_', '') : fileName}
|
||
|
</span>
|
||
|
</div>
|
||
|
<div
|
||
|
style={{
|
||
|
padding: '4px',
|
||
|
position: 'absolute',
|
||
|
bottom: 2,
|
||
|
right: 2,
|
||
|
}}
|
||
|
>
|
||
|
<Button
|
||
|
style={{
|
||
|
margin: '4px 2px',
|
||
|
}}
|
||
|
onClick={() => {
|
||
|
setIsReasonModalOpen(true);
|
||
|
}}
|
||
|
>
|
||
|
Review
|
||
|
</Button>
|
||
|
<Button
|
||
|
style={{
|
||
|
margin: '4px 2px',
|
||
|
}}
|
||
|
onClick={() => {
|
||
|
const downloadUrl = file['File URL'];
|
||
|
window.open(downloadUrl, '_blank');
|
||
|
}}
|
||
|
>
|
||
|
<DownloadOutlined />
|
||
|
</Button>
|
||
|
</div>
|
||
|
</div>
|
||
|
);
|
||
|
};
|
||
|
|
||
|
export default FileCard;
|