@extends('layouts.light.master')
@section('title', 'Order')

@section('css')
    <link rel="stylesheet" type="text/css" href="{{ dynamic_url('assets/main/css/owlcarousel.css') }}">
@endsection

@section('style')
    <style>
        [id^=product_label_] {
            cursor: pointer;
            /* Makes the mouse pointer a hand */
        }

        .img_section:hover, .section-card:hover {
            cursor: pointer;
        }

        .default-according .card {
            margin-bottom: 10px;
        }

        .show {
            border: 1px solid #c0baba;
            border-top: none;
        }

        .table-xs th, .table-xs td {
            padding : .2rem 0rem !important;
        }
        @keyframes pulse {
            0% { box-shadow: 0 0 5px rgba(134, 141, 134, 0.7); }
            50% { box-shadow: 0 0 20px rgba(109, 117, 109, 0.9); }
            100% { box-shadow: 0 0 5px rgba(175, 190, 175, 0.7); }
        }

        .item:hover {
            animation: pulse 2s infinite;
        }

    </style>

@endsection
@section('breadcrumb-title')
    @if ($flag)
        <h2>Edit<span>Stock Check </span></h2>
    @else
        <h2>Create an<span>Order </span></h2>
    @endif
    
@endsection

@section('breadcrumb-items')

    @if ($flag)
        <li class="breadcrumb-item">Edit</li>
        <li class="breadcrumb-item active">Stock Check</li>
    @else
        <li class="breadcrumb-item">Order</li>
        <li class="breadcrumb-item active">Create</li>
    @endif
@endsection

@section('content')

    <div class="container-fluid">
        <div class="row">
            {{-- @if ($userType == 'admin') --}}
            <div class="form-group col-sm-6 col-lg-6 col-md-6 col-12">
                <label for="catalog_select" class="text-bold"><strong>Select Catalog:</strong></label>

                <select id="catalog_select" name="catalog_id" class="form-control">
                    <option value="">-- Choose Catalog --</option>
                    @foreach ($usersCatalogVisibilities as $catalog)
                        <option value="{{ $catalog->catalog_id }}">{{ $catalog->productCatalog->name }}</option>
                    @endforeach
                </select>
            </div>

            
            {{-- @else
                <div class="form-group col-6"></div>
            @endif --}}

            {{-- <div class="form-group col-6">
                <a style="float: right;" href="{{ url()->previous() }}" class="btn btn-primary">
                    ← Back
                </a>
            </div> --}}
        </div>
    </div>
    <input type="hidden" id="img_section_status" value="">
    <input type="hidden" id="flag" value="{{$flag}}">

    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-12">
                <div class="card b-r-0">
                    <div class="" id="card-body">


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

    <div class="container-fluid">
        <div class="row">
            <div class="card-body" id="card-body">
                <form action="#" action="POST">

                </form>
            </div>
            <div class="col-sm-12">
                <div class="row d-flex align-items-stretch">
                    <div class="col-xl-5 col-lg-5 col-md-12 col-sm-12 d-flex flex-column">
                        <input type="search" id="search_sku" placeholder="Enter SKU Number." name="search"
                            class="sku_no form-control" aria-label="Search">
                        <br>
                        <strong>
                            <b>NOTE: Do empty search to reset.</b>
                        </strong>
                        <strong>
                            <b>NOTE: Double click on Cabinet Label to select product.</b>
                        </strong>
                        <hr>

                        <div class="table-responsive double_table table-xs"
                            style="max-height: 250px; overflow-y: auto; overflow-x: hidden;">
                            <table id="searchResultsTable" class="table table-striped table-bordered table-sm">
                                <thead>
                                    <tr>
                                        <th>Cabinet Label</th>
                                        <th>SKU</th>
                                        <th>Description</th>
                                        <th>Weight</th>
                                        <th>Cost</th>
                                        <th>Qty</th>
                                    </tr>
                                </thead>
                                <tbody><!-- JS injects here --></tbody>
                            </table>
                        </div>

                        <div class="default-according" id="accordionclose">
                            @forelse ($product_sections as $sectionId => $section)
                                <div class="card b-r-0 section-card">
                                    <div data-bs-toggle="collapse"
                                        data-bs-target="#collapse{{ $section->id }}" aria-expanded="false"
                                        aria-controls="collapse{{ $section->id }}" class="card-header" id="heading{{ $section->id }}"
                                        style="background-color:#cfe2ff;">
                                        <h6 class="mb-0">
                                            <button class="btn btn-link" >
                                                {{ $section->cabinets_name }}
                                            </button>
                                        </h6>
                                    </div>
                                    <div id="collapse{{ $section->id }}" class="collapse"
                                        aria-labelledby="heading{{ $section->id }}" data-bs-parent="#accordionclose">
                                        <div class="p-1 card-body">
                                            <div class="table-responsive double_table double_table table-xs"
                                                style="max-height: 250px; overflow-y: auto; overflow-x: hidden;">
                                                <table
                                                    class="table p-0 m-0 display table-striped table-bordered table-sm sku-table"
                                                    id="myTable" style="table-layout: fixed; width: 100%;">
                                                    <thead>
                                                        <tr>
                                                            <th>Cabinet Label</th>
                                                            <th>SKU</th>
                                                            <th>Description</th>
                                                            <th>Weight</th>
                                                            <th>Cost</th>
                                                            <th>Qty</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @forelse ($productsBySection[$sectionId] ?? [] as $product)
                                                            <tr>
                                                                <td style="user-select: none;"
                                                                    id="product_label_{{ $product->id }}"
                                                                    name="{{ $product->door_factor }}">
                                                                    {{ $product->label }}</td>
                                                                <td>{{ $product->sku }}</td>
                                                                <td>{{ $product->sku . " - " . $product->doorColor->product_label }}</td>
                                                                <td>{{ $product->weight }}</td>
                                                                <td>{{ $product->cost }}</td>
                                                                <td>{{ $product->qty }}</td> {{-- You can customize this based on qty in room if needed --}}
                                                            </tr>
                                                        @empty
                                                            <tr>
                                                                <td colspan="6">No products found in this
                                                                    section.</td>
                                                            </tr>
                                                        @endforelse
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @empty
                                <p>There is nothing to show.</p>
                            @endforelse
                        </div>
                    </div>

                    <div class="col-xl-7 col-lg-7 col-md-12 col-sm-12 d-flex flex-column">
                        <div class="row border flex-grow-1" style="overflow: auto;">
                            <div class="box box-primary" style="overflow-x: auto;">
                                <strong class="mt-2">
                                    <b>Step #1: Please enter Job Name and Room before selecting items from
                                        inventory.</b>
                                </strong>
                                <div class="form-inline ">
                                    <span class="m-2">
                                        <b>
                                            Job Name <span class="astirisk font-danger">*</span>
                                        </b>
                                    </span>
                                    <input id="job_name" type="text" name="job_name" class="form-control"
                                        value="{{ old('job_name', $stockCheck->job_name ?? '') }}"
                                        placeholder="Enter Job Name." required autofocus>
                                    <button type="button" class="m-2 text-white btn btn-info" id="add_room_btn">+ ADD
                                        ROOM</button>
                                    <span class="" style="float:right;">
                                        <a href="#" id="clear_cart" class="m-2 btn btn-light">
                                            Clear Cart
                                        </a>
                                    </span>
                                </div>
                                <div class="">
                                    <strong class="m-2">Assemble All Cabinetry?<span
                                            class="asterisk font-danger">&nbsp;*</span></strong>
                                    <input type="radio" id="ass_required" name="assemble_cabinets_check" value="1"
                                        required autofocus>
                                    <label for="html">Yes</label>

                                    <input type="radio" id="" class="space_right" name="assemble_cabinets_check"
                                        value="2">
                                    <label for="css">No</label><span class="err_assemble_check"
                                        style="font-weight:525;"></span><br>
                                </div>
                                <div class="table-responsive">
                                    <table class="table table-bordered">
                                        <thead>
                                            <tr class="table-primary">
                                                <th>Double Check Work</th>
                                                <th>Cabinet Name</th>
                                                <th>Cabinet Description</th>
                                                <th>Weight</th>
                                                <th>Unit Price</th>
                                                <th>Total Price</th>
                                                <th>Quantity</th>
                                                <th>Delete</th>
                                            </tr>
                                        </thead>

                                        <tbody id="room_table_body"></tbody>
                                        <tfoot>
                                            <tr>
                                                <th></th>
                                                <th></th>
                                                <th></th>
                                                <th class="custom_all_product_weights">0lbs</th>
                                                <th></th>
                                                <th class="custom_all_product_total">$0.00</th>
                                                <th></th>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                                <div class="form-inline mb-1">
                                    <label><b>Comment</b></label>
                                    <textarea style="margin-left:1%; width:80%" rows="4" id="order_comment" name="order_comment" class="mt-2 form-control"
                                        maxlength="200">{{ old('order_comment', $stockCheck->comment ?? '') }}</textarea>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="clearfix m-2 box-footer pull-left text-center col-12">
                                <button class="btn btn-info" id="print_btn"
                                    name="print_btn">Print</button>
                                <button class="btn btn-info" id="save_quote_btn"
                                    onclick="checkvalidation(event,'quote')" name="save_quote_btn">Save
                                    Quote</button>
                                <button class="btn btn-info" id="save_shipping_quote_btn"
                                    onclick="checkvalidation(event,'shipping')" name="save_shipping_quote_btn">Request
                                    Shipping Quote</button>
                                {{-- 
                                <button class="btn btn-info" id="stock_check_btn" name="stock_check_btn" style="display:none">Update Stock Check</button> --}}
                                @if ($flag)
                                    <button class="btn btn-info" id="stock_check_btn" name="stock_check_btn">Update Stock
                                    Check</button>
                                @else
                                    <button class="btn btn-info" id="stock_check_btn" name="stock_check_btn">Stock
                                    Check</button>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="{{ dynamic_url('assets/main/js/form-wizard/form-wizard-two.js') }}"></script>
    <script src="{{ dynamic_url('assets/main/js/owlcarousel/owl.carousel.js') }}"></script>
    <script src="{{ dynamic_url('assets/main/js/owlcarousel/owl-custom.js') }}"></script>

    <script>
        document.addEventListener('DOMContentLoaded', () => {
            const leftCol = document.querySelector('.col-xl-5');  // adjust if needed
            const rightCol = document.querySelector('.col-xl-7'); // adjust if needed

            if (!leftCol || !rightCol) return;

            const syncHeight = () => {
                rightCol.style.height = leftCol.offsetHeight + 'px';
            };

            // Initial sync
            syncHeight();

            // Sync on window resize
            window.addEventListener('resize', syncHeight);

            // Live monitor with ResizeObserver
            const observer = new ResizeObserver(syncHeight);
            observer.observe(leftCol);
        });



        const allProducts = @json($products);

        // const originalJobName = stockCheck.job_name;
        // const originalComment = stockCheck.order_comment || ""; // in case it's null
        // const originalAssembleCheck = stockCheck.assemble_cabinets_check == 1 || stockCheck.assemble_cabinets_check ===
        //     "yes" ? "1" : "2";
        // const originalRooms = JSON.parse(stockCheck.rooms || "{}");

        function updateTotals() {
            let totalPrice = 0;
            let totalWeight = 0;

            $(".product_total_price").each(function() {
                totalPrice += parseFloat($(this).text().replace("$", "")) || 0;
            });

            $(".product_weight").each(function() {
                totalWeight += parseFloat($(this).text().replace("lbs", "")) || 0;
            });

            $(".custom_all_product_total").text(`$${totalPrice.toFixed(2)}`);
            $(".custom_all_product_weights").text(`${totalWeight.toFixed(2)}lbs`);
        }

        function loadCart() {
            $.get("{{ route('tenant_cart_get') }}", function(response) {
                console.log("Cart Response:", response); // For debugging
                $("#job_name").val(response.job_name);
                $("#room_table_body").empty(); // Clear existing table data

                // Group products by room
                let roomProducts = {};
                $.each(response.cart, function(_, product) {
                    let roomKey = product.room_name.trim().toLowerCase();
                    if (!roomProducts[roomKey]) {
                        roomProducts[roomKey] = [];
                    }
                    roomProducts[roomKey].push(product);
                });

                // Render rooms
                $.each(response.rooms, function(index, room) {
                    let roomKey = room.trim().toLowerCase();

                    $("#room_table_body").append(`
                    <tr class="show_room table-warning room_row" data-room-id="room${index}">
                        <td><label>Room<span class="astirisk font-danger">*</span></label></td>
                        <td colspan="5">
                            <input required value="${room}" type="text" name="roomlabel[]" placeholder="Enter Room Name." class="form-control room_input">
                        </td>
                        <td>
                            <button class="btn btn-outline-danger remove_room">x</button>
                        </td>
                    </tr>
                `);

                    // Render products under the room
                    if (roomProducts[roomKey]) {
                        $.each(roomProducts[roomKey], function(_, product) {
                            let productData = `
                            <tr data-id="${product.product_id}" class="product_row" name="${product.room_name}">
                                <td>
                                    <input type="checkbox" class="single_check">  <br>
                                    <input type="checkbox" class="double_check">
                                </td>
                                <td>${product.product_sku}</td>
                                <td>${product.product_description}</td>
                                <td class="product_weight">${product.product_weight || '0'}lbs</td>
                                <td>$${parseFloat(product.product_price).toFixed(2)}</td>
                                <td class="product_total_price">$${(product.quantity * parseFloat(product.product_price)).toFixed(2)}</td>
                                <td class="product_quantity">${product.quantity}</td>
                                <td>
                                    <button class="btn btn-outline-danger remove_product">x</button>
                                </td>
                            </tr>
                        `;
                            $("#room_table_body").append(productData);
                        });
                    }
                });

                updateTotals(); // If you have a total calculator function
            });
        }

        $(document).ready(function() {
            loadCart();
            const $input = $('#search_sku');
            // const $tables = $('.sku-table');
            const $sections = $('.section-card');
            const $resultsTable = $('#searchResultsTable');
            const $resultsBody = $resultsTable.find('tbody');

            function debounce(fn, delay = 150) {
                let timer;
                return function(...args) {
                    clearTimeout(timer);
                    timer = setTimeout(() => fn.apply(this, args), delay);
                };
            }

            function doSearch() {
                const filter = $input.val().toLowerCase().trim();
                const $tables = $('.sku-table'); // ✅ Re-fetch every time search runs
                $resultsBody.empty();

                if (!filter) {
                    // no filter → hide results, show all sections
                    $resultsTable.hide();
                    $sections.show();
                    $(".section-card").each(function() {
                        $(this).css("display", "block");
                    })
                    return;
                }

                // with filter → hide original sections
                $sections.hide();
                $(".section-card").each(function() {
                    $(this).css("display", "none");
                })

                // find & clone matches into results
                $tables.each(function() {
                    $(this).find('tbody tr').each(function() {
                        const sku = $(this).children('td').eq(1).text().toLowerCase();
                        if (sku.includes(filter)) {
                            $resultsBody.append($(this).clone());
                        }
                    });
                });

                // show or hide results based on matches
                if ($resultsBody.children().length) {
                    $resultsTable.show();
                } else {
                    $resultsTable.hide();
                    // optionally: show a “no results” message
                }
            }

            $input.on('keyup', debounce(doSearch));

            // initialize
            $resultsTable.hide();
        });
    </script>


    <script>
        const baseImageUrl = "{{ dynamic_url('assets/main/images/slider') }}";
        document.getElementById('catalog_select').addEventListener('change', function() {
            let catalogId = this.value;


            if (!catalogId) {
                $("#img_section_status").val('');
                $("#owl-carousel-1").remove();
                return;
            }

            $("#catalog_images").remove();

            fetch(`{{ route('tenant_stock_check_image') }}?catalog_id=${catalogId}`)
                .then(response => response.json())
                .then(data => {
                    // Create the carousel container
                    var itemsDiv = `
                        <div id="catalog_images" class="row">
                            <div class="col-md-12">
                                <div class="owl-carousel owl-theme owl-loaded owl-drag" id="owl-carousel-1">
                                    
                                </div>
                            </div>
                        </div>
                    `;

                    $("#card-body form").prepend(itemsDiv);

                    if (data.images.length === 0) {
                        $("#owl-carousel-1").append('<p>No images available for this catalog.</p>');
                        return;
                    }
                    //Append all Images
                    let html = '';
                    data.images.forEach(img => {
                        const img_name = img.image;
                        const door_color = img.product_label;
                        const door_id = img.id;
                        const catalog_id = img.product_catalog_id;
                        const imageUrl =
                            `/assets/main/images/slider/${img_name}`; // or use dynamic_url if needed

                        html += `
                            <div class="item">
                                <img onclick="img_section(this)" src="${imageUrl}" alt="${img_name}" class="img_section img-fluid rounded shadow-sm d-block mx-auto" data-catalog-id="${catalog_id}" data-door-id="${door_id}" />
                                <p class="text-center"><strong>${door_color}</strong></p>
                            </div>
                        `;
                    });

                    $("#owl-carousel-1").html(html); // Add all items first

                    // Then initialize the carousel once
                    $('#owl-carousel-1').owlCarousel({
                        loop: false,
                        margin: 10,
                        nav: true,
                        dots: true,
                        autoplay: false,
                        items: 1,
                        responsive: {
                            0: {
                                items: 1
                            },
                            576: {
                                items: 1
                            },
                            768: {
                                items: 2
                            },
                            1024: {
                                items: 3
                            },
                            1400: {
                                items: 4
                            }
                        }
                    });


                })
                .catch(error => {
                    console.error('Error fetching images:', error);
                    $("#card-body").prepend(
                        '<p class="text-danger">Error loading images. Please try again.</p>');
                });

        });




        function img_section(element) {
            $("#img_section_status").val('seleted');
            let door_id = $(element).attr('data-door-id').trim();
            let catalog_id = $(element).attr('data-catalog-id').trim();

            $.post("{{ route('stock_check_get_door') }}", {
                    _token: "{{ csrf_token() }}",
                    door_id: door_id,
                    catalog_id: catalog_id
                })
                .then(response => {
                    console.log(response)
                    $('#accordionclose').empty();
                    // Loop through each section and append new data
                    response.forEach(function(section) {
                        var sectionId = section.id;
                        var sectionHtml = `
                                <div class="card b-r-0 section-card">
                                    <div class="card-header" id="heading${section.id}" data-bs-toggle="collapse"
                                                data-bs-target="#collapse${section.id}" aria-expanded="false"
                                                aria-controls="collapse${section.id}" style="background-color:#cfe2ff;">
                                        <h6 class="mb-0">
                                            <button class="btn btn-link">
                                                ${section.cabinets_name}
                                            </button>
                                        </h6>
                                    </div>
                                    <div id="collapse${section.id}" class="collapse" 
                                        aria-labelledby="heading${section.id}" data-bs-parent="#accordionclose">
                                        <div class="p-1 card-body">
                                            <div class="table-responsive double_table table-xs" style="max-height: 250px; overflow-y: auto; overflow-x:hidden;">
                                                <table class="table p-0 m-0 display table-striped table-bordered table-sm sku-table" id ="myTable">
                                                    <thead>
                                                        <tr>
                                                            <th>Cabinet Label</th>
                                                            <th>SKU</th>
                                                            <th>Description</th>
                                                            <th>Weight</th>
                                                            <th>Cost</th>
                                                            <th>Qty</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody id="product-list-${section.id}">
                                                        <!-- Products will be loaded dynamically here -->
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            `;

                        // Append section HTML
                        $('#accordionclose').append(sectionHtml);

                        // Now add the products for this section
                        var productList = $('#product-list-' + section.id);
                        if (section.products.length > 0) {
                            section.products.forEach(function(product) {
                                var doorColor = product.door_color.product_label;
                                var productRow = `
                                        <tr>
                                            <td style="user-select: none;" id="product_label_${product.id}" name="${product.door_factor}">${product.label}</td>
                                            <td>${product.sku}</td>
                                            <td>${product.sku} - ${doorColor}</td>
                                            <td>${product.weight}</td>
                                            <td>${product.cost}</td>
                                            <td>${product.qty}</td>
                                        </tr>
                                    `;
                                productList.append(productRow);
                            });
                        } else {
                            productList.append(
                                '<tr><td colspan="6">No products found in this section.</td></tr>');
                        }
                    });

                })
                .catch(error => {
                    console.error("Error fetching data:", error);
                });
        }
    </script>

    <script>
        $(document).ready(function() {
            $(document).on('mousedown', '.card-header', function (e) {
                let selectedCatalog = $('#catalog_select').val();

                if (!selectedCatalog) {
                    e.preventDefault();
                    e.stopImmediatePropagation(); // Crucial for stopping Bootstrap event chain

                    Swal.fire({
                        icon: 'info',
                        title: 'Choose a Catalog',
                        text: 'You have to select a catalog first.',
                    });
                }

                let SelectedImgSection = $("#img_section_status").val();
                if (!SelectedImgSection) {
                    e.preventDefault();
                    e.stopImmediatePropagation(); // Crucial for stopping Bootstrap event chain

                    Swal.fire({
                        icon: 'info',
                        title: 'Select a Door Color',
                        text: 'You have to select a door color.',
                    });
                }
            });

            function updateTotals() {
                let totalPrice = 0;
                let totalWeight = 0;

                $(".product_total_price").each(function() {
                    totalPrice += parseFloat($(this).text().replace("$", "")) || 0;
                });

                $(".product_weight").each(function() {
                    totalWeight += parseFloat($(this).text().replace("lbs", "")) || 0;
                });

                $(".custom_all_product_total").text(`$${totalPrice.toFixed(2)}`);
                $(".custom_all_product_weights").text(`${totalWeight.toFixed(2)}lbs`);
            }

            $("#add_room_btn").click(function() {
                let jobName = $("#job_name").val().trim();
                if (jobName === "") {
                    Swal.fire({
                        icon: "warning",
                        title: "Missing Job Name",
                        text: "Please enter a Job Name before adding a room.",
                        confirmButtonText: "OK",
                        confirmButtonColor: "#d33"
                    });
                    return;
                }

                $.post("{{ route('tenant_cart_saveJobName') }}", {
                    _token: "{{ csrf_token() }}",
                    job_name: jobName
                });
                let uniqueRoomId = "room_" + new Date().getTime();

                let roomRow = `
                    <tr class="show_room table-warning" data-room-id="${uniqueRoomId}">
                        <td><label>Room<span class="astirisk font-danger">*</span></label></td>
                        <td colspan="5">
                            <input required type="text" name="roomlabel[]" placeholder="Enter Room Name." class="form-control room_input">
                        </td>
                        <td>
                            <button class="btn btn-outline-danger remove_room">x</button>
                        </td>
                    </tr>
                `;

                $("#room_table_body").append(roomRow);
                lastRoomRow = $("#room_table_body tr.show_room").last();

                let roomName = lastRoomRow.find(".room_input").val();

            });

            $(document).on("change", "#job_name", function(e) {
                let job_name = e.target.value;
                $.post("{{ route('tenant_job_name_change') }}", {
                    _token: "{{ csrf_token() }}",
                    job_name: job_name,
                });
            });

            $(document).on("click", "#clear_cart", function() {
                Swal.fire({
                    icon: "warning",
                    title: "Are you sure?",
                    text: "You want to clear your Cart.",
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Yes',
                    cancelButtonText: 'No'
                }).then((result) => {
                    if (result.isConfirmed) { // Only proceed if "Yes" is clicked
                        $.post("{{ route('tenant_cart_clear') }}", {
                            _token: "{{ csrf_token() }}"
                        }, function() {
                            Swal.fire({
                                icon: "success",
                                title: "Cleared!",
                                text: "Your cart has been cleared.",
                                confirmButtonColor: "#28a745",
                                confirmButtonText: "OK"
                            }).then(() => {
                                location.reload();
                            });
                        });
                    }
                });
            });

            $(document).on("click", ".remove_room", function() {
                let roomRow = $(this).closest("tr");
                let roomName = roomRow.find(".room_input").val();

                roomRow.nextUntil(".show_room").remove();
                roomRow.remove();
                updateTotals();

                $.post("{{ route('tenant_cart_removeRoom') }}", {
                    _token: "{{ csrf_token() }}",
                    room_name: roomName,
                });
            });

            $(document).on("dblclick", "[id^=product_label_]", function() {
                let door_factor = $(this).attr("name") || 1; // default to 1 if not set
                door_factor = parseFloat(door_factor) || 1; // make sure it's a number
                if ($(".show_room").length === 0) { // Check if there are no rooms
                    Swal.fire({
                        icon: "warning",
                        title: "Missing Room",
                        text: "Please add a room before selecting a product.",
                        confirmButtonText: "OK",
                        confirmButtonColor: "#d33"
                    });
                    return;
                }

                let valid = true;
                let firstInvalidInput = null;
                $('.room_input').each(function() {
                    if ($.trim($(this).val()) === '') {
                        valid = false;
                        firstInvalidInput = $(this);
                        return false; // break loop
                    }
                });

                if (!valid) {
                    Swal.fire({
                        icon: 'error',
                        title: 'Room name required',
                        text: 'Please enter a name for all rooms.',
                    }).then(() => {
                        firstInvalidInput.focus();
                    });
                    return;
                }

                let productRow = $(this).closest("tr");
                let productId = $(this).attr("id").replace("product_label_", "").trim();
                let productLabel = productRow.find("td:nth-child(1)").text().trim();
                let productSku = productRow.find("td:nth-child(2)").text().trim();
                let productDescription = productRow.find("td:nth-child(3)").text().trim();
                let productWeight = parseFloat(productRow.find("td:nth-child(4)").text().trim().replace(
                    "lbs",
                    "")) || 0;
                let productPrice = parseFloat(productRow.find("td:nth-child(5)").text().trim().replace("$",
                    "")) || 0;
                let newQty = 1;
                if (typeof productPrice !== 'number') {
                    productPrice = parseFloat(productPrice); // Convert to number if it's not already
                }

                productPrice = (productPrice * door_factor).toFixed(2);

                let lastRoomRow = $("#room_table_body").find(".show_room")
                    .last(); // Get the last room added

                // Ensure a room is selected before adding a product
                if (!lastRoomRow || lastRoomRow.find(".room_input").val().trim() === "") {
                    Swal.fire({
                        icon: "warning",
                        title: "Missing Room Name",
                        text: "Please enter a room name before selecting a product.",
                        confirmButtonText: "OK",
                        confirmButtonColor: "#d33"
                    });
                    return;
                }

                let existingProduct = $(`#room_table_body tr[data-id="${productId}"]`);
                if (existingProduct.length > 0) {
                    let qtyField = existingProduct.find(".product_quantity");
                    newQty = parseInt(qtyField.text()) + 1;
                    qtyField.text(newQty);
                    existingProduct.attr('data-quantity', newQty);

                    let totalPriceField = existingProduct.find(".product_total_price");
                    totalPriceField.text(`$${(newQty * productPrice).toFixed(2)}`);
                    let weightField = existingProduct.find(".product_weight");
                    weightField.text(`${(newQty * productWeight).toFixed(2)}lbs`);
                } else {
                    let productData = `
                        <tr data-id="${productId}" data-quantity="1">
                            <td>
                                <input type="checkbox" class="single_check">  <br>
                                <input type="checkbox" class="double_check">
                            </td>
                            <td>${productSku}</td>
                            <td>${productDescription} - ${productLabel}</td>
                            <td class="product_weight">${productWeight.toFixed(2)}lbs</td>
                            <td>$${productPrice}</td>
                            <td class="product_total_price">$${productPrice}</td>
                            <td class="product_quantity">1</td>
                            <td>
                                <button class="btn btn-outline-danger remove_product">x</button>
                            </td>
                        </tr>
                    `;

                    lastRoomRow.after(productData);
                }

                updateTotals();

                $.post("{{ route('tenant_cart_saveTotals') }}", {
                    _token: "{{ csrf_token() }}",
                    product_id: productId,
                    room_name: lastRoomRow.find(".room_input").val(),
                    product_label: productLabel,
                    product_sku: productSku,
                    product_description: productDescription + " - " + productLabel,
                    product_weight: productWeight,
                    product_price: productPrice,
                    quantity: newQty,
                });


            });

            $(document).on("click", ".remove_product", function() {
                let productRow = $(this).closest("tr");
                let productId = productRow.data("id");

                $.post("{{ route('cart.removeProduct') }}", {
                    _token: "{{ csrf_token() }}",
                    product_id: productId
                });

                productRow.remove();
                updateTotals();
            });


            $(document).on("click", "#save_quote_btn", function(event) {
                let errors = [];
                // Validate the Job Name
                let jobName = $("#job_name").val().trim();
                if (jobName === "") errors.push("Please enter a Job Name.");

                // Validate if at least one room is added
                let roomExists = $(".room_input").length > 0;
                if (!roomExists) errors.push("Please add at least one room.");

                // Validate if at least one product is added
                let productExists = $("#room_table_body tr[data-id]").length > 0;
                if (!productExists) errors.push("Please add at least one product.");

                // Validate if Assemble Cabinet option is selected
                let assembleRequired = $("input[name='assemble_cabinets_check']:checked").val();
                if (!assembleRequired) errors.push(
                    "Please select 'Yes' or 'No' for 'Assemble All Cabinetry'.");

                // If there are errors, display them in the Swal modal
                if (errors.length > 0) {
                    Swal.fire({
                        icon: "error",
                        title: "Incomplete Steps",
                        html: errors.join("<br>"), // Display errors
                        confirmButtonText: "OK",
                        confirmButtonColor: "#d33"
                    });
                    event.preventDefault();
                    return;
                }

                // Display Swal modal to confirm saving and request for quote name
                Swal.fire({
                    title: "Please enter the Quote Name",
                    input: 'text', // Input type is text
                    inputPlaceholder: 'Enter the Quote Name', // Placeholder text
                    inputAttributes: {
                        'aria-label': 'Enter the Quote Name'
                    },
                    showCancelButton: true,
                    confirmButtonText: "Save",
                    cancelButtonText: "Cancel",
                    confirmButtonColor: "#3085d6",
                    cancelButtonColor: "#d33",
                    allowOutsideClick: false,
                    preConfirm: (quoteName) => {
                        if (!quoteName || quoteName.trim() === "") {
                            Swal.showValidationMessage('Please enter a Quote Name');
                            return false;
                        }
                        return quoteName; // Return the entered quote name
                    }
                }).then((result) => {
                    if (result.isConfirmed) {
                        let quoteName = result.value; // The entered quote name
                        // Gather other form data for submission
                        let shippingStatus = "pending"; // Example shipping status
                        let roomsData = {};

                        $(".room_input").each(function() {
                            let roomRow = $(this).closest("tr");
                            let roomId = roomRow.attr("data-room-id");
                            let roomName = $(this).val().trim();

                            // Initialize room data with an empty product array
                            roomsData[roomId] = {
                                room_name: roomName,
                                products: []
                            };

                            $(".product_row").each(function(id, element) {
                                let roomType = $(element).attr('name');
                                if (roomName == roomType) {
                                    let productId = $(element).attr('data-id');
                                    let quantity = $(element).children().eq(5)
                                        .text() * 1 || 1;

                                    // Push product data into the correct room
                                    roomsData[roomId].products.push({
                                        product_id: productId,
                                        quantity: quantity
                                    });
                                }
                            });
                            console.log("final result: " + JSON.stringify(roomsData), null,
                                2);
                        });

                        // Send the data to the database via AJAX
                        $.ajax({
                            url: "{{ route('tenant_quotes_store') }}",
                            method: "POST",
                            data: {
                                _token: "{{ csrf_token() }}",
                                job_name: jobName,
                                quote_name: quoteName, // Include the quote name
                                rooms: roomsData,
                                assemble_cabinets_check: assembleRequired,
                            },
                            success: function(response) {
                                Swal.fire({
                                    icon: "success",
                                    title: "Stock Check Saved",
                                    text: response.message,
                                    confirmButtonText: "OK",
                                    confirmButtonColor: "#3085d6"
                                }).then(() => {
                                    window.location.href =
                                        "{{ route('tenant_quotes_index') }}";
                                });
                            },
                            error: function(xhr) {
                                if (xhr.status === 409 && xhr.responseJSON
                                    .already_exists) {
                                    Swal.fire({
                                        icon: "warning",
                                        title: "Duplicate Entry",
                                        text: xhr.responseJSON.message,
                                        confirmButtonText: "OK"
                                    });
                                } else {
                                    Swal.fire({
                                        icon: "error",
                                        title: "Error",
                                        text: "An error occurred while saving the stock check.",
                                        confirmButtonText: "OK"
                                    });
                                }
                            }
                        });
                    }
                });
            });


            $(document).on("click", "#save_shipping_quote_btn", function(event) {
                let errors = [];
                // Validate the Job Name
                let jobName = $("#job_name").val().trim();
                if (jobName === "") errors.push("Please enter a Job Name.");
                // Validate if at least one room is added
                let roomExists = $(".room_input").length > 0;
                if (!roomExists) errors.push("Please add at least one room.");
                // Validate if at least one product is added
                let productExists = $("#room_table_body tr[data-id]").length > 0;
                if (!productExists) errors.push("Please add at least one product.");
                // Validate if Assemble Cabinet option is selected
                let assembleRequired = $("input[name='assemble_cabinets_check']:checked").val();
                if (!assembleRequired) errors.push(
                    "Please select 'Yes' or 'No' for 'Assemble All Cabinetry'.");
                // If there are any validation errors, display them
                if (errors.length > 0) {
                    Swal.fire({
                        icon: "error",
                        title: "Incomplete Steps",
                        html: errors.join("<br>"),
                        confirmButtonText: "OK",
                        confirmButtonColor: "#d33"
                    });
                    event.preventDefault();
                    return;
                }

                // Step 1: Show a new notification asking for confirmation to proceed
                Swal.fire({
                    title: "Shipping Quote Request Confirmation",
                    text: "Selecting this option will lock your cart, please double check your items before asking for a shipping estimate If you ready to proceed, please fill out the needeed information.Thank you, TEAM",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonText: "Yes",
                    cancelButtonText: "Cancel",
                    confirmButtonColor: "#3085d6",
                    cancelButtonColor: "#d33",
                    allowOutsideClick: false
                }).then((result) => {
                    if (result.isConfirmed) {
                        // Step 2: Show the form with 'Save' button enabled
                        Swal.fire({
                            title: "Please enter shipping information for stock check",
                            text: "Click 'Save' to confirm.",
                            html: `
                                <div style="text-align: left;">
                                    <h4 style="font-weight: 900;">Delivery Type:</h4>
                                    <div class="notification">
                                        <input type="radio" checked id="delivery_commercial" name="delivery_type" value="1">
                                        <label for="html">Commercial</label>
                                        <input type="radio" id="delivery_residential" class="space_right" name="delivery_type" value="2">
                                        <label for="css">Residential</label><br>
                                    </div>
                                </div>
                                <div style="text-align: left;">
                                    <h4 style="font-weight: 900;">Will you require Liftgate?:</h4>
                                    <div class="notification">
                                        <input type="radio"  id="liftgate_yes" name="liftgate" value="1">
                                        <label for="html">Yes</label>
                                        <input type="radio" checked id="liftgate_no" class="space_right" name="liftgate" value="2">
                                        <label for="css">No</label><br>
                                    </div>
                                </div>

                                <div style="text-align: left;">
                                    <h4 style="font-weight: 900;">How will you unload?:</h4>
                                    <div class="notification">
                                        <input type="radio" id="unload_hand" name="unload" value="1">
                                        <label for="html">By Hand</label>
                                        <input type="radio" id="unload_forklift" checked class="space_right" name="unload" value="2">
                                        <label for="css">By ForkLift</label><br>
                                    </div>

                                    <div class="form-group term_n_cond_div" style="display: none; margin-top: 15px;">
                                        <label for="unload_type" style="font-weight:bold;">Terms &amp; Conditions for unload by hand:</label><br>
                                        <div class="terms_and_conditions" style="max-height: 300px; overflow-y: auto;">
                                        <p></p><h1><strong>Membership</strong></h1>
                                        <p>&nbsp;&nbsp; &nbsp;The use of Team Cabinet Distributors is subject to the following terms of use and conditions: The content of the pages of this catalog is for the “Registered” Members use only. Pricing and availability are subject to change without notice. No third parties may provide any additional warranty or guarantee, as to the accuracy, timeliness, performance, completeness or suitability of the information and materials found or offered in this manual or on our the ordering web portal, for any purpose, without the direct consent of Team Cabinet Distributors in writing, dated by an executive Team officer.&nbsp;<br>
                                        &nbsp;&nbsp; &nbsp;The “Registered” Member, acknowledges that such information and materials may contain inaccuracies or errors and we expressly exclude all liability for any inaccuracies or errors to the fullest extent permitted by law. The use of any information or materials in this catalog or on the ordering web portal is entirely at the “Members” risk, for which we shall not be liable. It shall be your own responsibility to ensure that any products, services or information available through this “Members” Catalog and Ordering Portals website meet “ALL” specific requirements. The catalog and website contains materials that are owned by Team Cabinet Distributors. All materials include, but is not limited to, the design, layout, look appearance and graphics from our Manufacturers. Reproduction is prohibited in accordance with United States Copyright Laws.&nbsp;<br>
                                        &nbsp;&nbsp; &nbsp;Unauthorized use of this “Member” ordering portal website, may give rise to a claim for damages and/or may be associated with a criminal offense of Intellectual Property. Team Cabinet Distributors is to be held harmless from any disputes between “Members” and “Members” Clients in the event of improper assembly and or lack of caring for products that have been accepted by all “Members”.<br>
                                        &nbsp;&nbsp; &nbsp;The use of this “Member” catalog and ordering portal website and any dispute arising out of such use of this website is subject to the laws of the United States and may include the termination of your “Membership”, in the event that the “Member” has allowed third “Unauthorized” users to this private ordering portal. All “Members” agree to adhere to the above-mentioned policies and agree to comply with all the descriptions of authorizations listed above.</p>

                                        <p>&nbsp;</p>

                                        <h1><strong>Claims and Return Policy</strong></h1>

                                        <p>Claims: It is of the utmost importance that upon delivery or pick up, you have verified BEFORE signing driver’s delivery slip. Any incorrect or missing items claims will NOT be honored once delivery is signed for. If there are missing or visibly damaged items, please make a note on driver’s delivery ticket and contact Team Cabinet Distributors immediately at 833-782-2697.</p>

                                        <p>Damaged items: In the event an item is defective/damaged please take a picture of said item, complete with box (showing item numbers) and email immediately to team@teamcabinets.com. <small>*Team Cabinet Distributors strives to provide excellent customer service and quality control.&nbsp;Including pictures of the packaging helps us determine where damage may have originated.</small></p>

                                        <p>Replacement of damaged items should be requested on a claim form via Team Cabinet Distributors website, or via email to team@teamcabinets.com. Remember to include a picture of item with box. Replacements are generally sent out within 2-3 days. Team Cabinet Distributors reserves the right to request the claimed item(s) be returned to Distributor. In the event item is not returned (upon request) Team Cabinet Distributors may charge Dealers account.&nbsp;</p>

                                        <p>&nbsp;</p>

                                        <h1>Damage and Replacement Policy&nbsp;</h1>

                                        <p>Freight Inspections: All PRODUCTS HAVE RECEIVING INSTRUCTIONS, AND FREIGHT CLAIMS POLICY RECEIVING INSTRUCTIONS. All cabinets are packaged individually into boxes and placed onto a pallet. The cabinets will be shipped via common carrier using the most efficient provider based both on estimated time and price. The cabinets can be shipped to businesses with and without a loading dock, residences, and construction sites. An authorized signature will be required on site to inspect and sign for the shipment. All destinations must be tractor-trailer accessible. If there are any problems concerning the delivery please contact us as soon as possible. All shipments should be thoroughly inspected for damage by the buyer, or the buyer’s designated recipient before the shipment is accepted. The buyer is responsible for all damage that occurs following receipt of the shipment.<br>
                                        &nbsp;&nbsp; &nbsp;Instructions:<br>
                                        &nbsp;&nbsp; &nbsp;1. PLEASE INSPECT THE SHIPMENT IMMEDIATELY UPON RECEIPT FOR ANY DAMAGE.<br>
                                        &nbsp;&nbsp; &nbsp;2. PLEASE SIGN FOR THE BOX COUNT AS WELL AS PALLETS THAT MAY BE DAMAGED.<br>
                                        &nbsp;&nbsp; &nbsp;3. The freight carrier has acknowledged the receipt of this shipment from our facilities in GOOD CONDITION. By your acceptance of the shipment from the carrier on the bill of lading, you, acknowledge that the product has been delivered in<br>
                                        GOOD CONDITION. Team Cabinet Distributors, cannot be responsible for loss or damages if you give the carrier a clean and clear receipt for the products you have now received<br>
                                        &nbsp;&nbsp; &nbsp;4. If any shortages or damages are discovered upon delivery, MAKE A DETAILED NOTATION FOR DAMAGES AND/OR SHORTAGE ON THE BILL OF LADING WITH A SHIPPING REPRESENTATIVE FROM THE CONTRACTED CARRIER. PRESENT THE DAMAGE BEFORE ACCEPTING THE ORDER. TAKE THE NEEDED TIME TO INSPECT YOU MERCHANDISE BE SIGNING ANY CLAIMS FOR SHORTAGES OR DAMAGES.</p>

                                        <p>&nbsp;&nbsp; &nbsp;1. Unconcealed damages require specific damages and/or shortages: Claims can be made only when it is indicated on the Bill of Lading AT THE TIME OF DELIVERY. The claim must then be reported by Email with pictures of said damages or missing items. No claims will be allowed without the properly signed paperwork from the Customer and the Transportation Company.<br>
                                        &nbsp;&nbsp; &nbsp;2. Concealed and Unconcealed Damages: Claims must be made within 72 HOURS OF PRODUCT DELIVERY. Claims must then be made by email to Team Cabinet Distributors at team@teamcabinets.com.<br>
                                        &nbsp;&nbsp; &nbsp;No claims will be allowed without the proper paperwork signed by the Customer and the Transportation Company. Return Policy: There are no returns due to the low pricing we have on our cabinetry. We recommend ordering a sample door to ensure the quality of our cabinetry is exactly what you are looking for before placing your order. All sales are considered final and no refunds, exchanges, or credits will be issued. In the event that a shipment is returned to Team Cabinet Distributors, the custom-er agrees and understands he/she will be responsible for any and all shipping costs associated with the transaction and all items returned are subject to a 25% restocking fee.&nbsp;<br>
                                        &nbsp;&nbsp; &nbsp;Team Cabinet Distributors Return Policy: All Items purchased from Team Cabinet Distributors are final and there will be no refunds or exchanges issued. Disclaimer: Customers assumes all responsibilities associated with handling, assembling or any other dealings with cabinets, trim or any other item ordered from Team Cabinet Distributors. Privacy Policy: By registering on the www.teamcabinets.com website you are accepting to the following terms and conditions of use, which together with our privacy policy governed by Team Cabinet Distributors in a relationship with you, the “Registered Member”.</p><p></p></div>
                                    </div>
                                </div>
                            `,
                            icon: "info",
                            width: '600px',
                            showCancelButton: true,
                            confirmButtonText: "Save",
                            cancelButtonText: "Cancel",
                            confirmButtonColor: "#3085d6",
                            cancelButtonColor: "#d33",
                            allowOutsideClick: false,
                            preConfirm: () => {
                                // Get the values of the radio buttons when "Save" is clicked
                                let deliveryType = document.querySelector(
                                    'input[name="delivery_type"]:checked');
                                let liftgate = document.querySelector(
                                    'input[name="liftgate"]:checked');
                                let unload = document.querySelector(
                                    'input[name="unload"]:checked');

                                // If any radio button is not selected, show validation message
                                if (!deliveryType || !liftgate || !unload) {
                                    Swal.showValidationMessage(
                                        "Please complete all fields.");
                                    return false; // Prevent form submission if any field is missing
                                }

                                // Return the values of the radio buttons
                                return {
                                    deliveryType: deliveryType.value,
                                    liftgate: liftgate.value,
                                    unload: unload.value
                                };
                            }
                        }).then((result) => {
                            if (result.isConfirmed) {
                                // Step 3: Gather the form data and prepare the AJAX request
                                const {
                                    deliveryType,
                                    liftgate,
                                    unload,
                                    shippingAddress
                                } = result.value;
                                let shippingStatus = result.isConfirmed ? "yes" : "pending";

                                let roomsData = {};

                                $(".room_input").each(function() {
                                    let roomRow = $(this).closest("tr");
                                    let roomId = roomRow.attr(
                                        "data-room-id"
                                    ); // Ensure it has a unique ID
                                    let roomName = $(this).val().trim();

                                    // Initialize room data with an empty product array
                                    roomsData[roomId] = {
                                        room_name: roomName,
                                        products: []
                                    };

                                    $(".product_row").each(function(id, element) {
                                        let roomType = $(element).attr(
                                            'name');
                                        if (roomName == roomType) {
                                            let productId = $(element).attr(
                                                'data-id');
                                            let quantity = $(element)
                                                .children().eq(5)
                                                .text() * 1 ||
                                                1; // Default quantity = 1

                                            // Push product data into the correct room
                                            roomsData[roomId].products
                                                .push({
                                                    product_id: productId,
                                                    quantity: quantity // ✅ Include quantity
                                                });
                                        }
                                    })
                                });

                                // Step 4: Show the loading spinner before sending the request
                                Swal.fire({
                                    title: "Processing your request...",
                                    html: "Please wait while we save your shipping quote.",
                                    didOpen: () => {
                                        Swal.showLoading();
                                    },
                                    allowOutsideClick: false, // Prevent the user from closing the modal
                                });

                                // Send the request via AJAX
                                $.post("{{ route('tenant_shipping_quotes_store') }}", {
                                    _token: "{{ csrf_token() }}",
                                    job_name: jobName,
                                    rooms: roomsData,
                                    assemble_cabinets_check: assembleRequired,
                                    shipping_status: "pending", // Ensure it's a string
                                    delivery_type: deliveryType,
                                    liftgate: liftgate,
                                    unload: unload,
                                    shipping_address: shippingAddress
                                }, function(response) {
                                    Swal.close(); // Close the loading modal

                                    Swal.fire({
                                        icon: "success",
                                        title: "Stock Check Saved",
                                        text: response.message,
                                        confirmButtonText: "OK",
                                        confirmButtonColor: "#3085d6"
                                    }).then(() => {
                                        window.location.href =
                                            "{{ route('tenant_shipping_quotes_index') }}";
                                    });
                                }).fail(function(xhr) {
                                    Swal.close(); // Close the loading modal

                                    if (xhr.status === 409 && xhr.responseJSON
                                        .already_exists) {
                                        Swal.fire({
                                            icon: "warning",
                                            title: "Duplicate Entry",
                                            text: xhr.responseJSON.message,
                                            confirmButtonText: "OK"
                                        });
                                    } else {
                                        Swal.fire({
                                            icon: "error",
                                            title: "Error",
                                            text: "An error occurred while saving the stock check.",
                                            confirmButtonText: "OK"
                                        });
                                    }
                                });
                            }
                        });
                    }
                });
            });


            $(document).on("click", "#stock_check_btn", function(event) {

                let errors = [];
                let comment = $("#order_comment").val();

                // Validate the Job Name
                let jobName = $("#job_name").val().trim();
                if (jobName === "") errors.push("Please enter a Job Name.");

                // Validate if at least one room is added
                let roomExists = $(".room_input").length > 0;
                if (!roomExists) errors.push("Please add at least one room.");

                // Validate if at least one product is added
                let productExists = $("#room_table_body tr[data-id]").length > 0;
                if (!productExists) errors.push("Please add at least one product.");

                // Validate if Assemble Cabinet option is selected
                let assembleRequired = $("input[name='assemble_cabinets_check']:checked").val();
                if (!assembleRequired) errors.push(
                    "Please select 'Yes' or 'No' for 'Assemble All Cabinetry'.");

                // If there are any validation errors, display them
                if (errors.length > 0) {
                    Swal.fire({
                        icon: "error",
                        title: "Incomplete Steps",
                        html: errors.join("<br>"),
                        confirmButtonText: "OK",
                        confirmButtonColor: "#d33"
                    });
                    event.preventDefault();
                    return;
                }

                // Display Swal modal with a "Save" button
                Swal.fire({
                    title: "Please enter shipping information for stock check",
                    text: "Click 'Save' to confirm.",
                    html: `
                        <div style="text-align: left;">
                            <h4 style="font-weight: 900;">Delivery Type:</h4>
                            <div class="notification">
                                <input type="radio" checked id="delivery_commercial" name="delivery_type" value="1">
                                <label for="html">Commercial</label>
                                <input type="radio" id="delivery_residential" class="space_right" name="delivery_type" value="2">
                                <label for="css">Residential</label><br>
                            </div>
                        </div>
                        <div style="text-align: left;">
                            <h4 style="font-weight: 900;">Will you require Liftgate?:</h4>
                            <div class="notification">
                                <input type="radio"  id="liftgate_yes" name="liftgate" value="1">
                                <label for="html">Yes</label>
                                <input type="radio" checked id="liftgate_no" class="space_right" name="liftgate" value="2">
                                <label for="css">No</label><br>
                            </div>
                        </div>

                        <div style="text-align: left;">
                            <h4 style="font-weight: 900;">How will you unload?:</h4>
                            <div class="notification">
                                <input type="radio" id="unload_hand" name="unload" value="1">
                                <label for="html">By Hand</label>
                                <input type="radio" id="unload_forklift" checked class="space_right" name="unload" value="2">
                                <label for="css">By ForkLift</label><br>
                            </div>

                            <div class="form-group term_n_cond_div" style="display: none; margin-top: 15px;">
                                <label for="unload_type" style="font-weight:bold;">Terms &amp; Conditions for unload by hand:</label><br>
                                <div class="terms_and_conditions" style="max-height: 300px; overflow-y: auto;">
                                <p></p><h1><strong>Membership</strong></h1>
                                <p>&nbsp;&nbsp; &nbsp;The use of Team Cabinet Distributors is subject to the following terms of use and conditions: The content of the pages of this catalog is for the “Registered” Members use only. Pricing and availability are subject to change without notice. No third parties may provide any additional warranty or guarantee, as to the accuracy, timeliness, performance, completeness or suitability of the information and materials found or offered in this manual or on our the ordering web portal, for any purpose, without the direct consent of Team Cabinet Distributors in writing, dated by an executive Team officer.&nbsp;<br>
                                &nbsp;&nbsp; &nbsp;The “Registered” Member, acknowledges that such information and materials may contain inaccuracies or errors and we expressly exclude all liability for any inaccuracies or errors to the fullest extent permitted by law. The use of any information or materials in this catalog or on the ordering web portal is entirely at the “Members” risk, for which we shall not be liable. It shall be your own responsibility to ensure that any products, services or information available through this “Members” Catalog and Ordering Portals website meet “ALL” specific requirements. The catalog and website contains materials that are owned by Team Cabinet Distributors. All materials include, but is not limited to, the design, layout, look appearance and graphics from our Manufacturers. Reproduction is prohibited in accordance with United States Copyright Laws.&nbsp;<br>
                                &nbsp;&nbsp; &nbsp;Unauthorized use of this “Member” ordering portal website, may give rise to a claim for damages and/or may be associated with a criminal offense of Intellectual Property. Team Cabinet Distributors is to be held harmless from any disputes between “Members” and “Members” Clients in the event of improper assembly and or lack of caring for products that have been accepted by all “Members”.<br>
                                &nbsp;&nbsp; &nbsp;The use of this “Member” catalog and ordering portal website and any dispute arising out of such use of this website is subject to the laws of the United States and may include the termination of your “Membership”, in the event that the “Member” has allowed third “Unauthorized” users to this private ordering portal. All “Members” agree to adhere to the above-mentioned policies and agree to comply with all the descriptions of authorizations listed above.</p>

                                <p>&nbsp;</p>

                                <h1><strong>Claims and Return Policy</strong></h1>

                                <p>Claims: It is of the utmost importance that upon delivery or pick up, you have verified BEFORE signing driver’s delivery slip. Any incorrect or missing items claims will NOT be honored once delivery is signed for. If there are missing or visibly damaged items, please make a note on driver’s delivery ticket and contact Team Cabinet Distributors immediately at 833-782-2697.</p>

                                <p>Damaged items: In the event an item is defective/damaged please take a picture of said item, complete with box (showing item numbers) and email immediately to team@teamcabinets.com. <small>*Team Cabinet Distributors strives to provide excellent customer service and quality control.&nbsp;Including pictures of the packaging helps us determine where damage may have originated.</small></p>

                                <p>Replacement of damaged items should be requested on a claim form via Team Cabinet Distributors website, or via email to team@teamcabinets.com. Remember to include a picture of item with box. Replacements are generally sent out within 2-3 days. Team Cabinet Distributors reserves the right to request the claimed item(s) be returned to Distributor. In the event item is not returned (upon request) Team Cabinet Distributors may charge Dealers account.&nbsp;</p>

                                <p>&nbsp;</p>

                                <h1>Damage and Replacement Policy&nbsp;</h1>

                                <p>Freight Inspections: All PRODUCTS HAVE RECEIVING INSTRUCTIONS, AND FREIGHT CLAIMS POLICY RECEIVING INSTRUCTIONS. All cabinets are packaged individually into boxes and placed onto a pallet. The cabinets will be shipped via common carrier using the most efficient provider based both on estimated time and price. The cabinets can be shipped to businesses with and without a loading dock, residences, and construction sites. An authorized signature will be required on site to inspect and sign for the shipment. All destinations must be tractor-trailer accessible. If there are any problems concerning the delivery please contact us as soon as possible. All shipments should be thoroughly inspected for damage by the buyer, or the buyer’s designated recipient before the shipment is accepted. The buyer is responsible for all damage that occurs following receipt of the shipment.<br>
                                &nbsp;&nbsp; &nbsp;Instructions:<br>
                                &nbsp;&nbsp; &nbsp;1. PLEASE INSPECT THE SHIPMENT IMMEDIATELY UPON RECEIPT FOR ANY DAMAGE.<br>
                                &nbsp;&nbsp; &nbsp;2. PLEASE SIGN FOR THE BOX COUNT AS WELL AS PALLETS THAT MAY BE DAMAGED.<br>
                                &nbsp;&nbsp; &nbsp;3. The freight carrier has acknowledged the receipt of this shipment from our facilities in GOOD CONDITION. By your acceptance of the shipment from the carrier on the bill of lading, you, acknowledge that the product has been delivered in<br>
                                GOOD CONDITION. Team Cabinet Distributors, cannot be responsible for loss or damages if you give the carrier a clean and clear receipt for the products you have now received<br>
                                &nbsp;&nbsp; &nbsp;4. If any shortages or damages are discovered upon delivery, MAKE A DETAILED NOTATION FOR DAMAGES AND/OR SHORTAGE ON THE BILL OF LADING WITH A SHIPPING REPRESENTATIVE FROM THE CONTRACTED CARRIER. PRESENT THE DAMAGE BEFORE ACCEPTING THE ORDER. TAKE THE NEEDED TIME TO INSPECT YOU MERCHANDISE BE SIGNING ANY CLAIMS FOR SHORTAGES OR DAMAGES.</p>

                                <p>&nbsp;&nbsp; &nbsp;1. Unconcealed damages require specific damages and/or shortages: Claims can be made only when it is indicated on the Bill of Lading AT THE TIME OF DELIVERY. The claim must then be reported by Email with pictures of said damages or missing items. No claims will be allowed without the properly signed paperwork from the Customer and the Transportation Company.<br>
                                &nbsp;&nbsp; &nbsp;2. Concealed and Unconcealed Damages: Claims must be made within 72 HOURS OF PRODUCT DELIVERY. Claims must then be made by email to Team Cabinet Distributors at team@teamcabinets.com.<br>
                                &nbsp;&nbsp; &nbsp;No claims will be allowed without the proper paperwork signed by the Customer and the Transportation Company. Return Policy: There are no returns due to the low pricing we have on our cabinetry. We recommend ordering a sample door to ensure the quality of our cabinetry is exactly what you are looking for before placing your order. All sales are considered final and no refunds, exchanges, or credits will be issued. In the event that a shipment is returned to Team Cabinet Distributors, the custom-er agrees and understands he/she will be responsible for any and all shipping costs associated with the transaction and all items returned are subject to a 25% restocking fee.&nbsp;<br>
                                &nbsp;&nbsp; &nbsp;Team Cabinet Distributors Return Policy: All Items purchased from Team Cabinet Distributors are final and there will be no refunds or exchanges issued. Disclaimer: Customers assumes all responsibilities associated with handling, assembling or any other dealings with cabinets, trim or any other item ordered from Team Cabinet Distributors. Privacy Policy: By registering on the www.teamcabinets.com website you are accepting to the following terms and conditions of use, which together with our privacy policy governed by Team Cabinet Distributors in a relationship with you, the “Registered Member”.</p><p></p></div>
                            </div>
                        </div>
                    `,
                    icon: "info",
                    width: '600px',
                    showCancelButton: true,
                    confirmButtonText: "Save",
                    cancelButtonText: "Cancel",
                    confirmButtonColor: "#3085d6",
                    cancelButtonColor: "#d33",
                    allowOutsideClick: false,
                    preConfirm: () => {
                        // Get the values of the radio buttons when "Save" is clicked
                        let deliveryType = document.querySelector(
                            'input[name="delivery_type"]:checked');
                        let liftgate = document.querySelector('input[name="liftgate"]:checked');
                        let unload = document.querySelector('input[name="unload"]:checked');

                        // If any radio button is not selected, show validation message
                        if (!deliveryType || !liftgate || !unload) {
                            Swal.showValidationMessage("Please complete all fields.");
                            return false; // Prevent form submission if any field is missing
                        }

                        // Return the values of the radio buttons
                        return {
                            deliveryType: deliveryType.value,
                            liftgate: liftgate.value,
                            unload: unload.value
                        };
                    }
                }).then((result) => {
                    if (result.isConfirmed) {
                        console.log("result is good")
                        // Extract the values from result.value
                        const {
                            deliveryType,
                            liftgate,
                            unload
                        } = result.value;

                        let shippingStatus = result.isConfirmed ? "yes" : "pending";

                        let roomsData = {};

                        $(".room_input").each(function() {
                            // console.log("this is every room_input: " + JSON.stringify($(this), null, 2))
                            let roomRow = $(this).closest("tr");
                            let roomId = roomRow.attr(
                                "data-room-id"); // Ensure it has a unique ID
                            let roomName = $(this).val().trim();

                            console.log(roomName)

                            // Initialize room data with an empty product array
                            roomsData[roomId] = {
                                room_name: roomName,
                                products: []
                            };

                            $(".product_row").each(function(id, element) {
                                console.log(element)
                                let roomType = $(element).attr('name');
                                console.log(roomType)
                                if (roomName == roomType) {
                                    let productId = $(element).attr('data-id');
                                    let quantity = $(element).children().eq(6)
                                        .text() * 1 ||
                                        1; // Default quantity = 1

                                    // Push product data into the correct room
                                    roomsData[roomId].products.push({
                                        product_id: productId,
                                        quantity: quantity // ✅ Include quantity
                                    });
                                }
                            })
                            // Loop through the products associated with this room

                            roomRow.find(".product_row").each(function() {
                                // console.log("found product: " + JSON.stringify($(this), null, 2))
                                let productId = $(this).attr("data-id");
                                let productLabel = $(this).find("td:eq(1)").text()
                                    .trim();
                                let productDescription = $(this).find("td:eq(2)")
                                    .text().trim();
                                let productWeight = parseFloat($(this).find(
                                        ".product_weight")
                                    .text()) || 0;
                                let productPrice = parseFloat($(this).find(
                                    ".product_total_price").text().replace(
                                    "$", "")) || 0;
                                let productQuantity = parseInt($(this).find(
                                        ".product_quantity")
                                    .text()) || 1;
                                // console.log("productId: " + productId)

                                // Push product data into the correct room
                                roomsData[roomId].products.push({
                                    product_id: productId,
                                    label: productLabel,
                                    description: productDescription,
                                    weight: productWeight,
                                    price: productPrice,
                                    quantity: productQuantity
                                });
                            });
                            console.log("final result: " + JSON.stringify(roomsData), null,
                                2);
                        });
                        var flag = $("#flag").val();
                        // Example: Send these values via AJAX or update your page UI
                        $.post("{{ route('stock_check.store') }}", {
                            _token: "{{ csrf_token() }}",
                            flag: flag,
                            job_name: jobName,
                            rooms: roomsData,
                            assemble_cabinets_check: assembleRequired,
                            shipping_status: "pending", // Ensure it's a string
                            delivery_type: deliveryType,
                            liftgate: liftgate,
                            unload: unload,
                            comment: comment
                        }, function(response) {
                            Swal.fire({
                                icon: "success",
                                title: "Stock Check Saved",
                                text: response.message,
                                confirmButtonText: "OK",
                                confirmButtonColor: "#3085d6"
                            }).then(() => {
                                window.location.href =
                                    "{{ route('tenant_stock_check_index') }}";
                            });
                        }).fail(function(xhr) {
                            if (xhr.status === 409 && xhr.responseJSON.already_exists) {
                                Swal.fire({
                                    icon: "warning",
                                    title: "Duplicate Entry",
                                    text: xhr.responseJSON.message,
                                    confirmButtonText: "OK"
                                });
                            } else {
                                Swal.fire({
                                    icon: "error",
                                    title: "Error",
                                    text: "An error occurred while saving the stock check.",
                                    confirmButtonText: "OK"
                                });
                            }
                        })
                    }
                });
            });

            $(document).on('change', 'input[name="unload"]', function() {
                // Get the selected value of the 'unload' radio buttons
                let unloadValue = $("input[name='unload']:checked").val();

                // Toggle visibility of the terms and conditions div based on selection
                if (unloadValue === "1") { // "By Hand" is selected
                    $(".term_n_cond_div").show(); // Show the terms and conditions divs
                } else {
                    $(".term_n_cond_div").hide(); // Hide the terms and conditions div
                }
            });

            $(document).on('click', '#print_btn', function() {
                let jobName = $("#job_name").val().trim();

                 // Construct the full URL using JS, replacing the param in the path
                let url = `/tenants/create-order/print/${encodeURIComponent(jobName)}`;

                const printWindow = window.open(url, '_blank');
                printWindow.focus();

            });

        });
    </script>
    <script>
        console.log("jQuery loaded:", typeof $ !== 'undefined');
        console.log("OwlCarousel loaded:", typeof $.fn.owlCarousel !== 'undefined');

        
        $('#owl-carousel-1').owlCarousel({
            loop: false, // Prevents cloning
            margin: 10,
            nav: true,
            dots: true,
            autoplay: false, // Prevents automatic looping
            items: 1, // Ensures only one item per slide
            responsive: {
                0: {
                    items: 1
                },
                576: {
                    items: 1
                },
                768: {
                    items: 2
                },
                1024: {
                    items: 3
                },
                1400: {
                    items: 4
                }
            }
        });
    </script>


@endsection