
- Add Jinja2 templates and static files for web UI - Create frontend routes for invoice management - Implement home page with recent invoices list - Add invoice creation form with dynamic items - Create invoice search functionality - Implement invoice details view with status update - Add JavaScript for form validation and dynamic UI - Update main.py to serve static files - Update documentation
96 lines
2.7 KiB
HTML
96 lines
2.7 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Home - Invoice Generation Service{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="card">
|
|
<h2>Welcome to the Invoice Generation Service</h2>
|
|
<p>This application allows you to create, manage, and track invoices. Use the navigation menu above to access different features.</p>
|
|
|
|
<div class="features">
|
|
<div class="feature">
|
|
<h3>Create Invoices</h3>
|
|
<p>Generate new invoices with customer information, due dates, and line items.</p>
|
|
<a href="{{ url_for('create_invoice_page') }}" class="btn">Create Invoice</a>
|
|
</div>
|
|
|
|
<div class="feature">
|
|
<h3>Find Invoices</h3>
|
|
<p>Look up existing invoices by their unique invoice number.</p>
|
|
<a href="{{ url_for('search_invoice_page') }}" class="btn">Find Invoice</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% if invoices %}
|
|
<div class="card">
|
|
<h2>Recent Invoices</h2>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Invoice Number</th>
|
|
<th>Customer</th>
|
|
<th>Date Created</th>
|
|
<th>Due Date</th>
|
|
<th>Total Amount</th>
|
|
<th>Status</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for invoice in invoices %}
|
|
<tr>
|
|
<td>{{ invoice.invoice_number }}</td>
|
|
<td>{{ invoice.customer_name }}</td>
|
|
<td>{{ invoice.date_created.strftime('%Y-%m-%d') }}</td>
|
|
<td>{{ invoice.due_date.strftime('%Y-%m-%d') }}</td>
|
|
<td>${{ "%.2f"|format(invoice.total_amount) }}</td>
|
|
<td>
|
|
<span class="invoice-status status-{{ invoice.status.lower() }}">
|
|
{{ invoice.status }}
|
|
</span>
|
|
</td>
|
|
<td>
|
|
<a href="{{ url_for('invoice_details', invoice_id=invoice.id) }}" class="btn">View</a>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block extra_css %}
|
|
<style>
|
|
.features {
|
|
display: flex;
|
|
gap: 2rem;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
.feature {
|
|
flex: 1;
|
|
padding: 1.5rem;
|
|
background-color: #f9f9f9;
|
|
border-radius: 8px;
|
|
text-align: center;
|
|
}
|
|
|
|
.feature h3 {
|
|
margin-bottom: 0.5rem;
|
|
color: #2c3e50;
|
|
}
|
|
|
|
.feature p {
|
|
margin-bottom: 1.5rem;
|
|
color: #7f8c8d;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.features {
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
</style>
|
|
{% endblock %} |