@extends('layouts.dashboard.app')
@section('title', 'Blogs | Chemical Wholesale')
@section('content')
    <div class="cw-content">
        <div class="container-fluid">
            <div class="cw-content-inner">
                <div class="cw-content-body">
                    <div class="cw-block-head cw-block-head-sm">
                        <div class="cw-block-between d-flex justify-content-between align-items-center">
                            <div class="cw-block-head-content">
                                <h3 class="cw-block-title page-title">Blog: {{ @$blog['name'] }}</h3>
                                <div class="cw-block-des text-soft mt-2">
                                    <p>blogs/{{ @$blog['slug'] }}
                                        @if (@$blog->status == 1)
                                            <span class="badge bg-success">
                                                Published
                                            </span>
                                        @else
                                            <span class="badge bg-danger">
                                                Unpublished
                                            </span>
                                        @endif
                                    </p>
                                </div>
                            </div>
                            <div>
                            </div>
                        </div>
                    </div>

                    <div class="card add-product">
                        <div class="card-body px-3">
                            <form action="{{ route('admin.blogs.update', $blog->uuid) }}" method="post"
                                enctype="multipart/form-data">
                                @csrf
                                <div class="row">
                                    <div class="col-lg-8">
                                        <div class="row">
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Blog Title</label>
                                                <input type="text" class="form-control" placeholder="Blog Title"
                                                    id="name" name="name" value="{{ ucfirst(@$blog['name']) }}" autofocus required>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Slug</label>
                                                <input type="text" class="form-control" id="slug" name="slug"
                                                    value="{{ @$blog['slug'] }}" readonly disabled>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Author</label>
                                                <input type="text" class="form-control" id="slug" name="slug"
                                                    value="{{ @$blog['getAuthor']['first_name'] }} {{ @$blog['getAuthor']['last_name'] }}"
                                                    required disabled>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Date</label>
                                                <input type="date" class="form-control" id="date" name="date"
                                                    value="{{ @$blog['date'] }}" required>
                                            </div>
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Short Description</label>
                                                <input type="text" class="form-control" id="short_description"
                                                    name="short_description" value="{{ @$blog['short_description'] }}"
                                                    placeholder="Short Description" required>
                                            </div>
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Content</label>
                                                <textarea class="form-control" name="content" id="content" cols="30" rows="10">{{ @$blog['content'] }}</textarea>
                                            </div>
                                            <div class="col-lg-6 mb-3">
                                                <label class="form-label">Status</label>
                                                <select name="status" id="status" class="form-control form-select">
                                                    <option value="0" {{ @$blog['status'] == 0 ? 'selected' : '' }}>
                                                        Unpublish</option>
                                                    <option value="1" {{ @$blog['status'] == 1 ? 'selected' : '' }}>
                                                        Publish</option>
                                                </select>
                                            </div>

                                        </div>

                                    </div>
                                    <div class="col-lg-4">
                                        <div class="row">
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Upload Your Blog Image</label>
                                                <div class="imgpreview-container">
                                                    <img src="/{{ @$blog['image'] }}" data-path="{{ @$blog['image'] }}"
                                                        alt="image" id="logoprev" class="imgpreview-img"
                                                        onerror="src='/assets/img/noimg.jpg'">
                                                </div>
                                                <input type="file" name="image" id="image"
                                                    class="form-control logo" data-prvid="logoprev"
                                                    onchange="readURL(this);" accept="image/jpeg, image/png">
                                                <span class="upload-file-msg">Recommended size: 1080x600 | Supported File types - PNG, JPG</span>
                                            </div>
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Image Title</label>
                                                <input type="text" class="form-control" id="image_alt" name="image_alt"
                                                    value="{{ @$blog['image_alt'] }}" placeholder="Blog Image title">
                                            </div>
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Meta Title</label>
                                                <input type="text" class="form-control" id="meta_title"
                                                    name="meta_title" value="{{ @$blog['meta_title'] }}"
                                                    placeholder="Meta title">
                                            </div>
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Meta Description</label>
                                                <input type="text" class="form-control" id="meta_description"
                                                    name="meta_description" value="{{ @$blog['meta_description'] }}"
                                                    placeholder="Meta Description">
                                            </div>
                                            <div class="col-lg-12 mb-3">
                                                <label class="form-label">Meta Keywords</label>
                                                <input type="text" class="form-control" id="meta_key"
                                                    name="meta_key" value="{{ @$blog['meta_key'] }}"
                                                    placeholder="Meta Keywords">
                                            </div>

                                        </div>
                                    </div>

                                    <div class="col-lg-12">
                                        <button type="submit" class="btn-formpage-submit">Save</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>

                </div>

            </div>
        </div>
    </div>

    @include('layouts.dashboard.flash')
@endsection
@push('css')
    <link href="https://cdn.jsdelivr.net/npm/summernote@0.9.0/dist/summernote.min.css" rel="stylesheet">
    <style>
        .note-editor.note-airframe.fullscreen,
        .note-editor.note-frame.fullscreen {
            z-index: 1067;
            background: #fff;
        }
    </style>
@endpush
@push('js')
    <script src="{{ asset('assets/dashboard/js/lib/summernote.min.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('#content').summernote({
                height: 400
            });
            var noteBar = $('.note-toolbar');
            noteBar.find('[data-toggle]').each(function() {
                $(this).attr('data-bs-toggle', $(this).attr('data-toggle')).removeAttr('data-toggle');
            });
        });
    </script>
    <script>
        $('form').submit(function(e) {
            var submitBtn = $(this).find('button[type="submit"]');
            submitBtn.html('<span class="spinner me-2"></span>Saving');
            setTimeout(function() {
                submitBtn.removeAttr('disabled');
                submitBtn.html('Save');
            }, 1000);
        });
    </script>
    <script>
        $(document).ready(function () {
            var autofocusElement = $('input[autofocus]').filter(function () {
            return $(this).val().length > 0;
            }).first();

            if (autofocusElement.length) {
            var autofocuslength = autofocusElement.val().length;
            autofocusElement[0].setSelectionRange(autofocuslength, autofocuslength);
            autofocusElement.focus();
            }
        });
    </script>
@endpush