@extends('layouts/inventory_layout')
@section('title', '| ' . $pageTitle)
@section('content')

<div class="row add-data-form" style="height:100%">
    <div class="col-md-12">
        <div class="col-md-1"></div>
        <div class="col-md-10 fullbody">
            <div class="viewTitle" style="border-bottom: 1px solid white;">
                <a href="{{ url('inv/viewProduct/') }}" class="btn btn-info pull-right addViewBtn"><i
                        class="glyphicon glyphicon-th-list viewIcon">
                    </i>Product List</a>
            </div>
            <div class="panel panel-default panel-border">
                <div class="panel-heading">
                    <div class="panel-title">New Product</div>
                </div>
                <div class="panel-body">

                    {!! Form::open([
                        'url' => '',
                        'enctype' => 'multipart/form-data',
                        'role' => 'form',
                        'class' => 'form-horizontal form-groups',
                    ]) !!}
                    {!! Form::text('id', $product->id, ['class' => 'form-control hidden', 'id' => 'id', 'type' => 'text']) !!}

                    <div class="row">
                        <div class="col-md-12">

                            <div class="col-md-6">
                                <div class="form-group">
                                    {!! Form::label('name', 'Product Name: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('name', $product->name, [
                                            'class' => 'form-control',
                                            'id' => 'name',
                                            'type' => 'text',
                                            'placeholder' => 'Enter product name',
                                        ]) !!}
                                        <p id='namee' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('description', 'Decscription:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::textarea('description', $product->description, [
                                            'class' => 'form-control',
                                            'id' => 'description',
                                            'rows' => 2,
                                            'placeholder' => 'Enter description',
                                        ]) !!}
                                        <p id='descriptione' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('supplierId', 'Supplier Name: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('supplierId', $suppliers, $product->supplierId, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'supplierId',
                                            'placeholder' => 'Please Select Supplier Name',
                                        ]) !!}
                                        <p id='supplierIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productGroupId', 'Group: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productGroupId', $productGroups, $product->group_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productGroupId',
                                            'placeholder' => 'Please Select Product Group',
                                        ]) !!}
                                        <p id='productGroupIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productCategoryId', 'Category: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productCategoryId', $productCategories, $product->category_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productCategoryId',
                                            'placeholder' => 'Please Select Prduct Category',
                                        ]) !!}
                                        <p id='productCategoryIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productSubCategoryId', 'Sub Category: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productSubCategoryId', $productSubCategories, $product->sub_category_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productSubCategoryId',
                                            'placeholder' => 'Please Select Prduct SubCategory',
                                        ]) !!}
                                        <p id='productSubCategoryIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productBrandId', 'Brand: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productBrandId', $productBrands, $product->brand_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productBrandId',
                                            'placeholder' => 'Please Select Prduct Brand',
                                        ]) !!}
                                        <p id='productBrandIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productModelId', 'Model: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productModelId', $productModels, $product->model_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productModelId',
                                            'placeholder' => 'Please Select Prduct Model',
                                        ]) !!}
                                        <p id='productModelIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productSizeId', 'Size: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productSizeId', $productSizes, $product->size_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productSizeId',
                                            'placeholder' => 'Please Select Prduct Size',
                                        ]) !!}
                                        <p id='productSizeIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productColorId', 'Color: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productColorId', $productColors, $product->color_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productColorId',
                                            'placeholder' => 'Please Select Prduct Color',
                                        ]) !!}
                                        <p id='productColorIde' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('productUomId', 'UOM: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('productUomId', $productUoms, $product->uom_id, [
                                            'class' => 'form-control custom-select2',
                                            'id' => 'productUomId',
                                            'placeholder' => 'Please Select UOM',
                                        ]) !!}
                                        <p id='productUomIde' style="max-height:3px;"></p>
                                    </div>
                                </div>

                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    {!! Form::label('costPrice', 'Cost Price: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('costPrice', $value = $product->cost_price, [
                                            'class' => 'form-control',
                                            'id' => 'costPrice',
                                            'type' => 'text',
                                            'placeholder' => 'Enter cost price',
                                        ]) !!}
                                        <p id='costPricee' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('openingStock', 'Opening Stock: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('openingStock', $value = $product->opening_stock, [
                                            'class' => 'form-control',
                                            'id' => 'openingStock',
                                            'type' => 'text',
                                            'placeholder' => 'Enter opening stock',
                                        ]) !!}
                                        <p id='openingStocke' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('openingStockAmount', 'O. Stock Amount: *', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('openingStockAmount', $value = $product->opening_stock_amount, [
                                            'class' => 'form-control',
                                            'id' => 'openingStockAmount',
                                            'type' => 'text',
                                            'placeholder' => 'Enter opening stock amount',
                                        ]) !!}
                                        <p id='openingStockAmounte' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('minimumStock', 'Minimum Stock:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('minimumStock', $value = $product->minimum_stock, [
                                            'class' => 'form-control',
                                            'id' => 'minimumStock',
                                            'type' => 'text',
                                            'placeholder' => 'Enter minimum stock',
                                        ]) !!}
                                        <p class="error text-center alert alert-danger hidden"></p>
                                    </div>
                                </div>
                                <div class="form-group hidden">
                                    {!! Form::label('preBarcode', 'Pre Barcode:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('preBarcode', $value = $product->preBarcode, [
                                            'class' => 'form-control',
                                            'readonly',
                                            'id' => 'preBarcode',
                                            'type' => 'text',
                                            'placeholder' => 'Enter preBarcode',
                                        ]) !!}
                                        <p class="error text-center alert alert-danger hidden"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('barcode', 'Barcode:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('barcode', $value = $product->barcode, [
                                            'class' => 'form-control',
                                            'readonly',
                                            'id' => 'barcode',
                                            'type' => 'text',
                                            'placeholder' => 'Enter Barcode',
                                            'required' => 'required',
                                        ]) !!}
                                        <p id='barcodee' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('barcodeImage', 'Barcode Image:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8" id="barcodeImage">
                                        <div class="col-sm-5" id="barcodeImageId">
                                                @if ($product->barcode)
                                                    {!! DNS1D::getBarcodeHTML($product->barcode, 'C128', 1.4, 22) !!}
                                                @endif
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('systemBarcode', 'System Barcode:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('systemBarcode', $product->system_barcode, [
                                            'class' => 'form-control',
                                            'id' => 'systemBarcode',
                                            'type' => 'text',
                                            'placeholder' => 'Enter system barcode',
                                        ]) !!}
                                        <p class="error text-center alert alert-danger hidden"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('warranty', 'Warranty:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('warranty', $product->warranty, [
                                            'class' => 'form-control',
                                            'id' => 'warranty',
                                            'type' => 'text',
                                            'placeholder' => 'Enter warranty',
                                        ]) !!}
                                        <p class="error text-center alert alert-danger hidden"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('serviceWarranty', 'Service Warranty:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('serviceWarranty', $product->service_warranty, [
                                            'class' => 'form-control',
                                            'id' => 'serviceWarranty',
                                            'type' => 'text',
                                            'placeholder' => 'Enter service warranty',
                                        ]) !!}
                                        <p class="error text-center alert alert-danger hidden"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('compresserWarranty', 'Compresser Warranty:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('compresserWarranty', $product->compresser_warranty, [
                                            'class' => 'form-control',
                                            'id' => 'compresserWarranty',
                                            'type' => 'text',
                                            'placeholder' => 'Enter compresser warranty',
                                        ]) !!}
                                        <p class="error text-center alert alert-danger hidden"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('image_path', 'Upload Image:', ['class' => 'col-sm-4 control-label']) !!}
                                    <div class="col-sm-8">
                                        {!! Form::file('image_path', $value = null, ['class' => 'form-control', 'id' => 'image_path', 'type' => 'file']) !!}

                                        <img src="{{ url('/images/inventory/product/' . $product->image_path) }}"
                                                width="200" height="120" id="image2" />
                                        <p class="error text-center alert alert-danger hidden"></p>
                                    </div>
                                </div>

                            </div>

                        </div>
                    </div>


                    <div class="row">
                        <div class="col-md-4"></div>
                        <div class="form-group col-md-4 text-center">
                            {!! Form::label('update', ' ', ['class' => 'col-sm-2 control-label']) !!}
                            <div class="col-sm-12">
                                {!! Form::submit('Update', ['id' => 'add', 'class' => 'btn btn-info']) !!}
                                <a href="{{ url('inv/viewProduct/') }}" class="btn btn-danger closeBtn">Close</a>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <span id="success" style="color:green; font-size:20px;"></span>
                        </div>
                    </div>
                    {!! Form::close() !!}

                </div>
            </div>
            <div class="footerTitle" style="border-top:1px solid white"></div>
        </div>
        <div class="col-md-1"></div>
    </div>
</div>
@endsection

<script src="{{ asset('js/jquery-1.11.1.min.js') }}"></script>
<script type="text/javascript">
    $(document).ready(function() {

        $('form').submit(function(event) {
            event.preventDefault();
            var formData = new FormData($(this)[0]);

            $.ajax({
                type: 'post',
                url: '../editProductItem',
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                dataType: 'json',
                success: function(_response) {

                    if (_response.errors) {
                        if (_response.errors['name']) {
                            $('#namee').empty();
                            $('#namee').show();
                            $('#namee').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.name + '</span>');
                        }
                        if (_response.errors['supplierId']) {
                            $('#supplierIde').empty();
                            $('#supplierIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.supplierId + '</span>');
                        }
                        if (_response.errors['productGroupId']) {
                            $('#productGroupIde').empty();
                            $('#productGroupIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productGroupId + '</span>');
                        }
                        if (_response.errors['productCategoryId']) {
                            $('#productCategoryIde').empty();
                            $('#productCategoryIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productCategoryId + '</span>');
                        }
                        if (_response.errors['productSubCategoryId']) {
                            $('#productSubCategoryIde').empty();
                            $('#productSubCategoryIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productSubCategoryId + '</span>');
                        }
                        if (_response.errors['productBrandId']) {
                            $('#productBrandIde').empty();
                            $('#productBrandIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productBrandId + '</span>');
                        }
                        if (_response.errors['productModelId']) {
                            $('#productModelIde').empty();
                            $('#productModelIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productModelId + '</span>');
                        }
                        if (_response.errors['productSizeId']) {
                            $('#productSizeIde').empty();
                            $('#productSizeIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productSizeId + '</span>');
                        }
                        if (_response.errors['productColorId']) {
                            $('#productColorIde').empty();
                            $('#productColorIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productColorId + '</span>');
                        }
                        if (_response.errors['productUomId']) {
                            $('#productUomIde').empty();
                            $('#productUomIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.productUomId + '</span>');
                        }
                        if (_response.errors['costPrice']) {
                            $('#costPricee').empty();
                            $('#costPricee').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.costPrice + '</span>');
                        }
                        if (_response.errors['openingStock']) {
                            $('#openingStocke').empty();
                            $('#openingStocke').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.openingStock + '</span>');
                        }
                        if (_response.errors['openingStockAmount']) {
                            $('#openingStockAmounte').empty();
                            $('#openingStockAmounte').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.openingStockAmount + '</span>');
                        }
                        if (_response.errors['barcode']) {
                            $('#barcodee').empty();
                            $('#barcodee').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .errors.barcode + '</span>');
                        }
                    } else {
                        $('.error').addClass("hidden");
                        if (_response.responseTitle == 'success') {
                            Swal.fire({
                                icon: 'success',
                                title: _response.responseText,
                                text: 'successfull!',
                                showConfirmButton: false,
                                timer: 1500
                            })

                            setTimeout(function() {
                                window.location.href =
                                    "{{ url('/inv/viewProduct') }}";
                            }, 2000);
                        } else {
                            toastr.error(_response.responseText);
                        }
                    }
                },
                error: function(_response) {
                    toastr.error(_response.errors);

                }

            });
        });

        $("input").keyup(function() {
            var name = $("#name").val();
            if (name) {
                $('#namee').hide();
            } else {
                $('#namee').show();
            }
        });
        $('select').on('change', function(e) {
            var productGroupId = $("#productGroupId").val();
            if (productGroupId) {
                $('#productGroupIde').hide();
            } else {
                $('#productGroupIde').show();
            }
            var supplierId = $("#supplierId").val();
            if (supplierId) {
                $('#supplierIde').hide();
            } else {
                $('#supplierIde').show();
            }
            var productCategoryId = $("#productCategoryId").val();
            if (productCategoryId) {
                $('#productCategoryIde').hide();
            } else {
                $('#productCategoryIde').show();
            }
            var productSubCategoryId = $("#productSubCategoryId").val();
            if (productSubCategoryId) {
                $('#productSubCategoryIde').hide();
            } else {
                $('#productSubCategoryIde').show();
            }
            var productBrandId = $("#productBrandId").val();
            if (productBrandId) {
                $('#productBrandIde').hide();
            } else {
                $('#productBrandIde').show();
            }
            var productModelId = $("#productModelId").val();
            if (productModelId) {
                $('#productModelIde').hide();
            } else {
                $('#productModelIde').show();
            }
            var productSizeId = $("#productSizeId").val();
            if (productSizeId) {
                $('#productSizeIde').hide();
            } else {
                $('#productSizeIde').show();
            }
            var productColorId = $("#productColorId").val();
            if (productColorId) {
                $('#productColorIde').hide();
            } else {
                $('#productColorIde').show();
            }
            var productUomId = $("#productUomId").val();
            if (productUomId) {
                $('#productUomIde').hide();
            } else {
                $('#productUomIde').show();
            }
        });

        $('#image_path').change(function(e) {
            var output = document.getElementById('image2');
            output.src = URL.createObjectURL(event.target.files[0]);
        });

    });
</script>

<script type="text/javascript">
    $(document).ready(function() {
        var productGroupId = $('#productGroupId').val();
        if (productGroupId == '') {
            $("#productCategoryId").prop("disabled", true);
        }
        $("#productGroupId").change(function() {
            var productGroupId = $('#productGroupId').val();
            if (productGroupId !== '') {
                $("#productCategoryId").prop("disabled", false);
            } else {
                $("#productCategoryId").prop("disabled", true);
            }
            $.ajax({
                type: 'post',
                url: '../productConfigOptionIdSend',
                data: $('form').serialize(),
                dataType: 'json',
                success: function(_response) {
                    console.log(_response)
                    $("#productCategoryId").empty();
                    $("#productCategoryId").prepend(
                        '<option selected="selected" value="">Please Select Product Category</option>'
                        );

                    $("#productSubCategoryId").empty();
                    $("#productSubCategoryId").prepend(
                        '<option selected="selected" value="">Please Select Product Sub Category</option>'
                        );

                    $.each(_response, function(key, value) {
                        {
                            if (key == "productCategoryListByGroupChange") {
                                $.each(value, function(index, result) {
                                    $('#productCategoryId').append(
                                        "<option value='" + result.id +
                                        "'>" + result.name + "</option>"
                                        );
                                });
                            }

                            if (key == "productSubCategoryListByCategoryChange") {
                                $.each(value, function(index, result) {
                                    $('#productSubCategoryId').append(
                                        "<option value='" + result.id +
                                        "'>" + result.name + "</option>"
                                        );
                                });
                            }

                        }
                    });
                }
            });
        });
    });

    $(document).ready(function() {
        var productCategoryId = $('#productCategoryId').val();
        if (productCategoryId == '') {
            $("#productSubCategoryId").prop("disabled", true);
        }
        $("#productCategoryId").change(function() {
            $("#productSubCategoryId").empty();
            $("#productSubCategoryId").prepend(
                '<option selected="selected" value="">Please Select Product SubCategory</option>');
            var productCategoryId = $('#productCategoryId').val();
            if (productCategoryId !== '') {
                $("#productSubCategoryId").prop("disabled", false);
            } else {
                $("#productSubCategoryId").prop("disabled", true);
            }
            $.ajax({
                type: 'post',
                url: '../productConfigOptionIdSend',
                data: $('form').serialize(),
                dataType: 'json',
                success: function(_response) {
                    $.each(_response, function(key, value) {
                        {
                            if (key == "productSubCategoryListByCategoryChange") {
                                $.each(value, function(index, result) {
                                    $('#productSubCategoryId').append(
                                        "<option value='" + result.id +
                                        "'>" + result.name + "</option>"
                                        );
                                });
                            }

                        }
                    });
                }
            });
        });
    });

    $(document).ready(function() {
        var productBrandId = $('#productBrandId').val();
        if (productBrandId == '') {
            $("#productModelId").prop("disabled", true);
        }
        $("#productBrandId").change(function() {
            $("#productModelId").empty();
            $("#productModelId").prepend(
                '<option selected="selected" value="">Please Select Product Model</option>');
            var productBrandId = $('#productBrandId').val();
            console.log(productBrandId);
            if (productBrandId !== '') {
                $("#productModelId").prop("disabled", false);
            } else {
                $("#productModelId").prop("disabled", true);
            }
            $.ajax({
                type: 'post',
                url: '../productConfigOptionIdSend',
                data: $('form').serialize(),
                dataType: 'json',
                success: function(_response) {
                    console.log(_response);
                    $.each(_response, function(key, value) {
                        {
                            if (key == "productModelListByBrandChange") {
                                $.each(value, function(index, result) {
                                    $('#productModelId').append("<option value='" +
                                        result.id + "'>" + result.name +
                                        "</option>");
                                });
                            }

                        }
                    });
                }
            });
        });
    });

    $(document).ready(function() {
        $.strPad = function(i, l, s) {
            var o = String(i);
            if (!s) {
                s = '0';
            }
            while (o.length < l) {
                o = s + o;
            }
            return o;
        };

        $('#costPrice').on('input', function() {
            this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
        });

        //=================START BARCODE GENERATOR===============================

        var costPrice = $("#costPrice").val();
        $("#productGroupId").change(function(event) {
            if (costPrice != null) {
                $("#costPrice").val(' ');
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
            }
        });

        $("#productCategoryId").change(function(event) {
            if (costPrice != null) {
                $("#costPrice").val(' ');
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
            }
        });

        $("#productSubCategoryId").change(function(event) {
            if (costPrice != null) {
                $("#costPrice").val(' ');
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
            }
        });

        $("#productBrandId").change(function(event) {
            if (costPrice != null) {
                $("#costPrice").val(' ');
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
            }
        });

        $("#modelId").change(function(event) {
            if (costPrice != null) {
                $("#costPrice").val(' ');
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
            }
        });

        $("#productSizeId").change(function(event) {
            if (costPrice != null) {
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
            }
        });
        $("#productColorId").change(function(event) {
            if (costPrice != null) {
                $("#costPrice").val(' ');
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
            }
        });
        $("#costPrice").change(function(event) {
            if (costPrice != null) {
                $("#barcode").val(' ');
                $("#barcodeImageId").remove();
                $('#costPricee').hide();
            }else{
                $('#costPricee').show();
            }
        });

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        // $("#salesPrice").change(function(event) {
        $(document).on("change", "#costPrice", function() {
            var groupBarcodeId = $("#productGroupId").val();
            var categoryBarcodeId = $.strPad($("#productCategoryId").val(), 2);
            var subCategoryBarcodeId = $.strPad($("#productSubCategoryId").val(), 2);
            var brandIdBarcodeId = $.strPad($("#productBrandId").val(), 2);
            var modelBarcodeId = $.strPad($("#productModelId").val(), 3);
            var txtName = $("#name").val();
            var txtSizeId = $("#productSizeId").val();
            var txtColorId = $("#productColorId").val();
            var txtUomId = $("#productUomId").val();
            var txtCostPrice = $("#costPrice").val();
            var groupTomodelBarcodeId = groupBarcodeId + categoryBarcodeId + subCategoryBarcodeId +
                brandIdBarcodeId + modelBarcodeId;
            console.log('txtCostPrice ',txtCostPrice);
            $('#preBarcode').empty();
            $('#preBarcode').val(groupTomodelBarcodeId);

            // if (groupBarcodeId > 0 && $("#productCategoryId").val() > 0 && $("#productSubCategoryId").val() > 0 && $(
            //         "#productBrandId").val() > 0 && $("#productModelId").val() > 0) {
                $.ajax({
                    url: "../barcodeGenarate",
                    type: "post",
                    data: {
                        "groupTomodelBarcodeId": groupTomodelBarcodeId,
                        "txtSizeId": txtSizeId,
                        "txtColorId": txtColorId,
                        "txtUomId": txtUomId,
                        "txtCostPrice": txtCostPrice,
                        "txtName": txtName
                    },
                    success: function(result) {
                        if (result.existingBarcode == null || result.existingBarcode ==
                            '') {
                            if (result.productBarcode != null || result.productBarcode !=
                                '') {
                                $("#barcode").val(result.productBarcode);
                                $("#barcodeImage").html(
                                    '<div class="col-sm-5" id="barcodeImageId">' +
                                    result.barcodeImage + '</div>');
                                document.getElementById("add").disabled = false;
                                $("#barcodee").hide('');
                            } else {
                                Swal.fire({
                                    icon: 'error',
                                    title: result.title,
                                    text: result.text,
                                    showConfirmButton: true,
                                })
                                $("#costPrice").val('');
                                $("#barcodee").show('');
                                document.getElementById("add").disabled = true;
                            }
                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: result.title,
                                text: result.text,
                                showConfirmButton: true,
                            })
                            $("#costPrice").val('');
                            $("#barcodee").show('');
                            document.getElementById("add").disabled = true;
                        }

                    }
                }); //End of ajax

            // } else {
            //     toastr.error("Please Select Product Group,Cateegory,Subcategory,Brand,Model");
            // }
        });
    });

    function genarateBarcode(barcode = null) {
        $.strPad = function(i, l, s) {
            var o = String(i);
            if (!s) {
                s = '0';
            }
            while (o.length < l) {
                o = s + o;
            }
            return o;
        };
        var groupBarcodeId = $("#productGroupId").val();
        var categoryBarcodeId = $.strPad($("#productCategoryId").val(), 2);
        var subCategoryBarcodeId = $.strPad($("#productSubCategoryId").val(), 2);
        var brandIdBarcodeId = $.strPad($("#productBrandId").val(), 2);
        var modelBarcodeId = $.strPad($("#productModelId").val(), 3);
        var txtName = $("#name").val();
        var txtSizeId = $("#productSizeId").val();
        var txtColorId = $("#productColorId").val();
        var txtUomId = $("#productUomId").val();
        var txtCostPrice = $("#costPrice").val();
        var groupTomodelBarcodeId = groupBarcodeId + categoryBarcodeId + subCategoryBarcodeId +
            brandIdBarcodeId + modelBarcodeId;
        console.log('txtCostPrice ',txtCostPrice);
        $('#preBarcode').empty();
        $('#preBarcode').val(groupTomodelBarcodeId);

        if (groupBarcodeId > 0 && $("#categoryId").val() > 0 && $("#subCategoryId").val() > 0 && $("#brandId").val() >
            0 && $("#modelId").val() > 0 && txtSizeId > 0 && txtColorId > 0) {
            if (barcode == '') {
                $.ajax({
                    url: "../barcodeGenarate",
                    type: "post",
                    data: {
                        "groupTomodelBarcodeId": groupTomodelBarcodeId,
                        "txtSizeId": txtSizeId,
                        "txtColorId": txtColorId,
                        "txtUomId": txtUomId,
                        "txtCostPrice": txtCostPrice,
                        "txtSalePrice": txtSalePrice,
                        '_token': $('input[name=_token]').val()
                    },
                    success: function(result) {

                        if (result.existingBarcode == null || result.existingBarcode == '') {
                            if (result.productBarcode != null || result.productBarcode != '') {
                                $("#barcode").val(result.productBarcode);
                                $("#barcodeImage").html('<div class="col-sm-5" id="barcodeImageId">' +
                                    result.barcodeImage + '</div>');
                            } else {
                                console.log(result.text);
                                Swal.fire({
                                    icon: 'error',
                                    title: result.title,
                                    text: result.text,
                                    showConfirmButton: true,
                                })
                                $("#costPrice").val('');
                            }
                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: result.title,
                                text: result.text,
                                showConfirmButton: true,
                            })
                            $("#costPrice").val('');
                        }

                        /*if(result.existingBarcode == null || result.existingBarcode==''){
                            $("#barcode").val(result.productBarcode);
                            $("#barcodeImage").html('<div class="col-sm-5" id="barcodeImageId">'+result.barcodeImage+'</div>');
                        } else {
                            alert("This Barcode Already Existing!");
                            $("#txtCostPrice").val('');
                            $("#txtSalePrice").val('');
                        }*/

                    }
                }); //End of ajax
            }

        } else {
            alert("Please Select Product Group,Cateegory,Subcategory,Brand,Model,Size And Color");
        }
    }

    //=================END BARCODE GENERATOR===============================
</script>