@extends('layouts.admin_main')

@section('title', trans('admin_lang.create_new_product'))

@section('content')
    <!-- begin:: Subheader -->
    @breadcrumb([
        'home_url' => route('admin.dashboard.index'),
        'links' => [
            [
                'url' => route('admin.products.index'),
                'title' => trans('admin_lang.products_management'),
            ]
        ],
        'current_page_title' => trans('admin_lang.product_create')
    ])
    @endbreadcrumb
    <!-- end:: Subheader -->
    <div class="kt-container  kt-container--fluid  kt-grid__item kt-grid__item--fluid">
        <div class="row">
            <div class="col-lg-12">
                <div class="kt-portlet">
                    @header(['title' => trans('admin_lang.create_new_product'), 'icon' => 'fa fa-shopping-bag'])
                    @endheader
                    <!--begin::Form-->
                    <form class="kt-form" action="{{ route('admin.products.store') }}" method="POST">
                        <div class="kt-portlet__body">
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="name" class="required">@lang('admin_lang.name')</label>
                                        <input id="name" type="text" name="name" placeholder="{{ trans('admin_lang.product_name_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="sku" class="required">@lang('admin_lang.sku')</label>
                                        <input id="sku" type="text" name="sku" placeholder="{{ trans('admin_lang.sku_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="category_id" class="required">@lang('admin_lang.select_category')</label>
                                        <select class="form-control categorySelect2" id="category_id" name="category_id">
                                            <option value="">@lang('admin_lang.select_category')</option>
                                            @foreach ($categories as $id => $category)
                                                <option value="{{ $category->id }}" >{{ $category->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="sub_category_id" class="required">@lang('admin_lang.select_sub_category')</label>
                                        <select class="form-control subCategorySelect2" id="sub_category_id" name="sub_category_id">
                                            <option value="">@lang('admin_lang.select_sub_category')</option>

                                        </select>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="long_description" >@lang('admin_lang.long_description')</label>
                                        <textarea name="long_description" id="long_description" class="form-control"></textarea>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="short_description" >@lang('admin_lang.short_description')</label>
                                        <textarea name="short_description" id="short_description" class="form-control"></textarea>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="manufacturer" >@lang('admin_lang.manufacturer')</label>
                                        <input id="manufacturer" type="text" name="manufacturer" placeholder="{{ trans('admin_lang.manufacturer_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="pack_size" class="required">@lang('admin_lang.pack_size')</label>
                                        <input id="pack_size" type="number" min="0" name="pack_size" placeholder="{{ trans('admin_lang.pack_size_placeholder') }}" required class="form-control" maxlength="10" length="10"
                                               onkeypress="javascript:return digitOnly(event)">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="unit_price" class="required">@lang('admin_lang.unit_price')</label>
                                        <input id="unit_price" type="number" min="0" step="0.1" name="unit_price" placeholder="{{ trans('admin_lang.unit_price_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="price" class="required">@lang('admin_lang.price')</label>
                                        <input id="price" type="number" min="0" step="0.1" name="price" placeholder="{{ trans('admin_lang.price_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="cost_price" >@lang('admin_lang.cost_price')</label>
                                        <input id="cost_price" type="number" min="0" step="0.1" name="cost_price" placeholder="{{ trans('admin_lang.cost_price_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="department_number" >@lang('admin_lang.department_number')</label>
                                        <input id="department_number" type="number" min="1" step="1" name="department_number" placeholder="{{ trans('admin_lang.department_number_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="location" >@lang('admin_lang.location')</label>
                                        <input id="location" type="text" name="location" placeholder="{{ trans('admin_lang.location_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="vat" class="required">@lang('admin_lang.vat')</label>
                                        <input id="vat" type="number" min="0" step="0.1" name="vat" placeholder="{{ trans('admin_lang.vat_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="in_stock" >@lang('admin_lang.in_stock')</label>
                                        <input id="in_stock" type="number" min="1" step="1" name="in_stock" placeholder="{{ trans('admin_lang.in_stock_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="supplier_acc" >@lang('admin_lang.supplier_acc')</label>
                                        <input id="supplier_acc" type="number" min="1" step="1" name="supplier_acc" placeholder="{{ trans('admin_lang.supplier_acc_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="supplier_name" >@lang('admin_lang.supplier_name')</label>
                                        <input id="supplier_name" type="text" name="supplier_name" placeholder="{{ trans('admin_lang.supplier_name_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="supplier_part_no" >@lang('admin_lang.supplier_part_no')</label>
                                        <input id="supplier_part_no" type="text" name="supplier_part_no" placeholder="{{ trans('admin_lang.supplier_part_no_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="bar_code" class="required">@lang('admin_lang.bar_code')</label>
                                        <input id="bar_code" type="text" name="bar_code" placeholder="{{ trans('admin_lang.bar_code_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="category_no" >@lang('admin_lang.category_no')</label>
                                        <input id="category_no" type="number" min="1" step="1" name="category_no" placeholder="{{ trans('admin_lang.category_no_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="unit_of_sale" class="required">@lang('admin_lang.unit_of_sale')</label>
                                        <input id="unit_of_sale" type="number" min="1" step="1" name="unit_of_sale" placeholder="{{ trans('admin_lang.unit_of_sale_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="promotional_cost">@lang('admin_lang.promotional_cost')</label>
                                        <input id="promotional_cost" type="number" min="0" step="0.1" name="promotional_cost" placeholder="{{ trans('admin_lang.promotional_cost_placeholder') }}" required class="form-control">
                                    </div>
                                </div>

                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label for="weight" >@lang('admin_lang.weight')</label>
                                        <input id="weight" type="number" min="0" step="0.1" name="weight" placeholder="{{ trans('admin_lang.weight_placeholder') }}" required class="form-control">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <div class="kt-avatar kt-avatar--outline kt-avatar--danger" id="kt_user_avatar_4">
                                            <div class="kt-avatar__holder" style="background-image: url(/assets/media/logos/wl_logo_icon.png)"></div>
                                            <label class="kt-avatar__upload" data-toggle="kt-tooltip" title="" data-original-title="@lang('admin_lang.change_image')">
                                                <i class="fa fa-pen"></i>
                                                <input type="file" name="image" id="image" accept=".png, .jpg, .jpeg">
                                            </label>
                                            <span class="kt-avatar__cancel cancelImage" data-toggle="kt-tooltip" title="" data-original-title="@lang('admin_lang.remove_image')">
                                                <i class="fa fa-times"></i>
                                            </span>
                                        </div>
                                        <span class="form-text text-muted">@lang('admin_lang.allowed_types')</span>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                </div>
                                <div class="col-lg-2">
                                    <div class="form-group">
                                        <div class="d-flex align-items-center">
                                            <label for="is_justify">@lang('admin_lang.featured_product')</label>
                                            <span class="kt-switch kt-switch--outline kt-switch--icon kt-switch--info ml-auto">
                                                <label>
                                                    <input type="checkbox" id="is_featured" value="1" name="is_featured">
                                                    <span></span>
                                                </label>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="kt-portlet__foot">
                            <div class="kt-form__actions">
                                @button(['type' => 'submit'])@endbutton
                                @button(['type' => 'cancel', 'url' => route('admin.products.index')])@endbutton
                            </div>
                        </div>
                    </form>
                    <!--end::Form-->
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
<script src="{{ asset('assets/js/pages/crud/file-upload/ktavatar.js') }}" type="text/javascript"></script>
<script>
    $(document).ready(function() {
        initializeSelect2();
//        KTSelect2.init();
    });
    $('body').on('change','#category_id',function(){
        var id = $(this).val();
        $.ajax({
            type: "POST",
            url:'{{ route('admin.products.getSubCategory') }}',
            data: {
                'id':id,
                '_token' : "{{ csrf_token() }}"
            },
            async: true,
            dataType:"json",
            success: function(response) {
                if(response.status == true){
                    $('#sub_category_id').html(response.html);
                    initializeSelect2();
                    hideLoading();
                }
            },
            error:function()
            {
                hideLoading();
                errorToast("{{ trans('admin_lang.something') }}")
            }
        });
        return false;
    });

    function initializeSelect2() {
        $(".categorySelect2").select2({placeholder: "{{ trans('admin_lang.select_category') }}"});
        $(".subCategorySelect2").select2({placeholder: "{{ trans('admin_lang.select_sub_category') }}"});

    }
</script>
@endpush