Valider
This commit is contained in:
parent
80106c6f75
commit
a6668e8162
696
Bootstrap_new/css/style_office.css
Normal file
696
Bootstrap_new/css/style_office.css
Normal file
|
|
@ -0,0 +1,696 @@
|
||||||
|
/* Style Office pour le Portail RH*/
|
||||||
|
:root {
|
||||||
|
/* PowerPoint/Office 2019 Color Palette */
|
||||||
|
--office-primary: #b7472a; /* Sidebar color - PowerPoint accent */
|
||||||
|
--office-secondary: #2b579a; /* Header/buttons - Office blue */
|
||||||
|
--office-accent: #107c10; /* Success/active states - Excel green */
|
||||||
|
--office-light: #f3f3f3; /* Background - Office gray */
|
||||||
|
--office-dark: #323130; /* Text color */
|
||||||
|
--office-border: #d0d0d0; /* Borders */
|
||||||
|
--office-hover: #f0f0f0; /* Hover states */
|
||||||
|
--office-card: #ffffff; /* Card backgrounds */
|
||||||
|
|
||||||
|
--sidebar-width: 260px;
|
||||||
|
--sidebar-collapsed: 70px;
|
||||||
|
--header-height: 64px;
|
||||||
|
--transition-speed: 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Base Styles */
|
||||||
|
body {
|
||||||
|
font-family: 'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif;
|
||||||
|
background-color: var(--office-light);
|
||||||
|
color: var(--office-dark);
|
||||||
|
line-height: 1.5;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header - PowerPoint/Office Style */
|
||||||
|
.app-header {
|
||||||
|
background-color: var(--office-secondary);
|
||||||
|
height: var(--header-height);
|
||||||
|
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||||
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
z-index: 1030;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-logo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-logo img {
|
||||||
|
height: 36px;
|
||||||
|
filter: brightness(0) invert(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sidebar - PowerPoint Orange (#b7472a) */
|
||||||
|
.app-sidebar {
|
||||||
|
width: var(--sidebar-width);
|
||||||
|
background: linear-gradient(180deg, var(--office-primary) 0%, #a53e24 100%);
|
||||||
|
position: fixed;
|
||||||
|
top: var(--header-height);
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: 1020;
|
||||||
|
box-shadow: 2px 0 8px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: width var(--transition-speed) ease;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Subtle pattern overlay for modern look */
|
||||||
|
.app-sidebar::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-image:
|
||||||
|
radial-gradient(circle at 10% 20%, rgba(255, 255, 255, 0.03) 0%, transparent 20%),
|
||||||
|
radial-gradient(circle at 90% 80%, rgba(255, 255, 255, 0.03) 0%, transparent 20%);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar-nav {
|
||||||
|
padding: 24px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-section {
|
||||||
|
margin-bottom: 32px;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-title {
|
||||||
|
color: rgba(255, 255, 255, 0.7);
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
padding: 0 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: rgba(255, 255, 255, 0.85);
|
||||||
|
padding: 12px 16px;
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: 6px;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
color: white;
|
||||||
|
transform: translateX(4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link.active {
|
||||||
|
background-color: rgba(255, 255, 255, 0.15);
|
||||||
|
color: white;
|
||||||
|
font-weight: 500;
|
||||||
|
box-shadow: inset 3px 0 0 white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link i {
|
||||||
|
width: 24px;
|
||||||
|
font-size: 18px;
|
||||||
|
margin-right: 12px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-text {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-badge {
|
||||||
|
background-color: var(--office-accent);
|
||||||
|
color: white;
|
||||||
|
font-size: 11px;
|
||||||
|
padding: 2px 6px;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-arrow {
|
||||||
|
font-size: 12px;
|
||||||
|
opacity: 0.7;
|
||||||
|
transition: transform 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link[aria-expanded="true"] .nav-arrow {
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-submenu {
|
||||||
|
background-color: rgba(0, 0, 0, 0.1);
|
||||||
|
border-radius: 6px;
|
||||||
|
margin-top: 4px;
|
||||||
|
padding: 8px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-submenu .nav-link {
|
||||||
|
padding: 8px 16px 8px 52px;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-submenu .nav-link::before {
|
||||||
|
content: '•';
|
||||||
|
position: absolute;
|
||||||
|
left: 36px;
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Main Content Area */
|
||||||
|
.app-main {
|
||||||
|
margin-left: var(--sidebar-width);
|
||||||
|
padding-top: var(--header-height);
|
||||||
|
min-height: 100vh;
|
||||||
|
transition: margin-left var(--transition-speed) ease;
|
||||||
|
background-color: var(--office-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-area {
|
||||||
|
padding: 24px;
|
||||||
|
max-width: 1400px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Breadcrumb/Navigation Bar */
|
||||||
|
.nav-bar {
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 16px 24px;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
|
||||||
|
border: 1px solid var(--office-border);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tabs {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tab {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 16px;
|
||||||
|
background-color: transparent;
|
||||||
|
color: var(--office-dark);
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
white-space: nowrap;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tab:hover {
|
||||||
|
background-color: var(--office-hover);
|
||||||
|
color: var(--office-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tab.active {
|
||||||
|
background-color: var(--office-secondary);
|
||||||
|
color: white;
|
||||||
|
border-color: var(--office-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tab i {
|
||||||
|
margin-right: 8px;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Content Cards */
|
||||||
|
.content-card {
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
border: 1px solid var(--office-border);
|
||||||
|
margin-bottom: 24px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
background-color: #fafafa;
|
||||||
|
border-bottom: 1px solid var(--office-border);
|
||||||
|
padding: 20px 24px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--office-dark);
|
||||||
|
font-size: 18px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-body {
|
||||||
|
padding: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header Controls */
|
||||||
|
.header-controls {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-btn {
|
||||||
|
background: transparent;
|
||||||
|
border: none;
|
||||||
|
color: white;
|
||||||
|
padding: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
transition: background-color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-btn:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.notification-badge {
|
||||||
|
position: absolute;
|
||||||
|
top: 2px;
|
||||||
|
right: 2px;
|
||||||
|
background-color: var(--office-accent);
|
||||||
|
color: white;
|
||||||
|
font-size: 10px;
|
||||||
|
font-weight: 600;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-menu {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 4px 12px;
|
||||||
|
border-radius: 6px;
|
||||||
|
transition: background-color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-menu:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-avatar {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: linear-gradient(135deg, var(--office-primary), #ff6b35);
|
||||||
|
color: white;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-name {
|
||||||
|
color: white;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-role {
|
||||||
|
color: rgba(255, 255, 255, 0.7);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Context Panel */
|
||||||
|
.context-panel {
|
||||||
|
position: fixed;
|
||||||
|
right: -380px;
|
||||||
|
top: var(--header-height);
|
||||||
|
bottom: 0;
|
||||||
|
width: 380px;
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: -2px 0 12px rgba(0, 0, 0, 0.1);
|
||||||
|
z-index: 1015;
|
||||||
|
transition: right 0.3s ease;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
border-left: 1px solid var(--office-border);
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-panel.open {
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-header {
|
||||||
|
background: linear-gradient(135deg, var(--office-secondary), #1e4a8b);
|
||||||
|
color: white;
|
||||||
|
padding: 20px 24px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-title {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-close {
|
||||||
|
background: transparent;
|
||||||
|
border: none;
|
||||||
|
color: white;
|
||||||
|
font-size: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: background-color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-close:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-body {
|
||||||
|
flex: 1;
|
||||||
|
padding: 24px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-section {
|
||||||
|
margin-bottom: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--office-secondary);
|
||||||
|
margin-bottom: 12px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title i {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-box {
|
||||||
|
background-color: #fafafa;
|
||||||
|
border: 1px solid var(--office-border);
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 16px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #666;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-value {
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: var(--office-dark);
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn {
|
||||||
|
width: 100%;
|
||||||
|
padding: 12px;
|
||||||
|
background-color: white;
|
||||||
|
border: 1px solid var(--office-border);
|
||||||
|
border-radius: 6px;
|
||||||
|
color: var(--office-dark);
|
||||||
|
font-weight: 500;
|
||||||
|
text-align: left;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn:hover {
|
||||||
|
background-color: var(--office-hover);
|
||||||
|
border-color: var(--office-secondary);
|
||||||
|
color: var(--office-secondary);
|
||||||
|
transform: translateX(4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn i {
|
||||||
|
width: 20px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.photo-container {
|
||||||
|
text-align: center;
|
||||||
|
padding: 16px;
|
||||||
|
background-color: #fafafa;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid var(--office-border);
|
||||||
|
}
|
||||||
|
|
||||||
|
.patient-photo {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
border-radius: 8px;
|
||||||
|
object-fit: cover;
|
||||||
|
border: 3px solid white;
|
||||||
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||||||
|
cursor: pointer;
|
||||||
|
transition: transform 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.patient-photo:hover {
|
||||||
|
transform: scale(1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Toggle Button */
|
||||||
|
.context-toggle {
|
||||||
|
position: fixed;
|
||||||
|
right: 24px;
|
||||||
|
bottom: 24px;
|
||||||
|
width: 56px;
|
||||||
|
height: 56px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: linear-gradient(135deg, var(--office-primary), #ff6b35);
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
box-shadow: 0 4px 12px rgba(183, 71, 42, 0.3);
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 20px;
|
||||||
|
z-index: 1010;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-toggle:hover {
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 6px 16px rgba(183, 71, 42, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Test Mode Indicator */
|
||||||
|
.test-indicator {
|
||||||
|
background: linear-gradient(45deg, #ffd700, #ffed4e);
|
||||||
|
color: #8a6d3b;
|
||||||
|
padding: 4px 12px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
margin-left: 12px;
|
||||||
|
animation: pulse 2s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0% { opacity: 1; }
|
||||||
|
50% { opacity: 0.7; }
|
||||||
|
100% { opacity: 1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Language Selector */
|
||||||
|
.language-selector {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
padding: 6px 12px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 4px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.language-selector:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.language-flag {
|
||||||
|
width: 24px;
|
||||||
|
height: 16px;
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Modal Customization */
|
||||||
|
.modal-office .modal-header {
|
||||||
|
background: linear-gradient(135deg, var(--office-secondary), #1e4a8b);
|
||||||
|
color: white;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-office .modal-title {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive Design */
|
||||||
|
@media (max-width: 1200px) {
|
||||||
|
.app-sidebar {
|
||||||
|
width: var(--sidebar-collapsed);
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-main {
|
||||||
|
margin-left: var(--sidebar-collapsed);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-text,
|
||||||
|
.nav-title,
|
||||||
|
.nav-badge,
|
||||||
|
.nav-arrow {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link {
|
||||||
|
justify-content: center;
|
||||||
|
padding: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link i {
|
||||||
|
margin-right: 0;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-submenu .nav-link {
|
||||||
|
padding: 12px;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-submenu .nav-link::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.context-panel {
|
||||||
|
width: 100%;
|
||||||
|
right: -100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.app-sidebar {
|
||||||
|
transform: translateX(-100%);
|
||||||
|
width: var(--sidebar-width);
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-sidebar.open {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-main {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-content {
|
||||||
|
padding: 0 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-area {
|
||||||
|
padding: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-info {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-text,
|
||||||
|
.nav-title,
|
||||||
|
.nav-badge,
|
||||||
|
.nav-arrow {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Scrollbar Styling */
|
||||||
|
.app-sidebar::-webkit-scrollbar,
|
||||||
|
.context-body::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-sidebar::-webkit-scrollbar-track,
|
||||||
|
.context-body::-webkit-scrollbar-track {
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-sidebar::-webkit-scrollbar-thumb,
|
||||||
|
.context-body::-webkit-scrollbar-thumb {
|
||||||
|
background: rgba(255, 255, 255, 0.3);
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-sidebar::-webkit-scrollbar-thumb:hover,
|
||||||
|
.context-body::-webkit-scrollbar-thumb:hover {
|
||||||
|
background: rgba(255, 255, 255, 0.4);
|
||||||
|
}
|
||||||
|
|
@ -322,6 +322,9 @@ require_once 'Framework/Localisation.php';
|
||||||
$this->requete->getSession()->setAttribut("villeClient_C", $utilisateur['villeClient']);
|
$this->requete->getSession()->setAttribut("villeClient_C", $utilisateur['villeClient']);
|
||||||
$this->requete->getSession()->setAttribut("paysClient_C", $utilisateur['paysClient']);
|
$this->requete->getSession()->setAttribut("paysClient_C", $utilisateur['paysClient']);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$this->requete->getSession()->setAttribut("adherent_C", "");
|
||||||
$this->requete->getSession()->setAttribut("numeroBeneficiaire_C", "");
|
$this->requete->getSession()->setAttribut("numeroBeneficiaire_C", "");
|
||||||
$this->requete->getSession()->setAttribut("nomBeneficiaire_C", "");
|
$this->requete->getSession()->setAttribut("nomBeneficiaire_C", "");
|
||||||
$this->requete->getSession()->setAttribut("prenomsBeneficiaire_C", "");
|
$this->requete->getSession()->setAttribut("prenomsBeneficiaire_C", "");
|
||||||
|
|
|
||||||
0
Societes/radiant/images/logo_etat.png
Normal file → Executable file
0
Societes/radiant/images/logo_etat.png
Normal file → Executable file
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
0
Societes/radiant/images/logo_etat_new.png
Normal file → Executable file
0
Societes/radiant/images/logo_etat_new.png
Normal file → Executable file
|
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 61 KiB |
891
Vue/gabarit.php
891
Vue/gabarit.php
|
|
@ -1,518 +1,371 @@
|
||||||
<?php
|
<?php
|
||||||
|
|
||||||
require_once 'gabarit_queries.php';
|
require_once 'gabarit_queries.php';
|
||||||
$gabary = new Gabary();
|
$gabary = new Gabary();
|
||||||
|
|
||||||
$_SESSION['firstLevelMenu'] = '';
|
$_SESSION['firstLevelMenu'] = '';
|
||||||
$current_url = $_SERVER['REQUEST_URI'];
|
$current_url = $_SERVER['REQUEST_URI'];
|
||||||
$elements = explode("/", $current_url);
|
$elements = explode("/", $current_url);
|
||||||
$activeLink = $elements[1];
|
$activeLink = $elements[1] ?? '';
|
||||||
|
|
||||||
$_SESSION['firstLevelMenu'] = $activeLink;
|
$_SESSION['firstLevelMenu'] = $activeLink;
|
||||||
|
|
||||||
|
|
||||||
const MAX_COMPANY_NAME_LENGTH = 20;
|
|
||||||
|
|
||||||
/*
|
|
||||||
if (strlen($_SESSION['nomSociete']) <= MAX_COMPANY_NAME_LENGTH) {
|
|
||||||
$companyDisplayName = htmlspecialchars($_SESSION['nomSociete'], ENT_QUOTES);
|
$companyDisplayName = htmlspecialchars($_SESSION['nomSociete'], ENT_QUOTES);
|
||||||
} else {
|
$imgData = $_SESSION['photoAssureCrypte'] ?? '';
|
||||||
$companyDisplayName = strtoupper($_SESSION['codeSociete']);
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
$companyDisplayName = htmlspecialchars($_SESSION['nomSociete'], ENT_QUOTES);
|
|
||||||
|
|
||||||
$imgData = $_SESSION['photoAssureCrypte'];
|
|
||||||
?>
|
?>
|
||||||
|
|
||||||
<!doctype html>
|
<!DOCTYPE html>
|
||||||
<html lang="fr">
|
<html lang="fr" data-bs-theme="light">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8"/>
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
|
||||||
<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
||||||
<meta name="format-detection" content="telephone=no">
|
|
||||||
<meta name="msapplication-tap-highlight" content="no">
|
|
||||||
|
|
||||||
<base href="<?= $racineWeb ?>">
|
<base href="<?= $racineWeb ?>">
|
||||||
|
|
||||||
<!-- Favicons -->
|
<title><?= htmlspecialchars($_SESSION['vue'] ?? 'INTER SANTE') ?></title>
|
||||||
<link rel="icon" href="Bootstrap_new/images/new/favicon.ico"/>
|
|
||||||
|
|
||||||
<!-- Google Fonts -->
|
<!-- Bootstrap 5 -->
|
||||||
<link href="https://fonts.gstatic.com" rel="preconnect">
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||||
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Nunito:300,300i,400,400i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
|
|
||||||
|
|
||||||
<!-- Vendor CSS Files -->
|
<!-- Bootstrap Icons -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
|
||||||
|
|
||||||
<link href="Bootstrap/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
<!-- Font Awesome -->
|
||||||
<link href="Bootstrap/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||||
<link href="Bootstrap/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
|
|
||||||
<link href="Bootstrap/vendor/quill/quill.snow.css" rel="stylesheet">
|
|
||||||
<link href="Bootstrap/vendor/quill/quill.bubble.css" rel="stylesheet">
|
|
||||||
<link href="Bootstrap/vendor/remixicon/remixicon.css" rel="stylesheet">
|
|
||||||
<link href="Bootstrap/vendor/simple-datatables/style.css" rel="stylesheet">
|
|
||||||
|
|
||||||
|
<!-- Select2 -->
|
||||||
|
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet">
|
||||||
|
<link href="https://cdn.jsdelivr.net/npm/@ttskch/select2-bootstrap5-theme@1.3.0/dist/select2-bootstrap5.min.css" rel="stylesheet">
|
||||||
|
|
||||||
<link href="Bootstrap_new/css/datatables.min.css" rel="stylesheet">
|
<!-- DataTables -->
|
||||||
<link href="Bootstrap_new/css/select2.min.css" rel="stylesheet">
|
<link href="https://cdn.datatables.net/v/bs5/dt-1.13.6/datatables.min.css" rel="stylesheet">
|
||||||
<link href="Bootstrap/css/style.css?ver=2024.03.14.00" rel="stylesheet">
|
|
||||||
<link href="Bootstrap_new/css/style.css?ver=2025.09.30.06" rel="stylesheet">
|
|
||||||
<link href="Bootstrap_new/select/css/bootstrap-select.min.css" rel="stylesheet">
|
|
||||||
|
|
||||||
<link href="https://cdn.jsdelivr.net/npm/sweetalert2@11.14.1/dist/sweetalert2.min.css" rel="stylesheet">
|
<!-- SweetAlert2 -->
|
||||||
|
<link href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css" rel="stylesheet">
|
||||||
|
|
||||||
<title><?= $_SESSION['vue'] ?></title>
|
<!-- Office/PowerPoint Inspired Styles -->
|
||||||
|
<link href="Bootstrap_new/css/style_office.css?ver=2025.12.20.00" rel="stylesheet">
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script>
|
||||||
var modeDev = <?= $_SESSION['modeDev_C'] ?>;
|
const modeDev = <?= $_SESSION['modeDev_C'] ?? 0 ?>;
|
||||||
if (modeDev!="1")
|
if (modeDev != "1") {
|
||||||
{
|
|
||||||
if (document.addEventListener) {
|
|
||||||
document.addEventListener('contextmenu', function(e) {
|
document.addEventListener('contextmenu', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
}, false);
|
|
||||||
} else {
|
|
||||||
document.attachEvent('oncontextmenu', function () {
|
|
||||||
window.event.returnValue = false;
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Libraries -->
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0"></script>
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-annotation@1.0.2"></script>
|
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
|
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="Bootstrap_new/datatables/datatable.min.css" crossorigin="anonymous">
|
|
||||||
|
|
||||||
<link href="Bootstrap_new/css/custom.css?ver=2024.08.26.02" rel="stylesheet">
|
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" integrity="sha512-Avb2QiuDEEvB4bZJYdft2mNjVShBftLdPG8FJ0V7irTLQ8Uo0qcPxh4Plq7G5tGm0rU+1SPhVotteLpBERwTkw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
||||||
|
|
||||||
<link href="Bootstrap_new/css/style_new.css?ver=2025.11.24.01" rel="stylesheet">
|
|
||||||
<!-- END: webview fixes -->
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<!-- Header -->
|
||||||
|
<header class="app-header">
|
||||||
|
<div class="header-content">
|
||||||
|
<div class="logo-container">
|
||||||
|
<button class="header-btn sidebar-toggle d-lg-none">
|
||||||
|
<i class="bi bi-list"></i>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<a href="#" class="app-logo">
|
||||||
|
<img src="Bootstrap_new/images/new/favicon.png" alt="Inter Santé">
|
||||||
|
<span class="ms-2">INTER SANTÉ</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<?php if($_SESSION['bdTests_C'] == "1"): ?>
|
||||||
|
<div class="test-indicator">
|
||||||
|
<i class="fas fa-flask"></i>
|
||||||
|
<span>MODE TEST</span>
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="header-controls">
|
||||||
|
<!-- Notifications -->
|
||||||
|
<button class="header-btn notification-btn" onclick="pop_messagerie()">
|
||||||
|
<i class="bi bi-bell"></i>
|
||||||
|
<span class="notification-badge" id="notificationCount">0</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Company Info -->
|
||||||
|
<div class="language-selector" onclick="changer_langue()">
|
||||||
<?php
|
<?php
|
||||||
$style = "";
|
$flag = est_anglophone() ? 'england.png' : 'france.png';
|
||||||
$test = "";
|
$lib = est_anglophone() ? 'EN' : 'FR';
|
||||||
$colorTests="";
|
?>
|
||||||
|
<img src="Bootstrap_new/images/<?= $flag ?>" alt="Language" class="language-flag">
|
||||||
|
<span class="text-white"><?= $lib ?></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
$flag = (est_anglophone()) ? 'england.png' : 'france.png';
|
<!-- User Menu -->
|
||||||
$alt = (est_anglophone()) ? 'English' : 'Français';
|
<div class="user-menu dropdown-toggle" data-bs-toggle="dropdown">
|
||||||
$lib = (est_anglophone()) ? 'En' : 'Fr';
|
<div class="user-avatar">
|
||||||
|
<?= $_SESSION['userInitials_C'] ?? 'U' ?>
|
||||||
|
</div>
|
||||||
|
<div class="user-info">
|
||||||
|
<div class="user-name"><?= $_SESSION['utilisateur_C'] ?? _('Utilisateur') ?></div>
|
||||||
|
<div class="user-role"><?= $_SESSION['nomClient_C'] ?? _('Client') ?></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
if($_SESSION['bdTests_C']== "1"){
|
<!-- User Dropdown -->
|
||||||
$colorTests=$_SESSION['colorTests'];
|
<div class="dropdown-menu dropdown-menu-end">
|
||||||
$style = "background-color: $colorTests;";
|
<div class="dropdown-header">
|
||||||
$test = "MODE TEST";
|
<div class="user-avatar mx-auto mb-2">
|
||||||
|
<?= $_SESSION['userInitials_C'] ?? 'U' ?>
|
||||||
|
</div>
|
||||||
|
<div class="text-center">
|
||||||
|
<div class="fw-bold"><?= $_SESSION['utilisateur_C'] ?? _('Utilisateur') ?></div>
|
||||||
|
<small class="text-muted"><?= $_SESSION['nomClient_C'] ?? _('Client') ?></small>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="dropdown-divider"></div>
|
||||||
|
<a class="dropdown-item" href="javascript:change_password()">
|
||||||
|
<i class="fas fa-user-circle me-2"></i> <?= _('Mon compte') ?>
|
||||||
|
</a>
|
||||||
|
<a class="dropdown-item" href="javascript:gerer_messagerie()">
|
||||||
|
<i class="fas fa-envelope me-2"></i> <?= _('Messagerie') ?>
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-divider"></div>
|
||||||
|
<a class="dropdown-item text-danger" href="#">
|
||||||
|
<i class="fas fa-sign-out-alt me-2"></i> <?= _('Déconnexion') ?>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!-- Sidebar -->
|
||||||
|
<aside class="app-sidebar" id="sidebar">
|
||||||
|
<nav class="sidebar-nav">
|
||||||
|
<div class="nav-section">
|
||||||
|
<div class="nav-title"> <?= _('Navigation principale') ?></div>
|
||||||
|
<?php foreach ($menus as $key0 => $menuParent):
|
||||||
|
$menuChildrenLevelOne = $gabary->get_menus_by_parent_code($menuParent['vue']);
|
||||||
|
$isActive = false;
|
||||||
|
|
||||||
|
// Check if any child is active
|
||||||
|
foreach ($menuChildrenLevelOne as $menuChild) {
|
||||||
|
if ((explode('/', $menuChild['lienMenu'])[0] ?? '') == $activeLink) {
|
||||||
|
$isActive = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
|
<div class="nav-item">
|
||||||
<!-- ======= Header ======= -->
|
<?php if (sizeof($menuChildrenLevelOne) > 0): ?>
|
||||||
<header id="header" class="header fixed-top d-flex align-items-center " style="<?=$style?>">
|
<a href="#submenu<?= $key0 ?>"
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
class="nav-link <?= $isActive ? 'active' : '' ?>"
|
||||||
<a class="logo d-flex align-items-center">
|
data-bs-toggle="collapse"
|
||||||
<img src="Bootstrap_new/images/new/favicon.png" alt="Logo Inter santé"/>
|
aria-expanded="<?= $isActive ? 'true' : 'false' ?>">
|
||||||
<span class="d-none d-lg-block">INTER SANTE</span>
|
<i class="<?= $menuParent['icone'] ?>"></i>
|
||||||
|
<span class="nav-text"><?= $menuParent['libeleMenu'] ?></span>
|
||||||
|
<i class="nav-arrow bi bi-chevron-right"></i>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<i id="btn_sidebar" class="bi bi-list toggle-sidebar-btn d-lg-inline-block"></i>
|
<div class="nav-submenu collapse <?= $isActive ? 'show' : '' ?>" id="submenu<?= $key0 ?>">
|
||||||
|
<?php foreach ($menuChildrenLevelOne as $key1 => $menuChild):
|
||||||
<a id="a_deconnect" class="d-flex align-items-center me-4" href="#" title="<?= _("Quitter") ?>">
|
$childActive = (explode('/', $menuChild['lienMenu'])[0] ?? '') == $activeLink;
|
||||||
<i class="bi bi-power me-1" ></i>
|
|
||||||
<span class="d-none d-lg-inline"><?= _("Quitter") ?></span>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a id="a_actualiser" class="d-flex align-items-center" href="javascript:actualiser_page();" title="<?= _("Actualiser la page") ?>">
|
|
||||||
<i class="fas fa-sync-alt me-1" ></i>
|
|
||||||
<span class="d-none d-lg-inline"><?= _("Actualiser") ?></span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<!-- End Logo -->
|
|
||||||
|
|
||||||
|
|
||||||
<nav class="header-nav ms-auto">
|
|
||||||
<ul class="d-flex align-items-center">
|
|
||||||
|
|
||||||
<li class="nav-item">
|
|
||||||
<a title="<?= _("Gestionnaire d'assurance santé");?>" style="margin-left:10px; margin-right:10px;" class="nav-link nav-icon" href="javascript:infos_entite();">
|
|
||||||
|
|
||||||
<img id="lienLogo" src="<?= $_SESSION['lienLogo'] ?>" alt="Logo" style="width:200px;max-height: 60px;" class="rounded-circle">
|
|
||||||
|
|
||||||
<span id="nomSociete" class="d-none d-lg-inline"> <?=$companyDisplayName?> </span>
|
|
||||||
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li class="nav-item dropdown pe-3">
|
|
||||||
<a title="<?= _("Changer la langue actuelle");?>" style="margin-left:12px;" class="nav-link nav-profile d-flex align-items-center pe-0" href="#" data-bs-toggle="dropdown">
|
|
||||||
<?= "<img src='Bootstrap_new/images/$flag' alt='$alt' width='30'>" ?><span class="d-none d-md-block dropdown-toggle ps-2"><?= $lib ?></span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow profile">
|
|
||||||
<li>
|
|
||||||
<a class="dropdown-item d-flex align-items-center" href="javascript:changer_langue();">
|
|
||||||
<i class="fa fa-exchange" aria-hidden="true"></i>
|
|
||||||
<span ><?=_("Changer de langue")?></span>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li class="nav-item dropdown pe-3">
|
|
||||||
<a title="<?= _("Initial utilisateur connecté");?>" style="margin-left:10px; margin-right:10px;" class="nav-link nav-profile d-flex align-items-center pe-0" href="#" data-bs-toggle="dropdown">
|
|
||||||
<span class="initials"> <?php echo $_SESSION['userInitials_C']; ?> </span>
|
|
||||||
<span class="d-none d-md-block dropdown-toggle ps-2"></span>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow profile">
|
|
||||||
<li>
|
|
||||||
<a class="dropdown-item d-flex align-items-center" href="javascript:change_password();">
|
|
||||||
<i class="fa fa-user-circle" aria-hidden="true"></i>
|
|
||||||
<span ><?= $_SESSION['utilisateur_C']; ?></span>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
|
|
||||||
<!-- End Icons Navigation -->
|
|
||||||
</header><!-- End Header -->
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- ======= Sidebar ======= -->
|
|
||||||
|
|
||||||
<aside id="sidebar" class="sidebar">
|
|
||||||
<?php
|
|
||||||
$menuChildrenLevelThree = [];
|
|
||||||
|
|
||||||
if(sizeof($menusvue) > 0) {
|
|
||||||
$current_url = $_SERVER['REQUEST_URI'];
|
|
||||||
$elements = explode("/", $current_url);
|
|
||||||
$activeLink = $elements[1];
|
|
||||||
$menuCount = count($menusvue);
|
|
||||||
$showBurgerMenu = $menuCount > 5;
|
|
||||||
?>
|
?>
|
||||||
|
<a href="<?= $menuChild['lienMenu'] ?>"
|
||||||
<!-- Version desktop (affichage normal) -->
|
class="nav-link <?= $childActive ? 'active' : '' ?>">
|
||||||
<ul class="sidebar-nav desktop-menu" id="sidebar-nav">
|
<?= $menuChild['libeleMenu'] ?>
|
||||||
<?php foreach ($menusvue as $key3 => $menu): ?>
|
|
||||||
<li class="nav-item">
|
|
||||||
<?php if($activeLink === basename($menu['lienMenu'])):?>
|
|
||||||
<a class="nav-link collapsed" href="<?= $menu['lienMenu']; ?>" title="<?= $menu['descriptionMenu']; ?>">
|
|
||||||
<i class="<?= $menu['icone'] ?>" style="color:#2c3e50 !important;"></i>
|
|
||||||
<span style="font-weight:700; color:#2c3e50 !important;"><?= $menu['libeleMenu'] ?></span>
|
|
||||||
<i class="bi bi-chevron-right ms-auto" style="color:#2c3e50 !important;"></i>
|
|
||||||
</a>
|
|
||||||
<?php else:?>
|
|
||||||
<a class="nav-link collapsed" href="<?= $menu['lienMenu']; ?>" title="<?= $menu['descriptionMenu']; ?>">
|
|
||||||
<i class="<?= $menu['icone'] ?>"></i>
|
|
||||||
<span style="font-weight:700"><?= $menu['libeleMenu'] ?></span>
|
|
||||||
<i class="bi bi-chevron-right ms-auto"></i>
|
|
||||||
</a>
|
|
||||||
<?php endif;?>
|
|
||||||
</li>
|
|
||||||
<?php endforeach; ?>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<!-- Version mobile avec menu burger -->
|
|
||||||
<div class="mobile-bottom-nav d-lg-none">
|
|
||||||
<div class="mobile-nav-container">
|
|
||||||
<?php
|
|
||||||
// Afficher seulement les 4 premiers menus + le burger
|
|
||||||
$displayedMenus = array_slice($menusvue, 0, 4);
|
|
||||||
|
|
||||||
foreach ($displayedMenus as $key3 => $menu): ?>
|
|
||||||
<div class="mobile-nav-item">
|
|
||||||
<a class="mobile-nav-link" href="<?php echo $menu['lienMenu']; ?>" title="<?= $menu['descriptionMenu']; ?>">
|
|
||||||
<?php if($activeLink === basename($menu['lienMenu'])):?>
|
|
||||||
<i class="<?= ' '. $menu['icone'] ?> mobile-nav-icon" style="color:#5784BA;"></i>
|
|
||||||
<span class="mobile-nav-label" style="color:#5784BA;"><?= $menu['libeleMenu'] ?></span>
|
|
||||||
<?php else:?>
|
|
||||||
<i class="<?= ' '. $menu['icone'] ?> mobile-nav-icon" style="color:#2c3e50;"></i>
|
|
||||||
<span class="mobile-nav-label" style="color:#2c3e50;"><?= $menu['libeleMenu'] ?></span>
|
|
||||||
<?php endif;?>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<?php endforeach; ?>
|
|
||||||
|
|
||||||
<!-- Menu burger pour les menus supplémentaires -->
|
|
||||||
<?php if ($showBurgerMenu): ?>
|
|
||||||
<div class="mobile-nav-item burger-menu-container">
|
|
||||||
<a class="mobile-nav-link burger-menu-toggle" href="javascript:void(0);" id="burgerMenuToggle">
|
|
||||||
<i class="bi bi-list mobile-nav-icon burger-icon"></i>
|
|
||||||
<span class="mobile-nav-label"><?= _("Plus") ?></span>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<!-- Menu déroulant des menus supplémentaires -->
|
|
||||||
<div class="burger-dropdown-menu" id="burgerDropdown">
|
|
||||||
<?php
|
|
||||||
$additionalMenus = array_slice($menusvue, 4);
|
|
||||||
foreach ($additionalMenus as $menu): ?>
|
|
||||||
<a href="<?php echo $menu['lienMenu']; ?>" class="burger-menu-item">
|
|
||||||
<i class="<?= $menu['icone'] ?>"></i>
|
|
||||||
<span><?= $menu['libeleMenu'] ?></span>
|
|
||||||
</a>
|
</a>
|
||||||
<?php endforeach; ?>
|
<?php endforeach; ?>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<?php else: ?>
|
<?php else: ?>
|
||||||
<!-- Afficher le 5ème menu normalement si exactement 5 menus -->
|
<a href="<?= $menuParent['lienMenu'] ?>" class="nav-link">
|
||||||
<?php if (isset($menusvue[4])): ?>
|
<i class="<?= $menuParent['icone'] ?>"></i>
|
||||||
<div class="mobile-nav-item">
|
<span class="nav-text"><?= $menuParent['libeleMenu'] ?></span>
|
||||||
<a class="mobile-nav-link" href="<?php echo $menusvue[4]['lienMenu']; ?>" title="<?= $menusvue[4]['descriptionMenu']; ?>">
|
|
||||||
<?php if($activeLink === basename($menusvue[4]['lienMenu'])):?>
|
|
||||||
<i class="<?= ' '. $menusvue[4]['icone'] ?> mobile-nav-icon" style="color:#5784BA;"></i>
|
|
||||||
<span class="mobile-nav-label" style="color:#5784BA;"><?= $menusvue[4]['libeleMenu'] ?></span>
|
|
||||||
<?php else:?>
|
|
||||||
<i class="<?= ' '. $menusvue[4]['icone'] ?> mobile-nav-icon" style="color:#2c3e50;"></i>
|
|
||||||
<span class="mobile-nav-label" style="color:#2c3e50;"><?= $menusvue[4]['libeleMenu'] ?></span>
|
|
||||||
<?php endif;?>
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
<?php endif; ?>
|
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
</div>
|
</div>
|
||||||
|
<?php endforeach; ?>
|
||||||
</div>
|
</div>
|
||||||
<?php } ?>
|
</nav>
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
<main id="main" class="main">
|
<!-- Main Content -->
|
||||||
<input class="sr-only" type="text" id="racineWeb" name="racineWeb" value="<?= $racineWeb ?>">
|
<main class="app-main" id="mainContent">
|
||||||
<INPUT class="sr-only" TYPE="text" id="vue" name="vue" value="<?= isset($_SESSION['vue']) ? $_SESSION['vue'] : ''; ?>">
|
<!-- Navigation Tabs -->
|
||||||
|
<div class="content-area">
|
||||||
<input class="sr-only" type="text" id="nomSociete" name="nomSociete" value="<?= $_SESSION['nomSociete'] ?>">
|
<?php if(!empty($menusvue)): ?>
|
||||||
<section class="section main-dashboard">
|
<div class="nav-bar">
|
||||||
<div id="contenu" style="margin-top:-58px;">
|
<div class="nav-tabs">
|
||||||
<div id="div_test_gabarit">
|
<?php foreach ($menusvue as $menu):
|
||||||
|
$isActive = ($_SESSION['vue'] ?? '') == $menu['libeleMenu'];
|
||||||
<?php
|
|
||||||
/*
|
|
||||||
var_dump
|
|
||||||
(
|
|
||||||
array
|
|
||||||
(
|
|
||||||
"dossierLogo" => $_SESSION['dossierLogo'],
|
|
||||||
"dossierAssure" => $_SESSION['dossierAssure'],
|
|
||||||
"lienLogo" => $_SESSION['lienLogo'],
|
|
||||||
)
|
|
||||||
|
|
||||||
);
|
|
||||||
*/
|
|
||||||
?>
|
?>
|
||||||
|
<a href="<?= $menu['lienMenu'] ?>"
|
||||||
|
class="nav-tab <?= $isActive ? 'active' : '' ?>"
|
||||||
|
title="<?= $menu['descriptionMenu'] ?? '' ?>">
|
||||||
|
<i class="bi bi-arrow-right-circle"></i>
|
||||||
|
<?= $menu['libeleMenu'] ?>
|
||||||
|
</a>
|
||||||
|
<?php endforeach; ?>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<!-- Hidden Inputs -->
|
||||||
|
<input type="hidden" id="racineWeb" value="<?= $racineWeb ?>">
|
||||||
|
<input type="hidden" id="dureeSession" value="<?= $_SESSION['dureeSession'] ?>">
|
||||||
|
<input type="hidden" id="nomSociete" value="<?= $_SESSION['nomSociete'] ?>">
|
||||||
|
<input type="hidden" id="nomClient" value="<?= htmlspecialchars($_SESSION['nomClient_C']) ?>">
|
||||||
|
|
||||||
|
<!-- Content Container -->
|
||||||
|
<div class="content-card">
|
||||||
|
<div class="card-body">
|
||||||
|
<div id="contenu">
|
||||||
|
<div id="div_test_gabarit"></div>
|
||||||
<?= $contenu ?>
|
<?= $contenu ?>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
|
|
||||||
</main><!-- End #main -->
|
|
||||||
|
|
||||||
<button class="btn-info-context mb-2" id="showSideNav" title="<?= _("Afficher contexte")?>">
|
|
||||||
<i class="fa-solid fa fa-angle-double-left" style="font-size:24px"></i> <i class="fa fa-cog fa-spin" style="font-size:24px"></i>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<div id="barre_laterale_d" class="col-2 sidenav" >
|
|
||||||
<div class="card shadow-sm p-2">
|
|
||||||
<!--<button class="btn btn-danger" id="hideSideNav"> <?= _("Cacher contexte") ?> <i class="fa-solid fa-arrow-right"></i></button>-->
|
|
||||||
<button class="btn-cacher-contexte mb-3 w-100" id="hideSideNav" title="<?= _("Cacher contexte")?>">
|
|
||||||
<i class="fa fa-cog fa-spin" style="font-size:24px"></i> <i class="fa-solid fa fa-angle-double-right" style="font-size:24px"></i>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<!-- Informations sur le Souscripteur -->
|
|
||||||
<div class="mb-2">
|
|
||||||
<h6 class="text-muted"><?= _("Souscripteur") ?></h6>
|
|
||||||
<textarea rows="2" cols="25" readonly><?= $this->nettoyer($_SESSION['nomClient_C']) ?></textarea>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
<!-- Adhérent et bénéficiaire -->
|
<!-- Context Panel -->
|
||||||
<div class="mb-2">
|
<aside class="context-panel" id="contextPanel">
|
||||||
<button class="btn btn-info btn-sm w-100 text-truncate" onclick="javascript:afficher_adherent_id();" id="numeroAdherent_C" NAME="numeroAdherent_C" title="<?= _("Voir les membres de famille")?>">
|
<div class="context-header">
|
||||||
<i class="fa-solid fa-users"></i> <?= _("Famille")." : ".$this->nettoyer($_SESSION['numeroAdherent_C']) ?>
|
<div class="context-title">
|
||||||
|
<i class="bi bi-info-circle"></i>
|
||||||
|
<span><?= _('Contexte de la session') ?></span>
|
||||||
|
</div>
|
||||||
|
<button class="context-close" onclick="toggleContextPanel()">
|
||||||
|
<i class="bi bi-x-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mb-2">
|
<div class="context-body">
|
||||||
<button class="btn btn-outline-secondary btn-sm w-100 text-truncate" onclick="javascript:afficher_adherent_id();" title="<?= _("Voir les membres de famille")?>">
|
<!-- Souscripteur -->
|
||||||
<?= substr($this->nettoyer($_SESSION['adherent_C']), 0, 25) ?>
|
<div class="context-section">
|
||||||
</button>
|
<div class="section-title">
|
||||||
|
<i class="bi bi-building"></i>
|
||||||
|
<span><?= _('Souscripteur') ?></span>
|
||||||
|
</div>
|
||||||
|
<div class="info-box">
|
||||||
|
<div class="info-value">
|
||||||
|
<?= $this->nettoyer($_SESSION['nomClient_C']) ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mb-2">
|
<!-- Adhérent principal -->
|
||||||
<button class="btn btn-info btn-sm w-100 text-truncate" onclick="javascript:afficher_beneficiaire_id();" id="numeroBeneficiaire_C" NAME="numeroBeneficiaire_C" title="<?= _("Afficher le bénéficiaire")?>">
|
<div class="context-section">
|
||||||
<i class="fa-solid fa-user"></i> <?= _("Bénéficiaire")." : ".$this->nettoyer($_SESSION['numeroBeneficiaire_C']) ?>
|
<div class="section-title">
|
||||||
</button>
|
<i class="bi bi-person-badge"></i>
|
||||||
|
<span><?= _('Assuré principal') ?></span>
|
||||||
|
</div>
|
||||||
|
<div class="info-box">
|
||||||
|
<div class="info-value">
|
||||||
|
<?= $this->nettoyer($_SESSION['adherent_C']) ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mb-2">
|
<!-- Patient -->
|
||||||
<button class="btn btn-outline-secondary btn-sm w-100 text-truncate" onclick="javascript:afficher_beneficiaire_id();" title="<?= _("Afficher le bénéficiaire")?>">
|
<div class="context-section">
|
||||||
<?= substr($this->nettoyer($_SESSION['beneficiaire_C']), 0, 25) ?>
|
<div class="section-title">
|
||||||
</button>
|
<i class="bi bi-person-heart"></i>
|
||||||
|
<span><?= _('Bénéficiaire') ?></span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Photo -->
|
<button class="action-btn" onclick="afficher_beneficiaire_id()">
|
||||||
<div class="photo-container text-center mb-2">
|
<i class="bi bi-person"></i>
|
||||||
<?php if ($_SESSION['faceRegistered_C']=="1" && $_SESSION['idBeneficiaire_C'] > "0"): ?>
|
<span><?= _('Bénéficiaire').' : '.$this->nettoyer($_SESSION['numeroBeneficiaire_C']) ?></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="info-box">
|
||||||
|
<div class="info-value">
|
||||||
|
<?= $this->nettoyer($_SESSION['beneficiaire_C']) ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Photo patient -->
|
||||||
|
<?php if ($_SESSION['faceRegistered_C'] == "1" && ($_SESSION['idBeneficiaire_C'] ?? 0) > 0): ?>
|
||||||
|
<div class="context-section">
|
||||||
|
<div class="section-title">
|
||||||
|
<i class="bi bi-camera"></i>
|
||||||
|
<span><?= _('Photo du bénéficiaire') ?></span>
|
||||||
|
</div>
|
||||||
|
<div class="photo-container">
|
||||||
<img src="data:image/jpg;base64,<?= $imgData ?>"
|
<img src="data:image/jpg;base64,<?= $imgData ?>"
|
||||||
class="img-fluid rounded" style="width: 200px;" data-bs-toggle="modal" data-bs-target="#pop_photo" alt="<?= _("Photo") ?>">
|
class="patient-photo"
|
||||||
|
onclick="openPhotoModal()"
|
||||||
|
alt="<?= _('Photo du bénéficiaire') ?>">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<!-- Actions -->
|
||||||
|
<div class="context-section">
|
||||||
|
<div class="section-title">
|
||||||
|
<i class="bi bi-lightning"></i>
|
||||||
|
<span><?= _('Actions rapides') ?></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button class="action-btn" onclick="gerer_messagerie()">
|
||||||
|
<i class="bi bi-chat-dots"></i>
|
||||||
|
<span><?= _('Gérer les notifications') ?></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button class="action-btn" onclick="change_password()">
|
||||||
|
<i class="bi bi-key"></i>
|
||||||
|
<span><?= _('Changer le mot de passe') ?></span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Messages -->
|
||||||
|
<div id="nbMessagesNonLus" class="d-none">
|
||||||
|
<input type="hidden" id="msgNonLus" value="0">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
<!-- Toggle Button -->
|
||||||
|
<button class="context-toggle" onclick="toggleContextPanel()">
|
||||||
|
<i class="bi bi-info-circle"></i>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Modals -->
|
||||||
|
<!-- Photo Modal -->
|
||||||
|
<div class="modal fade modal-office" id="photoModal" tabindex="-1">
|
||||||
|
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h5 class="modal-title"><?= _('Photo du bénéficiaire') ?></h5>
|
||||||
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body text-center">
|
||||||
|
<?php if ($_SESSION['faceRegistered_C'] == "1"): ?>
|
||||||
|
<img src="data:image/jpg;base64,<?= $imgData ?>"
|
||||||
|
class="img-fluid rounded"
|
||||||
|
style="max-height: 70vh; max-width: 100%;">
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Changer le mot de passe -->
|
|
||||||
<div class="image-container mb-3 text-center">
|
|
||||||
<a href="javascript:change_password();"
|
|
||||||
title="<?= isset($_SESSION['lang']) && $_SESSION['lang']=="en_US" ? 'Change password' : 'Changer le mot de passe' ?>"
|
|
||||||
class="d-inline-block text-decoration-none text-dark">
|
|
||||||
|
|
||||||
|
|
||||||
<div class="p-4 bg-light rounded-circle shadow-sm d-inline-flex justify-content-center align-items-center transition hover-scale">
|
|
||||||
<img src="Bootstrap_new/images/pwd.png" alt="Changer mot de passe" class="img-fluid" style="width:30px;">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Texte sous l’icône -->
|
|
||||||
<div class="mt-2 fw-semibold text-secondary small">
|
|
||||||
<?= isset($_SESSION['lang']) && $_SESSION['lang']=="en_US" ? 'Change Password' : 'Changer le mot de passe' ?>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Bouton Gérer Messages
|
|
||||||
<div class="mb-2">
|
|
||||||
<button class="btn btn-outline-primary btn-sm w-100" onclick="javascript:gerer_messagerie();">
|
|
||||||
<?= _("Gérer Notifications") ?> <i class="fa fa-comments" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="modal fade" id="popmessagerie" role="dialog">
|
|
||||||
<div class="modal-dialog modal-lg">
|
|
||||||
<div class="modal-content">
|
|
||||||
|
|
||||||
<div class="modal-header">
|
|
||||||
<button type="button" class="close" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
|
||||||
<h4 class="modal-title"> <?= _("Notification non lus") ?> </h4>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal-body">
|
|
||||||
<div id="div_messagerie">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button type="button" class="btn btn-default" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Messages Modal -->
|
||||||
<div class="modal fade" id="popmessagerie" role="dialog">
|
<div class="modal fade modal-office" id="messagesModal" tabindex="-1">
|
||||||
<div class="modal-dialog modal-lg">
|
|
||||||
<div class="modal-content">
|
|
||||||
|
|
||||||
<div class="modal-header">
|
|
||||||
<button type="button" class="close" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
|
||||||
<h4 class="modal-title"> <?= _("Messages non lus") ?> </h4>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal-body">
|
|
||||||
<div id="div_messagerie">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button id="btn_close_messagerie" NAME="btn_close_messagerie" type="button" class="btn btn-default" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<button id="btn_pop_messagerie" NAME="btn_pop_messagerie" type="button" class="sr-only" data-bs-toggle="modal" data-bs-target="#popmessagerie"> <?= _("Afficher les notifications non lus...") ?> </button>
|
|
||||||
|
|
||||||
<button id="btn_pop_dernier_messagerie" NAME="btn_pop_dernier_messagerie" class="sr-only" type="button" data-bs-toggle="modal" data-bs-target="#popderniermessagerie"> <?= _("Alerte Réception Message...") ?> </button>
|
|
||||||
|
|
||||||
<div class="modal fade" id="popderniermessagerie" role="dialog">
|
|
||||||
<div class="modal-dialog modal-lg">
|
|
||||||
<div class="modal-content">
|
|
||||||
|
|
||||||
<div class="modal-header">
|
|
||||||
<button type="button" class="close" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
|
||||||
<h4 class="modal-title"> <?= _("Alerte Réception Message...") ?> </h4>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal-body">
|
|
||||||
<div id="div_dernier_messagerie">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button id="btn_close_pop_dernier_messagerie" name="btn_close_pop_dernier_messagerie" type="button" class="btn btn-default" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal fade" id="pop_photo" role="dialog">
|
|
||||||
<div class="modal-dialog modal-lg">
|
<div class="modal-dialog modal-lg">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<button id="btn_close_pop" name="btn_close_pop" type="button" class="close" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
<h5 class="modal-title"><?= _('Notifications non lus') ?></h5>
|
||||||
<h4 class="modal-title"> <?= _("Photo") ?> </h4>
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<img src="data:image/jpg;base64,<?=$imgData?>" style="width: 450px;" >
|
<div id="div_messagerie"></div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button type="button" class="btn btn-default" data-bs-dismiss="modal"> <?= _("Fermer") ?> </button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Vendor JS Files -->
|
<!-- JavaScript Libraries -->
|
||||||
<script src="Bootstrap/vendor/apexcharts/apexcharts.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="Bootstrap/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
|
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
|
||||||
<script src="Bootstrap/vendor/chart.js/chart.umd.js"></script>
|
<script src="https://cdn.datatables.net/v/bs5/dt-1.13.6/datatables.min.js"></script>
|
||||||
<script src="Bootstrap/vendor/echarts/echarts.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
||||||
<script src="Bootstrap/vendor/quill/quill.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||||||
<script src="Bootstrap/vendor/simple-datatables/simple-datatables.js"></script>
|
|
||||||
<script src="Bootstrap/vendor/php-email-form/validate.js"></script>
|
|
||||||
|
|
||||||
<script src="Bootstrap/js/jquery.min.js"></script>
|
<!-- Application Scripts -->
|
||||||
<script src="Bootstrap/js/jquery-ui.js"></script>
|
<script src="Js/fonctions.js?ver=2025.12.20.00"></script>
|
||||||
<script src="Bootstrap/js/timer.jquery.js"></script>
|
|
||||||
|
|
||||||
<script src="Bootstrap_new/js/select2.min.js"></script>
|
|
||||||
<script src="Bootstrap_new/select/js/bootstrap-select.min.js"></script>
|
|
||||||
|
|
||||||
<!-- Template Main JS File -->
|
|
||||||
<script src="Bootstrap/js/main.js"></script>
|
|
||||||
<script src="Bootstrap_new/datatables/datatable.min.js" crossorigin="anonymous"></script>
|
|
||||||
|
|
||||||
<?php if (est_anglophone()): ?>
|
<?php if (est_anglophone()): ?>
|
||||||
<script src="Js/datepicker-eng.js"></script>
|
<script src="Js/datepicker-eng.js"></script>
|
||||||
|
|
@ -520,61 +373,137 @@
|
||||||
<script src="Js/datepicker-fr.js"></script>
|
<script src="Js/datepicker-fr.js"></script>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<script src="Bootstrap/js/sweetalert.min.js"></script>
|
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css" integrity="sha512-3pIirOrwegjM6erE5gPSwkUzO+3cTjpnV9lexlNZqvupR64iZBnOOTiiLPb9M36zpMScbmUNIcHUqKD47M719g==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js" integrity="sha512-VEd+nq25CkR676O+pLBnDW09R7VQX9Mdiij052gVCp5yVH3jGtH70Ho/UUv4mJDsEdTvqRCFZg0NKGiojGnUCw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
||||||
|
|
||||||
<script src="Js/fonctions.js?ver=2025.12.11.00"></script>
|
|
||||||
<script src="Bootstrap/js/bootstrap.min.js"></script>
|
|
||||||
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.14.1/dist/sweetalert2.all.min.js"></script>
|
|
||||||
|
|
||||||
<div id="div_ajaxgabarit">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="nbMessagesNonLus" name="nbMessagesNonLus">
|
|
||||||
<INPUT class='sr-only timer' id="timer" NAME="timer" TYPE="button" value="0">
|
|
||||||
<INPUT class="sr-only" TYPE="text" id="msgNonLus" NAME="msgNonLus" value="0" >
|
|
||||||
<input class="sr-only" type="text" id="deconnexion" name="deconnexion" value="0" >
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
raffraichier_gabarit();
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
$('#timer').timer({
|
|
||||||
duration: '60s',
|
|
||||||
callback: function() {
|
|
||||||
raffraichier_messagerie();
|
|
||||||
},
|
|
||||||
repeat: true
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function() {
|
// DOM Ready
|
||||||
$("#barre_laterale_d").hide()
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
// Toggle Sidebar on Mobile
|
||||||
$("#side_nav").hide()
|
document.querySelector('.sidebar-toggle').addEventListener('click', function() {
|
||||||
|
document.getElementById('sidebar').classList.toggle('open');
|
||||||
$("#barre_laterale_d").hide()
|
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#hideSideNav").on( "click", function() {
|
// Initialize tooltips
|
||||||
$("#barre_laterale_d").hide('slide', {direction: 'right'}, 500)
|
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
|
||||||
|
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||||
|
return new bootstrap.Tooltip(tooltipTriggerEl);
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#showSideNav").on( "click", function() {
|
// Initialize select2
|
||||||
$("#barre_laterale_d").show('slide', {direction: 'right'}, 500)
|
$('.select2').select2({
|
||||||
|
theme: 'bootstrap-5',
|
||||||
|
width: '100%'
|
||||||
});
|
});
|
||||||
$( '#select-field' ).select2( {
|
|
||||||
theme: 'bootstrap-5'
|
// Initialize DataTables
|
||||||
|
$('.datatable').DataTable({
|
||||||
|
responsive: true,
|
||||||
|
language: {
|
||||||
|
url: '//cdn.datatables.net/plug-ins/1.13.6/i18n/fr-FR.json'
|
||||||
|
},
|
||||||
|
dom: '<"row"<"col-sm-12 col-md-6"l><"col-sm-12 col-md-6"f>>' +
|
||||||
|
'<"row"<"col-sm-12"tr>>' +
|
||||||
|
'<"row"<"col-sm-12 col-md-5"i><"col-sm-12 col-md-7"p>>'
|
||||||
|
});
|
||||||
|
|
||||||
|
// Simulate notification count
|
||||||
|
updateNotificationCount();
|
||||||
|
|
||||||
|
// Auto-refresh notifications every 60 seconds
|
||||||
|
setInterval(updateNotificationCount, 60000);
|
||||||
|
|
||||||
|
// Auto-refresh sidebar content
|
||||||
|
setInterval(raffraichier_gabarit, 30000);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Toggle Context Panel
|
||||||
|
function toggleContextPanel() {
|
||||||
|
document.getElementById('contextPanel').classList.toggle('open');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Open Photo Modal
|
||||||
|
function openPhotoModal() {
|
||||||
|
var modal = new bootstrap.Modal(document.getElementById('photoModal'));
|
||||||
|
modal.show();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Show Messages Modal
|
||||||
|
function pop_messagerie() {
|
||||||
|
var modal = new bootstrap.Modal(document.getElementById('messagesModal'));
|
||||||
|
modal.show();
|
||||||
|
|
||||||
|
// Load messages via AJAX
|
||||||
|
$.ajax({
|
||||||
|
url: 'load_messages.php',
|
||||||
|
method: 'GET',
|
||||||
|
success: function(data) {
|
||||||
|
$('#div_messagerie').html(data);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update Notification Count
|
||||||
|
function updateNotificationCount() {
|
||||||
|
// Simulate notification count update
|
||||||
|
// In production, this would be an AJAX call
|
||||||
|
var count = Math.floor(Math.random() * 10);
|
||||||
|
var badge = document.getElementById('notificationCount');
|
||||||
|
badge.textContent = count;
|
||||||
|
badge.style.display = count > 0 ? 'flex' : 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Change Language
|
||||||
|
function changer_langue() {
|
||||||
|
Swal.fire({
|
||||||
|
title: 'Changer de langue',
|
||||||
|
text: 'Sélectionnez la langue souhaitée:',
|
||||||
|
icon: 'question',
|
||||||
|
showCancelButton: true,
|
||||||
|
confirmButtonText: 'Français',
|
||||||
|
cancelButtonText: 'English',
|
||||||
|
reverseButtons: true
|
||||||
|
}).then((result) => {
|
||||||
|
if (result.isConfirmed) {
|
||||||
|
// Switch to French
|
||||||
|
window.location.href = '?lang=fr_FR';
|
||||||
|
} else if (result.dismiss === Swal.DismissReason.cancel) {
|
||||||
|
// Switch to English
|
||||||
|
window.location.href = '?lang=en_US';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Format dates based on locale
|
||||||
|
function formatOfficeDate(dateString) {
|
||||||
|
const date = new Date(dateString);
|
||||||
|
const options = {
|
||||||
|
year: 'numeric',
|
||||||
|
month: 'short',
|
||||||
|
day: 'numeric',
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit'
|
||||||
|
};
|
||||||
|
|
||||||
|
if (est_anglophone()) {
|
||||||
|
return date.toLocaleDateString('en-US', options);
|
||||||
|
} else {
|
||||||
|
return date.toLocaleDateString('fr-FR', options);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close sidebar when clicking outside on mobile
|
||||||
|
document.addEventListener('click', function(event) {
|
||||||
|
const sidebar = document.getElementById('sidebar');
|
||||||
|
const toggleBtn = document.querySelector('.sidebar-toggle');
|
||||||
|
|
||||||
|
if (window.innerWidth < 768 &&
|
||||||
|
!sidebar.contains(event.target) &&
|
||||||
|
!toggleBtn.contains(event.target) &&
|
||||||
|
sidebar.classList.contains('open')) {
|
||||||
|
sidebar.classList.remove('open');
|
||||||
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<!-- AJAX Content Area -->
|
||||||
|
<div id="div_ajaxgabarit"></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Loading…
Reference in New Issue
Block a user