{% extends "base.html" %}
{% load i18n %}
{% load static %}

{% block content %}
<div class="row">
    <h3>Комерційна пропозиція, копія</h3>
</div>
<div class="row">
    <a href="{% url 'commercial_offer_list' %}">
        <button class="btn waves-effect waves-light">
            Повернутися
        </button>
    </a>
</div>
<div class="row">
    <div class="col s12 m2">
        <div class="card">
            <div class= "title">
                <span class="circle"> 
                    <i class="material-icons">transfer_within_a_station</i>
                </span>
                <p class="titleText">
                    USD
                </p>
            </div>
            <div class="data">
                <p>
                    {{exchangeRates_dollar}} UAH
                </p>
                <p>
                    {{exchangedate_dollar}}
                </p>
                
                <div class="range">
                    <div class="fill">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col s12 m2">
        <div class="card">
            <div class= "title">
                <span class="circle"> 
                    <i class="material-icons">transfer_within_a_station</i>
                </span>
                <p class="titleText">
                    EURO
                </p>
            </div>
            <div class="data">
                <p>
                    {{exchangeRates_euro}} UAH
                </p>
                <p>
                    {{exchangedate_euro}}
                </p>
                
                <div class="range">
                    <div class="fill">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="row m12 s12">
        <div class="input-field col m10 s12">
            <i class="material-icons prefix">mode_edit</i>
            <input id="name" name="name" type="text" class="validate">
            <label for="name">Назва обєкту</label>
        </div>
    </div>
</div>

<div class="row">
    <div class="input-field col m3 s12">
        <i class="material-icons prefix">mode_edit</i>
        <input id="currency_euro" name="currency_euro" type="text" class="validate" value="{{exchangeRates_euro}}">
        <label for="currency_euro">Евро</label>
    </div>
    <div class="input-field col m3 s12">
        <i class="material-icons prefix">mode_edit</i>
        <input id="currency_dollar" name="currency_dollar" type="text" class="validate" value="{{exchangeRates_dollar}}">
        <label for="currency_dollar">Доллар</label>
    </div>
    <div class="input-field col m3 s12">
        <i class="material-icons prefix">mode_edit</i>
        <input id="profitability" name="profitability" type="text" class="validate" value="1">
        <label for="profitability">Рентабельність</label>
    </div>

</div>

<div class="row">
    <div id="handsontable_container_copy_commercial_offer" style="width: 100%"></div>
</div>
<div class="row">
    <div id="total_sum"></div>
</div>
<div class="row">
    <div id="total_sum_profitability"> </div>
</div>
<div class="row">
    <a href="{% url 'commercial_offer_list' %}">
        <button class="btn waves-effect waves-light">
            Повернутися
        </button>
    </a>
    <a href="#">
        <button id="save_copy_commercial_offer"  class="btn waves-effect waves-light">
            Зберегти
        </button>
    </a>
</div>

{% endblock %}

{% block scripts %}
    <script type="module" src="{% static 'js/copy_commercial_offer.js' %}"></script>
{% endblock %}