From 9c0d7122f6ba1c70ca5abf9d280ab0e767031e0f Mon Sep 17 00:00:00 2001 From: Yingtong Li Date: Sun, 30 Apr 2023 21:17:07 +1000 Subject: [PATCH] Add budget graphs On the budget page, add a pie chart of expenses, and a bar chart comparing expenses to revenue. --- sstreasury/jinja2/sstreasury/base.html | 13 +- sstreasury/jinja2/sstreasury/budget_view.html | 548 +++++++++--------- sstreasury/static/sstreasury/budget.js | 85 ++- 3 files changed, 365 insertions(+), 281 deletions(-) diff --git a/sstreasury/jinja2/sstreasury/base.html b/sstreasury/jinja2/sstreasury/base.html index d4102f1..4069528 100644 --- a/sstreasury/jinja2/sstreasury/base.html +++ b/sstreasury/jinja2/sstreasury/base.html @@ -2,7 +2,8 @@ {# Society Self-Service - Copyright © 2018–2020 Yingtong Li (RunasSudo) + Copyright © 2018–2023 Yingtong Li (RunasSudo) + Copyright © 2023 MUMUS Inc. This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by @@ -21,7 +22,7 @@ {% block content %}
{# side menu #} -
+ {% endblock %} diff --git a/sstreasury/jinja2/sstreasury/budget_view.html b/sstreasury/jinja2/sstreasury/budget_view.html index 2708a30..774abc5 100644 --- a/sstreasury/jinja2/sstreasury/budget_view.html +++ b/sstreasury/jinja2/sstreasury/budget_view.html @@ -2,7 +2,8 @@ {# Society Self-Service - Copyright © 2018–2020 Yingtong Li (RunasSudo) + Copyright © 2018–2023 Yingtong Li (RunasSudo) + Copyright © 2023 MUMUS Inc. This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by @@ -20,286 +21,296 @@ {% block title %}{{ revision.name }}{% endblock %} -{% block maincontent %} -

{{ revision.name }}

- -
- Status: {{ revision.get_state_display() }} +{% block aftersidebar %} +
+

{{ revision.name }}

- {% if is_latest %} - {% if revision.can_submit(request.user) %} - - {% endif %} - {% if revision.can_endorse(request.user) %} - - - - {% endif %} - {% if revision.can_approve(request.user) %} - - - - {% endif %} - {% if revision.can_withdraw(request.user) %} - - {% endif %} - {% if revision.can_cancel(request.user) %} - - {% endif %} - - {% if revision.can_edit(request.user) %} - Edit - {% endif %} - - Print - - {% if not revision.can_edit(request.user) and revision.can_withdraw(request.user) %} -
-

This budget has been submitted and is now awaiting approval. If you wish to edit this budget, you must first withdraw it. This will revert the budget to a draft.

-
- {% endif %} - - - - {% else %} - Print - -
-

You are viewing an older version of this budget. To make any changes, click here to return to the current version.

-
- {% endif %} - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
IDBU-{{ revision.budget.id }}
Title{{ revision.name }}
Due date{{ revision.date or '' }}
Event details - {% if revision.event_dt %}{{ localtime(revision.event_dt) }}.{% endif %} - {% if revision.event_attendees %}{{ revision.event_attendees }} attendees.{% endif %} - {% if not revision.event_dt and not revision.event_attendees %}N/A{% endif %} -
Contributors -
- {% for contributor in revision.contributors.all() %} -
- -
- {% if contributor.first_name %} - {{ contributor.first_name }} {{ contributor.last_name }} - {% else %} - {{ contributor.email }} - {% endif %} -
-
- {% endfor %} -
-
Comments{{ revision.comments|markdown }}
Revenue -
- {% if revision.revenue_comments %} -
-
- - Revenue comments -
-
- {{ revision.revenue_comments|markdown }} -
-
- {% endif %} -
Expenses - {% if revision.expense_no_emergency_fund %} -

No emergency fund required (please add a comment explaining why)

- {% endif %} -
- {% if revision.expense_comments %} -
-
- - Expense comments -
-
- {{ revision.expense_comments|markdown }} -
-
- {% endif %} -
Total Profit (Loss){{ '${:.2f}'.format(revision.get_revenue_total() - revision.get_expense_total()) if revision.get_revenue_total() >= revision.get_expense_total() else '(${:.2f})'.format(revision.get_expense_total() - revision.get_revenue_total()) }}
- - {% if is_latest %}
-
- -
- - - + Status: {{ revision.get_state_display() }} - {% if revision.state == import('sstreasury.models').BudgetState.AWAIT_REVIEW.value and request.user.groups.filter(name='Treasury').exists() %} - + {% if is_latest %} + {% if revision.can_submit(request.user) %} + + {% endif %} + {% if revision.can_endorse(request.user) %} + + + + {% endif %} + {% if revision.can_approve(request.user) %} + + + + {% endif %} + {% if revision.can_withdraw(request.user) %} + + {% endif %} + {% if revision.can_cancel(request.user) %} + + {% endif %} - - {% elif revision.state != import('sstreasury.models').BudgetState.APPROVED.value and request.user.groups.filter(name='Secretary').exists() %} - + {% if revision.can_edit(request.user) %} + Edit + {% endif %} - + Print + + {% if not revision.can_edit(request.user) and revision.can_withdraw(request.user) %} +
+

This budget has been submitted and is now awaiting approval. If you wish to edit this budget, you must first withdraw it. This will revert the budget to a draft.

+
+ {% endif %} + + + + {% else %} + Print + +
+

You are viewing an older version of this budget. To make any changes, click here to return to the current version.

+
{% endif %}
-
- {% for item in history %} - {% if item.__class__.__name__ == 'BudgetComment' %} -
-
- + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
IDBU-{{ revision.budget.id }}
Title{{ revision.name }}
Due date{{ revision.date or '' }}
Event details + {% if revision.event_dt %}{{ localtime(revision.event_dt) }}.{% endif %} + {% if revision.event_attendees %}{{ revision.event_attendees }} attendees.{% endif %} + {% if not revision.event_dt and not revision.event_attendees %}N/A{% endif %} +
Contributors +
+ {% for contributor in revision.contributors.all() %} +
+ +
+ {% if contributor.first_name %} + {{ contributor.first_name }} {{ contributor.last_name }} + {% else %} + {{ contributor.email }} + {% endif %} +
+
+ {% endfor %}
-
-
- - {{ item.author.first_name }} {{ item.author.last_name }} commented -
- {{ localtime(item.time) }} +
Comments{{ revision.comments|markdown }}
Revenue +
+ {% if revision.revenue_comments %} +
+
+ + Revenue comments +
+
+ {{ revision.revenue_comments|markdown }}
-
- {{ item.content|markdown }} -
- - - {% elif item.__class__.__name__ == 'BudgetRevision' %} -
-
- -
-
-
- - {% if item.action == import('sstreasury.models').BudgetAction.CREATE.value %} - {{ item.author.first_name }} {{ item.author.last_name }} created the budget (view) - {% elif item.action == import('sstreasury.models').BudgetAction.EDIT.value %} - {{ item.author.first_name }} {{ item.author.last_name }} edited the budget (view) - {% elif item.action == import('sstreasury.models').BudgetAction.UPDATE_STATE.value %} - {{ item.author.first_name }} {{ item.author.last_name }} changed the state to: {{ item.get_state_display() }} - {% else %} - {{ item.author.first_name }} {{ item.author.last_name }} modified the budget (view) - {% endif %} -
- {{ localtime(item.time) }} + {% endif %} +
Expenses + {% if revision.expense_no_emergency_fund %} +

No emergency fund required (please add a comment explaining why)

+ {% endif %} +
+ {% if revision.expense_comments %} +
+
+ + Expense comments +
+
+ {{ revision.expense_comments|markdown }}
- - - {% endif %} - {% endfor %} - + {% endif %} +
Total Profit (Loss){{ '${:.2f}'.format(revision.get_revenue_total() - revision.get_expense_total()) if revision.get_revenue_total() >= revision.get_expense_total() else '(${:.2f})'.format(revision.get_expense_total() - revision.get_revenue_total()) }}
- {% if claims is not none %} -

Reimbursement claims

- - {% if claims %} - - - - - - - - - - - {% for claim in claims %} - - - - - - - {% endfor %} - -
PurposeStatusTotalView
{{ claim.purpose }}{{ claim.get_state_display() }}{{ '${:.2f}'.format(claim.get_total()) }} - -
- -
-

This list will not include invoices, or other transactions tracked outside of Self Service.

+ {% if is_latest %} +
+
+
- {% else %} -

There are no claims to display.

+ + + + + {% if revision.state == import('sstreasury.models').BudgetState.AWAIT_REVIEW.value and request.user.groups.filter(name='Treasury').exists() %} + + + + {% elif revision.state != import('sstreasury.models').BudgetState.APPROVED.value and request.user.groups.filter(name='Secretary').exists() %} + + + + {% endif %} +
+ +
+ {% for item in history %} + {% if item.__class__.__name__ == 'BudgetComment' %} +
+
+ +
+
+
+ + {{ item.author.first_name }} {{ item.author.last_name }} commented +
+ {{ localtime(item.time) }} +
+
+
+ {{ item.content|markdown }} +
+
+
+ {% elif item.__class__.__name__ == 'BudgetRevision' %} +
+
+ +
+
+
+ + {% if item.action == import('sstreasury.models').BudgetAction.CREATE.value %} + {{ item.author.first_name }} {{ item.author.last_name }} created the budget (view) + {% elif item.action == import('sstreasury.models').BudgetAction.EDIT.value %} + {{ item.author.first_name }} {{ item.author.last_name }} edited the budget (view) + {% elif item.action == import('sstreasury.models').BudgetAction.UPDATE_STATE.value %} + {{ item.author.first_name }} {{ item.author.last_name }} changed the state to: {{ item.get_state_display() }} + {% else %} + {{ item.author.first_name }} {{ item.author.last_name }} modified the budget (view) + {% endif %} +
+ {{ localtime(item.time) }} +
+
+
+
+ {% endif %} + {% endfor %} +
+ + {% if claims is not none %} +

Reimbursement claims

+ + {% if claims %} + + + + + + + + + + + {% for claim in claims %} + + + + + + + {% endfor %} + +
PurposeStatusTotalView
{{ claim.purpose }}{{ claim.get_state_display() }}{{ '${:.2f}'.format(claim.get_total()) }} + +
+ +
+

This list will not include invoices, or other transactions tracked outside of Self Service.

+
+ {% else %} +

There are no claims to display.

+ {% endif %} {% endif %} {% endif %} - {% endif %} + +
+
+

Are you sure you want to submit this budget for Treasury review? You will not be able to make any additional changes without withdrawing the budget.

+
+
+

Are you sure you want to give this budget Treasury endorsement?

+
+
+

Are you sure you want to give this budget Treasury endorsement?

+
+
+

Are you sure you want to refuse this budget Treasury endorsement and return it for re-drafting?

+
+
+

Are you sure you want to refuse this budget Treasury endorsement and return it for re-drafting?

+
+
+

Are you sure you want to mark this budget as committee-approved?

+
+
+

Are you sure you want to mark this budget as committee-approved?

+
+
+

Are you sure you want to refuse this budget committee approval and return it for re-drafting?

+
+
+

Are you sure you want to refuse this budget committee approval and return it for re-drafting?

+
+
+

Are you sure you want to withdraw this budget from being considered for approval? The budget will be reverted to a draft.

+
+
+

Are you sure you want to cancel this budget?

+
+
+
Continue
+
Cancel
+
+
+
-
-
-

Are you sure you want to submit this budget for Treasury review? You will not be able to make any additional changes without withdrawing the budget.

-
-
-

Are you sure you want to give this budget Treasury endorsement?

-
-
-

Are you sure you want to give this budget Treasury endorsement?

-
-
-

Are you sure you want to refuse this budget Treasury endorsement and return it for re-drafting?

-
-
-

Are you sure you want to refuse this budget Treasury endorsement and return it for re-drafting?

-
-
-

Are you sure you want to mark this budget as committee-approved?

-
-
-

Are you sure you want to mark this budget as committee-approved?

-
-
-

Are you sure you want to refuse this budget committee approval and return it for re-drafting?

-
-
-

Are you sure you want to refuse this budget committee approval and return it for re-drafting?

-
-
-

Are you sure you want to withdraw this budget from being considered for approval? The budget will be reverted to a draft.

-
-
-

Are you sure you want to cancel this budget?

-
-
-
Continue
-
Cancel
-
+
+

Expenses

+ + +

Revenue and expenses

+
{% endblock %} @@ -327,6 +338,15 @@ .jsgrid-header-row .jsgrid-header-cell { text-align: center !important; } + + /* Full screen width for graphs */ + @media only screen and (min-width: 768px) { + .ui.container { + width: auto; + margin-left: 64px !important; + margin-right: 64px !important; + } + } {% endblock %} @@ -355,6 +375,7 @@ + @@ -363,5 +384,6 @@ var expense_data = JSON.parse({{ import('json').dumps(import('json').dumps(revision.expense))|safe }}); var editing = false; makeGrid(); + makeCharts(); {% endblock %} diff --git a/sstreasury/static/sstreasury/budget.js b/sstreasury/static/sstreasury/budget.js index bd2199d..aa07095 100644 --- a/sstreasury/static/sstreasury/budget.js +++ b/sstreasury/static/sstreasury/budget.js @@ -1,6 +1,7 @@ /* Society Self-Service - Copyright © 2018-2019 Yingtong Li (RunasSudo) + Copyright © 2018-2023 Yingtong Li (RunasSudo) + Copyright © 2023 MUMUS Inc. This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by @@ -18,22 +19,27 @@ $('.ui.accordion').accordion(); +var revTotal = 0; +var revTotalIWT = 0; +var expTotal = 0; +var emergency_fund_mult = 0.05; + function recalcRevTotal(args) { - var total = 0; - var totalIWT = 0; + revTotal = 0; + revTotalIWT = 0; for (var row of args.grid.data) { - total += row['Unit price'] * row['Units']; + revTotal += row['Unit price'] * row['Units']; if (row['Unit price'] > 0 && row['IWT']) { - totalIWT += (row['Unit price'] - (row['Unit price'] - 0.8133) / 1.01884) * row['Units']; + revTotalIWT += (row['Unit price'] - (row['Unit price'] - 0.8133) / 1.01884) * row['Units']; } } $(args.grid._body).find('.totalrow').remove(); - if (totalIWT > 0) { + if (revTotalIWT > 0) { var totalrow = $(''); totalrow.append($('Less IWT fees:').prop('colspan', args.grid.fields.length - (editing ? 2 : 1))); - totalrow.append($('').text('($' + totalIWT.toFixed(2) + ')')); + totalrow.append($('').text('($' + revTotalIWT.toFixed(2) + ')')); if (editing) { totalrow.append($('')); } @@ -42,7 +48,7 @@ function recalcRevTotal(args) { var totalrow = $(''); totalrow.append($('Total:').prop('colspan', args.grid.fields.length - (editing ? 2 : 1))); - totalrow.append($('').text('$' + (total - totalIWT).toFixed(2))); + totalrow.append($('').text('$' + (revTotal - revTotalIWT).toFixed(2))); if (editing) { totalrow.append($('')); } @@ -50,21 +56,21 @@ function recalcRevTotal(args) { } function recalcExpTotal(args) { - var total = 0; + expTotal = 0; for (var row of args.grid.data) { - total += row['Unit price'] * row['Units']; + expTotal += row['Unit price'] * row['Units']; } $(args.grid._body).find('.totalrow').remove(); - var emergency_fund_mult = 0.05; + emergency_fund_mult = 0.05; if ($('#expense_no_emergency_fund').length > 0 && $('#expense_no_emergency_fund').prop('checked')) { emergency_fund_mult = 0; } var totalrow = $(''); totalrow.append($('Plus emergency fund:').prop('colspan', args.grid.fields.length - (editing ? 2 : 1))); - totalrow.append($('').text('$' + (total * emergency_fund_mult).toFixed(2))); + totalrow.append($('').text('$' + (expTotal * emergency_fund_mult).toFixed(2))); if (editing) { totalrow.append($('')); } @@ -72,7 +78,7 @@ function recalcExpTotal(args) { var totalrow = $(''); totalrow.append($('Total:').prop('colspan', args.grid.fields.length - (editing ? 2 : 1))); - totalrow.append($('').text('$' + (total * (1 + emergency_fund_mult)).toFixed(2))); + totalrow.append($('').text('$' + (expTotal * (1 + emergency_fund_mult)).toFixed(2))); if (editing) { totalrow.append($('')); } @@ -146,3 +152,56 @@ function makeGrid() { $('.jsgrid-filter-row, .jsgrid-insert-row').attr('style', 'display: none !important;'); /* Override Semantic UI */ } } + +function makeCharts() { + // Display expense, revenue charts on budget view page + + new Chart(document.getElementById('chartExpenses'), { + type: 'pie', + data: { + labels: expense_data.map(e => e['Description']), + datasets: [{ + label: 'Expenses', + data: expense_data.map(e => e['Unit price'] * e['Units']) + }] + }, + options: { + plugins: { + tooltip: { + callbacks: { + label: i => '$' + i.parsed.toFixed(2) + } + } + } + }, + }); + + new Chart(document.getElementById('chartRevExp'), { + type: 'bar', + data: { + labels: ['Revenue', 'Expenses'], + datasets: [{ + label: 'Budget', + data: [revTotal - revTotalIWT, (expTotal * (1 + emergency_fund_mult))], + backgroundColor: ['#36a2eb', '#ff6384'] + }] + }, + options: { + scales: { + y: { + beginAtZero: true + } + }, + plugins: { + legend: { + display: false + }, + tooltip: { + callbacks: { + label: i => '$' + i.parsed.y.toFixed(2) + } + } + } + }, + }); +}