File manager

File manager - Edit - /home2/zetasolve/poss.shayantraders.com/pages/reports.html

Back
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="icon" type="image/png" href="../assets/favicon.png"> <title>Monthly Reports - Shayan Food</title> <link rel="stylesheet" href="../styles/index.css"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <!-- Libraries for Excel and PDF export --> <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.5.31/jspdf.plugin.autotable.min.js"></script> </head> <body> <div class="app-container"> <!-- Sidebar Navigation --> <aside class="sidebar"> <div class="logo"> <img src="../assets/logo.png" alt="Shayan Food Logo" class="logo-img"> <p>Inventory Management</p> </div> <nav class="nav-menu"> <a href="../index.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z" /> </svg> <span>Dashboard</span> </a> <a href="inventory.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M20 2H4c-1 0-2 .9-2 2v3.01c0 .72.43 1.34 1 1.69V20c0 1.1 1.1 2 2 2h14c.9 0 2-.9 2-2V8.7c.57-.35 1-.97 1-1.69V4c0-1.1-1-2-2-2zm-5 12H9v-2h6v2zm5-7H4V4h16v3z" /> </svg> <span>Inventory</span> </a> <a href="billing.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z" /> </svg> <span>Billing</span> </a> <a href="invoices.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z" /> </svg> <span>Invoices</span> </a> <a href="returns.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4h-.01l-1.1 2-2.76 5H8.53l-.13-.27L6.16 6l-.95-2-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z" /> </svg> <span>Returns</span> </a> <a href="damage_items.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" /> </svg> <span>Damage Items</span> </a> <a href="credit.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zm0 14H4v-6h16v6zm0-10H4V6h16v2z" /> </svg> <span>Credit Ledger</span> </a> <a href="expenses.html" class="nav-item"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z" /> </svg> <span>Expenses</span> </a> <a href="reports.html" class="nav-item active" id="reportsLink" style="display: none;"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z" /> </svg> <span>Reports</span> </a> <!-- Admin Link (Dynamically shown) --> <a href="admin.html" class="nav-item" id="adminLink" style="display: none;"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M12 12c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm6-1.8C18 6.57 15.35 4 12 4s-6 2.57-6 6.2c0 2.34 1.95 5.44 6 9.14 4.05-3.7 6-6.8 6-9.14zM12 2c4.2 0 8 3.22 8 8.2 0 3.32-2.67 7.25-8 11.8-5.33-4.55-8-8.48-8-11.8C4 5.22 7.8 2 12 2z" /> </svg> <span>Administrator</span> </a> <a href="#" onclick="app.logout(); return false;" class="nav-item" style="margin-top: auto; color: var(--danger); border-top: 1px solid var(--border-color);"> <svg class="icon" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M17 7l-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5zM4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4V5z" /> </svg> <span>Logout</span> </a> </nav> </aside> <!-- Main Content --> <main class="main-content"> <header class="page-header"> <h2>Monthly Sales Reports</h2> <div class="header-actions"> <div style="display: flex; gap: 1rem;"> <button class="btn btn-success" onclick="downloadExcelReport()" id="excelBtn" disabled> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" style="width: 1.25rem; height: 1.25rem; vertical-align: bottom; margin-right: 0.5rem;"> <path d="M19 12v7H5v-7H3v7c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-7h-2zm-6 .67l2.59-2.58L17 11.5l-5 5-5-5 1.41-1.41L11 12.67V3h2z" /> </svg> Download Excel </button> <button class="btn btn-danger" onclick="downloadPDFReport()" id="pdfBtn" disabled> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" style="width: 1.25rem; height: 1.25rem; vertical-align: bottom; margin-right: 0.5rem;"> <path d="M19 12v7H5v-7H3v7c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-7h-2zm-6 .67l2.59-2.58L17 11.5l-5 5-5-5 1.41-1.41L11 12.67V3h2z" /> </svg> Download PDF </button> </div> </div> </header> <!-- Month Selector --> <div class="card"> <div style="display: flex; gap: 1rem; align-items: end;"> <div class="form-group" style="margin: 0; flex: 1;"> <label>Select Month</label> <input type="month" class="form-control" id="monthSelector" onchange="loadMonthlyReport()"> </div> <button class="btn btn-primary" onclick="loadMonthlyReport()"> Load Report </button> </div> </div> <!-- Summary Cards --> <div class="dashboard-grid" id="summarySection" style="display: none;"> <div class="stat-card"> <div class="stat-card-header"> <div class="stat-content"> <h3>Total Sales</h3> <div class="stat-value" id="totalSales">PKR 0</div> </div> <div class="stat-icon" style="background: #10b981;"> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z" /> </svg> </div> </div> </div> <div class="stat-card"> <div class="stat-card-header"> <div class="stat-content"> <h3>Total Transactions</h3> <div class="stat-value" id="totalTransactions">0</div> </div> <div class="stat-icon" style="background: #2563eb;"> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z" /> </svg> </div> </div> </div> <div class="stat-card"> <div class="stat-card-header"> <div class="stat-content"> <h3>Total Discounts</h3> <div class="stat-value text-success" id="totalDiscounts">PKR 0</div> </div> <div class="stat-icon" style="background: #f59e0b;"> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M21.41 11.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.59 1.42l9 9c.36.36.86.58 1.41.58.55 0 1.05-.22 1.41-.59l7-7c.37-.36.59-.86.59-1.41 0-.55-.23-1.06-.59-1.42zM5.5 7C4.67 7 4 6.33 4 5.5S4.67 4 5.5 4 7 4.67 7 5.5 6.33 7 5.5 7z" /> </svg> </div> </div> </div> <div class="stat-card"> <div class="stat-card-header"> <div class="stat-content"> <h3>Net Sales</h3> <div class="stat-value" id="netSales">PKR 0</div> </div> <div class="stat-icon" style="background: #8b5cf6;"> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.41 16.09V20h-2.67v-1.93c-1.71-.36-3.16-1.46-3.27-3.4h1.96c.1 1.05.82 1.87 2.65 1.87 1.96 0 2.4-.98 2.4-1.59 0-.83-.44-1.61-2.67-2.14-2.48-.6-4.18-1.62-4.18-3.67 0-1.72 1.39-2.84 3.11-3.21V4h2.67v1.95c1.86.45 2.79 1.86 2.85 3.39H14.3c-.05-1.11-.64-1.87-2.22-1.87-1.5 0-2.4.68-2.4 1.64 0 .84.65 1.39 2.67 1.91s4.18 1.39 4.18 3.91c-.01 1.83-1.38 2.83-3.12 3.16z" /> </svg> </div> </div> </div> </div> <!-- Transactions Table --> <div class="card" id="transactionsSection" style="display: none;"> <h3>Transactions for <span id="reportMonthDisplay"></span></h3> <div class="table-container"> <table> <thead> <tr> <th>Date</th> <th>Customer</th> <th>Payment Type</th> <th>Items</th> <th>Subtotal</th> <th>Discount</th> <th>Final Total</th> </tr> </thead> <tbody id="transactionsTableBody"> <tr> <td colspan="7" class="loading">Select a month to view report</td> </tr> </tbody> </table> </div> </div> </main> </div> <script src="../scripts/main.js"></script> <script src="../scripts/reports.js"></script> </body> </html>

| ver. 1.4 | Github | . | PHP 8.1.34 | Generation time: 0.01 | proxy | phpinfo | Settings