@extends('layouts.admin')
@section('content')
 <div class="ps-main__wrapper">
            <header class="header--dashboard">
                <div class="header__left">
                    <h3>New Product</h3>
                    <p>Add new product</p>
                </div>
                <div class="header__center">
                    
                </div>
                <div class="header__right"><a class="header__site-link" href="{{ route('view-products', ["sector"=>"all"]) }}"><span>View Store</span><i class="icon-exit-right"></i></a></div>
            </header>
             @if ($errors->any())
                    <div class="alert alert-danger">
                        <strong>Error!</strong> 
                        <ul>
                            @foreach ($errors->all() as $error)
                            <li>{{ $error  }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif
                @if ($message = Session::get('success'))
                <div class="alert alert-success alert-block">
                <button type="button" class="close" data-dismiss="alert">×</button>
                <strong>{{ $message }}</strong>
                </div>
                @endif
            <section class="ps-new-item">
                <form class="ps-form ps-form--new-product" action="{{ route('products.store') }}" method="POST" enctype = 'multipart/form-data'>
                     @csrf
                    <div class="ps-form__content">
                        <div class="row">
                            <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
                                <figure class="ps-block--form-box">
                                    <figcaption>General</figcaption>
                                    <div class="ps-block__content">
                                        <div class="form-group">
                                            <label>Product Name<sup>*</sup>
                                            </label>
                                            <input class="form-control" name="name" type="text" placeholder="Enter product name..." required/>
                                        </div>
                                        <div class="form-group">
                                            <label>Discount (positive values)<sup>*</sup>
                                            </label>
                                            <input class="form-control" name="discount" type="number" min="0" placeholder="Enter product discount..." />
                                        </div>
                                        <div class="form-group">
                                            <label>Shipping<sup>*</sup>
                                            </label>
                                            <textarea class="form-control" name="shipping" rows="6" placeholder="Enter product description..." required></textarea>
                                        </div>
                                        <div class="form-group">
                                            <label>COD<sup>*</sup>
                                            </label>
                                            <input class="form-control" name="cod" type="text" placeholder="" />
                                        </div>
                                        <div class="form-group">
                                            <label>Payment Method<sup>*</sup>
                                            </label>
                                            <input class="form-control" name="online" type="text" placeholder="" />
                                        </div>
                                        <div class="form-group">
                                            <label>Min Quantity<sup>*</sup>
                                            </label>
                                            <input class="form-control" type="number" name="qty" placeholder="" required/>
                                        </div>
                                        <div class="form-group">
                                            <label>Return Policy<sup>*</sup>
                                            </label>
                                            <input class="form-control" name="return" type="text" placeholder="" />
                                        </div>
                                        <div class="form-group">
                                            <label>Product Description<sup>*</sup></label>
                                            <!--id="summernote"-->
                                            <textarea class="form-control" name="description" rows="6" name="description" required></textarea>
                                        </div>
                                    </div>
                                </figure>
                            </div>
                            <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
                                <figure class="ps-block--form-box">
                                    <figcaption>Product Images</figcaption>
                                    <div class="ps-block__content">
                                        <div class="form-group">
                                            <label>Product Image (300 * 300)</label>
                                            <div class="form-group--nest">
                                                <input class="form-control  " name="image" type="file" placeholder="" required>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label>Product Gallery (300 * 300)</label>
                                            <div class="form-group--nest">
                                                <input class="form-control " name="image2" type="file" placeholder="" required>
                                            </div>
                                        </div>
                                        <div class="form-group form-group--nest">
                                            <input class="form-control  " name="image3" type="file" placeholder="" required>
                                        </div>
                                      <!--  <div class="form-group">
                                            <label>Video (optional)
                                            </label>
                                            <input class="form-control" type="text" placeholder="Enter video URL" />
                                        </div>-->
                                    </div>
                                </figure>
                                <figure class="ps-block--form-box">
                                    <figcaption>Inventory</figcaption>
                                    <div class="ps-block__content">
                                        <div class="form-group">
                                            <label>SKU<sup>*</sup>
                                            </label>
                                            <input class="form-control" type="text" placeholder="" name="sku" required/>
                                        </div>
                                        <div class="form-group form-group--select">
                                            <label>Status
                                            </label>
                                            <div class="form-group__content">
                                                <select class="ps-select" title="Status" name="status" required>
                                                    <option value="Active">Active</option>
                                                    <option value="Inactive">Inactive</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group form-group--select">
                                            <label>Vendor
                                            </label>
                                            <div class="form-group__content">
                                                <select class="ps-select select2" title="vendor" name="vendor"  required>
                                                    <option value="">Vendor</option>
                                                     @foreach ($vendors as $vendor)
                                                    <option value="{{ $vendor->id }}">{{ $vendor->name }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                 </div>
                                </figure>
                                <figure class="ps-block--form-box">
                                    <figcaption>Meta</figcaption>
                                    <div class="ps-block__content">
                                        <div class="form-group form-group--select">
                                            <label>Sector
                                            </label>
                                            <div class="form-group__content">
                                                <select class="ps-select selectpicker" title="sector" name="sector" data-live-search="true" required>
                                                    <option value="Arts and Craft">Arts and craft</option>
                                                    <option value="Agri-business">Agri-business</option>
                                                    <option value="Construction">Construction</option>
                                                    <option value="Clothing">Clothing</option>
                                                     <option value="Fresh Produce">Fresh Produce</option>
                                                    <option value="Furniture">Furniture</option>
                                                    <option value="ICT">ICT</option>
                                                    <option value="Packaging">Packaging</option>
                                                    <option value="Processed food">Processed food</option>
                                                    <option value="Services">Services</option>
                                                     <option value="Organic and Herbal">Organic and Herbal</option>
                                                      <option value="Manufacturing">Manufacturing</option>
                                                       <option value="Beauty and Personal Care">Beauty and Personal Care</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label>Tags (separate each tag with a comma)
                                            </label>
                                            <input class="form-control" type="text" name="tags"/>
                                        </div>
                                    </div>
                                </figure>
                            </div>
                        </div>
                    <div class="ps-form__bottom">
                    <a class="ps-btn ps-btn--black" href="{{ route('list-products') }}">Back</a>
                        <button class="ps-btn">Submit</button>
                    </div>
                </form>
            </section>
        </div>
    </main>
@endsection