[UPDT] DASHBOARD: Announcement in main dashboard
This commit is contained in:
BIN
static/images/ui/megaphone.png
Normal file
BIN
static/images/ui/megaphone.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
170
templates/announcement_single_view.html
Normal file
170
templates/announcement_single_view.html
Normal file
@@ -0,0 +1,170 @@
|
||||
{% load static %}
|
||||
{% load i18n %}
|
||||
|
||||
|
||||
<style>
|
||||
.oh-modal_close--custom {
|
||||
border: none;
|
||||
background: none;
|
||||
font-size: 1.5rem;
|
||||
opacity: 0.7;
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
right: 15px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Announcement single Modal -->
|
||||
|
||||
<div
|
||||
class="oh-modal"
|
||||
id="announcement"
|
||||
role="dialog"
|
||||
aria-labelledby="announcement"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="oh-modal__dialog">
|
||||
<div class="oh-modal__dialog-header">
|
||||
|
||||
<button class="oh-modal__close" aria-label="Close">
|
||||
<ion-icon name="close-outline"></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="oh-modal__dialog-body"
|
||||
id="announcementModalBody"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- End of single modal-->
|
||||
|
||||
|
||||
<!-- start of create modal -->
|
||||
<div
|
||||
class="oh-modal"
|
||||
id="anouncementModal"
|
||||
role="dialog"
|
||||
aria-labelledby="emptagModal"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="oh-modal__dialog">
|
||||
<div class="oh-modal__dialog-header">
|
||||
<h2 class="oh-modal__dialog-title" id="createModalTitle">
|
||||
{% trans "Create Announcements." %}
|
||||
</h2>
|
||||
<button
|
||||
type="button"
|
||||
class="oh-modal_close--custom"
|
||||
onclick="$('#anouncementModal').removeClass('oh-modal--show');"
|
||||
>
|
||||
<ion-icon
|
||||
name="close-outline"
|
||||
role="img"
|
||||
aria-label="close outline"
|
||||
></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div class="oh-modal__dialog-body" id="createannouncementForm"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end of create modal -->
|
||||
|
||||
<!-- start of update modal -->
|
||||
<div
|
||||
class="oh-modal"
|
||||
id="announcementUpdateModal"
|
||||
role="dialog"
|
||||
aria-labelledby="announcementUpdateModal"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="oh-modal__dialog">
|
||||
<div class="oh-modal__dialog-header">
|
||||
<h5 class="oh-modal__dialog-title" id="announcementUpdateModalLabel"
|
||||
>{% trans "Edit Announcement." %}</span
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
class="oh-modal_close--custom"
|
||||
onclick="$('#announcementUpdateModal').removeClass('oh-modal--show');"
|
||||
>
|
||||
<ion-icon
|
||||
name="close-outline"
|
||||
role="img"
|
||||
aria-label="close outline"
|
||||
></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div class="oh-modal__dialog-body" id='announcementUpdate'>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end of update modal -->
|
||||
|
||||
<!-- start of comment modal -->
|
||||
<div
|
||||
class="oh-modal"
|
||||
id="commentModal"
|
||||
role="dialog"
|
||||
aria-labelledby="emptagModal"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="oh-modal__dialog">
|
||||
<div class="oh-modal__dialog-header">
|
||||
<h2 class="oh-modal__dialog-title" id="createModalTitle">
|
||||
{% trans "Add Comment." %}
|
||||
</h2>
|
||||
<button
|
||||
type="button"
|
||||
class="oh-modal_close--custom"
|
||||
onclick="$('#commentModal').removeClass('oh-modal--show');"
|
||||
>
|
||||
<ion-icon
|
||||
name="close-outline"
|
||||
role="img"
|
||||
aria-label="close outline"
|
||||
></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div class="oh-modal__dialog-body" id="commentForm"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end of comment modal -->
|
||||
|
||||
<!-- start of comment view modal -->
|
||||
<div
|
||||
class="oh-modal"
|
||||
id="commentviewModal"
|
||||
role="dialog"
|
||||
aria-labelledby="commentviewModal"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="oh-modal__dialog">
|
||||
<div class="oh-modal__dialog-header">
|
||||
<h2
|
||||
class="oh-modal__dialog-title"
|
||||
id=""
|
||||
>
|
||||
{% trans "Comments." %}
|
||||
</h2>
|
||||
<button
|
||||
type="button"
|
||||
class="oh-modal_close--custom"
|
||||
onclick="$('#commentviewModal').removeClass('oh-modal--show');"
|
||||
>
|
||||
<ion-icon
|
||||
name="close-outline"
|
||||
role="img"
|
||||
aria-label="close outline"
|
||||
></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="oh-modal__dialog-body oh-modal__dialog-relative"
|
||||
id="commentviewTarget"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- end of comment view modal -->
|
||||
@@ -1,4 +1,4 @@
|
||||
{% load static %} {% load basefilters %} {% load recruitmentfilters %} {% load i18n %} {% load tz %} {% now "Y-m-d" as current_date %}
|
||||
{% load static %} {% load basefilters %} {% load recruitmentfilters %} {% load employee_filter %} {% load i18n %} {% load tz %} {% now "Y-m-d" as current_date %}
|
||||
<div id="mainNav"></div>
|
||||
<!-- End of Navigation -->
|
||||
<style>
|
||||
@@ -57,6 +57,13 @@
|
||||
margin-right:10px;
|
||||
background-color:hsl(138.46deg 100% 74.19% / 33%);
|
||||
}
|
||||
|
||||
.announcement_title{
|
||||
margin-bottom: 10px;
|
||||
padding: 8px;
|
||||
margin-right:10px;
|
||||
text-decoration:none;
|
||||
}
|
||||
</style>
|
||||
<main>
|
||||
<div class="oh-wrapper">
|
||||
@@ -672,7 +679,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-dashboard__right col-12 col-sm-12 col-md-12 col-lg-3">
|
||||
<div class="oh-dashboard__events mb-3">
|
||||
<div class="oh-dashboard__events">
|
||||
<div
|
||||
class="oh-dashbaord__events-reel w-100"
|
||||
id="birthdayContainer"
|
||||
@@ -681,18 +688,73 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent mb-3"
|
||||
>
|
||||
<div
|
||||
class="oh-card-dashboard__header oh-card-dashboard__header--divider"
|
||||
>
|
||||
<span class="oh-card-dashboard__title">{% trans "On Leave" %}</span>
|
||||
<div class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent mb-3 mt-3">
|
||||
<div class="oh-card-dashboard__title fw-bold" style="font-size:20px;">
|
||||
<img style="width: 30px; height: 30px; display: inline-block;" src="{% static 'images/ui/megaphone.png' %}" class="oh-404__image ms-2"/>
|
||||
<span class="ms-1">{% trans "Announcements." %}</span>
|
||||
{% if perms.base.add_announcement %}
|
||||
<span>
|
||||
<button style="display: inline-block;font-size: 20px; padding:5px; margin-top:-8px;" class="oh-btn oh-btn--secondary-outline float-end me-2" hx-get='{% url "create-announcement" %}'
|
||||
hx-target="#createannouncementForm" hx-swap="innerHTML" data-toggle="oh-modal-toggle" data-target="#anouncementModal" title='{% trans "Create Announcement." %}'>
|
||||
<ion-icon name="add-outline"></ion-icon>
|
||||
</button>
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="oh-card-dashboard__body">
|
||||
<div class="oh-sticky-table" style="height:400px; border:none;">
|
||||
<div class="oh-sticky-table__table oh-table--sortable">
|
||||
<div class="oh-sticky-table__tbody">
|
||||
|
||||
|
||||
{% if announcement == '' %}
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="announcement_title fw-bold">
|
||||
No Announcement.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
|
||||
{% for i in announcement %}
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
{% if i.expire_date|date:"Y-m-d" >= current_date or i.expire_date == None %}
|
||||
<div class="announcement_title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#announcement"
|
||||
hx-get="{% url 'announcement-single-view' i.id %}"
|
||||
hx-target="#announcementModalBody">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name={{i.title}}&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark fw-bold">
|
||||
{{i.title}}
|
||||
</span>
|
||||
{% now "Y-m-d" as current_date %}
|
||||
{% if i.created_on|date:"Y-m-d" == current_date %}
|
||||
<span class="oh-profile__info-value ms-2" style="background-color: hsl(8,77%,56%); color:white;
|
||||
font-size: 0.7rem; padding: 3px 8px; border-radius: 15px; font-weight: 800; width:auto;"
|
||||
>NEW</span>
|
||||
{% endif %}
|
||||
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-card-dashboard__body">
|
||||
<ul class="oh-card-dashboard__user-list" id="leaveEmployee"></ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent mb-3 mt-2">
|
||||
<div class="oh-card-dashboard__title mt-4 mb-3">{% trans "Quick Actions" %}</div> <hr>
|
||||
@@ -704,7 +766,7 @@
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle"
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#newAttendanceRequest"
|
||||
hx-get="{% url 'request-new-attendance' %}"
|
||||
hx-target="#newAttendanceRequestModalBody">
|
||||
@@ -720,7 +782,7 @@
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle"
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#requestCreateModal"
|
||||
hx-get="{% url 'leave-request-create' %}"
|
||||
hx-target="#requestCreateFormModal">
|
||||
@@ -736,7 +798,7 @@
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle"
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#shiftRequestModal"
|
||||
hx-get="{% url 'shift-request' %}?emp_id={{request.user.employee_get.id}}"
|
||||
hx-target="#shiftRequestTargetModal">
|
||||
@@ -752,7 +814,7 @@
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle='oh-modal-toggle'
|
||||
<a class="oh-profile oh-profile--md" data-toggle='oh-modal-toggle' style="text-decoration:none;"
|
||||
data-target='#workTypeRequestModal'
|
||||
hx-get="{% url 'work-type-request' %}"
|
||||
hx-target='#formBody'>
|
||||
@@ -768,7 +830,8 @@
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" hx-get="{% url 'create-reimbursement' %}" hx-target="#reimbursementModalBody" data-toggle="oh-modal-toggle" data-target="#reimbursementModal">
|
||||
<a class="oh-profile oh-profile--md" hx-get="{% url 'create-reimbursement' %}" style="text-decoration:none;"
|
||||
hx-target="#reimbursementModalBody" data-toggle="oh-modal-toggle" data-target="#reimbursementModal">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=R R&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
@@ -781,7 +844,7 @@
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle"
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#asset-request-allocation-modal"
|
||||
hx-get="{%url 'asset-request-creation'%}"
|
||||
hx-target="#asset-request-allocation-modal-target">
|
||||
@@ -797,7 +860,7 @@
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle"
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#createModal1"
|
||||
hx-get="{% url 'ticket-create' %}"
|
||||
hx-target="#createTarget">
|
||||
@@ -815,8 +878,146 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent mb-3"
|
||||
>
|
||||
<div
|
||||
class="oh-card-dashboard__header oh-card-dashboard__header--divider"
|
||||
>
|
||||
<span class="oh-card-dashboard__title">{% trans "On Leave" %}</span>
|
||||
</div>
|
||||
<div class="oh-card-dashboard__body">
|
||||
<ul class="oh-card-dashboard__user-list" id="leaveEmployee"></ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% comment %} <div class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent mb-3 mt-2">
|
||||
<div class="oh-card-dashboard__title mt-4 mb-3">{% trans "Quick Actions" %}</div> <hr>
|
||||
|
||||
<div class="oh-card-dashboard__body">
|
||||
<div class="oh-sticky-table" style="height:400px; border:none;">
|
||||
<div class="oh-sticky-table__table oh-table--sortable">
|
||||
<div class="oh-sticky-table__tbody">
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#newAttendanceRequest"
|
||||
hx-get="{% url 'request-new-attendance' %}"
|
||||
hx-target="#newAttendanceRequestModalBody">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=A R&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">
|
||||
{% trans "Attendance Request" %}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#requestCreateModal"
|
||||
hx-get="{% url 'leave-request-create' %}"
|
||||
hx-target="#requestCreateFormModal">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=L R&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">
|
||||
{% trans "Leave Request" %}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#shiftRequestModal"
|
||||
hx-get="{% url 'shift-request' %}?emp_id={{request.user.employee_get.id}}"
|
||||
hx-target="#shiftRequestTargetModal">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=S R&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">
|
||||
{% trans "Shift Request" %}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle='oh-modal-toggle' style="text-decoration:none;"
|
||||
data-target='#workTypeRequestModal'
|
||||
hx-get="{% url 'work-type-request' %}"
|
||||
hx-target='#formBody'>
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=W R&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">
|
||||
{% trans "Worktype Request" %}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" hx-get="{% url 'create-reimbursement' %}" style="text-decoration:none;"
|
||||
hx-target="#reimbursementModalBody" data-toggle="oh-modal-toggle" data-target="#reimbursementModal">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=R R&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">
|
||||
{% trans "Reimbursement Request" %}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#asset-request-allocation-modal"
|
||||
hx-get="{%url 'asset-request-creation'%}"
|
||||
hx-target="#asset-request-allocation-modal-target">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=A R&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">
|
||||
{% trans "Asset Request" %}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-kanban-card__title">
|
||||
<a class="oh-profile oh-profile--md" data-toggle="oh-modal-toggle" style="text-decoration:none;"
|
||||
data-target="#createModal1"
|
||||
hx-get="{% url 'ticket-create' %}"
|
||||
hx-target="#createTarget">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="https://ui-avatars.com/api/?name=T C&background=random" class="oh-profile__image" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">
|
||||
{% trans "Ticket Creation" %}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> {% endcomment %}
|
||||
|
||||
{% if perms.leave.view_leaverequest or request.user|is_reportingmanager%}
|
||||
<div
|
||||
class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent"
|
||||
@@ -962,6 +1163,7 @@
|
||||
</div>
|
||||
|
||||
{% include "quick_access.html" %}
|
||||
{% include "announcement_single_view.html" %}
|
||||
|
||||
|
||||
</main>
|
||||
|
||||
@@ -213,7 +213,16 @@
|
||||
>{% trans "Disciplinary Action Type" %}</a
|
||||
>
|
||||
</li>
|
||||
|
||||
{% if perms.base.add_announcement %}
|
||||
<li class="oh-inner-sidebar__item">
|
||||
<a
|
||||
id="currency"
|
||||
href="{% url 'general-settings' %}"
|
||||
class="oh-inner-sidebar__link oh-dropdown__link"
|
||||
>{% trans "General Settings" %}</a
|
||||
>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if perms.base.view_company %}
|
||||
|
||||
<li class="oh-inner-sidebar__item">
|
||||
|
||||
Reference in New Issue
Block a user