function taglist(e) {
    $("#second_contain").css('display', 'block');
    $("#set_id_tag").val(e.id)
    // document.getElementById("set_id_tag").value = e;
    console.log('11111e', e);
    // $('#myInput').html('');
    // $('#action_table').append(event);
    // document.getElementById('myInput').value = event;
    var autolevel = $(e).data('autolevel');
    var auto_asana = $(e).data('autonomous');
    $('#selectAll').prop('checked', false);
    selectedchecks = [];
    var btn_ref = document.querySelectorAll(".btn_ref");
    btn_ref.forEach(e => {
        e.classList.remove("active");
    });
    if (!e.classList.contains("active")) {
        e.classList.add("active");
    }
    $.ajax({
        type: "post",
    url: "{{ route('uncategorised') }}",
    // method: "POST",
    data: {
        ref: 'gettagsbyid',
        id: e.id,
        // checked: e.checked ? 1 : 0,
    },
    beforeSend: function() {
        $(".spinner-box").show();
    },
    success: function(response) {
        console.log('tadresponse', JSON.parse(response),e.id);
        var data = JSON.parse(response);

        const itemsPerPage = 10;
        let currentPage = 1;

        
        if(data.length == 0) {
            $('#action_table_tbody').html(`
                <tr>
                    <td colspan="8" style="background: #f2f2f2;border-left: none;border-right: none;color:#000 !important;">No data available in table</td>
                <tr>
            `);
            $('#pagnation_top').css('visibility', 'hidden');
        }else{
            $('#pagnation_top').css('visibility', 'visible');
            function displayTableData(data, currentPage) {
                // console.log('callllll',data,currentPage);
        const startIndex = (currentPage - 1) * itemsPerPage;
        const endIndex = startIndex + itemsPerPage;

        const paginatedData = data.slice(startIndex, endIndex);
        // console.log('paginatedData',paginatedData);
// console.log('paginatedData',data.slice(1,10));
        $('#action_table_tbody').html("");
            paginatedData.map((d, i) => {
                
                console.log('kkkkkkk',d);
                
            var status;
                if (d.asana_status == 0) {
                    // status = `<span class="open_red" style="padding: 5px 10px;">Open</span>`;
                    status = `<div id="asanatickebtn1" data-asbody="`+d.body+`" data-tagidss='`+e.id+`' data-assubject="`+d.Subject+`" data-asupcid="`+d.id+`" Onclick="asanatickebtn1(this)" align="center"><span class="progres_yellow" style="cursor:pointer;background: #7ab75e;">  Create Ticket with <img src="../images/asana_logo.svg" alt="asana logo" class="asana_logo" /></span></div>`;

                } else if (d.asana_status == 1) {
                    status = `<div id="asanatickebtn1" data-asbody="`+d.body+`" data-tagidss='`+e.id+`' data-assubject="`+d.Subject+`" data-asupcid="`+d.id+`" Onclick="asanatickebtn1(this)" align="center"><span class="progres_yellow" style="cursor:pointer;background: #7ab75e;">  Create Ticket with <img src="../images/asana_logo.svg" alt="asana logo" class="asana_logo" /></span></div>`;
                } else if (d.asana_status == 2) {
                   if (d.ce_status == 0) {
                        status = `<div align="center"><span class="progres_yellow" data-id="`+d.Subject+`" data-to="`+d.from_addr+`" data-procss="`+i+`" onclick="open_popup_a(`+d.asana_ticketid+`,this)">Ticket Created in <img src="../images/asana_logo.svg" alt="asana logo" class="asana_logo"></span></div>`;
                    }else if(d.ce_status == 1){
                        status = `<div align="center"><span class="progres_yellow" data-id="`+d.Subject+`" data-to="`+d.from_addr+`" data-procss="`+i+`" style="background: #106bfd;" onclick="open_popup_a(`+d.asana_ticketid+`,this)">New Response from <img src="../images/asana_logo.svg" alt="asana logo" class="asana_logo"></span></div>`;
                    }else if(d.ce_status == 2){
                        status = `<div align="center"><span class="progres_yellow" data-id="`+d.Subject+`" data-to="`+d.from_addr+`" data-procss="`+i+`" data-cestatus="`+d.ce_status+`" data-asnansta="`+d.asana_status+`" style="background: #92959a;" onclick="open_popup_a(`+d.asana_ticketid+`,this)">Responded to User</span></div>`;
                    } 
              
                } else if (d.asana_status == 3) {
                    status = `<span class="close_green">Closed</span>`;
                }
                else{
                    
                status = `<span class="close_green">d.ce_status</span>`;	
                    
                }

            var chkbx = '-';
                if (!d.tag_id.includes(',') && d.asana_status == '0') {
                    chkbx =
                        `<input type="checkbox" class="checkbox" data-subje="` +
                        d.Subject + `" data-body="` + d.body + `" value="` + d
                        .id + `" onclick="multiselectchk(this)">`;
                }

                let subtags = '';
                                                
                
            // <td>`+formatDate(d.date_sent_received)+`</td>

            var tbody_row = `
                    <tr>
                        <td>`+d.from_addr+`</td>
                        <td>`+d.Subject+`</td>
                        <td>`+formatDate(d.date_sent_received)+`</td>
                        <td><div id="subtagsrow` + i + `" class="subtagsrow"></div></td>
                        <td>`+status+`</td>
                        <td><i  style="font-size:35px;cursor: pointer;" id="` + d.id +
                    `" data-value="` + d.from_addr + `" onclick="showModel(this)">
                    <img style="background-color: grey;padding: 6px;border-radius: 8px;" src="../images/arr_right.svg"></i></td>
                        
                        <td>
                            <div style="display: flex;flex-direction: column;">
                                <img src="../images/chevron-back-outline.svg" id="HCHEZ757`+i+`" Onclick="JwUeotobH_close('`+i+`')" style="display:none;height:24px;width:24px;transform: rotate(90deg);cursor: pointer;"/>
                                <img src="../images/chevron-forward-outline.svg" id="pOsKz0u8`+i+`" Onclick="JwUeotobH('`+i+`')" style="height:24px;width:24px;transform: rotate(90deg);cursor: pointer;"/>
                            </div>
                        </td>
                    </tr>
                    <tr id="mail_tr_drop`+i+`">
                        <td colspan="8" style=" " class="ss" id="mail_td_drop`+i+`" >
                            <div id="bb_div`+i+`" class="bb_div" style="height: 0px;">
                                <div style="display:flex;" class="card_setup">
                                <div class="progress" id="progress`+i+`"></div>
                                    <div class="un_icon">
                                        <img src="../images/mailin.gif" class="img" />
                                        <span Onclick="yBQVqzRwD(25)" class="">New Email Received </span>
                                    </div>
                                    <div class="un_icon">
                                       <img src="../images/asana-logo.png" class="img">
                                        <span Onclick="yBQVqzRwD(25)" class="" style="left: -79px;">Ticket Created in <img src="../images/asana_logo.svg" style="width: 50px;"></span>
                                    </div>
                                    <div class="un_icon">
                                        <img src="../images/user.gif" class="img">
                                        <span Onclick="yBQVqzRwD(50)" class="" style="left: -75px;">Response From <img src="../images/asana_logo.svg" style="width: 50px;"></span>
                                    </div>
                                    <div class="un_icon">
                                        <img src="../images/mailsend.png" class="img">
                                        <span Onclick="yBQVqzRwD(75)" class="">Responded to User </span>
                                    </div>
                                    <div class="un_icon">
                                        <img src="../images/ok.gif" class="img">
                                        <span Onclick="yBQVqzRwD(100)" class="" style="left: -42px;">Ticket Closed </span>
                                    </div>`;

                                //     var text_name = ['ReOpen','ReOpen1'];

                                //     for (let k = 0; k < 2; k++) { 
                                //         tbody_row += `<div class="un_icon">
                                //             <img src="../images/ok.gif" class="img">
                                //             <span Onclick="yBQVqzRwD(125,`+i+`)" class="">`+text_name[k]+`</span>
                                //         </div>`;
                                //    }
                                        tbody_row += `  </div>
                                                    </div>
                                                </td>
                                            </tr>    
                                        `;

                                        $.ajax({
                                            url: "../settingmail.php",
                                            method: "POST",
                                            data: {
                                                ref: 'get_tags_by_id',
                                                in_ref: 'get_tag_names',
                                                id: d.tag_id,
                                                // checked: e.checked ? 1 : 0,
                                            },
                                            success: function(response) {
                                                var tagname = JSON.parse(response);
                                                console.log(
                                                    'response tag #schedule_popup-content',
                                                    tagname, d.id, i)

                                                if (tagname.length > 1) {
                                                    tagname.forEach((dt) => {
                                                    
                                                        $(`#subtagsrow${i}`).append(
                                                            '<span class="tag" style=" "><img class="tag_image" src="../images/pricetag-outline.svg" alt="tagimg"/>' +
                                                            dt.tag_name +
                                                            '<img src="../images/close-outline.svg" alt="close" data-value="' +
                                                            dt.id +
                                                            '" data-updid="' + d
                                                            .tag_id +
                                                            '" data-rowid="' + d
                                                            .id +
                                                            '" onclick="flag_remove(this)" style="height:24px;width:24px;cursor: pointer;"/></span>'
                                                            );
                                                    })

                                                } else {
                                                    tagname.forEach((dt) => {
                                                        $(`#subtagsrow${i}`).append(
                                                            '<span class="tag" style="padding: 0px 10px 3px 10px;"><img class="tag_image" src="../images/pricetag-outline.svg" alt="tagimg"/>'+dt.tag_name+'</span>'
                                                            );
                                                    })
                                                }

                                               // console.log('subtags in',subtags);
                                                // <td><img id="JwUeotobH" class="bb" style="width: 15px; height: 20px;" src="../images/down.png"></td>
                                                // <td><button id="JwUeotobH" Onclick="JwUeotobH('`+i+`')"><img src="../images/chevron-back-outline.svg" style="height:24px;width:24px;"/><img src="../images/chevron-forward-outline.svg" style="height:24px;width:24px;"/></button></td> -->
                                            },
                                            error: function(err) {
                                                console.log('err', err);
                                            },
                                        });
           
            // console.log('tbody_row',d.);
            
            $('#action_table_tbody').append(tbody_row);

            if(e.id != '') {
               
                // var settings4 = {
                //     "url": "./uncategorised_popup.php",
                //     "method": "POST",
                //     "timeout": 0,
                //     "headers": {
                //         "Content-Type": "application/x-www-form-urlencoded"
                //     },
                //     "data": {
                //         "ticketid": d.asana_ticketid
                //     }
                // };
                // $.ajax(settings4).done(function(result) {
                //     console.log('resultresult',result);
                // })
                    $.ajax({
                    url: './uncategorised_popup.php',
                    method: 'POST',
                    data: {
                        // ticketid: '1206360647146192',
                        ticketid: d.asana_ticketid,
                    },
                    success: function(response) {

                        var comm_em33 = document.querySelectorAll('#resource_subtype');
                        // console.log('comm_em33',comm_em33);
                        comm_em33.forEach((elemnt, ij) => {
                            

                            var tttstts = $(elemnt).data('value');  

                            var progress_ee = $('#progress' + i);
                            
                            if(tttstts == 'added_to_project') {
                                progress_ee.width('25%');
                                // console.log('comm_em33',ij,elemnt);
                            }else if(tttstts == 'comment_added') {
                                progress_ee.width('50%');
                                // console.log('comm_em33',ij,elemnt);
                                
                            }
                            if(d.ce_status == '2' && d.asana_status == '2') {
                                progress_ee.width('75%');
                            }
                        });
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr, status, error);
                    }
                    
                    
                });
            }
        var progress = document.getElementById('progress'+i);
        if(d.ce_status == '2' && d.asana_status == '2') {
            progress.style.width = 75 + '%';
        }
         
        })
    }
    function setupPaginationButtons(data) {
        const totalPages = Math.ceil(data.length / itemsPerPage);
        const paginationButtons = document.getElementById('paginationButtons');
        paginationButtons.innerHTML = '';

        for (let i = 1; i <= totalPages; i++) {
            const button = document.createElement('button');
            button.innerText = i;
            button.addEventListener('click', function () {
            currentPage = i;
            displayTableData(data, currentPage);
            });
            paginationButtons.appendChild(button);
        }
        }
        displayTableData(data, currentPage);
        setupPaginationButtons(data);

        function searchTable() {
            var searchText = document.getElementById('searchInput').value.toLowerCase();

            var table = document.getElementById('table_data');
            var rows = table.getElementsByTagName('tr');

            for (var i = 0; i < rows.length; i++) {
                var cells = rows[i].getElementsByTagName('td');
                var found = false;

                for (var j = 0; j < cells.length; j++) {
                var cellText = cells[j].textContent.toLowerCase();
                
                if (cellText.indexOf(searchText) > -1) {
                    found = true;
                    break;
                }
                }

                if (found) {
                rows[i].style.display = '';
                } else {
                rows[i].style.display = 'none';
                }

                if(searchText == '') {
                    rows[i].style.display = '';
                }
            }
            }

        document.getElementById('searchInput').addEventListener('input', searchTable);
    }
    },
    error: function(err) {
        console.log('err', err);
    },
    complete: function() {
        $(".spinner-box").hide();
    }
})

}