@component('panel.layouts.component', ['title' => 'ثبت محصول جدید'])

    @slot('style')

    @endslot
    @slot('subject')
        <h1><i class="fa fa-users"></i> ثبت محصول جدید </h1>
        <p>ثبت محصول جدید در فروشگاه.</p>
    @endslot
    @slot('breadcrumb')
        <li class="breadcrumb-item">محصولات</li>
    @endslot

    @slot('content')
        <div class="auth-background h-auto py-5">
            <div class="container py-5">
                <div class="row align-items-center ">
                    <div class="col-lg-12 col-md-12 mx-auto">
                        <div class="card">
                            <div class="card-header">
                                <strong>{{ __('ثبت محصول جدید') }}</strong>
                            </div>
                            @component('product::packages.product.src.views.components.message')
                            @endcomponent
                            <div class="card-body mx-lg-5 px-lg-3">
                                <form method="POST" action="{{ route('products.store') }}" enctype="multipart/form-data" >
                                    @csrf
                                    <input type="hidden" name="draft_id" value="{{ $draft->id }}">
                                    <div class="form-group">
                                         <label for="title">{{ __('product.title') }}</label><i class="required">&nbsp; *</i>
                                         <input id="title" type="text" class="form-control @error('title') is-invalid @enderror" name="title" value="{{ old('title') }}" autocomplete="title" autofocus>
                                         @error('title')
                                                <span class="invalid-feedback" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                        @enderror
                                    </div>

                                    <div class="form-row">
                                        <div class="form-group col-lg-4">
                                            <label for="slug">{{ __('product.slug') }}</label>
                                            <input type="text" name="slug" class="form-control @error('slug') is-invalid  @enderror" value="{{old('slug')}}" autocomplete="slug" autofocus>
                                            @error('slug')
                                                <div class="alert alert-danger">{{$message}}</div>
                                            @enderror
                                        </div>
                                        <div class="form-group col-lg-4">
                                            <label for="sku">{{ __('product.sku') }}</label>
                                            <input id="sku" type="text" class="form-control @error('sku') is-invalid @enderror" name="sku"
                                                   autocomplete="sku" value="{{ old('sku') }}" autofocus>
                                            @error('sku')
                                                <span class="invalid-feedback" role="alert">
                                                     <strong>{{ $message }}</strong>
                                                 </span>
                                            @enderror
                                        </div>
                                        <div class="form-group col-lg-4">
                                            <label for="type">{{ __('product.type') }}</label></label><i class="required"> *</i>
                                            <select id="type" type="text" class="form-control @error('type') is-invalid @enderror" name="type" value="{{ old('type') }}" autocomplete="type">
                                                <option value="">انتخاب کنید</option>
                                                <option value="0" {{ (old('type') == '0') ? 'selected' : '' }}>ساده</option>
                                                <option value="1" {{ (old('type') == '1') ? 'selected' : '' }}>متغیر</option>
                                                <option value="2" {{ (old('type') == '2') ? 'selected' : '' }}>باندل</option>
                                            </select>
                                            @error('type')
                                                <span class="invalid-feedback" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                            @enderror
                                        </div>
                                    </div>
                                    <div class="form-row ">
                                        <div class="form-group col-lg-4">
                                            <label for="title">{{ __('product.price') }}</label><i class="required">&nbsp;*</i>
                                            <input id="input.price" type="text" class="form-control price @error('price') is-invalid @enderror" name="price" value="{{ old('price') }}" autocomplete="price" autofocus>
                                            @error('price')
                                                <span class="invalid-feedback" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                            @enderror
                                        </div>
                                        <div class="form-group col-lg-4">
                                            <label for="sale_price">@lang('product.sale_price')</label>
                                            <input id="sale_price" type="text" class="form-control price @error('sale_price') is-invalid @enderror" name="sale_price" value="{{ old('sale_price') }}" autocomplete="sale_price" autofocus>
                                            @error('sale_price')
                                                 <span class="invalid-feedback" role="alert">
                                                     <strong>{{ $message }}</strong>
                                                 </span>
                                            @enderror
                                        </div>
                                        <div class="form-group col-lg-4">
                                            <label for="status">{{ __('product.status') }}</label><i class="required">&nbsp;*</i>
                                            <select id="status" type="text" class="form-control  @error('status') is-invalid @enderror" name="status" autocomplete="status">
                                                <option value="">انتخاب کنید</option>
                                                <option value="1" {{ (old('status') == '1') ? 'selected' : '' }}>موجود</option>
                                                <option value="0" {{ (old('status') == '0') ? 'selected' : '' }}>ناموجود</option>
                                            </select>
                                            @error('status')
                                                <span class="invalid-feedback" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                            @enderror
                                        </div>
                                        <div class="form-group col-lg-4">
                                            <label for="status">{{ __('product.ReleaseStatus') }}</label><i class="required">&nbsp; *</i>
                                            <select id="ReleaseStatus" type="text" class="form-control @error('ReleaseStatus') is-invalid @enderror" name="ReleaseStatus"  value="{{ old('ReleaseStatus') }}" autocomplete="ReleaseStatus">
{{--                                                <option value="">انتخاب کنید</option>--}}
                                                <option value="draft" {{ (old('ReleaseStatus') == 'draft') ? 'selected' : '' }}>پیشنویس</option>
                                                <option value="pending" {{ (old('ReleaseStatus') == 'pending') ? 'selected' : '' }}>در انتظار انتشار</option>
                                                <option value="published" {{ (old('ReleaseStatus') == 'published') ? 'selected' : '' }}>منتشر شده</option>
                                            </select>
                                            @error('ReleaseStatus')
                                                 <span class="invalid-feedback" role="alert">
                                                         <strong>{{ $message }}</strong>
                                                 </span>
                                            @enderror
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="discription">{{ __('product.discription') }}</label></label><i class="required">&nbsp;*</i>
                                        <textarea id="discription" type="text"class="form-control editor @error('discription') is-invalid @enderror" name="discription" autocomplete="discription" autofocus>
                                            {{ old('discription') }}
                                        </textarea>

                                        @error('discription')
                                            <span class="invalid-feedback" role="alert">
                                                 <strong>{{ $message }}</strong>
                                             </span>
                                        @enderror
                                    </div>
                                    <div class="form-group">
                                        <label for="categories">{{ __('product.categories') }}</label><i class="required">&nbsp;*</i>
                                        <select name="categories[]" class="form-control select2 @error('categories[]') is-invalid @enderror" multiple>
                                            <option value="0">--</option>
                                            {!! category_select_options( $categories, old( 'categories[]' ) ) !!}
                                        </select>
                                        @error('categories')
                                            <span class="invalid-feedback" role="alert">
                                                 <strong>{{ $message }}</strong>
                                             </span>
                                        @enderror
                                    </div>
                                    <div class="">
                                    <div class="form-group col-md-8 ">
                                        <div class="attachment_upload">


                                        <span class="btn btn-primary btn-file " >
                                            <input type="file" id="uploadImages" name="featured_image" accept="image/*" class="form-control photo  browse  @error('featured_image') is-invalid  @enderror"  value="{{old('featured_image')}}" autocomplete="featured_image" autofocus>
                                            <label for="title">{{ __('product.featured_image') }}</label> <i class="required">&nbsp;*</i>
                                        </span>
                                        <div class="hide-element" id="previewImages">
                                            <div class="media">
                                                <div class="media-left ">
                                                    <a href="" role="button" class="btn btn-danger pull-right" id="delete">
                                                        <i class="icon fa fa-close"></i>
                                                    </a>
                                                    <img class="media-object img-thumbnail" src="" alt="" id="0" title="" data-toggle="modal" data-target="#individualImagePreview" style="width: 250px; height: 150px;" >
                                                </div>
                                                <div class="media-body">
                                                    <p>
                                                        <label for="featureDescription">توضیحات: </label>
                                                        <input type="text" class="form-control"  value="" name="featureDescription" id="featureDescription">
                                                    </p>
                                                    <p>
                                                        <label for="featureCaption">عنوان: </label>
                                                        <input type="text" class="form-control" value="" name="featureCaption" id="featureCaption">
                                                    </p>
                                                </div>
                                            </div>
                                            </div>
                                        </div>
                                        @error('featured_image')
                                            <span class="invalid-feedback" role="alert">
                                                 <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                    </div>

                                    <div class="form-row attachment_upload_gallery">
                                        <div class="upload-widget GalleryImageChoice  ">
                                            <div class="select ">
                                                <span class="btn btn-primary btn-file">
                                                    <input class="files attachment_upload_gallery" type="file" name="gallery_image[]" value="{{old('gallery_image[]')}}" multiple>
                                                    <label for="title">
                                                         {{ __('product.gallery_image') }}
                                                    </label>
                                                </span>
                                                <output class="list row " >
                                                </output>
                                            </div>
                                            <div class="dropZone col-3">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group mb-0">
                                        <div class="">
                                            <button type="submit" class="btn btn-primary" >
                                                {{ __('ثبت محصول') }}
                                            </button>
                                            <a href="{{ route('products.index') }}" type="button" class="btn btn-warning" > انصراف</a>
                                        </div>
                                    </div>
                                    </div>
                                </form>
                            </div>
                            <div class="card-footer">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endslot

    @slot('script')

    @endslot

@endcomponent