Changed around line 1
+ document.addEventListener('DOMContentLoaded', function() {
+ // Mock data for demonstration
+ const inventoryData = [
+ { name: 'Green Tea', quantity: 50, expiry: '2023-12-01' },
+ { name: 'Black Tea', quantity: 30, expiry: '2023-11-15' },
+ { name: 'Herbal Tea', quantity: 20, expiry: '2023-10-20' },
+ { name: 'Oolong Tea', quantity: 10, expiry: '2023-09-25' }
+ ];
+
+ // Dashboard Stats
+ const totalStock = inventoryData.reduce((sum, item) => sum + item.quantity, 0);
+ const lowStockItems = inventoryData.filter(item => item.quantity < 25).length;
+ const expiringSoon = inventoryData.filter(item => new Date(item.expiry) < new Date('2023-12-01')).length;
+
+ document.getElementById('total-stock').textContent = totalStock;
+ document.getElementById('low-stock').textContent = lowStockItems;
+ document.getElementById('expiring-soon').textContent = expiringSoon;
+
+ // Populate Inventory Table
+ const tableBody = document.querySelector('#inventory-table tbody');
+ inventoryData.forEach(item => {
+ const row = document.createElement('tr');
+ row.innerHTML = `
+
${item.name} +
${item.quantity} +
${item.expiry} +
Edit + `;
+ tableBody.appendChild(row);
+ });
+
+ // Expiry Chart
+ const ctx = document.getElementById('expiryChart').getContext('2d');
+ new Chart(ctx, {
+ type: 'line',
+ data: {
+ labels: inventoryData.map(item => item.name),
+ datasets: [{
+ label: 'Days Until Expiry',
+ data: inventoryData.map(item => Math.floor((new Date(item.expiry) - new Date()) / (1000 * 60 * 60 * 24))),
+ backgroundColor: 'rgba(76, 175, 80, 0.2)',
+ borderColor: 'rgba(76, 175, 80, 1)',
+ borderWidth: 2
+ }]
+ },
+ options: {
+ scales: {
+ y: {
+ beginAtZero: true
+ }
+ }
+ }
+ });
+
+ // Search Functionality
+ document.getElementById('search').addEventListener('input', function() {
+ const searchTerm = this.value.toLowerCase();
+ const rows = tableBody.querySelectorAll('tr');
+ rows.forEach(row => {
+ const name = row.querySelector('td').textContent.toLowerCase();
+ row.style.display = name.includes(searchTerm) ? '' : 'none';
+ });
+ });
+ });