<% i18n_scope_tickets = 'tickets._index' %>
<% i18n_scope_ticket_modal = 'tickets._create_edit_ticket' %>

<div id="tags-popover-holder"></div>

<header class="main-header">
  <h1><%= t :page_title, scope: i18n_scope_tickets %></h1>
  <%= simple_form_for :filters, html: { id: "queue-filters" } do |f| %>
    <div id="queue-filters-dropdown-toggle" data-toggle="dropdown"><%= t('filter_tasks', scope: i18n_scope_tickets)%> <i></i></div>
    <div id="queue-filters-dropdown" class="dropdown-menu">
      <div class="arrow"></div>
      <%= f.input :queue, as: :select, default: "1", selected: params[:filters].try(:[], :queue), required: false, label: false, collection: [[t('all', scope: i18n_scope_tickets), ""], *@project_ticket_lists.map { |tl| [tl.to_s, tl.id] }], input_html: { id:"queue-filter", 'data-placeholder' => t('common.all') } %>
      <%= f.input :assigned_by, as: :select, default: "1", selected: params[:filters].try(:[], :assigned_by), required: false, label: false, collection: [t('assigned_by', scope: i18n_scope_tickets), t('assigned_to', scope: i18n_scope_tickets)], input_html: { id: "filter-assigned-by", class: "short", 'data-placeholder' => t('assigned_by', scope: i18n_scope_tickets) } %>
      <%= f.input :member, as: :select, default: "1", selected: params[:filters].try(:[], :member), required: false, label: false, collection:[[t('any', scope: i18n_scope_tickets), ""], *@project_members.map { |tl| [tl.to_s, tl.to_s] }], input_html: { id: "member-filter" }, wrapper_html: { class: "clear" } %>
      <%= f.input :status, as: :select, default: "1", selected: params[:filters].try(:[], :status), required: false, label: false, collection:[[t('all', scope: i18n_scope_tickets), ""], *@ticket_statuses.map { |tl| [tl[0].to_s, tl[0].to_s] }], input_html: { id: "status-filter", 'data-placeholder' => t('common.all') } %>
      <div class="form-actions">
        <div class="btn-reset"><%= t('common.reset') %></div>
        <div class="btn-done"><%= t('common.done') %></div>
      </div>
    </div>
    <%= f.input :search, required: false, label: false, placeholder: t('search_placeholder', scope: i18n_scope_tickets), input_html: { id: "search-tasks-input", class: "search" } %>
  <% end %>
</header>

<div class="queue-table-border-left"></div>
<div class="queue-table-border-right"></div>

<section id="main" class="queue">
  <div id="queue-tasks-table">
    <div class="table-head-wrapper <%= 'withFilter' if @alert_no_tickets %>">
      <div class="table-head">
        <div class="table-head-row">
          <div data-header="id" data-sort="int" class="table-head-cell id"><%= t('id', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="priority" data-sort="int" class="table-head-cell priority"><%= t('priority', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="status" data-sort="int" class="table-head-cell status"><%= t('common.status') %><i></i></div>
          <div data-header="resolution" data-sort="string-ins" class="table-head-cell resolution"><%= t('resolution', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="social" data-sort="string-ins" class="table-head-cell social"><%= t('social', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="customer" data-sort="string-ins" class="table-head-cell customer"><%= t('customer', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="assigned-to" data-sort="string-ins" class="table-head-cell assigned-to"><%= t('assigned_to', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="assigned-by" data-sort="string-ins" class="table-head-cell assigned-by"><%= t('assigned_by', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="tags" data-sort="string-ins" class="table-head-cell tags"><%= t('tags', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="open-date" data-sort="int" class="table-head-cell open-date"><%= t('open_date', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="due-date" data-sort="int" class="table-head-cell due-date"><%= t('due_date', scope: i18n_scope_tickets) %><i></i></div>
          <div data-header="column-picker" class="table-head-cell column-picker">
            <div class="table-columnizer">
              <div class="dropdown-toggle" data-toggle="dropdown"><b class="caret"></b></div>
              <ul id="queue-table-columnizer-dropdown" class="dropdown-menu">
                <header>Show selected columns:</header>
                <%= simple_form_for :columns, wrapper: :bootstrap_boolean, html: { id: "queue-column-filter", onsubmit: "return false;"} do |f| %>
                  <%= f.input t('priority', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "priority"}, checked: true } %>
                  <%= f.input t('common.status'), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "status"}, checked: true } %>
                  <%= f.input t('social', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "social" }, checked: true } %>
                  <%= f.input t('resolution', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "resolution" }, checked: true } %>
                  <%= f.input t('customer', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "customer"}, checked: true } %>
                  <%= f.input t('assigned_to', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "assigned-to"}, checked: true } %>
                  <%= f.input t('assigned_by', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "assigned-by"}, checked: true } %>
                  <%= f.input t('tags', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "tags"}, checked: true } %>
                  <%= f.input t('open_date', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "open-date"}, checked: true } %>
                  <%= f.input t('due_date', scope: i18n_scope_tickets), as: :boolean, wrapper: :bootstrap_boolean, input_html: { data: {column: "due-date"}, checked: true } %>
                  <div class="form-actions">
                    <%= link_to t('common.reset'), "", class: "btn-reset" %>
                    <%= f.submit class: "btn-done", value: t('common.apply') %>
                  </div>
                <% end %>
              </ul>
            </div>
          </div>
        </div>
        <% if @alert_no_tickets %>
          <div class="table-head-row current-filter-note">
            <div class="table-head-cell"><i class="svg-fill"></i> <%= t('no_tickets', scope: i18n_scope_tickets) %></div>
          </div>
        <% end %>
      </div>
    </div>
    <div class="table-body-wrapper <%= 'withFilter' if @alert_no_tickets %>">
      <div class="table-body">
        <% unless @show_all_tickets %>
          <div class="filter-alert"><%= link_to t('filter_7_days', scope: i18n_scope_tickets), tickets_path(show_all: true) %></div>
        <% end %>
        <% if @tickets.count > 0 %>
          <%= render @tickets %>
        <% end %>
      </div>
    </div>
  </div>
</section>

<footer id="queue-tasks-table-footer">
  <section class="total-tasks"><%= t('tasks_total', scope: i18n_scope_tickets) %>: <span class="counter-val"><%= @tickets.count %></span></section>
  <ul id="queue-task-counters">
    <li>
      <a id="new-tasks-counter" class="queue-counter">
        <span class='counter-val'></span>
        <span><%= t('ticket_new', scope: i18n_scope_tickets) %></span>
      </a>
    </li>
    <li>
      <a id="high-priority-counter" class="queue-counter">
        <span class='counter-val'></span>
        <span><%= t('ticket_high_priority', scope: i18n_scope_tickets) %></span>
      </a>
    </li>
    <li>
      <a id="updated-counter" class="queue-counter">
        <span class='counter-val'></span>
        <span><%= t('ticket_updated', scope: i18n_scope_tickets) %><span>
      </a>
    </li>
    <li>
      <a id="overdue-counter" class="queue-counter">
        <span class='counter-val'></span>
        <span><%= t('ticket_overdue', scope: i18n_scope_tickets) %><span>
      </a>
    </li>
  </ul>
</footer>