@extends('layouts.app', ['title' => $order ? 'Auftrag bearbeiten' : 'Neuer Auftrag'])
@section('content')

<div class="container-fluid py-4" style="max-width: 860px;">

    {{-- Header --}}
    <div class="d-flex align-items-center justify-content-between mb-4">
        <div>
            <h4 class="fw-bold mb-0">{{ $order ? 'Auftrag bearbeiten' : 'Neuer Auftrag' }}</h4>
            <small class="text-muted">
                {{ $order ? $order->order_nr : ($preselect_category ? $preselect_category->nr_prefix . ' – ' . $preselect_category->name : 'PMS · Auftragsverwaltung') }}
            </small>
        </div>
        <a href="{{ $order
            ? route('pms.orders.show', $order->id)
            : ($preselect_nr ?? null
                ? route('pms.orders.category', $preselect_nr)
                : route('pms.orders.index')) }}"
           class="btn btn-outline-secondary rounded-pill px-3">
            <i class="bi bi-x me-1"></i>Abbrechen
        </a>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show border-0 shadow-sm py-2 mb-3">
            <i class="bi bi-check-circle me-2"></i>{{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <form action="{{ $order ? route('pms.orders.update', $order->id) : route('pms.orders.store') }}"
          method="POST" class="needs-validation" novalidate>
        @csrf

        @if(!$order)
            <input type="hidden" name="fk_category_id" value="{{ $preselect_category?->id ?? old('fk_category_id') }}">
            <input type="hidden" name="fk_status_id" value="{{ $first_status_id ?? '' }}">
            <input type="hidden" name="fk_status_dept_id" value="{{ $first_dept_status_id ?? '' }}">
        @endif

        {{-- 0. Bauvorhaben --}}
        <div class="card border-0 shadow-sm mb-3">
            <div class="card-header bg-white border-0 pt-3 pb-1 px-4">
                <span class="fw-semibold small text-muted text-uppercase" style="letter-spacing:.05em;">
                    <i class="bi bi-geo-alt me-1"></i>Bauvorhaben
                </span>
            </div>
            <div class="card-body pt-2 px-4 pb-3">

                {{-- Radio-Auswahl --}}
                <div class="d-flex gap-4 mb-3">
                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="bv_mode" id="bv_mode_old"
                               value="old" {{ old('bv_mode', 'old') == 'old' ? 'checked' : '' }}
                               onchange="bvModeChange()">
                        <label class="form-check-label small fw-semibold" for="bv_mode_old">
                            Bereits im System eingetragen
                        </label>
                    </div>
                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="bv_mode" id="bv_mode_new"
                               value="new" {{ old('bv_mode') == 'new' ? 'checked' : '' }}
                               onchange="bvModeChange()">
                        <label class="form-check-label small fw-semibold" for="bv_mode_new">
                            Neues Bauvorhaben anlegen
                        </label>
                    </div>
                </div>

                {{-- Bestehend auswählen --}}
                <div id="bv_existing">
                    @php
                        $selBvId  = old('fk_project_location_id') ?? $order?->fk_project_location_id;
                        $selBvObj = $selBvId ? $project_locations->where('id', $selBvId)->first() : null;
                        $selBvTxt = $selBvObj ? '#'.$selBvObj->id.' · '.$selBvObj->name . ($selBvObj->address ? ' – '.$selBvObj->address : '') : '';
                    @endphp
                    <div class="ssc-wrap" data-name="fk_project_location_id">
                        <input type="text" class="form-control ssc-input"
                               placeholder="ID oder Name suchen…" autocomplete="off"
                               value="{{ $selBvTxt }}">
                        <input type="hidden" name="fk_project_location_id" id="fk_project_location_id"
                               value="{{ $selBvId }}">
                        <div class="ssc-dropdown list-group shadow-sm"
                             style="display:none; position:absolute; z-index:1050; width:100%; max-height:240px; overflow-y:auto;">
                            <button type="button" class="list-group-item list-group-item-action ssc-option small py-1"
                                    data-id="" data-text="">— kein Bauvorhaben —</button>
                            @foreach($project_locations as $bv)
                                <button type="button" class="list-group-item list-group-item-action ssc-option small py-2"
                                        data-id="{{ $bv->id }}"
                                        data-text="#{{ $bv->id }} · {{ $bv->name }}{{ $bv->address ? ' – '.$bv->address : '' }}">
                                    <span class="text-muted me-1" style="font-size:11px;">#{{ $bv->id }}</span>
                                    <strong>{{ $bv->name }}</strong>
                                    @if($bv->address)
                                        <br><small class="text-muted">{{ $bv->address }}</small>
                                    @endif
                                </button>
                            @endforeach
                        </div>
                    </div>
                </div>

                {{-- Neu anlegen --}}
                <div id="bv_new" style="display:none;">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label small fw-semibold">Name / Bezeichnung <span class="text-danger">*</span></label>
                            <input type="text" name="bv_name" class="form-control"
                                   placeholder="z.B. Berlin-Mitte AWO Kita"
                                   value="{{ old('bv_name') }}">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label small fw-semibold">Adresse</label>
                            <input type="text" name="bv_address" class="form-control geoapify-address"
                                   placeholder="z.B. Musterstr. 1, 12345 Berlin"
                                   value="{{ old('bv_address') }}"
                                   autocomplete="new-password">
                        </div>
                    </div>
                </div>

            </div>
        </div>

        {{-- 1. Kunde + Ansprechpartner --}}
        <div class="card border-0 shadow-sm mb-3">
            <div class="card-header bg-white border-0 pt-3 pb-1 px-4">
                <span class="fw-semibold small text-muted text-uppercase" style="letter-spacing:.05em;">
                    <i class="bi bi-person me-1"></i>Kunde
                </span>
            </div>
            <div class="card-body pt-2 px-4 pb-3">
                <div class="row g-3">
                    <div class="col-md-7">
                        <label class="form-label small fw-semibold">Firma / Kunde</label>
                        <select name="fk_customer_id" id="fk_customer_id" class="select-search w-100"
                                placeholder="Kunde auswählen…" onchange="loadKontakte(this.value)">
                            <option value="">— kein Kunde —</option>
                            @foreach($customers as $customer)
                                <option value="{{ $customer->customer_id }}"
                                    {{ old('fk_customer_id', $order?->fk_customer_id) == $customer->customer_id ? 'selected' : '' }}>
                                    {{ $customer->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-5">
                        <label class="form-label small fw-semibold">Ansprechpartner</label>
                        <select name="fk_customer_contact_id" id="kundeperson" class="form-select">
                            <option value="">— kein Kontakt —</option>
                            @if($order?->fk_customer_contact_id && $order->customer_contact)
                                <option value="{{ $order->customer_contact->id }}" selected>
                                    {{ $order->customer_contact->first_name }} {{ $order->customer_contact->last_name }}
                                </option>
                            @endif
                        </select>
                    </div>
                </div>
            </div>
        </div>

        {{-- 2. Projektart + Datum --}}
        <div class="card border-0 shadow-sm mb-3">
            <div class="card-header bg-white border-0 pt-3 pb-1 px-4">
                <span class="fw-semibold small text-muted text-uppercase" style="letter-spacing:.05em;">
                    <i class="bi bi-calendar3 me-1"></i>Projekt & Zeitraum
                </span>
            </div>
            <div class="card-body pt-2 px-4 pb-3">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label small fw-semibold">Projektart</label>
                        <select name="fk_type_id" class="form-select">
                            <option value="">— keine —</option>
                            @foreach($types as $type)
                                <option value="{{ $type->id }}"
                                    {{ old('fk_type_id', $order?->fk_type_id) == $type->id ? 'selected' : '' }}>
                                    {{ $type->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label small fw-semibold">Auftragsdatum</label>
                        <input type="date" name="order_date" class="form-control"
                               value="{{ old('order_date', $order?->order_date ?? now()->toDateString()) }}">
                    </div>
                </div>
            </div>
        </div>

        {{-- 3. Titel + Beschreibung --}}
        <div class="card border-0 shadow-sm mb-3">
            <div class="card-header bg-white border-0 pt-3 pb-1 px-4">
                <span class="fw-semibold small text-muted text-uppercase" style="letter-spacing:.05em;">
                    <i class="bi bi-file-text me-1"></i>Details
                </span>
            </div>
            <div class="card-body pt-2 px-4 pb-3">
                <div class="mb-3">
                    <label class="form-label small fw-semibold">Titel <span class="text-danger">*</span></label>
                    <input type="text" name="title"
                           class="form-control @error('title') is-invalid @enderror"
                           placeholder="Auftragstitel…" value="{{ old('title', $order?->title) }}" required>
                    @error('title')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                <div class="mb-0">
                    <label class="form-label small fw-semibold">Beschreibung</label>
                    <textarea name="description" class="form-control" rows="3"
                              placeholder="Kurzbeschreibung…">{{ old('description', $order?->description) }}</textarea>
                </div>
            </div>
        </div>

        {{-- Umsatzsteuer --}}
        <div class="card border-0 shadow-sm mb-3">
            <div class="card-header bg-white border-0 pt-3 pb-1 px-4">
                <span class="fw-semibold small text-muted text-uppercase" style="letter-spacing:.05em;">
                    <i class="bi bi-percent me-1"></i>Umsatzsteuer
                </span>
            </div>
            <div class="card-body pt-2 px-4 pb-3">
                <div class="row g-3">
                    <div class="col-md-4">
                        <label class="form-label small fw-semibold">MwSt-Satz</label>
                        <div class="input-group" style="max-width:140px;">
                            <input type="number" name="vat_rate" class="form-control text-end"
                                   value="{{ old('vat_rate', $order?->vat_rate ?? 19) }}"
                                   step="0.1" min="0" max="100">
                            <span class="input-group-text">%</span>
                        </div>
                    </div>
                    <div class="col-md-8">
                        <label class="form-label small fw-semibold">Hinweis <span class="text-muted fw-normal">(optional)</span></label>
                        <input type="text" name="vat_hinweis" class="form-control"
                               value="{{ old('vat_hinweis', $order?->vat_hinweis) }}"
                               placeholder="z.B. §13b UStG – Steuerschuldnerschaft des Leistungsempfängers">
                    </div>
                </div>
            </div>
        </div>

        {{-- 4. Kategorie + Status (nur beim Bearbeiten) --}}
        @if($order)
        <div class="card border-0 shadow-sm mb-3">
            <div class="card-header bg-white border-0 pt-3 pb-1 px-4">
                <span class="fw-semibold small text-muted text-uppercase" style="letter-spacing:.05em;">
                    <i class="bi bi-tags me-1"></i>Klassifizierung
                </span>
            </div>
            <div class="card-body pt-2 px-4 pb-3">
                <div class="row g-3">
                    <div class="col-md-4">
                        <label class="form-label small fw-semibold">Kategorie</label>
                        <select name="fk_category_id" class="form-select" required>
                            <option value="">— Bitte wählen —</option>
                            @foreach($categories as $cat)
                                <option value="{{ $cat->id }}"
                                    {{ old('fk_category_id', $order->fk_category_id) == $cat->id ? 'selected' : '' }}>
                                    {{ $cat->nr_prefix }} – {{ $cat->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label class="form-label small fw-semibold">Status (Auftrag)</label>
                        <select name="fk_status_id" class="form-select">
                            <option value="">— kein Status —</option>
                            @foreach($statuses as $status)
                                <option value="{{ $status->id }}"
                                    {{ old('fk_status_id', $order->fk_status_id) == $status->id ? 'selected' : '' }}>
                                    {{ $status->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label class="form-label small fw-semibold">Status (Abteilung)</label>
                        <select name="fk_status_dept_id" class="form-select">
                            <option value="">— kein Status —</option>
                            @foreach($dept_statuses as $status)
                                <option value="{{ $status->id }}"
                                    {{ old('fk_status_dept_id', $order->fk_status_dept_id) == $status->id ? 'selected' : '' }}>
                                    {{ $status->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
        </div>
        @endif

        {{-- Workflow --}}
        <div class="card border-0 shadow-sm mb-3">
            <div class="card-header bg-white border-0 pt-3 pb-1 px-4">
                <span class="fw-semibold small text-muted text-uppercase" style="letter-spacing:.05em;">
                    <i class="bi bi-diagram-3 me-1"></i>Workflow
                </span>
            </div>
            <div class="card-body pt-2 px-4 pb-3">
                <div class="col-md-6">
                    <label class="form-label small fw-semibold">Workflow <span class="text-muted fw-normal">(optional)</span></label>
                    <select name="fk_workflow_id" class="form-select">
                        <option value="">— kein Workflow —</option>
                        @foreach($workflows as $wf)
                            <option value="{{ $wf->id }}"
                                {{ old('fk_workflow_id', $order?->fk_workflow_id) == $wf->id ? 'selected' : '' }}>
                                {{ $wf->name }}
                            </option>
                        @endforeach
                    </select>
                    <div class="form-text">Bei Wechsel wird die Phase auf 1 zurückgesetzt.</div>
                </div>
            </div>
        </div>

        {{-- Buttons --}}
        <div class="d-flex gap-2 justify-content-end pb-4">
            <a href="{{ $order
                ? route('pms.orders.show', $order->id)
                : ($preselect_nr ?? null
                    ? route('pms.orders.category', $preselect_nr)
                    : route('pms.orders.index')) }}"
               class="btn btn-outline-secondary rounded-pill px-4">Abbrechen</a>
            <button type="submit" class="btn btn-success rounded-pill px-4">
                <i class="bi bi-check-lg me-1"></i>
                {{ $order ? 'Speichern' : 'Auftrag anlegen' }}
            </button>
        </div>

    </form>
</div>

<script>
    function bvModeChange() {
        var mode  = document.querySelector('input[name="bv_mode"]:checked').value;
        var isNew = (mode === 'new');
        document.getElementById('bv_existing').style.display = isNew ? 'none' : '';
        document.getElementById('bv_new').style.display      = isNew ? ''     : 'none';
        var bvName = document.querySelector('[name="bv_name"]');
        if (bvName) bvName.required = isNew;
    }
    document.addEventListener('DOMContentLoaded', bvModeChange);

    function loadKontakte(customerId) {
        var select = document.getElementById('kundeperson');
        select.innerHTML = '<option value="">— kein Kontakt —</option>';
        if (!customerId) return;
        $.ajax({
            url: '/crm/kunden-kontakt/alle/' + customerId,
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                data.forEach(function (item) {
                    $('#kundeperson').append('<option value="' + item.employee_id + '">' + item.name + '</option>');
                });
            }
        });
    }
</script>
@endsection