Recount-Server/web/dataendpoints.templ

package web

import (
    "nickiel.net/recount_server/types"

    "strconv"
)

templ transaction_rows(transactions *[]types.HumanLegibleTransaction) {
    for i, value := range *transactions {
        <tr class="row_awaiting_processing" data-rcnt-transaction-row-pos={strconv.Itoa(i)}>
            <td></td>
            <td><div>{strconv.Itoa(value.Id)}</div></td>
            if value.AccountName.Valid { 
                <td><div>{value.AccountName.String}</div></td>
            } else {
                <td><div>{strconv.Itoa(value.Account)}</div></td>
            }
            <td><div>{value.Date.Format("01/02/2006")}</div></td>
            <td><div>$</div></td>
            if (len(value.Amount) > 0 && value.Amount[0] == '-') {
                <td class="t-e negative"><div>{value.Amount}</div></td>
            } else {
                <td class="t-e positive"><div>+{value.Amount}</div></td>
            }
        </tr>
    }
}

templ account_summary_rows(accounts *[]types.TwoIntsItem){
    for _, value := range *accounts {
        <div class="c-crust m-2" style="height: 90px">
            <div class="w-100 d-flex" style="height:15px">
                <span class="mx-auto">Account: {strconv.Itoa(value.Item2)}</span>
            </div>
            <div class="d-flex w-100">
                <div class="w-75" style="height:75px">
                    <canvas
                        class="chartjs-chart sparkline-chart"
                        data-chart-endpoint={"/components/data/account_summary/" + strconv.Itoa(value.Item2)}
                        data-chart-type="sparkline_summary"
                    ></canvas>
                </div>
                <div class="w-25 d-flex">
                    if value.Item1 > 0 {
                        <span class="my-auto w-100 t-m cr-all c-mantle" style="color: var(--pf-green)">
                        -${strconv.Itoa(value.Item1)}
                        </span>
                    } else {
                        <span class="my-auto w-100 t-m cr-all c-mantle" style="color: var(--pf-red)">
                        +${strconv.Itoa(value.Item1)}
                        </span>
                    }
                </div>
            </div>
        </div>
    }
}

templ transaction_quick_access() {
    <div id="transaction-quick-access-panel">
        <div class="t-header">
            <button
                class="borderless-btn btn-sm mx-auto c-green ch-teal"
                style="color: var(--pf-base);"
            >
                <i class="" data-feather="plus"></i>
                Add New
            </button>
            <div class="m-auto d-flex">
                <input id="show-pending-transactions" type="checkbox"></input>
                <label for="show-pending-transactions">
                    Show Pending
                </label>
            </div>
        </div>
        <div class="t-list">
            <div class="tab-div">
                <button id="open-draft">
                    <i data-feather="file-plus"></i>
                </button>
            </div>
            <div class="t-list-container">

            </div>
        </div>
    </div>
}

templ right_panel_quick_access() {
    <div id="quick-access-panel">
    </div>
}