<div class="container-fluid">

<div class="grid-container">
<div class="col-span-12">
<div class="page-title">
<i class="fad fa-headphones"></i>
<span>{{ page['title'] }}</span>
</div>
</div>

<div class="col-span-6">
<form method="post" action="" id="ticketsend" class="ticket-form">

<div class="alert alert-dismissible alert-danger ticket-danger m-0"

style="display: none">
<button type="button" class="close">&times;</button>
<div></div>
</div>

{% if ticketsText %}
<div class="well {% if site['rtl'] %} rtl-content {% endif %}">
{{ ticketsText }}
</div>
{% endif %}

<div class="subject-list">
<div class="subject-item" id="1" onclick="subjectVal('1')">
<input type="radio" name="subject" id="order" value="">
<label for="odeme">{% if site['language'] == 'tr' %}Sipariş{%
elseif site['language'] == 'ru' %}Заказ{% elseif site['language'] == 'bp'
%}Pedido{% elseif site['language'] == 'ar' %}‫{الطلب‬% elseif site['language'] ==
'zh' %}订单{% elseif site['language'] == 'de' %}Bestellung{% elseif site['language']
== 'es' %}Pedido{% elseif site['language'] == 'ko' %}주문{% else %}Order{% endif
%}</label>
</div>
<div class="subject-item" id="2" onclick="subjectVal('2')">
<input type="radio" name="subject" id="payment" value="">
<label for="odeme">{% if site['language'] == 'tr' %}Ödeme{% elseif
site['language'] == 'ru' %}Оплата{% elseif site['language'] == 'bp' %}Pagamento{%
elseif site['language'] == 'ar' %}‫{الدفع‬% elseif site['language'] == 'zh' %}支付{%
elseif site['language'] == 'de' %}Zahlung{% elseif site['language'] == 'es'
%}Pago{% elseif site['language'] == 'ko' %}결제{% else %}Payment{% endif %}</label>
</div>
<div class="subject-item" id="3" onclick="subjectVal('3')">
<input type="radio" name="subject" id="other" value="">
<label for="odeme">{% if site['language'] == 'tr' %}Diğer{% elseif
site['language'] == 'ru' %}Другое{% elseif site['language'] == 'bp' %}Outro{%
elseif site['language'] == 'ar' %}‫{آخر‬% elseif site['language'] == 'zh' %}其他{%
elseif site['language'] == 'de' %}Sonstiges{% elseif site['language'] == 'es'
%}Otro{% elseif site['language'] == 'ko' %}기타{% else %}Other{% endif %}</label>
</div>
</div>

<div class="form-group orderIdClass">

<label for="subject" class="control-label">{% if site['language'] ==
'tr' %}Sipariş ID{% elseif site['language'] == 'ru' %}ID Заказа{% elseif
site['language'] == 'bp' %}ID do Pedido{% elseif site['language'] == 'ar' %} ‫معّرف‬
‫{الطلب‬% elseif site['language'] == 'zh' %}订单 ID{% elseif site['language'] == 'de'
%}Bestell-ID{% elseif site['language'] == 'es' %}ID de Pedido{% elseif
site['language'] == 'ko' %}주문 ID{% else %}Order ID{% endif %}</label>
<input type="text" class="form-control" id="orderID"
oninput="filterInput(this)" required="">
</div>

<div class="form-group hidden">

<label for="subject" class="control-
label">{{ lang('tickets.subject') }}</label>
<input type="text" class="form-control" id="subject"
name="TicketForm[subject]">
</div>

<div class="form-group">
<label for="message" class="control-
label">{{ lang('tickets.message') }}</label>
<textarea class="form-control" rows="10" id="message"
name="TicketForm[message]" required></textarea>
</div>

<div class="form-group">
<div class="tickets-uploader" data-lang-button-
attach="{{ lang('tickets.button.attach') }}" data-lang-file-format-
incorrect="{{ lang('tickets.error.file_format.incorrect') }}" data-lang-file-size-
incorrect="{{ lang('tickets.error.file_size.incorrect') }}"
onclick="uploadTicket()"></div>
</div>

<input type="hidden" name="_csrf" value="{{csrftoken}}">

<button type="submit" class="btn btn-main btn-min border-
10">{{ lang('tickets.button') }}</button>
</form>
</div>

<div class="col-span-6">
{% if ticketList or search %}
<form action="{{ page['url'] }}" method="get" id="history-search">
<div class="input-group">
<input type="text" class="form-control" value="{{ search }}"
name="search" placeholder="{{ lang('general.search.placeholder') }}">
<span class="input-group-btn">
<button type="submit" class="btn btn-default"><i class="fa fa-
search" aria-hidden="true"></i></button>
</span>
</div>
</form>
{% endif %}

{% if ticketList %}
<span class="ticket-title">{% if site['language'] == 'tr' %}Destek
Talepleri{% elseif site['language'] == 'ru' %}Запросы на Поддержку{% elseif
site['language'] == 'bp' %}Solicitações de Suporte{% elseif site['language'] ==
'ar' %}‫{طلبات الدعم‬% elseif site['language'] == 'zh' %}支持请求{% elseif
site['language'] == 'de' %}Supportanfragen{% elseif site['language'] == 'es'
%}Solicitudes de Soporte{% elseif site['language'] == 'ko' %}지원 요청{% else %}Support
Requests{% endif %}</span>
<div class="ticket-list">
{% for ticket in ticketList %}
<a href="{{ page_url('viewticket') }}/{{ ticket['id'] }}" class="ticket-
box {% if ticket['new'] == 1 %}active{% endif %}">
 <div class="ticket-box-top">
<div class="ticket-top-content">
<span class="ticket-id">{{ ticket['id'] }}</span>
<span class="ticket-subject">{{ticket['theme']}}</span>
</div>
<span class="ticket-status">{{ ticket['status'] }}</span>
</div>

<div class="ticket-bottom">
<span class="ticket-date">{{ ticket['time'] }}</span>
</div>
</a>
{% endfor %}
</div>
{% endif %}
</div>
{% if pagination['count'] > 50 %}
<div class="nav-pills">
<ul class="pagination {% if site['rtl'] %} rtl-pagination {% endif %}">
{% if pagination['current'] != 1 %}
<li>
<a href="{{ page['url'] }}/{{ pagination['last'] }}" aria-
label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
{% endif %}

{% set r, l = 3, 3 %}

{% if pagination['current'] == 1 %}
{% set r = 6 %}
{% endif %}

{% if pagination['current'] == 2 %}
{% set r = 5 %}
{% endif %}

{% if pagination['current'] >= pagination['pages'] %}

{% set l = 5 %}
{% endif %}

{% for i in 1..ceil(pagination['pages']) %}
{% if i >= (pagination['current']-l) and i <=
(pagination['current']+r) %}
<li{% if i == pagination['current'] %} class="active"{% endif
%}><a href="{{ page['url'] }}/{{i}}">{{i}}</a></li>
{% endif %}
{% endfor %}

{% if pagination['current'] < pagination['pages'] %}

<li>
<a href="{{ page['url'] }}/{{ pagination['next'] }}" aria-
label="Next">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
{% endif %}
 </ul>
</div>
{% endif %}
</div>
</div>