update: detail selesai
muamars
parent
56e16c328c
commit
4e6675d782
|
|
@ -51,6 +51,18 @@ namespace eSPJ.Controllers.SpjDriverUpstController
|
|||
return View("~/Views/Admin/Transport/SpjDriverUpst/DetailPenjemputan/DetailBatal.cshtml");
|
||||
}
|
||||
|
||||
[HttpGet("detail-selesai")]
|
||||
public IActionResult DetailSelesai()
|
||||
{
|
||||
return View("~/Views/Admin/Transport/SpjDriverUpst/DetailPenjemputan/DetailSelesai.cshtml");
|
||||
}
|
||||
|
||||
[HttpGet("detail-selesai-tanpa-tps")]
|
||||
public IActionResult DetailSelesaiTanpaTps()
|
||||
{
|
||||
return View("~/Views/Admin/Transport/SpjDriverUpst/DetailPenjemputan/DetailSelesaiTanpaTps.cshtml");
|
||||
}
|
||||
|
||||
[HttpPost("")]
|
||||
[ValidateAntiForgeryToken]
|
||||
public async Task<IActionResult> Submit([FromForm] DetailPenjemputanRequest request)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,190 @@
|
|||
@{
|
||||
Layout = "~/Views/Admin/Transport/SpjDriverUpst/Shared/_Layout.cshtml";
|
||||
ViewData["Title"] = "Detail SPJ";
|
||||
}
|
||||
|
||||
<div class="w-full lg:max-w-sm mx-auto bg-gray-50 min-h-screen pb-20">
|
||||
<div class="bg-upst text-white px-6 pt-8 pb-16 rounded-b-[40px] shadow-lg relative">
|
||||
<div class="flex items-center justify-between relative z-10">
|
||||
<a href="@Url.Action("Index", "Home")" class="w-10 h-10 flex items-center justify-center bg-white/10 rounded-xl backdrop-blur-md hover:bg-white/20 transition-all">
|
||||
<i class="w-5 h-5" data-lucide="chevron-left"></i>
|
||||
</a>
|
||||
<h1 class="text-lg font-black uppercase tracking-tight">Detail SPJ</h1>
|
||||
<div class="w-10"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 pb-6 relative -mt-10 z-20 space-y-4">
|
||||
<div class="bg-white rounded-2xl p-5 shadow-sm border border-gray-100">
|
||||
<div class="flex items-start justify-between gap-3 border-b border-gray-100 pb-4 mb-4">
|
||||
<div>
|
||||
<div class="flex items-center gap-2 mb-2 flex-wrap">
|
||||
<div class="bg-green-100 text-green-600 px-3 py-1 rounded-full text-xs font-bold border border-green-200" id="status-badge">-</div>
|
||||
<div class="text-xs text-gray-500" id="tanggal-selesai">-</div>
|
||||
</div>
|
||||
<h3 class="font-bold text-gray-900 text-lg" id="nama-perusahaan">-</h3>
|
||||
<p class="text-sm text-gray-700 leading-relaxed mt-1" id="alamat-perusahaan">-</p>
|
||||
</div>
|
||||
<div class="w-12 h-12 rounded-2xl bg-green-50 flex items-center justify-center text-green-600 border border-green-100 shrink-0">
|
||||
<i class="w-6 h-6" data-lucide="badge-check"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 gap-3">
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">No. SPJ</p>
|
||||
<p class="text-sm font-bold text-gray-800 wrap-break-word" id="nomor-spj">-</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">Plat Nomor</p>
|
||||
<p class="text-sm font-bold text-gray-800" id="plat-nomor">-</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">No. Pintu</p>
|
||||
<p class="text-sm font-bold text-gray-800" id="nomor-pintu">-</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">Petugas</p>
|
||||
<p class="text-sm font-bold text-gray-800" id="nama-checker">-</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-2xl p-5 shadow-sm border border-gray-100">
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<h3 class="font-bold text-gray-900">Ringkasan Timbangan</h3>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-3 gap-2 mb-4">
|
||||
<div class="bg-green-50 rounded-xl p-3 border border-green-100">
|
||||
<p class="text-[9px] text-green-600 font-bold uppercase tracking-wider">Organik</p>
|
||||
<p class="text-sm font-black text-green-700"><span id="total-organik">0,00</span> kg</p>
|
||||
</div>
|
||||
<div class="bg-blue-50 rounded-xl p-3 border border-blue-100">
|
||||
<p class="text-[9px] text-blue-600 font-bold uppercase tracking-wider">Anorganik</p>
|
||||
<p class="text-sm font-black text-blue-700"><span id="total-anorganik">0,00</span> kg</p>
|
||||
</div>
|
||||
<div class="bg-red-50 rounded-xl p-3 border border-red-100">
|
||||
<p class="text-[9px] text-red-600 font-bold uppercase tracking-wider">Residu</p>
|
||||
<p class="text-sm font-black text-red-700"><span id="total-residu">0,00</span> kg</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rounded-xl bg-upst/5 px-4 py-3 border border-upst/10 flex items-center justify-between">
|
||||
<p class="text-sm font-bold text-gray-700">Total Keseluruhan</p>
|
||||
<p class="text-2xl font-black text-upst"><span id="total-keseluruhan">0,00</span> kg</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-2xl p-5 shadow-sm border border-gray-100">
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<h3 class="font-bold text-gray-900">Daftar TPS</h3>
|
||||
</div>
|
||||
<div class="space-y-3" id="tps-list-container"></div>
|
||||
</div>
|
||||
</div>
|
||||
<partial name="~/Views/Admin/Transport/SpjDriverUpst/Shared/Components/_Navigation.cshtml" />
|
||||
|
||||
@section Scripts {
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', async function () {
|
||||
const formatWeight = (value) => new Intl.NumberFormat('id-ID', {
|
||||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2
|
||||
}).format(Number(value || 0));
|
||||
const formatDateTime = (value) => {
|
||||
const date = new Date(value);
|
||||
return new Intl.DateTimeFormat('id-ID', {
|
||||
day: '2-digit',
|
||||
month: 'short',
|
||||
year: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
timeZone: 'Asia/Jakarta'
|
||||
}).format(date) + ' WIB';
|
||||
};
|
||||
|
||||
const renderTpsList = (tpsList) => {
|
||||
const tpsContainer = document.getElementById('tps-list-container');
|
||||
tpsContainer.innerHTML = '';
|
||||
|
||||
if (!Array.isArray(tpsList) || tpsList.length === 0) {
|
||||
tpsContainer.innerHTML = '<div class="rounded-xl border border-dashed border-gray-300 bg-gray-50 px-4 py-5 text-center text-sm text-gray-500">Belum ada data TPS selesai.</div>';
|
||||
return;
|
||||
}
|
||||
|
||||
tpsList.forEach((tps) => {
|
||||
const status = (tps.status || 'Selesai').toLowerCase();
|
||||
const isBatal = status === 'batal';
|
||||
const statusBadgeClass = isBatal
|
||||
? 'bg-red-100 text-red-700'
|
||||
: 'bg-green-100 text-green-700';
|
||||
const itemClass = isBatal
|
||||
? 'rounded-2xl border border-red-100 bg-red-50 p-4'
|
||||
: 'rounded-2xl border border-gray-100 bg-gray-50 p-4';
|
||||
const detailNote = isBatal && tps.keterangan
|
||||
? `<div class="mt-3 rounded-xl border border-red-200 bg-white px-3 py-2 text-xs text-red-700 leading-relaxed">${tps.keterangan}</div>`
|
||||
: '';
|
||||
const item = document.createElement('div');
|
||||
item.className = itemClass;
|
||||
item.innerHTML = `
|
||||
<div class="flex flex-col items-start justify-between gap-3 mb-3">
|
||||
<div>
|
||||
<div class="flex items-center gap-2 mb-1 flex-wrap">
|
||||
<span class="bg-blue-100 text-blue-700 px-2.5 py-1 rounded-full text-[10px] font-black uppercase tracking-wider">${tps.kode}</span>
|
||||
<span class="${statusBadgeClass} px-2.5 py-1 rounded-full text-[10px] font-bold">${tps.status || 'Selesai'}</span>
|
||||
</div>
|
||||
<h4 class="font-bold text-gray-900 text-sm">${tps.nama}</h4>
|
||||
<p class="text-xs text-gray-500 mt-1 leading-relaxed">${tps.alamat}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-2 text-xs">
|
||||
<div class="rounded-xl bg-white border border-gray-100 p-3">
|
||||
<p class="text-gray-400 font-black uppercase tracking-wider text-[9px] mb-1">Organik</p>
|
||||
<p class="font-black text-green-700">${formatWeight(tps.timbangan.organik)} kg</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-white border border-gray-100 p-3">
|
||||
<p class="text-gray-400 font-black uppercase tracking-wider text-[9px] mb-1">Anorganik</p>
|
||||
<p class="font-black text-blue-700">${formatWeight(tps.timbangan.anorganik)} kg</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-white border border-gray-100 p-3">
|
||||
<p class="text-gray-400 font-black uppercase tracking-wider text-[9px] mb-1">Residu</p>
|
||||
<p class="font-black text-red-700">${formatWeight(tps.timbangan.residu)} kg</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-white border border-upst/10 p-3">
|
||||
<p class="text-gray-400 font-black uppercase tracking-wider text-[9px] mb-1">Total</p>
|
||||
<p class="font-black text-upst text-md">${formatWeight(tps.timbangan.total)} kg</p>
|
||||
</div>
|
||||
</div>
|
||||
${detailNote}
|
||||
`;
|
||||
tpsContainer.appendChild(item);
|
||||
});
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch('/driver/json/selesai-data.json');
|
||||
const data = await response.json();
|
||||
const selesai = data.selesai;
|
||||
|
||||
document.getElementById('status-badge').textContent = selesai.status;
|
||||
document.getElementById('nama-perusahaan').textContent = selesai.namaPerusahaan;
|
||||
document.getElementById('alamat-perusahaan').textContent = selesai.alamat;
|
||||
document.getElementById('nomor-spj').textContent = selesai.nomorSpj;
|
||||
document.getElementById('plat-nomor').textContent = selesai.platNomor;
|
||||
document.getElementById('nomor-pintu').textContent = selesai.nomorPintu;
|
||||
document.getElementById('nama-checker').textContent = selesai.petugas.checker;
|
||||
|
||||
document.getElementById('total-organik').textContent = formatWeight(selesai.timbangan.organik);
|
||||
document.getElementById('total-anorganik').textContent = formatWeight(selesai.timbangan.anorganik);
|
||||
document.getElementById('total-residu').textContent = formatWeight(selesai.timbangan.residu);
|
||||
document.getElementById('total-keseluruhan').textContent = formatWeight(selesai.timbangan.total);
|
||||
|
||||
document.getElementById('tanggal-selesai').textContent = formatDateTime(selesai.tanggalSelesai);
|
||||
renderTpsList(selesai.tpsList);
|
||||
} catch (error) {
|
||||
console.error('Error loading selesai data:', error);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
|
@ -0,0 +1,126 @@
|
|||
@{
|
||||
Layout = "~/Views/Admin/Transport/SpjDriverUpst/Shared/_Layout.cshtml";
|
||||
ViewData["Title"] = "Detail SPJ";
|
||||
}
|
||||
|
||||
<div class="w-full lg:max-w-sm mx-auto bg-gray-50 min-h-screen pb-20">
|
||||
<div class="bg-upst text-white px-6 pt-8 pb-16 rounded-b-[40px] shadow-lg relative">
|
||||
<div class="flex items-center justify-between relative z-10">
|
||||
<a href="@Url.Action("Index", "Home")" class="w-10 h-10 flex items-center justify-center bg-white/10 rounded-xl backdrop-blur-md hover:bg-white/20 transition-all">
|
||||
<i class="w-5 h-5" data-lucide="chevron-left"></i>
|
||||
</a>
|
||||
<h1 class="text-lg font-black uppercase tracking-tight">Detail SPJ</h1>
|
||||
<div class="w-10"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 pb-6 relative -mt-10 z-20 space-y-4">
|
||||
<div class="bg-white rounded-2xl p-5 shadow-sm border border-gray-100">
|
||||
<div class="flex items-start justify-between gap-3 border-b border-gray-100 pb-4 mb-4">
|
||||
<div>
|
||||
<div class="flex items-center gap-2 mb-2 flex-wrap">
|
||||
<div class="bg-green-100 text-green-600 px-3 py-1 rounded-full text-xs font-bold border border-green-200" id="status-badge">-</div>
|
||||
<div class="text-xs text-gray-500" id="tanggal-selesai">-</div>
|
||||
</div>
|
||||
<h3 class="font-bold text-gray-900 text-lg" id="nama-perusahaan">-</h3>
|
||||
<p class="text-sm text-gray-700 leading-relaxed mt-1" id="alamat-perusahaan">-</p>
|
||||
</div>
|
||||
<div class="w-12 h-12 rounded-2xl bg-green-50 flex items-center justify-center text-green-600 border border-green-100 shrink-0">
|
||||
<i class="w-6 h-6" data-lucide="badge-check"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 gap-3">
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">No. SPJ</p>
|
||||
<p class="text-sm font-bold text-gray-800 wrap-break-word" id="nomor-spj">-</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">Plat Nomor</p>
|
||||
<p class="text-sm font-bold text-gray-800" id="plat-nomor">-</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">No. Pintu</p>
|
||||
<p class="text-sm font-bold text-gray-800" id="nomor-pintu">-</p>
|
||||
</div>
|
||||
<div class="rounded-xl bg-gray-50 border border-gray-100 p-3">
|
||||
<p class="text-[10px] font-black uppercase tracking-widest text-gray-400 mb-1">Petugas</p>
|
||||
<p class="text-sm font-bold text-gray-800" id="nama-checker">-</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-2xl p-5 shadow-sm border border-gray-100">
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<h3 class="font-bold text-gray-900">Ringkasan Timbangan</h3>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-3 gap-2 mb-4">
|
||||
<div class="bg-green-50 rounded-xl p-3 border border-green-100">
|
||||
<p class="text-[9px] text-green-600 font-bold uppercase tracking-wider">Organik</p>
|
||||
<p class="text-sm font-black text-green-700"><span id="total-organik">0,00</span> kg</p>
|
||||
</div>
|
||||
<div class="bg-blue-50 rounded-xl p-3 border border-blue-100">
|
||||
<p class="text-[9px] text-blue-600 font-bold uppercase tracking-wider">Anorganik</p>
|
||||
<p class="text-sm font-black text-blue-700"><span id="total-anorganik">0,00</span> kg</p>
|
||||
</div>
|
||||
<div class="bg-red-50 rounded-xl p-3 border border-red-100">
|
||||
<p class="text-[9px] text-red-600 font-bold uppercase tracking-wider">Residu</p>
|
||||
<p class="text-sm font-black text-red-700"><span id="total-residu">0,00</span> kg</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rounded-xl bg-upst/5 px-4 py-3 border border-upst/10 flex items-center justify-between">
|
||||
<p class="text-sm font-bold text-gray-700">Total Keseluruhan</p>
|
||||
<p class="text-2xl font-black text-upst"><span id="total-keseluruhan">0,00</span> kg</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<partial name="~/Views/Admin/Transport/SpjDriverUpst/Shared/Components/_Navigation.cshtml" />
|
||||
</div>
|
||||
|
||||
@section Scripts {
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', async function () {
|
||||
const formatWeight = (value) => new Intl.NumberFormat('id-ID', {
|
||||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2
|
||||
}).format(Number(value || 0));
|
||||
const formatDateTime = (value) => {
|
||||
const date = new Date(value);
|
||||
return new Intl.DateTimeFormat('id-ID', {
|
||||
day: '2-digit',
|
||||
month: 'short',
|
||||
year: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
timeZone: 'Asia/Jakarta'
|
||||
}).format(date) + ' WIB';
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch('/driver/json/selesai-tanpa-tps-data.json');
|
||||
const data = await response.json();
|
||||
const selesai = data.selesai;
|
||||
|
||||
document.getElementById('status-badge').textContent = selesai.status;
|
||||
document.getElementById('tanggal-selesai').textContent = formatDateTime(selesai.tanggalSelesai);
|
||||
document.getElementById('nama-perusahaan').textContent = selesai.namaPerusahaan;
|
||||
document.getElementById('alamat-perusahaan').textContent = selesai.alamat;
|
||||
document.getElementById('nomor-spj').textContent = selesai.nomorSpj;
|
||||
document.getElementById('plat-nomor').textContent = selesai.platNomor;
|
||||
document.getElementById('nomor-pintu').textContent = selesai.nomorPintu;
|
||||
document.getElementById('nama-checker').textContent = selesai.petugas.checker;
|
||||
document.getElementById('total-organik').textContent = formatWeight(selesai.timbangan.organik);
|
||||
document.getElementById('total-anorganik').textContent = formatWeight(selesai.timbangan.anorganik);
|
||||
document.getElementById('total-residu').textContent = formatWeight(selesai.timbangan.residu);
|
||||
document.getElementById('total-keseluruhan').textContent = formatWeight(selesai.timbangan.total);
|
||||
} catch (error) {
|
||||
console.error('Error loading selesai tanpa TPS data:', error);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
|
|
@ -139,11 +139,26 @@
|
|||
</div>
|
||||
</a>
|
||||
|
||||
<a href="@Url.Action("TanpaTps", "DetailPenjemputan")" class="block relative pl-12 group">
|
||||
<a href="@Url.Action("DetailSelesai", "DetailPenjemputan")" class="block relative pl-12 group">
|
||||
<div class="absolute left-4 top-1 w-4 h-4 bg-green-500 rounded-full z-10 ring-4 ring-green-100"></div>
|
||||
<div class="bg-green-50/50 p-4 rounded-3xl border border-green-100 shadow-sm group-active:bg-green-100 transition-colors">
|
||||
<div class="flex justify-between items-start mb-2">
|
||||
<span class="text-[9px] font-black text-green-600 uppercase tracking-widest italic tracking-tighter">Selesai</span>
|
||||
<span class="text-[9px] font-black text-green-600 uppercase italic tracking-tighter">Selesai</span>
|
||||
<i class="w-4 h-4 text-green-500" data-lucide="check-circle-2"></i>
|
||||
</div>
|
||||
<h4 class="font-bold text-gray-800 text-sm leading-tight">CV Tri Mitra Utama - Shell Radio Dalam</h4>
|
||||
<p class="text-[10px] text-green-700/60 mt-2">Jakarta Selatan</p>
|
||||
<div class="mt-2">
|
||||
<span class="text-[9px] font-bold text-blue-600 bg-blue-50 px-2 py-1 rounded-lg">Ada 3 TPS</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="@Url.Action("DetailSelesaiTanpaTps", "DetailPenjemputan")" class="block relative pl-12 group">
|
||||
<div class="absolute left-4 top-1 w-4 h-4 bg-green-500 rounded-full z-10 ring-4 ring-green-100"></div>
|
||||
<div class="bg-green-50/50 p-4 rounded-3xl border border-green-100 shadow-sm group-active:bg-green-100 transition-colors">
|
||||
<div class="flex justify-between items-start mb-2">
|
||||
<span class="text-[9px] font-black text-green-600 uppercase italic tracking-tighter">Selesai</span>
|
||||
<i class="w-4 h-4 text-green-500" data-lucide="check-circle-2"></i>
|
||||
</div>
|
||||
<h4 class="font-bold text-gray-800 text-sm leading-tight">CV Tri Berkah Sejahtera</h4>
|
||||
|
|
@ -158,7 +173,7 @@
|
|||
<div class="absolute left-4 top-1 w-4 h-4 bg-red-500 rounded-full z-10 ring-4 ring-red-100"></div>
|
||||
<div class="bg-red-50/50 p-4 rounded-3xl border border-red-100 shadow-sm group-active:bg-red-100 transition-colors">
|
||||
<div class="flex justify-between items-start mb-2">
|
||||
<span class="text-[9px] font-black text-red-600 uppercase tracking-widest italic tracking-tighter">Batal</span>
|
||||
<span class="text-[9px] font-black text-red-600 uppercase italic tracking-tighter">Batal</span>
|
||||
<i class="w-4 h-4 text-red-500" data-lucide="x-circle"></i>
|
||||
</div>
|
||||
<h4 class="font-bold text-gray-800 text-sm leading-tight">CV Tri Berkah Sejahtera</h4>
|
||||
|
|
|
|||
|
|
@ -109,6 +109,8 @@
|
|||
--text-xl--line-height: calc(1.75 / 1.25);
|
||||
--text-2xl: 1.5rem;
|
||||
--text-2xl--line-height: calc(2 / 1.5);
|
||||
--text-5xl: 3rem;
|
||||
--text-5xl--line-height: 1;
|
||||
--font-weight-medium: 500;
|
||||
--font-weight-semibold: 600;
|
||||
--font-weight-bold: 700;
|
||||
|
|
@ -567,6 +569,12 @@
|
|||
.col-auto {
|
||||
grid-column: auto;
|
||||
}
|
||||
.col-span-1 {
|
||||
grid-column: span 1 / span 1;
|
||||
}
|
||||
.col-span-2 {
|
||||
grid-column: span 2 / span 2;
|
||||
}
|
||||
.float-end {
|
||||
float: inline-end;
|
||||
}
|
||||
|
|
@ -798,6 +806,12 @@
|
|||
.ml-auto {
|
||||
margin-left: auto;
|
||||
}
|
||||
.line-clamp-2 {
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
.line-clamp-3 {
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
|
|
@ -861,6 +875,9 @@
|
|||
.h-3 {
|
||||
height: calc(var(--spacing) * 3);
|
||||
}
|
||||
.h-3\.5 {
|
||||
height: calc(var(--spacing) * 3.5);
|
||||
}
|
||||
.h-4 {
|
||||
height: calc(var(--spacing) * 4);
|
||||
}
|
||||
|
|
@ -969,6 +986,9 @@
|
|||
.w-3 {
|
||||
width: calc(var(--spacing) * 3);
|
||||
}
|
||||
.w-3\.5 {
|
||||
width: calc(var(--spacing) * 3.5);
|
||||
}
|
||||
.w-4 {
|
||||
width: calc(var(--spacing) * 4);
|
||||
}
|
||||
|
|
@ -1074,6 +1094,9 @@
|
|||
.shrink {
|
||||
flex-shrink: 1;
|
||||
}
|
||||
.shrink-0 {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.flex-grow {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
|
@ -1212,6 +1235,9 @@
|
|||
.gap-1 {
|
||||
gap: calc(var(--spacing) * 1);
|
||||
}
|
||||
.gap-1\.5 {
|
||||
gap: calc(var(--spacing) * 1.5);
|
||||
}
|
||||
.gap-2 {
|
||||
gap: calc(var(--spacing) * 2);
|
||||
}
|
||||
|
|
@ -2088,6 +2114,9 @@
|
|||
.px-2 {
|
||||
padding-inline: calc(var(--spacing) * 2);
|
||||
}
|
||||
.px-2\.5 {
|
||||
padding-inline: calc(var(--spacing) * 2.5);
|
||||
}
|
||||
.px-3 {
|
||||
padding-inline: calc(var(--spacing) * 3);
|
||||
}
|
||||
|
|
@ -2109,6 +2138,9 @@
|
|||
.py-1 {
|
||||
padding-block: calc(var(--spacing) * 1);
|
||||
}
|
||||
.py-1\.5 {
|
||||
padding-block: calc(var(--spacing) * 1.5);
|
||||
}
|
||||
.py-2 {
|
||||
padding-block: calc(var(--spacing) * 2);
|
||||
}
|
||||
|
|
@ -2127,6 +2159,9 @@
|
|||
.py-6 {
|
||||
padding-block: calc(var(--spacing) * 6);
|
||||
}
|
||||
.py-10 {
|
||||
padding-block: calc(var(--spacing) * 10);
|
||||
}
|
||||
.py-12 {
|
||||
padding-block: calc(var(--spacing) * 12);
|
||||
}
|
||||
|
|
@ -2380,6 +2415,9 @@
|
|||
.text-wrap {
|
||||
text-wrap: wrap;
|
||||
}
|
||||
.wrap-break-word {
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
.break-all {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
|
@ -2398,6 +2436,12 @@
|
|||
.text-blue-700 {
|
||||
color: var(--color-blue-700);
|
||||
}
|
||||
.text-blue-700\/60 {
|
||||
color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 60%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
color: color-mix(in oklab, var(--color-blue-700) 60%, transparent);
|
||||
}
|
||||
}
|
||||
.text-blue-800 {
|
||||
color: var(--color-blue-800);
|
||||
}
|
||||
|
|
@ -2815,6 +2859,13 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.group-hover\:border-gray-200 {
|
||||
&:is(:where(.group):hover *) {
|
||||
@media (hover: hover) {
|
||||
border-color: var(--color-gray-200);
|
||||
}
|
||||
}
|
||||
}
|
||||
.group-hover\:text-gray-500 {
|
||||
&:is(:where(.group):hover *) {
|
||||
@media (hover: hover) {
|
||||
|
|
@ -2836,6 +2887,14 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.group-hover\:shadow {
|
||||
&:is(:where(.group):hover *) {
|
||||
@media (hover: hover) {
|
||||
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
||||
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
||||
}
|
||||
}
|
||||
}
|
||||
.group-hover\:shadow-md {
|
||||
&:is(:where(.group):hover *) {
|
||||
@media (hover: hover) {
|
||||
|
|
@ -2962,6 +3021,13 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.hover\:border-gray-200 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
border-color: var(--color-gray-200);
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:border-orange-200 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
|
|
@ -3280,6 +3346,11 @@
|
|||
scale: var(--tw-scale-x) var(--tw-scale-y);
|
||||
}
|
||||
}
|
||||
.sm\:grid-cols-4 {
|
||||
@media (width >= 40rem) {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
.lg\:max-w-sm {
|
||||
@media (width >= 64rem) {
|
||||
max-width: var(--container-sm);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,66 @@
|
|||
{
|
||||
"selesai": {
|
||||
"namaPerusahaan": "CV Tri Mitra Utama - Shell Radio Dalam",
|
||||
"alamat": "Jl. Radio Dalam Raya No.6C, Gandaria Utara, Kebayoran Baru, Kota Adm. Jakarta Selatan 12140",
|
||||
"tanggalSelesai": "2026-03-10T11:20:00",
|
||||
"status": "Selesai",
|
||||
"nomorSpj": "SPJ/07-2025/PKM/000476",
|
||||
"platNomor": "B 9632 TOR",
|
||||
"nomorPintu": "JRC 005",
|
||||
"petugas": {
|
||||
"driver": "Muammar Fikri",
|
||||
"checker": "Rizky Ananda"
|
||||
},
|
||||
"timbangan": {
|
||||
"organik": 186.4,
|
||||
"anorganik": 92.15,
|
||||
"residu": 28.35,
|
||||
"total": 306.9
|
||||
},
|
||||
"tpsList": [
|
||||
{
|
||||
"id": 1,
|
||||
"kode": "TPS-01",
|
||||
"nama": "TPS RW 01 Gandaria Utara",
|
||||
"status": "Selesai",
|
||||
"alamat": "Jl. H. Nawi Dalam Gg. Keluarga No.12, Kebayoran Baru",
|
||||
"waktuSelesai": "2026-03-10T09:15:00",
|
||||
"timbangan": {
|
||||
"organik": 62.4,
|
||||
"anorganik": 31.25,
|
||||
"residu": 8.1,
|
||||
"total": 101.75
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"kode": "TPS-02",
|
||||
"nama": "TPS Pasar Mayestik",
|
||||
"status": "Batal",
|
||||
"alamat": "Jl. Tebah III, Gunung, Kebayoran Baru",
|
||||
"waktuBatal": "2026-03-10T10:02:00",
|
||||
"keterangan": "Akses kendaraan tertutup aktivitas bongkar muat pasar sehingga penjemputan TPS ini dibatalkan.",
|
||||
"timbangan": {
|
||||
"organik": 0,
|
||||
"anorganik": 0,
|
||||
"residu": 0,
|
||||
"total": 0
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"kode": "TPS-03",
|
||||
"nama": "TPS Komersial Radio Dalam",
|
||||
"status": "Selesai",
|
||||
"alamat": "Jl. Radio Dalam Raya Sisi Timur, Kebayoran Baru",
|
||||
"waktuSelesai": "2026-03-10T10:48:00",
|
||||
"timbangan": {
|
||||
"organik": 69.2,
|
||||
"anorganik": 32.5,
|
||||
"residu": 10.9,
|
||||
"total": 112.6
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
{
|
||||
"selesai": {
|
||||
"namaPerusahaan": "CV Tri Berkah Sejahtera",
|
||||
"alamat": "Kp. Pertanian II Rt.004 Rw.001 Kel. Klender Kec, Duren Sawit, Kota Adm. Jakarta Timur 13470",
|
||||
"tanggalSelesai": "2026-03-10T10:35:00",
|
||||
"status": "Selesai",
|
||||
"nomorSpj": "SPJ/07-2025/PKM/000477",
|
||||
"platNomor": "B 9041 UPT",
|
||||
"nomorPintu": "JRC 011",
|
||||
"petugas": {
|
||||
"driver": "Andri Saputra",
|
||||
"checker": "Nabila Putri"
|
||||
},
|
||||
"timbangan": {
|
||||
"organik": 128.5,
|
||||
"anorganik": 74.25,
|
||||
"residu": 19.8,
|
||||
"total": 222.55
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue