397 lines
15 KiB
HTML
397 lines
15 KiB
HTML
{% load i18n %} {% load static %} {% load horillafilters %}
|
|
<div class="row">
|
|
<div class="col-sm-12 col-md-12 col-lg-4">
|
|
<div class="oh-card oh-card--margin">
|
|
<div class="oh-card__header">
|
|
<span class="oh-card__title oh-card__title--sm fw-bold me-2">
|
|
{% trans "Personal Information" %}
|
|
</span>
|
|
</div>
|
|
<div class="oh-card__body mt-4">
|
|
<ul class="oh-profile__card-info-list">
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="calendar-outline"></ion-icon>
|
|
<span>{% trans "Date of Birth" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value dateformat_changer">{{employee.get_employee_dob|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="transgender-outline"></ion-icon>
|
|
<span>{% trans "Gender" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.get_gender_display}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="home-outline"></ion-icon>
|
|
<span>{% trans "Address" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.address|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="flag-outline"></ion-icon>
|
|
<span>{% trans "Country" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.country|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="compass-outline"></ion-icon>
|
|
<span>{% trans "State" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.state|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="planet-outline"></ion-icon>
|
|
<span>{% trans "City" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.city|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="book-outline"></ion-icon>
|
|
<span>{% trans "Qualification" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.qualification|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="briefcase-outline"></ion-icon>
|
|
<span>{% trans "Experience" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.experience|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="link-outline"></ion-icon>
|
|
<span>{% trans "Marital Status" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.get_marital_status_display}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="person-circle-outline"></ion-icon>
|
|
<span>{% trans "Children" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.children|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="call-outline"></ion-icon>
|
|
<span>{% trans "Emergency Contact" %}</span>
|
|
</span>
|
|
<span class="oh-profile__info-value">{{employee.emergency_contact|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="people-circle-outline"></ion-icon>
|
|
<span>{% trans "Emergency Contact Name" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.emergency_contact_name|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="finger-print-outline"></ion-icon>
|
|
<span>{% trans "Emergency Contact Relation" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.emergency_contact_relation|default:_("None")}}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-12 col-md-12 col-lg-8">
|
|
<div class="oh-card oh-card--margin">
|
|
<div class="oh-tabs">
|
|
<ul class="oh-tabs__tablist">
|
|
<li class="oh-tabs__tab oh-tabs__tab--active" data-target="#tab_1">
|
|
<div>
|
|
<img src="{% static 'images/ui/work-info.png' %}" alt=""
|
|
style="width: 25px; height: 25px; margin-right: 3px;opacity: 0.7" />
|
|
{% trans "Work Information" %}
|
|
</div>
|
|
</li>
|
|
|
|
{% if "payroll"|app_installed %}
|
|
{% if perms.employee.view_employee or perms.payroll.view_contract or request.user == employee.employee_user_id %}
|
|
<li class="oh-tabs__tab" data-target="#tab_2">
|
|
<div>
|
|
<img src="{% static 'images/ui/contract.png' %}" alt=""
|
|
style="width: 25px; height: 25px; margin-right: 3px" />
|
|
{% trans "Contract details" %}
|
|
</div>
|
|
</li>
|
|
{% endif %}
|
|
{% endif %}
|
|
</ul>
|
|
<div class="oh-tabs__contents" id="view-container">
|
|
<div class="oh-tabs__content oh-tabs__content--active" id="tab_1">
|
|
<div class="oh-card__header">
|
|
<span class="oh-card__title oh-card__title--sm fw-bold me-2">{% trans "Work Information" %}</span>
|
|
</div>
|
|
<div class="oh-card__body mt-4">
|
|
<div class="row">
|
|
<div class="col-12 col-sm-12 col-md-12 col-lg-6">
|
|
<ul class="oh-profile__card-info-list">
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="construct-outline"></ion-icon>
|
|
<span>{% trans "Department" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.department_id|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="time-outline"></ion-icon>
|
|
<span>{% trans "Shift Information" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.shift_id|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="briefcase-outline"></ion-icon>
|
|
<span>{% trans "Employee Type" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.employee_type_id|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="person-circle-outline"></ion-icon>
|
|
<span>{% trans "Reporting Manager" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.reporting_manager_id|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="business-outline"></ion-icon>
|
|
<span>{% trans "Work Location" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.location|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="calendar-outline"></ion-icon>
|
|
<span>{% trans "End Date" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value dateformat_changer">{{employee.employee_work_info.contract_end_date|default:_("None")}}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="col-12 col-sm-12 col-md-12 col-lg-6">
|
|
<ul class="oh-profile__card-info-list">
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="briefcase-outline"></ion-icon>
|
|
<span>{% trans "Job Position" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.job_position_id|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="time-outline"></ion-icon>
|
|
<span>{% trans "Work Type" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.work_type_id|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="cash-outline"></ion-icon>
|
|
<span>{% trans "Salary" %}</span>
|
|
</span>
|
|
{% if employee.employee_work_info.basic_salary %}
|
|
<span class="oh-profile__info-value">
|
|
{% if perms.employee.view_employee or request.user == employee.employee_user_id %}
|
|
{{employee.employee_work_info.basic_salary}}
|
|
{% else %}
|
|
**********
|
|
{% endif %}
|
|
</span>
|
|
{% else %}
|
|
<span class="oh-profile__info-value">{% trans "None" %}</span>
|
|
{% endif %}
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="business-outline"></ion-icon>
|
|
<span>{% trans "Company" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_work_info.company_id|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="calendar-outline"></ion-icon>
|
|
<span>{% trans "Joining Date" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value dateformat_changer">{{employee.employee_work_info.date_joining|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="business-outline"></ion-icon>
|
|
<span>{% trans "Tags" %}</span>
|
|
</span>
|
|
<div style="display: flex; flex-wrap: wrap;">
|
|
{% if employee.employee_work_info.tags.all %}
|
|
{% for i in employee.employee_work_info.tags.all %}
|
|
{% with tag_width=i.title|length %}
|
|
<span class="oh-profile__info-value mt-1 mb-1 mr-1"
|
|
style="background-color: {{ i.color }};
|
|
font-size: .8rem; padding: 4px 10px; border-radius: 18px; font-weight: 600; width: {{ tag_width }}em;">{{ i.title }}</span>
|
|
{% endwith %}
|
|
{% endfor %}
|
|
{% else %}
|
|
<span class="oh-profile__info-value dateformat_changer">{% trans "None" %}</span>
|
|
{% endif %}
|
|
</div>
|
|
</li>
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% if perms.employee.view_employee or perms.payroll.view_contract or request.user == employee.employee_user_id %}
|
|
{% if "payroll"|app_installed %}
|
|
<div class="oh-tabs__content" id="tab_2">
|
|
{% include "tabs/contract-tab.html" %}
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% if perms.employee.view_employeebankdetails or request.user == employee.employee_user_id %}
|
|
<div class="oh-card oh-card--margin">
|
|
<div class="oh-card__header">
|
|
<span class="oh-card__title oh-card__title--sm fw-bold me-2">{% trans "Bank Information" %}</span>
|
|
</div>
|
|
<div class="oh-card__body mt-4">
|
|
<div class="row">
|
|
<div class="col-12 col-sm-12 col-md-12 col-lg-6">
|
|
<ul class="oh-profile__card-info-list">
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="business-outline"></ion-icon>
|
|
<span>{% trans "Bank Name" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_bank_details.bank_name|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="location-outline"></ion-icon>
|
|
<span>{% trans "Branch" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_bank_details.branch|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="map-outline"></ion-icon>
|
|
<span>{% trans "Bank Address" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_bank_details.address|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="information-outline"></ion-icon>
|
|
<span>{% trans "Bank Code" %} #2</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_bank_details.any_other_code2|default:_("None")}}</span>
|
|
</li>
|
|
|
|
</ul>
|
|
</div>
|
|
<div class="col-12 col-sm-12 col-md-12 col-lg-6">
|
|
<ul class="oh-profile__card-info-list">
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="information-circle-outline"></ion-icon>
|
|
<span>{% trans "Account Number" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_bank_details.account_number|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="information-outline"></ion-icon>
|
|
<span>{% trans "Bank Code" %} #1</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_bank_details.any_other_code1|default:_("None")}}</span>
|
|
</li>
|
|
|
|
<li class="oh-profile__card-info-item">
|
|
<span class="oh-profile__info-label mb-1">
|
|
<ion-icon name="flag-outline"></ion-icon>
|
|
<span>{% trans "Country" %}</span>
|
|
</span>
|
|
<span
|
|
class="oh-profile__info-value">{{employee.employee_bank_details.country|default:_("None")}}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<script>
|
|
$(document).ready(function () {
|
|
$(".oh-tabs__tab[data-target]").click(function (e) {
|
|
e.preventDefault();
|
|
var newActiveTab = $(this).attr("data-target");
|
|
$(".oh-tabs__content--active").toggleClass("oh-tabs__content--active");
|
|
$(".oh-tabs__tab--active").toggleClass("oh-tabs__tab--active");
|
|
$(`[data-target="${newActiveTab}"]`).toggleClass("oh-tabs__tab--active");
|
|
$(newActiveTab).toggleClass("oh-tabs__content--active");
|
|
});
|
|
});
|
|
</script>
|