@extends('layouts.backend')

@section('content')
<form action="{{route('bo.seo_data.update', $SeoDatum->page)}}" method="POST" enctype="multipart/form-data">
    @method('PUT')
    @csrf
    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
        <h1 class="h2"><a href="{{route('bo.home')}}" class="h2 text-decoration-none">
            < </a> {{ __('Paramètres SEO')."-".$SeoDatum->page->label}} <small class="text-muted">{{ __('Edition') }}</small></h1>
        <div class="btn-toolbar mb-2 mb-md-0">
            <button type="submit" class="btn btn-sm btn-primary">{{ __('Enregistrer') }}</a>
        </div>
    </div>
    <div class="form-group">
        <label for="title">{{ __('Titre') }} *</label>
        <input type="text" id="title" name="title" class="form-control" placeholder="{{ __('Titre') }} *" value="{{ old('title', $SeoDatum->title ?? '') }}" required>
        @include('back.modules.input-error', ['inputName'=>'title'])
    </div>
    <div class="form-group">
        <label for="description">{{ __('Description') }} *</label>
        <input type="text" id="description" name="description" class="form-control" placeholder="{{ __('Description') }} *" value="{{ old('description', $SeoDatum->description ?? '') }}" required>
        @include('back.modules.input-error', ['inputName'=>'description'])
    </div>
    <div class="form-group">
        <label for="keywords">{{ __('Mots Clés') }} *</label>
        <input type="text" id="keywords" name="keywords" class="form-control" placeholder="{{ __('Mots Clés') }} *" value="{{ old('keywords', $SeoDatum->keywords ?? '') }}" required>
        @include('back.modules.input-error', ['inputName'=>'keywords'])
    </div>
</form>
@endsection

@push('scripts')
<script type="text/javascript">
    var editorConfig = {
        removePlugins: ["Image", "ImageCaption", "ImageStyle", "ImageToolbar", "ImageUpload"],
        toolbar: ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList', '|', 'blockQuote', 'insertTable', '|', 'undo', 'redo'],
        heading: {
            options: [{
                    model: 'paragraph',
                    title: 'Paragraph',
                    class: 'ck-heading_paragraph'
                },
                {
                    model: 'heading1',
                    view: 'h1',
                    title: 'Heading 1',
                    class: 'ck-heading_heading1'
                },
                {
                    model: 'heading2',
                    view: 'h2',
                    title: 'Heading 2',
                    class: 'ck-heading_heading2'
                },
                {
                    model: 'heading3',
                    view: 'h3',
                    title: 'Heading 3',
                    class: 'ck-heading_heading3'
                },
                {
                    model: 'heading4',
                    view: 'h4',
                    title: 'Heading 4',
                    class: 'ck-heading_heading4'
                }
            ]
        },
        table: {
            contentToolbar: ['tableColumn', 'tableRow', 'mergeTableCells']
        }
    };
    ClassicEditor
        .create(document.querySelector('#text'), editorConfig)
        .catch(error => {
            console.error(error);
        });
</script>
@endpush