<style>
    .bootstrap-select .dropdown-menu {
        max-width: 450px;
    }
    .bootstrap-select .dropdown-menu span.text {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .datepicker{
        transform: translate(0, 3.1em) !important;
    }
</style>

<div class="form-horizontal form-label-left">
    <link rel="stylesheet" type="text/css" href="includes/js/select2/css/select2.min.css">
    <script type="text/javascript" src="includes/js/jquery.progressbar.min.js"></script>
    <script type="text/javascript" src="includes/js/jquery-ui-timepicker-addon.js"></script>
    <script type="text/javascript" src="includes/js/select2/js/select2.full.min.js"></script>
    <script type="text/javascript" src="includes/js/select2/js/i18n/de.js"></script>
    <link rel="stylesheet" href="includes/js/bootstrap-select-1.12.4/dist/css/bootstrap-select.min.css">

    <!-- Latest compiled and minified JavaScript -->
    <script src="includes/js/bootstrap-select-1.12.4/dist/js/bootstrap-select.min.js"></script>

    <!-- (Optional) Latest compiled and minified JavaScript translation files -->
    <script src="includes/js/bootstrap-select-1.12.4/dist/js/i18n/defaults-[% if $user->language_type == "de" %]de_DE[% else %]en_US[% /if %].min.js"></script>
    <div class="card panel-info shadow-sm rounded" id="editTicketCollection" >
        <div class="card-header">
            <div class="row">
                <div class="col-lg-6">
                    <span class="fcs-card-title h6">[% $user->gettext('Tickets - Sammelbearbeitung') %]</span>

                </div>
                <div class="col-lg-6 text-end">
                    <input type="button" class="btn btn-outline-primary TCFormButton" name="save" value="[% $user->gettext('Speichern') %]" onclick="submitEditTC();">                    
                    <button type="button" class="btn btn-outline-danger" data-bs-dismiss="modal" title="[% $user->gettext('Schließen') %]" aria-label="[% $user->gettext('Schließen') %]">
                      <i class="fas fa-times" aria-hidden="true"></i>
                    </button>

                </div>
            </div>
        </div>
        <div class="card-body">
            <div class="row" >
                <div class="col-md-12">
                    <div class="progress" id="progress" style="display:none;">
                        <div class="progress-bar progress-bar-striped active" id="progressBar" role="progressbar"
                             style="width:0%;">

                        </div>
                    </div>
                    <br>
                    <div id="noti">

                    </div>
                    <div id="Tickets" >
                        <ul id="ResultMessages" class="list-group"></ul>
                    </div>
                    <div class="text-center">
                        <a id="ReloadButton"  style="display:none; margin-bottom: 20px;"><span class="fa fa-repeat"></span> [% $user->gettext('Bearbeitungen durchgeführt. Liste wird neu geladen.') %]</a>       
                    </div>
                </div>
                [% if $user->hasRight(215) || $user->hasRight(216) || $user->hasRight(26) || $user->hasRight(863) || $Tools->FCS_Count($backlogs) %]
                    <div class="col-md-4">         
                        [% if $user->hasRight(26) %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-4" for="ChangeStatus">[% $user->gettext('Status') %]</label>

                                <div class="col-sm-8">
                                    <select data-style="btn-outline-secondary" class="selectpicker form-control" name="ChangeStatus" id="ChangeStatus">
                                        <option value ="0">[% $user->gettext('Nicht ändern') %]</option>
                                        [% foreach from = $status_list item = $status %]
                                            <option value ="[% $status.id %]">[% $user->gettext($status.descr) %]</option>
                                        [% /foreach %]
                                    </select>
                                </div>
                            </div>
                        [% /if %]
                        [% if $user->hasRight(2) %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-4" for="contact_id">[% $user->gettext('Kontakt') %]</label>

                                <div class="col-sm-8">
                                    <select data-style="btn-outline-secondary" class="form-control" name="contact_id" id="contact_id" class="form-control selectpicker" style='width: 100%;'>
                                    </select>
                                </div>
                            </div>
                        [% /if %]
                        [% if $user->hasRight(215) %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-4" for="TCGroupID">[% $user->gettext('Gruppe') %]</label>
                                <div class="col-sm-8">
                                    <select data-style="btn-outline-secondary" name="TCGroupID[]" size="1" id="TCGroupID" class="selectpicker form-control" multiple data-live-search="true" data-selected-text-format="count>0"
                                            data-count-selected-text= "[%$user->gettext('Gruppe')%] ({0} [%$user->gettext('gewählt')%])" style="width:100%" >
                                        <option value="-2">[% $user->gettext('Keine') %] </option>
                                        <option value="-1" selected="selected">[% $user->gettext('Nicht ändern') %] </option>
                                        [% html_options options=$groups selected=$TicketCollection.GroupIDs  %]
                                    </select>
                                </div>
                            </div>
                        [% /if %]    
                        [% if $user->hasRight(216) %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-4" for="TCSupporterID">[% $user->gettext('Supporter') %]</label>
                                <div class="col-sm-8">
                                    <select data-style="btn-outline-secondary" name="TCSupporterID[]" size="1" id="TCSupporterID" class="selectpicker form-control" data-live-search="true" data-selected-text-format="count>0"
                                            data-count-selected-text= "[%$user->gettext('Supporter')%] ({0} [%$user->gettext('gewählt')%])" multiple  style="width:100%">
                                        <option value="-2">[% $user->gettext('Keine') %] </option>
                                        <option value="-1" selected="selected" id="optUnChanged">[% $user->gettext('Nicht ändern') %] </option>
                                        [% foreach from=$supporters item=supporter key=user_id %]
                                            <option value="[% $supporter.user_id %]" [% if $supporter.user_id == $TicketCollection.SupporterID %]selected="selected"[% /if %]>[% $supporter.name %]</option>
                                        [% /foreach %]
                                    </select>
                                </div>
                            </div>                                                                       
                        [% /if %]
                        [% if $user->hasRight(863) %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-4" for="TCTypeID">[% $user->gettext('Tickettyp') %]</label>
                                <div class="col-sm-8">
                                    <select data-style="btn-outline-secondary" name="TypeID[]" size="1" id="TCTypeID" class="form-control selectpicker" data-live-search="true"  data-max-options="1" data-selected-text-format="count>0"
                                            data-count-selected-text= "[%$user->gettext('Tickettyp')%] ({0} [%$user->gettext('gewählt')%])"   style="width:100%">
                                        <option value="9999">[% $smarty.const.STANDARD_NAME %] </option>
                                        <option value="9998" selected="selected" id="">[% $user->gettext('Nicht ändern') %] </option>
                                        [% foreach from=$ticket_types item=type %]
                                            <option value="[% $type.type_id %]">[% $type.type_name %]</option>
                                        [% /foreach %]
                                    </select>
                                </div>
                            </div>
                        [% /if %]
                        [% if $Tools->FCS_Count($backlogs) && $user->Security->Backlog && ($user->isSupporter() || $user->hasRight(900))  %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-4" for="TCBacklogIDs">[% $user->gettext('Backlog') %]</label>
                                <div class="col-sm-8">
                                    <select data-style="btn-outline-secondary" name="BacklogIDs[]" size="1" id="TCBacklogIDs" class="form-control selectpicker" data-live-search="true"  data-max-options="1" data-selected-text-format="count>0"
                                            data-count-selected-text= "[%$user->gettext('Backlog')%] ({0} [%$user->gettext('gewählt')%])"   style="width:100%">
                                        <option value="0">[% $user->gettext('Nicht ändern') %]</option>
                                        [% foreach from=$backlogs item=$bl %]
                                            <option value="[% $bl.id %]">[% $bl.name %]</option>
                                        [% /foreach %]
                                    </select>
                                </div>
                            </div>
                        [% /if %]
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-4" for="TCStoryIDs">[% $user->gettext('Story') %]</label>
                            <div class="col-sm-8">
                                <select data-style="btn-outline-secondary" name="StorysID[]" size="1" id="TCStoryIDs" class="form-control selectpicker" data-live-search="true"  data-max-options="1" data-selected-text-format="count>0"
                                        data-count-selected-text= "[%$user->gettext('Story')%] ({0} [%$user->gettext('gewählt')%])"   style="width:100%">
                                    <option value="0">[% $user->gettext('Nicht ändern') %]</option>
                                    [% foreach from=$Storys item=$st key=sid %]
                                        <option value="[% $sid %]">(#[% $sid %]) [% $st %]</option>
                                    [% /foreach %]
                                </select>
                            </div>
                        </div>
                    </div>
                [% /if %]                 
                [% if $user->hasRight(5) %]
                    <div class="col-md-4">               
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-5" for="CategoryDescr1">[% $user->gettext('Kategorie') %] 1</label>
                            <div class="col-sm-7">
                                <div class="input-group">
                                    <input type="hidden" id="CategoryID1" name="TCCategoryID1" value="[% $TicketCollection.Cat1ID %]"/>
                                    <input type="text" class="form-control"id="CategoryDescr1" size="25" readonly="readonly"  value="[% $TicketCollection.Cat1Name %]"  />
                                    <a href="JavaScript:openCategory(1);" class="btn btn-outline-primary"><i class="fa  fa-folder-open"  title="[% $user->gettext('Kategorie ausw&auml;hlen') %]"></i></a>
                                </div>

                            </div>
                        </div>
                        [% if !$user->hasRight(51)  %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-5" for="CategoryDescr2">[% $user->gettext('Kategorie') %] 2</label>
                                <div class="col-sm-7">
                                    <div class="input-group">
                                        <input type="hidden" id="CategoryID2" name="TCCategoryID2" value="[% $TicketCollection.Cat2ID %]"/>
                                        <input type="text" class="form-control"id="CategoryDescr2" size="25" readonly="readonly"  value="[% $TicketCollection.Cat2Name %]"  />
                                        <a href="JavaScript:openCategory(2);" class="btn btn-outline-primary"><i class="fa  fa-folder-open"  title="[% $user->gettext('Kategorie ausw&auml;hlen') %]"></i></a>
                                    </div>
                                </div>
                            </div>                                
                        [% /if %]

                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-5" for="TCTags">[% $user->gettext('Schlagworte') %]</label>
                            <div class="col-sm-7">
                                <select name="TCTags[]" size="1" id="TCTags" class="selectpicker form-control" multiple data-live-search="true" data-selected-text-format="count>0"
                                        data-count-selected-text= "[%$user->gettext('Schlagworte')%] ({0} [%$user->gettext('gewählt')%])" >
                                    <option value="-2">[% $user->gettext('Keine') %] </option>
                                    <option value="-1" selected="selected">[% $user->gettext('Nicht ändern') %] </option>
                                    [% html_options options=$tags selected=$TicketCollection.Tags  %]
                                </select>
                            </div>
                        </div>

                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-5" for="TCProject">[% $user->gettext('Projekt') %]</label>
                            <div class="col-sm-7">
                                <select name="TCProject[]" size="1" id="TCProject" class="form-control selectpicker" data-live-search="true"  data-max-options="1" style="width:100%">
                                    <option value="9998" selected="selected" id="">[% $user->gettext('Nicht ändern') %] </option>
                                    [% foreach from=$ticket_projects item=project %]
                                        <option value="[% $project.projectid %]">[% $project.projectname %]</option>
                                    [% /foreach %]
                                </select>
                            </div>
                        </div>
                    </div>
                [% /if %]         

                <div class="[% if ($user->hasRight(215) || $user->hasRight(216) || $user->hasRight(26) || $user->hasRight(863) || $Tools->FCS_Count($backlogs)) && $user->hasRight(5) %]col-md-4[% else %]col-md-8 [% /if %]">                                                          
                    <div class="mb-3 row">
                        <label class="col-form-label col-sm-10" for="keepOnHold">[% $user->gettext('Bei &Auml;nderung Status Zur&uuml;ckgestellt erhalten') %]</label>
                        <div class="col-sm-2">
                            <input type="checkbox" value="1" id="keepOnHold" name="keepOnHold" [% if $TicketCollection.keepOnHold %]checked="checked"[% /if %] />
                        </div>
                    </div>   
                    <hr/>
                    [%*
                        [% if $TicketBasket %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-10" for="removeFromBasket">[% $user->gettext('Ticktes aus Merkliste entfernen') %]</label>
                                <div class="col-sm-2">
                                    <input type="checkbox" value="1" name="removeFromBasket" id="removeFromBasket" />
                                </div>
                            </div>  
                        [% else %]                                
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-10" for="saveInBasket">[% $user->gettext('Tickets in Merkliste speichern') %]</label>
                                <div class="col-sm-2">
                                    <input type="checkbox" value="1" name="saveInBasket" id="saveInBasket" />
                                </div>
                            </div>  
                        [% /if %]
                   
                        [% if false && $user->hasRight(110) && $STATUSDONEACTIVE %]
                            <div class="mb-3 row">
                                <label class="col-form-label col-sm-10" for="setTicketDone">[% $user->gettext('Tickets erledigt') %]</label>
                                <div class="col-sm-2">
                                    <input type="checkbox" value="1" name="setTicketDone" id="setTicketDone" [% if $TicketCollection.setTicketDone %]checked="checked"[% /if %] />
                                </div>
                            </div>      
                        [% /if %]
                    *%]
                    [% if $user->hasRight(26) && !$user->hasRight(116) %]                               
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-10" for="setTicketClose">[% $user->gettext('Tickets schlie&szlig;en') %]</label>
                            <div class="col-sm-2">
                                <input type="checkbox" value="1" name="setTicketClose" id="setTicketClose" [% if $TicketCollection.closeTicket %]checked="checked"[% /if %] />
                            </div>
                        </div>                                 
                    [% /if %]

                    [% if $user->hasRight(110) && $STATUSDONEACTIVE  %]                       
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-10" for="setTicketsDone">[% $user->gettext('Tickets auf ERLEDIGT setzten') %]</label>
                            <div class="col-sm-2">
                                <input type="checkbox" value="1" name="setTicketsDone" id="setTicketsDone" [% if $TicketCollection.setTicketsDone %]checked="checked"[% /if %] />
                            </div>
                        </div>                                 
                    [% /if %]

                    [% if $user->hasRight(26) && !$user->hasRight(116) %]                               
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-10" for="setTicketCanceled">[% $user->gettext('Tickets stornieren') %]</label>
                            <div class="col-sm-2">
                                <input type="checkbox" value="1" name="setTicketCanceled" id="setTicketCanceled" [% if $TicketCollection.cancelTicket %]checked="checked"[% /if %] />
                            </div>
                            <span class="help-block">[% $user->gettext('Beim Stornieren werden die gewählten Tickets geschlossen, ohne dass Pflichtfelder geprüft und eine Benachrichtigung versendet wird.') %]</span>
                        </div>                                 
                    [% /if %]

                    [% if $user->hasRight(100) %]
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-10" for="setTicketDelete">[% $user->gettext('Tickets l&ouml;schen') %]</label>
                            <div class="col-sm-2">
                                <input type="checkbox" value="1" name="setTicketDelete" id="setTicketDelete" [% if $TicketCollection.deleteTicket %]checked="checked"[% /if %] />
                            </div>
                        </div>                              
                    [% /if %]
                    [% if $user->hasRight(12) %]
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-6">[% $user->gettext('Tickets zur&uuml;ckstellen') %]</label>
                            <div class="col-sm-6">
                                <input type="input" name="setTicketOnHoldDate" id="setTicketOnHoldDate" value="[% $TicketCollection.setTicketOnHoldDate %]" class="form-control" />
                            </div>
                        </div>                              
                    [% /if %]

                    <div class="mb-3 row">
                        <label class="col-form-label col-sm-6" for="">[% $user->gettext('Masterticket') %]</label>
                        <div class="col-sm-6">
                            <div id='NewlyCreatedMaster' style='display: none;'><b>[% $user->gettext('Neues angelegtes Masterticket') %]</b> <button type='button' class='btn btn-outline-primary'  onclick='$("#NewlyCreatedMaster").hide(); $("#TicketRefDiv").show();'>[% $user->gettext('oder Ticket wählen') %]</button></div>
                            <div id='TicketRefDiv'>
                                <select  class="selectpicker"  title="[% $user->gettext('Ticket wählen') %]" id="TicketRefId" name="TicketRefId" data-live-search="true"  data-dropdown-align-right="true" data-size="15" >

                                </select>  
                                <button type="button" style='margin-top: 10px;' class='btn btn-outline-primary' onclick='$("#NewlyCreatedMaster").show();
                                        $("#TicketRefDiv").hide();
                                        var chid_ids = [];
                                        var child_string = "";
                                        $.each($(".selectTicket:checked"), function () {
                                            chid_ids.push($(this).val());
                                        });
                                        child_string = chid_ids.join(",");
                                        window.open("index.php?module=ticket&event=newTicket&subevent=createMaster&typeid=0&childs=" + child_string);'
                                        >[% $user->gettext('Masterticket anlegen') %]</button>
                            </div>
                        </div>
                    </div>

                    <div class="mb-3 row">
                        <label class="col-form-label col-sm-6" for="setTicketOnHoldDate">[% $user->gettext('Tickets verkn&uuml;pfen') %]</label>
                        <div class="col-sm-6">
                            <select  class="selectpicker" data-live-search="true" data-selected-text-format="count>1"
                                     data-count-selected-text= "({0} [%$user->gettext('gewählt')%])"  data-size="15"  data-dropdown-align-right="true" title="[% $user->gettext('W&auml;hlen Sie ein Ticket um es mit den gew&auml;hlten Tickets zu verkn&uuml;pfen') %]" multiple id="TicketConnectId" name="TicketConnectId[]" ></select>  
                        </div>
                    </div>     
                    [% if $user->hasRight(221) %]
                        <div class="mb-3 row">
                            <label class="col-form-label col-sm-10" for="archivedTickets">[% $user->gettext('Tickets archivieren') %]</label>
                            <div class="col-sm-2">
                                <input type="checkbox" value="1" name="archivedTickets" id="archivedTickets" [% if $TicketCollection.archivedTickets %]checked="checked"[% /if %] />
                            </div>
                        </div>                              
                    [% /if %]

                </div>
            </div>

        </div>

        <div id="dialog-category" style="display:none;" width="500" hight="500"></div> <!--dialog-category-->
    </div>
</div>
<script>
    var values = JSON.parse(localStorage.getItem("checkboxes"));
    var TicketIDs = values.join();

    [% include file=$modulePath|cat:"/editTicketCollectionJS.js" %]

    [% if $user->hasRight(2) %]
    $("#contact_id").select2({theme: 'bootstrap-5',
        language: "[% $user->language_type %]",
        ajax: {
            url: "index.php?module=contact&event=getJsonContacts",
            dataType: 'json',
            delay: 250,
            data: function (params) {
                return {
                    q: params.term, // search term
                    page: params.page


                };
            },
            processResults: function (data) {

                return {
                    results: data.items
                };
            }
        },
        escapeMarkup: function (markup) {
            return markup;
        }// let our custom formatter work
        //  minimumInputLength: 1,
        //  templateResult: formatService // omitted for brevity, see the source of this page
        //templateSelection: formatServiceSelection // omitted for brevity, see the source of this page
    })
    [% /if %]

    $("#TicketRefId").select2({theme: 'bootstrap-5',
        language: ts_lang,
        minimumInputLength: 2,
        ajax: {
            url: "index.php?module=ticket&event=autocompleteRefTicketsJson2",
            dataType: 'json',
            delay: 250,
            data: function (params) {
                return {
                    q: params.term,
                    page: params.page,
                    TicketIDs: TicketIDs
                };
            },
            processResults: function (data) {
                return {
                    results: data.results
                };
            }
        }
    })

    $("#TicketConnectId").select2({theme: 'bootstrap-5',
        language: ts_lang,
        minimumInputLength: 2,
        ajax: {
            url: "index.php?module=ticket&event=autocompleteRefTicketsJson2",
            dataType: 'json',
            delay: 250,
            data: function (params) {
                return {
                    q: params.term,
                    page: params.page,
                    TicketIDs: TicketIDs
                };
            },
            processResults: function (data) {
                return {
                    results: data.results
                };
            }
        }
    })



    function disableOption(select, selectedValue) {
        var op = document.getElementById(select).getElementsByTagName("option");

        for (var i = 0; i < op.length; i++) {
            // lowercase comparison for case-insensitivity
            if (op[i].value.toLowerCase() != selectedValue) {
                //console.log(op[i]);
                op[i].disabled = true;
            } else {
                op[i].disabled = false;
            }
        }
    }



    function disableDropdown(select, selectedValue) {
        var selectobject;
        selectobject = document.getElementById(select).getElementsByTagName("option");
        for (z = 0; z < selectobject.length; z++) {
            if (selectobject[z].value != selectedValue) {
                selectobject[z].removeAttribute("selected");
                selectobject[z].disabled = true;
            }
        }
        let optArr = [selectedValue];
        $('#' + select).selectpicker('val', optArr);
        $('#' + select).selectpicker('refresh');

    }

    function enableDropdown(select, selectedValue) {
        var selectobject;
        selectobject = document.getElementById(select).getElementsByTagName("option");
        for (z = 0; z < selectobject.length; z++) {
            if (selectobject[z].value != selectedValue) {
                selectobject[z].disabled = false;
            }
        }
        $('#' + select).selectpicker('refresh');
    }



    function loadSelectItems(select, items) {

        var options = '';
        for (var i = 0; i < items.length; i++) {
            options += '<option value=' + items[i].id + '>' + items[i].text + '</option>';
        }
        select.empty();
        select.append(options);
        select.selectpicker('refresh');
    }
    /*
     $("#TCGroupID").on("changed.bs.select",
     function (e, clickedIndex, newValue, oldValue) {
     var selectedVal = $(this).find('option').eq(clickedIndex).val();
     if (!newValue) {
     if (selectedVal == "-2") {
     enableDropdown("TCGroupID", "-2");
     }
     if (selectedVal == "-1") {
     enableDropdown("TCGroupID", "-1");
     
     } else {
     
     }
     } else if (newValue) {
     if (selectedVal == "-2") {
     disableDropdown("TCGroupID", "-2");
     $('#optUnChanged').show();
     
     }
     if (selectedVal == "-1") {
     disableDropdown("TCGroupID", "-1");
     $('#optUnChanged').show();
     }
     }
     });
     
     $("#TCSupporterID").on("changed.bs.select",
     function (e, clickedIndex, newValue, oldValue) {
     var selectedVal = $(this).find('option').eq(clickedIndex).val();
     if (!newValue) {
     if (selectedVal == "-2") {
     enableDropdown("TCSupporterID", "-2");
     }
     if (selectedVal == "-1") {
     enableDropdown("TCSupporterID", "-1");
     }
     } else if (newValue) {
     if (selectedVal == "-2") {
     disableDropdown("TCSupporterID", "-2");
     }
     if (selectedVal == "-1") {
     disableDropdown("TCSupporterID", "-1");
     }
     }
     });
     */
    function setToNull(nr) {
        removeCat(nr);
    }


</script>
