<?php
session_start();
include_once('../includes/config.php');
if (!isset($_SESSION['uid'])) {
    header('location:../logout.php');
    exit();
}

$currentUserId = $_SESSION['uid'];
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Purchase Reports Dashboard - UZRS Inventory</title>

    <link href="../vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
    <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
    <link href="../css/sb-admin-2.min.css" rel="stylesheet">
    <link href="css/purchase-reports-dashboard.css" rel="stylesheet">
</head>

<body id="page-top">
    <div id="wrapper">
        <?php include_once('../includes/sidebar.php'); ?>
        
        <div id="content-wrapper" class="d-flex flex-column">
            <div id="content">
                <?php include_once('../includes/topbar.php'); ?>
                
                <div class="container-fluid">
                    <!-- Page Heading -->
                    <div class="d-sm-flex align-items-center justify-content-between mb-4">
                        <h1 class="h3 mb-0 text-gray-800">
                            <i class="fas fa-chart-bar text-primary"></i> Purchase Reports Dashboard
                        </h1>
                        <a href="../dashboard.php" class="d-none d-sm-inline-block btn btn-sm btn-primary shadow-sm">
                            <i class="fas fa-home fa-sm text-white-50"></i> Back to Home
                        </a>
                    </div>

                    <!-- Quick Filters Section -->
                    <div class="row mb-4">
                        <div class="col-12">
                            <div class="card shadow-sm border-left-primary">
                                <div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
                                    <h6 class="m-0 font-weight-bold text-primary">
                                        <i class="fas fa-filter"></i> Quick Filters
                                    </h6>
                                    <button class="btn btn-sm btn-outline-primary" id="resetFilters">
                                        <i class="fas fa-redo"></i> Reset
                                    </button>
                                </div>
                                <div class="card-body">
                                    <form id="quickFiltersForm" class="row g-3">
                                        <div class="col-md-3">
                                            <label for="filterDateRange" class="form-label small font-weight-bold">Date Range</label>
                                            <select class="form-control form-control-sm" id="filterDateRange">
                                                <option value="">All Time</option>
                                                <option value="today">Today</option>
                                                <option value="yesterday">Yesterday</option>
                                                <option value="this_week">This Week</option>
                                                <option value="last_week">Last Week</option>
                                                <option value="this_month" selected>This Month</option>
                                                <option value="last_month">Last Month</option>
                                                <option value="this_year">This Year</option>
                                                <option value="custom">Custom Range</option>
                                            </select>
                                        </div>
                                        <div class="col-md-3" id="customDateRangeContainer" style="display: none;">
                                            <label for="customDateFrom" class="form-label small font-weight-bold">From Date</label>
                                            <input type="date" class="form-control form-control-sm" id="customDateFrom">
                                        </div>
                                        <div class="col-md-3" id="customDateToContainer" style="display: none;">
                                            <label for="customDateTo" class="form-label small font-weight-bold">To Date</label>
                                            <input type="date" class="form-control form-control-sm" id="customDateTo">
                                        </div>
                                        <div class="col-md-3">
                                            <label for="filterPurchaseType" class="form-label small font-weight-bold">Purchase Type</label>
                                            <select class="form-control form-control-sm" id="filterPurchaseType">
                                                <option value="">All Purchase Types</option>
                                            </select>
                                        </div>
                                        <div class="col-md-3">
                                            <label for="filterSupplier" class="form-label small font-weight-bold">Supplier</label>
                                            <select class="form-control form-control-sm" id="filterSupplier">
                                                <option value="">All Suppliers</option>
                                            </select>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Summary Statistics -->
                    <div class="row" id="summaryStats">
                        <div class="col-xl-3 col-md-6 mb-4">
                            <div class="card border-left-danger shadow h-100 py-2">
                                <div class="card-body">
                                    <div class="row no-gutters align-items-center">
                                        <div class="col mr-2">
                                            <div class="text-xs font-weight-bold text-danger text-uppercase mb-1">
                                                Total Purchase Amount
                                            </div>
                                            <div class="h5 mb-0 font-weight-bold text-gray-800" id="totalPurchaseAmount">
                                                <i class="fas fa-spinner fa-spin"></i>
                                            </div>
                                        </div>
                                        <div class="col-auto">
                                            <i class="fas fa-rupee-sign fa-2x text-gray-300"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-xl-3 col-md-6 mb-4">
                            <div class="card border-left-warning shadow h-100 py-2">
                                <div class="card-body">
                                    <div class="row no-gutters align-items-center">
                                        <div class="col mr-2">
                                            <div class="text-xs font-weight-bold text-warning text-uppercase mb-1">
                                                Total Invoices
                                            </div>
                                            <div class="h5 mb-0 font-weight-bold text-gray-800" id="totalInvoices">
                                                <i class="fas fa-spinner fa-spin"></i>
                                            </div>
                                        </div>
                                        <div class="col-auto">
                                            <i class="fas fa-file-invoice fa-2x text-gray-300"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-xl-3 col-md-6 mb-4">
                            <div class="card border-left-info shadow h-100 py-2">
                                <div class="card-body">
                                    <div class="row no-gutters align-items-center">
                                        <div class="col mr-2">
                                            <div class="text-xs font-weight-bold text-info text-uppercase mb-1">
                                                Total Items Purchased
                                            </div>
                                            <div class="h5 mb-0 font-weight-bold text-gray-800" id="totalItemsPurchased">
                                                <i class="fas fa-spinner fa-spin"></i>
                                            </div>
                                        </div>
                                        <div class="col-auto">
                                            <i class="fas fa-box fa-2x text-gray-300"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-xl-3 col-md-6 mb-4">
                            <div class="card border-left-primary shadow h-100 py-2">
                                <div class="card-body">
                                    <div class="row no-gutters align-items-center">
                                        <div class="col mr-2">
                                            <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">
                                                Average Invoice Value
                                            </div>
                                            <div class="h5 mb-0 font-weight-bold text-gray-800" id="avgInvoiceValue">
                                                <i class="fas fa-spinner fa-spin"></i>
                                            </div>
                                        </div>
                                        <div class="col-auto">
                                            <i class="fas fa-calculator fa-2x text-gray-300"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Reports Grid -->
                    <div class="row">
                        <!-- GST Purchase Report -->
                        <div class="col-xl-4 col-lg-6 mb-4">
                            <div class="card report-card shadow h-100">
                                <div class="card-body text-center">
                                    <div class="report-icon mb-3">
                                        <i class="fas fa-receipt fa-3x text-danger"></i>
                                    </div>
                                    <h5 class="card-title font-weight-bold">GST Purchase Report</h5>
                                    <p class="card-text text-muted small">
                                        Comprehensive GST-based purchase analysis with tax breakdowns
                                    </p>
                                    <a href="gst-purchase-report.php" class="btn btn-danger btn-sm">
                                        <i class="fas fa-arrow-right"></i> View Report
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Bill-wise Purchase Report -->
                        <div class="col-xl-4 col-lg-6 mb-4">
                            <div class="card report-card shadow h-100">
                                <div class="card-body text-center">
                                    <div class="report-icon mb-3">
                                        <i class="fas fa-file-invoice-dollar fa-3x text-warning"></i>
                                    </div>
                                    <h5 class="card-title font-weight-bold">Bill-wise Purchase Report</h5>
                                    <p class="card-text text-muted small">
                                        Detailed invoice-by-invoice purchase analysis
                                    </p>
                                    <a href="#" class="btn btn-warning btn-sm coming-soon">
                                        <i class="fas fa-arrow-right"></i> View Report
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Item-wise Purchase Report -->
                        <div class="col-xl-4 col-lg-6 mb-4">
                            <div class="card report-card shadow h-100">
                                <div class="card-body text-center">
                                    <div class="report-icon mb-3">
                                        <i class="fas fa-box-open fa-3x text-info"></i>
                                    </div>
                                    <h5 class="card-title font-weight-bold">Item-wise Purchase Report</h5>
                                    <p class="card-text text-muted small">
                                        Product purchase analysis with stock tracking and sold quantities
                                    </p>
                                    <a href="item-wise-purchase-report.php" class="btn btn-info btn-sm">
                                        <i class="fas fa-arrow-right"></i> View Report
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- HSN Wise Purchase Report -->
                        <div class="col-xl-4 col-lg-6 mb-4">
                            <div class="card report-card shadow h-100">
                                <div class="card-body text-center">
                                    <div class="report-icon mb-3">
                                        <i class="fas fa-tags fa-3x" style="color: #6f42c1;"></i>
                                    </div>
                                    <h5 class="card-title font-weight-bold">HSN Wise Purchase Report</h5>
                                    <p class="card-text text-muted small">
                                        GST analysis grouped by HSN/SAC codes with tax breakdowns
                                    </p>
                                    <a href="hsn-wise-purchase-report.php" class="btn btn-sm" style="background-color: #6f42c1; color: white;">
                                        <i class="fas fa-arrow-right"></i> View Report
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Supplier Accounts Report -->
                        <div class="col-xl-4 col-lg-6 mb-4">
                            <div class="card report-card shadow h-100">
                                <div class="card-body text-center">
                                    <div class="report-icon mb-3">
                                        <i class="fas fa-truck fa-3x text-success"></i>
                                    </div>
                                    <h5 class="card-title font-weight-bold">Supplier Accounts Report</h5>
                                    <p class="card-text text-muted small">
                                        Supplier-wise purchases, payments, and outstanding balances
                                    </p>
                                    <a href="#" class="btn btn-success btn-sm coming-soon">
                                        <i class="fas fa-arrow-right"></i> View Report
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Purchase Returns Report -->
                        <div class="col-xl-4 col-lg-6 mb-4">
                            <div class="card report-card shadow h-100">
                                <div class="card-body text-center">
                                    <div class="report-icon mb-3">
                                        <i class="fas fa-undo fa-3x text-secondary"></i>
                                    </div>
                                    <h5 class="card-title font-weight-bold">Purchase Returns Report</h5>
                                    <p class="card-text text-muted small">
                                        Track all purchase return transactions
                                    </p>
                                    <a href="#" class="btn btn-secondary btn-sm coming-soon">
                                        <i class="fas fa-arrow-right"></i> View Report
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Payment Analysis Report -->
                        <div class="col-xl-4 col-lg-6 mb-4">
                            <div class="card report-card shadow h-100">
                                <div class="card-body text-center">
                                    <div class="report-icon mb-3">
                                        <i class="fas fa-money-check-alt fa-3x text-dark"></i>
                                    </div>
                                    <h5 class="card-title font-weight-bold">Payment Analysis Report</h5>
                                    <p class="card-text text-muted small">
                                        Payment mode analysis and pending payments
                                    </p>
                                    <a href="#" class="btn btn-dark btn-sm" onclick="alert('Coming Soon!'); return false;">
                                        <i class="fas fa-arrow-right"></i> View Report
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Quick Stats Charts Row -->
                    <div class="row mt-4">
                        <div class="col-xl-8 col-lg-7">
                            <div class="card shadow mb-4">
                                <div class="card-header py-3">
                                    <h6 class="m-0 font-weight-bold text-primary">
                                        <i class="fas fa-chart-area"></i> Purchase Trend (Last 30 Days)
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <canvas id="purchaseTrendChart" height="100"></canvas>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-4 col-lg-5">
                            <div class="card shadow mb-4">
                                <div class="card-header py-3">
                                    <h6 class="m-0 font-weight-bold text-primary">
                                        <i class="fas fa-chart-pie"></i> Purchase by Type
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <canvas id="purchaseTypeChart"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            
            <?php include_once('../includes/footer.php'); ?>
        </div>
    </div>

    <a class="scroll-to-top rounded" href="#page-top">
        <i class="fas fa-angle-up"></i>
    </a>

    <script src="../vendor/jquery/jquery.min.js"></script>
    <script src="../vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="../vendor/jquery-easing/jquery.easing.min.js"></script>
    <script src="../js/sb-admin-2.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chart.js@3.9.1/dist/chart.min.js"></script>
    <script src="js/purchase-reports-dashboard.js"></script>
</body>
</html>
