ddp/finplan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added simple growth, changed column widths and header formats to work better. Added a quick and dirty Total bills in 2025 section

Browse Source
This commit is contained in:
Damien De Paoli
2025-08-28 19:46:23 +10:00
parent dda3a3e3fe
commit 89fe874c5c
1 changed files with 30 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
templates/bills.html
View File

@@ -35,10 +35,10 @@
<button id="canc-bill-type" class="new-bill-type-class px-0 col-1 btn btn-danger bg-danger-subtle text-danger d-none" onClick="CancelNewBillType()"><span class="bi bi-x"> Cancel</span></button> <button id="canc-bill-type" class="new-bill-type-class px-0 col-1 btn btn-danger bg-danger-subtle text-danger d-none" onClick="CancelNewBillType()"><span class="bi bi-x"> Cancel</span></button>
</div> </div>
<div class="row"> <div class="row">
<div class="px-0 col-2"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0 h-100"><br>Name</ ></div> <div class="px-0 col-2"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0">Name</ ></div>
<div class="px-0 col-2"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0 h-100"><br>Frequency</ ></div> <div class="px-0 col-2"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0">Frequency</ ></div>
<div class="px-0 col-2"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0">Annual Growth Est (min/avg/max)</ ></div> <div class="px-0 col-4"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0">Annual Growth Est (min/avg/max/simple)</ ></div>
<div class="px-0 col-2"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0 h-100"><br>Actions</ ></div> <div class="px-0 col-2"><label class="form-control text-center border-0 fw-bold bg-body-tertiary rounded-0">Actions</ ></div>
</div> </div>
{% for bt in bill_types %} {% for bt in bill_types %}
<div class="row"> <div class="row">
@@ -52,26 +52,32 @@
</select> </select>
</div> </div>
<script>$('#bill-type-freq-{{bt.id}}').val( {{bt.freq}} );</script> <script>$('#bill-type-freq-{{bt.id}}').val( {{bt.freq}} );</script>
<div class="px-0 col-2"> <div class="px-0 col-4">
<div class="btn-group w-100" role="group"> <div class="btn-group w-100" role="group">
<input type="radio" class="btn-check" name="growth-{{bt.id}}" id="min-{{bt.id}}" autocomplete="off" <input type="radio" class="btn-check" name="growth-{{bt.id}}" id="min-{{bt.id}}" autocomplete="off"
onChange="UseGrowth({{bt.id}}, 'min')" {% if bt.which_growth == 'min' %}checked{% endif %}> onChange="UseGrowth({{bt.id}}, 'min')" {% if bt.which_growth == 'min' %}checked{% endif %}>
<label class="btn btn-outline-secondary" for="min-{{bt.id}}"> <label class="btn btn-outline-secondary font-monospace d-inline-block text-end" for="min-{{bt.id}}" style="width: 6ch;">
{% if bt.ann_growth_min < 10 %} &nbsp; {% endif %} {% if bt.ann_growth_min> 0 and bt.ann_growth_min < 10 %} &nbsp; {% endif %}
{{'%.2f'|format(bt.ann_growth_min)}} {{'%5.2f'|format(bt.ann_growth_min)}}
</label> </label>
<input type="radio" class="btn-check" name="growth-{{bt.id}}" id="avg-{{bt.id}}" autocomplete="off" <input type="radio" class="btn-check" name="growth-{{bt.id}}" id="avg-{{bt.id}}" autocomplete="off"
onChange="UseGrowth({{bt.id}}, 'avg')" {% if bt.which_growth == 'avg' %}checked{% endif %}> onChange="UseGrowth({{bt.id}}, 'avg')" {% if bt.which_growth == 'avg' %}checked{% endif %}>
<label class="btn btn-outline-secondary" for="avg-{{bt.id}}"> <label class="btn btn-outline-secondary font-monospace d-inline-block text-end" for="avg-{{bt.id}}" style="width: 6ch;">
{% if bt.ann_growth_avg < 10 %} &nbsp; {% endif %} {% if bt.ann_growth_avg < 10 %} &nbsp; {% endif %}
{{'%.2f'|format(bt.ann_growth_avg)}} {{'%.2f'|format(bt.ann_growth_avg)}}
</label> </label>
<input type="radio" class="btn-check" name="growth-{{bt.id}}" id="max-{{bt.id}}" autocomplete="off" <input type="radio" class="btn-check" name="growth-{{bt.id}}" id="max-{{bt.id}}" autocomplete="off"
onChange="UseGrowth({{bt.id}}, 'max')" {% if bt.which_growth == 'max' %}checked{% endif %}> onChange="UseGrowth({{bt.id}}, 'max')" {% if bt.which_growth == 'max' %}checked{% endif %}>
<label class="btn btn-outline-secondary" for="max-{{bt.id}}"> <label class="btn btn-outline-secondary font-monospace d-inline-block text-end" for="max-{{bt.id}}" style="width: 6ch;">
{% if bt.ann_growth_max < 10 %} &nbsp; {% endif %} {% if bt.ann_growth_max < 10 %} &nbsp; {% endif %}
{{'%.2f'|format(bt.ann_growth_max)}} {{'%.2f'|format(bt.ann_growth_max)}}
</label> </label>
<input type="radio" class="btn-check" name="growth-{{bt.id}}" id="simple-{{bt.id}}" autocomplete="off"
onChange="UseGrowth({{bt.id}}, 'simple')" {% if bt.which_growth == 'simple' %}checked{% endif %}>
<label class="btn btn-outline-secondary font-monospace d-inline-block text-end" for="simple-{{bt.id}}" style="width: 6ch;">
{% if bt.ann_growth_simple < 10 %} &nbsp; {% endif %}
{{'%.2f'|format(bt.ann_growth_simple)}}
</label>
</div> </div>
</div> </div>
<button id="bill-type-chg-{{bt.id}}" class="px-0 col-1 btn btn-success bg-success-subtle text-success" onClick="StartUpdateBillType( {{bt.id}} )"><span class="bi bi-pencil-square"> Change</button> <button id="bill-type-chg-{{bt.id}}" class="px-0 col-1 btn btn-success bg-success-subtle text-success" onClick="StartUpdateBillType( {{bt.id}} )"><span class="bi bi-pencil-square"> Change</button>
@@ -80,6 +86,20 @@
<button id="bill-type-canc-{{bt.id}}" class="px-0 col-1 btn btn-danger bg-danger-subtle text-danger d-none" onClick="CancelUpdateBillType({{bt.id}}, '{{bt.name}}')"><span class="bi bi-x"> Cancel</button> <button id="bill-type-canc-{{bt.id}}" class="px-0 col-1 btn btn-danger bg-danger-subtle text-danger d-none" onClick="CancelUpdateBillType({{bt.id}}, '{{bt.name}}')"><span class="bi bi-x"> Cancel</button>
</div> </div>
{% endfor %} {% endfor %}
{% set total=namespace( sum=0 ) %}
{% for bd in bill_data %}
{% if '2025' in bd['bill_date'] %}
{% set total.sum = total.sum + bd['amount'] %}
{% endif %}
{% endfor %}
<div class="row">
<div class="pt-4 col text-end display-6">
Total bills in 2025:
</div>
<div class="pt-4 col display-6 text-primary">
${{total.sum}}
</div>
</div>
</div> </div>
<!-- right-hand-side, bill types (e.g. gas, phone, etc.) --> <!-- right-hand-side, bill types (e.g. gas, phone, etc.) -->