{% extends "kfet/base.html" %}
{% load staticfiles %}
{% load kfet_tags %}
{% load l10n %}

{% block extra_head %}
<script type="text/javascript" src="{% static 'kfet/js/js.cookie.js' %}"></script>
<script type="text/javascript" src="{% static 'kfet/js/moment.js' %}"></script>
<script type="text/javascript" src="{% static 'kfet/js/moment-fr.js' %}"></script>
<script type="text/javascript" src="{% static 'kfet/js/moment-timezone-with-data-2010-2020.js' %}"></script>
<script type="text/javascript" src="{% static 'kfet/js/kfet.js' %}"></script>
<script type="text/javascript" src="{% static 'kfet/js/history.js' %}"></script>
{% if account.user == request.user %}
<script type="text/javascript" src="{% static 'kfet/js/Chart.bundle.js' %}"></script>
<script type="text/javascript" src="{% static 'kfet/js/statistic.js' %}"></script>

<script type="text/javascript">
$(document).ready(function() {
    var stat_last = new StatsGroup(
        "{% url 'kfet.account.stat.operation.list' trigramme=account.trigramme %}",
        $("#stat_last"),
    );
    var stat_balance = new StatsGroup(
        "{% url 'kfet.account.stat.balance.list' trigramme=account.trigramme %}",
        $("#stat_balance"),
    );
 });
</script>
{% endif %}
{% endblock %}

{% block title %}
{% if account.user == request.user %}
    Mon compte
{% else %}
    Informations du compte {{ account.trigramme }}
{% endif %}
{% endblock %}

{% block content-header-title %}
{% if account.user == request.user %}
    Mon compte
{% else %}
    Compte - {{ account.trigramme }}
{% endif %}
{% endblock %}

{% block content %}

<div class="row">
  <div class="col-sm-4 col-md-3 col-content-left">
    <div class="content-left">
      {% include 'kfet/left_account.html' %}
    </div>
  </div>
  <div class="col-sm-8 col-md-9 col-content-right">
    {% include "kfet/base_messages.html" %}
    <div class="content-right">
      {% if addcosts %}
        <div class="content-right-block">
          <h2>Gagné des majorations</h2>
          <div>
            <ul>
              {% for addcost in addcosts %}
                <li>{{ addcost.date|date:'l j F' }}: +{{ addcost.sum_addcosts }}€</li>
              {% endfor %}
            </ul>
          </div>
        </div>
      {% endif %}
      {% if account.user == request.user %}
      <div class="content-right-block content-right-block-transparent">
        <h2>Statistiques</h2>
        <div class="row">
          <div class="col-sm-12 nopadding">
            <div class="panel-md-margin">
              <h3>Ma balance</h3>
              <div id="stat_balance"></div>
            </div>
          </div>
        </div><!-- /row -->
        <div class="row">
          <div class="col-sm-12 nopadding">
            <div class="panel-md-margin">
              <h3>Ma consommation</h3>
              <div id="stat_last"></div>
            </div>
          </div>
        </div><!-- /row -->
      </div>
      {% endif %}
      <div class="content-right-block">
        <h2>Historique</h2>
        <div id="history">
        </div>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript">
$(document).ready(function() {
    settings = { 'subvention_cof': parseFloat({{ settings.subvention_cof|unlocalize }})}

    khistory = new KHistory({
        display_trigramme: false,
    });

    function getHistory() {
        var data = {
            'accounts': [{{ account.pk }}],
        }

        $.ajax({
            dataType: "json",
            url     : "{% url 'kfet.history.json' %}",
            method  : "POST",
            data    : data,
        })
        .done(function(data) {
            for (var i=0; i<data['opegroups'].length; i++) {
                khistory.addOpeGroup(data['opegroups'][i]);
            }
            var nb_opes = khistory.$container.find('.ope:not(.canceled)').length;
            $('#nb_opes').text(nb_opes);
        });
    }

    getHistory();
});
</script>

{% endblock %}
