fix: restore crane edit modal in task service context
Expose task details from the service-context task list and restore visible crane data editing within the task flow. Add crane working-hours and mileage editing to the task creation modal when a service context is selected, and improve the task details modal action so servicers can update crane data directly. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
mariomitte
@@ -2,6 +2,7 @@
|
||||
import { createTask, fetchTaskTemplates, getStatusLabel } from '../../stores/taskStore';
|
||||
import { formatPurposeLabel, formatWorkOrderDisplayCode } from '../../lib/displayIds';
|
||||
import ModalShell from '../ui/ModalShell';
|
||||
import { updateVehicle } from '../../stores/fleetDashboardStore';
|
||||
|
||||
const STATUS_OPTIONS = ['aktivan', 'servis', 'zavrsen', 'neaktivan'];
|
||||
|
||||
@@ -32,6 +33,10 @@ export default function TaskCreateModal({ open, workOrders = [], contextCrane =
|
||||
const [templateLoading, setTemplateLoading] = useState(false);
|
||||
const [templateId, setTemplateId] = useState('');
|
||||
const [templates, setTemplates] = useState([]);
|
||||
const [craneDataModalOpen, setCraneDataModalOpen] = useState(false);
|
||||
const [craneDataForm, setCraneDataForm] = useState({ superstructure_working_hours: '', chassis_working_hours: '', current_mileage: '' });
|
||||
const [savingCraneData, setSavingCraneData] = useState(false);
|
||||
const [craneDataError, setCraneDataError] = useState('');
|
||||
|
||||
const selectedTemplate = useMemo(
|
||||
() => templates.find((template) => String(template.id) === String(templateId)) || null,
|
||||
@@ -51,6 +56,10 @@ export default function TaskCreateModal({ open, workOrders = [], contextCrane =
|
||||
setTemplateId('');
|
||||
setTemplates([]);
|
||||
setTemplateLoading(false);
|
||||
setCraneDataModalOpen(false);
|
||||
setCraneDataForm({ superstructure_working_hours: '', chassis_working_hours: '', current_mileage: '' });
|
||||
setSavingCraneData(false);
|
||||
setCraneDataError('');
|
||||
return;
|
||||
}
|
||||
// Auto-pre-select today's open work order if exactly one exists for this crane
|
||||
@@ -76,6 +85,60 @@ export default function TaskCreateModal({ open, workOrders = [], contextCrane =
|
||||
}));
|
||||
}, [selectedTemplate]);
|
||||
|
||||
function openCraneDataModal() {
|
||||
if (!contextCrane?.id) {
|
||||
setCraneDataError('Dizalica nije odabrana u servisnom kontekstu.');
|
||||
return;
|
||||
}
|
||||
setCraneDataForm({
|
||||
superstructure_working_hours: String(contextCrane?.superstructure_working_hours ?? ''),
|
||||
chassis_working_hours: String(contextCrane?.chassis_working_hours ?? ''),
|
||||
current_mileage: String(contextCrane?.current_mileage ?? ''),
|
||||
});
|
||||
setCraneDataError('');
|
||||
setCraneDataModalOpen(true);
|
||||
}
|
||||
|
||||
async function handleSaveCraneData() {
|
||||
if (!contextCrane?.id) {
|
||||
setCraneDataError('Dizalica nije odabrana u servisnom kontekstu.');
|
||||
return;
|
||||
}
|
||||
const superstructure = craneDataForm.superstructure_working_hours === '' ? undefined : Number(craneDataForm.superstructure_working_hours);
|
||||
const chassis = craneDataForm.chassis_working_hours === '' ? undefined : Number(craneDataForm.chassis_working_hours);
|
||||
const mileage = craneDataForm.current_mileage === '' ? undefined : Number(craneDataForm.current_mileage);
|
||||
if (superstructure !== undefined && (Number.isNaN(superstructure) || superstructure < 0)) {
|
||||
setCraneDataError('Radni sati nadogradnje moraju biti pozitivan broj.');
|
||||
return;
|
||||
}
|
||||
if (chassis !== undefined && (Number.isNaN(chassis) || chassis < 0)) {
|
||||
setCraneDataError('Radni sati podvozja moraju biti pozitivan broj.');
|
||||
return;
|
||||
}
|
||||
if (mileage !== undefined && (Number.isNaN(mileage) || mileage < 0)) {
|
||||
setCraneDataError('Kilometraza mora biti pozitivan broj.');
|
||||
return;
|
||||
}
|
||||
const payload = {};
|
||||
if (superstructure !== undefined) payload.superstructure_working_hours = superstructure;
|
||||
if (chassis !== undefined) payload.chassis_working_hours = chassis;
|
||||
if (mileage !== undefined) payload.current_mileage = mileage;
|
||||
if (Object.keys(payload).length === 0) {
|
||||
setCraneDataError('Unesite barem jednu vrijednost za azuriranje.');
|
||||
return;
|
||||
}
|
||||
setSavingCraneData(true);
|
||||
setCraneDataError('');
|
||||
try {
|
||||
await updateVehicle(contextCrane.id, payload);
|
||||
setCraneDataModalOpen(false);
|
||||
} catch (err) {
|
||||
setCraneDataError(err?.message || 'Azuriranje podataka dizalice nije uspjelo.');
|
||||
} finally {
|
||||
setSavingCraneData(false);
|
||||
}
|
||||
}
|
||||
|
||||
if (!open) return null;
|
||||
|
||||
function setField(name, value) {
|
||||
@@ -156,6 +219,7 @@ export default function TaskCreateModal({ open, workOrders = [], contextCrane =
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<ModalShell
|
||||
onClose={onClose}
|
||||
overlayClassName="z-50 overflow-y-auto p-4 pt-20"
|
||||
@@ -215,6 +279,39 @@ export default function TaskCreateModal({ open, workOrders = [], contextCrane =
|
||||
</label>
|
||||
)}
|
||||
|
||||
{contextCrane && (
|
||||
<div className="rounded-lg border border-border-hairline bg-canvas-base p-3">
|
||||
<div className="flex items-start justify-between gap-3">
|
||||
<div>
|
||||
<p className="text-sm font-semibold text-text-main">Podaci odabrane dizalice</p>
|
||||
<p className="text-xs text-text-muted">{contextCrane.registration_number || '-'} / {contextCrane.make || '-'} {contextCrane.model || ''}</p>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={openCraneDataModal}
|
||||
disabled={submitting}
|
||||
className="rounded border border-border-hairline px-3 py-1 text-xs font-semibold text-text-main hover:bg-canvas-deep disabled:opacity-60"
|
||||
>
|
||||
Uredi podatke dizalice
|
||||
</button>
|
||||
</div>
|
||||
<dl className="mt-3 grid gap-2 text-sm sm:grid-cols-3">
|
||||
<div>
|
||||
<dt className="text-xs text-text-muted">Radni sati nadogradnje</dt>
|
||||
<dd className="text-text-main">{contextCrane.superstructure_working_hours ?? '-'}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-xs text-text-muted">Radni sati podvozja</dt>
|
||||
<dd className="text-text-main">{contextCrane.chassis_working_hours ?? '-'}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-xs text-text-muted">Kilometraza</dt>
|
||||
<dd className="text-text-main">{contextCrane.current_mileage ?? '-'}</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<label className="flex flex-col gap-1 text-sm">
|
||||
<span className="font-medium text-text-main">Naslov zadatka *</span>
|
||||
<input
|
||||
@@ -326,5 +423,84 @@ export default function TaskCreateModal({ open, workOrders = [], contextCrane =
|
||||
</form>
|
||||
</div>
|
||||
</ModalShell>
|
||||
|
||||
{craneDataModalOpen && (
|
||||
<ModalShell
|
||||
onClose={() => setCraneDataModalOpen(false)}
|
||||
overlayClassName="z-[60] bg-black/40 p-4"
|
||||
contentClassName="flex min-h-full items-center justify-center"
|
||||
panelClassName="w-full max-w-lg rounded-xl border border-border-hairline bg-canvas-elevated shadow-2xl"
|
||||
>
|
||||
<div className="space-y-4 p-4">
|
||||
<div>
|
||||
<h4 className="text-base font-semibold text-text-main">Izmijeni podatke dizalice</h4>
|
||||
<p className="mt-1 text-sm text-text-muted">
|
||||
Azurirajte radne sate i kilometrazu za dizalicu: <strong>{contextCrane?.registration_number || "-"}</strong>
|
||||
</p>
|
||||
</div>
|
||||
<label className="flex flex-col gap-1 text-sm">
|
||||
<span className="text-xs text-text-muted">Radni sati nadogradnje</span>
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
step="0.01"
|
||||
value={craneDataForm.superstructure_working_hours}
|
||||
onInput={(event) => setCraneDataForm((prev) => ({ ...prev, superstructure_working_hours: event.currentTarget.value }))}
|
||||
disabled={savingCraneData}
|
||||
className="rounded-lg border border-border-hairline bg-canvas-base px-3 py-2 text-text-main disabled:opacity-60"
|
||||
/>
|
||||
</label>
|
||||
<label className="flex flex-col gap-1 text-sm">
|
||||
<span className="text-xs text-text-muted">Radni sati podvozja</span>
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
step="0.01"
|
||||
value={craneDataForm.chassis_working_hours}
|
||||
onInput={(event) => setCraneDataForm((prev) => ({ ...prev, chassis_working_hours: event.currentTarget.value }))}
|
||||
disabled={savingCraneData}
|
||||
className="rounded-lg border border-border-hairline bg-canvas-base px-3 py-2 text-text-main disabled:opacity-60"
|
||||
/>
|
||||
</label>
|
||||
<label className="flex flex-col gap-1 text-sm">
|
||||
<span className="text-xs text-text-muted">Kilometraza (km)</span>
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
step="1"
|
||||
value={craneDataForm.current_mileage}
|
||||
onInput={(event) => setCraneDataForm((prev) => ({ ...prev, current_mileage: event.currentTarget.value }))}
|
||||
disabled={savingCraneData}
|
||||
className="rounded-lg border border-border-hairline bg-canvas-base px-3 py-2 text-text-main disabled:opacity-60"
|
||||
/>
|
||||
</label>
|
||||
{craneDataError && (
|
||||
<div className="rounded-lg border border-red-300 bg-red-50 px-3 py-2 text-sm text-red-700">
|
||||
{craneDataError}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex justify-end gap-2">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setCraneDataModalOpen(false)}
|
||||
disabled={savingCraneData}
|
||||
className="rounded-lg border border-border-hairline px-4 py-2 text-sm font-medium text-text-main hover:bg-canvas-deep disabled:opacity-60"
|
||||
>
|
||||
Odustani
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleSaveCraneData}
|
||||
disabled={savingCraneData}
|
||||
className="rounded-lg bg-emerald-600 px-4 py-2 text-sm font-semibold text-white hover:bg-emerald-700 disabled:opacity-60"
|
||||
>
|
||||
{savingCraneData ? "Spremanje..." : "Spremi podatke"}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</ModalShell>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user