@extends('layouts.master')

@section('page_title', 'Edit Product')
@section('title', 'Products Details')
@section('main_item', 'Products')
@section('sub_item', 'Edit Product')

@section('content')

    <div class="col-md-12">
        <div class="card">
            <div class="card-body">
                <h4 class="mt-0 header-title">Edit Product</h4>
                <p class="text-muted mb-3"></p>
                <form id="update-product-form" class="form-parsley" method="POST"
                    action="{{ route('products.update', $product->id) }}" enctype="multipart/form-data">
                    @csrf
                    @method('PATCH')
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="product_name">Product Name</label>
                                <input type="text" class="form-control required_text" placeholder="Product Name"
                                    id="product_name" name="product_name" required=""
                                    value="{{ $product->product_name }}">
                                <input type="text" id="pro_id" value="{{ $product->id }}" hidden>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="category">Category</label>
                                <select class="form-control required_combo" id="category" name="category_id" required>
                                    <option value="">Select</option>
                                    @foreach ($categories as $category)
                                        @if ($category->id == $product->category_id)
                                            <option value="{{ $category->id }}" selected>{{ $category->category_name }}
                                            </option>
                                        @else
                                            <option value="{{ $category->id }}">{{ $category->category_name }}</option>
                                        @endif
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="sub_category_id">Sub Category</label>
                                <select class="form-control select2" id="sub_category_id" name="sub_category_id[]"
                                    multiple="multiple">
                                    @foreach ($sub_categories as $sub_category)
                                        <option value="{{ $sub_category->id }}"
                                            {{ in_array($sub_category->id, $product_has_sub_categories) ? 'selected' : ' ' }}>
                                            {{ $sub_category->sub_category_name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="unit">Unit</label>
                                <select class="form-control required_combo" id="unit" name="unit_id" required>
                                    <option value="">Select</option>
                                    @foreach ($units as $unit)
                                        @if ($unit->id == $product->unit_id)
                                            <option value="{{ $unit->id }}" selected>
                                                {{ $unit->actual_name . ' (' . $unit->short_name . ')' }}</option>
                                        @else
                                            <option value="{{ $unit->id }}">
                                                {{ $unit->actual_name . ' (' . $unit->short_name . ')' }}</option>
                                        @endif
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="sku">SKU</label>
                                <input type="text" class="form-control" placeholder="SKU" id="sku" name="sku"
                                    value="{{ $product->sku }}">
                            </div>
                        </div>
                        <div class="col-md-2 mt-2">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" id="allow_woocommerce_sync"
                                    data-parsley-multiple="groups" data-parsley-mincheck="1" name="allow_woocommerce_sync"
                                    @if ($product->allow_woocommerce_sync) checked @endif>
                                <label class="custom-control-label" for="allow_woocommerce_sync">Allow Woocomerce
                                    Sync</label>
                            </div>
                        </div>
                        <div class="col-md-2 mt-2">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" id="product_visible_sync"
                                    data-parsley-multiple="groups" data-parsley-mincheck="1" name="product_visible_sync"
                                    @if ($product->product_visible_sync) checked @endif>
                                <label class="custom-control-label" for="product_visible_sync">Woocomerce Product InVisible
                                    Sync
                                </label>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="reorder_level">Re-order Level</label>
                                <input type="number" step="0.01" class="form-control required_text"
                                    placeholder="Re-order Level" id="reorder_level" name="reorder_level" required=""
                                    value="{{ $product->reorder_level }}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold">Warranty Period Type</label>
                                <select class="form-control" id="warranty_select" name="warranty_select">
                                    <option value="">Select</option>
                                    <option value="month"
                                        {{ (old('warranty_select') ? old('warranty_select') : $product->warranty_select ?? '') == 'month' ? 'selected' : '' }}>
                                        Month</option>
                                    <option value="year"
                                        {{ (old('warranty_select') ? old('warranty_select') : $product->warranty_select ?? '') == 'year' ? 'selected' : '' }}>
                                        Year</option>
                                    <option value="day"
                                        {{ (old('warranty_select') ? old('warranty_select') : $product->warranty_select ?? '') == 'day' ? 'selected' : '' }}>
                                        Day</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold">Warranty Period</label>
                                <input type="number" step="0.01" class="form-control" placeholder="Warranty Period"
                                    id="warranty_period" name="warranty_period" value="{{ $product->warranty_period }}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" style="font-weight: bold" for="activate_code">business
                                    Location</label>
                                <select class="form-control select2" id="location_id" name="location_id[]"
                                    multiple="multiple" required>
                                    @if (Auth::user()->role_id == '1')
                                        @foreach ($users_access_location as $business_location)
                                            @if ($business_location->is_active == '1')
                                                <option value="{{ $business_location->id }}"
                                                    {{ in_array($business_location->id, $product_has_business_locations) ? 'selected' : ' ' }}>
                                                    {{ $business_location->name }}
                                                </option>
                                            @else
                                            @endif
                                        @endforeach
                                    @else
                                        @foreach ($users_access_location as $business_location)
                                            @if ($business_location->is_active == '1')
                                                <option value="{{ $business_location->business_location_id }}"
                                                    {{ in_array($business_location->business_location_id, $product_has_business_locations) ? 'selected' : ' ' }}>
                                                    {{ $business_location->name }}
                                                </option>
                                            @else
                                            @endif
                                        @endforeach
                                    @endif

                                </select>
                            </div>
                        </div>
                        @if (!empty($product->attribute_id))
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label style="font-weight: bold" for="secondary_mobile">Attribute</label>
                                    <select class="form-control" id="att_id" name="attribute_id" required>
                                        <option value="{{ $product->attribute_id }}">
                                            {{ $product->attribute->attribute_name }}</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-4 pt-4" id="attri_btn">
                                <div class="form-group">
                                    <a class="btn btn-primary" id="attribute" style="color: white;">Add Attribute</a>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="table-responsive">
                                    <table id="attribute-table" class="table table-bordered mb-0 table-centered">
                                        <thead class="thead-dark">
                                            <tr>
                                                <th>Variation</th>
                                                <th>Variation Value</th>
                                                <th>Quantity</th>
                                                <th>Unit Price</th>
                                                <th>Selling Price</th>
                                                <th>Second Price</th>
                                            </tr>
                                        </thead>
                                        <tbody id="attribute-value-tbody">
                                            @php
                                                $attribute = App\Attribute::find($product->attribute_id);
                                            @endphp
                                            <tr>
                                                <td>{{ $attribute->attribute_name }}</td>
                                                <td>{{ $product->attribute_value }}</td>
                                                <td>
                                                    <div>
                                                        <input type="hidden" name="attribute_values[0][product_id]"
                                                            value="{{ $product->id }}">
                                                        <input type="hidden"
                                                            name="attribute_values[0][attribute_value_id]"
                                                            id="attribute_value_id"
                                                            value="{{ $product->attribute_value_id }}">
                                                        <input type="hidden" name="attribute_values[0][attribute_value]"
                                                            id="attribute_value" value="{{ $product->attribute_value }}">
                                                        <input class="form-control" type="number" id="qty"
                                                            name="attribute_values[0][qty]" value="{{ $stock->qty }}">
                                                    </div>
                                                </td>
                                                <td>
                                                    <div>
                                                        <input type="number" step="0.01" class="form-control"
                                                            id="unit_cost" name="attribute_values[0][unit_cost]"
                                                            value="{{ $stock->unit_cost }}">
                                                    </div>
                                                </td>
                                                <td>
                                                    <div>
                                                        <input type="number" step="0.01" class="form-control"
                                                            id="unit_price" name="attribute_values[0][unit_price]"
                                                            value="{{ $stock->unit_price }}">
                                                    </div>
                                                </td>
                                                <td>
                                                    <div>
                                                        <input type="number" step="0.01" class="form-control"
                                                            id="second_price" name="attribute_values[0][second_price]"
                                                            value="{{ $stock->second_price }}">
                                                    </div>
                                                </td>
                                            </tr>
                                            @foreach ($child_products as $key => $child_product)
                                                @php
                                                    ++$key;
                                                    $attribute = App\Attribute::find($child_product->attribute_id);
                                                @endphp
                                                <tr>
                                                    <td>{{ $attribute->attribute_name }}</td>
                                                    <td>{{ $child_product->attribute_value }}</td>
                                                    <td>
                                                        <div>
                                                            <input type="hidden"
                                                                name="attribute_values[{{ $key }}][product_id]"
                                                                value="{{ $child_product->id }}">
                                                            <input type="hidden"
                                                                name="attribute_values[{{ $key }}][attribute_value_id]"
                                                                id="attribute_value_id"
                                                                value="{{ $child_product->attribute_value_id }}">
                                                            <input type="hidden"
                                                                name="attribute_values[{{ $key }}][attribute_value]"
                                                                id="attribute_value"
                                                                value="{{ $child_product->attribute_value }}">
                                                            <input class="form-control" type="number" id="qty"
                                                                name="attribute_values[{{ $key }}][qty]"
                                                                value="{{ $child_product->stock->qty }}">
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div>
                                                            <input type="number" step="0.01" class="form-control"
                                                                id="unit_cost"
                                                                name="attribute_values[{{ $key }}][unit_cost]"
                                                                value="{{ $child_product->stock->unit_cost }}">
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div>
                                                            <input type="number" step="0.01" class="form-control"
                                                                id="unit_price"
                                                                name="attribute_values[{{ $key }}][unit_price]"
                                                                value="{{ $child_product->stock->unit_price }}">
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div>
                                                            <input type="number" step="0.01" class="form-control"
                                                                id="second_price"
                                                                name="attribute_values[{{ $key }}][second_price]"
                                                                value="{{ $child_product->stock->second_price }}">
                                                        </div>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                    <!--end /table-->
                                </div>
                                <!--end /tableresponsive-->
                            </div>
                        @else
                        @endif
                        <div class="col-md-12">
                            <div class="form-group" style="position: relative;">
                                <label style="font-weight: bold" for="message">Description</label>
                                <textarea class="form-control" rows="5" id="message" name="descrption">{{ $product->descrption }}</textarea>
                            </div>
                        </div>
                        @if (empty($product->attribute_id))
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label style="font-weight: bold" for="unit_cost">Unit Cost</label>
                                    <input type="hidden" id="variation" value="single">
                                    <input type="number" step="0.01" class="form-control required_text"
                                        placeholder="Unit Cost" id="unit_cost" name="unit_cost" required=""
                                        value="{{ $stock->unit_cost }}">
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label style="font-weight: bold" for="unit_price">Selling Price</label>
                                    <input type="number" step="0.01" class="form-control required_text"
                                        placeholder="Selling Price" id="unit_price" name="unit_price" required=""
                                        value="{{ $stock->unit_price }}">
                                </div>
                            </div>
                            <div class="col-md-4" id="single-second-price">
                                <div class="form-group">
                                    <label style="font-weight: bold" for="second_price">Second Price</label>
                                    <input type="number" step="0.01" class="form-control" placeholder="Second Price"
                                        id="second_price" name="second_price" value="{{ $stock->second_price }}">
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label style="font-weight: bold" for="available_qty">Availabel Quantity</label>
                                    <input type="number" step="0.01" class="form-control"
                                        placeholder="Available Quantity" id="available_qty" name="qty"
                                        required=""
                                        @if (!empty($stock->qty)) value="{{ $stock->qty }}" @else value="0" @endif>
                                </div>
                            </div>
                        @else
                            <input type="hidden" id="variation" value="variable">
                        @endif
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold">Product Image</label>

                                <input class="form-control dropify" type="file" name="image" id="image"
                                    accept="image/*">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold">Current Image</label>
                                <img class="form-control" src="{{ asset($product->image) }}"
                                    style="width: 100px;height: 100px;object-fit: cover;margin-bottom: 20px">
                            </div>
                        </div>
                    </div>
                    <div id="combo_section" @if ($product->is_combo == 'no') hidden @endif hidden>
                        <div class="row justify-content-center">
                            <div class="col-md-6 ">
                                <div class="form-group">
                                    <div class="input-group">
                                        <select class="form-control select2 " multiple="multiple" name="products[]"
                                            id="product-list" data-placeholder="Select">
                                            @foreach ($combo_products as $combo_product)
                                                <option value="{{ $combo_product->combo_product_id }}" selected>
                                                    {{ $combo_product->product->product_name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="table-responsive dash-social" hidden>
                            <table id="datatable" class="table table-striped">
                                <thead class="thead-dark">
                                    <tr>
                                        <th>Product </th>
                                        <th>Qty</th>
                                    </tr>
                                    <!--end tr-->
                                </thead>

                                <tbody id="t-body">
                                    @foreach ($combo_products as $key => $combo_product)
                                        <tr>
                                            <td><input class="form-control" type="text"
                                                    name="combo[{{ $key }}][product_name]" id="product_name"
                                                    value="{{ $combo_product->product->product_name }}" readonly></td>
                                            <td><input type="hidden" class="form-control "
                                                    name="combo[{{ $key }}][product_id]" id="product_id"
                                                    value="{{ $combo_product->combo_product_id }}">
                                                <input type="number" class="form-control qty"
                                                    name="combo[{{ $key }}][qty]" id="qty"
                                                    value="{{ $combo_product->qty }}">
                                            </td>

                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>

                    </div>
                    <div class="row">
                        <div class="col-sm-12 text-right">
                            <button id="update-btn" type="submit" class="btn btn-primary px-5 py-2">Update</button>
                        </div>
                    </div>
                </form>
            </div>
            <!--end card-body-->
        </div>
    </div>

@endsection

@section('scripts')
    <script>
        $('#sku').keyup(function() {
            let input = $('#sku').val();
            let url = "{{ route('products.validate-sku') }}";
            $.ajax({
                method: 'POST',
                url: url,
                data: {
                    "_token": "{{ csrf_token() }}",
                    sku: input
                },
                success: function(response) {

                    if (response.is_have == 'yes') {
                        $('#sku').val('');
                        Swal.fire(
                            'Error',
                            'This SKU already used',
                            'warning'
                        )
                    }
                }
            })
        });

        $('#product-list').on('change', function() {
            let id = $('#product-list').val();
            // let ref_no = $('#ref_no').val();
            $.ajax({
                method: 'POST',
                url: "{{ url('/product/combo/add') }}",
                data: {
                    "_token": "{{ csrf_token() }}",
                    'id': id,
                    // 'ref_no':ref_no,

                },
                success: function(response) {

                    $('#datatable tbody').empty().html(response);


                }
            })
        });
        $(document).on('click', "#attribute-value-tbody input[type='number']", function() {
            $(this).select();
        });
        $(document).on('click', '#update-btn', function(e) {
            e.preventDefault();

            let product_type = $('#variation').val();
            if (product_type != '' && product_type == 'variable') {
                let row_count = $('#attribute-table tbody tr').length;
                if (row_count == 0) {
                    $.toast({
                        heading: 'Error',
                        text: "No Variations in table.!",
                        position: 'top-right',
                        bgColor: '#f1646c',
                        icon: 'error',
                        showHideTransition: 'fade',
                        loaderBg: '#ecf0f1'
                    });
                    return false;
                }

            }
            let item_flag = false;
            $('#attribute-table tbody tr').each(function() {
                let qty = $(this).find('td #qty').val();
                let unit_cost = $(this).find('td #unit_cost').val();
                let unit_price = $(this).find('td #unit_price').val();
                // parseFloat(qty) == 0 ||
                if (parseFloat(unit_cost) == 0 || parseFloat(unit_price) == 0) {
                    item_flag = true;
                }
                if (qty == '' || unit_cost == '' || unit_price == '') {
                    item_flag = true;
                }
            });
            if (item_flag) {
                $.toast({
                    heading: 'Error',
                    text: "Please add values to variations, cannot be emply or 0 values.!",
                    position: 'top-right',
                    bgColor: '#f1646c',
                    icon: 'error',
                    showHideTransition: 'fade',
                    loaderBg: '#ecf0f1'
                });
                return false;
            }

            //disable save button when form is not error
            var textValid = true;
            var comboValid = true;

            $('.required_text').each(function() {
                if ($(this).val() === '') {
                    textValid = false;
                    return; // skip remaining checks
                }
            });

            $('.required_combo').each(function() {
                if ($(this).val() === '') {
                    comboValid = false;
                    return; // skip remaining checks
                }
            });

            if (textValid == true && comboValid == true) {
                // $(this).prop("disabled", true);
            }

            $('#update-product-form').submit();
        });

        $(document).on('change', '#category', function() {
            let id = $(this).val();
            let select = '<option value="">Select</option>'
            if (id !== '') {
                let url = "{{ route('categories.get_sub_categories', ':id') }}";
                url = url.replace(':id', id);
                $.ajax({
                    method: 'GET',
                    url: url,
                    success: function(response) {
                        $('#sub_category_id').empty().html(response);
                    },
                    error: function(response) {
                        $('#sub_category_id').empty();
                    }
                });
            } else {
                $('#sub_category_id').empty();
            }
        });

        $(document).on('click', '#attribute', function() {
            let id = $('#att_id').val();
            if (id == '') {
                $('#attribute-value-tbody').empty();
                return false;
            }
            let url = "{{ route('products.get_attribute_values', ':id') }}";
            url = url.replace(':id', id);
            $.ajax({
                method: 'GET',
                url: url,
                success: function(result) {
                    $(result).appendTo($("#attribute-value-tbody"));
                },
            });
        });
        $(document).on('click', 'button.apply-all-qty', function() {
            var val = $(this).closest('tr').find('.qty').val();            
            var target_class = $(this).data('target-class');
            $(this).closest('tbody').find('tr').each(function() {
                element = $(this).find(target_class);
                element.val(val);
                element.change();
            });
        });
        $(document).on('click', 'button.apply-all-cost', function() {
            var val = $(this).closest('tr').find('#unit_cost').val();
            var target_class = $(this).data('target-class');
            $(this).closest('tbody').find('tr').each(function() {
                element = $(this).find(target_class);
                element.val(val);
                element.change();
            });
        });
        $(document).on('click', 'button.apply-all-price', function() {
            var val = $(this).closest('tr').find('#unit_price').val();
            var target_class = $(this).data('target-class');
            $(this).closest('tbody').find('tr').each(function() {
                element = $(this).find(target_class);
                element.val(val);
                element.change();
            });
        });
        $(document).on('click', '#remove-value', function() {
            this.closest('tr').remove();
        })
    </script>
@endsection