Penambahan FrontEnd All-New-Manufacture
This commit is contained in:
122
public/js/member/index.js
Normal file
122
public/js/member/index.js
Normal file
@@ -0,0 +1,122 @@
|
||||
$(document).ready(function () {
|
||||
|
||||
$(document).on('change', '.select-option', function () {
|
||||
if ($('option:selected', this).val() == '') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'none');
|
||||
// $(".site").val('');
|
||||
} else if ($('option:selected', this).val() == 'nama') {
|
||||
$(".nama").css('display', 'block');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
} else if ($('option:selected', this).val() == 'nopol') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'block');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
} else if ($('option:selected', this).val() == 'nocard') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'block');
|
||||
$(".notrans").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
} else if ($('option:selected', this).val() == 'notrans') {
|
||||
$(".nama").css('display', 'none');
|
||||
$(".nopol").css('display', 'none');
|
||||
$(".nocard").css('display', 'none');
|
||||
$(".notrans").css('display', 'block');
|
||||
$(".input-default").val('');
|
||||
} else {
|
||||
$(".position").css('display', 'none');
|
||||
$(".level-area").css('display', 'none');
|
||||
$(".input-default").val('');
|
||||
}
|
||||
});
|
||||
|
||||
var url = $('#example').data('url');
|
||||
|
||||
$('#search-button').on('click', function () {
|
||||
// Ambil nilai dari selected option
|
||||
var option = $('.select-option').val();
|
||||
|
||||
// Cek jika option yang dipilih bukan 'Pencarian Data...' yang berarti pilihan valid
|
||||
if (option && option !== '') {
|
||||
var inputField = $('.input-default:visible');
|
||||
|
||||
// Periksa apakah input tersebut kosong
|
||||
if (inputField.length === 0 || inputField.val().trim() === '') {
|
||||
// Jika kosong, tampilkan alert
|
||||
alert('Harap masukkan ' + (option === 'nopol' ? 'No. Polisi' : option === 'nocard' ? 'No. Card' : option === 'nama' ? 'Nama' : option === 'notrans' ? 'No. Transaksi' : 'No. Transaksi'));
|
||||
inputField.focus();
|
||||
return; // Hentikan proses jika input kosong
|
||||
}
|
||||
}
|
||||
|
||||
var formData = $('#search-form .input-default:visible').val();
|
||||
console.log(formData);
|
||||
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: "POST",
|
||||
// data: $('#search-form .input-default:visible').serialize(),
|
||||
data: $('#search-form').serialize(),
|
||||
headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
|
||||
dataType: 'json',
|
||||
success: function (response) {
|
||||
var tbody = $('#example tbody');
|
||||
tbody.empty();
|
||||
|
||||
if (response.length !== 0) {
|
||||
// Kelompokkan data berdasarkan notrans
|
||||
var groupedData = {};
|
||||
response.forEach((element) => {
|
||||
if (!groupedData[element.notrans]) {
|
||||
groupedData[element.notrans] = [];
|
||||
}
|
||||
groupedData[element.notrans].push(element);
|
||||
});
|
||||
|
||||
// Generate HTML
|
||||
Object.keys(groupedData).forEach((notrans, index) => {
|
||||
var rows = groupedData[notrans];
|
||||
var rowspan = rows.length;
|
||||
|
||||
rows.forEach((element, rowIndex) => {
|
||||
var rowHtml = `
|
||||
<tr class="mb-2">
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p2" style="text-align: center;">${index + 1}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p2" style="padding: 2px;">${element.notrans}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.nama}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.alamat}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.telepon}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.jmember}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${element.dept}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" width="200" style="text-align: center; padding: 2px;">${element.awal} <br> ${element.akhir}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p-2" style="padding: 2px;"> ${[...new Set(rows.map(r => `${r.nopol || 'No. Polisi tidak ada'} (${r.vehicle || ''})`))].join('<br>')} </td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" style="padding: 2px;">${[...new Set(rows.map(r => r.no_card || 'Tidak ada kartu'))].join('<br>')}</td>` : ''}
|
||||
${rowIndex === 0 ? `<td rowspan="${rowspan}" class="p-2" style="text-align: center;">
|
||||
<button class="btn btn-secondary btn-xs extend-button mb-1" data-id="${element.notrans}">Extend</button>
|
||||
<button class="btn btn-primary btn-xs edit-button mb-1" data-id="${element.notrans}">Edit</button>
|
||||
<button class="btn btn-danger btn-xs delete-button mb-1" data-id="${element.notrans}">Delete</button>
|
||||
</td>` : ''}
|
||||
</tr>
|
||||
`;
|
||||
tbody.append(rowHtml);
|
||||
});
|
||||
});
|
||||
} else {
|
||||
alert("Data tidak ditemukan.");
|
||||
$('#example tbody').html(
|
||||
`<tr>
|
||||
<td colspan="11" style="text-align: center;"><p class="text-danger mt-3">Tidak ditemukan data</p></td>
|
||||
<tr>`);
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
});
|
||||
Reference in New Issue
Block a user