{% extends "member/noteowner_detail.html" %}
{% load crispy_forms_tags %}
{% load static %}
{% load i18n %}

{% block profile_info %}
{% include "member/club_info.html" %}
{% endblock %}

{% block profile_content %}
<form method="post" action="">
    {% csrf_token %}
    {{ form|crispy }}
    <button class="btn btn-primary" type="submit">{% trans "Submit" %}</button>
</form>
{% endblock %}

{% block extrajavascript %}
    <script>
        function autocompleted(user) {
            $("#id_last_name").val(user.last_name);
            $("#id_first_name").val(user.first_name);
            $.getJSON("/api/members/profile/" + user.id + "/", function(profile) {
                let fee = profile.paid ? {{ club.membership_fee_paid }} : {{ club.membership_fee_unpaid }};
                $("#id_credit_amount").val((fee / 100).toFixed(2));
            });
        }

        soge_field = $("#id_soge");

        function fillFields() {
            let checked = soge_field.is(':checked');
            if (!checked) {
                $("input").attr('disabled', false);
                $("#id_user").attr('disabled', true);
                $("select").attr('disabled', false);
                return;
            }

            let credit_type = $("#id_credit_type");
            credit_type.attr('disabled', true);
            credit_type.val(4);

            let credit_amount = $("#id_credit_amount");
            credit_amount.attr('disabled', true);
            credit_amount.val('{{ total_fee }}');

            let bank = $("#id_bank");
            bank.attr('disabled', true);
            bank.val('Société générale');
        }

        soge_field.change(fillFields);
    </script>
{% endblock %}