HH/templates/complaints/sla_config_form.html

245 lines
12 KiB
HTML

{% extends "layouts/base.html" %}
{% load i18n %}
{% block title %}{{ title }} - {% translate "SLA Configurations" %} - PX360{% endblock %}
{% block content %}
<div class="page-header">
<div class="page-header-content">
<div>
<h1 class="page-title">
<i class="fas fa-clock"></i>
{{ title }}
</h1>
<p class="page-description">
{% if sla_config %}
{% translate "Edit SLA configuration" %}
{% else %}
{% translate "Create new SLA configuration" %}
{% endif %}
</p>
</div>
<a href="{% url 'complaints:sla_config_list' %}" class="btn btn-outline-secondary">
<i class="fas fa-arrow-left"></i>
{% translate "Back to List" %}
</a>
</div>
</div>
<div class="page-content">
<div class="row">
<div class="col-lg-8">
<div class="card">
<div class="card-body">
<form method="post" class="row g-3">
{% csrf_token %}
{% if request.user.is_px_admin %}
<div class="col-md-12">
<label for="id_hospital" class="form-label">
{% translate "Hospital" %} <span class="text-danger">*</span>
</label>
<select name="hospital" id="id_hospital" class="form-select" required>
<option value="">{% translate "Select Hospital" %}</option>
{% for hospital in form.hospital.field.queryset %}
<option value="{{ hospital.id }}"
{% if form.hospital.value == hospital.id|stringformat:"s" %}selected{% endif %}>
{{ hospital.name }}
</option>
{% endfor %}
</select>
{% if form.hospital.errors %}
<div class="invalid-feedback d-block">
{{ form.hospital.errors.0 }}
</div>
{% endif %}
</div>
{% endif %}
<div class="col-md-6">
<label for="id_severity" class="form-label">
{% translate "Severity" %} <span class="text-danger">*</span>
</label>
<select name="severity" id="id_severity" class="form-select" required>
<option value="">{% translate "Select Severity" %}</option>
{% for value, label in form.severity.field.choices %}
<option value="{{ value }}"
{% if form.severity.value == value %}selected{% endif %}>
{{ label }}
</option>
{% endfor %}
</select>
{% if form.severity.errors %}
<div class="invalid-feedback d-block">
{{ form.severity.errors.0 }}
</div>
{% endif %}
</div>
<div class="col-md-6">
<label for="id_priority" class="form-label">
{% translate "Priority" %} <span class="text-danger">*</span>
</label>
<select name="priority" id="id_priority" class="form-select" required>
<option value="">{% translate "Select Priority" %}</option>
{% for value, label in form.priority.field.choices %}
<option value="{{ value }}"
{% if form.priority.value == value %}selected{% endif %}>
{{ label }}
</option>
{% endfor %}
</select>
{% if form.priority.errors %}
<div class="invalid-feedback d-block">
{{ form.priority.errors.0 }}
</div>
{% endif %}
</div>
<div class="col-md-6">
<label for="id_sla_hours" class="form-label">
{% translate "SLA Deadline (Hours)" %} <span class="text-danger">*</span>
</label>
<input type="number"
name="sla_hours"
id="id_sla_hours"
class="form-control"
value="{{ form.sla_hours.value|default:'' }}"
min="1"
step="0.5"
required
placeholder="{% translate 'e.g., 24' %}">
{% if form.sla_hours.errors %}
<div class="invalid-feedback d-block">
{{ form.sla_hours.errors.0 }}
</div>
{% else %}
<div class="form-text">
{% translate "Hours after complaint creation before deadline" %}
</div>
{% endif %}
</div>
<div class="col-md-6">
<label for="id_warning_hours" class="form-label">
{% translate "Warning Threshold (Hours)" %} <span class="text-danger">*</span>
</label>
<input type="number"
name="warning_hours"
id="id_warning_hours"
class="form-control"
value="{{ form.warning_hours.value|default:'' }}"
min="1"
step="0.5"
required
placeholder="{% translate 'e.g., 18' %}">
{% if form.warning_hours.errors %}
<div class="invalid-feedback d-block">
{{ form.warning_hours.errors.0 }}
</div>
{% else %}
<div class="form-text">
{% translate "Hours before deadline to send warning notification" %}
</div>
{% endif %}
</div>
<div class="col-12">
<div class="form-check form-switch">
<input type="checkbox"
name="is_active"
id="id_is_active"
class="form-check-input"
{% if form.is_active.value == 'on' or not form.is_active.value %}checked{% endif %}>
<label class="form-check-label" for="id_is_active">
{% translate "Active" %}
</label>
</div>
<div class="form-text">
{% translate "Only active configurations will be applied to complaints" %}
</div>
</div>
<div class="col-12">
<label for="id_description" class="form-label">
{% translate "Description" %}
</label>
<textarea name="description"
id="id_description"
class="form-control"
rows="3"
placeholder="{% translate 'Optional notes about this configuration' %}">{{ form.description.value|default:'' }}</textarea>
{% if form.description.errors %}
<div class="invalid-feedback d-block">
{{ form.description.errors.0 }}
</div>
{% endif %}
</div>
<div class="col-12">
<div class="d-flex gap-2">
<button type="submit" class="btn btn-primary">
<i class="fas fa-save"></i>
{{ action }}
</button>
<a href="{% url 'complaints:sla_config_list' %}" class="btn btn-outline-secondary">
<i class="fas fa-times"></i>
{% translate "Cancel" %}
</a>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title">
<i class="fas fa-info-circle"></i>
{% translate "Help" %}
</h5>
<h6 class="card-subtitle mb-3 text-muted">
{% translate "Understanding SLA Configuration" %}
</h6>
<p class="card-text">
{% translate "Service Level Agreements (SLAs) define the timeframes within which complaints should be resolved based on their severity and priority." %}
</p>
<ul class="list-unstyled">
<li class="mb-2">
<i class="fas fa-check text-success me-2"></i>
{% translate "High severity complaints typically have shorter SLAs" %}
</li>
<li class="mb-2">
<i class="fas fa-check text-success me-2"></i>
{% translate "Warning threshold sends notifications before deadline" %}
</li>
<li class="mb-2">
<i class="fas fa-check text-success me-2"></i>
{% translate "Inactive configurations won't be applied" %}
</li>
</ul>
<hr>
<h6 class="card-subtitle mb-2 text-muted">
{% translate "Best Practices" %}
</h6>
<ul class="list-unstyled">
<li class="mb-2">
<i class="fas fa-lightbulb text-warning me-2"></i>
{% translate "Set warning threshold at least 4-6 hours before deadline" %}
</li>
<li class="mb-2">
<i class="fas fa-lightbulb text-warning me-2"></i>
{% translate "Consider hospital-specific requirements" %}
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
{% endblock %}