@extends('backend.layout.layouts')

@section('content')
    <div class="container mx-auto">
        <div class="container">
            <div class="flex justify-between my-10">
                <h2 class="text-2xl ">Add Blogs</h2>

            </div>






            <form id="addBlogForm" action="{{ route('cms_blogs.update', $blog->id) }}" method="POST"
                enctype="multipart/form-data" class="p-4">
                @csrf
                @method('PUT')
                <div class="mb-4 space-y-4">
                    <!-- Category Field -->
                    <div class="form-group">
                        <label for="category" class="block text-sm font-medium text-gray-700">Category</label>
                        <select id="category" name="category"
                            class="block w-full px-3 py-2 mt-1 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm @error('category') border-red-500 @enderror"
                            required>
                            <option value="" disabled {{ old('category', $blog->category) === '' ? 'selected' : '' }}>
                                Select a category
                            </option>
                            <option value="All Products"
                                {{ old('category', $blog->category) === 'All Products' ? 'selected' : '' }}>
                                All Products
                            </option>
                            <option value="Beauty" {{ old('category', $blog->category) === 'Beauty' ? 'selected' : '' }}>
                                Beauty
                            </option>
                            <option value="Family Care"
                                {{ old('category', $blog->category) === 'Family Care' ? 'selected' : '' }}>
                                Family Care
                            </option>
                            <option value="Home Care"
                                {{ old('category', $blog->category) === 'Home Care' ? 'selected' : '' }}>
                                Home Care
                            </option>
                            <option value="Health & Wellness"
                                {{ old('category', $blog->category) === 'Health & Wellness' ? 'selected' : '' }}>
                                Health &
                                Wellness
                            </option>
                        </select>
                        @error('category')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <!-- Title Field -->
                    <div class="form-group">
                        <label for="title" class="block text-sm font-medium text-gray-700">Title</label>
                        <input type="text" id="title" name="title"
                            class="block w-full px-3 py-2 mt-1 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm @error('title') border-red-500 @enderror"
                            value="{{ old('title', $blog->title) }}" required>
                        @error('title')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <!-- Picture Field -->
                    <div class="form-group">
                        <label for="picture" class="block text-sm font-medium text-gray-700">Picture</label>
                        <input type="file" id="picture" name="picture"
                            class="block w-full px-3 py-2 mt-1 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm @error('picture') border-red-500 @enderror">
                        @error('picture')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <!-- Description Field -->
                    <div class="form-group">
                        <label for="description1}" class="block text-sm font-medium text-gray-700">Description</label>
                        <textarea id="description1}" name="description1" rows="3"
                            class="block w-full px-3 py-2 mt-1 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm @error('description') border-red-500 @enderror"
                            required>{{ old('description', $blog->description) }}</textarea>
                        @error('description')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>



                <div class="flex justify-end p-4 bg-gray-200 border-t">
                    <button type="button" class="mr-2 btn btn-secondary" data-dismiss="modal"
                        onclick="closeModal('addProductModal')">Close</button>
                    <button type="submit" class="btn btn-primary">Save</button>
                </div>
            </form>


        </div>




        <script src="https://cdn.ckeditor.com/4.16.0/standard/ckeditor.js"></script>

        <script>
            CKEDITOR.replace('description');
        </script>
    @endsection