@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>
                <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)
                                        <option value="{{ $category->id }}" {{ $category->id == $product->category_id ? 'selected' : '' }}>
                                            {{ $category->category_name }}
                                        </option>
                                    @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)
                                        <option value="{{ $unit->id }}" {{ $unit->id == $product->unit_id ? 'selected' : '' }}>
                                            {{ $unit->actual_name . ' (' . $unit->short_name . ')' }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                
                                <label style="font-weight: bold" for="sku">SKU</label>
                                @if ($product->product_type != 'single' || $product->product_type != null)
                                   <input type="text" class="form-control" placeholder="SKU" id="sku" name="sku"
                                    value="{{ $product->sku }}" >
                                @else
                                    <input type="text" class="form-control" placeholder="SKU" id="sku" name="sku"
                                    value="{{ $product->sku }}" >
                                @endif
                                
                                <input type="hidden" class="form-control" placeholder="SKU" id="old_sku" name="old_sku"
                                    value="{{ $product->sku }}">
                            </div>
                        </div>

                        <!-- WooCommerce Sync Options -->
                        <div class="col-md-2 mt-2">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" id="allow_woocommerce_sync"
                                    name="allow_woocommerce_sync" {{ $product->allow_woocommerce_sync ? 'checked' : '' }}>
                                <label class="custom-control-label" for="allow_woocommerce_sync">Allow WooCommerce 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"
                                    name="product_visible_sync" {{ $product->product_visible_sync ? 'checked' : '' }}>
                                <label class="custom-control-label" for="product_visible_sync">WooCommerce Product Invisible Sync</label>
                            </div>
                        </div>

                        <!-- Conditional WooCommerce Sync Options -->
                        @if ($setting->second_woocommerece_api_setting_enable == '1')
                        <div class="col-md-2 mt-2">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" id="second_allow_woocommerce_sync"
                                    name="second_allow_woocommerce_sync" {{ $product->second_allow_woocommerce_sync ? 'checked' : '' }}>
                                <label class="custom-control-label" for="second_allow_woocommerce_sync">Second Allow WooCommerce 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="second_product_visible_sync"
                                    name="second_product_visible_sync" {{ $product->second_product_visible_sync ? 'checked' : '' }}>
                                <label class="custom-control-label" for="second_product_visible_sync">Second WooCommerce Product Invisible Sync</label>
                            </div>
                        </div>
                        @endif

                        <div class="col-md-2 mt-2">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" id="custom_website_sync"
                                    name="custom_website_sync" {{ $product->custom_website_sync ? 'checked' : '' }}>
                                <label class="custom-control-label" for="custom_website_sync">Custom Website WooCommerce Sync</label>
                            </div>
                        </div>

                        <!-- Reorder Level -->
                        <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>

                        <!-- Warranty Fields -->
                        <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" {{ $product->warranty_select == 'month' ? 'selected' : '' }}>Month</option>
                                    <option value="year" {{ $product->warranty_select == 'year' ? 'selected' : '' }}>Year</option>
                                    <option value="day" {{ $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>

                        <!-- Dynamic Attribute Handling -->
                        @if (!empty($product->attribute_id))
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label style="font-weight: bold" for="attribute_id">Attribute</label>
                                    <select class="form-control" id="attribute_id" name="attribute_id" required>
                                        @foreach ($attributes as $att)
                                            <option value="{{ $att->id }}" {{ $att->id == $product->attribute_id ? 'selected' : '' }}>
                                                {{ $att->attribute_name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-4" id="attri_value">
                                <div class="form-group">
                                    <label style="font-weight: bold">Variation Value</label>
                                    <select class="form-control" id="attribute_value_id" name="attribute_value_id">
                                        @foreach ($variation_values as $value)
                                            <option value="{{ $value->id }}" {{ in_array($value->id, $attribute_value) ? 'selected' : '' }}>
                                                {{ $value->value }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                        <div class="col-md-12">
                            <div class="table-responsive">
                                <table id="attribute-table" class="table table-bordered mb-3 table-centered">
                                    <thead class="thead-dark">
                                        <tr>
                                            <th>Attribute</th>
                                            <th>Variation Value</th>
                                            <th>Quantity</th>
                                            <th>Unit Price</th>
                                            <th>Selling Price</th>
                                            @if ($setting->second_woocommerece_api_setting_enable == '1')
                                                <th>Second WooCommerce Selling Price</th>
                                            @endif
                                            <th>Re-Seller Price</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody id="attribute-value-tbody">
                                        
                                        @foreach ($all_products as $key => $child_product)
                                            @php
                                                ++$key;
                                                $attribute = App\Attribute::find($child_product->attribute_id);
                                                $stocks = App\Stock::where('product_id', $child_product->id)->get(); // Fetch all stocks for the product
                                            @endphp
                                            <tr>
                                                <td>{{ $attribute->attribute_name }}</td>
                                                <td>{{ $child_product->attribute_value }}</td>
                                                <td>
                                                    @foreach ($stocks as $index => $stock)
                                                        <div class="d-flex align-items-center gap-2 flex-nowrap mb-1">
                                                            <span style="white-space: nowrap; margin-right: 20px;">Lot {{ $loop->iteration }}</span>
                                                            <input type="hidden" name="attribute_values[{{ $key }}][product_id]" value="{{ $child_product->id }}">
                                                            <input type="hidden" name="attribute_values[{{ $key }}][attribute_id]" value="{{ $child_product->attribute_id }}">
                                                            <input type="hidden" name="attribute_values[{{ $key }}][attribute_value_id]" value="{{ $child_product->attribute_value_id }}">
                                                            
                                                            @if ($loop->first)
                                                                <input type="number" class="form-control form-control-sm w-auto" name="attribute_values[{{ $key }}][qty]" value="{{ $stock->qty }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                            @else
                                                                <input type="number" class="form-control form-control-sm w-auto" value="{{ $stock->qty }}" readonly>
                                                            @endif
                                                        </div>
                                                    @endforeach
                                                </td>
                                                <td>
                                                    @foreach ($stocks as $stock)
                                                        @if ($loop->first)
                                                            <input type="number" step="0.01" class="form-control mb-1" name="attribute_values[{{ $key }}][unit_cost]" value="{{ $stock->unit_cost }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                        @else
                                                            <input type="number" step="0.01" class="form-control mb-1" value="{{ $stock->unit_cost }}" readonly>
                                                        @endif
                                                    @endforeach
                                                </td>                                    
                                                <td>
                                                    @foreach ($stocks as $stock)
                                                        @if ($loop->first)
                                                            <input type="number" step="0.01" class="form-control mb-1" name="attribute_values[{{ $key }}][unit_price]" value="{{ $stock->unit_price }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                        @else
                                                            <input type="number" step="0.01" class="form-control mb-1" value="{{ $stock->unit_price }}" readonly>
                                                        @endif
                                                    @endforeach
                                                </td>                                    
                                                @if ($setting->second_woocommerece_api_setting_enable == '1')
                                                    <td>
                                                        @foreach ($stocks as $stock)
                                                            @if ($loop->first)
                                                                <input type="number" step="0.01" class="form-control mb-1" name="attribute_values[{{ $key }}][second_woocomerece_unit_price]" value="{{ $stock->second_woocomerece_unit_price }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                            @else
                                                                <input type="number" step="0.01" class="form-control mb-1" value="{{ $stock->second_woocomerece_unit_price }}" readonly>
                                                            @endif
                                                        @endforeach
                                                </td>
                                                @endif
                                                <td>
                                                    @foreach ($stocks as $stock)
                                                        @if ($loop->first)
                                                            <input type="number" step="0.01" class="form-control mb-1" name="attribute_values[{{ $key }}][second_price]" value="{{ $stock->second_price }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                        @else
                                                            <input type="number" step="0.01" class="form-control mb-1" value="{{ $stock->second_price }}" readonly>
                                                        @endif
                                                    @endforeach
                                                </td>
                                                <td>
                                                    {{-- <button type="button" class="btn btn-danger remove-row">Remove</button> --}}
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    @endif

                        <div class="col-md-12">
                            <div class="form-group">
                                <label style="font-weight: bold" for="descrption">Description</label>
                                <textarea class="form-control" rows="5" id="descrption" name="descrption">{{ $product->descrption }}</textarea>
                            </div>
                        </div>

                        <!-- Handling for non-variable products -->
                        @if (empty($product->attribute_id))
                            <div class="table-responsive">
                                <table class="table table-bordered mb-3 table-centered">
                                    <thead class="thead-dark">
                                        <tr>
                                            <th style="width: 5%;"></th>
                                            <th>Available Quantity</th>
                                            <th>Unit Cost</th>
                                            <th>Selling Price</th>
                                            <th>Second WooCommerce Selling Price</th>
                                            <th>Re-Seller Price</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    @foreach ($stocks as $index => $stock)
                                        @if ($index == 0)
                                            <tr>
                                                <td>Lot {{$index +1}} </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" placeholder="Available Quantity"
                                                                                id="available_qty" name="qty" required value="{{ $stock->qty ?? 0 }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                </td>
                                                <td>
                                                    <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 }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                </td>
                                                <td>
                                                    <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 }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" placeholder="Second WooCommerce Unit Price"
                                                                                id="second_woocomerece_unit_price" name="second_woocomerece_unit_price" value="{{ $stock->second_woocomerece_unit_price }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" placeholder="Second Price"
                                                                                id="second_price" name="second_price" value="{{ $stock->second_price }}" @if ($setting->purchase_stock_option == '1') readonly @endif>
                                                </td>
                                            </tr>
                                        @else
                                            <tr>
                                                <td>Lot {{$index +1}} </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" value="{{ $stock->qty ?? 0 }}" readonly>
                                                </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" value="{{ $stock->unit_cost }}" readonly>
                                                </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" value="{{ $stock->unit_price }}" readonly>
                                                </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" value="{{ $stock->second_woocomerece_unit_price ?? 0.00 }}" readonly>
                                                </td>
                                                <td>
                                                    <input type="number" step="0.01" class="form-control" value="{{ $stock->second_price ?? 0.00 }}" readonly>
                                                </td>
                                            </tr>
                                        @endif
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        @endif

                        <!-- Image Upload -->
                        <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 img" src="{{ asset($product->image) }}" style="width: 100px;height: 100px;object-fit: cover;margin-bottom: 20px">
                            </div>
                        </div>

                        <!-- Combo Products -->
                        <div id="combo_section" @if ($product->is_combo == 'no') hidden @endif>
                            <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>
                                    </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]" value="{{ $combo_product->product->product_name }}" readonly></td>
                                                <td><input type="hidden" class="form-control" name="combo[{{ $key }}][product_id]" value="{{ $combo_product->combo_product_id }}">
                                                    <input type="number" class="form-control qty" name="combo[{{ $key }}][qty]" value="{{ $combo_product->qty }}">
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <!-- Submit Button -->
                        <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>
        </div>
    </div>

@endsection

@section('scripts')
    <script>
        // SKU validation
        $('#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');
                    }
                }
            });
        });

        // Add Attribute Row
        function addAttributeRow(selected, rowCount) {
            axios.get('{{ url('/value/product/add/') }}/' + selected + '/' + rowCount)
                .then(function(response) {
                    $('#attribute-value-tbody').append(response.data);
                })
                .catch(function(error) {
                    console.error(error);
                });
        }

        // Event handler for attribute value change
        $(document).on('change', '#attribute_value_id', function() {
            var selected = $(this).val();
            var rowCount = $('#attribute-value-tbody tr').length;
            addAttributeRow(selected, rowCount+1);
        });

        // Remove Attribute Row
        $(document).on('click', '.remove-row', function() {
            $(this).closest('tr').remove();
        });

        $(document).on('click', '.remove-value', function() {
            $(this).closest('tr').remove();
        });
        // Validation and Submission
        $(document).on('click', '#update-btn', function(e) {
            e.preventDefault();
            var isValid = true;

            // Validate variations
            $('#attribute-value-tbody tr').each(function() {
                let qty = $(this).find('input[name*="[qty]"]').val();
                let unit_cost = $(this).find('input[name*="[unit_cost]"]').val();
                let unit_price = $(this).find('input[name*="[unit_price]"]').val();

                if (qty === '' || unit_cost === '' || unit_price === '' || parseFloat(unit_cost) === 0 || parseFloat(unit_price) === 0) {
                    isValid = false;
                    return false;
                }
            });

            if (!isValid) {
                alert("Please fill in all the required fields with valid data.");
                return false;
            }

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

        // Load subcategories when category changes
        $(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();
            }
        });
    </script>
@endsection