216 lines
9.4 KiB
JavaScript
216 lines
9.4 KiB
JavaScript
$(document).ready(function() {
|
|
|
|
var table = $('#verify-table').DataTable ({
|
|
processing: false,
|
|
serverSide: false,
|
|
paging: false,
|
|
order: [],
|
|
searching: false,
|
|
lengthMenu: [20],
|
|
ajax: $('#verify-table').data('url'),
|
|
columns: [
|
|
{ data: 'DT_RowIndex',
|
|
name: 'DT_RowIndex',
|
|
orderable: false
|
|
},
|
|
{
|
|
data: 'id',
|
|
name: 'id',
|
|
class: 'text-center'
|
|
},
|
|
{
|
|
data: 'no_pol',
|
|
name: 'no_pol',
|
|
class: 'text-center',
|
|
},
|
|
{
|
|
data: 'jenis_mobil',
|
|
name: 'jenis_mobil',
|
|
class: 'text-center',
|
|
},
|
|
{
|
|
data: 'waktu_masuk',
|
|
name: 'waktu_masuk',
|
|
class: 'text-center',
|
|
render: function(data, type, row) {
|
|
return moment(data).format("DD-MM-YYYY HH:mm:ss")
|
|
}
|
|
},
|
|
{
|
|
data: 'waktu_keluar',
|
|
name: 'waktu_keluar',
|
|
class: 'text-center',
|
|
render: function(data, type, row) {
|
|
return moment(data).format("DD-MM-YYYY HH:mm:ss")
|
|
}
|
|
},
|
|
{
|
|
data: 'id_pintu_masuk',
|
|
name: 'id_pintu_masuk',
|
|
class: 'text-center'
|
|
},
|
|
{
|
|
data: 'out_gate',
|
|
name: 'out_gate',
|
|
class: 'text-center'
|
|
},
|
|
{
|
|
data: 'status',
|
|
name: 'status',
|
|
render: function (data, type, row) {
|
|
if (data === 1) {
|
|
return '<span class="badge badge-secondary light badge-danger">Pending</span></td>';
|
|
} else {
|
|
return '';
|
|
}
|
|
},
|
|
class: 'text-center',
|
|
},
|
|
// { data: 'id', name: 'id' },
|
|
{
|
|
data: 'id',
|
|
render: function(data, type, row) {
|
|
return `
|
|
<div class="action-buttons d-flex justify-content-end">
|
|
<a href="javascript:void(0);" class="btn btn-light view-images light mr-2" data-id="${data}" data-no_pol="${row.no_pol}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="svg-main-icon" width="24px" height="24px" viewBox="0 0 32 32" x="0px" y="0px">
|
|
<g data-name="Layer 21">
|
|
<path d="M29,14.47A15,15,0,0,0,3,14.47a3.07,3.07,0,0,0,0,3.06,15,15,0,0,0,26,0A3.07,3.07,0,0,0,29,14.47ZM16,21a5,5,0,1,1,5-5A5,5,0,0,1,16,21Z" fill="#000000" fill-rule="nonzero"></path>
|
|
<circle cx="16" cy="16" r="3" fill="#000000" fill-rule="nonzero"></circle>
|
|
</g>
|
|
</svg>
|
|
</a>
|
|
<a href="javascript:void(0);" class="btn btn-secondary verify-data light mr-2" data-id="${data}" data-no_pol="${row.no_pol}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="none">
|
|
<path d="M9 12l2 2 4-4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2"/>
|
|
</svg>
|
|
</a>
|
|
<a href="javascript:void(0);" class="btn btn-danger remove-item light mr-2" data-id="${data}" data-no_pol="${row.no_pol}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="none">
|
|
<path d="M18 6L6 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<path d="M6 6L18 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</a>
|
|
</div>`;
|
|
// <button class="btn btn-primary btn-xs view-images" data-id="${data}">View</button>
|
|
// <button class="btn btn-secondary btn-xs" edit-nopol data-id="${data}">Verify</button>
|
|
},
|
|
class: 'text-center'
|
|
}
|
|
],
|
|
columnDefs: [
|
|
{
|
|
targets: '_all', // Mengatur semua kolom
|
|
orderable: false // Tidak bisa diurutkan
|
|
}
|
|
]
|
|
});
|
|
|
|
$('#verify-table tbody').on('click', '.view-images', function() {
|
|
var id = $(this).data('id');
|
|
var no_pol = $(this).data('no_pol');
|
|
console.log(no_pol);
|
|
$.ajax({
|
|
// url: '/verify/' + id,
|
|
url: '/verify/show',
|
|
type: 'POST',
|
|
data: {
|
|
id: id,
|
|
no_pol: no_pol,
|
|
_token: $('meta[name="csrf-token"]').attr('content')
|
|
},
|
|
success: function(response) {
|
|
console.log(response);
|
|
if (response.pic_masuk && response.pic_masuk !== '') {
|
|
$('#pic_body_masuk').attr('src', 'data:image/jpeg;base64,' + response.pic_masuk).show();
|
|
} else {
|
|
$('#pic_body_masuk').attr('src', '/images/no-image.jpeg').show();
|
|
}
|
|
if (response.driver_masuk && response.driver_masuk !== '') {
|
|
$('#pic_driver_masuk').attr('src', 'data:image/jpeg;base64,' + response.driver_masuk).show();
|
|
} else {
|
|
$('#pic_driver_masuk').attr('src', '/images/no-image.jpeg').show();
|
|
}
|
|
if (response.pic_keluar && response.pic_keluar !== '') {
|
|
$('#pic_body_keluar').attr('src', 'data:image/jpeg;base64,' + response.pic_keluar).show();
|
|
// $('#pic_body_keluar').attr('src', imgData).show();
|
|
} else {
|
|
$('#pic_body_keluar').attr('src', '/images/no-image.jpeg').show();
|
|
}
|
|
if (response.driver_keluar && response.driver_keluar !== '') {
|
|
$('#pic_driver_keluar').attr('src', 'data:image/jpeg;base64,' + response.driver_keluar).show();
|
|
} else {
|
|
$('#pic_driver_keluar').attr('src', '/images/no-image.jpeg').show();
|
|
}
|
|
// $('#pic_body_masuk').attr('src', 'data:image/jpeg;base64,' + response.pic_masuk).show();
|
|
// $('#time-in').text('Jam masuk : ' + data.waktu_masuk).show();
|
|
},
|
|
error: function(xhr, status, error) {
|
|
console.log(status, error);
|
|
alert('Gagal mengambil data gambar');
|
|
}
|
|
});
|
|
});
|
|
|
|
// $('#verify-table tbody').on('click', '.verify-data', function() {
|
|
$('#verify-table tbody').on('click', '.verify-data, .remove-item', function() {
|
|
|
|
var id = $(this).data('id');
|
|
var no_pol = $(this).data('no_pol');
|
|
// var veriCheckValue = $(this).hasClass('verify-data') ? 2 : 0;
|
|
var veriCheckValue;
|
|
if ($(this).hasClass('verify-data')) {
|
|
veriCheckValue = 2;
|
|
} else if ($(this).hasClass('remove-item')) {
|
|
veriCheckValue = 0;
|
|
}
|
|
|
|
console.log(id, no_pol, veriCheckValue);
|
|
$.ajax({
|
|
url: '/verify/' + id,
|
|
type: 'PUT', // Sesuaikan dengan metode HTTP yang Anda gunakan untuk update
|
|
data: {
|
|
// Data yang dikirim untuk update, sesuaikan dengan kebutuhan Anda
|
|
// Misalnya:
|
|
// status: 'verified',
|
|
// veri_check: 2,
|
|
veri_check: veriCheckValue,
|
|
no_pol: no_pol,
|
|
// _token: '{{ csrf_token() }}' // Token CSRF untuk keamanan
|
|
_token: $('meta[name="csrf-token"]').attr('content')
|
|
},
|
|
success: function(data) {
|
|
var message = veriCheckValue === 2 ? 'Data berhasil diverifikasi' : 'Kendaran tidak sesuai';
|
|
// alert(message);
|
|
// alert('Data berhasil diverifikasi');
|
|
// Bisa tambahkan logika untuk refresh tabel atau mengupdate tampilan
|
|
table.ajax.reload(null, false); // Reload data table tanpa mereset pagination
|
|
},
|
|
error: function() {
|
|
alert('Gagal memverifikasi data');
|
|
}
|
|
});
|
|
});
|
|
|
|
function refreshTable() {
|
|
table.ajax.reload(null, false); // Mengambil data baru tanpa reset paging
|
|
}
|
|
|
|
setInterval(refreshTable, 5000);
|
|
// Menambahkan event listener untuk row click
|
|
// $('#verify-table tbody').on('click', 'tr', function() {
|
|
// var data = table.row(this).data();
|
|
// console.log (data);
|
|
// if (data) {
|
|
// $.ajax({
|
|
// url: '/verify/' + data.id,
|
|
// // type: 'GET',
|
|
// success: function(response) {
|
|
// // Menampilkan card-body saat data ditemukan
|
|
// $('.card-body').slideDown();
|
|
// }
|
|
// });
|
|
// }
|
|
// });
|
|
}); |