@extends('layouts.app')

@section('content')
    @php
        $canView = static fn (string $field): bool => (bool) ($readableFields[$field] ?? false);
        $canUpdate = static fn (string $field): bool => (bool) ($writableFields[$field] ?? false);
        $itemRows = old('items');
        if ($itemRows === null) {
            $itemRows = $order
                ? $order->items->map(static fn ($item): array => [
                    'id' => $item->id,
                    'common_catalog_item_id' => $item->common_catalog_item_id,
                    'order_item_number' => $item->order_item_number,
                    'factory_number' => $item->factory_number,
                    'manufacture_date' => $item->manufacture_date?->toDateString(),
                ])->values()->all()
                : [];
        }
    @endphp

    <div class="px-3">
        <div class="row mb-3">
            <div class="col-md-7 d-flex align-items-center">
                <h3 class="mb-0">{{ $order ? 'Заказ '.$order->order_number : 'Новый заказ' }}</h3>
            </div>
            @if($order && hasPermission('schedule-orders.delete'))
                <div class="col-md-5 text-md-end">
                    <form action="{{ route('schedule.orders.destroy', $order) }}" method="POST"
                          onsubmit="return confirm('Удалить заказ?')">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="btn btn-sm btn-outline-danger">Удалить</button>
                    </form>
                </div>
            @endif
        </div>

        <form action="{{ $order ? route('schedule.orders.update', $order) : route('schedule.orders.store') }}"
              method="POST">
            @csrf
            @if($order) @method('PUT') @endif
            <input type="hidden" name="nav" value="{{ $nav ?? '' }}">

            <div class="card mb-3">
                <div class="card-header"><strong>Заказ</strong></div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-xl-6">
                            @if($canView('order_number'))
                                @include('partials.input', ['name' => 'order_number', 'title' => 'Номер заказа', 'required' => true, 'value' => $order?->order_number, 'disabled' => !$canUpdate('order_number')])
                            @endif
                            @if($canView('order_year'))
                                @include('partials.input', ['name' => 'order_year', 'title' => 'Год заказа', 'type' => 'number', 'min' => 2000, 'max' => 2100, 'required' => true, 'value' => $order?->order_year ?? now()->year, 'disabled' => !$canUpdate('order_year')])
                            @endif
                            @if($canView('customer_name'))
                                @include('partials.input', ['name' => 'customer_name', 'title' => 'Заказчик', 'required' => true, 'value' => $order?->customer_name, 'disabled' => !$canUpdate('customer_name')])
                            @endif
                            @if($canView('object_address'))
                                <div class="row mb-2">
                                    <label for="object_address" class="col-form-label small col-md-4 text-md-end">Адрес объекта <sup>*</sup></label>
                                    <div class="col-md-8">
                                        <textarea name="object_address" id="object_address" rows="3" required
                                                  @disabled(!$canUpdate('object_address'))
                                                  class="form-control form-control-sm @error('object_address') is-invalid @enderror">{{ old('object_address', $order?->object_address) }}</textarea>
                                        @error('object_address') <div class="invalid-feedback"><strong>{{ $message }}</strong></div> @enderror
                                    </div>
                                </div>
                            @endif
                            @if($canView('manager_id'))
                                @include('partials.select', ['name' => 'manager_id', 'title' => 'Менеджер', 'required' => true, 'first_empty' => true, 'options' => $managers, 'value' => old('manager_id', $order?->manager_id), 'disabled' => !$canUpdate('manager_id')])
                            @endif
                            @if($canView('status'))
                                @include('partials.select', ['name' => 'status', 'title' => 'Статус', 'required' => true, 'options' => $statuses, 'value' => old('status', $order?->status?->value ?? \App\Enums\ProductionOrderStatus::Placed->value), 'disabled' => !$canUpdate('status')])
                            @endif
                            @if($canView('execution_type'))
                                @include('partials.select', ['name' => 'execution_type', 'title' => 'Тип исполнения', 'required' => true, 'first_empty' => true, 'options' => $executionTypes, 'value' => old('execution_type', $order?->execution_type?->value), 'disabled' => !$canUpdate('execution_type')])
                            @endif
                        </div>
                        <div class="col-xl-6">
                            @if($canView('invoice_number'))
                                @include('partials.input', ['name' => 'invoice_number', 'title' => '№ счёта', 'required' => true, 'value' => $order?->invoice_number, 'disabled' => !$canUpdate('invoice_number')])
                            @endif
                            @if($canView('invoice_date'))
                                @include('partials.input', ['name' => 'invoice_date', 'title' => 'Дата счёта', 'type' => 'date', 'value' => $order?->invoice_date?->toDateString(), 'disabled' => !$canUpdate('invoice_date')])
                            @endif
                            @if($canView('contract_number'))
                                @include('partials.input', ['name' => 'contract_number', 'title' => '№ договора', 'value' => $order?->contract_number, 'disabled' => !$canUpdate('contract_number')])
                            @endif
                            @if($canView('contract_date'))
                                @include('partials.input', ['name' => 'contract_date', 'title' => 'Дата договора', 'type' => 'date', 'value' => $order?->contract_date?->toDateString(), 'disabled' => !$canUpdate('contract_date')])
                            @endif
                            @if($canView('payment_date'))
                                @include('partials.input', ['name' => 'payment_date', 'title' => 'Дата оплаты', 'type' => 'date', 'required' => true, 'value' => $order?->payment_date?->toDateString(), 'disabled' => !$canUpdate('payment_date')])
                            @endif
                            @if($canView('supply_working_days'))
                                @include('partials.input', ['name' => 'supply_working_days', 'title' => 'Срок поставки, раб. дней', 'type' => 'number', 'min' => 0, 'max' => 2000, 'required' => true, 'value' => $order?->supply_working_days, 'disabled' => !$canUpdate('supply_working_days')])
                            @endif
                            @if($order && $canView('contract_shipment_date'))
                                @include('partials.input', ['name' => 'contract_shipment_date_display', 'title' => 'Дата отгрузки по договору', 'type' => 'date', 'value' => $order->contract_shipment_date?->toDateString(), 'disabled' => true])
                            @endif
                            @if($canView('application_shipment_date'))
                                @include('partials.input', ['name' => 'application_shipment_date', 'title' => 'Дата отгрузки по заявке', 'type' => 'date', 'value' => $order?->application_shipment_date?->toDateString(), 'disabled' => !$canUpdate('application_shipment_date')])
                            @endif
                            @if($canView('note'))
                                <div class="row mb-2">
                                    <label for="note" class="col-form-label small col-md-4 text-md-end">Примечание</label>
                                    <div class="col-md-8">
                                        <textarea name="note" id="note" rows="3" @disabled(!$canUpdate('note'))
                                                  class="form-control form-control-sm @error('note') is-invalid @enderror">{{ old('note', $order?->note) }}</textarea>
                                        @error('note') <div class="invalid-feedback"><strong>{{ $message }}</strong></div> @enderror
                                    </div>
                                </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mb-3">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <strong>Оборудование</strong>
                </div>
                <div class="card-body {{ $canManageItems ? 'pb-2' : 'p-0' }}">
                    @if($canManageItems)
                        <div class="mb-3">
                            <label for="production-order-catalog-search" class="form-label small mb-1">
                                Добавить МАФ из общего каталога
                            </label>
                            <div class="row g-2 mb-2">
                                <div class="col-md-9">
                                    <input type="search" id="production-order-catalog-search"
                                           class="form-control form-control-sm"
                                           placeholder="Введите артикул или наименование">
                                </div>
                                <div class="col-md-3">
                                    <div class="input-group input-group-sm">
                                        <span class="input-group-text">Количество</span>
                                        <input type="number" id="production-order-catalog-quantity"
                                               class="form-control" min="1" max="100" value="1">
                                    </div>
                                </div>
                            </div>
                            <select id="production-order-catalog-results" class="form-select form-select-sm" size="6"
                                    aria-label="Результаты поиска МАФ"></select>
                            <div class="form-text">
                                Введите не менее двух символов и выберите позицию. Для каждой единицы будет создана отдельная строка.
                            </div>
                        </div>
                    @endif
                    <div class="table-responsive">
                        <table class="table table-sm align-middle mb-0">
                            <thead>
                            <tr>
                                <th>Позиция общего каталога</th>
                                <th>Номер заказа МАФ</th>
                                <th>Заводской номер</th>
                                <th>Дата производства</th>
                                @if($canManageItems)<th></th>@endif
                            </tr>
                            </thead>
                            <tbody id="production-order-items">
                            @foreach($itemRows as $index => $itemRow)
                                @include('production_orders.partials.item-row', ['index' => $index, 'itemRow' => $itemRow])
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                    @error('items') <div class="text-danger small p-2"><strong>{{ $message }}</strong></div> @enderror
                </div>
            </div>

            <div class="d-flex flex-wrap gap-2">
                @if(($order && hasPermission('schedule-orders.update')) || (!$order && hasPermission('schedule-orders.create')))
                    <button type="submit" class="btn btn-sm btn-primary">Сохранить</button>
                @endif
                <a href="{{ $back_url }}" class="btn btn-sm btn-outline-secondary">Назад</a>
            </div>
        </form>

        @if($order)
            @include('production_orders.partials.planning')
        @endif

        @if($canManageItems)
            <template id="production-order-item-template">
                @include('production_orders.partials.item-row', [
                    'index' => '__INDEX__',
                    'itemRow' => ['common_catalog_item_id' => '', 'order_item_number' => '', 'factory_number' => '', 'manufacture_date' => ''],
                ])
            </template>
        @endif
    </div>

    @if($canManageItems)
        @push('scripts')
            <script>
                document.addEventListener('DOMContentLoaded', () => {
                    const rows = document.getElementById('production-order-items');
                    const template = document.getElementById('production-order-item-template');
                    const search = document.getElementById('production-order-catalog-search');
                    const results = document.getElementById('production-order-catalog-results');
                    const quantity = document.getElementById('production-order-catalog-quantity');
                    let nextIndex = rows.querySelectorAll('tr').length;
                    let searchTimer;
                    let requestNumber = 0;

                    search.addEventListener('input', () => {
                        clearTimeout(searchTimer);
                        const query = search.value.trim();
                        results.replaceChildren();
                        const currentRequest = ++requestNumber;
                        if (query.length < 2) return;

                        searchTimer = setTimeout(async () => {
                            try {
                                const url = new URL(@json(route('schedule.orders.catalog-search')), window.location.origin);
                                url.searchParams.set('q', query);
                                const response = await fetch(url, {headers: {'Accept': 'application/json'}});
                                if (!response.ok || currentRequest !== requestNumber) return;

                                const items = await response.json();
                                results.replaceChildren(...items.map((item) => {
                                    const option = document.createElement('option');
                                    option.value = item.id;
                                    option.textContent = item.label;
                                    return option;
                                }));
                            } catch (error) {
                                if (currentRequest === requestNumber) results.replaceChildren();
                            }
                        }, 250);
                    });

                    results.addEventListener('change', () => {
                        const option = results.selectedOptions[0];
                        if (!option) return;

                        const count = Math.min(100, Math.max(1, Number.parseInt(quantity.value, 10) || 1));
                        for (let i = 0; i < count; i++) {
                            const fragment = template.content.cloneNode(true);
                            const row = fragment.querySelector('tr');
                            row.innerHTML = row.innerHTML.replaceAll('__INDEX__', nextIndex++);
                            row.querySelector('.production-order-item-catalog-id').value = option.value;
                            row.querySelector('.production-order-item-catalog-label').textContent = option.textContent;
                            rows.appendChild(fragment);
                        }
                        search.value = '';
                        quantity.value = '1';
                        results.replaceChildren();
                    });

                    rows.addEventListener('click', (event) => {
                        const button = event.target.closest('.remove-production-order-item');
                        if (!button) return;
                        button.closest('tr').remove();
                    });
                });
            </script>
        @endpush
    @endif
@endsection