@extends('admin.layouts.app')

@section('content')
    <div class="content">
        <div class="container-fluid">
            <x-nav title="Add Product" :route="''"  :import="''"/>
            <!-- end page-title -->
            <div class="row">
                <div class="col-12">
                    <div class="card m-b-30">
                        <div class="card-body">

                            <form action="{{route('dashboard.products.store')}}" method="POST" enctype="multipart/form-data">
                                @csrf
                                <x-input attribute="col-sm-10" label="Product Name" type="type" name="product_name" value="" placeholder="Enter product title"/>
                                <x-input attribute="col-sm-10" label="Price" type="number" name="price" value="" placeholder="Enter product title"/>
                                <x-select-2 name="sub_category_id" :options="$subCategories" label="Sub Category" addNewRoute="{{ route('dashboard.subcategories.create') }}" />
                                <x-select-2 name="brand_id" :options="$brands" label="Brand" addNewRoute="{{ route('dashboard.brands.create') }}" />
                                <!-- Description Input (Rich Text Editor) -->
                                <div class="form-group row">
                                    <label for="description" class="col-sm-10 col-form-label">Description</label>
                                    <div class="col-sm-10">
                                        <textarea id="description" name="description" class="form-control" placeholder="Enter detailed product description"></textarea>
                                    </div>
                                </div>

                                <x-input attribute="col-sm-10" label="Product Photo" type="file" name="product_photo" value="" placeholder="Enter product Photo"/>
{{--                                <x-input attribute="col-sm-10" label="Product Photo for details page" type="file" name="product_photo_details" value="" placeholder="Enter product Photo for details page"/>--}}
                                <x-button :attribute="getAction()" :item="$item" />
                            </form>

                        </div>
                    </div>
                </div> <!-- end col -->
            </div>
        </div>
        <!-- container-fluid -->

    </div>

    <!-- Include Rich Text Editor Script -->
{{--    <script src="https://cdn.ckeditor.com/4.16.2/standard/ckeditor.js"></script>--}}
    <script>
        // // Initialize CKEditor
        // CKEDITOR.replace('description', {
        //     height: 300,
        //     toolbarGroups: [
        //         { name: 'basicstyles', groups: ['basicstyles', 'cleanup'] },
        //         { name: 'paragraph', groups: ['list', 'indent', 'blocks', 'align'] },
        //         { name: 'styles' },
        //         { name: 'colors' },
        //         { name: 'links' },
        //         { name: 'insert' }
        //     ],
        //     removeButtons: 'Underline,Subscript,Superscript'
        // });
    </script>
@endsection