strprfcrm/resources/views/orders/edit.blade.php

@extends('layouts.app')

@section('content')

    <div class="px-3">

        <form class="row" action="{{ route('order.store') }}" method="post">
            <div class="col-xxl-6">
                <h4>Общая информация об объекте</h4>

                @csrf

                @if(isset($order))
                    <input type="hidden" name="id" value="{{ $order->id }}">
                @endif

                @include('partials.select', ['name' => 'district_id', 'title' => 'Округ', 'options' => $districts, 'value' => $order?->district_id ?? old('district_id'), 'first_empty' => true, 'required' => true])

                @include('partials.select', ['name' => 'area_id', 'title' => 'Район', 'options' => $areas, 'value' => $order?->area_id ?? old('area_id'), 'required' => true, 'first_empty' => true])

                @include('partials.input', ['name' => 'object_address', 'title' => 'Адрес объекта', 'value' => $order->object_address ?? old('object_address'), 'required' => true])

                @include('partials.select', ['name' => 'object_type_id', 'title' => 'Тип объекта', 'options' => $objectTypes, 'value' => $order->object_type_id ?? old('object_type_id'), 'required' => true, 'first_empty' => true])

                @include('partials.select', ['name' => 'order_status_id', 'title' => 'Статус', 'options' => $orderStatuses, 'value' => $order->order_status_id ?? old('order_status_id'), 'required' => true])

                @include('partials.input', ['name' => 'contract_date', 'title' => 'Дата договора', 'type' => 'date', 'value' => $order->contract_date ?? old('contract_date')])

                @include('partials.input', ['name' => 'contract_number', 'title' => 'Номер договора', 'value' => $order->contract_number ?? old('contract_number')])

                @include('partials.textarea', ['name' => 'comment', 'title' => 'Комментарий', 'value' => $order->comment ?? old('comment')])

                @include('partials.input', ['name' => 'installation_date', 'title' => 'Дата выхода на монтаж', 'type' => 'date', 'value' => $order->installation_date ?? old('installation_date')])

                @include('partials.select', ['name' => 'brigadier_id', 'title' => 'Бригадир', 'options' => $brigadiers, 'value' => $order->brigadier_id ?? old('brigadier_id')])

                @include('partials.select', ['name' => 'user_id', 'title' => 'Менеджер', 'options' => $users, 'value' => $order->user_id ?? old('user_id') ?? auth()->user()->id])

                @include('partials.input', ['name' => 'tg_group_name', 'title' => 'Название группы в ТГ', 'value' => $order->tg_group_name ?? old('tg_group_name')])

                @include('partials.input', ['name' => 'tg_group_link', 'title' => 'Ссылка на группу в ТГ', 'value' => $order->tg_group_link ?? old('tg_group_link')])

            </div>
            <div class="col-xxl-6">
                <h4>МАФ</h4>
                <div>
                    <input type="text" class="form-control mb-2" placeholder="Поиск номенклатуры" id="search_maf">
                    <select id="select_maf" class="form-select mb-3" multiple></select>
                </div>

                <div id="selected_maf">
                    @isset($order)
                        <div class="changes-message small text-warning visually-hidden">* необходимо сохранить изменения</div>
                    @endisset
                    @if(isset($order) && $order->products)
                        @foreach($order->products as $p)
                            <div class="maf d-flex justify-content-between mb-1">
                                <div>
                                    <input type="hidden" class="visually-hidden" name="products[]" value="{{ $p->id }}">
                                    <div class="p-1">{!! $p->common_name !!}</div>
                                </div>
                                <div class="col-1 d-flex justify-content-end">
                                    <div>
                                        <input class="form-control text-end form-control-sm quantity" type="number" name="quantity[]" value="{{ $p->pivot->quantity }}">
                                    </div>
                                    <div class="p-1">
                                        <i onclick="$(this).parent().remove(); $('.changes-message').removeClass('visually-hidden');" class="bi bi-trash text-danger cursor-pointer"></i>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    @endif
                </div>

            </div>
            <div class="col-12 text-end">
                @include('partials.submit')
            </div>
        </form>

    </div>

    @if($errors->any())
        @dump($errors->all())
    @endif

@endsection

@push('scripts')
    <script type="module">

        let selectMaf = $('#select_maf');
        $('#search_maf').on('keyup', function () {
            // search products on backend
            $.get('{{ route('product.search') }}?s=' + $(this).val(),
                function (data) {
                    selectMaf.children().remove()
                    $.each(data, function (id, name) {
                        selectMaf.append('<option value=\'' + id + '\'>' + name + '</option>');
                    });
                }
            );
        });

        selectMaf.on('change', function () {
            $('#selected_maf').append(
                '<div class="maf  d-flex justify-content-between mb-1">' +
                    '<div>' +
                        '<input type="hidden" name="products[]" value="'+ $(this).val() +'">' +
                        '<div class="p-1">'+ $('#select_maf option:selected').text() +'</div> ' +
                    '</div>' +
                '<div class="col-1 d-flex justify-content-end">' +
                    '<div>' +
                        '<input class="form-control text-end form-control-sm quantity" type="number" name="quantity[]" value="1">' +
                    '</div>' +
                    '<div class="p-1">' +
                        '<i onclick="$(this).parent().remove();" class="bi bi-trash text-danger cursor-pointer"></i>' +
                    '</div>' +
                '</div>'
            );
            $('#select_maf').children().remove();
            $('#search_maf').val('');
            $('.changes-message').removeClass('visually-hidden');
        });

        $('#district_id').on('change', function () {
            // load areas of selected district
            console.log($(this).val());

            $.get('{{ route('area.ajax-get-areas-by-district') }}/' + $(this).val(),
                function (data) {
                    $('#area_id').children().remove();
                    $.each(data, function (id, name) {
                        $('#area_id').append('<option value=\'' + id + '\'>' + name + '</option>');
                    });
                }
            );
        });

    </script>

@endpush