107 lines
5.0 KiB
HTML
107 lines
5.0 KiB
HTML
{% extends 'base.html' %}
|
|
{% load static %}
|
|
|
|
{% block title %}Configure Alerts{% endblock %}
|
|
|
|
{% block css %}
|
|
<link href="{% static 'assets/plugins/select2/dist/css/select2.min.css' %}" rel="stylesheet" />
|
|
<link href="{% static 'assets/plugins/datatables.net-bs5/css/dataTables.bootstrap5.min.css' %}" rel="stylesheet" />
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div id="content" class="app-content">
|
|
<div class="container">
|
|
<ul class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="{% url 'core:dashboard' %}">Dashboard</a></li>
|
|
<li class="breadcrumb-item"><a href="{% url 'communications:message_list' %}">Messages</a></li>
|
|
<li class="breadcrumb-item active">Configure Alerts</li>
|
|
</ul>
|
|
|
|
<div class="row align-items-center mb-3">
|
|
<div class="col">
|
|
<h1 class="page-header">Configure Alerts</h1>
|
|
<p class="text-muted">Set up automated alerts and notification rules for system events</p>
|
|
</div>
|
|
<div class="col-auto">
|
|
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#createAlertModal">
|
|
<i class="fa fa-plus me-2"></i>Create Alert Rule
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Alert Categories -->
|
|
<div class="row mb-4">
|
|
<div class="col-md-3">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<div class="w-60px h-60px bg-danger bg-opacity-20 d-flex align-items-center justify-content-center rounded-circle mx-auto mb-3">
|
|
<i class="fa fa-exclamation-triangle fa-2x text-danger"></i>
|
|
</div>
|
|
<h5>Critical Alerts</h5>
|
|
<div class="fs-24px fw-600 text-danger">{{ critical_alerts_count }}</div>
|
|
<div class="text-muted small">Active rules</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<div class="w-60px h-60px bg-warning bg-opacity-20 d-flex align-items-center justify-content-center rounded-circle mx-auto mb-3">
|
|
<i class="fa fa-exclamation-circle fa-2x text-warning"></i>
|
|
</div>
|
|
<h5>Warning Alerts</h5>
|
|
<div class="fs-24px fw-600 text-warning">{{ warning_alerts_count }}</div>
|
|
<div class="text-muted small">Active rules</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<div class="w-60px h-60px bg-info bg-opacity-20 d-flex align-items-center justify-content-center rounded-circle mx-auto mb-3">
|
|
<i class="fa fa-info-circle fa-2x text-info"></i>
|
|
</div>
|
|
<h5>Info Alerts</h5>
|
|
<div class="fs-24px fw-600 text-info">{{ info_alerts_count }}</div>
|
|
<div class="text-muted small">Active rules</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<div class="w-60px h-60px bg-success bg-opacity-20 d-flex align-items-center justify-content-center rounded-circle mx-auto mb-3">
|
|
<i class="fa fa-check-circle fa-2x text-success"></i>
|
|
</div>
|
|
<h5>Success Alerts</h5>
|
|
<div class="fs-24px fw-600 text-success">{{ success_alerts_count }}</div>
|
|
<div class="text-muted small">Active rules</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Alert Rules Table -->
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h4 class="card-title">Alert Rules</h4>
|
|
<div class="card-toolbar">
|
|
<div class="btn-group">
|
|
<button type="button" class="btn btn-outline-primary btn-sm" onclick="toggleAllRules(true)">
|
|
<i class="fa fa-play me-1"></i>Enable All
|
|
</button>
|
|
<button type="button" class="btn btn-outline-secondary btn-sm" onclick="toggleAllRules(false)">
|
|
<i class="fa fa-pause me-1"></i>Disable All
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-striped" id="alertRulesTable">
|
|
<thead>
|
|
<tr>
|
|
<th>Rule Name</th>
|
|
|
|
|