Enhance attachment display in ChangeEquipmentStatusList
- Added a new component, StatusChangeAttachmentLink, to render file attachments in the ChangeEquipmentStatusList. - Updated the rendering logic to display up to three attachment links with a count of additional attachments if more than three exist. - Improved the overall user interface for better visibility of file attachments related to equipment status changes.
This commit is contained in:
@@ -13,6 +13,7 @@ import {
|
||||
TopToolbar,
|
||||
} from 'react-admin';
|
||||
import { equipmentStatusChoices } from '../equipment/shared';
|
||||
import { StatusChangeAttachmentLink } from './StatusChangeAttachmentLink';
|
||||
|
||||
const statusFilters = [
|
||||
<TextInput key="q" source="q" label="Поиск" alwaysOn />,
|
||||
@@ -41,9 +42,31 @@ export function ChangeEquipmentStatusList() {
|
||||
<TextField source="responsible" />
|
||||
<FunctionField
|
||||
label="Файлы"
|
||||
render={(record: { attachments?: { id: string }[] | null }) => {
|
||||
const count = Array.isArray(record.attachments) ? record.attachments.length : 0;
|
||||
return count ? String(count) : '—';
|
||||
render={(record: {
|
||||
id: string;
|
||||
attachments?: { id: string; originalFileName?: string | null }[] | null;
|
||||
}) => {
|
||||
const items = Array.isArray(record.attachments) ? record.attachments : [];
|
||||
if (!items.length) {
|
||||
return '—';
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{ display: 'grid', gap: 4, minWidth: 180 }}>
|
||||
{items.slice(0, 3).map((att) => (
|
||||
<div key={att.id} style={{ lineHeight: 1.2 }}>
|
||||
<StatusChangeAttachmentLink
|
||||
statusChangeId={record.id}
|
||||
attachmentId={att.id}
|
||||
fileName={att.originalFileName ?? 'файл'}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
{items.length > 3 ? (
|
||||
<span style={{ opacity: 0.75, fontSize: 12 }}>{`+ ещё ${items.length - 3}`}</span>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</Datagrid>
|
||||
|
||||
Reference in New Issue
Block a user