Activate UIUX V2 navigation for staff pilot

This commit is contained in:
A R R R Associates
2026-07-10 15:50:46 +05:30
parent 3daf9f931d
commit 7413d0dd7d
3 changed files with 74 additions and 38 deletions
@@ -1,38 +1,2 @@
{% set current_path = request.url.path %} {# UI/UX V2 Phase 1B — Staff pilot. Existing URLs and permission checks are preserved in the shared component. #}
{% set _tab_base = "inline-flex shrink-0 items-center rounded-xl px-3 py-2 text-sm font-semibold whitespace-nowrap transition" %} {% include "ui/templates/components/staff_navigation_v2.html" %}
{% set _tab_active = "bg-brand-600 text-white shadow-soft" %}
{% set _tab_idle = "border border-slate-300 bg-white text-slate-700 hover:bg-slate-50" %}
<div class="rounded-2xl border border-slate-200 bg-white p-3 shadow-soft">
<div class="mb-2 px-1 text-xs font-semibold uppercase tracking-wide text-slate-500">My Workspace</div>
<div class="overflow-x-auto pb-1">
<div class="flex min-w-max flex-nowrap gap-2">
{% if can_view_employee_portal(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/dashboard" class="{{ _tab_base }} {{ _tab_active if current_path == '/employee/dashboard' else _tab_idle }}">Overview</a>
{% endif %}
{% if can_view_own_employee_work(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/work" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/employee/work') else _tab_idle }}">My Work Board</a>
{% endif %}
{% if can_view_own_employee_attendance(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/attendance" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/employee/attendance') else _tab_idle }}">My Attendance</a>
{% endif %}
{% if can_view_employee_portal(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/profile" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/employee/profile') else _tab_idle }}">My Profile</a>
{% endif %}
{% if can_view_own_employee_leave(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/leave" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/employee/leave') else _tab_idle }}">My Leave</a>
{% endif %}
{% if can_view_own_employee_documents(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/documents" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/employee/documents') else _tab_idle }}">My Documents</a>
{% endif %}
{% if can_view_own_employee_payslips(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/payslips" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/employee/payslips') else _tab_idle }}">My Payslips</a>
{% endif %}
{% if can_request_own_employee_offboarding(current_user, current_user_permissions, current_user_roles) %}
<a href="/employee/offboarding" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/employee/offboarding') else _tab_idle }}">My Offboarding</a>
{% endif %}
<a href="/alerts" class="{{ _tab_base }} {{ _tab_active if current_path.startswith('/alerts') else _tab_idle }}">
My Alert{% if unread_alert_count is defined and unread_alert_count > 0 %}<span class="ml-2 rounded-full bg-white/20 px-2 py-0.5 text-[10px]">{{ unread_alert_count }}</span>{% endif %}
</a>
</div>
</div>
</div>
@@ -1,6 +1,7 @@
{% extends "ui/templates/base/layout.html" %} {% extends "ui/templates/base/layout.html" %}
{% block content %} {% block content %}
<div class="space-y-6" id="employee-portal-root"> <div class="space-y-6" id="employee-portal-root">
{% include "ui/templates/components/staff_navigation_v2.html" %}
<section class="overflow-hidden rounded-3xl border border-slate-200 bg-white shadow-soft"> <section class="overflow-hidden rounded-3xl border border-slate-200 bg-white shadow-soft">
<div class="bg-gradient-to-r from-brand-700 via-brand-600 to-slate-900 px-6 py-6 text-white"> <div class="bg-gradient-to-r from-brand-700 via-brand-600 to-slate-900 px-6 py-6 text-white">
<div class="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between"> <div class="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
@@ -0,0 +1,71 @@
{#
UI/UX V2 Phase 1B — Staff pilot navigation
This component deliberately reuses the existing employee self-service
permission helpers and URLs. It does not grant access, change routes, or
replace dashboard content tabs.
#}
{% set _staff_path = request.url.path %}
{% set navigation_aria_label_v2 = 'Staff workspace navigation' %}
{% set navigation_items_v2 = [
{
'label': 'Dashboard',
'url': '/employee/dashboard',
'visible': can_view_employee_portal(current_user, current_user_permissions, current_user_roles),
'active': _staff_path == '/employee/dashboard'
},
{
'label': 'Work',
'url': '/employee/work',
'visible': can_view_own_employee_work(current_user, current_user_permissions, current_user_roles),
'active': _staff_path.startswith('/employee/work')
},
{
'label': 'Attendance',
'url': '/employee/attendance',
'visible': can_view_own_employee_attendance(current_user, current_user_permissions, current_user_roles),
'active': _staff_path.startswith('/employee/attendance')
},
{
'label': 'Leave',
'url': '/employee/leave',
'visible': can_view_own_employee_leave(current_user, current_user_permissions, current_user_roles),
'active': _staff_path.startswith('/employee/leave')
},
{
'label': 'Documents',
'url': '/employee/documents',
'visible': can_view_own_employee_documents(current_user, current_user_permissions, current_user_roles),
'active': _staff_path.startswith('/employee/documents')
},
{
'label': 'Payslips',
'url': '/employee/payslips',
'visible': can_view_own_employee_payslips(current_user, current_user_permissions, current_user_roles),
'active': _staff_path.startswith('/employee/payslips')
},
{
'label': 'Offboarding',
'url': '/employee/offboarding',
'visible': can_request_own_employee_offboarding(current_user, current_user_permissions, current_user_roles),
'active': _staff_path.startswith('/employee/offboarding')
},
{
'label': 'Profile',
'url': '/employee/profile',
'visible': can_view_employee_portal(current_user, current_user_permissions, current_user_roles),
'active': _staff_path.startswith('/employee/profile')
},
{
'label': 'Alerts',
'url': '/alerts',
'visible': true,
'active': _staff_path.startswith('/alerts'),
'badge': unread_alert_count if unread_alert_count is defined and unread_alert_count > 0 else none
}
] %}
<div class="mb-6 overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-soft" data-uiux-v2-pilot="staff">
{% include "ui/templates/components/navigation_v2.html" %}
{% include "ui/templates/components/mobile_navigation_v2.html" %}
</div>