banksampah
/
bank-sampah
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(HargaSampah): add button hide harga

main
Kevin Hendrawan 2025-11-20 00:14:08 +07:00
parent 9aa6420c6d
commit 804cce0b51
1 changed files with 76 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
Views/Data/HargaSampah/Index.cshtml
View File

@ -10,10 +10,17 @@
</div>
<div>
<button class="btn btn-sm rounded-full bg-green-800 text-white hover:bg-green-900" onclick="modal_tambah.showModal()">
<i class="ph ph-plus"></i>
Tambah
</button>
<div class="flex gap-2">
<button id="togglePriceBtn" class="btn btn-sm rounded-full bg-white">
<i id="eyeIcon" class="ph ph-eye-slash"></i>
<span id="btnText">Sembunyikan Harga</span>
</button>
<button class="btn btn-sm rounded-full bg-green-800 text-white hover:bg-green-900" onclick="modal_tambah.showModal()">
<i class="ph ph-plus"></i>
Tambah
</button>
</div>
</div>
</div>
@ -64,6 +71,49 @@
</dialog>
<!-- /modal tambah/edit -->
<!-- Modal Hide Harga -->
<dialog id="modal_hide" class="modal modal-bottom sm:modal-middle">
<div class="modal-box w-full max-w-lg p-6 bg-white rounded-2xl">
<!-- Header -->
<div class="flex items-start justify-between mb-4">
<div class="flex items-center gap-2">
<i class="ph ph-info text-red-500 text-xl"></i>
</div>
<button onclick="modal_hide.close()" class="text-gray-500 hover:text-gray-700 cursor-pointer">
<i class="ph ph-x text-lg"></i>
</button>
</div>
<!-- Message -->
<p class="text-gray-700 leading-relaxed mb-8 text-base">
Apakah Anda yakin ingin menyembunyikan (hide) harga sampah ini dari tampilan publik pada halaman Landing Page?
</p>
<!-- Buttons -->
<form id="formHide" onsubmit="submitFormHide(event)">
<div class="flex justify-end gap-3">
<button type="button" onclick="modal_hide.close()"
class="px-8 py-2.5 bg-white rounded-full outline outline-1 outline-gray-300 text-gray-700 font-semibold hover:bg-gray-50">
Tidak
</button>
<button type="submit"
class="px-8 py-2.5 bg-green-800 rounded-full text-white font-semibold hover:bg-green-900 cursor-pointer">
Ya
</button>
</div>
</form>
</div>
<form method="dialog" class="modal-backdrop">
<button>close</button>
</form>
</dialog>
<!-- End Modal Hide Harga -->
<div class="h-6"></div>
<div class="card bg-white shadow-sm">
@ -90,6 +140,7 @@
@section Scripts {
<script type="text/javascript">
var table;
var isHidden = false;
$(document).ready(function () {
table = new DataTable('#example', {
@ -103,8 +154,11 @@
{ data: null, render: (d, t, r, m) => m.row + 1, orderable: false, searchable: false },
{ data: 'nama_subkategori' },
{
data: 'harga',
data: 'harga',
render: function(data) {
if (isHidden) {
return '********';
}
return new Intl.NumberFormat('id-ID').format(data);
}
},
@ -165,6 +219,10 @@
// Open modal
modal_tambah.showModal();
});
$('#togglePriceBtn').on('click', function() {
modal_hide.showModal();
});
});
function closeModal() {
@ -199,5 +257,18 @@
table.ajax.reload();
});
}
function submitFormHide(e){
e.preventDefault();
modal_hide.close();
Swal.fire({
icon: 'success',
title: 'Sukses!',
text: 'Data harga berhasil di sembunyikan.',
timer: 1000,
showConfirmButton: false
});
}
</script>
}