{% extends 'layouts/base.html' %}
{% load static %}
{% load l10n %}

{% block extra_css %}
    {{ block.super }}
    <link rel="stylesheet" href="{% static 'farm/css/farm_home.css' %}"> 
{% endblock %}

{% block content %}
    <div class="header">
        <div class="header-left">
            <h1 class="title">{{ title }}</h1>
            <p>Configurações da fazenda</p>
        </div>
        <div class="header-right">
            <div class="farm-info">
                <p>Animais</p>
                <p>{{ selected_farm.animal_count }}</p>
            </div>
            <div class="farm-info">
                <p>Piquetes</p>
                <p>{{ selected_farm.paddock_count }}</p>
            </div>
            <div class="farm-info">
                <p>Área</p>
                <p>{{ selected_farm.total_area }}</p>
            </div>
        </div>
    </div>

    <div class="farm-config-container">
        <h2 class="farm-config-title">Fatores de consumo</h2>
        <form action="{% url "entities:farm:consumption_update" %}" method="POST">
            {% csrf_token %}
            <div class="config-card">
                <p class="config-card-title">Consumo padrão</p>
                <input type="number" name="default-consume" min="0.01" step="0.01" value="{{ selected_farm.default_consumption|unlocalize }}">
            </div>
            <div class="config-card">
                <p class="config-card-title">Consumo no verão</p>
                <input type="number" name="summer-consume" min="0.01" step="0.01" value="{{ selected_farm.summer_consumption|unlocalize }}">
            </div>
            <div class="config-card">
                <p class="config-card-title">Consumo no inverno</p>
                <input type="number" name="winter-consume" min="0.01" step="0.01" value="{{ selected_farm.winter_consumption|unlocalize }}">
            </div>
            <div class="config-submit">
                <button type="submit">Salvar</button>
            </div>
        </form>
    </div>

    <div class="batch-type-config-container">
        <div class="batch-type-config-header">
            <h2 class="batch-type-title">Tipos de lote</h2>
            <a hx-get="{% url "entities:animal:batchtype_create" %}" hx-swap="beforeend" hx-target="body"><i class="fa-solid fa-plus"></i> Tipo</a>
        </div>
        {% for type in batch_types %}
            <div class="batch-type-card">
                <div class="batch-type-left">
                    <p class="type-title">{{ type.name }}</p>
                    <p class="type-consumption-factor">Multiplicativo de consumo: {{ type.consumption_factor }} ({{ type.consumption_percentage }}%)</p>
                </div>
                <div class="batch-type-right">
                    <a class="edit-type" hx-get="{% url "entities:animal:batchtype_update" type.id %}" hx-swap="beforeend" hx-target="body">Editar</a>
                    <a class="delete-type" hx-get="{% url "entities:animal:batchtype_delete" type.id %}" hx-swap="beforeend" hx-target="body">Excluir</a>
                </div>
            </div>
        {% endfor %}
    </div>

    <div class="allowed-users-container">
        <div class="allowed-users-header">
            <h2 class="allowed-users-title">Usuários com acesso</h2>
            <a hx-get="{% url "entities:farm:new_authorization" %}" hx-swap="beforeend" hx-target="body"><i class="fa-solid fa-plus"></i> Permissão</a>
        </div>
        {% if allowed_users|length < 1 %}
            <p class="type-consumption-factor">Seu usuário é o único vinculado a essa fazenda</p>
        {% endif %}
        {% for user in allowed_users %}
            <div class="allowed-user-card">
                <p class="name"><i class="fa-regular fa-user"></i> {{user.name}}</p>
                <a hx-get="{% url "entities:farm:farm_user_deauthorize" user.id %}" hx-swap="beforeend" hx-target="body" class="user-remove"><i class="fa-solid fa-user-slash"></i></a>
            </div>
        {% endfor %}
    </div>

    <div class="available-farms-container">
        <h2 class="available-farms-title">Suas fazendas</h2>
        {% for farm in farms %}
            <div class="available-farm-card">
                <p class="available-farm-name">{{ farm.name }}</p>
                <div class="available-farm-ifo">
                    <p class="animal-count">{{ farm.animal_count }} Animais</p>
                    <p class="animal-count">{{ farm.paddock_count }} Piquetes</p>
                </div>
                <div class="available-farm-options">
                    <a class="available-farm-select" href="{% url "entities:user:farm_set" farm.id %}">Selecionar</a>
                    <a class="available-farm-delete" hx-get="{% url "entities:farm:farm_delete" farm.id %}" hx-swap="beforeend" hx-target="body">Excluir</a>
                </div>
            </div>
        {% endfor %}
    </div>
{% endblock %}