764 lines
33 KiB
HTML
764 lines
33 KiB
HTML
|
|
{% load static %}
|
|
|
|
|
|
|
|
{% block css %}
|
|
<style>
|
|
.alerts-header {
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
color: white;
|
|
border-radius: 10px;
|
|
padding: 30px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.alert-card {
|
|
background: white;
|
|
border-radius: 8px;
|
|
padding: 20px;
|
|
margin: 15px 0;
|
|
border-left: 4px solid #007bff;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
transition: all 0.3s ease;
|
|
}
|
|
.alert-card:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 4px 8px rgba(0,0,0,0.15);
|
|
}
|
|
.alert-critical { border-left-color: #dc3545; }
|
|
.alert-low { border-left-color: #ffc107; }
|
|
.alert-expired { border-left-color: #6f42c1; }
|
|
.alert-expiring { border-left-color: #fd7e14; }
|
|
.alert-overstock { border-left-color: #20c997; }
|
|
.alert-icon {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 1.2rem;
|
|
margin-right: 15px;
|
|
}
|
|
.icon-critical { background: #f8d7da; color: #dc3545; }
|
|
.icon-low { background: #fff3cd; color: #ffc107; }
|
|
.icon-expired { background: #e2e3f3; color: #6f42c1; }
|
|
.icon-expiring { background: #ffe8d4; color: #fd7e14; }
|
|
.icon-overstock { background: #d1ecf1; color: #20c997; }
|
|
.alert-priority {
|
|
padding: 2px 8px;
|
|
border-radius: 12px;
|
|
font-size: 0.8rem;
|
|
font-weight: bold;
|
|
}
|
|
.priority-high { background: #f8d7da; color: #dc3545; }
|
|
.priority-medium { background: #fff3cd; color: #ffc107; }
|
|
.priority-low { background: #d4edda; color: #28a745; }
|
|
.stock-level {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 10px 0;
|
|
}
|
|
.stock-bar {
|
|
flex: 1;
|
|
height: 8px;
|
|
background: #e9ecef;
|
|
border-radius: 4px;
|
|
margin: 0 10px;
|
|
overflow: hidden;
|
|
}
|
|
.stock-fill {
|
|
height: 100%;
|
|
transition: width 0.3s ease;
|
|
}
|
|
.stock-critical { background: #dc3545; }
|
|
.stock-low { background: #ffc107; }
|
|
.stock-normal { background: #28a745; }
|
|
.stock-high { background: #20c997; }
|
|
.alert-actions {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-top: 15px;
|
|
}
|
|
.stats-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
|
gap: 15px;
|
|
margin: 20px 0;
|
|
}
|
|
.stat-card {
|
|
background: white;
|
|
border-radius: 8px;
|
|
padding: 20px;
|
|
text-align: center;
|
|
border: 1px solid #dee2e6;
|
|
}
|
|
.stat-value {
|
|
font-size: 2rem;
|
|
font-weight: bold;
|
|
color: #007bff;
|
|
}
|
|
.stat-label {
|
|
color: #6c757d;
|
|
font-size: 0.9rem;
|
|
margin-top: 5px;
|
|
}
|
|
.filter-panel {
|
|
background: white;
|
|
border-radius: 8px;
|
|
padding: 20px;
|
|
margin-bottom: 20px;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
}
|
|
.alert-summary {
|
|
background: #f8f9fa;
|
|
border-radius: 6px;
|
|
padding: 15px;
|
|
margin: 15px 0;
|
|
}
|
|
.summary-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 8px 0;
|
|
border-bottom: 1px solid #dee2e6;
|
|
}
|
|
.summary-item:last-child {
|
|
border-bottom: none;
|
|
}
|
|
.expiry-date {
|
|
font-weight: bold;
|
|
}
|
|
.expiry-critical { color: #dc3545; }
|
|
.expiry-warning { color: #ffc107; }
|
|
.expiry-normal { color: #28a745; }
|
|
.location-badge {
|
|
background: #e9ecef;
|
|
color: #495057;
|
|
padding: 2px 8px;
|
|
border-radius: 12px;
|
|
font-size: 0.8rem;
|
|
}
|
|
.supplier-info {
|
|
color: #6c757d;
|
|
font-size: 0.9rem;
|
|
margin-top: 5px;
|
|
}
|
|
.reorder-suggestion {
|
|
background: #d1ecf1;
|
|
border: 1px solid #bee5eb;
|
|
border-radius: 6px;
|
|
padding: 10px;
|
|
margin: 10px 0;
|
|
font-size: 0.9rem;
|
|
}
|
|
.bulk-actions {
|
|
background: white;
|
|
border-radius: 8px;
|
|
padding: 15px;
|
|
margin: 15px 0;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="content">
|
|
<div class="container-fluid">
|
|
<!-- Page Header -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="page-header">
|
|
<div class="page-title">
|
|
<h4><i class="fas fa-exclamation-triangle"></i> Stock Alerts</h4>
|
|
<h6>Monitor inventory levels and manage stock alerts</h6>
|
|
</div>
|
|
<div class="page-btn">
|
|
<button class="btn btn-primary me-2" id="refreshAlerts">
|
|
<i class="fas fa-sync-alt"></i> Refresh
|
|
</button>
|
|
<button class="btn btn-success me-2" id="generateReport">
|
|
<i class="fas fa-file-alt"></i> Generate Report
|
|
</button>
|
|
<button class="btn btn-info" data-bs-toggle="modal" data-bs-target="#alertSettingsModal">
|
|
<i class="fas fa-cog"></i> Settings
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Alerts Header -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="alerts-header">
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<h5><i class="fas fa-warehouse"></i> Inventory Alert Dashboard</h5>
|
|
<p>Real-time monitoring of stock levels, expiration dates, and inventory alerts</p>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="stats-grid">
|
|
<div class="stat-card">
|
|
<div class="stat-value">23</div>
|
|
<div class="stat-label">Active Alerts</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-value">7</div>
|
|
<div class="stat-label">Critical Items</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Filter Panel -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="filter-panel">
|
|
<div class="row">
|
|
<div class="col-md-2">
|
|
<label>Alert Type</label>
|
|
<select class="form-control" id="alertTypeFilter">
|
|
<option value="">All Types</option>
|
|
<option value="critical">Critical Stock</option>
|
|
<option value="low">Low Stock</option>
|
|
<option value="expired">Expired</option>
|
|
<option value="expiring">Expiring Soon</option>
|
|
<option value="overstock">Overstock</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label>Priority</label>
|
|
<select class="form-control" id="priorityFilter">
|
|
<option value="">All Priorities</option>
|
|
<option value="high">High</option>
|
|
<option value="medium">Medium</option>
|
|
<option value="low">Low</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label>Location</label>
|
|
<select class="form-control" id="locationFilter">
|
|
<option value="">All Locations</option>
|
|
<option value="pharmacy">Pharmacy</option>
|
|
<option value="emergency">Emergency</option>
|
|
<option value="icu">ICU</option>
|
|
<option value="warehouse">Main Warehouse</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label>Category</label>
|
|
<select class="form-control" id="categoryFilter">
|
|
<option value="">All Categories</option>
|
|
<option value="medications">Medications</option>
|
|
<option value="supplies">Medical Supplies</option>
|
|
<option value="equipment">Equipment</option>
|
|
<option value="consumables">Consumables</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label>Search</label>
|
|
<input type="text" class="form-control" id="searchFilter" placeholder="Search items...">
|
|
</div>
|
|
<div class="col-md-1">
|
|
<label> </label>
|
|
<button class="btn btn-primary form-control" id="applyFilters">
|
|
<i class="fas fa-filter"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Stock Alerts -->
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5><i class="fas fa-bell"></i> Active Alerts</h5>
|
|
<div class="card-tools">
|
|
<span class="badge bg-danger">7 Critical</span>
|
|
<span class="badge bg-warning">12 Low Stock</span>
|
|
<span class="badge bg-info">4 Expiring</span>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- Critical Stock Alert -->
|
|
<div class="alert-card alert-critical">
|
|
<div class="row">
|
|
<div class="col-md-1">
|
|
<div class="alert-icon icon-critical">
|
|
<i class="fas fa-exclamation-triangle"></i>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-7">
|
|
<h6>Morphine 10mg/ml Injectable <span class="alert-priority priority-high">HIGH</span></h6>
|
|
<p><strong>SKU:</strong> MED-001234 | <strong>Category:</strong> Controlled Substances</p>
|
|
<div class="stock-level">
|
|
<span>Current: 2 units</span>
|
|
<div class="stock-bar">
|
|
<div class="stock-fill stock-critical" style="width: 5%"></div>
|
|
</div>
|
|
<span>Min: 50 units</span>
|
|
</div>
|
|
<div class="supplier-info">
|
|
<i class="fas fa-building"></i> Supplier: PharmaCorp | Last Order: 2 weeks ago
|
|
</div>
|
|
<span class="location-badge">ICU Pharmacy</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="reorder-suggestion">
|
|
<strong>Suggested Reorder:</strong> 200 units<br>
|
|
<small>Based on 30-day usage pattern</small>
|
|
</div>
|
|
<div class="alert-actions">
|
|
<button class="btn btn-sm btn-danger">
|
|
<i class="fas fa-shopping-cart"></i> Reorder Now
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-secondary">
|
|
<i class="fas fa-eye"></i> Details
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Low Stock Alert -->
|
|
<div class="alert-card alert-low">
|
|
<div class="row">
|
|
<div class="col-md-1">
|
|
<div class="alert-icon icon-low">
|
|
<i class="fas fa-exclamation"></i>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-7">
|
|
<h6>Surgical Gloves (Size M) <span class="alert-priority priority-medium">MEDIUM</span></h6>
|
|
<p><strong>SKU:</strong> SUP-005678 | <strong>Category:</strong> Medical Supplies</p>
|
|
<div class="stock-level">
|
|
<span>Current: 45 boxes</span>
|
|
<div class="stock-bar">
|
|
<div class="stock-fill stock-low" style="width: 25%"></div>
|
|
</div>
|
|
<span>Min: 100 boxes</span>
|
|
</div>
|
|
<div class="supplier-info">
|
|
<i class="fas fa-building"></i> Supplier: MedSupply Inc | Last Order: 1 week ago
|
|
</div>
|
|
<span class="location-badge">Main Warehouse</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="reorder-suggestion">
|
|
<strong>Suggested Reorder:</strong> 500 boxes<br>
|
|
<small>Bulk discount available</small>
|
|
</div>
|
|
<div class="alert-actions">
|
|
<button class="btn btn-sm btn-warning">
|
|
<i class="fas fa-shopping-cart"></i> Reorder
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-secondary">
|
|
<i class="fas fa-eye"></i> Details
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Expiring Soon Alert -->
|
|
<div class="alert-card alert-expiring">
|
|
<div class="row">
|
|
<div class="col-md-1">
|
|
<div class="alert-icon icon-expiring">
|
|
<i class="fas fa-clock"></i>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-7">
|
|
<h6>Amoxicillin 500mg Capsules <span class="alert-priority priority-medium">MEDIUM</span></h6>
|
|
<p><strong>SKU:</strong> MED-002345 | <strong>Category:</strong> Antibiotics</p>
|
|
<p><strong>Expiry Date:</strong> <span class="expiry-date expiry-warning">2024-02-15</span> (25 days remaining)</p>
|
|
<p><strong>Quantity:</strong> 150 bottles (3,000 capsules)</p>
|
|
<div class="supplier-info">
|
|
<i class="fas fa-building"></i> Supplier: Generic Pharma | Batch: GP-2023-456
|
|
</div>
|
|
<span class="location-badge">Pharmacy</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="reorder-suggestion">
|
|
<strong>Action Required:</strong><br>
|
|
• Use before expiry<br>
|
|
• Consider donation<br>
|
|
• Return to supplier
|
|
</div>
|
|
<div class="alert-actions">
|
|
<button class="btn btn-sm btn-info">
|
|
<i class="fas fa-hand-holding-medical"></i> Prioritize Use
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-secondary">
|
|
<i class="fas fa-eye"></i> Details
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Expired Alert -->
|
|
<div class="alert-card alert-expired">
|
|
<div class="row">
|
|
<div class="col-md-1">
|
|
<div class="alert-icon icon-expired">
|
|
<i class="fas fa-ban"></i>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-7">
|
|
<h6>Insulin Rapid-Acting <span class="alert-priority priority-high">HIGH</span></h6>
|
|
<p><strong>SKU:</strong> MED-003456 | <strong>Category:</strong> Diabetes Medications</p>
|
|
<p><strong>Expiry Date:</strong> <span class="expiry-date expiry-critical">2024-01-10</span> (EXPIRED 10 days ago)</p>
|
|
<p><strong>Quantity:</strong> 25 vials</p>
|
|
<div class="supplier-info">
|
|
<i class="fas fa-building"></i> Supplier: Diabetes Care Ltd | Batch: DC-2023-789
|
|
</div>
|
|
<span class="location-badge">Refrigerated Storage</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="reorder-suggestion">
|
|
<strong>Immediate Action:</strong><br>
|
|
• Remove from inventory<br>
|
|
• Dispose safely<br>
|
|
• Document disposal
|
|
</div>
|
|
<div class="alert-actions">
|
|
<button class="btn btn-sm btn-danger">
|
|
<i class="fas fa-trash"></i> Mark for Disposal
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-secondary">
|
|
<i class="fas fa-eye"></i> Details
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Overstock Alert -->
|
|
<div class="alert-card alert-overstock">
|
|
<div class="row">
|
|
<div class="col-md-1">
|
|
<div class="alert-icon icon-overstock">
|
|
<i class="fas fa-arrow-up"></i>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-7">
|
|
<h6>Bandages (Assorted Sizes) <span class="alert-priority priority-low">LOW</span></h6>
|
|
<p><strong>SKU:</strong> SUP-007890 | <strong>Category:</strong> Wound Care</p>
|
|
<div class="stock-level">
|
|
<span>Current: 2,500 units</span>
|
|
<div class="stock-bar">
|
|
<div class="stock-fill stock-high" style="width: 95%"></div>
|
|
</div>
|
|
<span>Max: 1,000 units</span>
|
|
</div>
|
|
<div class="supplier-info">
|
|
<i class="fas fa-building"></i> Supplier: WoundCare Solutions | Last Order: 3 days ago
|
|
</div>
|
|
<span class="location-badge">Main Warehouse</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="reorder-suggestion">
|
|
<strong>Overstock Notice:</strong><br>
|
|
• Reduce future orders<br>
|
|
• Check storage capacity<br>
|
|
• Consider redistribution
|
|
</div>
|
|
<div class="alert-actions">
|
|
<button class="btn btn-sm btn-success">
|
|
<i class="fas fa-exchange-alt"></i> Redistribute
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-secondary">
|
|
<i class="fas fa-eye"></i> Details
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<!-- Alert Summary -->
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5><i class="fas fa-chart-pie"></i> Alert Summary</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="alert-summary">
|
|
<div class="summary-item">
|
|
<span><i class="fas fa-exclamation-triangle text-danger"></i> Critical Stock</span>
|
|
<span class="badge bg-danger">7</span>
|
|
</div>
|
|
<div class="summary-item">
|
|
<span><i class="fas fa-exclamation text-warning"></i> Low Stock</span>
|
|
<span class="badge bg-warning">12</span>
|
|
</div>
|
|
<div class="summary-item">
|
|
<span><i class="fas fa-clock text-info"></i> Expiring Soon</span>
|
|
<span class="badge bg-info">4</span>
|
|
</div>
|
|
<div class="summary-item">
|
|
<span><i class="fas fa-ban text-secondary"></i> Expired Items</span>
|
|
<span class="badge bg-secondary">3</span>
|
|
</div>
|
|
<div class="summary-item">
|
|
<span><i class="fas fa-arrow-up text-success"></i> Overstock</span>
|
|
<span class="badge bg-success">2</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions -->
|
|
<div class="card mt-3">
|
|
<div class="card-header">
|
|
<h5><i class="fas fa-bolt"></i> Quick Actions</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-grid gap-2">
|
|
<button class="btn btn-outline-danger btn-sm">
|
|
<i class="fas fa-shopping-cart"></i> Reorder Critical Items
|
|
</button>
|
|
<button class="btn btn-outline-warning btn-sm">
|
|
<i class="fas fa-list"></i> Generate Purchase Orders
|
|
</button>
|
|
<button class="btn btn-outline-info btn-sm">
|
|
<i class="fas fa-clock"></i> Review Expiring Items
|
|
</button>
|
|
<button class="btn btn-outline-secondary btn-sm">
|
|
<i class="fas fa-trash"></i> Process Expired Items
|
|
</button>
|
|
<button class="btn btn-outline-success btn-sm">
|
|
<i class="fas fa-cog"></i> Update Alert Thresholds
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Recent Activity -->
|
|
<div class="card mt-3">
|
|
<div class="card-header">
|
|
<h5><i class="fas fa-history"></i> Recent Activity</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="alert-summary">
|
|
<div class="summary-item">
|
|
<small>Morphine stock critical</small>
|
|
<small class="text-muted">2 min ago</small>
|
|
</div>
|
|
<div class="summary-item">
|
|
<small>Purchase order created</small>
|
|
<small class="text-muted">15 min ago</small>
|
|
</div>
|
|
<div class="summary-item">
|
|
<small>Expired items removed</small>
|
|
<small class="text-muted">1 hour ago</small>
|
|
</div>
|
|
<div class="summary-item">
|
|
<small>Alert threshold updated</small>
|
|
<small class="text-muted">2 hours ago</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bulk Actions -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="bulk-actions">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<h6><i class="fas fa-tasks"></i> Bulk Actions</h6>
|
|
<p>Select multiple alerts to perform batch operations</p>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="d-flex gap-2 justify-content-end">
|
|
<button class="btn btn-sm btn-outline-primary">
|
|
<i class="fas fa-check-square"></i> Select All Critical
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-warning">
|
|
<i class="fas fa-shopping-cart"></i> Bulk Reorder
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-info">
|
|
<i class="fas fa-file-export"></i> Export Selected
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Alert Settings Modal -->
|
|
<div class="modal fade" id="alertSettingsModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title"><i class="fas fa-cog"></i> Alert Settings</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form>
|
|
<div class="form-group mb-3">
|
|
<label>Critical Stock Threshold (%)</label>
|
|
<input type="number" class="form-control" value="5" min="1" max="50">
|
|
</div>
|
|
<div class="form-group mb-3">
|
|
<label>Low Stock Threshold (%)</label>
|
|
<input type="number" class="form-control" value="20" min="5" max="50">
|
|
</div>
|
|
<div class="form-group mb-3">
|
|
<label>Expiry Warning (days)</label>
|
|
<input type="number" class="form-control" value="30" min="1" max="365">
|
|
</div>
|
|
<div class="form-check mb-3">
|
|
<input class="form-check-input" type="checkbox" id="emailAlerts" checked>
|
|
<label class="form-check-label" for="emailAlerts">
|
|
Send email alerts
|
|
</label>
|
|
</div>
|
|
<div class="form-check mb-3">
|
|
<input class="form-check-input" type="checkbox" id="smsAlerts">
|
|
<label class="form-check-label" for="smsAlerts">
|
|
Send SMS alerts for critical items
|
|
</label>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
|
<button type="button" class="btn btn-primary">Save Settings</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block js %}
|
|
<script>
|
|
$(document).ready(function() {
|
|
// Filter functionality
|
|
$('#applyFilters').click(function() {
|
|
var alertType = $('#alertTypeFilter').val();
|
|
var priority = $('#priorityFilter').val();
|
|
var location = $('#locationFilter').val();
|
|
var category = $('#categoryFilter').val();
|
|
var search = $('#searchFilter').val().toLowerCase();
|
|
|
|
$('.alert-card').each(function() {
|
|
var show = true;
|
|
|
|
if (alertType && !$(this).hasClass('alert-' + alertType)) {
|
|
show = false;
|
|
}
|
|
|
|
if (priority && !$(this).find('.priority-' + priority).length) {
|
|
show = false;
|
|
}
|
|
|
|
if (search && !$(this).text().toLowerCase().includes(search)) {
|
|
show = false;
|
|
}
|
|
|
|
$(this).toggle(show);
|
|
});
|
|
});
|
|
|
|
// Refresh alerts
|
|
$('#refreshAlerts').click(function() {
|
|
location.reload();
|
|
});
|
|
|
|
// Generate report
|
|
$('#generateReport').click(function() {
|
|
alert('Generating stock alerts report...');
|
|
});
|
|
|
|
// Quick action buttons
|
|
$('.btn-outline-danger').click(function() {
|
|
if ($(this).text().includes('Reorder Critical')) {
|
|
alert('Creating purchase orders for all critical items...');
|
|
}
|
|
});
|
|
|
|
$('.btn-outline-warning').click(function() {
|
|
if ($(this).text().includes('Generate Purchase')) {
|
|
alert('Generating purchase orders for low stock items...');
|
|
}
|
|
});
|
|
|
|
$('.btn-outline-info').click(function() {
|
|
if ($(this).text().includes('Review Expiring')) {
|
|
alert('Opening expiring items review...');
|
|
}
|
|
});
|
|
|
|
$('.btn-outline-secondary').click(function() {
|
|
if ($(this).text().includes('Process Expired')) {
|
|
alert('Opening expired items disposal process...');
|
|
}
|
|
});
|
|
|
|
$('.btn-outline-success').click(function() {
|
|
if ($(this).text().includes('Update Alert')) {
|
|
$('#alertSettingsModal').modal('show');
|
|
}
|
|
});
|
|
|
|
// Alert action buttons
|
|
$('.alert-actions .btn-danger').click(function() {
|
|
if ($(this).text().includes('Reorder Now')) {
|
|
alert('Creating urgent purchase order...');
|
|
} else if ($(this).text().includes('Mark for Disposal')) {
|
|
alert('Marking item for disposal...');
|
|
}
|
|
});
|
|
|
|
$('.alert-actions .btn-warning').click(function() {
|
|
alert('Creating purchase order...');
|
|
});
|
|
|
|
$('.alert-actions .btn-info').click(function() {
|
|
alert('Prioritizing item usage...');
|
|
});
|
|
|
|
$('.alert-actions .btn-success').click(function() {
|
|
alert('Redistributing overstock items...');
|
|
});
|
|
|
|
$('.alert-actions .btn-outline-secondary').click(function() {
|
|
alert('Opening item details...');
|
|
});
|
|
|
|
// Bulk actions
|
|
$('.btn-outline-primary').click(function() {
|
|
if ($(this).text().includes('Select All Critical')) {
|
|
alert('Selecting all critical alerts...');
|
|
}
|
|
});
|
|
|
|
$('.bulk-actions .btn-outline-warning').click(function() {
|
|
alert('Creating bulk purchase orders...');
|
|
});
|
|
|
|
$('.bulk-actions .btn-outline-info').click(function() {
|
|
alert('Exporting selected alerts...');
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %}
|
|
|