@extends('buyer.adminlayout')
@section('title')
<title>Product</title>
@endsection
@section('frontend-content')
<!-- Main Content -->

<section class="container-fluid d-flex justify-content-center mt-3 p-3">
    <div class=" container mx-auto categories">
        <div class="d-flex justify-content-between align-items-center mb-3">
            <h3 class="mb-0">Product</h3>
            <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#categoryModal">
                Add Product
            </button>
        </div>
        <div class="col-12">
            <!-- Category Card -->
            <div class="category-item">

                <table id="product_table" class="display" style="width:100%; font-size: 12px;">
                    <thead>
                        <tr>
                            <th>SNO</th>
                            <th>Name</th>
                            <th>Category</th>
                            <th>Sub Category</th>
                            <th>RFID</th>
                            <th>Thumbnail Image</th>
                            <th>Price</th>
                            <th>Sample Count</th>
                            <th>Date</th>
                            <th>Action</th>

                        </tr>
                    </thead>
                    <tbody>
                        @php $i = 1; @endphp
                        @foreach($products as $productdata)
                        <tr data-id="{{ $productdata->id }}">
                            <td>{{ $loop->iteration }}</td>
                            <td>{{ $productdata->product_name }}</td>
                            <td>{{ optional($productdata->category)->category_name ?? 'N/A' }}</td>
                            <td>{{ optional($productdata->subcategory)->sub_category_name ?? 'N/A' }}</td>
                            <td>{{ $productdata->rfid }}</td>
                            <td class="p-0"><img src="{{ asset('storage/' . $productdata->thumbnail_image) }}" width="50" alt="Product Image"></td>
                            <td>{{ $productdata->price }}</td>
                            <td>{{ $productdata->sample_count }}</td>
                            <td>{{ $productdata->created_at->format('d-m-y') }}</td>
                            <td>
                                <!-- Edit Button -->
                                <!-- <a href="{{ route('admin.products.edit', $productdata->id) }}" class="btn btn-primary btn-sm">Edit</a> -->
                                <a href="#" class=" btn btn-warning btn-sm edit-btn" data-id="{{ $productdata->id }}"
                                    data-name=" {{ $productdata->product_name }}">Edit</a>
                                <!-- Delete Button -->
                                <form action="{{ route('admin.products.destroy', $productdata->id) }}" method="POST" style="display:none;"
                                    onsubmit="return confirm('Are you sure you want to delete this product?');">
                                    @csrf
                                    @method('DELETE')
                                    <button type="submit" class="btn btn-danger btn-sm">Delete</button>
                                </form>
                            </td>
                        </tr>
                        @endforeach


                    </tbody>
                </table>

            </div>

            <!-- Product Card -->

        </div>
    </div>
</section>


<!-- Modal for Adding Category -->
<div class="modal fade" id="categoryModal" tabindex="-1" aria-labelledby="categoryModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <form id="productForm" enctype="multipart/form-data">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="categoryModalLabel">Add Product</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <!-- Form to Add Category -->

                    <!-- Category Name -->
                    <div class="mb-3">
                        <label for="productName" class="form-label">Product Name</label>
                        <input type="text" class="form-control" name="product_name" id="productName" required>
                    </div>

                    <div class="mb-3">
                        <label for="category_name" class="form-label">Category</label>
                        <select class='form-control' name='category_id' id='category_id'>
                            <option value=''>Select Category</option>
                            @foreach($categories as $categorydata)
                            <option value='{{$categorydata->category_id}}'>{{$categorydata->category_name}}</option>

                            @endforeach
                        </select>
                    </div>


                    <div class="mb-3">
                        <label for="category_name" class="form-label">Sub Category</label>
                        <select id="subcategory_id" class="form-control" name="subcategory_id">
                            <option value="">Select Sub Category</option>
                        </select>
                    </div>

                    <div class="mb-3">
                        <label for="rfid" class="form-label">
                            RF-ID
                            <i class="bi bi-info-circle text-primary" data-bs-toggle="popover" data-bs-placement="right"
                                data-bs-content="A unique id. eg. GUACSO0001   GU-GainUp, RFID Prefix - 4 letter combination of Category and Sub-Category, 0001-Product id.">
                            </i>
                        </label>
                        <input type="text" id="rfid" class="form-control bg-secondary" name="rfid" readonly
                            placeholder="Auto-generated RF-ID">
                    </div>
                    <div class="mb-3">
                        <label for="price" class="form-label">Price</label>
                        <input type="text" class="form-control digits-only" name="price" id="price" required>
                    </div>
                    <div class="mb-3">
                        <label for="sample_count" class="form-label">Sample Count</label>
                        <input type="text" class="form-control digits-only" name="sample_count" id="sample_count" required>
                    </div>
                    <!-- Category Image -->
                    <div class="mb-3">
                        <label for="productImage" class="form-label">Thumbnail Image</label>
                        <input type="file" class="form-control" name="thumbnail_image" id="productImage_new_preview" required>
                    </div>

                    <div id="productImagePreviewContainer_newthumbnail" style="margin-top: 10px; display: flex; gap: 10px; flex-wrap: wrap;">
                        <!-- Images will be shown here -->
                    </div>

                    <div class="mb-3">
                        <label for="productImage" class="form-label">Product Image</label>
                        <input type="file" class="form-control" name="product_images[]" id="productImage_new" multiple required>
                    </div>
                    <div id="productImagePreviewContainer_newproduct" style="margin-top: 10px; display: flex; gap: 10px; flex-wrap: wrap;">
                        <!-- Images will be shown here -->
                    </div>

                    <!-- <div class="mb-3">
                        <label for="shortDescription" class="form-label">Short Description</label>
                        <textarea name="short_description" id="shortDescription" class="form-control"></textarea>
                    </div> -->

                    <!-- Product Description with CKEditor -->
                    <div class="mb-3">
                        <label for="productDescription" class="form-label">Product Description</label>
                        <textarea name="product_description" id="productDescription" class="form-control"></textarea>
                    </div>

                    <div class="mb-3">
                        <label for="additional_description" class="form-label">Additional Description</label>
                        <textarea name="additional_description" id="additional_description"
                            class="form-control"></textarea>
                    </div>

                    <div class="mb-3">
                        <label for="fabric" class="form-label">Fabric </label>
                        <input type="text" class="form-control" name="faberic" id="faberic" required>
                    </div>
                    <div class="mb-3">
                        <label for="construction" class="form-label">Construction<label>
                                <input type="text" class="form-control" name="construction" id="construction" required>
                    </div>
                    <div class="mb-3">
                        <label for="colors" class="form-label">Colors<label>
                                <input type="text" class="form-control" name="colors" id="colors" required>
                    </div>

                    <!-- Submit Button -->
                    <button type="submit" class="btn btn-primary">Add Product</button>
        </form>
    </div>
</div>
</div>
</div>


<div class="modal fade" id="editSubCategoryModal" tabindex="-1" aria-labelledby="editSubCategoryLabel"
    aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editSubCategoryLabel">Edit Product</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form id="producteditForm" enctype="multipart/form-data">
                @csrf
                @method('PUT')
                <div class="modal-content">

                    <div class="modal-body">
                        <!-- Form to Add Category -->

                        <!-- Category Name -->
                        <div class="mb-3">
                            <label for="productName" class="form-label">Product Name</label>
                            <input type="text" class="form-control" name="product_name" id="product_Name" required>
                        </div>

                        <div class="mb-3">
                            <label for="category_name" class="form-label">Category</label>
                            <select class='form-control' name='category_id' id='category_edit_id'>
                                <option value=''>Select Category</option>
                                @foreach($categories as $categorydata)
                                <option value='{{$categorydata->category_id}}'>{{$categorydata->category_name}}</option>

                                @endforeach
                            </select>
                        </div>


                        <div class="mb-3">
                            <label for="category_name" class="form-label">Sub Category</label>
                            <select id="subcategory_edit_id" class="form-control" name="subcategory_id">
                                <option value="">Select Sub Category</option>
                            </select>
                            <input type="hidden" name="product_id" id="edit_product_id">
                        </div>

                        <div class="mb-3">
                            <label for="rfid_edit" class="form-label">
                                RF-ID
                                <i class="bi bi-info-circle text-primary" data-bs-toggle="popover"
                                    data-bs-placement="right"
                                    data-bs-content="A unique id. eg. GUACSO0001   GU-GainUp, RFID Prefix - 4 letter combination of Category and Sub-Category, 0001-Product id.">
                                </i>
                            </label>
                            <input type="text" id="rfid_edit" class="form-control bg-secondary" name="rfid"
                                readonly placeholder="Auto-generated RF-ID">
                        </div>
                        <div class="mb-3">
                            <label for="price" class="form-label">Price</label>
                            <input type="text" class="form-control digits-only" name="price" id="price_edit">
                        </div>
                        <div class="mb-3">
                            <label for="sample_count" class="form-label">Sample Count</label>
                            <input type="text" class="form-control digits-only" name="sample_count" id="sample_count_edit">
                        </div>
                        <!-- Category Image -->
                        <div class="mb-3">
                            <label for="productImage" class="form-label">Thumbnail Image</label>
                            <input type="file" class="form-control" name="thumbnail_image" id="productImage_editthumbnail">
                            <img id="productthumbnailImagePreview" src="#" alt="product thumbnail Image"
                                style="max-width: 100px; margin-top: 10px; display: none;">
                        </div>
                        <div id="imageContainer_edit_thumbnail"></div>
                        <div class="mb-3">
                            <label for="productImage" class="form-label">Product Image</label>
                            <input type="file" class="form-control" name="product_images[]" id="productImage_edit_preview" multiple>

                            <div id="imageContainer_edit"></div>
                            <div id="imageContainer"></div>
                        </div>

                        <!-- <div class="mb-3">
                            <label for="shortDescription" class="form-label">Short Description</label>
                            <textarea name="short_description" id="short_Description" class="form-control"></textarea>
                        </div> -->

                        <!-- Product Description with CKEditor -->
                        <div class="mb-3">
                            <label for="product_edit_Description" class="form-label">Product Description</label>
                            <textarea name="product_description" id="product_edit_Description"
                                class="form-control"></textarea>
                        </div>

                        <div class="mb-3">
                            <label for="additional_description_edit" class="form-label">Additional Description</label>
                            <textarea name="additional_description" id="additional_description_edit"
                                class="form-control"></textarea>
                        </div>




                        <div class="mb-3">
                            <label for="fabric" class="form-label">Fabric </label>
                            <input type="text" class="form-control" name="faberic" id="faberic_edit" required>
                        </div>
                        <div class="mb-3">
                            <label for="construction" class="form-label">Construction<label>
                                    <input type="text" class="form-control" name="construction" id="construction_edit" required>
                        </div>
                        <div class="mb-3">
                            <label for="colors" class="form-label">Colors<label>
                                    <input type="text" class="form-control" name="colors" id="colors_edit" required>
                        </div>

                        <!-- Submit Button -->
                        <button type="submit" class="btn btn-primary">Update Product</button>
            </form>
        </div>
    </div>
</div>


@endsection
@push('custom-scripts')
<script>
    // Select all input fields with the digits-only class
    let digitInputs = document.querySelectorAll('.digits-only');

    // Apply digits-only restriction to each input
    digitInputs.forEach(input => {
        // Prevent non-digit keypresses
        input.addEventListener('keypress', (e) => {
            if (e.key < '0' || e.key > '9') {
                e.preventDefault();
            }
        });

        // Clean input on change to ensure only digits remain
        input.addEventListener('input', (e) => {
            e.target.value = e.target.value.replace(/[^0-9]/g, '');
        });

        // Prevent pasting non-digit content
        input.addEventListener('paste', (e) => {
            const pastedData = (e.clipboardData || window.clipboardData).getData('text');
            if (!/^[0-9]*$/.test(pastedData)) {
                e.preventDefault();
            }
        });
    });

    $(document).ready(function() {
        $('#product_table').DataTable({
            scroller: false,
            scrollY: 300,

            scrollCollapse: true,
            paging: false,
            dom: 'Bfrtip',
            buttons: [{
                extend: 'excelHtml5',
                exportOptions: {
                    columns: [0, 1, 2, 3, 4, 6, 7, 8]
                },
                title: 'Product List'
            }]
        });
    });

    CKEDITOR.replace('additional_description_edit');


    CKEDITOR.replace('additional_description_edit', {
        toolbar: [{
                name: 'basicstyles',
                items: ['Bold', 'Italic', 'Underline', 'Strike', 'RemoveFormat']
            },
            {
                name: 'paragraph',
                items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote']
            },
            {
                name: 'insert',
                items: ['Image', 'Table', 'HorizontalRule']
            },
            {
                name: 'styles',
                items: ['Format', 'Font', 'FontSize']
            },
            {
                name: 'colors',
                items: ['TextColor', 'BGColor']
            },
            {
                name: 'tools',
                items: ['Maximize']
            }
        ]
    });
    CKEDITOR.replace('additional_description');


    CKEDITOR.replace('additional_description', {
        toolbar: [{
                name: 'basicstyles',
                items: ['Bold', 'Italic', 'Underline', 'Strike', 'RemoveFormat']
            },
            {
                name: 'paragraph',
                items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote']
            },
            {
                name: 'insert',
                items: ['Image', 'Table', 'HorizontalRule']
            },
            {
                name: 'styles',
                items: ['Format', 'Font', 'FontSize']
            },
            {
                name: 'colors',
                items: ['TextColor', 'BGColor']
            },
            {
                name: 'tools',
                items: ['Maximize']
            }
        ]
    });
    $(document).ready(function() {

        $('#productImage_edit_preview').on('change', function(event) {

            let input = event.target;
            let previewContainer = $('#imageContainer_edit');
            previewContainer.html(''); // Clear previous previews

            if (input.files) {
                $.each(input.files, function(index, file) {
                    let reader = new FileReader();

                    reader.onload = function(e) {
                        let img = $('<img>').attr('src', e.target.result)
                            .css({
                                'max-width': '100px',
                                'height': '100px',
                                'object-fit': 'cover',
                                'border-radius': '5px'
                            });

                        previewContainer.append(img);
                    };

                    reader.readAsDataURL(file);
                });
            }
        });

        $('#productImage_editthumbnail').on('change', function(event) {

            let input = event.target;
            let previewContainer = $('#imageContainer_edit_thumbnail');
            previewContainer.html(''); // Clear previous previews

            if (input.files) {
                $.each(input.files, function(index, file) {
                    let reader = new FileReader();

                    reader.onload = function(e) {
                        let img = $('<img>').attr('src', e.target.result)
                            .css({
                                'max-width': '100px',
                                'height': '100px',
                                'object-fit': 'cover',
                                'border-radius': '5px'
                            });

                        previewContainer.append(img);
                    };

                    reader.readAsDataURL(file);
                });
                $('#productthumbnailImagePreview').hide();
            }
        });

        $('#productImage_new').on('change', function(event) {

            let input = event.target;
            let previewContainer = $('#productImagePreviewContainer_newproduct');
            previewContainer.html(''); // Clear previous previews

            if (input.files) {
                $.each(input.files, function(index, file) {
                    let reader = new FileReader();

                    reader.onload = function(e) {
                        let img = $('<img>').attr('src', e.target.result)
                            .css({
                                'max-width': '100px',
                                'height': '100px',
                                'object-fit': 'cover',
                                'border-radius': '5px'
                            });

                        previewContainer.append(img);
                    };

                    reader.readAsDataURL(file);
                });
            }
        });
    });
    $(document).ready(function() {
        $('#productImage_new_preview').on('change', function(event) {

            let input = event.target;
            let previewContainer = $('#productImagePreviewContainer_newthumbnail');
            previewContainer.html(''); // Clear previous previews

            if (input.files) {
                $.each(input.files, function(index, file) {
                    let reader = new FileReader();

                    reader.onload = function(e) {
                        let img = $('<img>').attr('src', e.target.result)
                            .css({
                                'max-width': '100px',
                                'height': '100px',
                                'object-fit': 'cover',
                                'border-radius': '5px'
                            });

                        previewContainer.append(img);
                    };

                    reader.readAsDataURL(file);
                });
            }
        });
    });

    $(document).ready(function() {
        var productId;
        $("#productForm").submit(function(e) {
            e.preventDefault(); // Prevent the default form submission

            // Create a new FormData object to handle the file upload
            var formData = new FormData(this);
            formData.append('product_description', CKEDITOR.instances['productDescription'].getData());
            formData.append('additional_description', CKEDITOR.instances['additional_description']
                .getData());


            // Send AJAX request
            $.ajax({
                url: "{{ route('admin.products.store') }}", // Your route for product store
                type: "POST",
                data: formData,
                processData: false, // Don't process the data
                contentType: false, // Don't set content type
                success: function(response) {
                    // Handle the success response
                    if (response.success) {
                        toastr.success("Product added successfully!");
                        $("#productForm")[0].reset(); // Reset form
                        $("#categoryModal").modal("hide");
                        location.reload();
                    } else {
                        alert('Error: ' + response.message);
                    }
                },
                error: function(xhr, status, error) {
                    // Handle the error response
                    alert('An error occurred: ' + error);
                }
            });
        });
    });

    document.addEventListener("DOMContentLoaded", function() {
        var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
        var popoverList = popoverTriggerList.map(function(popoverTriggerEl) {
            return new bootstrap.Popover(popoverTriggerEl);
        });
    });
</script>


<script>
    $(document).ready(function() {
        $('#category_id').change(function() {
            var categoryId = $(this).val();
            $('#subcategory_id').html('<option value="">Loading...</option>'); // Show loading text

            if (categoryId) {
                $.ajax({
                    url: "{{ route('get.subcategories') }}",
                    type: "GET",
                    data: {
                        category_id: categoryId
                    },
                    success: function(response) {
                        $('#subcategory_id').html('<option value="">Select Sub Category</option>');
                        $.each(response, function(key, subcategory) {
                            $('#subcategory_id').append('<option value="' + subcategory.id + '" data-prefix="' + subcategory.rfid_prefix + '">' + subcategory.sub_category_name + '</option>');
                        });
                    }
                });
            } else {
                $('#subcategory_id').html('<option value="">Select Sub Category</option>');
            }
        });
    });

    document.getElementById("subcategory_id")?.addEventListener("change", function() {
        const selectedOption = this.options[this.selectedIndex];
        const prefix = selectedOption.getAttribute("data-prefix") || "";

        fetch('/api/last-product-id')
            .then(res => res.json())
            .then(data => {
                const nextId = (data.last_id || 0) + 1;
                document.getElementById("rfid").value = `GU${prefix}${String(nextId).padStart(4, '0')}`;
            })
            .catch(err => {
                console.error("Error generating RFID:", err);
            });
    });
</script>



<script>
    let editProductId = null;
    $(document).ready(function() {
        $('#category_edit_id').change(function() {
            var categoryId = $(this).val();
            $('#subcategory_edit_id').html('<option value=""Loading... < /option > ');

            if (categoryId) {
                $.ajax({
                    url: "{{ route('get.subcategories') }}",
                    type: "GET",
                    data: {
                        category_id: categoryId
                    },
                    success: function(response) {
                        $('#subcategory_edit_id').html(
                            '<option value="">Select Sub Category</option>');
                        $.each(response, function(key, subcategory) {
                            $('#subcategory_edit_id').append('<option value="' +
                                subcategory
                                .id + '" data-prefix="' + subcategory.rfid_prefix + '">' + subcategory.sub_category_name +
                                '</option>');
                        });
                    }
                });
            } else {
                $('#subcategory_edit_id').html('<option value="">Select Sub Category</option>');
            }
        });
    });


    $('.edit-btn').on('click', function() {
        productId = $(this).data('id');
        editProductId = productId;
        $('#edit_product_id').val(editProductId);

        // Fetch sub-category data via AJAX
        $.ajax({
            url: '/product-edit/' + productId + '/edit',
            type: 'GET',
            success: function(data) {
                // Populate the form with the fetched data
                console.log(data.products);

                $('#product_Name').val(data.products.product_name);
                $('#faberic_edit').val(data.products.faberic);
                $('#construction_edit').val(data.products.construction);
                $('#colors_edit').val(data.products.colors);
                $('#rfid_edit').val(data.products.rfid);
                $('#price_edit').val(data.products.price);
                $('#sample_count_edit').val(data.products.sample_count);
                // $('#short_Description').text(data.products.colors);

                CKEDITOR.instances['product_edit_Description'].setData(data.products
                    .product_description);
                CKEDITOR.instances['additional_description_edit'].setData(data.products
                    .additional_description);
                var categorySelect = $('select[name="category_id"]');
                categorySelect.empty(); // Clear existing options
                categorySelect.append('<option value="">Select Category</option>');
                var subcategorySelect = $('select[name="subcategory_id"]');
                subcategorySelect.empty(); // Clear existing options
                subcategorySelect.append('<option value="">Select Sub Category</option>');
                data.categories.forEach(function(category) {
                    categorySelect.append(
                        `<option value="${category.category_id}"
                                                        ${category.category_id == data.products.category_id ? 'selected' : ''
                            }>${category.category_name}</option>`
                    );
                });

                data.subCategory.forEach(function(subcategorydata) {
                    subcategorySelect.append(
                        `<option value="${subcategorydata.id}"
                                                        ${subcategorydata.id == data.products.subcategory_id ? 'selected' : ''
                            }>${subcategorydata.sub_category_name}</option>`
                    );
                });

                // Show the sub-category image if it exists
                if (data.products.thumbnail_image) {
                    $('#productthumbnailImagePreview').attr('src', '/storage/' + data.products.thumbnail_image).show();


                } else {

                    $('#productthumbnailImagePreview').hide();
                }


                if (data.products.product_image) {
                    console.log(data.products.product_image);
                    let images = JSON.parse(data.products
                        .product_image); // Parse the JSON-encoded string
                    let imageContainer = $('#imageContainer');
                    imageContainer.empty(); // Clear previous
                    images.forEach((image, index) => {
                        let imagePath = '/storage/' + image;
                        let imageElement = `
                                                    <div class="image-preview" id="image-${index}">
                                                        <img src="${imagePath}" class="product-preview" width="100">
                                                        <button type="button" class="delete-image" data-index="${index}"
                                                            data-image="${image}">Delete</button>
                                                    </div>
                                                    `;
                        imageContainer.append(imageElement);
                    });


                    $('.delete-image').on('click', function() {
                        let imageToDelete = $(this).data('image');
                        let indexToDelete = $(this).data('index');

                        $.ajax({
                            url: '/delete-product-image', // Update with your actual delete route
                            type: 'POST',
                            data: {
                                image: imageToDelete,
                                product_id: data.products
                                    .id, // Send product ID to delete specific image
                                _token: $('meta[name="csrf-token"]')
                                    .attr(
                                        'content'
                                    ) // CSRF token for security
                            },
                            success: function(response) {
                                if (response.success) {
                                    $('#image-' + indexToDelete)
                                        .remove(); // Remove the image preview
                                } else {
                                    alert(
                                        'Failed to delete image');
                                }
                            },
                            error: function() {
                                alert('Error deleting image');
                            }
                        });
                    });








                } else {
                    $('#imageContainer').hide();

                    $('#productImagePreview').hide();
                }

                // Show the modal
                $('#editSubCategoryModal').modal('show');
            },
            error: function(xhr, status, error) {
                alert('An error occurred while fetching data: ' + xhr.responseText);
            }
        });
    });

    $('#subcategory_edit_id').on('change', function() {
        const selectedOption = $(this).find('option:selected');
        const prefix = selectedOption.data('prefix') || '';

        if (editProductId) {
            const newRFID = `GU${prefix}${String(editProductId).padStart(4, '0')}`;
            $('#rfid_edit').val(newRFID);
        } else {
            console.warn("Product ID not found. Cannot generate RFID.");
            $('#rfid_edit').val('');
        }
    });

    $('#producteditForm').on('submit', function(e) {
        e.preventDefault(); // Prevent default form submission

        let formData = new FormData(this);
        formData.append('product_description',
            CKEDITOR.instances['product_edit_Description'].getData());
        formData.append('additional_description',
            CKEDITOR.instances['additional_description_edit'].getData());

        formData.append('_method', 'PUT');

        $.ajax({
            url: '/buyerproductupdate/' + productId,
            type: 'POST', // Use POST instead of PUT for FormData
            data: formData,
            processData: false, // Required for FormData
            contentType: false, // Required for FormData
            success: function(response) {
                setTimeout(function() {
                    toastr.success("Product updated successfully!");

                    setTimeout(function() {
                        window.location.reload();
                    }, 3000); // Reload after 3 seconds
                }, 1000);
                $('#editSubCategoryModal').modal('hide');
                // Optionally refresh the table or page content
            },
            error: function(xhr, status, error) {
                alert('An error occurred: ' + xhr.responseText);
            }
        });
    });
</script>




<script>
    $(document).ready(function() {
        $('.delete-btn').click(function(e) {
            e.preventDefault();
            var form = $(this).closest('form');

            if (confirm("Are you sure you want to delete this Product?")) {
                form.submit();
            }
        });

        @if(session('success'))
        toastr.success("{{ session('success') }}");
        @endif

        @if(session('error'))
        toastr.error("{{ session('error') }}");
        @endif
    });
</script>
@endpush