legacy-projects-ispt/ispt4.0_laravel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

QR Code final

Browse Source
This commit is contained in:
Cesário Garcia Mil-Homens 2023-10-13 13:02:03 +01:00
parent 3bf69682fc
commit f9ac80163f
1 changed files with 134 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

203
resources/views/Templates/templateWorkstations.blade.php
View File

@ -9,15 +9,13 @@
<link rel="icon" type="image/x-icon" href="{{ URL::asset('assets/dist/img/favicon.ico') }}"> <link rel="icon" type="image/x-icon" href="{{ URL::asset('assets/dist/img/favicon.ico') }}">
<!-- Google Font: Source Sans Pro --> <!-- Google Font: Source Sans Pro -->
<link rel="stylesheet" <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
<!-- Font Awesome --> <!-- Font Awesome -->
<link rel="stylesheet" href="{{ URL::asset('assets/plugins/fontawesome-free/css/all.min.css') }}"> <link rel="stylesheet" href="{{ URL::asset('assets/plugins/fontawesome-free/css/all.min.css') }}">
<!-- Ionicons --> <!-- Ionicons -->
<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"> <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<!-- Tempusdominus Bootstrap 4 --> <!-- Tempusdominus Bootstrap 4 -->
<link rel="stylesheet" <link rel="stylesheet" href="{{ URL::asset('assets/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css') }}">
href="{{ URL::asset('assets/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css') }}">
<!-- iCheck --> <!-- iCheck -->
<link rel="stylesheet" href="{{ URL::asset('assets/plugins/icheck-bootstrap/icheck-bootstrap.min.css') }}"> <link rel="stylesheet" href="{{ URL::asset('assets/plugins/icheck-bootstrap/icheck-bootstrap.min.css') }}">
<!-- JQVMap --> <!-- JQVMap -->
@ -31,27 +29,26 @@
<!-- summernote --> <!-- summernote -->
<link rel="stylesheet" href="{{ URL::asset('assets/plugins/summernote/summernote-bs4.min.css') }}"> <link rel="stylesheet" href="{{ URL::asset('assets/plugins/summernote/summernote-bs4.min.css') }}">
<style> <style>
[class*=sidebar-dark] .btn-sidebar2, [class*=sidebar-dark] .btn-sidebar2,
[class*=sidebar-dark] .form-control-sidebar2 { [class*=sidebar-dark] .form-control-sidebar2 {
background-color: #3f474e; background-color: #3f474e;
border: 1px solid #56606a; border: 1px solid #56606a;
color: #fff; color: #fff;
} }
</style> </style>
</head> </head>
<body class="hold-transition sidebar-mini layout-fixed"> <body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper"> <div class="wrapper">
<!-- Navbar --> <!-- Navbar -->
<nav class="main-header navbar navbar-expand navbar-white navbar-light" style="background-color: #00B0EA"> <nav class="main-header navbar navbar-expand navbar-white navbar-light" style="background-color: #00B0EA">
<!-- Left navbar links --> <!-- Left navbar links -->
<ul class="navbar-nav"> <ul class="navbar-nav">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars" <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars" style="color:#1f2d3d"></i></a>
style="color:#1f2d3d"></i></a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link"> <a class="nav-link">
@ -81,15 +78,13 @@
<!-- User Dropdown Menu --> <!-- User Dropdown Menu -->
<li class="nav-item dropdown"> <li class="nav-item dropdown">
<a class="nav-link" data-toggle="dropdown" href="#"> <a class="nav-link" data-toggle="dropdown" href="#">
<img src="{{ URL::asset('assets/dist/img/ispt.jpg') }}" class="img-circle elevation-2" <img src="{{ URL::asset('assets/dist/img/ispt.jpg') }}" class="img-circle elevation-2" alt="User Image" style="width:30px;height:30px;">
alt="User Image" style="width:30px;height:30px;">
</a> </a>
<div class="dropdown-menu dropdown-menu-right"> <div class="dropdown-menu dropdown-menu-right">
<form id="logout-form" action="{{ route('logout') }}" method="POST"> <form id="logout-form" action="{{ route('logout') }}" method="POST">
@csrf @csrf
@method('POST') @method('POST')
<a class="dropdown-item" href="{{ route('logout') }}" <a class="dropdown-item" href="{{ route('logout') }}" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
<i class="fas fa-sign-out-alt text-danger"></i> <i class="fas fa-sign-out-alt text-danger"></i>
<span>Terminar sessão</span> <span>Terminar sessão</span>
</a> </a>
@ -98,8 +93,7 @@
</li> </li>
<!-- Control sidebar --> <!-- Control sidebar -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" data-widget="control-sidebar" data-controlsidebar-slide="true" href="#" <a class="nav-link" data-widget="control-sidebar" data-controlsidebar-slide="true" href="#" role="button" style="color:#1f2d3d">
role="button" style="color:#1f2d3d">
<i class="fas fa-bars"></i> <i class="fas fa-bars"></i>
</a> </a>
</li> </li>
@ -111,8 +105,7 @@
<aside class="main-sidebar sidebar-dark-primary elevation-4" style="background-color: #09255C"> <aside class="main-sidebar sidebar-dark-primary elevation-4" style="background-color: #09255C">
<!-- Brand Logo --> <!-- Brand Logo -->
<p class="brand-link"> <p class="brand-link">
<img src="{{ URL::asset('assets/dist/img/ispt40.jpg') }}" alt="Ispt4.0 Logo" <img src="{{ URL::asset('assets/dist/img/ispt40.jpg') }}" alt="Ispt4.0 Logo" class="brand-image img-circle elevation-3" style="opacity: .8">
class="brand-image img-circle elevation-3" style="opacity: .8">
<span class="brand-text font-weight-light">{{ config('app.name') }}</span> <span class="brand-text font-weight-light">{{ config('app.name') }}</span>
</p> </p>
@ -122,8 +115,7 @@ class="brand-image img-circle elevation-3" style="opacity: .8">
<!-- SidebarSearch Form --> <!-- SidebarSearch Form -->
<div class="form-inline"> <div class="form-inline">
<div class="input-group" data-widget="sidebar-search"> <div class="input-group" data-widget="sidebar-search">
<input id="qrtext" class="form-control form-control-sidebar text-white" type="search" <input id="qrtextleft" class="form-control form-control-sidebar text-white" type="search" placeholder="Procurar" aria-label="Search">
placeholder="Procurar" aria-label="Search">
<div class="input-group-append"> <div class="input-group-append">
<button class="btn btn-sidebar"> <button class="btn btn-sidebar">
<i class="fas fa-search fa-fw text-white"></i> <i class="fas fa-search fa-fw text-white"></i>
@ -134,8 +126,7 @@ class="brand-image img-circle elevation-3" style="opacity: .8">
<!-- Sidebar Menu --> <!-- Sidebar Menu -->
<nav class="mt-2"> <nav class="mt-2">
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
data-accordion="false">
<!-- Add icons to the links using the .nav-icon class <!-- Add icons to the links using the .nav-icon class
with font-awesome or any other icon font library --> with font-awesome or any other icon font library -->
<li class="nav-item menu-closed"> <li class="nav-item menu-closed">
@ -148,17 +139,16 @@ class="brand-image img-circle elevation-3" style="opacity: .8">
</a> </a>
<ul class="nav nav-treeview"> <ul class="nav nav-treeview">
@foreach ($equipmentsTodo as $equipmentTodo) @foreach ($equipmentsTodo as $equipmentTodo)
<li class="nav-item"> <li class="nav-item">
{{-- <a href="#" class="nav-link text-white"> {{-- <a href="#" class="nav-link text-white">
<i class="fas fa-tag nav-icon"></i> <i class="fas fa-tag nav-icon"></i>
<p>{{ $equipmentTodo->equipment_tag }}</p> <p>{{ $equipmentTodo->equipment_tag }}</p>
</a> --}} </a> --}}
<a href="{{ route('getEquipmentData', $equipmentTodo->equipment_id) }}" <a href="{{ route('getEquipmentData', $equipmentTodo->equipment_id) }}" class="nav-link text-white">
class="nav-link text-white"> <i class="fas fa-tag nav-icon"></i>
<i class="fas fa-tag nav-icon"></i> <p>{{ $equipmentTodo->equipment_tag }}</p>
<p>{{ $equipmentTodo->equipment_tag }}</p> </a>
</a> </li>
</li>
@endforeach @endforeach
</ul> </ul>
</li> </li>
@ -173,12 +163,12 @@ class="nav-link text-white">
</a> </a>
<ul class="nav nav-treeview"> <ul class="nav nav-treeview">
@foreach ($equipmentsReturned as $equipmentReturned) @foreach ($equipmentsReturned as $equipmentReturned)
<li class="nav-item"> <li class="nav-item">
<a href="#" class="nav-link text-white"> <a href="#" class="nav-link text-white">
<i class="fas fa-tag nav-icon"></i> <i class="fas fa-tag nav-icon"></i>
<p>{{ $equipmentReturned->equipment_tag }}</p> <p>{{ $equipmentReturned->equipment_tag }}</p>
</a> </a>
</li> </li>
@endforeach @endforeach
</ul> </ul>
</li> </li>
@ -217,8 +207,7 @@ class="nav-link text-white">
</div> </div>
<!-- /.content-wrapper --> <!-- /.content-wrapper -->
<footer class="main-footer" style="background-color: #00B0EA"> <footer class="main-footer" style="background-color: #00B0EA">
<strong>Copyright &copy; 2017-{{ date('Y') }} <a href="https://www.isptgroup.com" <strong>Copyright © 2017-{{ date('Y') }} <a href="https://www.isptgroup.com" target="_blank">ISPT - Industrial Services,
target="_blank">ISPT - Industrial Services,
SA</a>.</strong> SA</a>.</strong>
Todos os direitos reservados. Todos os direitos reservados.
<div class="float-right d-none d-sm-inline-block"> <div class="float-right d-none d-sm-inline-block">
@ -227,7 +216,7 @@ class="nav-link text-white">
</footer> </footer>
{{-- <footer class="main-footer"> {{-- <footer class="main-footer">
<strong>Copyright &copy; 2017-2022 <a href="#">ISPT - Industrial Services, SA</a>.</strong> <strong>Copyright © 2017-2022 <a href="#">ISPT - Industrial Services, SA</a>.</strong>
Todos os direitos reservados. Todos os direitos reservados.
<div class="float-right d-none d-sm-inline-block"> <div class="float-right d-none d-sm-inline-block">
<b>Versão</b> 1.0 <b>Versão</b> 1.0
@ -235,15 +224,14 @@ class="nav-link text-white">
</footer> --}} </footer> --}}
<!-- Control Sidebar --> <!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark" style="background-color: #09255C"> <aside class="control-sidebar control-sidebar-dark" data-widget="control-treeview" style="background-color: #09255C">
<!-- Control sidebar content goes here --> <!-- Control sidebar content goes here -->
<div class="p-3 control-sidebar-content"> <div class="p-3 control-sidebar-content">
<!-- SidebarSearch Form --> <!-- SidebarSearch Form -->
<div class="form-inline"> <div class="form-inline">
<div class="input-group" data-widget="sidebar-search"> <div class="input-group" data-widget="sidebar-search">
<input class="form-control form-control-sidebar text-white" type="search" <input id="qrtextright" class="form-control form-control-sidebar text-white" type="search" placeholder="Procurar" aria-label="Search">
placeholder="Procurar" aria-label="Search">
<div class="input-group-append"> <div class="input-group-append">
<button class="btn btn-sidebar"> <button class="btn btn-sidebar">
<i class="fas fa-search fa-fw text-white"></i> <i class="fas fa-search fa-fw text-white"></i>
@ -254,8 +242,7 @@ class="nav-link text-white">
<!-- Sidebar Menu --> <!-- Sidebar Menu -->
<nav class="mt-2"> <nav class="mt-2">
<ul class="nav nav-pills nav-sidebar flex-column control-sidebar-treeview" role="menu" <ul class="nav nav-pills nav-sidebar flex-column control-sidebar-treeview" role="menu" data-accordion="false">
data-accordion="false">
<!-- Add icons to the links using the .nav-icon class <!-- Add icons to the links using the .nav-icon class
with font-awesome or any other icon font library --> with font-awesome or any other icon font library -->
<li class="nav-item menu-closed"> <li class="nav-item menu-closed">
@ -268,12 +255,12 @@ class="nav-link text-white">
</a> </a>
<ul class="nav nav-treeview"> <ul class="nav nav-treeview">
@foreach ($equipmentsDone as $equipmentDone) @foreach ($equipmentsDone as $equipmentDone)
<li class="nav-item-right"> <li class="nav-item-right">
<a href="#" class="nav-link text-white"> <a href="#" class="nav-link text-white">
<i class="fas fa-tag nav-icon"></i> <i class="fas fa-tag nav-icon"></i>
<p>{{ $equipmentDone->equipment_tag }}</p> <p>{{ $equipmentDone->equipment_tag }}</p>
</a> </a>
</li> </li>
@endforeach @endforeach
</ul> </ul>
</li> </li>
@ -326,10 +313,32 @@ class="nav-link text-white">
<script src="{{ URL::asset('assets/plugins/html5-qrcode/html5-qrcode.min.js') }}"></script> <script src="{{ URL::asset('assets/plugins/html5-qrcode/html5-qrcode.min.js') }}"></script>
<script> <script>
function searchForValueAndNavigate(value, itemsSelector, containerSelector) {
var searchQuery = value.toLowerCase();
var found = false; // Variable to track if any item is found
$(itemsSelector).each(function() {
var itemText = $(this).text().toLowerCase();
if (itemText.includes(searchQuery)) {
found = true;
window.location.href = $(this).attr('href');
return false; // Exit the .each loop after attempting navigation
}
});
// If no item is found, change the class of <li> elements
if (!found) {
$(containerSelector + ' .nav-item.menu-open').each(function() {
$(this).removeClass('menu-open').addClass('menu-closed');
});
}
}
let scanner = new Html5Qrcode("reader"); let scanner = new Html5Qrcode("reader");
let startScan = document.getElementById("startScan"); let startScan = document.getElementById("startScan");
let reader = document.getElementById("reader"); let reader = document.getElementById("reader");
let qrtext = document.getElementById("qrtext"); let qrtextleft = document.getElementById("qrtextleft");
let qrtextright = document.getElementById("qrtextright");
startScan.addEventListener('click', function() { startScan.addEventListener('click', function() {
// Hiding the startScan button and showing the reader // Hiding the startScan button and showing the reader
@ -347,10 +356,19 @@ class="nav-link text-white">
}, },
function(qrCodeMessage) { function(qrCodeMessage) {
// This is called when a QR Code is scanned // This is called when a QR Code is scanned
// Suppress every text in front of "@" including it
qrCodeMessage = qrCodeMessage.split('@')[0];
scanner.stop().then(() => { scanner.stop().then(() => {
qrtext.value = qrCodeMessage; qrtextleft.value = qrCodeMessage;
qrtextright.value = qrCodeMessage;
reader.style.display = "none"; reader.style.display = "none";
startScan.style.display = "block"; startScan.style.display = "block";
// Trigger the search functionality for both sidebars
searchForValueAndNavigate(qrCodeMessage, '.main-sidebar .nav.nav-pills.nav-sidebar.flex-column li a', '.main-sidebar');
searchForValueAndNavigate(qrCodeMessage, '.control-sidebar .nav.nav-pills.nav-sidebar.flex-column li a', '.control-sidebar');
}); });
}, },
function(errorMessage) { function(errorMessage) {
@ -366,27 +384,70 @@ function(errorMessage) {
<script> <script>
$(document).ready(function() { $(document).ready(function() {
// Initially hide the nav-treeview // Clone the behavior of treeview to control-treeview
$('.control-sidebar-treeview .nav-treeview').hide(); $(document).on('click', '[data-widget="control-treeview"] .nav-link', function(event) {
$('.control-sidebar-treeview .nav-item > a').on('click', function(event) {
event.preventDefault(); event.preventDefault();
var checkElement = $(this).next();
var parentLi = $(this).parent(); if ((checkElement.is('.nav-treeview')) && (checkElement.is(':visible'))) {
var childUl = parentLi.find('ul.nav-treeview'); checkElement.slideUp('normal', function() {
checkElement.removeClass('menu-open');
});
checkElement.parent("li").removeClass("menu-open");
} else if ((checkElement.is('.nav-treeview')) && (!checkElement.is(':visible'))) {
var parent = $(this).parents('ul').first();
var ul = parent.find('ul:visible').slideUp('normal');
ul.removeClass('menu-open');
var parent_li = $(this).parent("li");
// Check if the childUl is visible checkElement.slideDown('normal', function() {
if (childUl.is(':visible')) { checkElement.addClass('menu-open');
// If it's visible, hide it parent.find('.menu-open').not(checkElement).removeClass('menu-open');
childUl.slideUp('slow'); });
} else { }
// If it's not visible, show it if (checkElement.is('.nav-treeview')) {
childUl.slideDown('slow'); event.preventDefault();
} }
}); });
}); });
</script> </script>
<script>
function handleSearch(inputSelector, itemsSelector, containerSelector) {
$(inputSelector).on('keyup', function() {
var searchQuery = $(this).val().toLowerCase();
var found = false; // Variable to track if any item is found
$(itemsSelector).each(function() {
var itemText = $(this).text().toLowerCase();
if (itemText.includes(searchQuery)) {
$(this).show();
found = true;
} else {
$(this).hide();
}
});
// If any item is found, change the class of <li> elements
if (found) {
$(containerSelector + ' .nav-item.menu-closed').each(function() {
$(this).removeClass('menu-closed').addClass('menu-open');
});
} else {
$(containerSelector + ' .nav-item.menu-open').each(function() {
$(this).removeClass('menu-open').addClass('menu-closed');
});
}
});
}
// Apply the search functionality for the main sidebar
handleSearch('#qrtextleft', '.main-sidebar .nav.nav-pills.nav-sidebar.flex-column li', '.main-sidebar');
// Apply the search functionality for the control sidebar
handleSearch('#qrtextright', '.control-sidebar .nav.nav-pills.nav-sidebar.flex-column li', '.control-sidebar');
</script>
</body> </body>
</html> </html>