@extends('dashboard.layouts.layouts')
@section('title', 'Dashboard')
{{--Drop Your Customized Style Codes Here--}}
@section('customizedStyle')

@endsection
{{--Drop Your Customized Scripts Codes Here--}}
@section('customizedScript')
    <script>
        $(function () {
            $('#example1').DataTable()
            $('#example2').DataTable({
                'paging'      : true,
                'lengthChange': false,
                'searching'   : false,
                'ordering'    : true,
                'info'        : true,
                'autoWidth'   : false
            })
        })

        /*$(function () {
            // Summernote
            $('.textarea').summernote()
        })*/
         $(function () {
            // Replace the <textarea id="editor1"> with a CKEditor
            // instance, using default configuration.
            CKEDITOR.replace('product_specification_en');
            CKEDITOR.replace('product_specification_ar');
        });

    </script>
@endsection
{{-- Start of page Content --}}
@section('content')

    <section class="content-header">
        <h1>
            Product
            <small>Add New Product</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="/adminDashboard"><i class="fa fa-dashboard"></i> Home</a></li>
            <li><a href="/adminDashboard/product">Product</a></li>
            <li class="active">Add Product</li>
        </ol>
    </section>

    <section class="content">
        <div class="row">
            <!-- left column -->
            <div class="col-md-12">
            {{--<div class="box box-primary" style="padding: 15px">--}}
            {{--<div class="box-header with-border">
                <h3 class="box-title">All Features Info</h3>
                <a href="" class="btn btn-warning pull-right"><i class="fa fa-plus"></i> Add New Feature </a>
            </div>--}}
            {{--@include('dashboard.layouts.messages')--}}
            <!-- /.box-header -->
                <!-- form start -->

                <section class="content">
                    @include('dashboard.layouts.messages')
                    <form role="form" action="/adminDashboard/product/add" enctype="multipart/form-data" method="post">
                        <input type="hidden" name="created_by">
                        {{csrf_field()}}
                        <div class="row">
                            <!-- English Side -->
                            <div class="col-md-6">
                                <div class="box box-primary">
                                    <div class="box-header with-border">
                                        <h3 class="box-title">Add Product Info</h3>
                                    </div>
                                    <!-- /.box-header -->
                                    <!-- form start -->
                                    <div class="box-body">
                                        <div class="form-group">

                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> Product Title</label>
                                                <input type="text" class="form-control" name="title_en" id="exampleInputEmail1" placeholder="Enter Product Title" value="{{old('title_en')}}">
                                                <p class="help-block">Enter Title of Product</p>
                                            </div>

                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> Product Description</label>
                                                {{--<input type="text" class="form-control" name="description_en" id="exampleInputEmail1" placeholder="Enter Product Description" value="">--}}
                                                <textarea type="text" class="form-control" name="description_en" placeholder="Enter Product Description" rows="5">{{old('description_en')}}</textarea>                                                <p class="help-block">Enter Description of Product</p>
                                            </div>
                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> Product ٍSpecifications</label>
                                                {{--<input type="text" class="form-control" name="specification_en" id="exampleInputEmail1" placeholder="Enter Product ٍSpecifications" value="">--}}
                                                {{--<textarea type="text" class="form-control" name="specification_en"placeholder="Enter Product ٍSpecifications" rows="5">{{old("specification_en")}}</textarea>--}}
                                                <div class="mb-3">
                                                    <textarea class="textarea" name="specification_en" id="product_specification_en" placeholder="Place some text here"
                                                              style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;">
                                                              {{old("specification_en")}}
                                                    </textarea>
                                                </div>
                                                <p class="help-block">Enter ٍSpecifications of Product</p>
                                            </div>

                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> Image</label>
                                                <input type="file" class="form-control" name="image_id[]" id="exampleInputEmail1" placeholder="Enter button text"multiple="multiple">
                                                <p class="help-block"> Upload Product Image <strong>Recommended High Resolution Image</strong> </p>
                                            </div>
                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1">Main Image</label>
                                                <input type="file" class="form-control" name="main_image" id="exampleInputEmail1" placeholder="Enter button text">
                                                <p class="help-block"> Upload your Main Image That appers In Front Of product<strong>Recommended High Resolution Image</strong> </p>
                                            </div>
                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> Category</label>
                                                <select class="form-control" name="category_id" id="exampleInputEmail1">
                                                    <option value="">-- select category --</option>
                                                    @if($categories)
                                                        @foreach($categories as $category)
                                                            <option value="{{$category->id}}">{{$category->category_en->name}}</option>
                                                        @endforeach
                                                    @else
                                                    @endif

                                                </select>
                                                <p class="help-block"> Choose Category For Product</p>
                                            </div>
                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1">Product Image Alt</label>
                                                <input type="text" class="form-control" name="alt" id="exampleInputEmail1" placeholder="Enter Alt" value="{{old('alt')}}">
                                                <p class="help-block">Enter Alt of Product Image</p>
                                            </div>
                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1">url</label>
                                                <input type="url" class="form-control" placeholder="Enter Product URL"  id="url" name="url" value="{{old("url")}}">
                                                <p class="help-block">If you don't enter any url, the url will be the title english by default.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="box-footer">
                                        <div class="col-lg-12">
                                            <button type="submit" class="btn btn-primary">Submit</button>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Arabic Side -->
                            <div class="col-md-6 arab_dir">
                                <div class="box box-primary">
                                    <div class="box-header with-border">
                                        <h3 class="box-title">أضف بيانات السلعة</h3>
                                    </div>
                                    <!-- .box-header -->
                                    <!-- form start -->
                                    <div class="box-body">
                                        <div class="form-group">

                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> عنوان الصورة</label>
                                                <input type="text" class="form-control" name="title_ar" id="exampleInputEmail1" placeholder="ادخل عنوان السلعة" value="{{old("title_ar")}}">
                                                <p class="help-block">أضف عنوان الصورة</p>
                                            </div>

                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> وصف السلعة</label>
                                                {{--<input type="text" class="form-control" name="description_ar" id="exampleInputEmail1" placeholder="ادخل وصف السلعة" value="">--}}
                                                <textarea type="text" class="form-control" name="description_ar" placeholder="ادخل وصف السلعة"  rows="5">{{old('description_ar')}}</textarea>
                                                <p class="help-block">ادخل وصف الصورة</p>
                                            </div>
                                            <div class="col-lg-12">
                                                <label for="exampleInputEmail1"> مواصفات/مميزات السلعة</label>
                                               {{-- <input type="text" class="form-control" name="specification_ar" id="exampleInputEmail1" placeholder="ادخل مواصفات/مميزات السلعة" value="">--}}
                                               {{-- <textarea type="text" class="form-control" name="specification_ar" placeholder="ادخل مواصفات/مميزات السلعة" rows="5">{{old('specification_ar')}}</textarea>--}}
                                                <textarea class="textarea" name="specification_ar" id="product_specification_ar" placeholder="Place some text here"
                                                          style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;">
                                                    {!! old('specification_ar')!!}
                                                    </textarea>
                                                <p class="help-block">ادخل مواصفات/مميزات السلعة</p>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </section>
                {{--</div>--}}
            </div>
        </div>
    </section>

@endsection