{/* Top summary strip */}

{E.who} · Tier {E.tier}

{E.gpn}

{E.variety} · {E.stage}

{QD.KG(E.net)}

{/* Evidence summary */}

Evidence

Samples inspected 3 of 3

{/* Remarks */}

Inspector remarks

{dmBreach > 0 ?

Load partially shaded on arrival; one section appears harvested early. S2 read 19.2% — re-sampled, second reading consistent. Recommend supervisor review before approval.

No anomalies noted. Load sound and consistent across all three samples. No additional remarks recorded.

}

2 evidence photos

{/* Decision support */}

Recommendation for procurement

Matrix recommendation

{recTone === "approved" ? : recTone === "rejected" ? : } {rec}

{state === "approve" ? "All samples within range. Decision rule: majority pass." : state === "reject" ? "All DM samples below the minimum. Strong reject signal." : "Borderline readings near the boundary — equal treatment, your call."}

LAST 5 APPROVALS · {E.variety} AT THIS DM RANGE

{[25.4, 26.1, 25.2, 27.0, 25.8].map((v, i) => (

{v}

))}

{/* Incoming inspection checklist (IMTR) — read-only summary carried into the decision */}

Inspection checklist · IMTRCaptured at start · read-only

{E.checklist.map((c, i) => (

{c.id} {c.point}

{c.standard} {c.actual} {c.ok ? <> OK : <> NO}

))}

{/* Sticky action bar — QC submits the result; procurement decides */}

setReject(true)}>Flag reject concern setHold(true)}>Hold for review submit("pass")}>Submit result to procurement

{/* Flag reject concern modal — QC flags, procurement decides */} setReject(false)} title="Flag a reject concern" desc="QC no longer rejects loads directly. Flagging records your concern and fast-tracks the load to procurement, who make the final buying decision.">

Concern *

</div>
        <div className="op-modal-actions"><Btn variant="ghost" block onClick={() => setReject(false)}>Cancel</Btn><Btn variant="primary" block onClick={() => { setReject(false); go("flagReject"); }}>Flag & send to procurement</Btn></div>
      </Modal>

{/* Hold modal */}
      <Modal open={hold} onClose={() => setHold(false)} title="Hold for supervisor review" desc="The truck stays on-site at status 'QC hold'. Your task closes; the event stays open until the supervisor decides.">
        <div className="op-field"><div className="op-label">Reason <span className="req">*</span></div><textarea className="op-textarea" placeholder="Why does this need supervisor attention?"/></div>
        <div className="op-field" style={{ margin: 0 }}><div className="op-label">Assign supervisor <span className="req">*</span></div><div className="op-select-wrap"><select className="op-select"><option>{QD.SUPERVISOR.name} (QC Supervisor)</option><option>Grace Mwangi (QC Manager)</option></select><Ic.ChevronDown size={16} className="op-select-chev"/></div></div>
        <div className="op-modal-actions"><Btn variant="ghost" block onClick={() => setHold(false)}>Cancel</Btn><Btn variant="primary" block onClick={() => { setHold(false); submit("queue"); }}>Place on hold</Btn></div>
      </Modal>

{/* Approve-with-breach override */}
      <OverrideModal open={override} onClose={() => setOverride(false)} condition="You are approving a load with one or more parameter breaches. The supervisor PIN, reason, and the original breach are logged permanently against the batch."
        onConfirm={() => { setOverride(false); submit("pass"); }}/>
    </div>
  );
};

window.OptPages = Object.assign(window.OptPages || {}, {
  decision: { chrome: "flow", title: "Submit QC result for decision — GPN-…0041", sub: "Step 3 of 3 · Submit for decision", back: "sampling", render: (ctx) => <QcDecision {...ctx}/> },
});