function viewPRWOCanvass() {
    loader = $('#overlay, #loader');
    $('#addItemWOCanvass').modal('show');
    $('#addItemWOCanvass').css('z-index', 1065);
    cleanupColumnSearch('#PRItemTable');
    if (!isLoaded) {
        tableName = '#PRItemTable';
        totalSelectedLabel = $('#totalSelected');

        clearTableSelection(tableName, selectedProductsMap, () => {
            totalSelectedLabel.text(0);
        }, 'selected-row', '.select-all-CanvassItem-checkbox');

        tableElement = $(tableName);
        tableDestroy($(tableName));

        PRItemTable = tableElement.DataTable({
            ajax: $.extend({
                url: '/POMgmt/GetPRWOCanvass',
            }, beforeComplete(loader)),
            language: {
                emptyTable: "No record available"
            },
            columns: colPOPRList,
            pageLength: 5,
            lengthMenu: [[5, 10, 25, 50, 100, -1], [5, 10, 25, 50, 100, "All"]],
            initComplete: function () {
                initializeTableSelectionWithDuplicateCheck({
                    tableName: tableName,
                    dataTable: PRItemTable,
                    selectedItemsMap: selectedProductsMap,
                    idKey: 'prDetailsId',
                    idKey2: 'itemNo',
                    checkboxClass: '.select-item-checkbox',
                    selectAllClass: '.select-all-item-checkbox',
                    selectedRowClass: 'selected-row',
                    updateCountCallback: function () {
                        totalSelectedLabel.text(getSelectedCount(selectedProductsMap));
                    }
                });
                initializeSearchAndSelection(PRItemTable);
            },
        });
        isLoaded = true;
    } else {
        setTimeout(() => {
            PRItemTable.draw();
            initializeSearchAndSelection(PRItemTable);
        }, 100);
    }
}
function initializeSearchAndSelection(PRItemTable) {
    initializeColumnSearch({
        tableId: '#PRItemTable',
        dataTable: PRItemTable,
        searchableColumns: [
            {
                columnIndex: 1,
                columnName: 'PR No',
                placeholder: 'Enter PR Number...',
                searchType: 'text',
                searchMode: 'exact',
                width: '150px'
            },
            {
                columnIndex: 4,
                columnName: 'Item No',
                placeholder: 'Enter Item Number...',
                searchType: 'text',
                searchMode: 'exact',
                width: '150px'
            },
            {
                columnIndex: 5,
                columnName: 'Item Name',
                placeholder: 'Enter Item Name...',
                searchType: 'text',
                searchMode: 'contains',
                width: '200px'
            },
            {
                columnIndex: 7,
                columnName: 'Created By',
                placeholder: 'Select Creator...',
                searchType: 'select',
                searchMode: 'exact',
                width: '150px'
            }
        ]
    });

    const uniqueSearchClass = 'column-search-input-PRItemTable';

    populateSelectOptions(PRItemTable, 7, '.' + uniqueSearchClass + '[data-column="7"]');

    restoreSearchFromURL(uniqueSearchClass, '#PRItemTable');
}
function viewPRForTagging(data,Query) {
    loader = $('#overlay, #loader');
    $('#viewPRForTagging').modal('show');
    $('#viewPRForTagging').css('z-index', 1065);
    if (data.supplierId) {
        $('#supplierId').val(data.supplierId);
        document.getElementById('t-supplierName').innerHTML = data.supplierName
        SupplierId = $('#supplierId').val();
    }

    tableName = '#ItemForTaggingTable';
    totalSelectedLabel = $('#totalSelTag');
    cleanupColumnSearch(tableName);

    clearTableSelection(tableName, selectedProductsMap, () => {
        totalSelectedLabel.text(0);
    }, 'selected-row', '.select-all-CanvassItem-checkbox');
    tableElement = $(tableName);
    tableDestroy($(tableName));

    PRItemTable = tableElement.DataTable({
        ajax: $.extend({
            url: '/CanvassMgmt/GetMyPRWOCanvass',
            type: 'GET',
            data: { Query, SupplierId },
        }, beforeComplete(loader)),
        language: {
            emptyTable: "No record available"
        },
        columns: colPRList,
        pageLength: 5,
        lengthMenu: [[5, 10, 25, 50, 100, -1], [5, 10, 25, 50, 100, "All"]],
        initComplete: function () {
            initializeTableSelection({
                tableName: tableName,
                dataTable: PRItemTable,
                selectedItemsMap: selectedProductsMap,
                idKey: 'prDetailsId',
                idKey2: 'batchNo',
                checkboxClass: '.select-CanvassItem-checkbox',
                selectAllClass: '.select-all-CanvassItem-checkbox',
                selectedRowClass: 'selected-row',
                updateCountCallback: function () {
                    totalSelectedLabel.text(getSelectedCount(selectedProductsMap));
                }
            });
            initializeColumnSearch({
                tableId: tableName,
                dataTable: PRItemTable,
                searchableColumns: [
                    {
                        columnIndex: 1,
                        columnName: 'PR No',
                        placeholder: 'Enter PR Number...',
                        searchType: 'text',
                        searchMode: 'exact',
                        width: '150px'
                    },
                    {
                        columnIndex: 4,
                        columnName: 'Item No',
                        placeholder: 'Enter Item Number...',
                        searchType: 'text',
                        searchMode: 'exact',
                        width: '150px'
                    },
                    {
                        columnIndex: 5,
                        columnName: 'Item Name',
                        placeholder: 'Enter Item Name...',
                        searchType: 'text',
                        searchMode: 'contains',
                        width: '200px'
                    },
                    {
                        columnIndex: 7,
                        columnName: 'PR By',
                        placeholder: 'Select PRBy...',
                        searchType: 'select',
                        searchMode: 'exact',
                        width: '150px'
                    }
                ]
            });
            const uniqueSearchClass = 'column-search-input-ItemForTaggingTable';

            populateSelectOptions(PRItemTable, 7, '.' + uniqueSearchClass + '[data-column="7"]');
        },
    });
}
function viewPRItemDetail(data) {
    loader = $('#overlay, #loader').css('z-index', 1070);
    $("#uomName").on('keyup', function () {
        populateUOM();
    });
    let PRDetailsId = data.prDetailsId;
    $.ajax($.extend({
        url: '/POMgmt/GetPRWOCanvass',
        type: 'GET',
        data: { PRDetailsId },
        success: function (data) {
            if (data && data.data && data.data.length > 0) {

                var item = data.data[0];

                $('#itemName').val(item.itemName);
                $('#itemDescription').val(item.itemDescription);
                $('#specification').val(item.specification);
                $('#itemQty').val(item.qty);
                $('#uomName').val(item.uomName);
                $('#uomId').val(item.uomId);
                $('#prDetailsId').val(item.prDetailsId);
                $('#denied-itemNo').val(item.itemNo);

                var itemPicturePath = item.itemAttachPath;
                if (!itemPicturePath || itemPicturePath === 'N/A' || itemPicturePath === 'None') {
                    $('#itemPictureImage').attr('src', '/Content/Common/empty.jpg');
                } else {
                    var imageUrl = item.urlImg + itemPicturePath;
                    // Set the image source
                    $('#itemPictureImage').attr('src', imageUrl);
                }

                $('#viewPRItemDetail').modal('show');
                $('#viewPRItemDetail').css('z-index', 1070);
            } else {
                console.log('Data is null or undefined');
            }
        },
        error: errorHandler
    }, beforeComplete(loader)));
}
function viewPOItemDetail(data) {
    loader = $('#overlay, #loader').css('z-index', 1070);
    $("#uomName").on('keyup', function () {
        populateUOM();
    });
    let PONo = data.poNo;
    let PRDetailsId = data.prDetailsId;
    $.ajax($.extend({
        url: '/POMgmt/GetPOItemDetail',
        type: 'GET',
        data: { PRDetailsId, PONo },
        success: function (data) {
            if (data && data.data && data.data.length > 0) {

                var item = data.data[0];

                $('#itemName').val(item.itemName);
                $('#itemDescription').val(item.itemDescription);
                $('#specification').val(item.specification);
                $('#itemQty').val(item.qty);
                $('#uomName').val(item.uomName);
                $('#uomId').val(item.uomId);
                $('#unitPrice').val(item.unitPrice);
                $('#prDetailsId').val(item.prDetailsId);
                $('#c-poRemarks').val(item.remarks);
                $('#P-paymentTerms').val(item.paymentTerms);
                $('#P-paymentTermsId').val(item.paymentTermsId);
                $('#P-portOfDischarge').val(item.portOfDischarge);
                $('#P-portOfDischarge-id').val(item.podId);          

                $("#P-paymentTerms").on('keyup', function () {
                    popTerms();
                });
                var poTypeId = $('#potype-cancel').val();
                if (poTypeId == 3) {
                    document.getElementById('P-portOfDischarge').style.display = 'flex';
                    document.getElementById('pod-label').style.display = 'flex';
                    $("#P-portOfDischarge").on('keyup', function () {
                        popPortOfDisCharge();
                    });
                } else {
                    document.getElementById('P-portOfDischarge').style.display = 'none';
                    document.getElementById('pod-label').style.display = 'none';
                }
                // Check if item picture path is null or empty
                var itemPicturePath = item.itemAttachPath;
                if (!itemPicturePath || itemPicturePath === 'N/A' || itemPicturePath === 'None') {
                    $('#itemPictureImage').attr('src', '/Content/Common/empty.jpg'); 
                } else {
                    var imageUrl = item.urlImg + itemPicturePath;
                    // Set the image source
                    $('#itemPictureImage').attr('src', imageUrl);
                }
                $('#viewPOItemDetail').modal('show');
                $('#viewPOItemDetail').css('z-index', 1070);
            } else {
                console.log('Data is null or undefined');
            }
        },
        error: errorHandler
    }, beforeComplete(loader)));
}
function populateUOM() {
    $("#uomName").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "/ItemMgmt/GetItemUOM",
                data: { query: request.term },
                success: function (result) {
                    if (result && result.success && Array.isArray(result.data)) {

                        var formattedData = result.data.map(item => ({
                            label: item.label || '', // Use an empty string if undefined
                            value: item.value !== undefined && item.value !== null ? item.value.toString() : ''
                        }));

                        // console.log('formattedData value:', formattedData);
                        response(formattedData);
                    } else {
                        console.error('Invalid data format received:', result);
                        response([]); // Return an empty array to clear the dropdown
                    }
                }
            });
        },
        minLength: 2,
        select: function (event, ui) {
            $('#uomName').val(ui.item.label);
            $('#uomId').val(ui.item.value);
            return false;
        },
        focus: function (event, ui) {
            event.preventDefault();
        },
        open: function () {
            var dropdown = $(".ui-autocomplete");

            dropdown.css({
                "max-height": "200px", 
                "overflow-y": "auto"  
            });
        },
        messages: {
            noResults: '',
            results: function (count) {
                return count + (count > 1 ? ' results' : ' result');
            }
        }
    });
}