# --
# AgentTicketOverviewPreview.dtl - provides HTML Ticket Overview
# Copyright (C) 2001-2011 OTRS AG, http://otrs.org/
# --
# $Id: AgentTicketOverviewPreview.dtl,v 1.76 2011/12/05 20:56:03 mb Exp $
# --
# This software comes with ABSOLUTELY NO WARRANTY. For details, see
# the enclosed file COPYING for license information (AGPL). If you
# did not receive this file, see http://www.gnu.org/licenses/agpl.txt.
# --
<!-- dtl:block:DocumentActionRow -->
<ul class="Actions">
<!-- dtl:block:DocumentActionRowBulk -->
    <li class="Bulk">
        <span>
            <input type="checkbox" class="AutocompleteOff" title="$Text{"Select all"}" id="SelectAllTickets" />
            <label class="InvisibleText" for="SelectAllTickets">$Text{"Select all"}</label>
        </span>
    </li>
    <li id="BulkAction" class="Bulk Inactive $QData{"CSS"}">
        <a href="#">$Text{"$Data{"Name"}"}</a>
    </li>
<!-- dtl:block:DocumentActionRowBulk -->
<!-- dtl:block:DocumentActionRowItem -->
    <li class="$QData{"CSS"}"><a href="#">$Text{"$Data{"Name"}"}</a></li>
<!-- dtl:block:DocumentActionRowItem -->
</ul>
<!-- dtl:block:DocumentActionRow -->

<!-- dtl:block:DocumentHeader -->
<!-- dtl:js_on_document_complete -->
<script type="text/javascript">//<![CDATA[
    Core.UI.ActionRow.Init();
//]]></script>
<!-- dtl:js_on_document_complete -->
<ul id="TicketOverviewLarge" class="Overview OverviewLarge $QData{"Class"}">
<!-- dtl:block:DocumentHeader -->

<!-- dtl:block:NoTicketFound -->
    <li id="EmptyMessageLarge">
        $Text{"No ticket data found."}
    </li>
<!-- dtl:block:NoTicketFound -->

<!-- dtl:block:DocumentContent -->
    <li id="TicketID_$QData{"TicketID"}" class="MasterAction">
        <div class="Content $QData{"AdditionalClasses"}">
<!-- dtl:block:InlineActionRow -->
            <ul class="Actions InlineActions">
<!-- dtl:block:InlineActionRowItem -->
                <li><a class="$QData{"Class"}" href="$QData{"Link"}" title="$QData{"Description"}">$QData{"Name"}</a></li>
<!-- dtl:block:InlineActionRowItem -->
<!-- dtl:block:InlineActionRowItemHTML -->
                $Data{"HTML"}
<!-- dtl:block:InlineActionRowItemHTML -->
            </ul>
<!-- dtl:js_on_document_complete -->
<script type="text/javascript">//<![CDATA[
    // Shows InlineActionRow on hover
    $('.OverviewLarge > li').bind('mouseenter', function() {
        $(this).find('ul.InlineActions').show();
    }).bind('mouseleave', function() {
        $(this).find('ul.InlineActions').hide();
    });

    // Fix for IE: Hovering the options of the select triggers a mouseleave of the li, so we have to stop the event propagation
    $('.OverviewLarge > li ul.InlineActions li form select').bind('mouseleave', function (Event) {
        Event.stopPropagation();
    });

    // Stop propagation on click on a part of the InlienActionRow without a link
    // Otherwise that would trigger the li-wide link to the ticketzoom
    $('ul.InlineActions').click(function (Event) {
        Event.cancelBubble = true;
        if (Event.stopPropagation) {
            Event.stopPropagation();
        }
    });
//]]></script>
<!-- dtl:js_on_document_complete -->
<!-- dtl:block:InlineActionRow -->
<!-- dtl:block:Bulk -->
            <input class="Checkbox AutocompleteOff" type="checkbox" name="TicketID" value="$QData{"TicketID"}" />
<!-- dtl:block:Bulk -->
<!-- dtl:block:Meta -->
<!-- dtl:block:MetaIcon -->
            <div class="$QData{"Class"}" title="$Text{"$Data{"Title"}"}">
                <span class="$QData{"ClassSpan"}">$Text{"$Data{"Title"}"}</span>
            </div>
<!-- dtl:block:MetaIcon -->
<!--[if IE 7]>
            <div class="ReallyStupidIE7Hack">&nbsp;</div>
            <![endif]-->
<!-- dtl:block:Meta -->
            <div class="Infos">
                <h2>
                    <a href="$Env{"Baselink"}Action=AgentTicketZoom;TicketID=$LQData{"TicketID"}" title="$QData{"Title","60"}" class="MasterActionLink">$Config{"Ticket::Hook"}: $Data{"TicketNumber"} &ndash; $QData{"Title","60"}</a>
                </h2>
<!-- dtl:block:MenuItem -->
                <a href="$Env{"Baselink"}$Data{"Link"}" $Data{"LinkParam"} class="menuitem" title="$Text{"$Data{"Description"}"}">$Text{"$Data{"Name"}"}</a>
<!-- dtl:block:MenuItem -->
                <table>
                    <tbody>
                        <tr>
                            <td>
                                <label>$Text{"Age"}</label>$QData{"Age"}
                            </td>
                            <td>
                                <label>$Text{"Queue"}</label><div title="$QData{"Queue"}">$QData{"Queue","26"}</div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <label>$Text{"Created"}</label>$TimeLong{"$Data{"Created"}"}
                            </td>
                            <td>
                                <label>$Text{"State"}</label><div title="$Text{"$Data{"State"}"}">$Text{"$Data{"State"}","26"}</div>
                            </td>
                        </tr>
<!-- dtl:block:Service -->
                        <tr>
                            <td>
                                <label>$Text{"Service"}</label><div title="$QData{"Service"}">$QData{"Service","26"}</div>
                            </td>
                            <td>
<!-- dtl:block:SLA -->
                                <label>$Text{"Service Level Agreement"}</label><div title="$QData{"SLA"}">$QData{"SLA","26"}</div>
<!-- dtl:block:SLA -->
                            </td>
                        </tr>
<!-- dtl:block:Service -->
                        <tr>
                            <td>
                                <label>$Text{"Owner"}</label><div title="$QData{"UserFirstname"} $QData{"UserLastname"} ($QData{"Owner"})">$QData{"UserFirstname","15"} $QData{"UserLastname","15"}</div>
                            </td>
                            <td>
                                <label>$Text{"Lock"}</label><div title="$Text{"$Data{"Lock"}"}">$Text{"$Data{"Lock"}","26"}</div>
                            </td>
                        </tr>
                        <tr class="Middle">
                            <td>
<!-- dtl:block:CustomerID -->
                                <label>$Text{"CustomerID"}</label>
<!-- dtl:block:CustomerIDRW -->
                                <div title="$QData{"CustomerID"}"><a href="$Config{"CustomerDBLink"}" class="AsPopup PopupType_TicketAction" $Config{"CustomerDBLinkTarget"}>$QData{"CustomerID", "26"}</a></div>
<!-- dtl:block:CustomerIDRW -->
<!-- dtl:block:CustomerIDRO -->
                                <div title="$QData{"CustomerID"}">$QData{"CustomerID", "26"}</div>
<!-- dtl:block:CustomerIDRO -->
<!-- dtl:block:CustomerName -->
                                <div title="$QData{"CustomerName"}">$QData{"CustomerName","26"}</div>
<!-- dtl:block:CustomerName -->
<!-- dtl:block:CustomerID -->
                            </td>
                            <td>
<!-- dtl:block:FirstResponseTime -->
                                <label>$Text{"First Response Time"}</label>
                                <div title="$Text{"Service Time"}: $QData{"FirstResponseTimeWorkingTime"}" class="$QData{"FirstResponseTimeClass"}">$QData{"FirstResponseTimeHuman"} / $TimeShort{"$QData{"FirstResponseTimeDestinationDate"}"}</div>
<!-- dtl:block:FirstResponseTime -->
                            </td>
                        </tr>
                        <tr>
                            <td>
<!-- dtl:block:Type -->
                                <label>$Text{"Type"}</label><div title="$QData{"Type"}">$QData{"Type","18"}</div>
<!-- dtl:block:Type -->
                            </td>
                            <td>
<!-- dtl:block:UpdateTime -->
                                <label>$Text{"Update Time"}</label>
                                <div title="$Text{"Service Time"}: $QData{"UpdateTimeWorkingTime"}" class="$QData{"UpdateTimeClass"}">$QData{"UpdateTimeHuman"} / $TimeShort{"$QData{"UpdateTimeDestinationDate"}"}</div>
<!-- dtl:block:UpdateTime -->
                            </td>
                        </tr>
                        <tr>
                            <td></td>
                            <td>
<!-- dtl:block:SolutionTime -->
                                <label>$Text{"Solution Time"}</label>
                                <div title="$Text{"Service Time"}: $QData{"SolutionTimeWorkingTime"}" class="$QData{"SolutionTimeClass"}">$QData{"SolutionTimeHuman"} / $TimeShort{"$QData{"SolutionTimeDestinationDate"}"}</div>
<!-- dtl:block:SolutionTime -->
                            </td>
                        </tr>

<!-- dtl:block:DynamicFieldTableRow -->
                        <tr class="$Data{"Class"}">
<!-- dtl:block:DynamicFieldTableRowRecord -->
                            <td>
                                <label>$Text{"$Data{"Label"}"}</label>
<!-- dtl:block:DynamicFieldTableRowRecordLink -->
                                <div title="$Data{"Title"}"><a href="$Data{"Link"}" class="DynamicFieldLink">$Data{"Value"}</a></div>
<!-- dtl:block:DynamicFieldTableRowRecordLink -->
<!-- dtl:block:DynamicFieldTableRowRecordPlain -->
                                <div title="$Data{"Title"}"><span>$Data{"Value"}</span></div>
<!-- dtl:block:DynamicFieldTableRowRecordPlain -->
                            </td>
<!-- dtl:block:DynamicFieldTableRowRecord -->
                        </tr>
<!-- dtl:block:DynamicFieldTableRow -->

# example of how to use fixed dynamic field blocks for customizations
# Note: Field1 and Field2 are the names of the fields and had to be replaced with the actual
# field names
#                    <tr>
#<!-- dtl:block:DynamicField_Field1_TableRowRecord -->
#                        <td>
#                            <label>$Text{"$Data{"Label"}"}</label>
#<!-- dtl:block:DynamicField_Field1_TableRowRecordLink -->
#                            <div title="$Data{"Title"}"><a href="$Data{"Link"}" class="DynamicFieldLink">$Data{"Value"}</a></div>
#<!-- dtl:block:DynamicField_Field1_TableRowRecordLink -->
#<!-- dtl:block:DynamicField_Field1_TableRowRecordPlain -->
#                            <div title="$Data{"Title"}"><span>$Data{"Value"}</span></div>
#<!-- dtl:block:DynamicField_Field1_TableRowRecordPlain -->
#                        </td>
#<!-- dtl:block:DynamicField_Field1_TableRowRecord -->
#                    </tr>
#                    <tr>
#<!-- dtl:block:DynamicField_Field2_TableRowRecord -->
#                        <td>
#                            <label>$Text{"$Data{"Label"}"}</label>
#<!-- dtl:block:DynamicField_Field2_TableRowRecordLink -->
#                            <div title="$Data{"Title"}"><a href="$Data{"Link"}" class="DynamicFieldLink">$Data{"Value"}</a></div>
#<!-- dtl:block:DynamicField_Field2_TableRowRecordLink -->
#<!-- dtl:block:DynamicField_Field2_TableRowRecordPlain -->
#                            <div title="$Data{"Title"}"><span>$Data{"Value"}</span></div>
#<!-- dtl:block:DynamicField_Field2_TableRowRecordPlain -->
#                        </td>
#<!-- dtl:block:DynamicField_Field2_TableRowRecord -->
#                    </tr>

                    </tbody>
                </table>
            </div>
            <div class="Preview">
                <ul class="$QData{"Class"}">
<!-- dtl:block:ArticlePreview -->
                    <li class="$QData{"Class"}">
                        <h3>
                            <a href="#" title="$QData{"From"} &ndash; $QData{"Subject"} &ndash; $TimeShort{"$QData{"Created"}"}">
                                <span class="Headline">
                                    $QData{"FromRealname","50"} &ndash;
                                    <span class="Subject">$QData{"Subject","70"}</span>
                                </span>
                                <span class="DateTime">$TimeShort{"$QData{"Created"}"}</span>
                                <span class="Clear"></span>
                            </a>
                        </h3>
                        <div class="HiddenBlock">
<!-- dtl:block:ArticlePreviewActionRow -->
                            <div class="ActionRow">
                                <ul class="Actions">
<!-- dtl:block:ArticlePreviewActionRowItem -->
                                    <li class="$QData{"Class"}">
                                        <form title="$Text{"$Data{"Name"}"}" action="$Env{"CGIHandle"}" method="post" id="$QData{"FormID"}">
                                            <input type="hidden" name="Action" value="$QData{"Action"}"/>
                                            <input type="hidden" name="TicketID" value="$QData{"TicketID"}"/>
                                            <input type="hidden" name="ArticleID" value="$QData{"ArticleID"}"/>
                                            <input type="hidden" name="ReplyAll" value="$QData{"ReplyAll"}"/>
                                            <label for="ResponseID$QData{"ArticleID"}" class="InvisibleText">$Text{"$Data{"Name"}"}:</label>
                                            $Data{"StandardResponsesStrg"}
                                        </form>
<!--dtl:js_on_document_complete-->
<script type="text/javascript">//<![CDATA[
    $('#$QData{"FormID"} select[name=ResponseID]').bind('change', function (Event) {
        var URL;

        if ($(this).val() > 0) {
            var URL = Core.Config.Get('Baselink') + $(this).parents().serialize();
            Core.UI.Popup.OpenPopup(URL, 'TicketAction');
            // reset the select box so that it can be used again from the same window
            $(this).val('0');
        }
    });
    // make sure this click event does not bubble up to the table row and execute its click handler
    $('#$QData{"FormID"} select[name=ResponseID]').bind('click', function (Event) {
        Event.stopPropagation();
        return false;
    });
//]]></script>
<!--dtl:js_on_document_complete-->
                                    </li>
<!-- dtl:block:ArticlePreviewActionRowItem -->
                                </ul>
                                <div class="ClearLeft"></div>
                            </div>
<!-- dtl:block:ArticlePreviewActionRow -->
                            <div class="Content ArticleBody">
$Data{"BodyNote"}
$Data{"Body"}
                            </div>
                        </div>
                    </li>
<!-- dtl:block:ArticlePreview -->
                </ul>
            </div>
            <div class="Shadow"></div>
        </div>
    </li>
<!-- dtl:block:DocumentContent -->

<!-- dtl:block:DocumentFooter -->
</ul>


<form name="bulk" action="">
    <input type="hidden" name="TicketID" value=""/>
</form>

<form action="$Env{"CGIHandle"}" method="post" enctype="multipart/form-data" name="matrix">
    <input type="hidden" name="Action" value="AgentTicketBulk"/>
<!-- dtl:block:DocumentFooterBulkItem -->
    <input type="hidden" name="TicketID" value=""/>
<!-- dtl:block:DocumentFooterBulkItem -->
    <input type="hidden" name="TicketID" value=""/>
</form>
<!-- dtl:block:DocumentFooter -->

<!-- dtl:block:DocumentMenuItem -->
<li id="$QData{"ID"}">
    <a href="#" title="$Text{"$Data{"Description"}"}">$Text{"$Data{"Name"}"}</a>
</li>
<!-- dtl:block:DocumentMenuItem -->
<!-- dtl:block:DocumentMenuItemMoveForm -->
<li class="$QData{"Class"}">
    <form title="$Text{"Move ticket to a different queue"}" action="$Env{"CGIHandle"}" method="get">
        <input type="hidden" name="Action" value="AgentTicketMove"/>
        <input type="hidden" name="QueueID" value="$QData{"QueueID"}"/>
        <input type="hidden" name="TicketID" value="$QData{"TicketID"}"/>
        <label for="DestQueueID" class="InvisibleText">$Text{"Change queue"}:</label>
        $Data{"MoveQueuesStrg"}
    </form>
<!-- dtl:js_on_document_complete -->
<script type="text/javascript">//<![CDATA[
    $('select[name=DestQueueID]').live('change', function (Event) {
        $(this).closest('form').submit();
    });
//]]></script>
<!-- dtl:js_on_document_complete -->
</li>
<!-- dtl:block:DocumentMenuItemMoveForm -->

<!-- dtl:js_on_document_complete -->
<!-- dtl:block:DocumentReadyActionRowAdd -->
<script type="text/javascript">//<![CDATA[
    Core.UI.ActionRow.AddActions($('#TicketID_$QData{"TicketID"}'), $Data{"Data"});
//]]></script>
<!-- dtl:block:DocumentReadyActionRowAdd -->
<!-- dtl:block:DocumentReadyStart -->
<script type="text/javascript">//<![CDATA[
    Core.UI.StaticTableControl($('#OverviewControl'));
    $('.MasterAction').bind('click', function (Event) {
        var $MasterActionLink = $(this).find('.MasterActionLink');
        // only act if the link was not clicked directly
        if (Event.target !== $MasterActionLink.get(0)) {
            window.location = $MasterActionLink.attr('href');
            return false;
        }
    });
    Core.UI.Accordion.Init($('.Preview > ul'), 'li h3 a', '.HiddenBlock');
//]]></script>
<!-- dtl:block:DocumentReadyStart -->
<!-- dtl:js_on_document_complete -->

<!-- dtl:js_on_document_complete -->
<script type="text/javascript">//<![CDATA[
    $('a.AsPopup').bind('click', function (Event) {
        var Matches,
            PopupType = 'TicketAction';

        Matches = $(this).attr('class').match(/PopupType_(\w+)/);
        if (Matches) {
            PopupType = Matches[1];
        }

        Core.UI.Popup.OpenPopup($(this).attr('href'), PopupType);
        return false;
    });
    $('a.DynamicFieldLink').bind('click', function (Event) {
        Core.UI.Popup.OpenPopup($(this).attr('href'), 'DynamicFieldLink');
        return false;
    });
//]]></script>
<!-- dtl:js_on_document_complete -->
