360 lines
16 KiB
HTML
360 lines
16 KiB
HTML
{% extends "base.html" %}
|
|
{% load static %}
|
|
|
|
{% block title %}Configuration - {{ configuration.key }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid">
|
|
<!-- Breadcrumb -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="page-title-box d-sm-flex align-items-center justify-content-between">
|
|
<h4 class="mb-sm-0">Configuration Detail</h4>
|
|
<div class="page-title-right">
|
|
<ol class="breadcrumb m-0">
|
|
<li class="breadcrumb-item"><a href="{% url 'core:dashboard' %}">Dashboard</a></li>
|
|
<li class="breadcrumb-item"><a href="{% url 'core:system_configuration' %}">System Configuration</a></li>
|
|
<li class="breadcrumb-item active">{{ configuration.key }}</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<!-- Main Content -->
|
|
<div class="col-lg-8">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar-sm me-3">
|
|
<span class="avatar-title rounded-circle bg-primary text-white">
|
|
<i class="fas fa-cog"></i>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h5 class="card-title mb-0">{{ configuration.key }}</h5>
|
|
<small class="text-muted">{{ configuration.category }}</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row mb-4">
|
|
<div class="col-md-6">
|
|
<div class="d-flex mb-3">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-key text-muted me-2"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h6 class="mb-0">Key</h6>
|
|
<p class="text-muted mb-0">{{ configuration.key }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="d-flex mb-3">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-folder text-muted me-2"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h6 class="mb-0">Category</h6>
|
|
<p class="text-muted mb-0">{{ configuration.category }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-4">
|
|
<div class="col-md-6">
|
|
<div class="d-flex mb-3">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-code text-muted me-2"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h6 class="mb-0">Data Type</h6>
|
|
<p class="text-muted mb-0">{{ configuration.get_data_type_display }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="d-flex mb-3">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-toggle-on text-muted me-2"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h6 class="mb-0">Status</h6>
|
|
<p class="mb-0">
|
|
<span class="badge bg-{% if configuration.is_active %}success{% else %}danger{% endif %}">
|
|
{% if configuration.is_active %}Active{% else %}Inactive{% endif %}
|
|
</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<h6 class="text-muted mb-2">Description</h6>
|
|
<div class="p-3 bg-light rounded">
|
|
{{ configuration.description|default:"No description provided." }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<h6 class="text-muted mb-2">Value</h6>
|
|
<div class="p-3 bg-light rounded">
|
|
{% if configuration.data_type == 'BOOLEAN' %}
|
|
<div class="form-check form-switch">
|
|
<input class="form-check-input" type="checkbox" id="configValue" {% if configuration.value_boolean %}checked{% endif %} disabled>
|
|
<label class="form-check-label" for="configValue">
|
|
{{ configuration.value_boolean|yesno:"True,False" }}
|
|
</label>
|
|
</div>
|
|
{% elif configuration.data_type == 'INTEGER' %}
|
|
{{ configuration.value_integer }}
|
|
{% elif configuration.data_type == 'FLOAT' %}
|
|
{{ configuration.value_float }}
|
|
{% elif configuration.data_type == 'JSON' %}
|
|
<pre class="mb-0"><code>{{ configuration.value_json|pprint }}</code></pre>
|
|
{% elif configuration.data_type == 'DATE' %}
|
|
{{ configuration.value_date|date:"F j, Y" }}
|
|
{% elif configuration.data_type == 'DATETIME' %}
|
|
{{ configuration.value_datetime|date:"F j, Y g:i A" }}
|
|
{% else %}
|
|
{{ configuration.value_text }}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
{% if configuration.tenant %}
|
|
<div class="mb-4">
|
|
<h6 class="text-muted mb-2">Tenant</h6>
|
|
<div class="p-3 bg-light rounded">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar-xs">
|
|
<span class="avatar-title rounded-circle bg-primary text-white">
|
|
{{ configuration.tenant.name|first|upper }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex-grow-1 ms-2">
|
|
<p class="mb-0">{{ configuration.tenant.name }}</p>
|
|
<small class="text-muted">{{ configuration.tenant.get_organization_type_display }}</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="mb-4">
|
|
<h6 class="text-muted mb-2">Scope</h6>
|
|
<div class="p-3 bg-light rounded">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-globe text-muted me-2"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<p class="mb-0">System-wide configuration</p>
|
|
<small class="text-muted">Applies to all tenants</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="row mb-4">
|
|
<div class="col-md-6">
|
|
<div class="d-flex mb-3">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-clock text-muted me-2"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h6 class="mb-0">Created</h6>
|
|
<p class="text-muted mb-0">{{ configuration.created_at|date:"M d, Y g:i A" }}</p>
|
|
<small class="text-muted">{{ configuration.created_at|timesince }} ago</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="d-flex mb-3">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-edit text-muted me-2"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h6 class="mb-0">Last Updated</h6>
|
|
<p class="text-muted mb-0">{{ configuration.updated_at|date:"M d, Y g:i A" }}</p>
|
|
<small class="text-muted">{{ configuration.updated_at|timesince }} ago</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sidebar -->
|
|
<div class="col-lg-4">
|
|
<!-- Quick Actions -->
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-bolt me-2"></i>
|
|
Quick Actions
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-grid gap-2">
|
|
<a href="{% url 'core:system_configuration' %}" class="btn btn-outline-primary">
|
|
<i class="fas fa-arrow-left me-2"></i>
|
|
Back to Configurations
|
|
</a>
|
|
|
|
<a href="{% url 'core:system_configuration_update' configuration.pk %}" class="btn btn-outline-success">
|
|
<i class="fas fa-edit me-2"></i>
|
|
Edit Configuration
|
|
</a>
|
|
|
|
{% if configuration.tenant %}
|
|
<a href="{% url 'core:system_configuration_delete' configuration.pk %}" class="btn btn-outline-danger">
|
|
<i class="fas fa-trash me-2"></i>
|
|
Delete Configuration
|
|
</a>
|
|
{% endif %}
|
|
|
|
<button type="button" class="btn btn-outline-secondary" onclick="exportConfig()">
|
|
<i class="fas fa-download me-2"></i>
|
|
Export Configuration
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Configuration History -->
|
|
{% if config_history %}
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-history me-2"></i>
|
|
Configuration History
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="timeline">
|
|
{% for history in config_history %}
|
|
<div class="timeline-item">
|
|
<div class="timeline-marker bg-{% if history.event_type == 'CREATE' %}success{% elif history.event_type == 'UPDATE' %}primary{% elif history.event_type == 'DELETE' %}danger{% else %}secondary{% endif %}">
|
|
<i class="fas fa-{% if history.event_type == 'CREATE' %}plus{% elif history.event_type == 'UPDATE' %}edit{% elif history.event_type == 'DELETE' %}trash{% else %}circle{% endif %}"></i>
|
|
</div>
|
|
<div class="timeline-content">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="mb-1">{{ history.get_event_type_display }}</h6>
|
|
<p class="text-muted mb-1">{{ history.description }}</p>
|
|
</div>
|
|
<small class="text-muted">{{ history.timestamp|timesince }} ago</small>
|
|
</div>
|
|
<small class="text-muted">
|
|
{% if history.user %}
|
|
By {{ history.user.get_full_name|default:history.user.username }}
|
|
{% else %}
|
|
System
|
|
{% endif %}
|
|
</small>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Related Configurations -->
|
|
{% if related_configs %}
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-link me-2"></i>
|
|
Related Configurations
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="list-group">
|
|
{% for config in related_configs %}
|
|
<a href="{% url 'core:system_configuration_detail' config.pk %}" class="list-group-item list-group-item-action">
|
|
<div class="d-flex w-100 justify-content-between">
|
|
<h6 class="mb-1">{{ config.key }}</h6>
|
|
<small class="text-{% if config.is_active %}success{% else %}danger{% endif %}">
|
|
{% if config.is_active %}Active{% else %}Inactive{% endif %}
|
|
</small>
|
|
</div>
|
|
<p class="mb-1 text-muted">{{ config.description|truncatechars:80 }}</p>
|
|
<small>
|
|
<span class="badge bg-info">{{ config.category }}</span>
|
|
</small>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block css %}
|
|
<style>
|
|
.timeline {
|
|
position: relative;
|
|
padding-left: 30px;
|
|
}
|
|
|
|
.timeline::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 15px;
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 2px;
|
|
background: #dee2e6;
|
|
}
|
|
|
|
.timeline-item {
|
|
position: relative;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.timeline-marker {
|
|
position: absolute;
|
|
left: -22px;
|
|
width: 30px;
|
|
height: 30px;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: white;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.timeline-content {
|
|
margin-left: 20px;
|
|
padding: 15px;
|
|
background: #f8f9fa;
|
|
border-radius: 8px;
|
|
border-left: 3px solid #dee2e6;
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block js %}
|
|
<script>
|
|
function exportConfig() {
|
|
window.open('{% url "core:system_configuration_detail" configuration.pk %}?export=json', '_blank');
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
|