343 lines
11 KiB
PHP
343 lines
11 KiB
PHP
<?php
|
|
|
|
// // Crea la connessione
|
|
// $conn = new mysqli($servername, $username, $password, $database);
|
|
|
|
// // Controlla la connessione
|
|
// if ($conn->connect_error) {
|
|
// die("Connessione fallita: " . $conn->connect_error);
|
|
// }
|
|
|
|
// // Query SQL per estrarre le lingue
|
|
// $sql = "SELECT languagename, languageflag, languageacronym FROM languagesdrop";
|
|
// $result = $conn->query($sql);
|
|
|
|
// $languages = [];
|
|
// if ($result->num_rows > 0) {
|
|
// while($row = $result->fetch_assoc()) {
|
|
// $languages[] = $row;
|
|
// }
|
|
// }
|
|
?>
|
|
<!-- Top Bar Start -->
|
|
<div class="topbar">
|
|
|
|
<style>
|
|
/* Basic reset for styling */
|
|
* {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
/* Notification card container */
|
|
.notification-card {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 15px;
|
|
border-radius: 8px;
|
|
margin: 10px 0;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
color: #fff;
|
|
font-family: Arial, sans-serif;
|
|
}
|
|
|
|
/* Icon styling */
|
|
.notification-icon {
|
|
font-size: 24px;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
/* Content styling */
|
|
.notification-content {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
gap: 20px;
|
|
}
|
|
|
|
.notification-title {
|
|
font-weight: bold;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.notification-details,
|
|
.notification-rating {
|
|
font-size: 14px;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
/* Green (Success) Notification */
|
|
.notification-green {
|
|
background-color: #4CAF50;
|
|
border-left: 5px solid #388E3C;
|
|
}
|
|
|
|
/* Red (Fail) Notification */
|
|
.notification-red {
|
|
background-color: #f44336;
|
|
border-left: 5px solid #d32f2f;
|
|
}
|
|
|
|
/* Yellow (Warning) Notification */
|
|
.notification-yellow {
|
|
background-color: #ff9800;
|
|
border-left: 5px solid #f57c00;
|
|
}
|
|
|
|
/* Notification hover effect */
|
|
.notification-card:hover {
|
|
transform: scale(1.02);
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
.notification-show {
|
|
animation: slideIn 0.5s ease-out forwards;
|
|
/* Entry animation */
|
|
}
|
|
|
|
.notification-hide {
|
|
animation: fadeOut 0.5s ease-out forwards;
|
|
/* Exit animation */
|
|
}
|
|
|
|
/* Animation keyframes */
|
|
@keyframes slideIn {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(-30px);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes fadeOut {
|
|
from {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
|
|
to {
|
|
opacity: 0;
|
|
transform: translateY(30px);
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<nav class="navbar-custom">
|
|
|
|
|
|
<ul class="list-inline float-right mb-0">
|
|
<!-- language-->
|
|
<!-- <li class="list-inline-item dropdown notification-list hide-phone">
|
|
<a class="nav-link dropdown-toggle arrow-none waves-effect text-white" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false">
|
|
English <img src="<?php echo USERAREA_PATH; ?>assets/images/flags/us_flag.jpg" class="ml-2" height="16" alt="" />
|
|
</a>
|
|
<div class="dropdown-menu dropdown-menu-right language-switch">
|
|
<a class="dropdown-item" href="#"><img src="<?php echo USERAREA_PATH; ?>assets/images/flags/italy_flag.jpg" alt="" height="16" /><span> Italian </span></a>
|
|
<a class="dropdown-item" href="#"><img src="<?php echo USERAREA_PATH; ?>assets/images/flags/french_flag.jpg" alt="" height="16" /><span> French </span></a>
|
|
<a class="dropdown-item" href="#"><img src="<?php echo USERAREA_PATH; ?>assets/images/flags/spain_flag.jpg" alt="" height="16" /><span> Spanish </span></a>
|
|
<a class="dropdown-item" href="#"><img src="<?php echo USERAREA_PATH; ?>assets/images/flags/russia_flag.jpg" alt="" height="16" /><span> Russian </span></a>
|
|
</div>
|
|
</li> -->
|
|
<li class="list-inline-item dropdown notification-list">
|
|
<a class="nav-link dropdown-toggle arrow-none waves-effect" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false">
|
|
<i class="dripicons-mail noti-icon"></i>
|
|
<span class="badge badge-danger noti-icon-badge">5</span>
|
|
</a>
|
|
<div class="dropdown-menu dropdown-menu-right dropdown-arrow dropdown-menu-lg">
|
|
<!-- item-->
|
|
<div class="dropdown-item noti-title">
|
|
<h5><span class="badge badge-danger float-right">745</span>Messages</h5>
|
|
</div>
|
|
|
|
<!-- item-->
|
|
<a href="javascript:void(0);" class="dropdown-item notify-item">
|
|
<div class="notify-icon"><img src="<?php echo USERAREA_PATH; ?>assets/images/users/avatar-2.jpg" alt="user-img" class="img-fluid rounded-circle" /> </div>
|
|
<p class="notify-details"><b>Charles M. Jones</b><small class="text-muted">Dummy text of the printing and typesetting industry.</small></p>
|
|
</a>
|
|
|
|
<!-- item-->
|
|
<a href="javascript:void(0);" class="dropdown-item notify-item">
|
|
<div class="notify-icon"><img src="<?php echo USERAREA_PATH; ?>assets/images/users/avatar-3.jpg" alt="user-img" class="img-fluid rounded-circle" /> </div>
|
|
<p class="notify-details"><b>Thomas J. Mimms</b><small class="text-muted">You have 87 unread messages</small></p>
|
|
</a>
|
|
|
|
<!-- item-->
|
|
<a href="javascript:void(0);" class="dropdown-item notify-item">
|
|
<div class="notify-icon"><img src="<?php echo USERAREA_PATH; ?>assets/images/users/avatar-4.jpg" alt="user-img" class="img-fluid rounded-circle" /> </div>
|
|
<p class="notify-details"><b>Luis M. Konrad</b><small class="text-muted">It is a long established fact that a reader will</small></p>
|
|
</a>
|
|
|
|
<!-- All-->
|
|
<a href="javascript:void(0);" class="dropdown-item notify-item notify-all">
|
|
View All
|
|
</a>
|
|
|
|
</div>
|
|
</li>
|
|
|
|
<li class="list-inline-item dropdown notification-list">
|
|
<a class="nav-link dropdown-toggle arrow-none waves-effect" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false">
|
|
<i class="dripicons-bell noti-icon"></i>
|
|
<span class="badge badge-success noti-icon-badge" id="notificationQuantity"></span>
|
|
</a>
|
|
<div class="dropdown-menu dropdown-menu-right dropdown-arrow dropdown-menu-lg">
|
|
<!-- item-->
|
|
<div class="dropdown-item noti-title">
|
|
<h5><span class="badge badge-danger float-right" id="notificationQuantityDropDown"></span>Notification</h5>
|
|
</div>
|
|
|
|
<!-- item-->
|
|
<div id="notificationItemDiv">
|
|
|
|
</div>
|
|
<!-- <a href="javascript:void(0);" class="dropdown-item notify-item">
|
|
<div class="notify-icon bg-primary"><i class="mdi mdi-cart-outline"></i></div>
|
|
<p class="notify-details"><b>Your order is placed</b><small class="text-muted">Dummy text of the printing and typesetting industry.</small></p>
|
|
</a> -->
|
|
|
|
<!-- All-->
|
|
<a href="<?php echo USERAREA_PATH; ?>notifications/notifications.php" class="dropdown-item notify-item notify-all">
|
|
View All
|
|
</a>
|
|
|
|
</div>
|
|
</li>
|
|
|
|
<li class="list-inline-item dropdown notification-list">
|
|
<a class="nav-link dropdown-toggle arrow-none waves-effect nav-user" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false">
|
|
<img src="<?php echo USERAREA_PATH; ?>assets/images/users/avatar-6.jpg" alt="user" class="rounded-circle">
|
|
</a>
|
|
<div class="dropdown-menu dropdown-menu-right profile-dropdown ">
|
|
<!-- item-->
|
|
<div class="dropdown-item noti-title">
|
|
<h5>Welcome</h5>
|
|
</div>
|
|
<a class="dropdown-item" href="<?php echo BASE_URL; ?>profile"><i class="mdi mdi-account-circle m-r-5 text-muted"></i> <?php echo $userprofile; ?></a>
|
|
<a class="dropdown-item" href="#"><i class="mdi mdi-wallet m-r-5 text-muted"></i> <?php echo $mycompany; ?></a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
<a class="dropdown-item" href="<?php echo BASE_URL; ?>logout"><i class="mdi mdi-logout m-r-5 text-muted"></i> <?php echo $logoutbutton; ?></a>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<ul class="list-inline menu-left mb-0">
|
|
<li class="float-left">
|
|
<button class="button-menu-mobile open-left waves-light waves-effect">
|
|
<i class="mdi mdi-menu"></i>
|
|
</button>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
<div class="clearfix"></div>
|
|
|
|
</nav>
|
|
|
|
|
|
|
|
<script>
|
|
setInterval(() => {
|
|
$.post("<?php echo USERAREA_PATH; ?>include/checkNotifications.php", {
|
|
method: 'show_notification'
|
|
}, function(data) {
|
|
// Clear any previous notifications
|
|
$('#mainNotificationDiv').empty();
|
|
|
|
data.forEach(notification => {
|
|
// Define variables for the color and icon based on reportsRating
|
|
let notificationColor, notificationIcon;
|
|
|
|
if (notification.reportsRating === "Pass") {
|
|
notificationColor = "green";
|
|
notificationIcon = "✅"; // success icon
|
|
} else if (notification.reportsRating === "Fail") {
|
|
notificationColor = "red";
|
|
notificationIcon = "❌"; // error icon
|
|
} else {
|
|
notificationColor = "orange";
|
|
notificationIcon = "⚠️"; // warning icon
|
|
}
|
|
|
|
// Create the notification element with styling and content
|
|
const notificationElement = $(`
|
|
<div class="notification" style="background-color: ${notificationColor}; color: white; padding: 10px; margin-top: 5px; border-radius: 5px; display: none;">
|
|
<span class="icon">${notificationIcon}</span>
|
|
<span class="text">Report ${notification.idreports}: ${notification.products_refnumber} - ${notification.reportsRating}</span>
|
|
</div>
|
|
`);
|
|
|
|
// Append the notification to the main div
|
|
$('#mainNotificationDiv').append(notificationElement);
|
|
|
|
// Show notification with animation
|
|
notificationElement.fadeIn();
|
|
|
|
// Remove the notification after 10 seconds with animation
|
|
setTimeout(() => {
|
|
notificationElement.fadeOut(function() {
|
|
$(this).remove();
|
|
});
|
|
|
|
// Update the notification as seen
|
|
$.post("<?php echo USERAREA_PATH; ?>include/checkNotifications.php", {
|
|
method: 'update_notification',
|
|
idreports: notification.idreports
|
|
}, function(data) {
|
|
console.log(data);
|
|
});
|
|
}, 10000);
|
|
});
|
|
});
|
|
}, 11000);
|
|
|
|
|
|
setInterval(() => {
|
|
|
|
getNotifications();
|
|
}, 10000);
|
|
|
|
|
|
|
|
function getNotifications() {
|
|
$.post("<?php echo USERAREA_PATH; ?>include/getNotifications.php", {
|
|
method: 'getNotifications'
|
|
}, function(data) {
|
|
unseen_notifications =data.unseen_notifications;
|
|
$("#notificationQuantity").text(unseen_notifications.length);
|
|
$("#notificationQuantityDropDown").text(unseen_notifications.length);
|
|
|
|
$("#notificationItemDiv").empty();
|
|
|
|
for(var i=0; i<data.unseen_notifications.length; i++){
|
|
$("#notificationItemDiv").append(`
|
|
<a href="javascript:void(0);" class="dropdown-item notify-item">
|
|
<div class="notify-icon bg-primary">
|
|
<i class="mdi mdi-settings"></i>
|
|
</div>
|
|
<p class="notify-details"><b>${unseen_notifications[i]['title']}</b><small class="text-muted">${unseen_notifications[i]['description']}</small></p>
|
|
</a>
|
|
`);
|
|
}
|
|
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<div class="notification-space" id="mainNotificationDiv">
|
|
<!-- Notifications will be displayed here -->
|
|
</div>
|
|
|
|
<script src="<?php echo USERAREA_PATH;?>assets/js/popper.min.js"></script>
|
|
<script src="<?php echo USERAREA_PATH;?>assets/js/bootstrap.min.js"></script>
|
|
|
|
<script src="../assets/js/jquery.slimscroll.js"></script>
|
|
<!-- App js -->
|
|
<script src="<?php echo USERAREA_PATH;?>assets/js/app.js"></script>
|
|
<script src="<?php echo USERAREA_PATH;?>assets/plugins/alertify/js/alertify.js"></script>
|
|
<!-- Top Bar End -->
|