@extends('layouts.master')
@section('title') {{ $formation->exists ? 'Edit Node' : 'New Node' }} @endsection
@section('content')
@component('components.breadcrumb')
@slot('li_1') <a href="{{ route('admin.formations.index') }}">Formations</a> @endslot
@slot('title') {{ $formation->exists ? 'Edit Formation Node' : 'New Formation Node' }} @endslot
@endcomponent

@if($errors->any())
<div class="alert alert-danger"><ul class="mb-0">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul></div>
@endif

@php $selectedLevel = old('level', $formation->level); @endphp

<form method="POST" action="{{ $formation->exists ? route('admin.formations.update', $formation) : route('admin.formations.store') }}">
    @csrf
    @if($formation->exists) @method('PUT') @endif
    <div class="row justify-content-center">
        <div class="col-lg-8">
            <div class="card">
                <div class="card-header"><h5 class="card-title mb-0">Formation Node</h5></div>
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="form-label">Level <span class="text-danger">*</span></label>
                            <select name="level" class="form-select" required>
                                @foreach(\App\Models\Formation::LEVELS as $key => $label)
                                    <option value="{{ $key }}" @selected($selectedLevel === $key)>{{ $label }}</option>
                                @endforeach
                            </select>
                            <small class="text-muted">Portfolio → Area → Division → Station.</small>
                        </div>
                        <div class="col-md-8">
                            <label class="form-label">Parent</label>
                            <select name="parent_id" id="formation-parent-select" class="form-select">
                                <option value="">— none (top-level Portfolio) —</option>
                                @foreach($parents as $p)
                                    <option value="{{ $p->id }}" @selected((string) old('parent_id', $formation->parent_id) === (string) $p->id)>{{ $p->picker_label }}</option>
                                @endforeach
                            </select>
                            <small class="text-muted">Must be one level up. Change the level first to see valid parents.</small>
                        </div>
                        <div class="col-md-8">
                            <label class="form-label">Name <span class="text-danger">*</span></label>
                            <input type="text" name="name" class="form-control" value="{{ old('name', $formation->name) }}" placeholder="e.g. Fraud Squad" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Code</label>
                            <input type="text" name="code" class="form-control" value="{{ old('code', $formation->code) }}" placeholder="optional">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Location (Parish / Zone)</label>
                            <input type="text" name="location" class="form-control" value="{{ old('location', $formation->location) }}" placeholder="e.g. Kingston">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Cost Centre</label>
                            <input type="text" name="cost_centre" class="form-control" value="{{ old('cost_centre', $formation->cost_centre) }}" placeholder="budget code">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label">Officer in Charge</label>
                            <input type="text" name="officer_in_charge" class="form-control" value="{{ old('officer_in_charge', $formation->officer_in_charge) }}">
                        </div>
                        <div class="col-md-8">
                            <label class="form-label">PAL Office (routing)</label>
                            <select name="pal_office_id" class="form-select">
                                <option value="">— inherit from parent —</option>
                                @foreach($palOffices as $o)
                                <option value="{{ $o->id }}" @selected(old('pal_office_id', $formation->pal_office_id) == $o->id)>{{ $o->name }} ({{ $o->code }})</option>
                                @endforeach
                            </select>
                            <small class="text-muted">Requisitions from this branch (and everything under it) route to this PAL office. Usually set on an Area / Branch node; deeper nodes inherit it.</small>
                        </div>
                        <div class="col-12">
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" name="is_active" value="1" id="is_active" @checked(old('is_active', $formation->is_active ?? true))>
                                <label class="form-check-label" for="is_active">Active</label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-footer d-flex gap-2">
                    <button type="submit" class="btn btn-primary">{{ $formation->exists ? 'Save Changes' : 'Create Node' }}</button>
                    <a href="{{ route('admin.formations.index') }}" class="btn btn-light">Cancel</a>
                </div>
            </div>
        </div>
    </div>
</form>
@endsection

@section('script')
<link href="{{ URL::asset('build/libs/choices.js/public/assets/styles/choices.min.css') }}" rel="stylesheet" type="text/css">
<script src="{{ URL::asset('build/libs/choices.js/public/assets/scripts/choices.min.js') }}"></script>
<script>
(function () {
    var el = document.getElementById('formation-parent-select');
    if (el && window.Choices) {
        try { new Choices(el, { searchEnabled: true, shouldSort: false, itemSelectText: '', searchResultLimit: 20, placeholder: true, allowHTML: true }); } catch (e) {}
    }
})();
</script>
@endsection