admin/dh-inspeccion-v2
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

fix(actas): keep sealed act content findings-only

Browse Source
This commit is contained in:
Maximo
2026-09-15 20:59:59 -03:00
parent ff297c8d93
commit 215f443f71
14 changed files with 82 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web-v2/src/features/inspections/InspectionActMediaPanel.tsx
+11 -19
View File
@@ -1,13 +1,11 @@
import { useEffect, useState } from 'react';
import { Alert, EmptyState, LoadingBlock, errorMessage } from '../../components/Feedback';
import {
getAssetMediaBlob,
getInspectionFindingEvidenceBlob,
listInspectionActFieldMedia,
listInspectionFindingEvidence,
listInspectionFindings,
} from '../../lib/api';
import type { InspectionActFieldMedia, InspectionFinding, InspectionFindingEvidence } from '../../lib/api';
import type { InspectionFinding, InspectionFindingEvidence } from '../../lib/api';
import { formatDate } from '../../lib/format';
type FindingWithPhotos = { finding: InspectionFinding; photos: InspectionFindingEvidence[] };
@@ -30,50 +28,44 @@ function Photo({ id, title, caption, load }: { id: string; title: string; captio
</figure>;
}
function Finding({ item, assetPhotos }: { item: FindingWithPhotos; assetPhotos: InspectionActFieldMedia[] }) {
function Finding({ item }: { item: FindingWithPhotos }) {
const { finding, photos } = item;
return <article className="act-finding-record">
<div className="inspection-finding-heading"><div><span className="eyebrow">{finding.code}</span><h3>{finding.title}</h3><p>{finding.asset.name} · {finding.asset.code}</p></div></div>
<p className="inspection-finding-description">{finding.description}</p>
{finding.legalBasis && <p><strong>Normativa:</strong> {finding.legalBasis}</p>}
{finding.severity != null && <p>Gravedad {finding.severity}/10</p>}
{(photos.length > 0 || assetPhotos.length > 0) && <div className="act-finding-photos">
{photos.length > 0 && <div className="act-finding-photos">
{photos.map((photo) => <Photo key={photo.id} id={photo.id} title={photo.title || finding.title} caption={`Hallazgo · ${formatDate(photo.capturedAt || photo.createdAt)}${photo.latitude != null && photo.longitude != null ? ` · GPS ${photo.latitude.toFixed(6)}, ${photo.longitude.toFixed(6)}` : ''}`} load={getInspectionFindingEvidenceBlob} />)}
{assetPhotos.map((photo) => <Photo key={photo.id} id={photo.id} title={photo.title || finding.asset.name} caption={`Inventario · ${formatDate(photo.fieldCapturedAt || photo.capturedAt || photo.createdAt)}`} load={getAssetMediaBlob} />)}
</div>}
{photos.length === 0 && assetPhotos.length === 0 && <small className="muted">Sin fotografías vinculadas.</small>}
{photos.length === 0 && <small className="muted">Sin fotografías vinculadas al hallazgo.</small>}
</article>;
}
export function InspectionActMediaPanel({ actId }: { actId: string }) {
const [items, setItems] = useState<FindingWithPhotos[]>([]);
const [assetPhotos, setAssetPhotos] = useState<InspectionActFieldMedia[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState('');
useEffect(() => {
let active = true;
setLoading(true); setError('');
Promise.all([listInspectionFindings(actId), listInspectionActFieldMedia(actId).catch(() => [])])
.then(async ([findings, media]) => {
listInspectionFindings(actId)
.then(async (findings) => {
const records = await Promise.all(findings.map(async (finding) => ({
finding, photos: (await listInspectionFindingEvidence(finding.id)).filter((evidence) => evidence.kind === 'PHOTO' && evidence.purpose === 'OBSERVATION'),
finding,
photos: (await listInspectionFindingEvidence(finding.id)).filter((evidence) => evidence.kind === 'PHOTO' && evidence.purpose === 'OBSERVATION'),
})));
if (!active) return;
setItems(records);
setAssetPhotos(media.filter((photo) => photo.kind === 'PHOTO'));
if (active) setItems(records);
})
.catch((requestError) => active && setError(errorMessage(requestError)))
.finally(() => active && setLoading(false));
return () => { active = false; };
}, [actId]);
const findingAssetIds = new Set(items.map((item) => item.finding.asset.id));
const otherPhotos = assetPhotos.filter((photo) => !findingAssetIds.has(photo.assetId));
return <section className="panel act-media-panel">
<div className="panel-heading"><div><h2>Hallazgos del Acta</h2><p className="section-copy">Cada hallazgo reúne su descripción y las fotos tomadas en campo.</p></div><span className="count-pill">{items.length}</span></div>
<div className="panel-heading"><div><h2>Hallazgos del Acta</h2><p className="section-copy">El Acta muestra únicamente Hallazgos y la evidencia fotográfica vinculada a cada uno.</p></div><span className="count-pill">{items.length}</span></div>
{error && <Alert>{error}</Alert>}
{loading ? <LoadingBlock label="Cargando hallazgos y fotografías…" /> : items.length ?
<div className="act-finding-list">{items.map((item) => <Finding key={item.finding.id} item={item} assetPhotos={assetPhotos.filter((photo) => photo.assetId === item.finding.asset.id)} />)}</div> :
<div className="act-finding-list">{items.map((item) => <Finding key={item.finding.id} item={item} />)}</div> :
<EmptyState title="Sin hallazgos" text="Esta Acta no contiene hallazgos sincronizados." />}
{!loading && otherPhotos.length > 0 && <div className="act-other-asset-photos"><h3>Fotos de otras instalaciones</h3><div className="act-finding-photos">{otherPhotos.map((photo) => <Photo key={photo.id} id={photo.id} title={photo.title || 'Instalación inspeccionada'} caption={`${photo.title || 'Instalación'} · ${formatDate(photo.fieldCapturedAt || photo.capturedAt || photo.createdAt)}`} load={getAssetMediaBlob} />)}</div></div>}
</section>;
}