@extends('layouts.admin', ['title' => 'Кейсы'])

@section('content')
    <div class="content__wrapper content__wrapper--editor">
        @if($errors->any())
            <div class="alert alert-danger">
                <ul>
                    @foreach($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif
        <div class="block">
            <form class="block__wrapper block__wrapper--big" action="{{$page->exists ? route('admin.pages.update', ['page' => $page->id]) : route('admin.pages.store')}}"  method="post">
                @csrf
                @if($page->exists)
                    @method('PUT')
                @endif
                <a href="#" class="content__back text text--small text--medium text--grey--lighter">Вернуться
                    назад</a>
                <div class="block__wrapper">
                    <div class="block__item block js-editor editor active">
                        <div class="card">
                            <div class="card__wrapper card__wrapper--radius--small card__wrapper--big block__wrapper">
                                <div class="block__header block__header--gap--big js-editor-link editor-block__link">
                                    <p class="text text--base text--grey">Основное</p>
                                </div>
                                <div class="block__content js-editor-block editor-block__content editor-block__content--small">
                                    <div class="card__column card__column--big">
                                        <input type="text" name="name" id="" class="input input--font--medium input--light" placeholder="Название">
                                        @error('name')
                                            <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                        <div class="input input--font--medium input--light card__wrapper card__wrapper--link card__wrapper--radius--small">
                                            <input type="text" name="link" id="" placeholder="link">
                                        </div>
                                        @error('link')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="block__item block js-editor editor active">
                        <div class="card">
                            <div class="card__wrapper card__wrapper--radius--small card__wrapper--big block__wrapper">
                                <div class="block__header block__header--gap--big js-editor-link editor-block__link">
                                    <p class="text text--base text--grey">SEO</p>
                                </div>
                                <div class="block__content js-editor-block editor-block__content editor-block__content--small">
                                    <div class="card__column card__column--big">
                                        <input type="text" name="head_title" id="" class="input input--font--medium input--light" placeholder="Заголовок страницы">
                                        @error('head_title')
                                            <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                        <input type="text" name="head_description" id="" class="input input--font--medium input--light" placeholder="МЕТА описание">
                                        @error('head_description')
                                            <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="block__item block js-editor editor active">
                        <div class="card">
                            <div class="card__wrapper card__wrapper--radius--small card__wrapper--big block__wrapper">
                                <div class="block__header block__header--gap--big js-editor-link editor-block__link">
                                    <p class="text text--base text--grey">Код</p>
                                </div>
                                <div class="block__content js-editor-block editor-block__content editor-block__content--small">
                                    <div class="card__column card__column--big">
                                        <textarea name="code_after_head" id="" placeholder="Перед </head>" class="input input--font--medium input--light input--textarea--big"></textarea>
                                        @error('code_after_head')
                                            <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                        <textarea name="code_after_body" id="" placeholder="Перед </body>" class="input input--font--medium input--light input--textarea--big"></textarea>
                                        @error('code_after_body')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="block__item block js-editor editor active">
                        <div class="card">
                            <div class="card__wrapper card__wrapper--radius--small card__wrapper--big block__wrapper">
                                <div class="block__header block__header--gap--big js-editor-link editor-block__link">
                                    <p class="text text--base text--grey">Файлы</p>
                                </div>
                                <div class="block__content js-editor-block editor-block__content editor-block__content--small">
                                    <div class="editor__row js-file empty">
                                        <input type="file" class="js-file-input" name="" id="page-file">
                                        <input type="hidden" class="js-file-input" name="archive">
                                        <div class="editor__item">
                                            <div
                                                class="button button--full button--editor button--bordered button--bordered--light js-file-label">
                                                загрузите файл
                                            </div>
                                        </div>
                                        <div class="editor__item">
                                            <button type="reset"
                                                    class="button button--full button--editor button--editor--red js-file-reset">
                                                Удалить
                                            </button>
                                        </div>
                                        <div class="editor__item">
                                            <a href="#"
                                               class="button button--full button--editor button--bordered button--bordered--blue js-file-download">
                                                Скачать
                                            </a>
                                        </div>
                                        <div class="editor__item">
                                            <label for="page-file"
                                                   class="button button--full button--editor button--bordered button--bordered--blue">
                                                Загрузить
                                            </label>
                                        </div>
                                        @error('code_after_body')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
                <div class="block__item">
                    <div class="editor__row">
                        <div class="editor__item">
                            <div class="card">
                                <div class="card__wrapper card__wrapper--center card__wrapper--big card__wrapper--radius--small">
                                    <p class="editor__status text text--base text--grey">Опубликовано</p>
                                </div>
                            </div>
                        </div>
                        <div class="editor__item">
                            <div class="card">
                                <a href="#" class="card__wrapper card__wrapper--center card__wrapper--big card__wrapper--radius--small">
                                    <p class="editor__view text text--base text--grey">Предпросмотр</p>
                                </a>
                            </div>
                        </div>
                        <div class="select custom-select">
                            <select class="select__tag" name="" id="">
                                <option value="">Опубликовать</option>
                                <option value="">Сохранить черновик</option>
                            </select>
                        </div>
                        <input type="submit" class="button button--editor button--full button--editor--green" value="Выполнить действие">
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('scripts')
    <script>
        window.addEventListener("load", (event) => {
            AdminAPI.platforms.list((response) => {
                response.platforms.forEach(({id, name, logo}) => {
                    const option = document.createElement('option');
                    option.value = id;
                    option.innerText = name;
                    document.querySelector('#tags').appendChild(option);
                })
            });
        });
    </script>
@endsection