@extends('site.layouts.blogAutre')

@section('title', 'Création d\'un article')

@push('css')
    <script src="{{ asset('tinymce/tinymce.min.js') }}"></script>
    <link rel="stylesheet" type="text/css" href="{{ asset('site/plugins/select2/select2.bundle.css') }}"/>
    {{-- <script src="https://cdn.tiny.cloud/1/k1jgrbfp77evzko5f8ijlb400ywfegtx265sx7si25wra9pg/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script> --}}
@endpush

@section('content')
@include('site.includes.public.headerMenuBlog')

<!-- PAGE TITLE
        ================================================== -->
<section class="page-title-section bg-img cover-background primary-overlay" data-overlay-dark="6" data-background="{{ asset('site/img/bg/apa.jpg') }}">
    <div class="row position-relative z-index-1">
        <div class="col-md-12">
            <div class="faded-text">
                <div class="f-text"><span class="main-font">APA-RDC</span></div>
            </div>
            <h1>Actualités</h1>
            <ul class="breadcrumb">
                <li><a href="{{ url('/') }}">Accueil</a></li>
                <li><a href="#!" style="color:#ffff00">Actualités</a></li>
                @auth
                        @can('Liste des articles')
                            <div class="bd-example">
                                <a href="{{ route('articles.index') }}" class="butn white m-1">
                                    <i class="ti-arrow-left icon-arrow before white"></i>
                                    <span class="label">Tous les Articles</span>
                                    <i class="ti-arrow-right icon-arrow after"></i>
                                </a>
                            </div>
                        @endcan
                 @endauth
            </ul>
        </div>
    </div>
</section>

<section>
    <div class="container">
        @if ($message = Session::get('success'))
        <div class="section-heading5">
            <div class="alert alert-success alert-block">
                <button type="button" class="close" data-dismiss="alert">×</button>
                <strong>{{ $message }}</strong>
            </div>
        </div>
        @endif

        @if (count($errors) > 0)
        <div class="section-heading5">
            <div class="alert alert-danger text-left">
                <strong>Oups!</strong> Il y a eu des problèmes avec votre entrée.
                <ul class="list-style2 mb-0 text-left">
                    @foreach ($errors->all() as $error)
                    <li class="text-left">{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        </div>
        @endif


        <div class="row">
            <!-- blog-list left -->
            <div class="col-lg-12">
                <div class="p-1-6 p-md-1-9 p-lg-2-5 box-shadows">
                    <h2 class="text-bold mb-3 text-primary">Création d'un article</h2>
                    <p class="mb-4 w-lg-90">Veuillez remplir les champs obligatoires du formulaire pour publier un
                        document</p>

                    <div class="container-fluid">
                        <!-- Vertical Layout | With Floating Label -->
                        <form action="{{ route('articles.store') }}" method="POST" enctype="multipart/form-data">
                            @csrf
                            <div class="row clearfix">
                                <div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
                                    <div class="card">
                                        <div class="body">
                                            <div class="form-group form-float">
                                                <div class="form-line">
                                                    <h5>
                                                        <strong>Titre</strong>
                                                    </h5>
                                                    <input type="text" id="title" class="form-control @error('title') is-invalid @enderror" name="title" value="{{ old('title') }}" required>

                                                    @error('title')
                                                        <div class="invalid-feedback">
                                                            {{ $message }}
                                                        </div>
                                                    @enderror
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <h5>
                                                    <strong>Image mise en avant</strong>
                                                </h5>
                                                <input type="file" class="form-control @error('image') is-invalid @enderror" name="image" value="{{ old('image') }}" required>

                                                @error('image')
                                                        <div class="invalid-feedback">
                                                            {{ $message }}
                                                        </div>
                                                    @enderror
                                            </div>

                                            <div class="form-group">
                                                <h5>
                                                    <strong>Statut</strong>
                                                </h5>
                                                <input type="checkbox" id="publish" class="filled-in @error('status') is-invalid @enderror" name="status"
                                                    value="1">

                                                    @error('status')
                                                        <div class="invalid-feedback">
                                                            {{ $message }}
                                                        </div>
                                                    @enderror
                                            </div>

                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
                                    <div class="card">
                                        <div class="header">
                                            <h5>
                                                <strong>Catégories et Tags</strong>
                                            </h5>
                                        </div>
                                        <div class="body">
                                            <div class="form-group form-float">
                                                <div
                                                    class="form-line {{ $errors->has('categories') ? 'focused error' : '' }}">
                                                    <h6>
                                                        <strong>Catégorie</strong>
                                                    </h6>
                                                    <select name="categories[]" id="categories"
                                                        class="select2 form-control show-tick" data-live-search="true"
                                                        multiple required>
                                                        <option value="">-- Chosir une ou plusieurs catégorie --</option>
                                                        @foreach($categories as $category)
                                                        @if (old('categorie_id') == $category->id)
                                                                <option value="{{ $category->id }}" selected>
                                                                    {{ $category->name }}</option>
                                                            @else
                                                                <option value="{{ $category->id }}">
                                                                    {{ $category->name }}</option>
                                                            @endif

                                                        @endforeach
                                                    </select>
                                                    @error('categories')
                                                        <div class="invalid-feedback">
                                                            {{ $message }}
                                                        </div>
                                                    @enderror
                                                </div>
                                            </div>

                                            <div class="form-group form-float">
                                                <div
                                                    class="form-line {{ $errors->has('tags') ? 'focused error' : '' }}">
                                                    <h6>
                                                        <strong>Tags</strong>
                                                    </h6>
                                                    <select name="tags[]" id="tag"
                                                        class="select2 form-control show-tick" data-live-search="true"
                                                        multiple id="multiple-basic" required>
                                                        <option value="">-- Chosir un ou plusieurs tag --</option>
                                                        @foreach($tags as $tag)
                                                        <option value="{{ $tag->id }}">{{ $tag->name }}</option>
                                                        @endforeach
                                                    </select>
                                                    @error('tag')
                                                        <div class="invalid-feedback">
                                                            {{ $message }}
                                                        </div>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row clearfix">
                                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                    <div class="card">
                                        <div class="header">
                                            <h5>
                                                <strong>Contenu de l'article</strong>
                                            </h5>
                                        </div>
                                        <div class="body">
                                            <textarea class="form-control" id="tinymce" name="body" rows="10">{{ old('body') }}</textarea>

                                            {{-- <textarea class="form-control" id="content" name="content" rows="10"></textarea> --}}
                                            {{-- <textarea class="tinymce-editor" id="tinymce" name="body" required rows="10">{{ old('body') }}</textarea> --}}
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-3">
                                    @auth
                                    @if (Auth::user()->role_id == 1)
                                    <div class="quform-submit-inner text-center">
                                        <a href="{{ route('articles.index') }}" class="butn white m-1">
                                            <i class="ti-arrow-left icon-arrow before white"></i>
                                            <span class="label">Liste des articles</span>
                                            <i class="ti-arrow-left icon-arrow after"></i>
                                        </a>
                                    </div>
                                    @endif
                                    @endauth
                                </div>
                                <div class="col-6"></div>
                                <div class="col-md-3">
                                    <div class="quform-submit-inner text-center">
                                        <button class="butn lg w-100" type="submit">
                                            <span>Enregistrer</span>
                                        </button>
                                    </div>
                                    {{-- <div class="quform-loading-wrap">
                                        <span class="quform-loading"></span>
                                    </div> --}}
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <!-- end blog-list left -->
    </div>
</section>





@endsection

@section('scripts')
{{-- <script src="{{ asset('js/app.js') }}"></script> --}}
<!-- jQuery -->
<script src="{{ asset('site/js/jquery.min.js') }}"></script>

<!-- popper js -->
<script src="{{ asset('site/js/popper.min.js') }}"></script>

<!-- bootstrap -->
<script src="{{ asset('site/js/bootstrap.min.js') }}"></script>

<!-- jquery -->
<script src="{{ asset('site/js/core.min.js') }}"></script>

<!-- search -->
<script src="{{ asset('site/search/search.js') }}"></script>

<!-- custom scripts -->
<script src="{{ asset('site/js/main.js') }}"></script>

<!-- all js include end -->
<script src="{{ asset('site/plugins/select2/select2.bundle.js') }}"></script>
{{-- <script src="{{ asset('site/plugins/tinymce.min.js') }}"></script> --}}
    {{-- <script src="https://cdn.tiny.cloud/1/k1jgrbfp77evzko5f8ijlb400ywfegtx265sx7si25wra9pg/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script> --}}

    {{-- <script type="text/javascript">
        tinymce.init({
                        selector: 'textarea.tinymce-editor',
                        height: 300,
                        menubar: false,
                        plugins: [
                            'advlist autolink lists link image charmap print preview anchor',
                            'searchreplace visualblocks code fullscreen',
                            'insertdatetime media table paste code help wordcount', 'image'
                        ],
                        toolbar: 'undo redo | formatselect | ' +
                            'bold italic backcolor | alignleft aligncenter ' +
                            'alignright alignjustify | bullist numlist outdent indent | ' +
                            'removeformat | help',
                        content_css: '//www.tiny.cloud/css/codepen.min.css'
                    });
    </script> --}}
    <script>
        $(document).ready(function(){
            $(function(){
                $('.select2').select2();
            });
        });

        document.addEventListener('DOMContentLoaded', function() {
        tinymce.init({
            selector: 'textarea',
            // plugins: 'link autolink lists autoresize',
            // toolbar: 'undo redo | bold italic underline | link | numlist bullist',
            // menubar: false,
            // branding: false

            selector: 'textarea.tinymce-editor',
                        height: 300,
                        menubar: false,
                        plugins: [
                            'advlist autolink lists link image charmap print preview anchor',
                            'searchreplace visualblocks code fullscreen',
                            'insertdatetime media table paste code help wordcount', 'image'
                        ],
                        toolbar: 'undo redo | formatselect | ' +
                            'bold italic backcolor | alignleft aligncenter ' +
                            'alignright alignjustify | bullist numlist outdent indent | ' +
                            'removeformat | help',
                            branding: false
        });
        });

        document.querySelector('form').addEventListener('submit', function (event) {
            event.preventDefault();

            // Vérifiez si le contenu de l'éditeur TinyMCE est vide
            if (tinymce.get('body').getContent().trim() === '') {
                alert('Le champ corps du texte est requis.');
                return false;
            }

            // Soumettre le formulaire
            this.submit();
        });
    </script>
    <script src="{{ asset('tinymce/tinymce.min.js') }}"></script>
    <script src="{{ asset('js/tinymce-config.js') }}"></script>
@endsection