778 lines
37 KiB
PHP
Executable File
778 lines
37 KiB
PHP
Executable File
@extends('Templates.templateWorkstations')
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
|
|
<!-- jQuery -->
|
|
<script src="{{ URL::asset('assets/plugins/jquery/jquery.min.js') }}"></script>
|
|
<!-- jQuery UI 1.11.4 -->
|
|
<script src="{{ URL::asset('assets/plugins/jquery-ui/jquery-ui.min.js') }}"></script>
|
|
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
|
|
<script>
|
|
$.widget.bridge('uibutton', $.ui.button)
|
|
</script>
|
|
|
|
{{-- <!-- Bootstrap 4 -->
|
|
<script src="{{ URL::asset('assets/plugins/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
|
|
<!-- ChartJS -->
|
|
<script src="{{ URL::asset('assets/plugins/chart.js/Chart.min.js') }}"></script>
|
|
<!-- Sparkline -->
|
|
<script src="{{ URL::asset('assets/plugins/sparklines/sparkline.js') }}"></script>
|
|
<!-- JQVMap -->
|
|
<script src="{{ URL::asset('assets/plugins/jqvmap/jquery.vmap.min.js') }}"></script>
|
|
<script src="{{ URL::asset('assets/plugins/jqvmap/maps/jquery.vmap.usa.js') }}"></script>
|
|
<!-- jQuery Knob Chart -->
|
|
<script src="{{ URL::asset('assets/plugins/jquery-knob/jquery.knob.min.js') }}"></script>
|
|
<!-- daterangepicker -->
|
|
<script src="{{ URL::asset('assets/plugins/moment/moment.min.js') }}"></script>
|
|
<script src="{{ URL::asset('assets/plugins/daterangepicker/daterangepicker.js') }}"></script>
|
|
<!-- Tempusdominus Bootstrap 4 -->
|
|
<script src="{{ URL::asset('assets/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js') }}">
|
|
</script>
|
|
<!-- Summernote -->
|
|
<script src="{{ URL::asset('assets/plugins/summernote/summernote-bs4.min.js') }}"></script>
|
|
<!-- overlayScrollbars -->
|
|
<script src="{{ URL::asset('assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js') }}"></script>
|
|
<!-- AdminLTE App -->
|
|
<script src="{{ URL::asset('assets/dist/js/adminlte.js') }}"></script>
|
|
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
|
|
<script src="{{ URL::asset('assets/dist/js/pages/dashboard.js') }}"></script>
|
|
<!-- HTML5 QRCode-->
|
|
<script src="{{ URL::asset('assets/plugins/html5-qrcode/html5-qrcode.min.js') }}"></script> --}}
|
|
|
|
|
|
@section('content')
|
|
@if (session('danger'))
|
|
<div class="content">
|
|
<div class="alert alert-danger" role="alert" id="alert-message-danger" style="transition: opacity 1s;">
|
|
{{ session('danger') }}
|
|
</div>
|
|
</div>
|
|
<script>
|
|
setTimeout(function() {
|
|
$('#alert-message-danger').fadeOut('slow', function() {
|
|
$(this).remove();
|
|
});
|
|
}, 5000); // A mensagem desaparecerá após 5 segundos
|
|
</script>
|
|
@endif
|
|
|
|
<section class="content">
|
|
|
|
<div class="row justify-content-center align-items-center">
|
|
<div class="col-12">
|
|
|
|
<div class="card card-info ">
|
|
<!-- Card-header principal card-->
|
|
<div class="card-header d-flex justify-content-between align-items-center flex-wrap">
|
|
<!-- Alinhado à esquerda -->
|
|
<div class="col-auto">
|
|
<a class="open-modal" data-toggle="modal" data-target="#modal-showEquipment">
|
|
<i class="fa-sharp fa-regular fa-newspaper"></i> Portfólio
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Centralizado -->
|
|
<div class="col-auto text-center flex-grow-1">
|
|
<h4 class="mb-0">Ispt.N :{{ $dataEquipment->istp_number }}</h4>
|
|
</div>
|
|
|
|
<!-- Alinhado à direita -->
|
|
<div class="col-auto">
|
|
<h5 class="mb-0 text-right">Ambito :{{ $dataEquipment->equipment_ambit }}</h5>
|
|
</div>
|
|
|
|
<!-- Modal do Portifolio -->
|
|
<div class="modal fade" id="modal-showEquipment">
|
|
<div class="modal-dialog modal-xl">
|
|
|
|
<div class="modal-content">
|
|
<div class="modal-header bg-light">
|
|
<h4 class="modal-title">Equipamento:</h4>
|
|
<h3>{{ $dataEquipment->equipment_tag }}</h3>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
|
|
<input type="hidden" name="equipmentId" value="{{ $dataEquipment->equipment_id }}">
|
|
|
|
<!-- Bordered Tabs -->
|
|
<ul class="nav nav-tabs nav-tabs-bordered" id="portfolioTabs" role="tablist">
|
|
<li class="nav-item">
|
|
<button class="nav-link active" id="view-tab" data-bs-toggle="tab"
|
|
data-bs-target="#show-Equipment" type="button" role="tab"
|
|
aria-controls="show-Equipment" aria-selected="true">
|
|
Visualizar
|
|
</button>
|
|
</li>
|
|
|
|
<li class="nav-item">
|
|
<button class="nav-link" id="edit-tab" data-bs-toggle="tab"
|
|
data-bs-target="#edit-equipment" type="button" role="tab"
|
|
aria-controls="edit-equipment" aria-selected="false">
|
|
Editar
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
|
|
|
|
<div class="tab-content pt-2" id="portfolioTabsContent">
|
|
<x-portfolio.portfolioAttributesForEquipments :dataEquipment="$dataEquipment"
|
|
:specificAttributesArray="$specificAttributesArray" :portfolioOnlyreadOrEditToo="$portfolioOnlyreadOrEditToo" />
|
|
</div>
|
|
|
|
</div><!-- ./modal-body-->
|
|
|
|
</div><!-- ./modal-content-->
|
|
</div><!-- ./modal-dialog modal-xl-->
|
|
</div> <!-- ./modal-showEquipment-->
|
|
</div><!-- ./Card-header-->
|
|
|
|
<!-- Card corpo do equipamento para onde vai receber as Tarefas elementares -->
|
|
<div class="card-body">
|
|
|
|
<div class="card card-success collapsed-card">
|
|
<div class="card-header clickable">
|
|
<div class="d-flex justify-content-between align-items-center" style="width: 100%;">
|
|
<h3 class="card-title">Comentários sobre o Equipamento</h3>
|
|
<div class="card-tools">
|
|
<button type="button" class="btn btn-tool collapse-button"
|
|
data-card-widget="collapse"><i class="fas fa-plus"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
|
|
<div class="chat-container"
|
|
style="height: 250px; overflow-y: scroll; padding: 10px; background-color: #f9f9f9; border: 1px solid #ddd;">
|
|
|
|
<!-- Mensagens do Chat -->
|
|
@foreach ($receiveComments as $receiveComment)
|
|
<div
|
|
class="chat-message {{ $receiveComment->type_users == 2 ? 'right' : 'left' }} mt-1">
|
|
<div class="flex-shrink-1 bg-light rounded py-2 px-3 {{ $receiveComment->type_users == 2 ? 'mr-3' : 'ml-3' }}"
|
|
style="border: 1px solid #ccc; box-shadow: 0 2px 5px rgba(0,0,0,0.1);">
|
|
<div class="font-weight-bold mb-1">{{ $receiveComment->user->user_name }}
|
|
<b>({{ $receiveComment->user->userType->type_user }})</b>
|
|
</div>
|
|
<p style="color:black">{{ $receiveComment->comment }}</p>
|
|
<div class="text-muted small text-nowrap mt-2">
|
|
{{ $receiveComment->creation_date }} (
|
|
{{ \Carbon\Carbon::parse($receiveComment->creation_date)->diffForHumans() }})
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
|
|
</div>
|
|
|
|
<!-- Área de envio de nova mensagem -->
|
|
<div class="mt-3">
|
|
<form action="{{ route('createComment') }}" method="post">
|
|
@csrf
|
|
<input type="hidden" name="projectID"
|
|
value="{{ $dataEquipment->company_projects_id }}">
|
|
<input type="hidden" name="equipmentID"
|
|
value="{{ $dataControlEquipment->equipmentWorkHistorys_id }}">
|
|
|
|
<div class="mb-3">
|
|
<label for="comment" class="form-label">Comentário/Equipamento</label>
|
|
<textarea class="form-control" id="comment" name="comment" rows="3" required
|
|
placeholder="Digite aqui suas observações ou comentário..."></textarea>
|
|
</div>
|
|
<button class="btn btn-success float-right" type="submit">Enviar</button>
|
|
|
|
</form>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
{{-- @dd($dataControlEquipment) --}}
|
|
|
|
<form
|
|
action="{{ route('cancelElementalTaskForEquipment', ['controlEquipmentID' => $dataControlEquipment->control_equipment_workstation_id]) }}"
|
|
method="get">
|
|
<div class="card-footer">
|
|
<button type="submit" data-action="cancel" class="btn btn-danger float-right"
|
|
style="background-color: red">Finalizar Ações ao equipamento</button>
|
|
</div>
|
|
</form>
|
|
|
|
<x-layouts.elementalTasksOfficial :recebeTasksForEquipment="$recebeTasksForEquipment" :dataControlEquipment="$dataControlEquipment" />
|
|
|
|
</div><!-- card-body do card principal -->
|
|
</div> <!-- ./ Card card-indo principal-->
|
|
</div> <!-- ./ col-12 -->
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Modal -->
|
|
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog modal-lg" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header bg-primary">
|
|
<h5 class="modal-title" id="exampleModalLabel">Conformidade da etiqueta</h5>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body" style="overflow-y: auto; max-height: 400px;">
|
|
|
|
<div class="row justify-content-center align-items-center" style="height: 50vh">
|
|
<div class="col-12 col-lg-7">
|
|
<div class="card card-info">
|
|
<div class="card-header" style="background-color: #00B0EA">
|
|
<h3 class="card-title text-center">Escaneie a outra Tag para confimar a junção</h3>
|
|
</div>
|
|
<div id="startScanUnique" class="card-body text-center">
|
|
<div class="text-white p-3 mt-3 rounded" style="background-color: #00B0EA">
|
|
<i class="fas fa-qrcode fa-5x"></i>
|
|
</div>
|
|
</div>
|
|
<div id="readerUnique" style="display: none;">
|
|
<div class="embed-responsive embed-responsive-1by1">
|
|
<video id="videoUnique" class="embed-responsive-item"></video>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center mt-3"> <!-- Adiciona margem acima e centraliza os botões -->
|
|
<button id="stopQrcodeRead" class="btn btn-warning mb-2">Parar Leitura</button>
|
|
<!-- Adiciona margem abaixo do botão -->
|
|
<div> <!-- Usar div para quebrar linha -->
|
|
<button type="button" class="btn btn-danger" data-toggle="modal"
|
|
data-target="#exampleModalSmall" style="background-color: red">
|
|
Confirmar junção de etiquetas <b>Manualmente</b>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="modal fade" id="exampleModalSmall">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title">Confirmar etiquetas Manualmente</h4>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">x</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>
|
|
Deseja realmente confirmar as etiquetas manualmente? Esta ação deve ser efetuada apenas se a
|
|
confirmação por QR code não for possível. Ao confirmar, está a validar que o <b>Corpo</b> e o
|
|
<b>Obturador</b> pertencem ao mesmo equipamento.
|
|
</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
|
|
<button type="button" id="btnConfirmManual" class="btn btn-primary">Confirmar</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="AddPhoneInElementalTaskModal" tabindex="-1" role="dialog"
|
|
aria-labelledby="exampleModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header bg-primary">
|
|
<h5 class="modal-title text-white" id="exampleModalLabel">Adicionar Imagens</h5>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="container-fluid">
|
|
<!-- Botões de controle da câmera -->
|
|
<div class="row justify-content-center text-center mb-4">
|
|
<div class="col-md-4">
|
|
<button class="btn btn-success w-100" id="startCamera">Iniciar Câmera</button>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<button class="btn btn-danger w-100" id="stopCamera">Parar Câmera</button>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<button class="btn btn-primary w-100" id="capture" style="display: none">Capturar
|
|
Foto</button>
|
|
</div>
|
|
</div>
|
|
<!-- Vídeo e canvas -->
|
|
<div class="row justify-content-center text-center mb-4">
|
|
<video id="video" class="rounded border border-secondary" width="320" height="240"
|
|
autoplay></video>
|
|
</div>
|
|
<!-- Imagens capturadas -->
|
|
<div class="row" id="capturedImages" class="text-center">
|
|
<canvas id="canvas" width="320" height="240" class="d-none"></canvas>
|
|
<!-- As imagens capturadas serão inseridas aqui -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="modal" id="imageModal">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">×</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<img id="modalImage" src="" style="width: 100%;"> <!-- Imagem será inserida aqui -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{-- Script para as Te7, verificar se as tarefas Te5 e Te6 ja foram finalizadas --}}
|
|
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
var controlEquipmentWorkstationId = $('#controlEquipmentID_TE7').val();
|
|
|
|
|
|
// Fazer a requisição AJAX para a API
|
|
$.ajax({
|
|
url: '/api/verify-equipment-te7/' + controlEquipmentWorkstationId,
|
|
method: 'GET',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRF-TOKEN': "{{ csrf_token() }}"
|
|
},
|
|
success: function(response) {
|
|
var infoIcon = $('#infoIcon');
|
|
var newTitle;
|
|
var newColor;
|
|
|
|
if (response.status === true) {
|
|
// Habilita o botão
|
|
$('#checkVerifyTe7').prop('disabled', false);
|
|
// Mensagem e cor para o status true
|
|
newTitle = 'Verificação de tarefas anteriores bem-sucedida! Pode salvar.';
|
|
newColor = '#28a745'; // Verde
|
|
} else {
|
|
// Mensagem e cor para o status false
|
|
newTitle = response.message || 'Erro na verificação.';
|
|
newColor = '#dc3545'; // Vermelho
|
|
}
|
|
|
|
// Atualizar o título do tooltip e a cor do ícone
|
|
infoIcon.attr('title', newTitle).tooltip('dispose').tooltip({
|
|
title: newTitle
|
|
}); // Atualizar o conteúdo do tooltip
|
|
infoIcon.css('background-color', newColor); // Atualizar a cor do ícone
|
|
},
|
|
error: function(xhr, status, error) {
|
|
// Em caso de erro na requisição, mostrar uma mensagem de erro
|
|
var infoIcon = $('#infoIcon');
|
|
infoIcon.attr('title', 'Erro ao comunicar com a API.').tooltip('dispose').tooltip({
|
|
title: 'Erro ao comunicar com a API.'
|
|
});
|
|
infoIcon.css('background-color', '#dc3545'); // Vermelho para erro
|
|
console.error('Erro na API:', error);
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
{{-- Script para monitorar a resposta da TE14 --}}
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
// Função para definir todos os campos abaixo como desabilitados e definir valores como "N/A"
|
|
function disableFields() {
|
|
// Desabilitar campos de input e selects
|
|
$('#body-test-pressure, #seat-test-pressure, #leak-tightness-test').val('N/A').prop('readonly',
|
|
true);
|
|
$('#fluid_test-select, #test_result-select').val('n_a').prop('disabled', true);
|
|
$('textarea[name="ID20[observations-text]"]').val('N/A').prop('readonly', true);
|
|
}
|
|
|
|
// Função para habilitar todos os campos abaixo e restaurar os valores originais
|
|
function enableFields() {
|
|
// Habilitar campos de input e selects
|
|
$('#body-test-pressure, #seat-test-pressure, #leak-tightness-test').val('').prop('readonly', false);
|
|
$('#fluid_test-select, #test_result-select').val('').prop('disabled', false);
|
|
$('textarea[name="ID20[observations-text]"]').val('').prop('readonly', false);
|
|
}
|
|
|
|
// Monitorar mudanças no select
|
|
$('#api-rp-598').change(function() {
|
|
var selectedValue = $(this).val();
|
|
|
|
if (selectedValue !== 'yes') {
|
|
disableFields();
|
|
} else {
|
|
enableFields();
|
|
}
|
|
});
|
|
|
|
// Verificar o valor inicial ao carregar a página
|
|
if ($('#api-rp-598').val() !== 'yes') {
|
|
disableFields();
|
|
}
|
|
});
|
|
</script>
|
|
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
var equipmentId = "{{ $dataEquipment->equipment_id }}"; // Pega o ID do equipamento
|
|
var url = "/api/receiveQuestionsEquipment/" + equipmentId; // Constrói a URL
|
|
|
|
$.ajax({
|
|
url: url,
|
|
type: "GET",
|
|
headers: {
|
|
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') // Adiciona o token CSRF
|
|
},
|
|
success: function(response) {
|
|
|
|
// Primeiro, desabilita todos os inputs e esconde as divs
|
|
$('#valve_repair-form6, #actuator_repair-form6, #repair_positioner-form6').hide();
|
|
$('#valve_repair-form11, #actuator_repair-form11, #repair_positioner-form11')
|
|
.hide();
|
|
|
|
let showValveRepair = false;
|
|
let showActuatorRepair = false;
|
|
let showRepairPositioner = false;
|
|
|
|
// Se a partir da resposta retornado for encontrado correspondencia,entao altera o valor a true
|
|
response.forEach(function(item) {
|
|
if (item.question == 'valve_repair') {
|
|
showValveRepair = true;
|
|
} else if (item.question == 'actuator_repair') {
|
|
showActuatorRepair = true;
|
|
} else if (item.question == 'repair_positioner') {
|
|
showRepairPositioner = true;
|
|
}
|
|
});
|
|
|
|
// Mostra ou esconde as divs com base nas variáveis de controle
|
|
if (showValveRepair) {
|
|
$('#valve_repair-form6, #valve_repair-form11').show().find('input').prop(
|
|
'disabled', false);
|
|
}
|
|
if (showActuatorRepair) {
|
|
$('#actuator_repair-form6, #actuator_repair-form11').show().find('input').prop(
|
|
'disabled', false);
|
|
}
|
|
if (showRepairPositioner) {
|
|
$('#repair_positioner-form6, #repair_positioner-form11').show().find('input')
|
|
.prop('disabled', false);
|
|
}
|
|
|
|
// Se nao tiver nenhuma ocorencia sobre as varaveis, entao deixa a div agrupando todas em hide, que serve para ajudar na responsividade pois se as colunas ficassem apenas em hide a tarefa elementar ai ter um espaco vazio em sua visualizacao
|
|
if (!showValveRepair && !showActuatorRepair) {
|
|
$('#column_valveQuestions_and_actuator-form6').hide();
|
|
}
|
|
if (!showValveRepair && !showActuatorRepair && !showRepairPositioner) {
|
|
$('#column_valve_repair_and_actuator_repair_and_repair_positioner-form11')
|
|
.hide();
|
|
}
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
|
|
<script>
|
|
const video = document.getElementById('video');
|
|
const canvas = document.getElementById('canvas');
|
|
const startCameraButton = document.getElementById('startCamera');
|
|
const stopCameraButton = document.getElementById('stopCamera');
|
|
const captureButton = document.getElementById('capture');
|
|
const context = canvas.getContext('2d');
|
|
let stream = null;
|
|
|
|
let imagesCount = 0; // Contador para controlar o número de imagens capturadas
|
|
|
|
let images = []; // Armazena as imagens capturadas
|
|
|
|
|
|
// Iniciar a câmera
|
|
startCameraButton.addEventListener('click', function() {
|
|
if (navigator.mediaDevices.getUserMedia) {
|
|
navigator.mediaDevices.getUserMedia({
|
|
video: {
|
|
facingMode: "environment"
|
|
} // Usando a câmera traseira
|
|
})
|
|
.then(function(localStream) {
|
|
stream = localStream;
|
|
video.srcObject = stream;
|
|
})
|
|
.catch(function(error) {
|
|
console.log("Algo deu errado ao acessar a câmera!", error);
|
|
});
|
|
}
|
|
captureButton.style.display = "block";
|
|
});
|
|
|
|
// Parar a câmera
|
|
stopCameraButton.addEventListener('click', function() {
|
|
if (stream) {
|
|
const tracks = stream.getTracks();
|
|
tracks.forEach(track => track.stop());
|
|
video.srcObject = null; // Limpa o vídeo
|
|
}
|
|
captureButton.style.display = "none";
|
|
});
|
|
|
|
// Capturar a foto
|
|
captureButton.addEventListener('click', function() {
|
|
if (images.length < 3) {
|
|
context.drawImage(video, 0, 0, 320, 240);
|
|
canvas.style.display = 'none';
|
|
const imageDataURL = canvas.toDataURL('image/png');
|
|
images.push(imageDataURL);
|
|
updateCapturedImagesDisplay();
|
|
}
|
|
});
|
|
|
|
function updateCapturedImagesDisplay() {
|
|
const capturedImagesDiv = document.getElementById('capturedImages');
|
|
capturedImagesDiv.innerHTML = ''; // Limpa a exibição anterior
|
|
capturedImagesDiv.classList.add('d-flex', 'flex-wrap', 'justify-content-center', 'align-items-center');
|
|
|
|
images.forEach((image, index) => {
|
|
const imageContainer = document.createElement('div');
|
|
imageContainer.classList.add('position-relative', 'm-3'); // Aumentou a margem para 'm-3'
|
|
|
|
const imageElem = document.createElement('img');
|
|
imageElem.src = image;
|
|
imageElem.classList.add('rounded'); // Adiciona bordas arredondadas
|
|
imageElem.style.width = '100px'; // Define um tamanho fixo para a visualização
|
|
imageElem.setAttribute('data-index', index);
|
|
imageElem.onclick = function() {
|
|
showImageModal(image);
|
|
}; // Adiciona o evento para expandir
|
|
imageContainer.appendChild(imageElem);
|
|
|
|
const closeButton = document.createElement('button');
|
|
closeButton.innerHTML = 'X';
|
|
closeButton.classList.add('btn', 'btn-danger', 'btn-sm', 'position-absolute');
|
|
closeButton.style.borderRadius = '50%'; // Torna o botão circular
|
|
closeButton.style.right = '-10px'; // Ajusta a posição à direita para tornar o botão mais acessível
|
|
closeButton.style.top = '-10px'; // Ajusta a posição superior
|
|
closeButton.onclick = function() {
|
|
removeImage(index);
|
|
};
|
|
imageContainer.appendChild(closeButton);
|
|
|
|
capturedImagesDiv.appendChild(imageContainer);
|
|
});
|
|
}
|
|
|
|
|
|
function removeImage(index) {
|
|
images.splice(index, 1);
|
|
updateCapturedImagesDisplay();
|
|
}
|
|
|
|
function showImageModal(imageSrc) {
|
|
const modalImage = document.getElementById('modalImage');
|
|
modalImage.src = imageSrc;
|
|
$('#imageModal').modal('show'); // Usando jQuery para exibir a modal
|
|
}
|
|
|
|
|
|
document.querySelectorAll('form[id^="form"]').forEach(function(form) {
|
|
form.addEventListener('submit', function(e) {
|
|
e.preventDefault(); // Impede o envio padrão do formulário
|
|
|
|
// Encontra o input no formulário atual onde as imagens capturadas devem ser anexadas
|
|
const formId = this.getAttribute('id');
|
|
const capturedImagesInput = this.querySelector(`#capturedImagesInput-${formId}`);
|
|
|
|
// Aqui você precisa garantir que 'images' contém as imagens capturadas para o formulário atual
|
|
// Isso pode requerer uma lógica adicional para associar imagens capturadas a formulários específicos
|
|
capturedImagesInput.value = JSON.stringify(
|
|
images); // Converte o array de imagens em uma string JSON para o formulário atual
|
|
|
|
this.submit(); // Envia o formulário após ajustar os dados
|
|
});
|
|
});
|
|
</script>
|
|
|
|
|
|
<!-- Script para abrir os card sem tem que click diretamente no icone -->
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
$('.clickable').on('click', function(e) {
|
|
// Verifica se o clique não foi no botão
|
|
if (!$(e.target).is('.collapse-button') && !$(e.target).is('.collapse-button *')) {
|
|
$(this).find('.collapse-button').trigger('click');
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
{{-- Este script serve para ter a opcao de deselecionar o botao Radio caso tenho apertado incorretamente --}}
|
|
<script>
|
|
$(document).ready(function() {
|
|
// Armazenar o último botão de rádio clicado
|
|
let lastCheckedRadio = null;
|
|
|
|
// Evento de clique nos botões de rádio com a classe 'toggle-radio'
|
|
$('.toggle-radio').on('click', function(event) {
|
|
if (this === lastCheckedRadio) {
|
|
// Se clicar no mesmo botão de rádio que foi clicado anteriormente, desmarque
|
|
$(this).prop('checked', false);
|
|
lastCheckedRadio = null;
|
|
} else {
|
|
// Caso contrário, atualize lastCheckedRadio com o botão de rádio atual
|
|
lastCheckedRadio = this;
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<!-- Adicione o JavaScript no final do body -->
|
|
<script>
|
|
$(function() {
|
|
$('[data-toggle="tooltip"]').tooltip();
|
|
})
|
|
</script>
|
|
|
|
|
|
{{-- <script type="text/javascript">
|
|
let formSubmitted = false;
|
|
|
|
document.addEventListener('DOMContentLoaded', (event) => {
|
|
const form = document.getElementById('idDoFormulario');
|
|
if (form) {
|
|
form.addEventListener('submit', function() {
|
|
formSubmitted = true;
|
|
});
|
|
|
|
form.addEventListener('input', function() {
|
|
addBeforeUnload();
|
|
});
|
|
} else {
|
|
console.error('Formulário não encontrado!');
|
|
}
|
|
});
|
|
|
|
function addBeforeUnload() {
|
|
window.addEventListener('beforeunload', function(e) {
|
|
if (!formSubmitted) {
|
|
const message = 'Você tem alterações não salvas. Se você sair, perderá essas alterações.';
|
|
e.returnValue = message;
|
|
return message;
|
|
}
|
|
});
|
|
}
|
|
</script> --}}
|
|
|
|
{{-- <script type="text/javascript">
|
|
let formSubmitted = false;
|
|
let formsChanged = false;
|
|
|
|
document.addEventListener('DOMContentLoaded', (event) => {
|
|
const forms = document.querySelectorAll('form');
|
|
if (forms.length > 0) {
|
|
forms.forEach(form => {
|
|
form.addEventListener('submit', function() {
|
|
formSubmitted = true;
|
|
});
|
|
|
|
// Adiciona o evento de input a cada form para marcar formsChanged como true
|
|
form.addEventListener('input', function() {
|
|
formsChanged = true;
|
|
});
|
|
});
|
|
} else {
|
|
console.error('Nenhum formulário encontrado!');
|
|
}
|
|
|
|
// Adiciona o evento beforeunload para verificar se houve mudanças nos formulários
|
|
window.addEventListener('beforeunload', function(e) {
|
|
if (!formSubmitted && formsChanged) {
|
|
const message = 'Você tem alterações não salvas. Se você sair, perderá essas alterações.';
|
|
e.returnValue = message; // Necessário para alguns navegadores
|
|
return message; // Exibe a mensagem de confirmação
|
|
}
|
|
});
|
|
});
|
|
</script> --}}
|
|
|
|
|
|
<script type="text/javascript">
|
|
let formSubmitted = false;
|
|
let formsChanged = false;
|
|
const controlEquipmentId = "{{ $dataControlEquipment->control_equipment_workstation_id }}";
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
//Script para verificar se em alguns dos form foi escrito algo em seu form
|
|
const forms = document.querySelectorAll('form');
|
|
if (forms.length > 0) {
|
|
forms.forEach(form => {
|
|
form.addEventListener('submit', function() {
|
|
formSubmitted = true;
|
|
});
|
|
|
|
// Adiciona o evento de input a cada form para marcar formsChanged como true
|
|
form.addEventListener('input', function() {
|
|
formsChanged = true;
|
|
});
|
|
});
|
|
} else {
|
|
console.error('Nenhum formulário encontrado!');
|
|
}
|
|
|
|
|
|
// Envia o heartbeat a cada 30 segundos
|
|
setInterval(function() {
|
|
fetch("/api/updateSessionStatus/" + controlEquipmentId, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRF-TOKEN': "{{ csrf_token() }}"
|
|
},
|
|
body: JSON.stringify({
|
|
status: 1
|
|
}) // Status 1 indica sessão ativa
|
|
}).then(response => response.json())
|
|
.then(data => console.log('Heartbeat enviado', data))
|
|
.catch(error => console.error('Erro ao enviar heartbeat', error));
|
|
}, 10000);
|
|
|
|
// Adiciona o evento beforeunload para verificar se houve mudanças nos formulários
|
|
window.addEventListener('beforeunload', function(e) {
|
|
if (!formSubmitted && formsChanged) {
|
|
const message =
|
|
'Você tem alterações não salvas. Se você sair, perderá essas alterações.';
|
|
e.returnValue = message; // Necessário para alguns navegadores
|
|
return message; // Exibe a mensagem de confirmação
|
|
}
|
|
|
|
// Tenta enviar o beacon para fechar a sessão
|
|
navigator.sendBeacon(`/api/closeSession/${controlEquipmentId}`, JSON.stringify({
|
|
status: 0
|
|
}));
|
|
});
|
|
});
|
|
</script>
|
|
@endsection
|