{% extends 'client/frame.html' %}

{% block sub_title %}Кампании{% endblock %}
{% block nav_campaigns %}active{% endblock %}
{% block frame_header %}Кампании{% endblock %}

{% block content %}
  <div class="row-fluid">
    <div class="span12">
      <div class="box box-color box-bordered">
        <div class="box-title">
          <h3>
            <i class="icon-bar-chart"></i>
            Обзор
          </h3>
          <div class="actions">
            <a href="#" class="btn btn-mini content-refresh" id='campaigns-refresh'><i class="icon-refresh"></i></a>
          </div>
        </div>
        <div class="box-content nopadding">
          <table class="table table-hover table-nomargin dataTable table-bordered">
            <colgroup>
              <col style="width: 30%;"> {# Name of campaign #}
              <col style="width: 10%;"> {# Status #}
              <col style="width: 10%;"> {# Impressions #}
              <col style="width: 10%;"> {# Clicks #}
              <col style="width: 10%;"> {# CTR #}
            </colgroup>
            <thead>
              <tr>
                <th>Название кампании</th>
                <th>Статус</th>
                <th>Показы</th>
                <th>Клики</th>
                <th>CTR (%)</th>
              </tr>
            </thead>
            <tbody>
              {% for row in data %}
                <tr>
                  <td>
                    <a class="btn" rel="tooltip" data-placement="bottom" data-original-title="Показать отчет" href="{{ url_for('client.stats_by_campaign', campaign_id=row.campaign_id) }}"><i class="icon-bar-chart"></i></a>
                    <a href="{{ url_for('client.creatives_by_campaign', campaign_id=row.id) }}">{{ row.name|e }}</a>
                  </td>
                  <td>{{ row.state }}</td>
                  <td>{{ row.impr  if row.impr else 0 }}</td>
                  <td>{{ row.clck if row.clck else 0 }}</td>
                  <td>{{ row.ctr }}</td>
                </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
  <script>
    $(function(){
      function reload(){
        location.reload();
      }
      setTimeout(reload, dataRefreshInterval);
      $('a#campaigns-refresh').click(function(){
        setTimeout(reload, delayBeforePageReload);
      })

    })
  </script>
{%  endblock %}
