@extends('admin.layouts.master')

@section('title')
    Edit Product's Category
@endsection

@section('content')

<div class="container">

    <div class="text-center mb-5">
        <h2>
            <u>Product's Category Edit</u>
        </h2>
    </div>

    <form method="POST" action="{{ route('admin.category.update', $category->id) }}">
        @csrf
        @method('PUT')

        <div class="row justify-content-center">
            <div class="col-4">
                <div class="form-group">
                    <label for="name">Name @php renderFlag('sr') @endphp</label>
                    <input name="name_sr" type="text" class="form-control" value="{{ old('name_sr') ?: $category->name_sr }}">
                </div>
            </div>
            <div class="col-4">
                <div class="form-group">
                    <label for="name">Name @php renderFlag('en') @endphp</label>
                    <input name="name_en" type="text" class="form-control" value="{{ old('name_en') ?: $category->name_en }}">
                </div>
            </div>
        </div>

        <div class="row justify-content-center">
            <div class="col-4">
                <div class="form-group">
                    <label for="is_main_cat">Main</label>
                    <select name="is_main_cat" id="is_main_cat" class="form-control">
                        <option value="1"
                            {{ old('is_main_cat') === '1' ? 'selected' : ($category->isMainCat() ? 'selected' : '') }}
                        >
                            Yes
                        </option>
                        @if (count($main))
                            <option value="0"
                                {{ old('is_main_cat') === '0' ? 'selected' : (!$category->isMainCat() ? 'selected' : '') }}
                            >
                                No
                            </option>
                        @endif
                    </select>
                </div>
            </div>
            <div class="col-4" id="main_cat_div" hidden>
                <div class="form-group">
                    <label for="parent_id">Main Category</label>
                    <select name="parent_id" id="main_cat" class="form-control">
                        @foreach ($main as $mainCat)
                            <option
                                value="{{ $mainCat->id }}"
                                {{ old('parent_id') ?
                                    (old('parent_id') == $mainCat->id ? 'selected' : '') :
                                    ($category->isMainCat() ? '' : ($mainCat->id == $category->parent->id ? 'selected' : ''))
                                }}
                            >
                                {{ $mainCat->name_sr }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>

        <div class="row justify-content-center">
            <div class="col-4">
                @include('errors')
            </div>
        </div>

        <div class="row justify-content-center">
            <button type="submit" class="btn btn-primary">Save changes</button>
        </div>
    </form>

</div>

@endsection

@section('scripts')
    <script>
        $(document).ready(function () {
            let target = $('#is_main_cat');

            target.on('change', function () {
                let value = parseInt( $(this).val() ) ? true : false;

                $('#main_cat_div').prop('hidden', value);
            });

            target.trigger('change');
        });
    </script>
@endsection