Files
calminer/templates/scenarios/detail.html
zwitschi fb6816de00 Add form styles and update button classes for consistency
- Introduced a new CSS file for form styles (forms.css) to enhance form layout and design.
- Removed deprecated button styles from imports.css and updated button classes across templates to use the new utility classes.
- Updated various templates to reflect the new button styles, ensuring a consistent look and feel throughout the application.
- Refactored form-related styles in main.css and removed redundant styles from projects.css and scenarios.css.
- Ensured responsive design adjustments for form actions in smaller viewports.
2025-11-13 21:18:32 +01:00

172 lines
6.5 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{% extends "base.html" %}
{% block title %}{{ scenario.name }} · Scenario · CalMiner{% endblock %}
{% block head_extra %}
<link rel="stylesheet" href="/static/css/scenarios.css" />
{% endblock %}
{% block content %}
<nav class="breadcrumb">
<a href="{{ url_for('projects.project_list_page') }}">Projects</a>
<a href="{{ url_for('projects.view_project', project_id=scenario.project_id) }}">{{ project.name }}</a>
<span aria-current="page">{{ scenario.name }}</span>
</nav>
<header class="page-header">
{% set scenario_list_href = url_for('scenarios.project_scenario_list', project_id=project.id) %}
{% if project and scenario %}
{% set profitability_href = url_for('calculations.profitability_form', project_id=project.id, scenario_id=scenario.id) %}
{% set opex_href = url_for('calculations.scenario_opex_form', project_id=project.id, scenario_id=scenario.id) %}
{% set capex_href = url_for('calculations.scenario_capex_form', project_id=project.id, scenario_id=scenario.id) %}
{% else %}
{% set profitability_href = url_for('calculations.profitability_form') %}
{% set opex_href = url_for('calculations.opex_form_legacy') %}
{% set capex_href = url_for('calculations.capex_form_legacy') %}
{% endif %}
<div>
<h1>{{ scenario.name }}</h1>
<p class="text-muted">
Part of <a href="{{ url_for('projects.view_project', project_id=project.id) }}">{{ project.name }}</a>
</p>
</div>
<div class="header-actions">
<a class="btn btn--secondary" href="{{ scenario_list_href }}">Scenario Portfolio</a>
<a class="btn btn--secondary" href="{{ profitability_href }}">Profitability Calculator</a>
<a class="btn btn--secondary" href="{{ opex_href }}">Opex Planner</a>
<a class="btn btn--secondary" href="{{ capex_href }}">Capex Planner</a>
<a class="btn btn--primary" href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Edit Scenario</a>
</div>
</header>
<section class="scenario-metrics">
<article class="metric-card">
<h2>Status</h2>
<p class="metric-value status-pill status-pill--{{ scenario.status.value }}">{{ scenario.status.value.title() }}</p>
<span class="metric-caption">Lifecycle state</span>
</article>
<article class="metric-card">
<h2>Financial Inputs</h2>
<p class="metric-value">{{ scenario_metrics.financial_count }}</p>
<span class="metric-caption">Line items captured</span>
</article>
<article class="metric-card">
<h2>Simulation Parameters</h2>
<p class="metric-value">{{ scenario_metrics.parameter_count }}</p>
<span class="metric-caption">Inputs driving forecasts</span>
</article>
<article class="metric-card">
<h2>Currency</h2>
<p class="metric-value">{{ scenario_metrics.currency or '—' }}</p>
<span class="metric-caption">Financial reporting</span>
</article>
</section>
<div class="scenario-layout">
<div class="scenario-column">
<section class="card">
<h2>Scenario Overview</h2>
<dl class="definition-list">
<div>
<dt>Description</dt>
<dd>{{ scenario.description or 'No description provided.' }}</dd>
</div>
<div>
<dt>Timeline</dt>
<dd>{{ scenario.start_date or '—' }} → {{ scenario.end_date or '—' }}</dd>
</div>
<div>
<dt>Discount Rate</dt>
<dd>{{ scenario.discount_rate or '—' }}</dd>
</div>
<div>
<dt>Primary Resource</dt>
<dd>{{ scenario_metrics.primary_resource or '—' }}</dd>
</div>
<div>
<dt>Last Updated</dt>
<dd>{{ scenario.updated_at.strftime('%Y-%m-%d %H:%M') if scenario.updated_at else '—' }}</dd>
</div>
</dl>
</section>
<section class="card quick-actions-card">
<h2>Next Steps</h2>
<ul class="quick-link-list">
<li>
<a href="{{ profitability_href }}">Run profitability analysis</a>
<p>Uses this scenarios assumptions as defaults.</p>
</li>
<li>
<a href="{{ scenario_list_href }}">Browse all project scenarios</a>
<p>Compare assumption sets and launch calculators in context.</p>
</li>
<li>
<a href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Update scenario assumptions</a>
<p>Adjust dates, status, or drivers before recalculations.</p>
</li>
</ul>
</section>
</div>
<section class="card">
<h2>Financial Inputs</h2>
{% if financial_inputs %}
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>Name</th>
<th>Category</th>
<th>Amount</th>
<th>Currency</th>
</tr>
</thead>
<tbody>
{% for item in financial_inputs %}
<tr>
<td>{{ item.name }}</td>
<td>{{ item.category.value.title() }}</td>
<td>{{ '{:,.2f}'.format(item.amount) }}</td>
<td>{{ item.currency or '—' }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<p class="empty-state">No financial inputs recorded yet.</p>
{% endif %}
</section>
<section class="card">
<h2>Simulation Parameters</h2>
{% if simulation_parameters %}
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>Name</th>
<th>Distribution</th>
<th>Variable</th>
<th>Resource</th>
</tr>
</thead>
<tbody>
{% for param in simulation_parameters %}
<tr>
<td>{{ param.name }}</td>
<td>{{ param.distribution.value.title() }}</td>
<td>{{ param.variable.value.replace('_', ' ') | title if param.variable else '—' }}</td>
<td>{{ param.resource_type.value.replace('_', ' ') | title if param.resource_type else '—' }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<p class="empty-state">No simulation parameters defined.</p>
{% endif %}
</section>
</div>
{% endblock %}