const $ = require('jquery');
const api = require('../utils/api');
const utils = require('../utils');
const chart = require('./chart_and_messages');
const list_row = require('../ui/list_row');
const ui = require('../ui/common');
const modal = require('../utils/modal');

api.on_submit("/budget/recurring_transaction", [
    $("#create-withdrawal"), $("#edit-withdrawal")
], {
    estimate_value: x => -Math.abs(utils.round(parseFloat(x), 2)),
    day: x => parseInt(x),
    month: x => parseInt(x)
}, [
    ["name", "Recurring withdrawal must have a name"],
    ["estimate_value", "Withdrawal value must be provided"], // value=0 will be accounted for here
    ["estimate_value", "Withdrawal value must be a number", value => !isNaN(value)],
    ["estimate_value", "Withdrawal value must be less than $0.00", value => value < 0],
    ["day", "Invalid day", utils.validate.day],
    ["month", "Invalid month", utils.validate.month]
], async function () {
    modal.close();
    await chart.refresh();
    await populate_withdrawals_table();
});

$("#delete-withdrawal").on("click", async function () {
    const id = $("#edit-withdrawal").find('[name="id"]').val();
    await api.delete('/budget/recurring_transaction/' + id);
    ui.show_banner({
        message: `Withdrawal ${id} deleted`
    });
    modal.close();
    await chart.refresh();
    await populate_withdrawals_table();
});

api.get("/budget/accounts").then(function ({
    accounts
}) {
    const payment_account_fields = ui.get_inputs(["#create-withdrawal", "#edit-withdrawal"], "payment_account");
    for (const $payment_account_field of payment_account_fields) {
        ui.generate_account_options($payment_account_field, accounts);
    }
});

const month_fields = ui.get_inputs(["#create-withdrawal", "#edit-withdrawal"], "month").map(ui.generate_month_options);
const day_fields = ui.get_inputs(["#create-withdrawal", "#edit-withdrawal"], "day");
day_fields.forEach(function ($day_field) {
    month_fields.forEach(function ($month_field) {
        $month_field.on('click', function () {
            ui.generate_day_options($day_field, $month_field.val());
        });
    });
    ui.generate_day_options($day_field);
});

populate_withdrawals_table();

async function populate_withdrawals_table() {
    $("#withdrawals-list").empty();
    const {
        withdrawals
    } = await api.get("/budget/withdrawals");
    for (const withdrawal of withdrawals) {
        list_row.create("withdrawals", {
            title: `${withdrawal.name}:`,
            text: `$${Math.abs(withdrawal.estimate_value).toFixed(2)} ${utils.get_recurring_text(withdrawal.month)} ${utils.format_day(withdrawal.day)}`
        }).on('click', function () {
            ui.prefill_inputs("#edit-withdrawal", withdrawal);
            modal.create('edit-withdrawal-modal');
        });
    }
}

populate_withdrawal_history_table();

async function populate_withdrawal_history_table() {
    $("#withdrawal-history-list").empty();
    const {
        withdrawal_history
    } = await api.get("/budget/withdrawals/history");

    const today = new Date();
    let add_separator = false;

    for (const withdrawal of withdrawal_history) {
        list_row.create("withdrawal-history", {
            title: `${withdrawal.name}:`,
            text: `$${(-withdrawal.value).toFixed(2)} on ${withdrawal.date}`
        }).on('click', function () {
            ui.prefill_inputs("#edit-withdrawal-history", withdrawal);
            modal.create('edit-withdrawal-history-modal');
        });

        if (new Date(withdrawal.date) > today) {
            add_separator = true;
        } else if (add_separator) {
            $(`#withdrawal-history-list`).append($('<div>', {
                class: "list-separator",
            }));
            add_separator = false;
        }
    }
}