@extends('layouts.app')

@php
    use App\Services\AuditService;
    use App\Support\RoleNames;

    $fmtDate = function ($value, string $format = 'M j, Y H:i') {
        if (empty($value)) return '—';
        try { return \Illuminate\Support\Carbon::parse($value)->format($format); }
        catch (\Throwable $e) { return (string) $value; }
    };

    $hasPending = false;
    $openFindings = $audit->openFindingsCount();
    $majorNcCount = $audit->majorNcCount();
@endphp

@section('title', $audit->audit_number . ' — ' . $audit->title)

@section('content')
<div class="container-fluid">

    {{-- Flash --}}
    @foreach(['success' => 'check-circle', 'warning' => 'exclamation-triangle', 'error' => 'exclamation-circle'] as $key => $icon)
        @if(session($key))
            <div class="alert alert-{{ $key }} alert-dismissible fade show">
                <i class="fas fa-{{ $icon }} mr-1"></i> {{ session($key) }}
                <button type="button" class="close" data-dismiss="alert">&times;</button>
            </div>
        @endif
    @endforeach

    {{-- Header --}}
    <div class="card shadow mb-3">
        <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
            <div>
                <h3 class="mb-0">
                    <span class="badge bg-light text-dark mr-2">
                        <i class="fas {{ $audit->audit_type->icon() }} mr-1"></i>
                        {{ $audit->audit_type->label() }}
                    </span>
                    {{ $audit->audit_number }}
                </h3>
                <small>{{ $audit->title }}</small>
            </div>
            <div class="no-print">
                <a href="{{ route('audits.edit', $audit) }}" class="btn btn-light btn-sm">
                    <i class="fas fa-edit"></i> Edit
                </a>
                <a href="{{ route('audits.index') }}" class="btn btn-outline-light btn-sm">
                    <i class="fas fa-arrow-left"></i> Back
                </a>
            </div>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-3">
                    <strong>Status:</strong>
                    <span class="badge badge-{{ $audit->current_status->badge() }}">
                        {{ $audit->current_status->label() }}
                    </span>
                </div>
                <div class="col-md-3">
                    <strong>Phase:</strong>
                    <span class="badge badge-{{ $audit->current_phase->badge() }}">
                        {{ $audit->current_phase->label() }}
                    </span>
                </div>
                <div class="col-md-3">
                    <strong>Category:</strong>
                    <span class="badge badge-{{ $audit->audit_category->badge() }}">
                        {{ $audit->audit_category->label() }}
                    </span>
                </div>
                <div class="col-md-3">
                    <strong>Priority:</strong>
                    <span class="badge badge-{{
                        match($audit->priority) {
                            'CRITICAL' => 'danger', 'HIGH' => 'warning',
                            'MEDIUM' => 'info', default => 'success',
                        }
                    }}">{{ $audit->priority }}</span>
                </div>
            </div>
            <div class="row mt-2">
                <div class="col-md-3"><strong>Lead Auditor:</strong> {{ $audit->leadAuditor?->name ?? '—' }}</div>
                <div class="col-md-3"><strong>Auditee:</strong> {{ $audit->auditee?->name ?? $audit->auditee_organisation ?? '—' }}</div>
                <div class="col-md-3"><strong>Department:</strong> {{ $audit->department?->department_name ?? '—' }}</div>
                <div class="col-md-3">
                    <strong>Planned:</strong>
                    {{ $fmtDate($audit->planned_start_date, 'M j') }} – {{ $fmtDate($audit->planned_end_date, 'M j, Y') }}
                    @if($audit->isOverdue()) <span class="badge badge-danger">Overdue</span> @endif
                </div>
            </div>
            <div class="row mt-2">
                <div class="col-md-3">
                    <strong>Open Findings:</strong>
                    <span class="badge badge-{{ $openFindings > 0 ? 'warning' : 'success' }}">{{ $openFindings }}</span>
                </div>
                <div class="col-md-3">
                    <strong>Major NCs:</strong>
                    <span class="badge badge-{{ $majorNcCount > 0 ? 'danger' : 'success' }}">{{ $majorNcCount }}</span>
                </div>
                <div class="col-md-3">
                    <strong>Total Findings:</strong> {{ $audit->findings->count() }}
                </div>
                <div class="col-md-3">
                    <strong>Closed:</strong> {{ $fmtDate($audit->closed_date, 'M j, Y') }}
                </div>
            </div>
        </div>
    </div>

    {{-- Status Transitions --}}
    @if(!empty($allowedStatuses))
        <div class="card shadow mb-3">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">
                    <i class="fas fa-exchange-alt mr-1"></i> Status Transitions
                </h6>
            </div>
            <div class="card-body">
                @if($majorNcCount > 0)
                    <div class="alert alert-danger small mb-3">
                        <i class="fas fa-exclamation-triangle mr-1"></i>
                        This audit has <strong>{{ $majorNcCount }}</strong> major nonconformity(ies) — Qualified Person approval is required for closure.
                    </div>
                @endif

                @foreach($allowedStatuses as $status)
                    @php
                        $needsApproval = AuditService::requiresApproval($audit->current_status->value, $status);
                        $docType       = AuditService::workflowTypeFor($audit->current_status->value, $status);

                        $approvers = [];
                        if ($docType && $needsApproval) {
                            $approvers = AuditService::approverRolesFor($docType, $majorNcCount > 0);
                        }

                        $approverLabel = empty($approvers)
                            ? '—'
                            : implode(' + ', array_map(function ($role) {
                                return match($role) {
                                    'qa_manager'       => 'QA Manager',
                                    'department_head'  => 'Department Head',
                                    'qualified_person' => 'Qualified Person',
                                    default            => ucwords(str_replace('_', ' ', $role)),
                                };
                            }, $approvers));
                    @endphp

                    <button class="btn btn-sm btn-outline-primary mr-1 mb-1"
                            data-toggle="modal" data-target="#transitionModal"
                            onclick="setTransitionStatus('{{ $status }}', {{ $needsApproval ? 'true' : 'false' }}, '{{ $approverLabel }}')">
                        <i class="fas fa-arrow-right mr-1"></i>
                        {{ str_replace('_', ' ', $status) }}
                        @if($needsApproval)
                            <span class="badge badge-warning ml-1" title="Approvers: {{ $approverLabel }}">
                                <i class="fas fa-user-check"></i> Approval
                            </span>
                        @else
                            <span class="badge badge-success ml-1">
                                <i class="fas fa-bolt"></i> Direct
                            </span>
                        @endif
                    </button>
                @endforeach
            </div>
        </div>
    @endif
@include('record-links._tab', ['record' => $audit])
    {{-- Tabs --}}
    <ul class="nav nav-tabs" role="tablist">
        <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#tab-plan">Plan</a></li>
        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-execution">Execution</a></li>
        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-findings">
            Findings
            @if($audit->findings->count() > 0)
                <span class="badge badge-{{ $openFindings > 0 ? 'warning' : 'success' }} ml-1">{{ $audit->findings->count() }}</span>
            @endif
        </a></li>
        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-links">Links</a></li>
        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-audit">Audit</a></li>
    </ul>

    <div class="tab-content mt-3">

        {{-- Plan --}}
        <div class="tab-pane fade show active" id="tab-plan">
            <div class="card shadow">
                <div class="card-body">
                    <h5>Scope</h5>
                    <p>{!! nl2br(e($audit->scope)) !!}</p>

                    @if($audit->objectives)
                        <h5 class="mt-4">Objectives</h5>
                        <p>{!! nl2br(e($audit->objectives)) !!}</p>
                    @endif

                    @if($audit->criteria)
                        <h5 class="mt-4">Audit Criteria</h5>
                        <p>{!! nl2br(e($audit->criteria)) !!}</p>
                    @endif

                    <div class="row mt-4">
                        <div class="col-md-6">
                            <strong>Planned:</strong>
                            {{ $fmtDate($audit->planned_start_date, 'M j, Y') }} – {{ $fmtDate($audit->planned_end_date, 'M j, Y') }}
                        </div>
                        <div class="col-md-6">
                            <strong>Actual:</strong>
                            {{ $fmtDate($audit->actual_start_date, 'M j, Y') }} – {{ $fmtDate($audit->actual_end_date, 'M j, Y') }}
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {{-- Execution --}}
        <div class="tab-pane fade" id="tab-execution">
            <div class="card shadow">
                <div class="card-body">
                    @if($audit->execution_summary || $audit->closing_meeting_notes || $audit->audit_report_summary)
                        @if($audit->execution_summary)
                            <h5>Execution Summary</h5>
                            <p>{!! nl2br(e($audit->execution_summary)) !!}</p>
                        @endif

                        @if($audit->closing_meeting_notes)
                            <h5 class="mt-4">Closing Meeting Notes</h5>
                            <p>{!! nl2br(e($audit->closing_meeting_notes)) !!}</p>
                        @endif

                        @if($audit->audit_report_summary)
                            <h5 class="mt-4">Audit Report Summary</h5>
                            <p>{!! nl2br(e($audit->audit_report_summary)) !!}</p>
                        @endif
                    @else
                        <div class="alert alert-info mb-0">
                            Execution details will appear here once the audit begins. Update via the Edit form.
                        </div>
                    @endif
                </div>
            </div>
        </div>

        {{-- Findings --}}
        <div class="tab-pane fade" id="tab-findings">
            <div class="card shadow">
                <div class="card-header py-3 d-flex justify-content-between">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-search mr-1"></i> Audit Findings
                    </h6>
                    <button class="btn btn-sm btn-primary"
                            data-toggle="modal" data-target="#findingModal">
                        <i class="fas fa-plus mr-1"></i> Add Finding
                    </button>
                </div>
                <div class="card-body">
                    @if($audit->findings->isEmpty())
                        <div class="alert alert-info mb-0">
                            No findings recorded yet.
                        </div>
                    @else
                        <div class="table-responsive">
                            <table class="table table-sm table-hover">
                                <thead class="thead-light">
                                    <tr>
                                        <th width="70">#</th>
                                        <th width="130">Type</th>
                                        <th>Title</th>
                                        <th width="130">Status</th>
                                        <th width="100">CAPA</th>
                                        <th width="120">Response Due</th>
                                        <th class="no-print" width="140">Actions</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($audit->findings as $f)
                                        <tr>
                                            <td><code>{{ $f->finding_number }}</code></td>
                                            <td>
                                                <span class="badge badge-{{ $f->finding_type->badge() }}">
                                                    {{ $f->finding_type->label() }}
                                                </span>
                                                <br>
                                                <span class="badge badge-{{ $f->severity->badge() }} mt-1">
                                                    {{ $f->severity->label() }}
                                                </span>
                                            </td>
                                            <td>
                                                <strong>{{ $f->title }}</strong>
                                                @if($f->clause_reference)
                                                    <br><small class="text-muted">Ref: {{ $f->clause_reference }}</small>
                                                @endif
                                            </td>
                                            <td><span class="badge badge-{{ $f->status->badge() }}">{{ $f->status->label() }}</span></td>
                                            <td>
                                                @if($f->capa_id)
                                                    <span class="badge badge-info">CAPA #{{ $f->capa_id }}</span>
                                                @elseif($f->requiresCapa())
                                                    <span class="badge badge-danger">Required</span>
                                                @else
                                                    <span class="text-muted">—</span>
                                                @endif
                                            </td>
                                            <td>
                                                {{ $fmtDate($f->response_due_date, 'M j, Y') }}
                                                @if($f->isOverdueResponse())
                                                    <br><span class="badge badge-danger">Overdue</span>
                                                @endif
                                            </td>
                                            <td class="no-print" style="white-space: nowrap;">
                                                <button type="button"
                                                        class="btn btn-sm btn-outline-primary"
                                                        data-toggle="modal"
                                                        data-target="#respondFindingModal{{ $f->finding_id }}"
                                                        title="Record response">
                                                    <i class="fas fa-reply"></i>
                                                </button>

                                                @if(! $f->capa_id)
                                                    <button type="button"
                                                            class="btn btn-sm btn-outline-info"
                                                            data-toggle="modal"
                                                            data-target="#linkCapaModal{{ $f->finding_id }}"
                                                            title="Link CAPA">
                                                        <i class="fas fa-link"></i>
                                                    </button>
                                                @endif

                                                <form method="POST"
                                                      action="{{ route('audits.findings.destroy', [$audit, $f]) }}"
                                                      class="d-inline"
                                                      onsubmit="return confirm('Remove this finding?')">
                                                    @csrf @method('DELETE')
                                                    <button class="btn btn-sm btn-outline-danger" title="Delete">
                                                        <i class="fas fa-trash"></i>
                                                    </button>
                                                </form>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    @endif
                </div>
            </div>
        </div>

        {{-- Links --}}
        <div class="tab-pane fade" id="tab-links">
            <div class="card shadow">
                <div class="card-header py-3 d-flex justify-content-between">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-link mr-1"></i> Linked Records
                    </h6>
                    <button class="btn btn-sm btn-primary"
                            data-toggle="modal" data-target="#linkModal">
                        <i class="fas fa-plus mr-1"></i> Add Link
                    </button>
                </div>
                <div class="card-body">
                    @if($audit->links->isEmpty())
                        <div class="alert alert-info mb-0">No linked records.</div>
                    @else
                        <table class="table table-sm table-bordered mb-0">
                            <thead class="thead-light">
                                <tr>
                                    <th>Type</th>
                                    <th>ID</th>
                                    <th>Relationship</th>
                                    <th>Impact Notes</th>
                                    <th class="no-print" width="80">Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($audit->links as $link)
                                    <tr>
                                        <td><span class="badge badge-secondary">{{ $link->linked_type }}</span></td>
                                        <td>#{{ $link->linked_id }}</td>
                                        <td>{{ $link->relationship }}</td>
                                        <td>{{ Str::limit($link->impact_notes, 120) }}</td>
                                        <td class="no-print">
                                            <form method="POST"
                                                  action="{{ route('audits.links.destroy', [$audit, $link]) }}"
                                                  class="d-inline"
                                                  onsubmit="return confirm('Remove this link?')">
                                                @csrf @method('DELETE')
                                                <button class="btn btn-sm btn-outline-danger">
                                                    <i class="fas fa-unlink"></i>
                                                </button>
                                            </form>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    @endif
                </div>
            </div>
        </div>

        {{-- Audit --}}
        <div class="tab-pane fade" id="tab-audit">
            <div class="card shadow">
                <div class="card-body">
                    <table class="table table-sm">
                        <thead class="thead-light">
                            <tr>
                                <th>Date</th>
                                <th>User</th>
                                <th>Action</th>
                                <th>Description</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($audit->auditTrails as $t)
                                <tr>
                                    <td>{{ $fmtDate($t->changed_at) }}</td>
                                    <td>{{ $t->user?->name ?? 'System' }}</td>
                                    <td><code>{{ $t->action_type }}</code></td>
                                    <td>{{ $t->action_description }}</td>
                                </tr>
                            @empty
                                <tr><td colspan="4" class="text-center text-muted py-3">No audit entries.</td></tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- ═══════════════════════════════════════════════════════
     MODALS
═══════════════════════════════════════════════════════ --}}

{{-- Transition --}}
<div class="modal fade" id="transitionModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <form method="POST" action="{{ route('audits.transition', $audit) }}">
                @csrf
                <input type="hidden" name="new_status" id="transition_status_input">
                <div class="modal-header">
                    <h5 class="modal-title">Change Status</h5>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <p>Transition to: <strong id="transition_status_label">—</strong></p>

                    <div id="transition_approval_notice" class="alert alert-info" style="display: none;">
                        <i class="fas fa-user-check mr-1"></i>
                        <strong>Approval required.</strong>
                        Approver(s): <span id="transition_approvers_label">—</span>.
                    </div>

                    <div class="form-group">
                        <label>Reason / Notes</label>
                        <textarea name="reason" rows="3" class="form-control"></textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary">Confirm</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Add Finding --}}
<div class="modal fade" id="findingModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <form method="POST" action="{{ route('audits.findings.store', $audit) }}">
                @csrf
                <div class="modal-header bg-primary text-white">
                    <h5 class="modal-title">Add Audit Finding</h5>
                    <button type="button" class="close text-white" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="font-weight-bold">Finding Type <span class="text-danger">*</span></label>
                                <select name="finding_type" class="form-control" required>
                                    @foreach(\App\Enums\AuditFindingType::cases() as $t)
                                        <option value="{{ $t->value }}">{{ $t->label() }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="font-weight-bold">Severity <span class="text-danger">*</span></label>
                                <select name="severity" class="form-control" required>
                                    @foreach(\App\Enums\AuditSeverity::cases() as $s)
                                        <option value="{{ $s->value }}">{{ $s->label() }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="font-weight-bold">Title <span class="text-danger">*</span></label>
                        <input type="text" name="title" class="form-control" required maxlength="255">
                    </div>

                    <div class="form-group">
                        <label class="font-weight-bold">Description <span class="text-danger">*</span></label>
                        <textarea name="description" rows="4" class="form-control" required minlength="20"></textarea>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Clause Reference</label>
                                <input type="text" name="clause_reference" class="form-control" maxlength="100"
                                       placeholder="e.g. ISO 9001:2015 cl. 8.5.1">
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Area</label>
                                <input type="text" name="area" class="form-control" maxlength="255"
                                       placeholder="e.g. Warehouse — receiving">
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label>Objective Evidence</label>
                        <textarea name="objective_evidence" rows="3" class="form-control"></textarea>
                    </div>

                    <div class="form-group">
                        <label>Response Due Date</label>
                        <input type="date" name="response_due_date" class="form-control"
                               value="{{ now()->addDays(14)->toDateString() }}">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary">Save Finding</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Per-finding response + CAPA link modals --}}
@foreach($audit->findings as $f)
    <div class="modal fade" id="respondFindingModal{{ $f->finding_id }}" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <form method="POST" action="{{ route('audits.findings.respond', [$audit, $f]) }}">
                    @csrf
                    <div class="modal-header bg-primary text-white">
                        <h5 class="modal-title">Respond — {{ $f->finding_number }}</h5>
                        <button type="button" class="close text-white" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body">
                        <p class="text-muted small">{{ $f->title }}</p>

                        <div class="form-group">
                            <label class="font-weight-bold">Auditee Response <span class="text-danger">*</span></label>
                            <textarea name="auditee_response" rows="4" class="form-control" required minlength="20">{{ $f->auditee_response }}</textarea>
                        </div>

                        <div class="form-group">
                            <label class="font-weight-bold">Set Status</label>
                            <select name="status" class="form-control">
                                @foreach(\App\Enums\AuditFindingStatus::cases() as $s)
                                    <option value="{{ $s->value }}" @selected($f->status === $s)>{{ $s->label() }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                        <button type="submit" class="btn btn-primary">Save Response</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    @if(! $f->capa_id)
        <div class="modal fade" id="linkCapaModal{{ $f->finding_id }}" tabindex="-1">
            <div class="modal-dialog">
                <div class="modal-content">
                    <form method="POST" action="{{ route('audits.findings.capa', [$audit, $f]) }}">
                        @csrf
                        <div class="modal-header bg-info text-white">
                            <h5 class="modal-title">Link CAPA — {{ $f->finding_number }}</h5>
                            <button type="button" class="close text-white" data-dismiss="modal">&times;</button>
                        </div>
                        <div class="modal-body">
                            <p class="text-muted small">{{ $f->title }}</p>
                            <div class="form-group">
                                <label class="font-weight-bold">CAPA ID <span class="text-danger">*</span></label>
                                <input type="number" name="capa_id" class="form-control" required min="1"
                                       placeholder="e.g. 12">
                                <small class="text-muted">Enter the ID of an existing CAPA record to link.</small>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                            <button type="submit" class="btn btn-info">Link CAPA</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    @endif
@endforeach

{{-- Link modal --}}
<div class="modal fade" id="linkModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <form method="POST" action="{{ route('audits.links.store', $audit) }}">
                @csrf
                <div class="modal-header bg-primary text-white">
                    <h5 class="modal-title">Link Record</h5>
                    <button type="button" class="close text-white" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label>Type *</label>
                        <select name="linked_type" class="form-control" required>
                            @foreach($audit->audit_type->allowedLinkTypes() as $type)
                                <option value="{{ $type }}">{{ $type }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group">
                        <label>ID *</label>
                        <input type="number" name="linked_id" class="form-control" required min="1">
                    </div>
                    <div class="form-group">
                        <label>Relationship *</label>
                        <select name="relationship" class="form-control" required>
                            <option value="RELATED_TO">Related To</option>
                            <option value="TRIGGERED">Triggered</option>
                            <option value="RESOLVED_BY">Resolved By</option>
                            <option value="DUPLICATE_OF">Duplicate Of</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>Impact Notes</label>
                        <textarea name="impact_notes" rows="2" class="form-control"></textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary">Add Link</button>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection

@push('scripts')
<script>
    function setTransitionStatus(status, needsApproval, approvers) {
        document.getElementById('transition_status_input').value = status;
        document.getElementById('transition_status_label').textContent = status.replace(/_/g, ' ');

        const notice = document.getElementById('transition_approval_notice');
        const label  = document.getElementById('transition_approvers_label');

        if (needsApproval) {
            notice.style.display = '';
            label.textContent = approvers;
        } else {
            notice.style.display = 'none';
        }
    }
</script>
@endpush