255 lines
8.8 KiB
HTML
255 lines
8.8 KiB
HTML
|
|
|
|
{% load i18n static%}
|
|
<!DOCTYPE html>
|
|
{% get_current_language as LANGUAGE_CODE %}
|
|
<html lang="{{ LANGUAGE_CODE }}"
|
|
dir="{% if LANGUAGE_CODE == 'ar' %}rtl{% else %}ltr{% endif %}"
|
|
data-bs-theme=""
|
|
data-navigation-type="default"
|
|
data-navbar-horizontal-shape="default">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
<title>{% block title %}{% endblock %}</title>
|
|
<!-- ================== BEGIN core-css ================== -->
|
|
|
|
<link href="{% static 'css/vendor.min.css' %}" rel="stylesheet" />
|
|
<link href="{% static 'css/default/app.min.css' %}" rel="stylesheet" />
|
|
{# <link href="{% static 'css/apple/app.min.css' %}" rel="stylesheet" />#}
|
|
{# <link href="{% static 'css/transparent/app.min.css' %}" rel="stylesheet" />#}
|
|
<link href="{% static 'css/custom.css' %}" rel="stylesheet" />
|
|
<head>
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet"/>
|
|
</head>
|
|
<body>
|
|
<!-- Your page content -->
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js"></script>
|
|
</body>
|
|
{# <script src="{% static 'plugins/apexcharts/dist/apexcharts.min.js' %}"></script>#}
|
|
<!-- HTMX -->
|
|
<script src="{% static 'js/htmx.min.js' %}"></script>
|
|
<!-- ================== END core-css ================== -->
|
|
|
|
{% block css %}
|
|
|
|
{% endblock %}
|
|
</head>
|
|
<body>
|
|
<div id="app" class="app app-without-sidebar">
|
|
<div id="header" class="app-header" data-bs-theme="{% if appHeaderInverse %}dark{% endif %}">
|
|
<!-- BEGIN navbar-header -->
|
|
<div class="navbar-header">
|
|
{% if appSidebarTwo %}
|
|
<button type="button" class="navbar-mobile-toggler" data-toggle="app-sidebar-end-mobile">
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
{% endif %}
|
|
<a href="/" class="navbar-brand"><span class="navbar-logo"></span><b class="me-3px">{{ _("Hospital") }}</b>{{ _("Management") }}</a>
|
|
{% if appHeaderMegaMenu %}
|
|
<button type="button" class="navbar-mobile-toggler collapsed" data-bs-toggle="collapse" data-bs-target="#top-navbar" aria-expanded="false">
|
|
<span class="fa-stack fa-lg">
|
|
<i class="far fa-square fa-stack-2x"></i>
|
|
<i class="fa fa-cog fa-stack-1x"></i>
|
|
</span>
|
|
</button>
|
|
{% endif %}
|
|
<button type="button" class="navbar-mobile-toggler" data-toggle="app-sidebar-mobile">
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</div>
|
|
<!-- END navbar-header -->
|
|
|
|
{% if appHeaderMegaMenu %}
|
|
{% include 'partial/header-mega-menu.html' %}
|
|
{% endif %}
|
|
|
|
<!-- BEGIN header-nav -->
|
|
<div class="navbar-nav">
|
|
{# <div class="navbar-item navbar-form">#}
|
|
{# <form action="" method="POST" name="search">#}
|
|
{# <div class="form-group">#}
|
|
{# <input type="text" class="form-control" placeholder="Enter keyword" />#}
|
|
{# <button type="submit" class="btn btn-search"><i class="fa fa-search"></i></button>#}
|
|
{# </div>#}
|
|
{# </form>#}
|
|
{# </div>#}
|
|
|
|
|
|
|
|
<!-- System Notifications -->
|
|
<div class="navbar-item dropdown">
|
|
<div id="system-notifications"
|
|
hx-get="{% url 'core:system_notifications' %}"
|
|
hx-trigger="load, every 60s"
|
|
class="mb-4">
|
|
<div class="text-center">
|
|
<div class="spinner-border spinner-border-sm text-primary" role="status">
|
|
<span class="visually-hidden">Loading notifications...</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
{% if appHeaderLanguageBar %}
|
|
<div class="navbar-item dropdown">
|
|
<a href="#" class="navbar-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
<span class="fi fi-us" title="us"></span>
|
|
<span class="d-none d-sm-inline ms-1">EN</span> <b class="caret"></b>
|
|
</a>
|
|
<div class="dropdown-menu dropdown-menu-end">
|
|
<a href="javascript:;" class="dropdown-item"><span class="fi fi-us me-2" title="us"></span> English</a>
|
|
<a href="javascript:;" class="dropdown-item"><span class="fi fi-cn me-2" title="ar"></span> Arabic</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
<a href="javascript:;" class="dropdown-item text-center">more options</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
<div class="navbar-item navbar-user dropdown">
|
|
<a href="#" class="navbar-link dropdown-toggle d-flex align-items-center" data-bs-toggle="dropdown">
|
|
<img src="{% static '/img/user/user-4.jpg' %}" alt="" />
|
|
<span>
|
|
<span class="d-none d-md-inline fw-bold">{{ request.user.get_full_name }}</span>
|
|
<b class="caret"></b>
|
|
</span>
|
|
</a>
|
|
<div class="dropdown-menu dropdown-menu-end me-1">
|
|
<a href="#" class="dropdown-item">Edit Profile</a>
|
|
<a href="/email/inbox" class="dropdown-item d-flex align-items-center">
|
|
Inbox
|
|
<span class="badge bg-danger rounded-pill ms-auto pb-4px">2</span>
|
|
</a>
|
|
<a class="dropdown-item" href="{% url 'core:audit_log' %}"><i class="fas fa-history"></i> Audit Log</a>
|
|
<a href="/calendar" class="dropdown-item">Calendar</a>
|
|
<a href="{% url 'core:system_configuration' %}" class="dropdown-item">Settings</a>
|
|
<div class="dropdown-divider"></div>
|
|
<a href="/user/login" class="dropdown-item">Log Out</a>
|
|
</div>
|
|
</div>
|
|
{% if appSidebarTwo %}
|
|
<div class="navbar-divider d-none d-md-block"></div>
|
|
<div class="navbar-item d-none d-md-block">
|
|
<a href="javascript:;" data-toggle="app-sidebar-end" class="navbar-link icon">
|
|
<i class="fa fa-th"></i>
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
<!-- END header-nav -->
|
|
</div>
|
|
|
|
<div id="content" class="app-content">
|
|
<!-- Main content -->
|
|
<main class="col-md-9 ms-sm-auto col-lg-10 px-md-4 main-content">
|
|
{% if messages %}
|
|
<div class="mt-3">
|
|
{% for message in messages %}
|
|
<div class="alert alert-{{ message.tags }} alert-dismissible fade show" role="alert">
|
|
{{ message }}
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</main>
|
|
|
|
|
|
<div hx-boost="false">
|
|
{% block content %}
|
|
|
|
{% endblock %}
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
{% include 'partial/theme-panel.html' %}
|
|
</div>
|
|
{% include 'partial/scroll-top-btn.html' %}
|
|
{% block outter_content %}
|
|
|
|
{% endblock %}
|
|
|
|
<!-- ================== BEGIN core-js ================== -->
|
|
<script src="{% static 'js/vendor.min.js' %}"></script>
|
|
<script src="{% static 'js/app.min.js' %}"></script>
|
|
|
|
<!-- ================== END core-js ================== -->
|
|
|
|
{% block js %}
|
|
|
|
<script>
|
|
// HTMX configuration
|
|
htmx.config.globalViewTransitions = true;
|
|
|
|
// Auto-refresh indicators
|
|
document.addEventListener('htmx:beforeRequest', function(evt) {
|
|
if (evt.detail.target.classList.contains('auto-refresh')) {
|
|
evt.detail.target.style.opacity = '0.7';
|
|
}
|
|
});
|
|
|
|
document.addEventListener('htmx:afterRequest', function(evt) {
|
|
if (evt.detail.target.classList.contains('auto-refresh')) {
|
|
evt.detail.target.style.opacity = '1';
|
|
}
|
|
});
|
|
|
|
|
|
{#// Define a default palette if no colors provided#}
|
|
{#const defaultPalette = ['#FF6384','#36A2EB','#FFCE56','#4BC0C0','#9966FF','#FF9F40'];#}
|
|
{##}
|
|
{#// Function to (re)create all charts#}
|
|
{#function recreateAllChartsByClass() {#}
|
|
{# document.querySelectorAll('.apex-chart').forEach(el => {#}
|
|
{# const optionsText = el.getAttribute('data-options');#}
|
|
{# if (!optionsText) return;#}
|
|
{##}
|
|
{# let options;#}
|
|
{# try {#}
|
|
{# options = JSON.parse(optionsText);#}
|
|
{# } catch (e) {#}
|
|
{# console.error('❌ Invalid JSON in data-options for', el, e);#}
|
|
{# return;#}
|
|
{# }#}
|
|
{##}
|
|
{# if (!options.colors) {#}
|
|
{# options.colors = defaultPalette;#}
|
|
{# }#}
|
|
{##}
|
|
{# if (el._apexInstance && typeof el._apexInstance.destroy === 'function') {#}
|
|
{# el._apexInstance.destroy();#}
|
|
{# }#}
|
|
{##}
|
|
{# const chart = new ApexCharts(el, options);#}
|
|
{# chart.render();#}
|
|
{# el._apexInstance = chart;#}
|
|
{# });#}
|
|
{# }#}
|
|
{##}
|
|
{#window.addEventListener('load', function() {#}
|
|
{# setTimeout(recreateAllChartsByClass, 10);#}
|
|
{# });#}
|
|
|
|
/*$(document).on('sortstop', function() {
|
|
recreateAllChartsByClass();
|
|
});
|
|
*/
|
|
</script>
|
|
{% endblock %}
|
|
</body>
|
|
</html> |