{% extends request.ajax ? "layout_blank.phtml" : "layout_default.phtml" %}
{% import "macro_functions.phtml" as mf %}
{% block meta_title %}{{ticket.subject}}{% endblock %}
{% set active_menu = 'support' %}
{% block content %}

<div class="widget simpleTabs tabsRight first">
    <div class="head">
        <h5 class="iSpeech">{{ ticket.subject }}</h5>
    </div>

    <ul class="tabs">
        <li><a href="#tab-index">{% trans 'Ticket' %}</a></li>
        {% if ticket.rel %}<li><a href="#tab-task">{% trans 'Task' %}</a></li>{% endif %}
        <li><a href="#tab-manage">{% trans 'Manage' %}</a></li>
        <li><a href="#tab-notes">{% if ticket.notes|length > 0%}{{ticket.notes|length}} - {% endif %}{% trans 'Notes' %}</a></li>
        <li><a href="#tab-support">{% trans 'Client tickets' %}</a></li>
    </ul>
    
    <div class="tabs_container">
        <div class="fix"></div>
        <div class="tab_content nopadding" id="tab-index">
            <table class="tableStatic wide">
                <tbody>
                    <tr class="noborder">
                        <td style="width: 30%">{% trans 'Ticket ID' %}</td>
                        <td><b>#{{ticket.id}}</b></td>
                    </tr>

                    <tr>
                        <td>{% trans 'Client' %}</td>
                        <td>#{{ticket.client.id}} <a href="{{ 'client/manage'|alink }}/{{ ticket.client.id }}">{{ticket.client.first_name}} {{ticket.client.last_name}}</a></td>
                    </tr>

                    <tr>
                        <td>{% trans 'Help desk' %}</td>
                        <td>{{ ticket.helpdesk.name }}</td>
                    </tr>

                    <tr>
                        <td>{% trans 'Status' %}</td>
                        <td>{{ mf.status_name(ticket.status) }}</td>
                    </tr>

                    <tr>
                        <td>{% trans 'Time opened' %}</td>
                        <td>{{ticket.created_at|date('l, d F Y')}}</td>
                    </tr>

                    <tr>
                        <td>{% trans 'Total responses' %}</td>
                        <td>{{ ticket.messages|length }}</td>
                    </tr>

                 </tbody>

                 <tfoot>
                     <tr>
                         <td colspan="2">
                            <div class="aligncenter">
                                {% if ticket.status != 'closed' %}
                                <a href="admin/support/ticket_close?id={{ticket.id}}" data-api-confirm="Are you sure?" data-api-redirect="support?status=open" class="btn55 mr10 api-link" ><img src="images/icons/middlenav/stop.png" alt=""><span>Close ticket</span></a>
                                {% endif %}
                                <a href="admin/support/ticket_delete?id={{ticket.id}}" data-api-confirm="Are you sure?" data-api-redirect="support" class="btn55 mr10 api-link"><img src="images/icons/middlenav/trash.png" alt=""><span>Delete</span></a>
                            </div>
                         </td>
                     </tr>
                 </tfoot>
            </table>
        </div>

        <div class="tab_content nopadding" id="tab-manage">
            <form method="post" action="admin/support/ticket_update" class="mainForm api-form" data-api-reload="1">
                <fieldset>
                    <div class="rowElem">
                        <label>{% trans 'Subject' %}</label>
                        <div class="formRight noborder">
                            <input type="text" name="subject" value="{{ticket.subject}}" required="required"/>
                        </div>
                        <div class="fix"></div>
                    </div>

                    <div class="rowElem">
                        <label>{% trans 'Help desk' %}</label>
                        <div class="formRight">
                            {{ mf.selectbox('support_helpdesk_id', admin.support_helpdesk_get_pairs, ticket.support_helpdesk_id, 1) }}
                        </div>
                        <div class="fix"></div>
                    </div>

                    <div class="rowElem">
                        <label>{% trans 'Status' %}</label>
                        <div class="formRight">
                            {{ mf.selectbox('status', admin.support_ticket_get_statuses({"titles":1}), ticket.status, 1) }}
                        </div>
                        <div class="fix"></div>
                    </div>

                    <div class="rowElem">
                        <label>{% trans 'Priority' %}</label>
                        <div class="formRight">
                            <input type="text" name="priority" value="{{ticket.priority}}"/>
                        </div>
                        <div class="fix"></div>
                    </div>
                     <input type="submit" value="{% trans 'Update' %}" class="greyishBtn submitForm" />
                </fieldset>
                <input type="hidden" name="id" value="{{ ticket.id }}">
            </form>
        </div>

        <div class="tab_content nopadding" id="tab-notes">

            <table class="tableStatic wide">
            {% for note in ticket.notes %}
                <tr {% if loop.first %}class="noborder"{% endif %}>
                    <td>{{ note.note }}</td>
                    <td style="width: 20%"><a href="{{ 'staff'|alink }}/manage/{{ note.admin_id }}">{{ note.author.name }}</a></td>
                    <td style="width: 5%">
                        <a href="admin/support/note_delete?id={{note.id}}" data-api-confirm="Are you sure?" data-api-reload="1" class="bb-button btn14 api-link"><img src="images/icons/dark/trash.png" alt=""></a>
                    </td>
                </tr>
            {% endfor %}
                <tfoot>
                    <tr>
                        <td colspan="3" {% if ticket.notes|length == 0 %}class="noborder"{% endif %}>

                            <form method="post" action="admin/support/note_create" class="mainForm api-form" data-api-reload="1">
                                <fieldset>
                                    <textarea name="note" cols="5" rows="5" required="required" placeholder="Add new note" style="width: 98%"></textarea>
                                    <input type="submit" value="{% trans 'Add note' %}" class="greyishBtn submitForm" style=" margin-top: 22px; width: 100px"/>
                                    <input type="hidden" name="ticket_id" value="{{ ticket.id }}">
                                </fieldset>
                            </form>

                        </td>
                    </tr>
                </tfoot>
            </table>
        </div>

        <div class="tab_content nopadding" id="tab-support">
            <table class="tableStatic wide">
                <thead>
                    <tr>
                        <td>ID</td>
                        <td width="60%">Subject</td>
                        <td width="15%">Help desk</td>
                        <td width="15%">Status</td>
                        <td>&nbsp;</td>
                    </tr>
                </thead>

                <tbody>
                    {% set tickets = admin.support_ticket_get_list({"per_page":"20", "client_id":ticket.client.id}) %}
                    {% for ticket in tickets.list %}
                    <tr>
                        <td>{{ ticket.id }}</td>
                        <td>{{ ticket.subject|truncate(30) }}</td>
                        <td>{{ ticket.helpdesk.name }}</td>
                        <td>{{ mf.status_name(ticket.status) }}</td>
                        <td class="actions"><a class="bb-button btn14" href="{{ '/support/ticket'|alink }}/{{ticket.id}}"><img src="images/icons/dark/pencil.png" alt=""></a></td>
                    </tr>
                    {% else %}
                    <tr>
                        <td colspan="5">{% trans 'The list is empty' %}</td>
                    </tr>
                    {% endfor %}
                </tbody>

                <tfoot>
                    <tr>
                        <td colspan="5">
                            <a href="{{ 'support'|alink}}?client_id={{client.id}}#tab-new" class="btnIconLeft mr10 mt5" ><img src="images/icons/dark/help.png" alt="" class="icon"><span>New support ticket</span></a>
                        </td>
                    </tr>
                </tfoot>
            </table>
        </div>

        <div class="tab_content nopadding" id="tab-task">

            {% set task = ticket.rel %}
            <table class="tableStatic wide">
                    <tbody>
                    <tr class="noborder">
                        <td style="width: 30%"><label>{% trans 'Client' %}</label></td>
                        <td><a href="{{ 'client/manage'|alink }}/{{ ticket.client.id }}">{{ ticket.client.first_name }} {{ ticket.client.last_name }}</a></td>
                    </tr>

                    <tr>
                        <td><label>{% trans 'Task status' %}</label></td>
                        <td>{{ mf.status_name(task.status) }}</td>
                    </tr>

                    <tr>
                        <td><label>{% trans 'Task' %}</label></td>
                        <td><strong>{{ mf.status_name(task.task) }}</strong></td>
                    </tr>

                    {% if task.order %}
                    <tr>
                        <td><label>{% trans 'Related to' %}</label></td>
                        <td><a href="{{ 'order/manage'|alink }}/{{ task.order.id }}">{{ task.order.title }}</a></td>
                    </tr>
                    {% endif %}

                    {% if task.task == 'upgrade' %}
                    <tr>
                        <td><label>{% trans 'Upgrade to' %}</label></td>
                        <td><a href="{{ 'product/manage'|alink }}/{{task.new_value}}">{{ admin.product_get_pairs[task.new_value] }}</a></td>
                    </tr>
                    {% endif %}

                    </tbody>

                    {% if task.status == 'pending' %}
                    <tfoot>
                        <tr>
                            <td colspan="2">
                                <div class="aligncenter">
                                    <a href="admin/support/task_complete?id={{ticket.id}}" class="btn55 mr10 api-link" data-api-reload="1"><img src="images/icons/middlenav/check.png" alt="" data-api-reload="1"><span>Approve</span></a>
                                </div>
                            </td>
                        </tr>
                    </tfoot>
                    {% endif %}
                </table>

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

{% set canned_response_selector %}
<div class="canned_response">
    <select name="canned_response" class="canned">
    {% for response in admin.support_canned_get_list({"per_page":90}).list %}
        <option value="{{ response.id }}">{{ response.title }}</option>
    {% endfor %}
    </select>
</div>
{% endset %}

<div class="conversation">
{% for i, message in ticket.messages %}
<div class="widget simpleTabs tabsRight">
    <div class="head">
        <h5 class="iSpeech">{{ message.author.name }} - {{ message.created_at|date("l, d F Y") }}</h5>
    </div>
    <ul class="tabs">
        <li><a href="#m-{{message.id}}"><img src="{{ message.author.email|gravatar }}?size=20" alt="{{ message.author.name }}" class="gravatar"/>#{{ i+1 }}</a></li>
        <li><a href="#reply-{{message.id}}"><span class="iSpeech"></span>{% trans 'Reply' %}</a></li>
        <li><a href="#quote-{{message.id}}"><span class="iBubbles"></span>{% trans 'Quote' %}</a></li>
        <li><a href="#edit-{{message.id}}"><span class="iCog"></span>{% trans 'Edit' %}</a></li>
    </ul>
    <div class="tabs_container">
        <div class="fix"></div>
        <div class="tab_content" id="m-{{message.id}}">
            <div class="block message">
                <div class="body">
                    {{ message.content|bbmd }}
                    <div class="clear"></div>
                </div>
            </div>
            <div class="clear"></div>
        </div>
        <div class="tab_content" id="reply-{{message.id}}">
            <form method="post" action="admin/support/ticket_reply" class="mainForm api-form" data-api-redirect="support?status=open">
                <fieldset>
                    {{ canned_response_selector }}
                    <textarea name="content" cols="5" rows="20" required="required" id="msg-area-{{message.id}}">
Hello {{ ticket.client.first_name }},



{{ profile.signature }}       
{{ ticket.helpdesk.signature }}
                    </textarea>
                    <input type="hidden" name="id" value="{{ ticket.id }}">
                    <input type="submit" value="{% trans 'Post' %}" class="greyishBtn submitForm" />
                </fieldset>
            </form>
        </div>

        <div class="tab_content" id="quote-{{message.id}}">
            <form method="post" action="admin/support/ticket_reply" class="mainForm api-form" data-api-redirect="support?status=open">
                <fieldset>
                    {{ canned_response_selector }}
                    <textarea name="content" cols="5" rows="20" required="required" id="quote-area-{{message.id}}">

{{ mf.markdown_quote(message.content) }}

{{ ticket.helpdesk.signature }}</textarea>
                    <input type="hidden" name="id" value="{{ ticket.id }}">
                    <input type="submit" value="{% trans 'Post' %}" class="greyishBtn submitForm" />
                </fieldset>
            </form>
        </div>

        <div class="tab_content" id="edit-{{message.id}}">
            <form method="post" action="admin/support/ticket_message_update" class="mainForm api-form" data-api-msg="Ticket message updated">
                <fieldset>
                    <textarea name="content" cols="5" rows="20" required="required" id="quote-area-{{message.id}}">{{ message.content}}</textarea>
                    <input type="hidden" name="id" value="{{ message.id }}">
                    <input type="submit" value="{% trans 'Update' %}" class="greyishBtn submitForm" />
                </fieldset>
            </form>
        </div>
    </div>
</div>
{% endfor %}
</div>

{% endblock %}

{% block js%}
<script type="text/javascript">
$(function() {

    $('.canned_response div.jqTransformSelectWrapper ul li a').click(function(){
        var value = $(this).attr('index');
        var select = $(this).parents('div.canned_response').find('select');
        var textarea = select.parent().parent().siblings('textarea');
        var id = $(select).find('option:eq('+value+')').val();
        api.get('admin/support/canned_get', {id:id}, function(result){ bb.insertToTextarea(textarea.attr('id'), result.content) });
        return false;
    });
    
});
</script>
{% endblock %}