265 lines
11 KiB
HTML
265 lines
11 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Initial Capex Planner · CalMiner{% endblock %}
|
|
|
|
{% block content %}
|
|
<nav class="breadcrumb">
|
|
<a href="{{ url_for('projects.project_list_page') }}">Projects</a>
|
|
{% if project %}
|
|
<a href="{{ url_for('projects.view_project', project_id=project.id) }}">{{ project.name }}</a>
|
|
{% endif %}
|
|
{% if scenario %}
|
|
<a href="{{ url_for('scenarios.view_scenario', scenario_id=scenario.id) }}">{{ scenario.name }}</a>
|
|
{% endif %}
|
|
<span aria-current="page">Initial Capex Planner</span>
|
|
</nav>
|
|
|
|
<header class="page-header">
|
|
<div>
|
|
<h1>Initial Capex Planner</h1>
|
|
<p class="text-muted">Capture upfront capital requirements and review categorized totals.</p>
|
|
</div>
|
|
<div class="header-actions">
|
|
{% if cancel_url %}
|
|
<a class="btn" href="{{ cancel_url }}">Cancel</a>
|
|
{% endif %}
|
|
<button class="btn primary" type="submit" form="capex-form">Save & Calculate</button>
|
|
</div>
|
|
</header>
|
|
|
|
{% if errors %}
|
|
<div class="alert alert-error">
|
|
<h2 class="sr-only">Submission errors</h2>
|
|
<ul>
|
|
{% for message in errors %}
|
|
<li>{{ message }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if notices %}
|
|
<div class="alert alert-info">
|
|
<ul>
|
|
{% for message in notices %}
|
|
<li>{{ message }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<form id="capex-form" class="form scenario-form" method="post" action="{{ form_action }}">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}" />
|
|
<input type="hidden" name="options[persist]" value="{{ '1' if options is defined and options and options.persist else '' }}" />
|
|
|
|
<div class="layout-two-column stackable">
|
|
<section class="panel">
|
|
<header class="section-header">
|
|
<h2>Capex Components</h2>
|
|
<p class="section-subtitle">Break down initial capital items with category, amount, and timing.</p>
|
|
</header>
|
|
|
|
<div class="table-actions">
|
|
<button class="btn secondary" type="button" data-action="add-component">Add Component</button>
|
|
</div>
|
|
|
|
{% if component_errors is defined and component_errors %}
|
|
<div class="alert alert-error slim" role="alert" aria-live="polite">
|
|
<h3 class="sr-only">Component issues</h3>
|
|
<ul>
|
|
{% for message in component_errors %}
|
|
<li>{{ message }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if component_notices is defined and component_notices %}
|
|
<div class="alert alert-info slim" role="status" aria-live="polite">
|
|
<ul>
|
|
{% for message in component_notices %}
|
|
<li>{{ message }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="table-responsive horizontal-scroll">
|
|
<table class="input-table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Category</th>
|
|
<th scope="col">Component</th>
|
|
<th scope="col">Amount</th>
|
|
<th scope="col">Currency</th>
|
|
<th scope="col">Spend Year</th>
|
|
<th scope="col">Notes</th>
|
|
<th class="sr-only" scope="col">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% set component_entries = (components if components is defined and components else [{}]) %}
|
|
{% for component in component_entries %}
|
|
<tr data-row-index="{{ loop.index0 }}">
|
|
<td>
|
|
<input type="hidden" name="components[{{ loop.index0 }}][id]" value="{{ component.id or '' }}" />
|
|
<select name="components[{{ loop.index0 }}][category]">
|
|
{% for option in category_options %}
|
|
<option value="{{ option.value }}" {% if component.category == option.value %}selected{% endif %}>{{ option.label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</td>
|
|
<td>
|
|
<input type="text" name="components[{{ loop.index0 }}][name]" value="{{ component.name or '' }}" />
|
|
</td>
|
|
<td>
|
|
<input type="number" min="0" step="0.01" name="components[{{ loop.index0 }}][amount]" value="{{ component.amount or '' }}" />
|
|
</td>
|
|
<td>
|
|
<input type="text" maxlength="3" name="components[{{ loop.index0 }}][currency]" value="{{ component.currency or currency_code or (scenario.currency if scenario else '') or (project.currency if project else '') }}" />
|
|
</td>
|
|
<td>
|
|
<input type="number" min="0" step="1" name="components[{{ loop.index0 }}][spend_year]" value="{{ component.spend_year or '' }}" />
|
|
</td>
|
|
<td>
|
|
<input type="text" name="components[{{ loop.index0 }}][notes]" value="{{ component.notes or '' }}" />
|
|
</td>
|
|
<td class="row-actions">
|
|
<button class="btn link" type="button" data-action="remove-component">Remove</button>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<p class="muted">Add rows for each capital item. Amounts should reflect pre-contingency values.</p>
|
|
</section>
|
|
|
|
<aside class="panel">
|
|
<header class="section-header">
|
|
<h2>Global Parameters</h2>
|
|
<p class="section-subtitle">Configure defaults applied across components.</p>
|
|
</header>
|
|
|
|
<div class="form-grid">
|
|
<div class="form-group">
|
|
<label for="capex_currency_code">Default Currency</label>
|
|
<input id="capex_currency_code" name="parameters[currency_code]" type="text" maxlength="3" value="{{ (parameters.currency_code if parameters is defined and parameters else None) or (currency_code if currency_code is defined else None) or (scenario.currency if scenario else None) or (project.currency if project else '') }}" />
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="contingency_pct">Contingency (%)</label>
|
|
<input id="contingency_pct" name="parameters[contingency_pct]" type="number" min="0" max="100" step="0.01" value="{{ (parameters.contingency_pct if parameters is defined and parameters else '') }}" />
|
|
<p class="field-help">Applied across component totals.</p>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="discount_rate">Discount Rate (%)</label>
|
|
<input id="discount_rate" name="parameters[discount_rate_pct]" type="number" min="0" max="100" step="0.01" value="{{ (parameters.discount_rate_pct if parameters is defined and parameters else None) or (scenario.discount_rate if scenario else '') }}" />
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="evaluation_horizon_years">Evaluation Horizon (years)</label>
|
|
<input id="evaluation_horizon_years" name="parameters[evaluation_horizon_years]" type="number" min="1" step="1" value="{{ (parameters.evaluation_horizon_years if parameters is defined and parameters else None) or (default_horizon if default_horizon is defined else '') }}" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel">
|
|
<h3>Assumptions</h3>
|
|
<dl class="definition-list">
|
|
<div>
|
|
<dt>Categories Configured</dt>
|
|
<dd>{{ category_options | length }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt>Last Updated</dt>
|
|
<dd>{{ last_updated_at or '—' }}</dd>
|
|
</div>
|
|
</dl>
|
|
<p class="muted">Defaults reflect scenario preferences. Adjust before calculating.</p>
|
|
</div>
|
|
</aside>
|
|
</div>
|
|
</form>
|
|
|
|
<section class="report-section">
|
|
<header class="section-header">
|
|
<h2>Capex Summary</h2>
|
|
<p class="section-subtitle">Calculated totals and categorized breakdowns.</p>
|
|
</header>
|
|
|
|
{% if result %}
|
|
<div class="report-grid">
|
|
<article class="report-card">
|
|
<h3>Total Initial Capex</h3>
|
|
<p class="metric">
|
|
<strong>{{ result.totals.overall | currency_display(result.currency) }}</strong>
|
|
</p>
|
|
</article>
|
|
<article class="report-card">
|
|
<h3>Contingency Applied</h3>
|
|
<p class="metric">
|
|
<strong>{{ result.totals.contingency_amount | currency_display(result.currency) }}</strong>
|
|
</p>
|
|
</article>
|
|
<article class="report-card">
|
|
<h3>Grand Total</h3>
|
|
<p class="metric">
|
|
<strong>{{ result.totals.with_contingency | currency_display(result.currency) }}</strong>
|
|
</p>
|
|
</article>
|
|
</div>
|
|
|
|
{% if result.totals.by_category %}
|
|
<table class="metrics-table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Category</th>
|
|
<th scope="col">Amount</th>
|
|
<th scope="col">Share</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in result.totals.by_category %}
|
|
<tr>
|
|
<th scope="row">{{ row.category }}</th>
|
|
<td>{{ row.amount | currency_display(result.currency) }}</td>
|
|
<td>{{ row.share | percentage_display }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
{% endif %}
|
|
|
|
{% if result.timeline %}
|
|
<table class="metrics-table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Year</th>
|
|
<th scope="col">Spend</th>
|
|
<th scope="col">Cumulative</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for entry in result.timeline %}
|
|
<tr>
|
|
<th scope="row">{{ entry.year }}</th>
|
|
<td>{{ entry.spend | currency_display(result.currency) }}</td>
|
|
<td>{{ entry.cumulative | currency_display(result.currency) }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
{% endif %}
|
|
{% else %}
|
|
<p class="muted">Provide component details and calculate to see initial capex totals.</p>
|
|
{% endif %}
|
|
</section>
|
|
|
|
<section class="report-section">
|
|
<header class="section-header">
|
|
<h2>Visualizations</h2>
|
|
<p class="section-subtitle">Charts render after calculations complete.</p>
|
|
</header>
|
|
<div id="capex-category-chart" class="chart-container"></div>
|
|
<div id="capex-timeline-chart" class="chart-container"></div>
|
|
</section>
|
|
{% endblock %}
|