{% extends "module_base.html" %}
{% load static %}

{% block title %}Reports Dashboard{% endblock %}

{% block content %}
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title mb-0">
                        <i class="fas fa-chart-bar me-2"></i>Reports Dashboard
                    </h4>
                </div>
                <div class="card-body">
                    <div class="row">
                        <!-- Inventory Reports -->
                        <div class="col-md-6 col-lg-4 mb-4">
                            <div class="card h-100">
                                <div class="card-body text-center">
                                    <i class="fas fa-boxes fa-3x text-primary mb-3"></i>
                                    <h5 class="card-title">Inventory Reports</h5>
                                    <p class="card-text text-muted">
                                        Product stock levels, movement history, and inventory valuation reports.
                                    </p>
                                    <a href="{% url 'reports:inventory_report' %}" class="btn btn-primary">
                                        <i class="fas fa-eye me-2"></i>View Reports
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Sales Reports -->
                        <div class="col-md-6 col-lg-4 mb-4">
                            <div class="card h-100">
                                <div class="card-body text-center">
                                    <i class="fas fa-shopping-cart fa-3x text-success mb-3"></i>
                                    <h5 class="card-title">Sales Reports</h5>
                                    <p class="card-text text-muted">
                                        Sales orders, revenue analysis, customer performance, and delivery reports.
                                    </p>
                                    <a href="{% url 'reports:sales_report' %}" class="btn btn-success">
                                        <i class="fas fa-eye me-2"></i>View Reports
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Purchasing Reports -->
                        <div class="col-md-6 col-lg-4 mb-4">
                            <div class="card h-100">
                                <div class="card-body text-center">
                                    <i class="fas fa-truck fa-3x text-warning mb-3"></i>
                                    <h5 class="card-title">Purchasing Reports</h5>
                                    <p class="card-text text-muted">
                                        Purchase orders, supplier performance, and procurement analysis reports.
                                    </p>
                                    <a href="{% url 'reports:purchasing_report' %}" class="btn btn-warning">
                                        <i class="fas fa-eye me-2"></i>View Reports
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Manufacturing Reports -->
                        <div class="col-md-6 col-lg-4 mb-4">
                            <div class="card h-100">
                                <div class="card-body text-center">
                                    <i class="fas fa-industry fa-3x text-info mb-3"></i>
                                    <h5 class="card-title">Manufacturing Reports</h5>
                                    <p class="card-text text-muted">
                                        Production efficiency, BOM analysis, and manufacturing order reports.
                                    </p>
                                    <a href="{% url 'reports:manufacturing_report' %}" class="btn btn-info">
                                        <i class="fas fa-eye me-2"></i>View Reports
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Financial Reports -->
                        <div class="col-md-6 col-lg-4 mb-4">
                            <div class="card h-100">
                                <div class="card-body text-center">
                                    <i class="fas fa-dollar-sign fa-3x text-secondary mb-3"></i>
                                    <h5 class="card-title">Financial Reports</h5>
                                    <p class="card-text text-muted">
                                        Profit & loss, cost analysis, and financial performance reports.
                                    </p>
                                    <a href="{% url 'reports:financial_report' %}" class="btn btn-secondary">
                                        <i class="fas fa-eye me-2"></i>View Reports
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Export Options -->
                        <div class="col-md-6 col-lg-4 mb-4">
                            <div class="card h-100">
                                <div class="card-body text-center">
                                    <i class="fas fa-download fa-3x text-dark mb-3"></i>
                                    <h5 class="card-title">Export Options</h5>
                                    <p class="card-text text-muted">
                                        Export reports to Excel, PDF, or CSV formats for external analysis.
                                    </p>
                                    <div class="btn-group-vertical">
                                        <button class="btn btn-outline-primary btn-sm">
                                            <i class="fas fa-file-excel me-1"></i>Excel
                                        </button>
                                        <button class="btn btn-outline-danger btn-sm">
                                            <i class="fas fa-file-pdf me-1"></i>PDF
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Quick Stats -->
                    <div class="row mt-4">
                        <div class="col-12">
                            <div class="card">
                                <div class="card-header">
                                    <h5 class="mb-0">Quick Statistics</h5>
                                </div>
                                <div class="card-body">
                                    <div class="row text-center">
                                        <div class="col-md-3">
                                            <div class="border-end">
                                                <h3 class="text-primary">{{ total_products|default:0 }}</h3>
                                                <p class="text-muted mb-0">Total Products</p>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="border-end">
                                                <h3 class="text-success">{{ active_orders|default:0 }}</h3>
                                                <p class="text-muted mb-0">Active Orders</p>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="border-end">
                                                <h3 class="text-warning">{{ pending_deliveries|default:0 }}</h3>
                                                <p class="text-muted mb-0">Pending Deliveries</p>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <h3 class="text-info">{{ low_stock_items|default:0 }}</h3>
                                            <p class="text-muted mb-0">Low Stock Items</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}