<link rel="stylesheet" href="includes/js/rating/SimpleStarRating.css">
<script src="includes/js/rating/SimpleStarRating.js"></script>
<style type="text/css">
    .popover{
        max-width:400px !important;
    }
</style>
<style>
/* //Ticket-Beschreibung verkürzt anzeigen */
.event-text-collapsed {
  max-height: 6.5em; /* entspricht ca. 4–5 Zeilen */
  overflow: hidden;
  position: relative;
}

.event-text-collapsed.expanded {
  max-height: none;
}

.toggle-btn {
  display: inline-block;
  margin-top: 0.25rem;
  font-size: 0.875em;
  color: #0d6efd;
  cursor: pointer;
  text-decoration: underline;
}

</style>

<script>

    var ratings = [];

    function addRating(obj) {
        for (var i = 0; i < ratings.length; i++) {
            if (ratings[i].id == obj.id) {
                ratings[i].rating = obj.rating;
                return;
            }
        }
        ratings.push(obj);
    }

    [% foreach $criteria_list as $criteria %]
        [% if $criteria.rating %]
    rating_object = {id:[% $criteria.criteria_id  %], rating:[% $criteria.rating %]};
    addRating(rating_object);
        [% /if %]
    [% /foreach %]
</script>
<style>

    .type-icon{
        max-height: 16px;
    }
    @media print {
        a[href]:after {
            content: "";
        }
    }

    #sidebar {
        margin-left: -370px;
        transition: all 0.3s;

    }
    #sidebar.active {
        margin-left: 0;
        color: #fff;
        transition: all 0.3s;
    }

    .popover{
        max-width: 70%; /* Max Width of the popover (depending on the container!) */
    }

    #toggleSidebar .MainFilterButton {
        width: 200px;
    }

    /* Toggle Sidebar */

    #toggleSidebar {
        position: fixed;
        left: -280px;
        /*
        top: 10%;
        max-height: 90%;
        */
        z-index: 100000;
        -webkit-box-shadow: -3px 0px 50px -2px rgba(0,0,0,0.14);
        -moz-box-shadow: -3px 0px 50px -2px rgba(0,0,0,0.14);
        box-shadow: -3px 0px 50px -2px rgba(0,0,0,0.14);
        background: #fff;
        height: 100%;
        width: 312px;

        background-color: #f5f5f5;
        border-color: #ddd;
    }

    .ss-open #toggleSidebar:hover {
        left: 0;
    }

    #toggleSidebar .sidebar-toggle {
        width: 32px;
        height: 100%;
        cursor: pointer;
        opacity: 1;
        background: #fff;
        -moz-border-radius: 0px 5px 5px 0px;
        -webkit-border-radius: 0px 5px 5px 0px;
        border-radius: 0px 5px 5px 0px;
        -webkit-box-shadow: 0px -3px -2px 5px rgba(0,0,0,0.14);
        -moz-box-shadow: 0px -3px -2px 5px rgba(0,0,0,0.14);
        box-shadow: 0px -3px -2px 5px rgba(0,0,0,0.14);
        float: right;
        /*
        margin-right: -32px;
        margin-top: 150px;
        */
        top: 100px;
        font-size: 2em;

        background-color: #f5f5f5;
        border-color: #ddd;
    }
    #toggleSidebar .sidebar-toggle::before {
        color: #f05254;
        /*
        content: "\f07a";
        font-family: fontawesome;
        */
        font-size: 23px;
        font-weight: lighter !important;
        line-height: 56px;
        text-align: center;
        padding-left: 15px;
    }
    #toggleSidebar .sidebar-toggle:hover:before {
        color: #06a0b0;

    }
    .ss-close #toggleSidebar .sidebar-toggle:before{
        /*content: "\f00d";*/
    }
    #toggleSidebar-container {
        height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-transition: all 0.5s;
        transition: all 0.5s;
        /*padding: 15px;*/
    }
    #toggleSidebarText{
        transform: rotate(90deg);
        display: block;
        padding-top: 2em;
        font-size: 1.5em;
    }

    #sidebar {
        min-width: 350px;
        max-height: 100vh;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        overflow: scroll;
        z-index:999999;
        background-color: white;

    }

    .sidebar-wrapper {
        max-width: 100vh;

    }

    .overlay {
        display: none;
        position: fixed;
        /* full screen */

        width: 100%;
        height: 100%;
        /* transparent black */
        background: rgba(0, 0, 0, 0.7);
        /* middle layer, i.e. appears below the sidebar */
        z-index: 998;
        opacity: 0;
        /* animate the transition */
        transition: all 0.5s ease-in-out;
    }
    /* display .overlay when it has the .active class */
    .overlay.active {
        display: block;
        opacity: 1;
    }

    #dismiss {
        width: 35px;
        height: 35px;
        position: absolute;
        /* top right corner of the sidebar */
        top: 10px;
        right: 10px;
    }

    #filterBox{
        /*
        overflow-x: auto;
        border: 1px solid black;
        white-space: nowrap;
        max-width: 10000px;
        */
    }







</style>


<form action="index.php?module=ticketlist" method="post" name="FilterForm" id="FilterForm">
    <input type="hidden" name="Export" id="FilterExport" value="" />
    <input type="hidden" name="FilterNames" id="FilterNames" value="" />
    <input type="hidden" name="MinRating" id="MinRating" value="[% if $smarty.const.MINRATING %][% $smarty.const.MINRATING %][% else %]0[% /if %]" />
</form>



<script>
    window.onload = function () {
    [% if $UpdateDone %]
        sessionStorage.removeItem("update");
    [% /if %]
        var update = sessionStorage.getItem("update");
        if (update == "1") {
            $("#updateFilterBtn").removeClass('invisible');
            console.log('Update Filter Visible Pos 3');
        }
    }
</script>
<!-- toggle-sidebar -->

<!-- Modal -->
[% if $rate_right && !$showPopup %]
    <div class="modal" id="ratingModal" tabindex="-1" role="dialog" style="margin-top: 80px;">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header" style="background-color: #f5f5f5">
                    <div class="row">
                        <div class="col-sm-6">
                            <h3 class="modal-title">[% $user->gettext('Bewertung für Ticket') %] [% $ratingTicketTitle %] (#[% $closed_tid %])</h3>
                        </div>
                        <div class="col-sm-6 text-end">
                            <div class="btn-group">
                                <button type="button" class="btn btn-outline-secondary" onclick="saveRating();">[% $user->gettext('Bewerten') %]</button>
                                <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">[% $user->gettext('Abbrechen') %]</button>
                            </div>
                        </div>
                    </div>


                </div>
                <div class="modal-body">
                <div class="row">
                <div class="col-sm-12">
                    <p>[% $user->gettext('Für eine durchschnittliche Bewertung kleiner oder gleich 3 ist ein Kommentar erforderlich.')%]</p>
                </div>
                </div>
                    [% foreach from=$criteria_list item=criteria %]
                        [% if $smarty.const.STANDARD_CRITERIA == $criteria.criteria_id  %]
                            <div class="row">

                                <div class="col-sm-9">
                                    <b>[% $criteria.criteria_comment %]</b>
                                </div>
                                <div class="col-sm-3">
                                    <span class="rating" id="rating_[% $criteria.criteria_id %]"  title='[% $criteria.rating|round:"2" %] von 5' data-stars="5" data-default-rating="[% $criteria.rating %]" style="display: inline-block;"></span>
                                </div>
                            </div>
                        [% else %]
                            <div class="row">

                                <div class="col-sm-9">
                                    <b>[% $criteria.criteria_name %]</b> <span class="fa fa-info" title="[% $criteria.criteria_comment %]"></span>
                                </div>
                                <div class="col-sm-3">
                                    <span class="rating" id="rating_[% $criteria.criteria_id %]" title='[% $criteria.rating|round:"2" %] von 5' data-stars="5" data-default-rating="[% $criteria.rating %]" style="display: inline-block;"></span>

                                </div>
                            </div>
                        [% /if %]

                        <script>
                            var r = new SimpleStarRating(document.getElementById('rating_[% $criteria.criteria_id %]'));
                            document.getElementById('rating_[% $criteria.criteria_id %]').addEventListener('rate', function (e) {
                                addRating({rating: e.detail, id: [% $criteria.criteria_id %]});
                            });
                        </script>
                    [% /foreach %]
                    <div class="row">

                        <div class="col-sm-3">
                            <b>[% $user->gettext('Kommentar') %]</b>
                        </div>
                        <div class="col-sm-9">
                            <textarea id="rComment"  class="form-control">[% $rComment %]</textarea>

                        </div>
                    </div>

                    <div class="row">

                        <div class="col-sm-3">

                        </div>
                        <div class="col-sm-9">
                            <input type='checkbox' id="hidePopup" onchange="hidePopup();"> [% $user->gettext('Dieses Popup nicht mehr anzeigen') %]

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

    <script>
        function hidePopup() {
            var isChecked = 0;
            if ($('#hidePopup').is(":checked")) {
                isChecked = 1
            }
            ;
            $.post('index.php?module=criteria&event=hidePopup', {checked: isChecked}, function (data) {
                if (isChecked == 1) {
                    noty({
                        text: "[% $user->gettext('Das Bewertungs-Popup wird im Lauf der aktuellen Sitzung nicht mehr angezeigt.') %]",
                        type: 'success',
                        timeout: notifyTimeout
                    });
                }
            })
        }
        function saveRating() {
            $.post("index.php?module=criteria&event=rate", {rating: JSON.stringify(ratings), rComment: $('#rComment').val(), ticketid:[% $closed_tid %]}, function (data) {
                if (parseInt(data) == -1) {
                    noty({
                        text: "[% $user->gettext('Für eine durchschnittliche Bewertung kleiner oder gleich 3 ist ein Kommentar erforderlich') %]",
                        timeout: notifyTimeout,
                        //layout: 'top',
                        //theme: 'defaultTheme', // or 'relax'
                        closeWith: ['click'],
                        type: 'error'

                    });
                }
                else if (parseFloat(data) < parseFloat($('#MinRating').val())) {
                    noty({
                        text: "[% $user->gettext('Das Ticket wurde aufgrund einer niedrigen Bewertung wieder geöffnet') %]",
                        timeout: notifyTimeout,
                        //layout: 'top',
                        //theme: 'defaultTheme', // or 'relax'
                        closeWith: ['click'],
                        type: 'success'

                    });
                } else {
                    noty({
                        text: "[% $user->gettext('Vielen Dank.') %]",
                        timeout: notifyTimeout,
                        //layout: 'top',
                        //theme: 'defaultTheme', // or 'relax'
                        closeWith: ['click'],
                        type: 'success'

                    });
                }
                $('#ratingModal').modal('hide');

            })
        }
    </script>
[% /if %]
[% if $hasNoty %]
    <div id="snackbarDiv" style="display:none;">
        <div class="row">
            <div class="col-lg-6 text-end">
                [% $notyMessage %]
            </div>
            <div class="col-lg-6 text-left">
                <a href="index.php?module=ticket&event=show&id=[% $closed_tid %]&close=2"><b>[% $user->gettext('RÜCKGÄNGIG MACHEN') %]</b></a>&nbsp &nbsp
            </div>
        </div>
    </div>
    <script>
        window.onload = function () {
            $('#ratingModal').modal('show');
            //window.history.pushState({}, document.title, "/" + "index.php?module=ticketlist" );
            var n = noty({
                text: $("#snackbarDiv").html(),
                timeout: notifyTimeout,
                //layout: 'top',
                //theme: 'defaultTheme', // or 'relax'
                closeWith: ['click'],
                type: 'success'

            });
        }
    </script>
[% /if %]

<div id="TicketListPanel" class="card panel-fcs-border shadow-sm">
    <div class="sidebar-wrapper">
        <nav id="sidebar" class="hidden-print">
            <div class="card panel-info shadow-sm rounded" style="height:100%; width: 350px;">
                <div class="card-header text-center">
                    <div id="dismiss">
                        <span class="fa fa-times"></span>
                    </div>
                    <h2>[% $user->gettext('Filter') %]</h2>
                    <form action="[% $action %]" method="post" name="miniSearch" id="sideSearchForm" >
                        <button type="button" class="btn btn-outline-primary btn-block" data-bs-toggle="modal" data-bs-target="#AddFilterModal">
                            <span><strong>+</strong> [% $user->gettext('Aktuelle Suche als Filter speichern') %]</span>
                        </button>
                    </form>
                </div>
                <div class="card-body"  style="padding: 10px;">
                    [% include file=$modulePath|cat:"/filtermenu.tpl" %]
                </div>
            </div>
        </nav>
    </div>

    <div class="card-header">
        <div class="row">
            <div class="col-sm-8">
                <h4 class="card-title-fcs">
                    [% if !$user->hasRight(243) %]

                        <button type="button" id="sidebarCollapse" title="Filter anzeigen" class="btn btn-outline-secondary hidden-print lightContrast titleContrast" style="font-size: 18px;">
                            <span class="fa fa-filter"></span>
                        </button>
                    [% /if %]
                    <span style="font-size: 1.5em;">
                        [% if false %]
                            [%* if $TicketBasket == 1 *%]
                            [% $user->gettext('Merkliste') %]
                        [% else %]
                            [% $user->gettext('Ticketliste') %]
                        [% /if %]
                    </span>
                    [% if $FilterNames %]
                        <small>[% $user->gettext('Verwendeter Filter') %]: [% $activeFilter.filtername %]</small>
                        [% if ($activeFilter.userid == $user->UserID) %]
                            <button type="button" class="btn btn-outline-secondary btn-sm invisible" id="updateFilterBtn" onclick="UpdateFilter();" data-bs-toggle="tooltip" title="[% $user->gettext('Änderungen im Filter speichern') %]">
                                <span class="fa fa-floppy-disk"></span>
                            </button>&nbsp;&nbsp;
                        [% /if %]
                    [% /if %]
                    <span id="cntTickets"> [% $entries %] </span> <span>[% if $entries == 1 %][% $user->gettext('Ticket gefunden') %][% else %] [% $user->gettext('Tickets gefunden') %][% /if %]</span>
                </h4>
            </div>
            <div class="col-sm-4 text-end hidden-print" >
                <form [% if $memo %]action="index.php?module=ticketlist&event=ticketbasket"[% else %] action="index.php?module=ticketlist" [% /if %]method="POST" id="test" >

                    [% if $TicketBasket == 1 %]
                        [% if $Tools->FCS_Count($tickets) %]
                            <a href="#" data-src="index.php?module=ticketlist&event=printlist" class="modalButton btn btn-outline-primary lightContrast titleContrast" data-remote="false" data-bs-toggle="modal" data-bs-target="#iframeModal"  >[% $user->gettext('Merkliste drucken') %]</a>
                        [% /if %]
                        [%* <a href="javascript:document.getElementById('TicketBasket').checked=false;document.getElementById('TicketBasketmini').checked=false;submitForm2();" ><input type="button" class="btn btn-outline-primary" value="[% $user->gettext('Zur&uuml;ck') %]" /></a>*%]
                    [% /if %]

                    <a href="javascript:loadLegendModal()" class="btn btn-outline-secondary lightContrast titleContrast">[% $user->gettext('Legende') %]</a>

                    [% if !$in_iframe && !$user->hasRight(243) %]
                        <button type="button" class="btn btn-outline-secondary dropdown-toggle lightContrast titleContrast"  data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            [% $user->gettext('Tools') %]
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu dropdown-menu-right">
                            <li><a class="dropdown-item" href="index.php?module=ticket&amp;event=newTicket">[% $user->gettext('Neues Ticket erstellen') %]</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a class="dropdown-item" href="#" id="ExportButton">Excel</a></li>
                            <li><a class="dropdown-item modalButton" href="#" data-src="index.php?module=ticketlist&amp;Export=csv&amp;ListType=[% $listtype %]"  data-bs-remote="false" data-bs-toggle="modal" data-bs-target="#iframeModal">Csv</a></li>
                            <li><a class="dropdown-item modalButton" href="#" data-src="index.php?module=ticketlist&amp;event=printTicketList&amp;Export=printTicketList&amp;ListType=[% $listtype %]" data-bs-remote="false" data-bs-toggle="modal" data-bs-target="#iframeModal" >[% $user->gettext('Drucken') %]</a></li>
                            <hr>
                            <li><a class="dropdown-item" href="#dialog-Archiv" class="dialog" data-bs-toggle="modal" data-bs-target="#TicketArchivModal">
                                    [% $user->gettext('Angezeigte Tickets archivieren') %]</a>
                            </li>
                            <hr>

                            <li><a class="dropdown-item" href="index.php?module=ticket&class=csvimport" title="[% $user->gettext('Ticket aus CSV-Datei importieren') %]">[% $user->gettext('CSV Import') %]</a>
                            </li>

                            [%*
                            <li role="separator" class="divider"></li>
                            <li>
                            <a href="#" id="tgSort">Spalten anordnen: <span id="sortState">[% $user->gettext('aus') %]</span></a>
                            </li>
                            *%]
                        </ul>
                        [% if !$mobile %]
                            [% if $TableView == 0 %]
                                <input type="hidden" value="0" name="changeView" id="changeView">
                                <button type="button" title="[% $user->gettext('Tabellenansicht') %]" class="btn btn-outline-secondary lightContrast titleContrast" onclick="$('#changeView').val(1);
                                        $('#test').submit();">
                                    <span class="fa fa-list"></span>
                                </button>
                            [% /if %]

                            [% if $TableView == 1 %]
                                <input type="hidden" value="0" name="changeView" id="changeView">
                                <button type="button"  title="[% $user->gettext('Blockansicht') %]" class="btn btn-outline-secondary lightContrast" onclick="$('#changeView').val(0);
                                        $('#test').submit();">
                                    <span class="fa fa-table"></span>
                                </button>
                            [% /if %]
                        [% /if %]
                    [% /if %]
                </form>
            </div>
        </div>
    </div>


    <div class="card-body hidden" id="TicketlistPanelBody">

        [% if $TicketBasket == 1 %]
            <div class="well">
                <h4><i class="fa fa-exclamation-triangle" style="font-size: 1em;color: red;"></i> Die Funktion "Merkliste" im Heinzelmann wird abgeschafft.</h4>
                <p>
                    Aufgrund der geringen Verwendung und vorhandener Inkonsistenzen mit anderen Ticketlisten-Funktionen werden wir die Merkliste demnächst entfernen.
                    <br/>
                    Wir empfehlen, statt dessen Schlagworte zu verwenden, um Tickets für nachfolgende Prozessen zu sammeln.
                </p>
            </div>
        [% /if %]


        <div id="filterBox" class="row hidden-print">
            [% include file=$modulePath|cat:"/newSearchform.tpl" %]
        </div>
        [% if $TableView == 0 %]
            <div class="row" id="block">
                [% include file=$modulePath|cat:"/blockview.tpl" %]
            </div>
        [% /if %]

        <div class="row" id="TBody" style="[% if $TableView == 0 %]display:none[% /if %]">

            <div class="col-12">
                <div class="table-responsive">

                    <table class="table table-striped table-bordered  table-condensed" id="listTable">
                        <thead style="cursor: pointer;">
[% include file="$modulePath/TicketlistTableHeader.tpl" %]
                        </thead>

                        <tbody id="TicketListBody" class="TicketListBody">
[% include file="$modulePath/TicketlistTableBody.tpl" %]                                                                                
                        </tbody>
                                                                        </table>
                                                                    </div>
                                                                </div> <!-- Ticketliste -->
                                                                <div class="col-3">
                                                                    <strong>[% $TicketsCountFrom %] - [% $TicketsCountTo %] [% $user->gettext('von') %] [% $entries %]</strong>
                                                                    [%*
                                                                    <input type="button" value="[% $user->gettext('Bearbeitung schlie&szlig;en') %]" class="btn btn-outline-primary" id="ToggleTicketCollection_Off" style="display:none; height: 27px;"/>
                                                                    *%]
                                                                </div>

                                                                <div class="row d-xs-none">
                                                                    [% if !$user->hasRight(243) %]
                                                                        <div class="col-sm-6 " data-bs-toggle="tooltip" title="[% $user->gettext('Markieren Sie Tickets um diese gesammelt zu bearbeiten') %]">
                                                                            <div class="btn-group">
                                                                                <a title="[% $user->gettext('Auswahl bearbeiten') %]" class="btn btn-outline-primary disabled" id="ToggleTicketCollection_On" style="margin:20px 0;" ><span class='fa fa-pencil'></span> [% $user->gettext('Auswahl bearbeiten') %]</a>
                                                                                [% if $user->hasRight(26) %]
                                                                                <a title="[% $user->gettext('Auswahl schließen') %]" class="btn btn-outline-danger disabled" id="CloseTickets" style="margin:20px 0;" >[% $user->gettext('Auswahl schließen')%]</a>
                                                                                <a class="openInBigIFrameModal" href="" id="CloseTicketsFrame" style="margin:20px 0; width: 0px; height: 0px;" ></a>
                                                                                [% /if %]
                                                                                <a title="[% $user->gettext('Tickets zusammenführen') %]" class="btn btn-outline-primary disabled" id="MergeTickets" style="margin:20px 0;" >[% $user->gettext('Tickets zusammenführen')%]</a>
                                                                            </div>
                                                                        </div>
                                                                    [% /if %]



                                                                    <div class="col-sm-6 text-end" style="padding-top: 17px;">
                                                                        [% $Paging %]
                                                                    </div>
                                                                </div>
                                                                <!--
                                                                <div class="col-12 hidden-lg hidden-md">
                                                                [% $Paging %]
                                                            </div>
                                                                -->
                                                                <div class="col-9 hidden-print">

                                                                </div><!-- nav -->
                                                            </div>

                                                            <!---ENDTABLE-->
                                                        </div>
                                                    </div>

                                                    <div class="modal fade" id="ticketModal"  role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                                        <div class="modal-dialog modal-lg" role="document" style="position: relative;display: table;overflow-y: auto;overflow-x: auto;width: auto;">
                                                            <div class="modal-content">
                                                                <div class="modal-body " id="editTicketCollectionDiv">
                                                                    ...
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="wrapper center" id="wraper">
                                                        <div  style="overflow-x:auto;overflow-y:hidden;" >

                                                            [% if $TRefID %]
                                                                <input type="hidden" name="save" id="save" value="0" />
                                                                <input type="hidden" name="TRefID" id="TRefID" value="[% $RefID %]" />
                                                            [% /if %]


                                                            <div id="dialog-Export" style="display:none;" >
                                                                <form action="index.php?module=ticketlist" method="post" name="ExportForm" id="ExportForm">

                                                                    <table class="listview formview" cellspacing="0">
                                                                        <thead>
                                                                            <tr>
                                                                                <th colspan="3">Export</th>
                                                                            </tr>
                                                                        </thead>
                                                                        <tbody>
                                                                            <tr class="even">
                                                                                <td><a href="javascript:void(0);" id="ExportButton" class="btn btn-outline-secondary"><span>Excel</span></a></td>
                                                                                <td>
                                                                                    <a href="index.php?module=ticketlist&amp;Export=csv&amp;ListType=[% $listtype %]" data-fancybox-type="iframe" class="btn btn-outline-secondary dialog-small"><span>Csv</span></a>
                                                                                </td>
                                                                                <td>
                                                                                    <a href="index.php?module=ticketlist&amp;event=printTicketList&amp;Export=printTicketList&amp;ListType=[% $listtype %]" data-fancybox-type="iframe" class="btn btn-outline-secondary dialog-big"><span>[% $user->gettext('Drucken') %]</span></a>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </form>
                                                            </div>

                                                            <div class="modal fade" id="legendModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                                                <div class="modal-dialog modal-lg" role="document">
                                                                    <div class="modal-content">
                                                                        <div class="modal-header" style="color: #333;padding-top: 35px;background-color: #f5f5f5;border-color: #ccc;">
                                                                            <div class="row" style="width: 100%;">
                                                                                <div class="col-sm-8">
                                                                                    <h1>[% $user->gettext('Legende') %]</h1>
                                                                                </div>
                                                                                <div class="col-sm-4 text-end">
                                                                                    <a rolte="button" data-bs-dismiss="modal" aria-label="Close" style="cursor:pointer; font-size: 1.5em;">
                                                                                        <span aria-hidden="true" class="fa fa-times" ></span>
                                                                                    </a>
                                                                                </div>
                                                                            </div>


                                                                        </div>
                                                                        <div class="modal-body modalContent" style="padding: 25px;">
                                                                            <div id="legend">
                                                                                <div class="row">
                                                                                    <div class="col-lg-12 well-sm">
                                                                                        <p>
                                                                                            [% $user->gettext('Die Spalten der Ticketliste können durch drücken der Strg-Taste und gleichzeitigen ziehen mit der Maus an verschoben werden.') %]
                                                                                        </p>
                                                                                        <p>
                                                                                            [% $user->gettext('In der Spalten-Auswahlliste können Sie definieren, welche Spalten in der Ticketliste angezeigt werden sollen.') %]
                                                                                        </p>
                                                                                        <p>
                                                                                            [% $user->gettext('Die gewählten Spalten und deren Position werden gespeichert, wenn Sie einen Ticketlisten-Filter anlegen.') %]
                                                                                        </p>
                                                                                    </div>
                                                                                    <div class="col-lg-8">
                                                                                        <div class="row">
                                                                                            <div class="col-lg-12">
                                                                                                <h3>[% $user->gettext('Status') %]</h3>
                                                                                            </div>

                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('NEW') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Das Ticket wurde gerade erstellt und noch von keinem Supporter geöffnet') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('OPEN') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Das Ticket wurde von einem Supporter geöffnet') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('ASSIGNED') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Das Ticket wurde einem Supporter/Gruppe zugewiesen') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('ACTIVE') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Am Ticket wird momentan gearbeitet') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('ONHOLD') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Ticket wurde zur&uuml;ckgestellt') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('CLOSED') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Ticket ist geschlossen') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('REOPENED') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Das Ticket wurde erneut ge&ouml;ffnet') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('CHANGED') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Das Ticket wurde ver&auml;ndert') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('DONE') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Das Ticket wurde als erledigt markiert') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('RESPONSE') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Das Ticket wurde durch den Kontakt bearbeitet') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-3">
                                                                                                <strong>[% $user->gettext('WAIT FOR RESPONSE') %]</strong>
                                                                                            </div>
                                                                                            <div class="col-lg-9">
                                                                                                [% $user->gettext('Der Status wird manuell gesetzt. Im Ticket wird auf die Antwort des Kontakts oder der Supporter gewartet') %]
                                                                                            </div>
                                                                                        </div>
                                                                                    </div>
                                                                                    <div class="col-lg-4">
                                                                                        <div class="row">
                                                                                            <div class="col-lg-12">
                                                                                                <h3>[% $user->gettext('Priorität') %]</h3>
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-5">
                                                                                                <div class="prio1 legend" style="">[% $user->gettext('OPEN') %]</div>
                                                                                            </div>
                                                                                            <div class="col-lg-7">
                                                                                                [% $user->gettext('Niedrig') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-5">
                                                                                                <div class="prio2 legend" style="">[% $user->gettext('OPEN') %]</div>
                                                                                            </div>
                                                                                            <div class="col-lg-7">
                                                                                                [% $user->gettext('Mittel') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-5">
                                                                                                <div class="prio3 legend" style="">[% $user->gettext('OPEN') %]</div>
                                                                                            </div>
                                                                                            <div class="col-lg-7">
                                                                                                [% $user->gettext('Hoch') %]
                                                                                            </div>
                                                                                        </div>
                                                                                        <div class="row">
                                                                                            <div class="col-lg-5">
                                                                                                <div class="prio4 legend" style="">[% $user->gettext('OPEN') %]</div>
                                                                                            </div>
                                                                                            <div class="col-lg-7">
                                                                                                [% $user->gettext('Dringend') %]
                                                                                            </div>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div id="dialog-Ticket" style="display:none;" width="1000" hight="820">

                                                    </div>

                                                    <div id="dialog-confirm" title="[% $user->gettext('Filter l&ouml;schen') %]" style="display:none;">
                                                        <p>
                                                            <span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>
                                                            [% $user->gettext('Der Filter ist Favorit anderer Benutzer. Wirklich l&ouml;schen?') %]
                                                        </p>
                                                    </div>

                                                    <div id="newLogin" style="display:none;">
                                                        <tr class="odd">
                                                            <td colspan="30">
                                                                [% $user->gettext('Ihre Session ist abgelaufen. Bitte melden Sie sich erneut an.') %]
                                                            </td>
                                                        </tr>
                                                    </div>



                                                    <!-- Modal -->
                                                    <div class="modal fade" id="FilterDetailModal" tabindex="-1" role="dialog" aria-labelledby="FilterDetailModalLabel">
                                                        <div class="modal-dialog" role="document">
                                                            <div class="modal-content">
                                                                <div class="modal-header">
                                                                    <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                                                    <h4 class="modal-title" id="FilterDetailModalLabel">[% $user->gettext('Filterdetails') %]</h4>
                                                                </div>
                                                                <div class="modal-body">
                                                                    <div class="row">
                                                                        <div class="col-12">
                                                                            <h4>[% $activeFilter.filtername %]</h4>
                                                                        </div>
                                                                        [% if $activeFilter.filterdescr != "" %]
                                                                            <div class="col-12">
                                                                                <strong>[% $user->gettext('Beschreibung') %]:</strong>
                                                                                [% $activeFilter.filterdescr %]
                                                                            </div>
                                                                        [% /if %]
                                                                        <div class="col-12">
                                                                            <strong>[% $user->gettext('Angelegt von') %]:</strong>
                                                                            [% $activeFilter.name %]([% $activeFilter.username %])
                                                                        </div>
                                                                        <hr/>
                                                                        <div class="col-12">

                                                                            [% if $activeFilter.userid == $user->UserID %]
                                                                                <a href="Javascript:deleteTicketFilter([% $activeFilter.filterid %]);" id='deleteTicketFilter_[% $activeFilter.filterid %]' class="btn btn-outline-secondary"><span class="fa fa-times" aria-hidden="true"></span> [% $user->gettext('L&ouml;schen') %]</a>
                                                                                <a href="index.php?module=ticketlist&event=editTicketFilter&id=[% $name.filterid %]" data-remote="false" data-bs-toggle="modal" data-bs-target="#universalModal" class="btn btn-outline-secondary"><span class="fa fa-pencil" aria-hidden="true"></span> [% $user->gettext('Bearbeiten') %]</a>
                                                                            [% /if %]
                                                                            <a href="index.php?module=ticketlist&event=copyTicketFilter&id=[% $name.filterid %]" data-fancybox-type="iframe" class="dialog-filter btn btn-outline-secondary"><span class="fa fa-copy" aria-hidden="true"></span> [% $user->gettext('Kopieren') %]</a>
                                                                            <label class="btn btn-outline-primary [% if $name.filterid == $DefaultFilterID %]active[% /if %]" title='[% $user->gettext('Als Standardfilter setzen') %]'>
                                                                                <input type="checkbox" id="ToggleFilter_[% $name.filterid %]" autocomplete="off"> Standard
                                                                            </label>
                                                                        </div>


                                                                    </div>
                                                                </div>
                                                                <div class="modal-footer">
                                                                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">[% $user->gettext('Schlie&szlig;en') %]</button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="modal fade" id="TicketArchivModal" tabindex="-1" role="dialog" aria-labelledby="TicketArchivModalLabel">
                                                        <div class="modal-dialog" role="document">
                                                            <div class="modal-content">
                                                                <div class="modal-header">
                                                                    <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                                                    <h4 class="modal-title" id="TicketArchivModalLabel">[% $user->gettext('Tickets archivieren') %]</h4>
                                                                </div>
                                                                <div class="modal-body">
                                                                    <div class="row">
                                                                        <div class="col-12">
                                                                            <p>
                                                                                [% $user->gettext('Die in dieser Suche angezeigten Tickets werden archiviert.') %]
                                                                                <br />
                                                                                [% $user->gettext('Archivierte Tickets werden bei der Suche und in Reports nicht mehr ber&uuml;cksichtig, ausser es wird explizit durch die entsprechenden Option gew&uuml;nscht.') %]
                                                                                <br />
                                                                                [% $user->gettext('Archivierte Tickets k&ouml;nnen aus dem Archiv entfernt werden indem die Archivierungsfunktion erneut auf diese angewendet wird.') %]
                                                                            </p>
                                                                        </div>



                                                                    </div>
                                                                </div>
                                                                <div class="modal-footer">
                                                                    <input type="button" id="ArchivButton" class="btn btn-outline-primary" value="[% $user->gettext('Tickets archivieren') %]" />

                                                                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">[% $user->gettext('Schließen') %]</button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    [% if $nofilter != 1 %]
                                                        <div class="modal fade" id="AddFilterModal" tabindex="-1" role="dialog" aria-labelledby="AddFilterModal">
                                                            <div class="modal-dialog" role="document">
                                                                <div class="modal-content">
                                                                    <div class="modal-header">
                                                                        <h4 class="modal-title" id="FilterDetailModalLabel">[% $user->gettext('Filter speichern') %]</h4>
                                                                    </div>
                                                                    <div class="modal-body">

                                                                        <form action="index.php?module=ticketlist" class="form form-horizontal" method="post" name="NewFilterForm" id="NewFilterForm">
                                                                            <div class="form-group row mb-3">
                                                                                <label for="NewFilterName" class="col-sm-3 control-label">[% $user->gettext('Neuer Filter') %]</label>
                                                                                <div class="col-sm-9">
                                                                                    <input type="text" class="form-control" name="NewFilterName" id="NewFilterName" maxlength="40" placeholder="[% $user->gettext('Filtername') %]">
                                                                                </div>
                                                                            </div>
                                                                            <div class="form-group row mb-3">
                                                                                <label for="inputPassword3" class="col-sm-3 control-label">[% $user->gettext('Beschreibung') %]</label>
                                                                                <div class="col-sm-9">
                                                                                    <textarea class="form-control"  name="NewFilterDescr" id="NewFilterDescr" ></textarea>
                                                                                </div>
                                                                            </div>
                                                                            <div class="form-group row mb-3">
                                                                                <label for="NewFilterName" class="col-sm-3 control-label">[% $user->gettext('Freigeben f&uuml;r') %]</label>
                                                                                <div class="col-sm-9">
                                                                                    <select class="textbox multiple"  name="NewFilterGroups[]" id="NewFilterGroups"  multiple="multiple" style="width:100%;" >
                                                                                        [% html_options options=$allgroups %]
                                                                                    </select>
                                                                                </div>
                                                                            </div>
                                                                        </form>
                                                                    </div>
                                                                    <div class="modal-footer">
                                                                        <button onclick="SaveNewFilter()" class="btn btn-outline-primary">[% $user->gettext('Speichern') %]</button>
                                                                        <button type="button" class="btn btn-outline-primary" data-bs-dismiss="modal">[% $user->gettext('Abbrechen') %]</button>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    [% /if %]


                                                    <div class="modal fade bs-example-modal-lg" id="universalModal" tabindex="-1" role="dialog" aria-labelledby="universalModal">
                                                        <div class="modal-dialog" role="document">
                                                            <div class="modal-content">
                                                                <div class="modal-header hidden-print FrameModalHeader">
                                                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                                                    <h4 class="modal-title" id="universalModalTitle">[% $user->gettext('') %]</h4>
                                                                </div>
                                                                <div class="modal-body">

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


                                                    <div class="modal fade bs-example-modal-lg" id="iframeModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
                                                        <div class="modal-dialog modal-lg">
                                                            <div class="modal-content">
                                                                <div class="modal-header hidden-print FrameModalHeader">
                                                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                                                    <h4 class="modal-title" id="iframeModalTitle">[% $user->gettext('') %]</h4>
                                                                </div>
                                                                <div class="modal-body">
                                                                    <iframe src="" frameborder="0"></iframe>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>


                                                    <script>

                                                        window.focus();
                                                        var sortMode = false;

                                                        $("#universalModal").on("show.bs.modal", function (e) {
                                                            var link = $(e.relatedTarget);
                                                            $(this).find(".modal-body").load(link.attr("href"));
                                                        });


                                                        $('a.modalButton').on('click', function (e) {
                                                            var src = $(this).attr('data-src');
                                                            var height = $(this).attr('data-height') || 300;
                                                            var width = $(this).attr('data-width') || '100%';

                                                            $("#iframeModal iframe").attr({'src': src,
                                                                'height': height,
                                                                'width': width});
                                                        });


                                                        function SaveNewFilter() {
                                                            $('#miniExport').val('save_name');
                                                            $('#Export').val('save_name');
                                                            $('#FilterName').val($('#NewFilterName').val());
                                                            $('#FilterDescr').val($('#NewFilterDescr').val());
                                                            $('#FilterGroups').val($('#NewFilterGroups').val());
                                                            $("#miniSearchForm").submit();
                                                        }

                                                        function UpdateFilter() {
                                                            $('#miniExport').val('update_fil');
                                                            $('#Export').val('update_fil');
                                                            $("#miniSearchForm").submit();
                                                        }

                                                        var DelTicketText = "[% $user->gettext('Ticket wirklich l&ouml;schen?') %]";

                                                        //var ListNav = responsiveNav("#ListNav", {customToggle: "#ListNavTitleBar"});

                                                        function saveTRefID(tid) {

                                                        [% if $tid == 0 %]
                                                            if (typeof (opener.document.getElementById('TicketRefId')) == "object") {
                                                                opener.document.getElementById('TicketRefId').value = tid;
                                                            }
                                                            window.close();
                                                        [% else %]
                                                            document.getElementById('TRefID').value = tid;
                                                            document.getElementById('save').value = 1;
                                                            var Export = document.getElementById("Export");
                                                            if (Export)
                                                                Export.value = "none";
                                                            submitForm2();
                                                        [% /if %]
                                                        }


                                                        function closing() {
                                                            window.opener.location.href = "index.php?module=ticket&event=show&id=[% $tid %]";
                                                            window.close();
                                                        }

                                                        function submitBasket() {
                                                            if (document.forms.BasketForm) {
                                                                document.getElementById("TicketBasket").checked = true;
                                                                document.getElementById('TicketBasketmini').checked = true;
                                                                document.forms.BasketForm.submit();
                                                            }
                                                        }

                                                        function printList() {
                                                            var MeinFenster = window.open("index.php?module=ticketlist&event=printlist", "Druckansicht", "width=800,height=500,left=100,top=200,scrollbars=yes");
                                                            MeinFenster.focus();
                                                        }

                                                        var changePage = false;

                                                        var page = localStorage.getItem("page");

                                                        if (page != [% $pos %]) {
                                                            changePage = true;
                                                        }

                                                        localStorage.setItem("page", [% $pos %]);

                                                        if (changePage) {
                                                            var checkboxes = JSON.parse(localStorage.getItem('checkboxes')) || [];
                                                        } else {
                                                            var checkboxes = [];
                                                            localStorage.removeItem("checkboxes");
                                                        }

                                                        if (checkboxes.length >= 1) {
                                                            $("#CloseTickets").removeClass('disabled');
                                                            $("#ToggleTicketCollection_On").removeClass('disabled');
                                                        }

                                                        if (checkboxes.length > 1) {
                                                            $("#MergeTickets").removeClass('disabled');
                                                        }

                                                        $(".selectTicket").on("change", function () {
                                                            if (this.checked) {
                                                                if (checkboxes.indexOf($(this).val()) == -1) {
                                                                    checkboxes.push($(this).val());
                                                                }
                                                                if (checkboxes.length >= 1) {
                                                                    $("#CloseTickets").removeClass('disabled');
                                                                    $("#ToggleTicketCollection_On").removeClass('disabled');
                                                                }
                                                                if (checkboxes.length > 1) {
                                                                    $("#MergeTickets").removeClass('disabled');
                                                                }
                                                            } else {
                                                                if (checkboxes.indexOf($(this).val()) != -1) {
                                                                    checkboxes.splice(checkboxes.indexOf($(this).val()), 1)
                                                                }
                                                                if (checkboxes.length <= 0) {
                                                                    $("#CloseTickets").addClass('disabled');
                                                                    $("#ToggleTicketCollection_On").addClass('disabled');
                                                                }
                                                                if (checkboxes.length < 2) {
                                                                    $("#MergeTickets").addClass('disabled');
                                                                }
                                                            }
                                                            localStorage.setItem("checkboxes", JSON.stringify(checkboxes));
                                                        });

                                                        $(".selectTicket").each(function () {
                                                            if (checkboxes.indexOf($(this).val()) != -1) {
                                                                $(this).prop("checked", true);
                                                            }
                                                        });


                                                        function callURL(id)
                                                        {
                                                        [% if $TRefID %]
                                                            saveTRefID(id);
                                                        [% else %]
                                                            [% if $iframe %]
                                                            window.open('index.php?module=ticket&event=show&id=' + id + '&tlu=[% $TicketlistUID %]', 'Ticketlist');
                                                            [% else %]
                                                                [% if $user->ShowTicketsInNewTab === true %]
                                                            window.open('index.php?module=ticket&event=show&id=' + id + '&tlu=[% $TicketlistUID %]', '_blank');
                                                                [% else %]
                                                                    [% if $ContactID %]opener[% else %]window[% /if %].location.href = 'index.php?module=ticket&event=show&id=' + id + '&tlu=[% $TicketlistUID %]';
                                                                    [% if $ContactID %]opener.focus();[% /if %]
                                                                [% /if %]
                                                            [% /if %]
                                                        [% /if %]
                                                                        }

                                                                        function callHistoryURL(id)
                                                                        {
                                                        [% if $TRefID %]
                                                                            saveTRefID(id);
                                                        [% else %]
                                                            [% if $iframe %]
                                                                            window.open('index.php?module=ticket&event=show&id=' + id, 'Ticketlist');
                                                            [% else %]
                                                                [% if $user->ShowTicketsInNewTab === true %]
                                                                            window.open('index.php?module=ticket&event=show&id=' + id, '_blank');
                                                                [% else %]
                                                                    [% if $ContactID %]opener[% else %]window[% /if %].location.href = 'index.php?module=ticket&event=show&id=' + id;
                                                                    [% if $ContactID %]opener.focus();[% /if %]
                                                                [% /if %]
                                                            [% /if %]
                                                        [% /if %]
                                                                        }

                                                                        function closeTickets() {
                                                                            var values = JSON.parse(localStorage.getItem("checkboxes"));
                                                                            var TicketIDs = values.join();
                                                                            console.log(TicketIDs);
                                                                            $("#CloseTicketsFrame").attr('href', 'index.php?module=ticket&event=editCollectionCloseTicket&ids=' + TicketIDs);
                                                                            $("#CloseTicketsFrame").click();
                                                                        }


                                                                        function mergeTickets()
                                                                        {
                                                                            var values = JSON.parse(localStorage.getItem("checkboxes"));
                                                                            var TicketIDs = values.join();
                                                                            if (values.length < 2) {
                                                                                alert("Wählen Sie bitte mindestens 2 Tickets zum Zusammenführen");
                                                                                return;
                                                                            }
                                                                            $.ajax({
                                                                                type: "POST",
                                                                                url: "index.php?module=ticket&event=mergeTicketsCollection",
                                                                                data: {
                                                                                    tickets: TicketIDs,
                                                                                    TicketBasket: [% if $TicketBasket %]1[% else %]0[% /if %]
                                                                                                }
                                                                                            })
                                                                                                    .done(function (data) {
                                                                                                        $('#editTicketCollectionDiv').html(data);
                                                                                                        $('#ticketModal').modal('show');
                                                                                                    });
                                                                                            return false;
                                                                        }


                                                                                        function editTicketCollection() {
                                                                                            var values = JSON.parse(localStorage.getItem("checkboxes"));
                                                                                            var TicketIDs = values.join();
                                                                                            if (values.length == 0) {
                                                                                                alert("Wählen Sie bitte mindestens ein Ticket zum Bearbeiten");
                                                                                                return;
                                                                                            }
                                                                                            $.ajax({
                                                                                                type: "POST",
                                                                                                url: "index.php?module=ticket&event=editCollection",
                                                                                                data: {
                                                                                                    tickets: TicketIDs,
                                                                                                    TicketBasket: [% if $TicketBasket %]1[% else %]0[% /if %]
                                                                                                                }
                                                                                                            })
                                                                                                                    .done(function (data) {
                                                                                                                        $('#editTicketCollectionDiv').html(data);
                                                                                                                        $('#ticketModal').modal('show');
                                                                                                                    });
                                                                                                            return false;
                                                                                                        }

                                                        [% if $TicketCollection.reloade %]
                                                                                                        $(document).ready(function () {
                                                                                                            editTicketCollection();
                                                                                                        });
                                                        [% /if %]

                                                        [% if $smarty.const.RELOADTICKETLIST %]
                                                                                                        $(function () {
                                                                                                            var intervalID;
                                                                                                            var TicketListFreqSecs = [% $smarty.const.RELOADTICKETLIST %];

                                                                                                            if (TicketListFreqSecs > 0) {
                                                                                                                intervalID = setInterval(function () {
                                                                                                                    reloadPage(false, true, true);
                                                                                                                }, TicketListFreqSecs * 1000 * 60);
                                                                                                            }
                                                                                                        });
                                                        [% /if %]
                                                        [% if $TableView == 1 %]
                                                                                                        function reloadPage(changeSearch, stayInPage, autoReloade) {
                                                                                                            if (changeSearch == undefined) {
                                                                                                                changeSearch = true;
                                                                                                            }
                                                                                                            if (stayInPage == undefined) {
                                                                                                                stayInPage = false;
                                                                                                            }
                                                                                                            if (autoReloade == undefined) {
                                                                                                                autoReloade = false;
                                                                                                            }

                                                                                                            if (autoReloade && $("input:checkbox[class=selectTicket]:checked").length > 0) {
                                                                                                                console.log('Es sind ' + $("input:checkbox[class=selectTicket]:checked").length + ' Tickets gewählt. Kein Reloade');
                                                                                                                return;
                                                                                                            }
                                                                                                            if (stayInPage) {
                                                                                                            } else {
                                                                                                                //Im Suchformular die aktuelle Seite einstellen:
                                                                                                                $("#miniSearchForm #pos").val(0);
                                                                                                            }

                                                                                                            var data = $("#miniSearchForm").serializeArray();
                                                                                                            //Aktuelle Seite aus Suchformular entfernen:
                                                                                                            $("#miniSearchForm #pos").val(0);
                                                                                                            $.ajax({
                                                                                                                type: "POST",
                                                                                                                url: "index.php?module=ticketlist&event=getTicketTableBody",
                                                                                                                data: data
                                                                                                            }).done(function (content) {
                                                                                                                if (changeSearch) {

                                                                                                                    $("#updateFilterBtn").removeClass('invisible');
                                                                                                                    console.log('Update Filter Visible Pos 4');
                                                                                                                }
                                                                                                                if (content.indexOf("reloadedTableCells") >= 0) {
                                                                                                                    sortMode = false;
                                                                                                                    $("#sortState").html("[% $user->gettext('aus') %]");
                                                                                                                    $('#TBody').hide().html(content).fadeIn();
                                                                                                                    $("#cntTickets").load("index.php?module=ticketlist&event=getTicketCount");
                                                                                                                    initTicketPopovers();

                                                                                                                } else {

                                                                                                                    $('#TicketListBody').fadeOut().html('<tr class="odd"> <td colspan="30"> [% $user->gettext("Keine Tickets gefunden") %] </td> </tr>').fadeIn();
                                                                                                                }
                                                                                                            });
                                                                                                            cleanupPopovers();
                                                                                                        }
                                                                                                        /*
                                                                                                         [% if $type_changed %]
                                                                                                         $("#updateFilterBtn").removeClass('invisible');
                                                                                                         [% /if %]
                                                                                                         */
                                                        [% /if %]
                                                        // close all popovers
                                                        function cleanupPopovers() {
                                                            document.querySelectorAll('[data-bs-toggle="popover"]').forEach(el => {
                                                                const inst = bootstrap.Popover.getInstance(el);
                                                                if (inst) inst.dispose();
                                                            });
                                                            document.querySelectorAll('.popover').forEach(p => p.remove());
                                                            }
                                                        [% if $TableView == 0 %]
                                                                                                        function reloadPage(changeSearch, stayInPage, autoReloade) {

                                                                                                            if (changeSearch == undefined) {
                                                                                                                changeSearch = true;
                                                                                                            }
                                                                                                            if (stayInPage == undefined) {
                                                                                                                stayInPage = false;
                                                                                                            }
                                                                                                            if (autoReloade == undefined) {
                                                                                                                autoReloade = false;
                                                                                                            }

                                                                                                            if (autoReloade && $("input:checkbox[class=selectTicket]:checked").length > 0) {
                                                                                                                console.log('Es sind ' + $("input:checkbox[class=selectTicket]:checked").length + ' Tickets gewählt. Kein Reloade');
                                                                                                                return;
                                                                                                            }

                                                                                                            var data = $("#miniSearchForm").serializeArray();
                                                                                                            if (stayInPage) {
                                                                                                                data.pos = "[% $pos %]";
                                                                                                            } else {
                                                                                                                data.pos = "0";
                                                                                                            }
                                                                                                            $.ajax({
                                                                                                                type: "POST",
                                                                                                                url: "index.php?module=ticketlist&event=getTicketBlockBody",
                                                                                                                data: data
                                                                                                            })
                                                                                                                    .done(function (content) {
                                                                                                                        $('.popover').popover('destroy')
                                                                                                                        if (true) {
                                                                                                                            sortMode = false;
                                                                                                                            $("#sortState").html("[% $user->gettext('aus') %]");
                                                                                                                            $('#block').hide().html(content).fadeIn();
                                                                                                                            //$( "#cntTickets" ).load("index.php?module=ticketlist&event=getTicketCount" );
                                                                                                                            //PopOver-Letzte Beschreibung neu initialisieren
                                                                                                                        initTicketPopovers();

                                                                                                                        } else {
                                                                                                                            $('#TicketListBody').fadeOut().html('<tr class="odd"> <td colspan="30"> [% $user->gettext("Ihre Session ist abgelaufen. Bitte melden Sie sich erneut an.") %] </td> </tr>').fadeIn();
                                                                                                                        }
                                                                                                                        if (changeSearch) {
                                                                                                                            $("#updateFilterBtn").removeClass('invisible');
                                                                                                                            console.log('Update Filter Visible Pos 5');
                                                                                                                        }
                                                                                                                    });
                                                                                                            setTimeout(function () {
                                                                                                                $('.popover').popover('destroy')
                                                                                                            }, 400);
                                                                                                        }
                                                        [% /if %]

                                                                                                        function switchPage(page) {
                                                                                                            $("#Export").val('none');
                                                                                                            $("#pos").val(page);
                                                                                                            $("#miniSearchForm").submit();
                                                                                                        }



                                                                                                        function delTicket(TicketID) {
                                                                                                            if (TicketID > 0) {
                                                                                                                bootbox.confirm(DelTicketText, function (result) {
                                                                                                                    if (result) {
                                                                                                                        makeHttpRequest("index.php?module=ticket&event=removeTicket&id=" + TicketID, "showTicketDeleted", true);
                                                                                                                    }
                                                                                                                })
                                                                                                            }
                                                                                                        }

                                                                                                        function showTicketDeleted() {
                                                                                                            var newHref = window.location.href;
                                                                                                            window.location.href = newHref;
                                                                                                        }

                                                                                                        $(".datepicker").datepicker({

                                                                                                            onClose: function (newText) {
                                                                                                                // compare the new value to the previous one
                                                                                                                if ($(this).data('previous') != newText) {
                                                                                                                    // do whatever has to be done, e.g. log it to console
                                                                                                                    sessionStorage.setItem("update", "1");
                                                                                                                    reloadPage();
                                                                                                                }
                                                                                                            }

                                                                                                        });

                                                                                                        $('#ticketModal').on('shown.bs.modal', function (e) {
                                                                                                            $(this).find('div.modal-content select').selectpicker();
                                                                                                        });


                                                                                                        $("#TicketSelection").on("click", function () {
                                                                                                            $(".selectTicket").trigger("click");
                                                                                                        });

                                                                                                        $("#ToggleTicketCollection_On").on("click", function () {
                                                                                                            editTicketCollection();
                                                                                                        })

                                                                                                        $("#MergeTickets").on("click", function () {
                                                                                                            mergeTickets();
                                                                                                        })

                                                                                                        $("#CloseTickets").on("click", function (e) {
                                                                                                            e.preventDefault();
                                                                                                            closeTickets();
                                                                                                        })

                                                                                                        $("#ArchivButton").on("click", function () {
                                                                                                            $("#ArchivFlag").val(1);
                                                                                                            $("#miniSearchForm").submit();
                                                                                                            return false;
                                                                                                        })

                                                                                                        $("#NewFilterGroups").select2({theme: 'bootstrap-5'});

                                                                                                        $("#FilterMenu").accordion({
                                                                                                            heightStyle: "content",
                                                                                                            autoHeight: false,
                                                                                                            clearStyle: true
                                                                                                        });



                                                                                                        $("#FilterMenu, #FilterLasche, #dialog-confirm").on("click", function (e) {
                                                                                                            //e.stopPropagation();
                                                                                                            var $lefty = $("#FilterMenu, #FilterLasche");
                                                                                                            $lefty.css('z-index', 3000).animate({
                                                                                                                left: 0
                                                                                                            })
                                                                                                        });


                                                                                                        $(document).on("click", function (event) {
                                                                                                            if (!$(event.target).closest('#FilterMenu, .ui-widget, #FilterLasche').length) {
                                                                                                                var $lefty = $("#FilterMenu, #FilterLasche");
                                                                                                                $lefty.animate({
                                                                                                                    left: -235
                                                                                                                }).css('z-index', 5)
                                                                                                            }
                                                                                                        })


                                                                                                        function toggleFilterFavorite(FilterID) {
                                                                                                            $.get('index.php?module=ticketlist&event=toggleFilterFavorite&id=' + FilterID).done(function (data) {
                                                                                                                if (data == 1) {
                                                                                                                    //Als Favorit gesetzt:
                                                                                                                    $("#FilterItem_" + FilterID).detach().appendTo('#PanelBodyFavorit');
                                                                                                                    //$("#FilterItemImage_" + FilterID).attr('src', 'images/Favorite.png');
                                                                                                                    //$("#FilterItem_"+FilterID).clone().appendTo($("#FilterFavorites"));
                                                                                                                } else {
                                                                                                                    //$("#FilterItemImage_" + FilterID).attr('src', 'images/addFavorite.png');
                                                                                                                    $("#FilterItem_" + FilterID).detach().appendTo('#PanelBodyOther');
                                                                                                                }
                                                                                                            })
                                                                                                        }

                                                                                                        function deleteTicketFilter(FilterID, confirm) {
                                                                                                            $("#FilterItem_" + FilterID).hover();
                                                                                                            $.get('index.php?module=ticketlist&event=deleteTicketFilter&id=' + FilterID + '&confirmed=' + confirm).done(function (data) {
                                                                                                                if (data == 1) {
                                                                                                                    $("#FilterItem_" + FilterID).hide();
                                                                                                                    noty({
                                                                                                                        text: "[% $user->gettext("Der Filter wurde gelöscht") %]",
                                                                                                                        //layout: 'top',
                                                                                                                        //theme: 'defaultTheme', // or 'relax'
                                                                                                                        //closeWith: ['click', 'hover'],
                                                                                                                        type: 'success',
                                                                                                                        timeout: notifyTimeout
                                                                                                                    });

                                                                                                                } else if (data == 2) {
                                                                                                                    $(function () {
                                                                                                                        $("#dialog-confirm").dialog({
                                                                                                                            resizable: false,
                                                                                                                            //height:140,
                                                                                                                            modal: true,
                                                                                                                            buttons: {
                                                        [% $user->gettext("Löschen") %]: function () {
                                                                                                                                    deleteTicketFilter(FilterID, 1);
                                                                                                                                    $(this).dialog("close");
                                                                                                                                },
                                                        [% $user->gettext("Abbrechen") %]: function () {
                                                                                                                                    $(this).dialog("close");
                                                                                                                                }
                                                                                                                            }
                                                                                                                        });
                                                                                                                    });
                                                                                                                } else {
                                                                                                                    alert("Filter konnte nicht gel&ouml;scht werden.");
                                                                                                                }
                                                                                                            })
                                                                                                        }

                                                                                                        $("#FilterMenu2, #FilterLasche2").on("click", function (e) {
                                                                                                            e.stopPropagation();
                                                                                                            var $lefty = $("#FilterMenu2, #FilterLasche2");
                                                                                                            $lefty.css('z-index', 3000).animate({
                                                                                                                left: 0
                                                                                                            })
                                                                                                        });




                                                                                                        $(document).on("click", function (event) {
                                                                                                            if (!$(event.target).closest('#FilterMenu2, .ui-widget, .ui-datepicker-header').length) {
                                                                                                                var $lefty = $("#FilterMenu2, #FilterLasche2");
                                                                                                                $lefty.animate({
                                                                                                                    left: -865
                                                                                                                }).css('z-index', 5)
                                                                                                            }
                                                                                                        })

                                                                                                        $(".ToggleDefaultFilter").on("click", function (e) {

                                                                                                            var FilterID = $(this).attr("id").replace("ToggleFilter_", "");
                                                                                                            $.get('index.php?module=ticketlist&event=toggleDefaultFilter&id=' + FilterID).done(function (data) {
                                                                                                                if (data == 1) {
                                                                                                                    $(".ToggleDefaultFilter").attr('checked', false);
                                                                                                                    $("#ToggleFilter_" + FilterID).attr('checked', true);
                                                                                                                    $("#FilterItem_" + FilterID).attr('background-color:grey');
                                                                                                                    $('#FilterExport').val('load');
                                                                                                                    $('#FilterNames').val(FilterID);
                                                                                                                    $('#FilterForm').submit();
                                                                                                                } else if (data == 0) {
                                                                                                                    $('#FilterExport').val('');
                                                                                                                    $('#FilterNames').val('');
                                                                                                                    $('#FilterForm').submit();
                                                                                                                }
                                                                                                            })

                                                                                                        })

                                                                                                        function toggleFilterDetails(id) {

                                                                                                            var FilterToggleIcon = $("#FilterItem_" + id + " .ToggleFilterDetails");
                                                                                                            if (FilterToggleIcon.hasClass("rotated")) {
                                                                                                                FilterToggleIcon.removeClass("rotated");
                                                                                                                $("#FilterItem_" + id + " .FilterDetails").hide();
                                                                                                            } else {
                                                                                                                $(".FilterDetails").hide();
                                                                                                                $(".ToggleFilterDetails").removeClass("rotated");
                                                                                                                $("#FilterItem_" + id + " .FilterDetails").show();
                                                                                                                FilterToggleIcon.addClass("rotated");
                                                                                                            }
                                                                                                        }


                                                                                                        //Ticket im Modal öffnen
                                                                                                        $('.openTicket').on('click', function (e) {
                                                                                                            e.preventDefault();
                                                                                                            $('#TicketModal').modal('show').find('.modal-body').load($(this).attr('href'));
                                                                                                        });



    jQuery(document).ready(function () {

initTicketPopovers();

        if (jQuery('body').hasClass('home')) {
            jQuery('#toggleSidebar').animate({'left': '32px'}, 'slow');
        } else {
            jQuery('body').addClass('ss-open');
            //jQuery('#toggleSidebar').show({'left':'-'+jQuery('#toggleSidebar-container').width() +'px'});
        }

        $('#filterPopover').popover(
                {
                    container: 'body',
                    html: true,
                    placement: 'right',
                    content: function () {
                        return $("#toggleSidebar-container").html();
                    }
                }
        );


        document.onkeydown = function (e) {
            if (e.keyCode == 17) {
                $('#listTable').dragtable({
                    persistState: function (table) {
                        var id = [];
                        table.el.find('th').each(function (i) {
                            id.push($(this).attr('id'));
                        });
                        $.post("index.php?module=ticketlist&event=saveColumnOrder", {cols: JSON.stringify(id)}, function (data) {
                            $("#updateFilterBtn").removeClass('invisible');
                            console.log('Update Filter Visible Pos 6');
                            sessionStorage.setItem("update", "1");
                        });
                    },
                    dragaccept: '.dragaccept'
                });
            }
        }


        document.onkeyup = function (e) {
            if (e.keyCode == 17) {
                $('#listTable').dragtable('destroy');
            }
        }

        //Ticketlistensortierung:
        $(".HeaderTitle").on("click", function (e) {
            var id = $(this).parent().parent().attr('id');
            ;
            console.log(id);
            console.log(this.classList);
            var SortOrder = 'ASC';
            var sort = $("#newSort").val();
            if (sort == id) {
                SortOrder = $("#Minisortorder").val();
                if (SortOrder == 'ASC') {
                    SortOrder = 'DESC';
                } else {
                    SortOrder = 'ASC';
                }
            }

            $("#newSort").val(id);
            $("#sort").val(id);
            $("#Minisortorder").val(SortOrder);
            $("#sortorder").val(SortOrder);
            sessionStorage.setItem("update", "1");
            $("#miniSearchForm").submit();

        })

        //Sortierung über Klick aufs Icon


        //ExportButton
        $("#ExportButton").on("click", function () {
            $("#Export").val('xls');
            $("#miniSearchForm").submit();
            $("#Export").val('none');
        })

        $("#paging").on("change", function () {
            pos = $("#paging").val();
            switchPage(pos);
        })

    });

    function loadLegendModal() {
        $('#legendModal').modal('show');
    }
    $(document).ready(function () {
        $('#dismiss, .overlay').on('click', function () {
            // hide sidebar
            $('#sidebar').removeClass('active');
            // hide overlay
            $('.overlay').removeClass('active');
        });

        $('#sidebarCollapse').on('click', function () {
            // open sidebar
            $('#sidebar').addClass('active');
            // fade in the overlay
            $('.overlay').addClass('active');
            $('.collapse.in').toggleClass('in');
            $('a[aria-expanded=true]').attr('aria-expanded', 'false');
        });
    });

    function nkeyEvent(event) {
        if (event.keyCode == 13) {
            $("#sideSearchForm").submit();
        }
    }


    REL_PATH = "[% $rel_path %]";

    var visibleSearchfields = [% $json_show %];
    $("#miniSearchForm").hide();
    $(document).ready(function () {


        $(".SimpleField:not(.visible) ").hide();
        for (var SearchField in visibleSearchfields) {
            //$("#Search_" + SearchField ).detach().appendTo('#additionalFilterField').show();
            $("#Search_" + SearchField).show();
        }
[% if !$user->hasRight(243) %]
[%* Suchformular ausblenden, wenn Benutzer Supporter nicht sehen darf Datenschutz-Recht *%]
        $("#miniSearchForm").show();
[% /if %]

        //Wenn Minisuchfelder geändert werden, den geladenen Filter aus der Auswahl entfernen
        $("miniSearchForm select, input").not("#miniFilterNames").on("change", function () {
            //console.log("Filter wurde geändert. Option zum Speichern des Filters anzeigen");
        });

    });

    $(document).ready(addMultiselect);

    function addMultiselect() {

        $('#miniSearchForm').keypress(function (e) {

            if (e.which == 13) {
                $(this).blur();
                $('#SubmitbuttonMiniSearch').focus().trigger("click");
                e.preventDefault();
                return false;
            }
        });
    }


    function setPeriod(el, item) {
        var start = document.getElementById(item + "Start");
        var end = document.getElementById(item + "End");
        var i = el.options[el.options.selectedIndex].value;

        if (start && end) {

            switch (i) {

                case "1":
                    start.value = "[% $timing.today[0] %]";
                    end.value = "[% $timing.today[1] %]";
                    break;

                case "2":
                    start.value = "[% $timing.yesterday[0] %]";
                    end.value = "[% $timing.yesterday[1] %]";
                    break;

                case "3":
                    start.value = "[% $timing.lastweek[0] %]";
                    end.value = "[% $timing.lastweek[1] %]";
                    break;

                case "4":
                    start.value = "[% $timing.lastmonth[0] %]";
                    end.value = "[% $timing.lastmonth[1] %]";
                    break;

[% if $timing_add %]
[% foreach from=$timing_add item=timing2 %]
                case "[% $timing2.id %]":
                    start.value = "[% $timing2.start %]";
                    end.value = "[% $timing2.end %]";
                    break;
[% /foreach %]
[% /if %]
                default:
                case "0":
                    start.value = "";
                    end.value = "";
                    break;
            }
        }

        reloadPage();
    }



    $('.dropdown-menu option, .dropdown-menu select').on("click", function (e) {
        e.stopPropagation();
    });

    function submitNewSearchForm() {
        $("#miniSearchForm #pos").val(0);
        $("#miniSearchForm").submit();
    }


    function saveCol() {
        //$("#sideSearchForm").submit();
    }

    function resetCol() {
        $("input[id=resetColm]").val("-1");
        $("#sideSearchForm").submit();
    }

    $(".dialog-filter").fancybox({
        width: 500,
        maxHeight: 400,
        closeClick: false
    });

    $(document).ready(function () {
        setTimeout(function () {
            $("#TicketlistPanelBody").removeClass("hidden");
            $("MiniSucheAuswahl2").selectpicker('refresh');
        }, 300);



    })

    $("#tgSort").on("click", function (e) {
        if (!sortMode) {
            sortMode = true;
            $("#sortState").html("[% $user->gettext('an') %]");
            $('#listTable').dragtable({
                persistState: function (table) {
                    var id = [];
                    table.el.find('th').each(function (i) {
                        id.push($(this).attr('id'));
                    });
                    $.post("index.php?module=ticketlist&event=saveColumnOrder", {cols: JSON.stringify(id)}, function (data) {
                        $("#updateFilterBtn").removeClass('invisible');
                        console.log('Update Filter Visible Pos 7');
                    });
                },
                dragaccept: '.dragaccept'
            });
        } else {
            sortMode = false;
            $("#sortState").html("[% $user->gettext('aus') %]");
            $('#listTable').dragtable('destroy');
        }
    });


    $(document).on('click', '.dropdown-menu', function (e) {
        e.stopPropagation();
    });

    /*
        history.pushState(null, null, document.URL);
        window.addEventListener('popstate', function () {
        history.pushState(null, null, document.URL);
        });
        */
    /**
        *
        */
    function changeStatus(ticketid) {
        $.post('index.php?module=ticket&event=changestatus&ticketid=' + ticketid, function (data) {
            console.log(data);
            if (data !== '0') {

                $('#Status_Ticket_' + ticketid).text(data);
            } else {
                noty({
                    text: "[% $user->gettext("Ticketstatus kann nicht aktualisiert werden.") %]",
                    type: 'error',
                    timeout: notifyTimeout
                });
            }
        });
    }

    $(window).on("load", function () {
        $(".iframe-anchor").on("click", function () {

            top.window.location.href = $(this).attr("href");
            return false;
        })
    })
                                                    </script>

                                                    <script>

                                                        var columnsWidth = [];

                                                        $(document).ready(function () {
                                                            var table = document.getElementById('listTable');
                                                            resizableGrid(table);
                                                        });

                                                        function resizableGrid(table) {
                                                            var row = table.getElementsByTagName('tr')[0],
                                                                    cols = row ? row.children : undefined;
                                                            if (!cols)
                                                                return;
                                                            for (var i = 0; i < cols.length; i++) {
                                                                // var div = createDiv(table.offsetHeight);
                                                                var div = createDiv(49);
                                                                //      console.log(div);

                                                                cols[i].appendChild(div);
                                                                cols[i].style.position = 'relative';
                                                                setListeners(div);
                                                            }
                                                        }

                                                        function createDiv(height) {
                                                            var div = document.createElement('div');
                                                            div.classList.add('dragElement');
                                                            div.style.top = 0;
                                                            div.style.right = 0;
                                                            div.style.width = '10px';
                                                            div.style.position = 'absolute';
                                                            div.style.cursor = 'col-resize';
                                                            div.style.backgroundColor = 'transparent';
                                                            div.style.userSelect = 'none';
                                                            div.style.height = height + 'px';
                                                            div.style.zIndex = 999;
                                                            return div;
                                                        }



                                                        function setListeners(div) {
                                                            var pageX, curCol, nxtCol, curColWidth, nxtColWidth;
                                                            div.addEventListener('mousedown', function (e) {
                                                                e.stopPropagation();
                                                                curCol = e.target.parentElement;
                                                                nxtCol = curCol.nextElementSibling;
                                                                pageX = e.pageX;
                                                                curColWidth = curCol.offsetWidth
                                                                if (nxtCol)
                                                                    nxtColWidth = nxtCol.offsetWidth
                                                            });

                                                            document.addEventListener('mousemove', function (e) {
                                                                if (curCol) {
                                                                    var diffX = e.pageX - pageX;
                                                                    console.log("NextCol" + nxtCol);
                                                                    console.log("diffX: " + diffX);
                                                                    /*
                                                                     if (nxtCol) {
                                                                     
                                                                     nxtCol.style.minWidth = (nxtColWidth - (diffX)) + 'px';
                                                                     console.log("Next Element");
                                                                     
                                                                     }
                                                                     */
                                                                    curCol.style.minWidth = (curColWidth + diffX) + 'px';
                                                                }
                                                            });

                                                            document.addEventListener('mouseup', function (e) {

                                                                curCol = undefined;
                                                                nxtCol = undefined;
                                                                pageX = undefined;
                                                                nxtColWidth = undefined;
                                                                curColWidth = undefined;



                                                            });




                                                        }

                                                        document.addEventListener('mouseup', function (e) {
                                                            if ($(e.target).hasClass('dragElement') || $(e.target).hasClass('TicketlistHeader')) {
                                                                getColumnsWidth();
                                                                $("#updateFilterBtn").removeClass('invisible');
                                                                console.log('Update Filter Visible Pos 1');

                                                            }


                                                        });

                                                        $(".dragElement").on('click', function (event) {
                                                            event.stopPropagation();
                                                            event.stopImmediatePropagation();
                                                            //(... rest of your JS code)
                                                        });

                                                        /**
                                                         * Comment
                                                         */
                                                        function getColumnsWidth() {
                                                            var ths = document.getElementsByTagName('th');

                                                            columnsWidth = [];
                                                            for (var i = 0; i < ths.length; i++) {
                                                                // do something with myarray[i]
                                                                var id = ths[i].id;
                                                                if (id !== '') {
                                                                    columnsWidth.push({"id": id, "width": $("#" + id).width()});
                                                                }

                                                            }
                                                            $("#ColumnsWidth").val(JSON.stringify(columnsWidth));
                                                            console.log(columnsWidth);
                                                        }
                                                        /**
                                                         * reloa
                                                         */
                                                        function closeIFrame() {
                                                            $("#myBigIFrameModal").modal('hide');
                                                        }

                                                        function fancyBoxClose() {
                                                            $("#fancybox-frame").on("load", function () {
                                                                $.fancybox.close();
                                                            });

                                                        }

//Ticket-Beschreibung verkürzt anzeigen:
$(document).on('click', '.event-toggle-btn', function() {
  const $btn = $(this);
  const $target = $($btn.data('target'));

  $target.toggleClass('expanded');

  const isExpanded = $target.hasClass('expanded');
  $btn.find('.label').text(isExpanded ? '[% $user->gettext("Weniger anzeigen") %]'   : '[% $user->gettext("Mehr anzeigen") %]'  );

  $btn.find('i')
    .toggleClass('fa-chevron-down', !isExpanded)
    .toggleClass('fa-chevron-up', isExpanded);
});
function initTicketPopovers() {
    $('[data-bs-toggle="popover"]').each(function () {
        const $el = $(this);
        let showTimeout, hideTimeout;

        $el.off('mouseenter mouseleave'); // alte Events entfernen

        $el.on('mouseenter', function () {
            clearTimeout(hideTimeout); // eventuell laufendes hide abbrechen

            showTimeout = setTimeout(function () {
                // Alle anderen Popover schließen
                //$('[data-bs-toggle="popover"]').popover('hide');
                $('[data-bs-toggle="popover"]').not($el).popover('hide');

                $.get($el.data('poload'), function (data) {
                    $el.attr('data-bs-content', data);

                    $el.popover('dispose').popover({
                        html: true,
                        trigger: 'manual',
                        container: 'body'
                    }).popover('show');
                });
            }, 300); // 300ms Verzögerung
        });

        $el.on('mouseleave', function () {
            clearTimeout(showTimeout); // Anzeige abbrechen, falls Maus zu früh weg

            hideTimeout = setTimeout(function () {
                // Nur verstecken, wenn Maus NICHT über dem Popover ist
                if (!$('.popover:hover').length) {
                    $el.popover('hide');
                }
            }, 200); // 200ms Verzögerung fürs "Zurückgleiten"
        });

        // Verstecke das Popover, wenn Maus auch das Popover selbst verlässt
        $(document).off('mouseleave.popover').on('mouseleave.popover', '.popover', function () {
            $('[data-bs-toggle="popover"]').popover('hide');
        });
    });
}




</script>