@extends('layouts.app')
@section('content')

@php $statuses = [''=>'Select', 1=>'Active', 0=>'Inactive']; @endphp

@php $panel_type = [''=>'Select', "Poly Crystalline"=>'Poly Crystalline', "Mono Crystalline"=>'Mono Crystalline', "TOPCon" => "TOPCon", "HJT" => "HJT"]; @endphp

@php $class = [''=>'Select', "Full Cell"=>'Full Cell', "Half Cut"=>'Half Cut']; @endphp

@php $grade = [''=>'Select', "A"=>'A', "A2"=>'A2', "B" => "B"]; @endphp

@php $wattage = [''=>'Select', "275"=>'275', "315"=>'315', "330" => "330", "335" => "335", "340" => "340", "400"=>"400", "405"=>"405", "415"=>"415", "500"=>"500", "550"=>"550", "580"=>"580", "585"=>"585", "590"=>"590", "600"=>"600", "620"=>"620", "650"=>"650", "710"=>"710"];
@endphp

@php $efficiency = [''=>'Select', "17"=>'17', "18"=>'18', "21"=>'21', "23"=>'23']; @endphp

@php $make = [''=>'Select', "Monofacial"=>'Monofacial', "Bi-facial"=>'Bi-facial', "G2G" => "G2G"]; @endphp

@php $manufacturer_warranty = [''=>'Select', "10"=>'10', "12"=>'12', "15"=>'15']; @endphp

@php $generation_guaranty = [''=>'Select', "20"=>'20', "25"=>'25', "27"=>'27', "30"=>'30', "32"=>"32"]; @endphp

@php $insulation = [''=>'Select', "XLPE"=>'XLPE', "PVC"=>'PVC', "Armoured"=>'Armoured', "Flexible"=>"Flexible"]; @endphp

@php $material = [''=>'Select', "Copper"=>'Copper', "Aluminium"=>'Aluminium']; @endphp

@php $inverter_types = [''=>'Select', "Single 1P"=>'Single 1P', "Multi 3P"=>'Multi 3P', "Separate P/P"=>'Separate P/P', "DG Sync"=>'DG Sync', "Parallel"=>'Parallel', 'Daisychain'=>'Daisychain']; @endphp


<!-- PAGE-HEADER -->
<div class="page-header">
    <div>
        <h1>Product <small>Edit</small></h1>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="#">Home</a></li>
            <li class="breadcrumb-item active" aria-current="page">Dashboard</li>
        </ol>
    </div>

    <div class="float-end">
        <a class="btn btn-primary float-right" href=" {{ url('/products') }}" id="createNewProduct"> Product List</a>
    </div>

</div>
<!-- PAGE-HEADER END -->




<div class="content mt-3">


    <div class="card radius-10">
        <div class="card-body">

            <nav class="nav nav-pills flex-column flex-sm-row mb-4">
                <a class="flex-sm-fill text-sm-center nav-link active" aria-current="page"
                    href="{{ url('product/edit/' . $product->id) }}">Product Basic Details</a>
                <a class="flex-sm-fill text-sm-center nav-link" href="{{ url('product/images/' . $product->id) }}">Product
                    Images</a>
                {{-- <a class="flex-sm-fill text-sm-center nav-link" href="{{url('product/variants/'.$product->id)}}">All Variants & Prices</a> --}}
                {{-- <a class="flex-sm-fill text-sm-center nav-link" href="{{ url('product/seo_data/' . $product->id) }}">SEO Details</a> --}}
            </nav>

            {!! Form::open(['id' => 'programForm', 'name' => 'programForm', 'class' => 'form-horizontal', 'files' => true]) !!}
            {{ csrf_field() }}

            {!! Form::hidden('product_id', $product->id, ['id' => 'product_id']) !!}


            <div class="form-row">

                <div class="col-md-8 col-lg-8">

                    <div class="col-xl-12 mb-3">
                        <div class="form-row">
                            <div class="col-xl-6">
                                <label for="name">Product Name</label>
                                {!! Form::text('name', $product->name, [
                                'class' => 'form-control',
                                'id' => 'name',
                                'placeholder' => 'Enter Product name',
                                'required',
                                ]) !!}
                                <span class="text-danger" id="name-error"></span>
                            </div>

                            <div class="col-xl-6">
                                <label for="name">Product Code</label>
                                {!! Form::text('sku', $product->sku, [
                                'class' => 'form-control',
                                'id' => 'sku',
                                'placeholder' => 'Enter Product SKU'
                                ]) !!}
                                <span class="text-danger" id="sku-error"></span>
                            </div>
                        </div>
                    </div>

                    <div class="col-xl-12 mb-3">
                        <div class="form-row">
                            <div class="col-xl-6 mb-0 form-group">
                                <label>Category </label>
                                {{ Form::select('category', ['' => 'Select Category'] + $categories, $product->category_id, ['class' => 'standardSelect form-control', 'title' => 'Select category', 'id' => 'category',  'data-live-search' => 'true', 'data-size' => '5', 'required']) }}
                                <span class="text-danger" id="category-error"></span>
                            </div>

                            <div class="col-xl-6 mb-0 form-group">
                                <label>Brand</label>
                                {{ Form::select('brand_id', ['' => 'Select Brand'] + $brands, $product->brand_id, ['class' => 'standardSelect form-control', 'title' => 'Select Brand', 'id' => 'brand_id', 'data-live-search' => 'true', 'data-size' => '5', 'required']) }}
                                <span class="text-danger" id="category-error"></span>
                            </div>
                        </div>
                    </div>

                    <div class="col-xl-12 mb-3">
                        <div class="form-row">
                            <div class="col-xl-6 mb-0 form-group">
                                <label>Cost Centre</label>
                                {{ Form::select('cost_centre', ['' => 'Select Category'] + $cost_centers, $product->cost_centre, ['class' => 'standardSelect form-control', 'title' => 'Select Cost Center', 'id' => 'cost_centre',  'data-live-search' => 'true', 'data-size' => '5', 'required']) }}
                                <span class="text-danger" id="cost_centre-error"></span>
                            </div>

                            <div class="col-xl-6 mb-0 form-group">
                                <label>Business Unit</label>
                                {{ Form::select('business_unit_id', [''=>'Select Business Unit']+$business_units, $product->business_unit_id, ['class'=>'standardSelect form-control', 'title'=>'Select Brand', 'id'=>'business_unit_id',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                                <span class="text-danger" id="business_unit_id-error"></span>
                            </div>
                        </div>
                    </div>

                    <div class="col-xl-12 mb-3">
                        <label for="description">Description</label>
                        {!! Form::textarea('description', $product->description, [
                        'class' => 'form-control',
                        'id' => 'description',
                        'placeholder' => 'Enter description',
                        'rows' => 3,
                        'required',
                        ]) !!}
                        <span class="text-danger" id="description-error"></span>
                    </div>

                </div>

                <div class="col-md-4 col-lg-4">

                    <div class="card  mb-3">
                        <div class="card-body">
                            <div class="form-group">
                                <label for="name">Product MRP</label>
                                {!! Form::text('price', $product->price, [
                                'class' => 'form-control',
                                'id' => 'price',
                                'placeholder' => 'Enter Product MRP',
                                'required',
                                ]) !!}
                                <span class="text-danger" id="sku-error"></span>
                            </div>

                            <div class="form-group">
                                <label>Tax</label>
                                {{ Form::select('tax_id', [] + $taxes, $product->tax_id, ['class' => 'standardSelect form-control', 'title' => 'Select Tax', 'id' => 'tax_id']) }}
                                <span class="text-danger" id="tax-error"></span>
                            </div>


                            <div class="form-group">
                                <label>HSN Code</label>
                                {{ Form::text('hsn_code', $product->hsn, ['class' => 'form-control', 'placeholder' => 'Enter HSN Code', 'id' => 'tax']) }}
                                <span class="text-danger" id="hsn_code-error"></span>
                            </div>

                        </div>
                    </div>

                    <div class="card mb-3">
                        <div class="card-body">
                            <div class="form-group">
                                <label>Datasheet</label>
                                <input type="file" name="product_datasheet" id="product_datasheet" class="form-control">
                                <span class="text-danger" id="product_datasheet-error"></span>
                            </div>

                            @if(!empty($product->datasheet))
                            <a href="{{ url('storage/'.$product->datasheet) }}" target="_blank"> View Document</a>
                            @endif
                        </div>
                    </div>

                    <div class="card mb-3">
                        <div class="card-body">
                            <div class="form-group">
                                <label>Status</label>
                                {!! Form::select('status', $statuses, $product->status, [
                                'class' => 'standardSelect form-control',
                                'title' => 'Select Status',
                                'data-live-search' => 'true',
                                'id' => 'status',
                                ]) !!}
                                <span class="text-danger" id="status-error"></span>
                            </div>
                        </div>
                    </div>




                </div>

            </div>

            <div class="col-md-12" style="display: none;" id="div_inverter">
                <div class="row">

                    <div class="col-md-3 mb-3">
                        <label for="description">DC Overloading</label>
                        {!! Form::text('dc_overloading', $product->dc_overloading, ['class'=>"form-control", 'id'=>"dc_overloading", 'placeholder'=>"Enter DC Overloading"]); !!}
                        <span class="text-danger" id="dc_overloading-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">MPPT</label>
                        {!! Form::text('mppt', $product->mppt, ['class'=>"form-control", 'id'=>"mppt", 'placeholder'=>"Enter MPPT"]); !!}
                        <span class="text-danger" id="mppt-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Warranty</label>
                        {!! Form::text('warranty', $product->warranty, ['class'=>"form-control", 'id'=>"warranty", 'placeholder'=>"Enter Warranty"]); !!}
                        <span class="text-danger" id="warranty-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Phase</label>
                        {{ Form::select('inverter_type', [''=>'Select Panel Type']+$inverter_types, $product->inverter_type, ['class'=>'standardSelect form-control', 'title'=>'Select Type', 'id'=>'inverter_type',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="inverter_type-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Rated Size</label>
                        {!! Form::number('rated_size', $product->rated_size, ['class'=>"form-control", 'id'=>"rated_size", 'placeholder'=>"Enter Rated Size"]); !!}
                        <span class="text-danger" id="rated_size-error"></span>
                    </div>
                </div>
            </div>

            <div class="col-md-12" style="display: none;" id="div_panel">
                <div class="row">
                    <div class="col-md-3 mb-3 form-group">
                        <label>Panel Type</label>
                        {{ Form::select('panel_type',  [''=>'Select Panel Type']+$panel_type, $product->panel_type, ['class'=>'standardSelect form-control', 'title'=>'Select category', 'id'=>'panel_type',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="panel_type-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Class</label>
                        {{ Form::select('class', [''=>'Select class']+$class, $product->class, ['class'=>'standardSelect form-control', 'title'=>'Select Class', 'id'=>'class',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="class-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Grade</label>
                        {{ Form::select('grade', [''=>'Select grade']+$grade, $product->grade, ['class'=>'standardSelect form-control', 'title'=>'Select Grade', 'id'=>'grade',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="grade-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Wattage</label>
                        {{ Form::select('wattage', [''=>'Select Wattage']+$wattage,$product->wattage, ['class'=>'standardSelect form-control', 'title'=>'Select Wattage', 'id'=>'wattage',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="wattage-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Efficiency </label>
                        {{ Form::select('efficiency', [''=>'Select Efficiency ']+$efficiency, $product->efficiency, ['class'=>'standardSelect form-control', 'title'=>'Select Efficiency ', 'id'=>'efficiency',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="efficiency-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Make </label>
                        {{ Form::select('make', [''=>'Select Make']+$make, $product->make, ['class'=>'standardSelect form-control', 'title'=>'Select Make', 'id'=>'make',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="make-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Manufacturer Warranty</label>
                        {{ Form::select('manufacturer_warranty', [''=>'Select Manufacturer Warranty']+$manufacturer_warranty, $product->manufacturer_warranty, ['class'=>'standardSelect form-control', 'title'=>'Select Manufacturer Warranty', 'id'=>'manufacturer_warranty',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="manufacturer_warranty-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Generation Guaranty</label>
                        {{ Form::select('generation_guranty', [''=>'Select Generation Guaranty']+$generation_guaranty, $product->generation_guranty, ['class'=>'standardSelect form-control', 'title'=>'Select Generation Guaranty', 'id'=>'generation_guranty',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="generation_guranty-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Palette Size</label>
                        {!! Form::text('pallete_size', $product->pallete_size, ['class'=>"form-control", 'id'=>"pallete_size", 'placeholder'=>"Enter Palette Size"]); !!}
                        <span class="text-danger" id="pallete_size-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">VoC</label>
                        {!! Form::text('voc', $product->voc, ['class'=>"form-control", 'id'=>"voc", 'placeholder'=>"Enter VoC"]); !!}
                        <span class="text-danger" id="voc-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Isc</label>
                        {!! Form::text('isc', $product->isc, ['class'=>"form-control", 'id'=>"isc", 'placeholder'=>"Enter Isc"]); !!}
                        <span class="text-danger" id="isc-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Length</label>
                        {!! Form::text('length', $product->length, ['class'=>"form-control", 'id'=>"length", 'placeholder'=>"Enter Length"]); !!}
                        <span class="text-danger" id="length-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Width</label>
                        {!! Form::text('width', $product->width, ['class'=>"form-control", 'id'=>"width", 'placeholder'=>"Enter Width"]); !!}
                        <span class="text-danger" id="width-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Thickness</label>
                        {!! Form::text('thickness', $product->thickness, ['class'=>"form-control", 'id'=>"thickness", 'placeholder'=>"Enter Thickness"]); !!}
                        <span class="text-danger" id="thickness-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Structure Hole</label>
                        {!! Form::text('structure_hole', $product->structure_hole, ['class'=>"form-control", 'id'=>"structure_hole", 'placeholder'=>"Enter Structure Hole"]); !!}
                        <span class="text-danger" id="structure_hole-error"></span>
                    </div>
                </div>
            </div>

            <div class="col-md-12" style="display: none;" id="div_wire">
                <div class="row">

                    <div class="col-md-3 mb-3">
                        <label for="description">Guage</label>
                        {!! Form::text('guage', $product->guage, ['class'=>"form-control", 'id'=>"guage", 'placeholder'=>"Enter Guage"]); !!}
                        <span class="text-danger" id="guage-error"></span>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label for="description">Core</label>
                        {!! Form::text('core', $product->core, ['class'=>"form-control", 'id'=>"core", 'placeholder'=>"Enter Core"]); !!}
                        <span class="text-danger" id="core-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Insulation</label>
                        {{ Form::select('insulation', [''=>'Select Insulation']+$insulation, $product->insulation, ['class'=>'standardSelect form-control', 'title'=>'Select Insulation', 'id'=>'insulation',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="insulation-error"></span>
                    </div>

                    <div class="col-md-3 mb-3 form-group">
                        <label>Material</label>
                        {{ Form::select('material', [''=>'Select Material']+$material, $product->material, ['class'=>'standardSelect form-control', 'title'=>'Select Material', 'id'=>'material',  'data-live-search'=>'true',  'data-size'=>'5', 'required']) }}
                        <span class="text-danger" id="material-error"></span>
                    </div>

                </div>
            </div>

        </div>

        <div class="form-row">
            {!! Form::submit('Save Product', ['class' => 'btn btn-primary', 'id' => 'submitbtn']) !!}
            {!! Form::close() !!}
        </div>
    </div>
</div>
</div>

@stop


@section('scripting')

<script type="text/javascript">
    $(document).ready(function() {

        $(".standardSelect").selectpicker();

        // $('.standardSelect').on('change', function() {
        //     // $(this).valid();
        //     $('.standardSelect').selectpicker('refresh');
        // });

        $('#category').on('change', function() {
            switch_params();
        });

        function switch_params() {

            let check = $('#category').val();

            if (check == 1) {
                $('#div_inverter').show();
                $('#div_panel').hide();
                $('#div_wire').hide();
            } else if (check == 2) {
                $('#div_inverter').hide();
                $('#div_panel').show();
                $('#div_wire').hide();
            } else if (check == 3) {
                $('#div_inverter').hide();
                $('#div_panel').hide();
                $('#div_wire').show();
            } else {
                $('#div_inverter').hide();
                $('#div_panel').hide();
                $('#div_wire').hide();
            }
        };

        // $('.select2').select2({
        //     theme: 'bootstrap-5',
        // });

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

        getCategoriesData();

        $('#schedule_date_button').click(function() {
            $('#schedule_date').toggle();
        });
        setTimeout(function() {
            $('#tax_id').val('{{ $product->tax_id }}').trigger('change');
            $('#category').val('{{ $product->category_id }}').trigger('change');
        }, 500);
        $('.standardSelect').selectpicker('refresh');


        if ($("#programForm").length > 0) {

            // let form = this;

            var success_url = "{{ url('products') }}";

            $("#programForm").validate({

                errorClass: "is-invalid",

                unhighlight: function(element, errorClass, validClass) {
                    $(element).removeClass(errorClass);
                    $(element).parent().removeClass(errorClass);
                },

                errorPlacement: function(error, element) {
                    element.parent().append(error);
                    // $('.standardSelect').selectpicker('refresh');
                },

                rules: {
                    name: 'required',
                    short_description: 'required',
                    category: 'required',
                    tax_id: 'required',
                    hsn_code: 'required',
                    status: 'required',
                    'attribute[]': {
                        // required: true,
                        maxlength: 2 //this only use to validate length of string inputed, not length of array products
                    }
                },

                messages: {
                    name: "Please enter category name.",
                    short_description: "Please Enter short description.",
                    category: "Please Select Category.",
                    tax_id: "Please Select Tax Slab.",
                    hsn_code: "Please enter HSN Code.",
                    status: "Please Select Status.",
                    'attribute[]': {
                        // required: "Attributes are required",
                        maxlength: "Maximum 2 attributes are allowed to select."
                    }
                },



                submitHandler: function(form) {

                    // form.preventDefault();

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

                    $('#submitbtn').html('Sending..');
                    // var vals = $("#programForm").serializeArray();
                    let formData = new FormData(document.getElementById('programForm'));

                    let product_id = $('#product_id').val(); // Or however you're getting the ID
                    console.log(product_id);

                    $.ajax({
                        data: formData,
                        url: "{{ url('product/update') }}/" + product_id,
                        type: "POST", // or "PUT" if you spoof the method below
                        dataType: 'json',
                        processData: false,
                        contentType: false,

                        success: function(data) {
                            swal({
                                title: "Great!",
                                text: data.msg,
                                icon: "success",
                            }).then(() => {
                                location.href = success_url;
                            });
                        },

                        error: function(data) {
                            if (data.status == 422) {
                                var x = data.responseJSON;
                                $.each(x.errors, function(index, value) {
                                    $("#" + index).addClass("is-invalid");
                                    $("#" + index + "-error").html(value[0]);
                                });
                            }
                            $('#submitbtn').html('Save Category');
                        }
                    });



                }
            })
        }

    });



    function getDate(element) {
        var date;
        try {
            date = $.datepicker.parseDate(dateFormat, element.value);
        } catch (error) {
            date = null;
        }
        return date;
    }


    function getCategoriesData() {

        $.ajax({
            type: "get",
            url: "{{ url('getCategories/') }}?sel=true",
            dataType: "json",
            success: function(res) {

                if (res.success == 1) {
                    var options_htm = '<option value="">Categories</option>';
                    $.each(res.data, function(key, val) {
                        options_htm += '<option value="' + key + '">' + val + '</option>';
                    });
                    $('#category').html(options_htm);
                }
            }
        })
    }



    var next = 0;
    $("#add-more").click(function(e) {
        e.preventDefault();
        var addto = "#field" + next;
        var addRemove = "#field" + (next);
        next = next + 1;
        var newIn = ' <div class="row mb-3" id="field' + next + '" name="field' + next +
            '"><div class="col-5"><input type="text" placeholder="Name" class = "form-control" name="specification[' +
            next +
            '][name]"> </div> <div class = "col-5"><input type = "text" placeholder = "Value" class = "form-control" name="specification[' +
            next + '][value]"></div><div class="col-2"><button id="remove' +
            (next - 1) +
            '" class="btn btn-danger remove-me btn-sm" >Remove</button></div></div><div id="field"></div></div>';
        var newInput = $(newIn);

        //        var removeButton = $(removeBtn);
        $(addto).after(newInput);
        // $(addRemove).after(removeButton);
        $("#field" + next).attr('data-source', $(addto).attr('data-source'));
        $("#count").val(next);

        $('.remove-me').click(function(e) {
            e.preventDefault();
            console.log("hello");
            var fieldNum = this.id.charAt(this.id.length - 1);
            var fieldID = "#field" + fieldNum;
            console.log(fieldID);
            $(this).remove();
            $(fieldID).remove();
        });
    });

    //multiple fields add script
</script>
@stop