509 lines
21 KiB
JavaScript
509 lines
21 KiB
JavaScript
$(document).ready(function () {
|
|
const today = moment();
|
|
const startDate = moment(today).startOf("day").format("DD-MM-YYYY 00:00");
|
|
const endDate = moment(today).endOf("day").format("DD-MM-YYYY 23:59");
|
|
|
|
$(".tambah-member").validate({
|
|
rules: {
|
|
nama: {
|
|
required: true,
|
|
},
|
|
member: {
|
|
required: true,
|
|
},
|
|
depart: {
|
|
required: true,
|
|
},
|
|
},
|
|
messages: {
|
|
nama: {
|
|
required: "Masukkan nama member",
|
|
},
|
|
member: {
|
|
required: "Jenis Member belum di pilih",
|
|
},
|
|
depart: {
|
|
required: "Jenis Langganan belum di pilih",
|
|
},
|
|
},
|
|
// errorElement: 'span',
|
|
// errorPlacement: function (error, element) {
|
|
// error.addClass('invalid-feedback');
|
|
// // element.closest('.form-group').append(error);
|
|
// },
|
|
highlight: function (element, errorClass, validClass) {
|
|
$(element).addClass("is-invalid");
|
|
},
|
|
unhighlight: function (element, errorClass, validClass) {
|
|
$(element).removeClass("is-invalid");
|
|
},
|
|
});
|
|
|
|
// const startDate = moment().startOf("day"); // hari ini jam 00:00
|
|
// const endDate = moment().add(7, "days").endOf("day"); // +7 hari
|
|
|
|
$(".input-daterange-timepicker").daterangepicker(
|
|
// 👈 method-nya "daterangepicker", bukan "datepicker"
|
|
{
|
|
timePicker: true,
|
|
locale: {
|
|
format: "DD-MM-YYYY HH:mm",
|
|
},
|
|
timePicker24Hour: true,
|
|
timePickerSeconds: false,
|
|
buttonClasses: ["btn", "btn-sm"],
|
|
applyClass: "btn-danger",
|
|
cancelClass: "btn-inverse",
|
|
startDate: startDate,
|
|
endDate: endDate,
|
|
parentEl: "#modal-member", // 👈 daterangepicker pakai "parentEl", bukan "container"
|
|
},
|
|
function (startDate, endDate) {
|
|
console.log(
|
|
`Range selected: ${startDate.format("DD-MM-YYYY HH:mm")} s/d ${endDate.format("DD-MM-YYYY HH:mm")}`,
|
|
);
|
|
$(".input-daterange-timepicker").val(
|
|
`${startDate.format("DD-MM-YYYY HH:mm")} s/d ${endDate.format("DD-MM-YYYY HH:mm")}`,
|
|
);
|
|
},
|
|
);
|
|
|
|
// Set nilai awal dan akhir di input
|
|
$(".input-daterange-timepicker").val(`${startDate} - ${endDate}`);
|
|
// $('.awal').val(startDate);
|
|
// $('.akhir').val(endDate);
|
|
|
|
$("#jenisVehicle").on("change", function () {
|
|
var jenisMembers = member;
|
|
var vehicleSelected = $(this).val();
|
|
var $jenisMember = $("#jenis-member");
|
|
// console.log(jenisMembers);
|
|
|
|
$jenisMember.empty();
|
|
$jenisMember.append('<option selected value="">Pilih Jenis</option>');
|
|
|
|
jenisMembers.forEach((item) => {
|
|
if (item.id_mobil === vehicleSelected) {
|
|
if (item.id_mobil !== 0) {
|
|
$jenisMember.append(
|
|
`<option value="${item.tarif}">${item.jenis_langganan} - ${item.tarif} </option>`,
|
|
);
|
|
console.log($jenisMember);
|
|
} else {
|
|
$jenisMember.append(`<option value="">Tidak ada Pilihan </option>`);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
// Jumlahkan tarif semua kendaraan di list -> isi otomatis ke Harga.
|
|
// Harga dikirim angka polos (kolom double), tanpa pemisah ribuan.
|
|
function updateHarga() {
|
|
let total = 0;
|
|
$("#modal-member #list-nopol tr").each(function () {
|
|
total += parseFloat($(this).data("tarif")) || 0;
|
|
});
|
|
$("#modal-member input[name='harga']").val(total);
|
|
}
|
|
|
|
$("#nopol-add").on("click", function () {
|
|
var nopol = $(".nopol-add").val().trim();
|
|
console.log(nopol);
|
|
// var vehicle = $('#jenisVehicle option:selected').text();
|
|
var vehicle = $("#jenisVehicle").val();
|
|
var vehicleName = $("#jenisVehicle option:selected").text();
|
|
var member = $("#jenis-member option:selected").text();
|
|
var tarif = parseFloat($("#jenis-member").val()) || 0;
|
|
var merk = $(".merk").val().trim();
|
|
$(".nopol-add").removeClass("is-invalid"); // Hapus kelas jika ada sebelumnya
|
|
$(".nopol-add").next(".invalid-feedback").hide();
|
|
|
|
if (!vehicle) {
|
|
Swal.fire({icon: 'warning', title: 'Belum lengkap', text: "Wajib pilih jenis kendaraan"});
|
|
return;
|
|
}
|
|
|
|
$.ajax({
|
|
url: "stiker/checkField",
|
|
type: "POST",
|
|
data: { nopol: nopol },
|
|
headers: { "X-CSRF-token": $('meta[name="csrf-token"]').attr("content") },
|
|
success: function (r) {
|
|
if (r.response === true) {
|
|
var rowhtml = `
|
|
<tr data-tarif="${tarif}">
|
|
<td class="text-center">${nopol}</td>
|
|
<td class="text-center" data-value="${vehicle}">${vehicleName}</td>
|
|
<td class="text-center">${member}</td>
|
|
<td class="text-center">${merk}</td>
|
|
<td class="text-center p-1" style="text-align: center;">
|
|
<button class="btn btn-danger btn-xs delete-row">Hapus<buttion>
|
|
</td>
|
|
</tr>
|
|
`;
|
|
$("#list-nopol").append(rowhtml);
|
|
console.log("Berhasil menambahkan " + nopol);
|
|
updateHarga();
|
|
|
|
$(".nopol-add").val("");
|
|
$("#jenisVehicle").val("");
|
|
$("#jenis-member").val("");
|
|
$(".merk").val("");
|
|
} else {
|
|
// var warn = `<div class="invalid-feedback">Nopol sudah ada</div>`;
|
|
$(".nopol-add").addClass("is-invalid"); // Tambahkan kelas invalid
|
|
$(".nopol-add").next(".invalid-feedback").text(r.message).show(); // Tampilkan pesan error
|
|
console.log(r.message);
|
|
}
|
|
},
|
|
error: function (xhr) {
|
|
Swal.fire({icon: 'error', title: 'Gagal memeriksa', text: xhr.responseJSON?.message || "Terjadi kesalahan saat memeriksa nopol"});
|
|
},
|
|
});
|
|
});
|
|
|
|
$(".kartu").on("keydown", function (e) {
|
|
var kartu = $(".kartu").val().trim();
|
|
|
|
if (e.key === "Enter") {
|
|
// $.ajax ({
|
|
// url: 'member/checkField',
|
|
// type: 'POST',
|
|
// data: {nocard: kartu},
|
|
// headers: {'X-CSRF-token': $('meta[name="csrf-token"]').attr('content')},
|
|
// success: function (r) {
|
|
// if (r.response === true) {
|
|
e.preventDefault();
|
|
$(".nourut").focus();
|
|
// }
|
|
// }
|
|
// });
|
|
}
|
|
});
|
|
|
|
$(".nourut").on("keydown", function (e) {
|
|
if (e.key === "Enter") {
|
|
e.preventDefault();
|
|
|
|
var nocard = $(".kartu").val().trim();
|
|
var nourut = $(".nourut").val().trim();
|
|
|
|
var rowHtml = `
|
|
<tr>
|
|
<td class="text-center strong">${nocard}</td>
|
|
<td class="text-center strong">${nourut}</td>
|
|
<td class="text-center p-2" >
|
|
<button class="btn btn-danger btn-xs delete-row">Hapus<buttion>
|
|
</td>
|
|
</tr>
|
|
`;
|
|
$("#list-card").append(rowHtml);
|
|
$(".kartu").val("");
|
|
$(".nourut").val("");
|
|
}
|
|
});
|
|
|
|
$("#list-card").on("click", ".delete-row", function () {
|
|
$(this).closest("tr").remove(); // Hapus baris yang diklik
|
|
});
|
|
|
|
$("#list-nopol").on("click", ".delete-row", function () {
|
|
$(this).closest("tr").remove();
|
|
updateHarga();
|
|
});
|
|
|
|
$(".simpan").on("click", function () {
|
|
var tombol = $(this);
|
|
var formCollect = $("#add-member").serialize();
|
|
var collectNopol = [];
|
|
var cardCollect = [];
|
|
|
|
$("#list-nopol tr").each(function () {
|
|
var row = $(this);
|
|
var rowData = {
|
|
nopol: row.find("td:nth-child(1)").text().trim(),
|
|
vehicle: row.find("td:nth-child(2)").data("value"),
|
|
member: row.find("td:nth-child(3)").text().trim(),
|
|
merk: row.find("td:nth-child(4)").text().trim(),
|
|
};
|
|
collectNopol.push(rowData);
|
|
});
|
|
|
|
console.log(collectNopol);
|
|
|
|
$("#list-card tr").each(function () {
|
|
var row = $(this);
|
|
var rowCard = {
|
|
nocard: row.find("td:nth-child(1)").text(),
|
|
nourut: row.find("td:nth-child(2)").text(),
|
|
};
|
|
cardCollect.push(rowCard);
|
|
});
|
|
|
|
console.log(cardCollect);
|
|
|
|
const formDataString = formCollect;
|
|
|
|
// Mengonversi query string menjadi objek
|
|
const formDataObj = {};
|
|
const searchParams = new URLSearchParams(formDataString);
|
|
|
|
searchParams.forEach((value, key) => {
|
|
formDataObj[key] = value;
|
|
});
|
|
|
|
console.log(formDataObj);
|
|
|
|
var allData = {
|
|
formData: formDataObj,
|
|
nopolData: collectNopol,
|
|
cardNumber: cardCollect,
|
|
};
|
|
|
|
console.log("FORM ADD:", allData);
|
|
|
|
updateHarga(); // pastikan harga = jumlah tarif kendaraan sebelum simpan
|
|
formDataObj.harga = $("#modal-member input[name='harga']").val();
|
|
|
|
if ($(".tambah-member").valid()) {
|
|
const saveBtn = tombol;
|
|
const saveHtml = saveBtn.html();
|
|
saveBtn.prop('disabled', true).html('<span class="spinner-border spinner-border-sm me-1"></span>Menyimpan...');
|
|
$.ajax({
|
|
url: $("#add-member").attr("action"),
|
|
type: "POST",
|
|
data: allData,
|
|
headers: { "X-CSRF-token": $('meta[name="csrf-token"]').attr("content") },
|
|
beforeSend: function () {
|
|
// tombol.attr("disabled", true);
|
|
},
|
|
success: function (r) {
|
|
const ok = r.status == true || r.response == true;
|
|
if (ok) {
|
|
$("#modal-member").modal("hide");
|
|
Swal.fire({
|
|
icon: "success",
|
|
title: "Berhasil!!",
|
|
text: "Member berhasil di daftarkan.. !!",
|
|
timer: 5000,
|
|
// showConfirmButton: !1,
|
|
}).then(function () {
|
|
// Reload halaman setelah SweetAlert ditutup
|
|
// location.reload(); // Ini akan me-reload halaman
|
|
});
|
|
} else {
|
|
Swal.fire({
|
|
icon: "error",
|
|
title: "Oops...",
|
|
text: r.message || "Terjadi kendala, silakan hubungi admin.",
|
|
});
|
|
}
|
|
console.log(r);
|
|
},
|
|
error: function (xhr, status, error) {
|
|
Swal.fire({icon: 'error', title: 'Gagal menyimpan', text: xhr.responseJSON?.message || ("Terjadi kesalahan: " + error)});
|
|
},
|
|
complete: function () {
|
|
saveBtn.prop('disabled', false).html(saveHtml);
|
|
},
|
|
});
|
|
}
|
|
});
|
|
|
|
// ================= UBAH (update di tempat, nomor dipertahankan) =================
|
|
function updateHargaUbah() {
|
|
let total = 0;
|
|
$("#ubah-member #edit-list-nopol tr").each(function () {
|
|
total += parseFloat($(this).data("tarif")) || 0;
|
|
});
|
|
$("#ubah-member input[name='harga']").val(total);
|
|
}
|
|
|
|
function showUrlFor(notrans) {
|
|
const tpl = $("#btnExtend").data("url") || "/transaksi/stiker/:id";
|
|
return tpl.replace(":id", encodeURIComponent(notrans));
|
|
}
|
|
|
|
$(document).on("click", ".edit-button", function () {
|
|
const notrans = (typeof selectedRowData !== "undefined" && selectedRowData?.notrans)
|
|
|| $(this).data("id") || "";
|
|
if (!notrans) {
|
|
Swal.fire({icon: "warning", title: "Belum pilih data", text: "Klik salah satu baris transaksi dulu."});
|
|
return;
|
|
}
|
|
$.ajax({
|
|
url: showUrlFor(notrans),
|
|
type: "GET",
|
|
success: function (r) {
|
|
const m = $("#ubah-member");
|
|
m.find("#edit-notrans").val(r.notrans);
|
|
m.find("[name='nama']").val(r.nama ?? "");
|
|
m.find("[name='address']").val(r.alamat ?? "");
|
|
m.find("[name='phone']").val(r.telepon ?? "");
|
|
m.find("[name='note']").val(r.keterangan ?? "");
|
|
m.find("[name='harga']").val(r.harga ?? 0);
|
|
m.find("[name='member']").val(r.jenis_langganan ?? "");
|
|
m.find("[name='depart']").val(r.unit_kerja ?? "");
|
|
if (r.awal && r.akhir) {
|
|
m.find("[name='daterange']").val(
|
|
`${moment(r.awal).format("DD-MM-YYYY HH:mm")} - ${moment(r.akhir).format("DD-MM-YYYY HH:mm")}`,
|
|
);
|
|
}
|
|
const jl = $("#edit-list-nopol").empty();
|
|
(r.stiker_details || []).forEach((row) => {
|
|
jl.append(`
|
|
<tr data-tarif="${row.tarif ?? 0}">
|
|
<td class="text-center">${row.nopol ?? ""}</td>
|
|
<td class="text-center" data-value="${row.jenis_mobil ?? ""}">${row.vehicle ?? ""}</td>
|
|
<td class="text-center">${row.jenis_member ?? ""}</td>
|
|
<td class="text-center">${row.merk ?? ""}</td>
|
|
<td class="text-center p-1"><button class="btn btn-danger btn-xs edit-del-nopol" type="button">Hapus</button></td>
|
|
</tr>`);
|
|
});
|
|
const kl = $("#edit-list-card").empty();
|
|
(r.memberCard || []).forEach((ro) => {
|
|
kl.append(`
|
|
<tr>
|
|
<td class="text-center">${ro.no_card ?? ""}</td>
|
|
<td class="text-center">${ro.no_urut ?? ""}</td>
|
|
<td class="text-center p-2"><button class="btn btn-danger btn-xs edit-del-card" type="button">Hapus</button></td>
|
|
</tr>`);
|
|
});
|
|
updateHargaUbah();
|
|
},
|
|
error: function (xhr) {
|
|
Swal.fire({icon: "error", title: "Gagal memuat data", text: xhr.responseJSON?.message || "Data tidak ditemukan."});
|
|
},
|
|
});
|
|
});
|
|
|
|
$("#edit-jenisVehicle").on("change", function () {
|
|
const vehicleSelected = $(this).val();
|
|
const box = $("#edit-jenis-member").empty().append('<option selected value="">Pilih Jenis</option>');
|
|
(member || []).forEach((item) => {
|
|
if (String(item.id_mobil) === String(vehicleSelected) && item.id_mobil !== 0) {
|
|
box.append(`<option value="${item.tarif}">${item.jenis_langganan} - ${item.tarif}</option>`);
|
|
}
|
|
});
|
|
});
|
|
|
|
$("#edit-nopol-add").on("click", function () {
|
|
const nopol = $(".enopol-add").val().trim();
|
|
const vehicle = $("#edit-jenisVehicle").val();
|
|
const vehicleName = $("#edit-jenisVehicle option:selected").text();
|
|
const memberTxt = $("#edit-jenis-member option:selected").text();
|
|
const tarif = parseFloat($("#edit-jenis-member").val()) || 0;
|
|
const merk = $(".emerk").val().trim();
|
|
$(".enopol-add").removeClass("is-invalid");
|
|
if (!vehicle) {
|
|
Swal.fire({icon: "warning", title: "Belum lengkap", text: "Wajib pilih jenis kendaraan"});
|
|
return;
|
|
}
|
|
$.ajax({
|
|
url: "/transaksi/stiker/checkField",
|
|
type: "POST",
|
|
data: { nopol: nopol },
|
|
headers: { "X-CSRF-token": $('meta[name="csrf-token"]').attr("content") },
|
|
success: function (rr) {
|
|
if (rr.response === true) {
|
|
$("#edit-list-nopol").append(`
|
|
<tr data-tarif="${tarif}">
|
|
<td class="text-center">${nopol}</td>
|
|
<td class="text-center" data-value="${vehicle}">${vehicleName}</td>
|
|
<td class="text-center">${memberTxt}</td>
|
|
<td class="text-center">${merk}</td>
|
|
<td class="text-center p-1"><button class="btn btn-danger btn-xs edit-del-nopol" type="button">Hapus</button></td>
|
|
</tr>`);
|
|
$(".enopol-add, .emerk").val("");
|
|
$("#edit-jenisVehicle, #edit-jenis-member").val("");
|
|
updateHargaUbah();
|
|
} else {
|
|
$(".enopol-add").addClass("is-invalid").next(".invalid-feedback").text(rr.message).show();
|
|
}
|
|
},
|
|
error: function (xhr) {
|
|
Swal.fire({icon: "error", title: "Gagal memeriksa", text: xhr.responseJSON?.message || "Terjadi kesalahan saat memeriksa nopol"});
|
|
},
|
|
});
|
|
});
|
|
|
|
$(".ekartu").on("keydown", function (e) {
|
|
if (e.key === "Enter") { e.preventDefault(); $(".enourut").focus(); }
|
|
});
|
|
$(".enourut").on("keydown", function (e) {
|
|
if (e.key !== "Enter") return;
|
|
e.preventDefault();
|
|
const nocard = $(".ekartu").val().trim();
|
|
const nourut = $(".enourut").val().trim();
|
|
if (!nocard) return;
|
|
$("#edit-list-card").append(`
|
|
<tr><td class="text-center">${nocard}</td><td class="text-center">${nourut}</td>
|
|
<td class="text-center p-2"><button class="btn btn-danger btn-xs edit-del-card" type="button">Hapus</button></td></tr>`);
|
|
$(".ekartu, .enourut").val("");
|
|
});
|
|
|
|
$("#edit-list-nopol").on("click", ".edit-del-nopol", function () {
|
|
$(this).closest("tr").remove();
|
|
updateHargaUbah();
|
|
});
|
|
$("#edit-list-card").on("click", ".edit-del-card", function () {
|
|
$(this).closest("tr").remove();
|
|
});
|
|
|
|
$(".simpan-ubah").on("click", function () {
|
|
const btn = $(this);
|
|
const notrans = $("#edit-notrans").val();
|
|
if (!notrans) {
|
|
Swal.fire({icon: "warning", title: "Belum ada data", text: "Buka ulang modal Ubah dari baris transaksi."});
|
|
return;
|
|
}
|
|
const nopolData = [];
|
|
$("#edit-list-nopol tr").each(function () {
|
|
const row = $(this);
|
|
nopolData.push({
|
|
nopol: row.find("td:nth-child(1)").text().trim(),
|
|
vehicle: row.find("td:nth-child(2)").data("value"),
|
|
member: row.find("td:nth-child(3)").text().trim(),
|
|
merk: row.find("td:nth-child(4)").text().trim(),
|
|
});
|
|
});
|
|
const cardNumber = [];
|
|
$("#edit-list-card tr").each(function () {
|
|
const row = $(this);
|
|
const nocard = row.find("td:nth-child(1)").text().trim();
|
|
if (!nocard) return;
|
|
cardNumber.push({ nocard: nocard, nourut: row.find("td:nth-child(2)").text().trim() });
|
|
});
|
|
const payload = {
|
|
nama: $("#ubah-member [name='nama']").val(),
|
|
address: $("#ubah-member [name='address']").val(),
|
|
phone: $("#ubah-member [name='phone']").val(),
|
|
member: $("#ubah-member [name='member']").val(),
|
|
depart: $("#ubah-member [name='depart']").val(),
|
|
note: $("#ubah-member [name='note']").val(),
|
|
harga: $("#ubah-member [name='harga']").val(),
|
|
daterange: $("#ubah-member [name='daterange']").val(),
|
|
nopolData: nopolData,
|
|
cardNumber: cardNumber,
|
|
};
|
|
const saveHtml = btn.html();
|
|
btn.prop("disabled", true).html('<span class="spinner-border spinner-border-sm me-1"></span>Menyimpan...');
|
|
$.ajax({
|
|
url: `${location.origin}/transaksi/member/${encodeURIComponent(notrans)}`,
|
|
type: "PUT",
|
|
data: payload,
|
|
headers: { "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content") },
|
|
success: function (r) {
|
|
$("#ubah-member").modal("hide");
|
|
Swal.fire({icon: "success", title: "Berhasil", text: r.message || "Data diperbarui."}).then(() => location.reload());
|
|
},
|
|
error: function (xhr) {
|
|
Swal.fire({icon: "error", title: "Gagal menyimpan", text: xhr.responseJSON?.message || "Periksa kembali isian."});
|
|
},
|
|
complete: function () {
|
|
btn.prop("disabled", false).html(saveHtml);
|
|
},
|
|
});
|
|
});
|
|
});
|