@extends('admin.layout.master')

@section('styles')
    <link rel="stylesheet" href="{{asset('/admin/dist/css/dropzone.css')}}">
@endsection

@section('content')
    <section class="content" id="app">
        <div class="box box-info">
            <div class="box-header with-border">
                <h3 class="box-title pull-right">ایجاد محصول جدید</h3>
            </div>
            <!-- /.box-header -->
            <div class="box-body">
                <div class="row">
                    <div class="col-md-6 col-md-offset-3">
                        <form id="myForm" method="post" action="/adminsaatlux090/products">
                            @csrf
                            <div class="form-group">
                                <label for="title">نام</label>
                                <input type="text" name="title" class="form-control" placeholder="نام محصول را وارد کنید...">
                            </div>
                            <div class="form-group">
                                <label for="slug">نام مستعار</label>
                                <input type="text" name="slug" class="form-control" placeholder="نام مستعار محصول را وارد کنید...">
                            </div>

                            <div class="form-group">
                                <label>افزودنی</label>
                                  <select id="opd_plusi" class="form-control" name="plusi" required>
                                      <option value="0">بدون سایز و افزودنی</option>
                                      <option value="1">حروف</option>
                                      <option value="2">انگشتر</option>
                                  </select>
                            </div>

                            <div id="contentshowsize" class="form-group">

                            </div>

                            <div class="form-group">
                                <label>وضعیت نشر</label>
                                <div>
                                    <input type="radio" name="status" value="0" checked> <span class="margin-l-10">منتشر نشده</span>
                                    <input type="radio" name="status" value="1"> <span>منتشر شده</span>
                                </div>
                            </div>
                            
                            <div class="form-group">
                                <label>تعداد موجود</label>
                                <input type="number" name="inventory" class="form-control" placeholder="تعداد موجودی را وارد کنید...">
                            </div>

                            <div class="form-group">
                                <label>ضمانت مادام العمر</label>
                                <div>
                                    <input type="radio" name="warranty" value="0" checked> <span>ضمانت ندارد</span>
                                    <input type="radio" name="warranty" value="1"> <span class="margin-l-10">ضمانت دارد</span>
                                </div>
                            </div>

                            <div class="form-group">
                              <label>دسته بندی</label>
                                <select id="opd_cat" class="form-control" name="categories[]" required multiple>
                                    <option>انتخاب کنید</option>
                                    @foreach($categories as $category)
                                    <option value="{{$category->id}}">{{$category->name}}</option>
                                    @endforeach
                                </select>
                          </div>
                          
                        <div class="form-group">
                              <label>تگ ها</label>
                                <select id="opd_cat" class="form-control" name="tags[]" multiple>
                                    <option>انتخاب کنید</option>
                                    @foreach($tags as $tag)
                                    <option value="{{$tag->id}}">{{$tag->title}}</option>
                                    @endforeach
                                </select>
                          </div>

                          <div class="form-group">
                              <label>برند</label>
                                <select class="form-control" name="brand" required>
                                    @foreach($brands as $brand)
                                    <option value="{{$brand->id}}">{{$brand->title}}</option>
                                    @endforeach
                                </select>
                          </div>

                          <div id="contentshowvizh" class="form-group">

                          </div>


                            <div class="form-group">
                                <label>قیمت</label>
                                <input type="number" name="price" class="form-control" placeholder="قیمت محصول را وارد کنید...">
                            </div>
                            <div class="form-group">
                                <label>وضعیت فروش عمده</label>
                                <div>
                                    <input type="radio" name="major_status" value="1"> <span class="margin-l-10">فعال</span>
                                    <input type="radio" name="major_status" value="0" checked> <span>غیر فعال</span>
                                </div>
                            </div>
                            <div class="form-group">
                                <label>قیمت فروش عمده</label>
                                <input type="number" name="major_price" class="form-control" placeholder="قیمت محصول را وارد کنید...">
                            </div>
                            <div class="form-group">
                                <label>قیمت ویژه</label>
                                <input type="number" name="discount_price" class="form-control" placeholder="قیمت ویژه محصول را وارد کنید...">
                            </div>
                            <div class="form-group">
                                <label>توضیحات</label>
                                <textarea id="textareaDescription" type="text" name="description" class="ckeditor form-control" placeholder="توضیحات محصول را وارد کنید..."></textarea>
                            </div>
                            <div class="form-group">
                                <label for="photo">گالری تصاویر</label>
                                <input type="hidden" name="photo_id[]" id="product-photo">
                                <div id="photo" class="dropzone"></div>
                            </div>
                            <div class="form-group">
                                <label>عنوان سئو</label>
                                <input type="text" name="meta_title" class="form-control" placeholder="عنوان سئو را وارد کنید...">
                            </div>
                            <div class="form-group">
                                <label>توضیحات سئو</label>
                                <textarea type="text" name="meta_desc" class="form-control" placeholder="توضیحات سئو را وارد کنید..."></textarea>
                            </div>
                            <button type="submit" onclick="productGallery()" class="btn btn-success pull-left">ذخیره</button>
                        </form>
                    </div>
                </div>

            </div>
        </div>
    </section>

@endsection

@section('scripts')
    <script type="text/javascript" src="{{asset('admin/dist/js/dropzone.js')}}"></script>
    <script type="text/javascript" src="{{asset('admin/plugins/ckeditor/ckeditor.js')}}"></script>
    <script>
        Dropzone.autoDiscover = false;
        var photosGallery = []
        var drop = new Dropzone('#photo', {
          addRemoveLinks: true,
          url: "{{ route('photos.upload') }}",
          sending: function(file, xhr, formData){
            formData.append("_token","{{csrf_token()}}")
          },
          success: function(file, response){
            photosGallery.push(response.photo_id)
          }
        });
        productGallery = function(){
          document.getElementById('product-photo').value = photosGallery
        }

        CKEDITOR.replace('textareaDescription',{
          customConfig: 'config.js',
          toolbar: 'simple',
          language: 'fa',
          removePlugins: 'cloudservices, easyimage'
        })

    </script>

    <script>
  $(document).ready(function(){

$("#opd_cat").on('change', function() {
    filter_vizh();
});
    function filter_vizh()
    {

var catid = $('#opd_cat').val();

$.ajax({
  type: 'get',
  url: '/adminsaatlux090/showvizh',
  data:{catid:catid},
  success:function(data){
    console.log(data);
    $("#contentshowvizh").html(data);
    $("#contentshowvizh").fadeIn(100);

  }
});
    }


});
  </script>

  <script>
$(document).ready(function(){

$("#opd_plusi").on('change', function() {
  var plusiid = $('#opd_plusi').val();
  if(plusiid == 2)
  {
    filter_size();
  }else{
    $("#contentshowsize").fadeOut(100);
  }
});

  function filter_size()
  {
var plusiid = $('#opd_plusi').val();
$.ajax({
type: 'get',
url: '/adminsaatlux090/showsize',
data:{plusiid:plusiid},
success:function(data){
  console.log(data);
  $("#contentshowsize").html(data);
  $("#contentshowsize").fadeIn(100);
}
});
  }
});
</script>

@endsection