Files
ihrm/templates/index.html

282 lines
12 KiB
HTML
Raw Normal View History

2023-05-10 15:06:57 +05:30
{% load static %}
{% load i18n %}
{% load attendancefilters %}
<!DOCTYPE html>
<html>
{% get_current_language_bidi as LANGUAGE_BIDI %}
{% get_current_language as LANGUAGE_CODE %}
2023-07-26 12:15:01 +05:30
{% comment %} <html dir="{% if LANGUAGE_BIDI %}rtl{% else %}ltr{% endif %}" lang="{{ LANGUAGE_CODE }}"> {% endcomment %}
2023-05-10 15:06:57 +05:30
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Horilla</title>
<link rel="apple-touch-icon" sizes="180x180" href="{% static 'favicons/apple-touch-icon.png' %}">
<link rel="icon" type="image/png" sizes="32x32" href="{% static 'favicons/favicon-32x32.png' %}">
<link rel="icon" type="image/png" sizes="16x16" href="{% static 'favicons/favicon-16x16.png' %}">
2023-08-31 16:53:07 +05:30
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11.0.20/dist/sweetalert2.min.css">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
2023-05-10 15:06:57 +05:30
<link rel="stylesheet" href="{% static 'build/css/style.min.css' %}" />
2023-06-06 14:14:43 +05:30
<link rel="stylesheet" href="{% static 'build/css/summernote-lite.min.css' %}" />
<script src="{% static '/jquery/ajax.js' %}" ></script>
2023-05-10 15:06:57 +05:30
<script src="{% static '/jquery/jquery.min.js' %}"></script>
<link rel="stylesheet" href="{% static '/jquery/jqueryui.css' %}">
<script src="{% static '/jquery/jqueryui.js' %}"></script>
<!-- Popper.JS -->
<!-- Bootstrap JS -->
{% block styles %}
{% endblock styles %}
<style>
ul.errorlist {
color: #d9534f;
background-color: #f0d8d8;
border-color: #d6e9c6;padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
border-radius: 4px;
}
ul{
list-style-type: none;
}
2023-09-13 16:52:29 +05:30
ion-icon {
pointer-events: none;
}
.row-status--purple {
border-left: 4px solid rgba(128, 128, 128, 0.482);
border-radius: 5px;
}
.row-status--cyan {
border-left: 4px solid cyan;
border-radius: 5px;
}
.row-status--yellow {
border-left: 4px solid yellowgreen;
border-radius: 5px;
}
.row-status--red {
border-left: 4px solid red;
border-radius: 5px;
}
.row-status--black {
border-left: 4px solid black;
border-radius: 5px;
}
.row-status--gray {
border-left: 4px solid gray;
border-radius: 5px;
}
.row-status--orange {
border-left: 4px solid orange;
border-radius: 5px;
}
.row-status--gray {
border-left: 4px solid gray;
border-radius: 5px;
}
.row-status--yellow {
border-left: 4px solid yellowgreen;
border-radius: 5px;
}
.row-status--blue {
border-left: 4px solid rgb(103, 171, 238);
border-radius: 5px;
}
2023-05-10 15:06:57 +05:30
</style>
</head>
<body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
{% if messages %}
<div class="oh-alert-container">
{% for message in messages %}
<div class="oh-alert oh-alert--animated {{message.tags}}">
{{ message }}
</div>
{% endfor %}
</div>
{% endif %}
<div class="oh-wrapper-main" :class="!sidebarOpen ? 'oh-wrapper-main--closed' : ''" x-data="{sidebarOpen: true}"
@load.window="
width = (window.innerWidth > 0) ? window.innerWidth : screen.width;
if (width < 575.98) {
sidebarOpen = false
}" @resize.window="
width = (window.innerWidth > 0) ? window.innerWidth : screen.width;
if (width < 575.98) {
sidebarOpen = false
}">
<div id="sidebar" >
{% include 'sidebar.html' %}
</div>
<div id="main">
<!-- Navigation -->
<!-- Confirm Modal -->
<div
class="oh-modal"
id="confirmModal"
role="dialog"
aria-labelledby="confirmModalLabel"
aria-hidden="true"
>
<div class="oh-modal__dialog oh-modal__dialog--confirm">
<div class="oh-modal__dialog-header">
<span class="oh-modal__dialog-title" id="confirmModalLabel"
></span
>
</div>
<div class="oh-modal__dialog-body" id="confirmModalBody">
</div>
2023-08-31 16:53:07 +05:30
{% comment %} <div class="oh-modal__dialog-footer">
2023-05-10 15:06:57 +05:30
<button class="oh-btn oh-btn--success" id="ok">{% trans "Confirm" %}</button>
<button class="oh-btn oh-btn--danger oh-modal__cancel" id="cancel">
{% trans "Cancel" %}
</button>
2023-08-31 16:53:07 +05:30
</div> {% endcomment %}
2023-05-10 15:06:57 +05:30
</div>
</div>
<!-- End of Confirm Modal -->
<div class="oh-activity-sidebar " id="allNotifications">
<div class="oh-activity-sidebar__header">
<ion-icon name="chevron-back-outline" id="notificationClose" class="oh-activity-sidebar__header-icon me-2 oh-activity-sidebar__close md hydrated" role="img" aria-label="chevron back outline"></ion-icon>
<span class="oh-activity-sidebar__title"> {% trans "All Notifications" %}</span>
</div>
<div class="oh-activity-sidebar__body" id="allNotificationBody">
{% include "notification/all_notifications.html" %}
</div>
</div>
<nav class="oh-navbar">
<div class="oh-wrapper oh-navbar__wrapper">
<div class="oh-navbar__toggle-container">
<a href="#" class="oh-navbar__toggle-link oh-link__unstyled" @click="sidebarOpen = !sidebarOpen">
<img src="{% static 'images/ui/menu.svg' %}" width="24" height="24" class="oh-navbar__toggle-menu"
loading="lazy" />
<span class="oh-tabs__movable-title" style="color: rgb(0, 0, 14);">{% trans request.session.title %}</span>
2023-05-10 15:06:57 +05:30
</a>
</div>
<div class="oh-navbar__systray">
<div id="attendance-activity-container">
{% if request.user.employee_get %}
{% if request.user|is_clocked_in %}
<button class="oh-btn oh-btn--warning-outline mr-2" hx-get="{% url 'clock-out' %}" hx-target='#attendance-activity-container' hx-swap='innerHTML'><ion-icon class="oh-navbar__clock-icon mr-2 text-warning" name="exit-outline"></ion-icon>
<span class="hr-check-in-out-text">{% trans "Check-Out" %}</span>
</button>
2023-05-10 15:06:57 +05:30
{% else %}
<button class="oh-btn oh-btn--success-outline mr-2" hx-get="{% url 'clock-in' %}" hx-target='#attendance-activity-container' hx-swap='innerHTML'><ion-icon class="oh-navbar__clock-icon mr-2 text-success" name="enter-outline"></ion-icon>
<span class="hr-check-in-out-text">{% trans "Check-In" %}</span>
</button>
2023-05-10 15:06:57 +05:30
{% endif %}
{% endif %}
</div>
{% if request.user|any_permission:'base' or perms.attendance.add_attendancevalidationcondition %}
<div class="oh-navbar__action-icons">
<a href="/settings/department-creation" class="oh-navbar__action-icons-link">
<ion-icon name="settings-outline" class="oh-navbar__icon"></ion-icon>
</a>
</div>
{% endif %}
{% include 'notification/notification.html' %}
2023-07-26 12:15:01 +05:30
<div class="oh-dropdown" x-data="{open: false}" @click="open = !open">
<div class="oh-navbar__action-icons">
<a href="#" class="oh-navbar__action-icons-link">
<ion-icon name="globe-outline" class="oh-navbar__icon"></ion-icon>
</a>
2023-08-01 16:49:53 +05:30
<div class="oh-dropdown__menu oh-dropdown__menu--right" x-show="open" @click.outside="open = false" style="display:none;">
2023-07-26 12:15:01 +05:30
<ul class="oh-dropdown__items">
{% get_available_languages as LANGUAGES %}
{% for language in LANGUAGES %}
<li class="oh-dropdown__item">
<a href="{% url 'set_language' %}" class="oh-dropdown__link"
onclick="event.preventDefault(); document.getElementById('language-form-{{ language.0 }}').submit();">
<img src="/static/images/ui/{{ language.0 }}.png" class="oh-dropdown__lang-icon"/>{{ language.1 }}{% if language.0 == LANGUAGE_CODE %}
<ion-icon name="checkmark-circle-outline" style="
position: relative;
top: 3.3px;
color: green;
font-size: 1.2em;
}"></ion-icon>
{% endif %}
</a>
<form id="language-form-{{ language.0 }}" action="{% url 'set_language' %}" method="post" style="display: none;">
{% csrf_token %}
<input type="hidden" name="language" value="{{ language.0 }}">
</form>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
2023-05-10 15:06:57 +05:30
<div class="oh-dropdown" x-data="{open: false}">
<div class="oh-navbar__user-info" @click="open = !open" @click.outside="open = false">
<div class="oh-navbar__user-photo">
<img src="/media/{{user.employee_get.employee_profile}}" class="oh-navbar__user-image" loading="lazy" />
</div>
<span class="oh-navbar__user-name">{{user.employee_get.employee_first_name | title}}</span>
</div>
<div class="oh-dropdown__menu oh-dropdown__menu--right" x-show="open" style="display: none;">
<ul class="oh-dropdown__items">
<li class="oh-dropdown__item">
<a href="/employee/employee-profile" class="oh-dropdown__link">{% trans "My Profile" %}</a>
</li>
2023-08-08 10:13:50 +05:30
<li class="oh-dropdown__item">
<a href="/change-password" class="oh-dropdown__link">{% trans "Change Password" %}</a>
</li>
2023-05-10 15:06:57 +05:30
</ul>
<hr />
<ul class="oh-dropdown__items">
<li class="oh-dropdown__item">
<a href="/logout" class="oh-dropdown__link">{% trans "Logout" %}</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</nav>
<!-- End of Navigation -->
<div id='main-section' >
{% block content %}
{% include 'dashboard.html' %}
{% endblock content %}
</div>
</div>
</div>
<!--htmx script -->
<script src="{% static 'build/js/web.frontend.min.js' %}"></script>
<script src="{% static 'htmx/htmx.min.js' %}"></script>
<script>
document.body.addEventListener('htmx:configRequest', (event) => {
event.detail.headers['X-CSRFToken'] = '{{ csrf_token }}';
})
</script>
<!-- this is the master js -->
<script src="{% static '/index/index.js' %}"></script>
2023-05-10 15:06:57 +05:30
<script src="{% static 'build/js/htmxSelect2.js' %}" ></script>
2023-06-06 14:14:43 +05:30
<script src="{% static 'build/js/summernote-lite.min.js' %}" ></script>
2023-05-10 15:06:57 +05:30
<script src="{% static 'attendance/actions.js' %}"></script>
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
2023-08-31 16:53:07 +05:30
<script src="{% static '/build/js/sweetAlert.js' %}"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
2023-05-10 15:06:57 +05:30
</body>
</html>