{{-- resources/views/menus/edit.blade.php --}}

@extends('layouts.admin')

@section('content')
<div class="row justify-content-center">
    <div class="col-lg-8">
        <div class="card shadow mb-4">

            <div class="card-header py-3 d-flex justify-content-between align-items-center">

                <h6 class="m-0 font-weight-bold text-primary">
                    Editar Menu
                </h6>

                <a href="{{ route('menus.index') }}"
                   class="btn btn-sm btn-secondary shadow-sm">

                    <i class="fas fa-arrow-left fa-sm"></i> Voltar

                </a>

            </div>

            <div class="card-body">

                <form action="{{ route('menus.update', $menu->id) }}"
                      method="POST"
                      enctype="multipart/form-data">

                    @csrf
                    @method('PUT')

                    <div class="form-group mb-3">
                        <label for="menu_pai_id" class="font-weight-bold text-gray-800">Menu Pai (Hierarquia)</label>
                        <select class="form-control" id="menu_pai_id" name="menu_pai_id">
                            <option value="">Nenhum (Tornar um Menu Principal)</option>
                            @foreach($menusPais as $pai)
                                <option value="{{ $pai->id }}" {{ $menu->menu_pai_id == $pai->id ? 'selected' : '' }}>
                                    {{ $pai->menu_titulo }}
                                </option>
                            @endforeach
                        </select>
                        <small class="text-muted">Selecione um item caso queira que este menu vire um submenu.</small>
                    </div>

                    {{-- TÍTULO --}}
                    <div class="form-group">

                        <label for="menu_titulo"
                               class="font-weight-bold text-gray-800">

                            Título

                        </label>

                        <input type="text"
                               name="menu_titulo"
                               id="menu_titulo"
                               class="form-control @error('menu_titulo') is-invalid @enderror"
                               value="{{ old('menu_titulo', $menu->menu_titulo) }}"
                               required>

                        @error('menu_titulo')

                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- DESCRIÇÃO --}}
                    <div class="form-group">

                        <label for="menu_descricao"
                               class="font-weight-bold text-gray-800">

                            Descrição

                        </label>

                        <input type="text"
                               name="menu_descricao"
                               id="menu_descricao"
                               class="form-control @error('menu_descricao') is-invalid @enderror"
                               value="{{ old('menu_descricao', $menu->menu_descricao) }}">

                        @error('menu_descricao')

                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- IMAGEM --}}
                    <div class="form-group">

                        <label for="menu_path"
                               class="font-weight-bold text-gray-800">

                            Imagem de Capa

                        </label>

                        @if($menu->menu_path)

                            <div class="mb-3">

                                <img src="{{ asset('storage/' . $menu->menu_path) }}"
                                     class="img-fluid rounded shadow"
                                     style="max-height: 200px;">

                            </div>

                        @endif

                        <input type="file"
                               name="menu_path"
                               id="menu_path"
                               class="form-control-file @error('menu_path') is-invalid @enderror">

                        @error('menu_path')

                            <div class="invalid-feedback d-block">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- TEXTO --}}
                    <div class="form-group">

                        <label for="menu_texto"
                               class="font-weight-bold text-gray-800">

                            Conteúdo

                        </label>

                        <textarea name="menu_texto"
                                  id="menu_texto"
                                  rows="10"
                                  class="form-control @error('menu_texto') is-invalid @enderror">{{ old('menu_texto', $menu->menu_texto) }}</textarea>

                        @error('menu_texto')

                            <div class="invalid-feedback d-block">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- URL --}}
                    <div class="form-group">

                        <label for="menu_url"
                               class="font-weight-bold text-gray-800">

                            URL
  <p><b><mark> ATENÇÃO: A criação de menu para conter a listagem de CURSOS, deve ter a url informada exatamente dessa forma: ' /cursos-lista '<br>
                    A criação de menu para PERGUNTAS FREQUENTES, deve ter a url informada exatamente dessa forma ' /faq ' </b></mark>
                    <p> Trata-se de duas páginas com layout especial, por isso deve-se ter este cuidado apenas para essas duas páginas, as demais serão formadas com a URL amigável escolhida pelo usuário que as cadastra.<br><br>

                        </label>

                        <input type="text"
                               name="menu_url"
                               id="menu_url"
                               class="form-control @error('menu_url') is-invalid @enderror"
                               value="{{ old('menu_url', $menu->menu_url) }}"
                               >

                        @error('menu_url')

                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- ORDEM DE EXIBIÇÃO --}}
<div class="form-group">

    <label for="menu_ordem"
           class="font-weight-bold text-gray-800">

        Ordem de Exibição

    </label>

    <input type="number"
           name="menu_ordem"
           id="menu_ordem"
           class="form-control @error('menu_ordem') is-invalid @enderror"
           value="{{ old('menu_ordem', $menu->menu_ordem) }}"
           min="0">

    <small class="text-muted">
        Menor número aparece primeiro.
    </small>

    @error('menu_ordem')

        <div class="invalid-feedback">
            {{ $message }}
        </div>

    @enderror

</div>

                    {{-- STATUS --}}
                    <div class="form-group mt-4">

                        <div class="custom-control custom-switch">

                            <input type="checkbox"
                                   class="custom-control-input"
                                   id="menu_pub"
                                   name="menu_pub"
                                   value="1"
                                   {{ old('menu_pub', $menu->menu_pub) ? 'checked' : '' }}>

                            <label class="custom-control-label"
                                   for="menu_pub">

                                Ativo

                            </label>

                        </div>

                    </div>

                    <hr class="my-4">

                    <div class="text-right">

                        <button type="submit"
                                class="btn btn-info btn-icon-split shadow-sm">

                            <span class="icon text-white-50">
                                <i class="fas fa-sync-alt"></i>
                            </span>

                            <span class="text">
                                Atualizar Menu
                            </span>

                        </button>

                    </div>

                </form>

            </div>

        </div>
    </div>
</div>
@endsection

@section('scripts')

<script src="https://cdn.ckeditor.com/ckeditor5/39.0.1/classic/ckeditor.js"></script>

<script>

ClassicEditor
    .create(document.querySelector('#menu_texto'))
    .catch(error => {
        console.error(error);
    });

</script>

@endsection