Magang-2025/Kasir
11
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[update] strukview

Browse Source
This commit is contained in:
dhilanradya 2025-09-29 16:55:18 +07:00
parent dac6f59018
commit 5999ff6359
1 changed files with 30 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
resources/js/components/StrukView.vue
View File

@ -3,7 +3,7 @@
class="text-D pt-serif-regular-italic fixed inset-0 bg-black/75 flex items-center justify-center z-[9999]"> class="text-D pt-serif-regular-italic fixed inset-0 bg-black/75 flex items-center justify-center z-[9999]">
<!-- print-area untuk fokus saat print --> <!-- print-area untuk fokus saat print -->
<div class="print-area bg-white w-[1224px] h-[528px] rounded-md shadow-lg relative overflow-hidden"> <div class="print-area bg-white w-[1224px] h-[528px] shadow-lg relative overflow-hidden">
<div class="bg-yellow-500 h-8 w-full"> <div class="bg-yellow-500 h-8 w-full">
<div class="bg-D h-6 w-full"></div> <div class="bg-D h-6 w-full"></div>
</div> </div>
@ -104,9 +104,9 @@
</tbody> </tbody>
</table> </table>
<!-- Bagian bawah -->
<div class="flex text-sm mt-2"> <div class="flex text-sm mt-2">
<!-- PERHATIAN -->
<div class="w-[40%] p-2 text-left"> <div class="w-[40%] p-2 text-left">
<p class="font-semibold">PERHATIAN</p> <p class="font-semibold">PERHATIAN</p>
<ol class="list-decimal ml-4 text-xs space-y-1"> <ol class="list-decimal ml-4 text-xs space-y-1">
@ -117,7 +117,7 @@
</ol> </ol>
</div> </div>
<!-- SALES -->
<div class="w-[20%] p-2 flex flex-col items-center justify-center"> <div class="w-[20%] p-2 flex flex-col items-center justify-center">
<p><strong>Hormat Kami</strong></p> <p><strong>Hormat Kami</strong></p>
<div class="mt-16 text-sm text-center"> <div class="mt-16 text-sm text-center">
@ -125,10 +125,10 @@
</div> </div>
</div> </div>
<!-- ONGKOS & TOTAL -->
<div class="ml-auto w-[25%] p-2 flex flex-col justify-between"> <div class="ml-auto w-[25%] p-2 flex flex-col justify-between">
<div class="space-y-4"> <div class="space-y-4">
<!-- Ongkos bikin -->
<div class="flex items-start justify-between"> <div class="flex items-start justify-between">
<div class="flex flex-col"> <div class="flex flex-col">
<p class="font-semibold">Ongkos bikin</p> <p class="font-semibold">Ongkos bikin</p>
@ -159,7 +159,7 @@
<button @click="$emit('close')" class="bg-gray-400 text-white px-6 py-2 rounded"> <button @click="$emit('close')" class="bg-gray-400 text-white px-6 py-2 rounded">
Tutup Tutup
</button> </button>
<button @click="handlePrint" class="bg-blue-500 text-white px-6 py-2 rounded"> <button @click="handlePrint" class="bg-C text-white px-6 py-2 rounded">
Print Print
</button> </button>
</div> </div>
@ -215,12 +215,12 @@ const itemsWithMinimal = computed(() => {
props.transaksi.item_transaksi || props.transaksi.item_transaksi ||
[] []
const arr = [...items] const arr = [...items]
// biar minimal ada 1 row terlihat
if (arr.length === 0) arr.push({ produk: {}, harga_deal: 0, posisi_asal: '' }) if (arr.length === 0) arr.push({ produk: {}, harga_deal: 0, posisi_asal: '' })
return arr return arr
}) })
// === Tambahan style/helper sama dengan strukoverlay ===
const getRowStyle = () => { const getRowStyle = () => {
if (itemsWithMinimal.value.length === 1) { if (itemsWithMinimal.value.length === 1) {
return { height: '126px' } return { height: '126px' }
@ -258,23 +258,39 @@ const formatNumber = (number) => {
font-weight: 400; font-weight: 400;
} }
/* Print styles */
@media print { @media print {
@page {
size: A4; /* atau '80mm 200mm' kalau thermal */
margin: Minimum;
}
/* Sembunyikan semua elemen di luar print-area */
body * { body * {
visibility: hidden; visibility: hidden !important;
} }
.print-area, .print-area * { .print-area * {
visibility: visible; visibility: visible !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
} }
.print-area { .print-area {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
transform: scale(0.5); width: 1224px;
height: 528px;
margin: 0;
padding: 0;
transform: scale(0.6673);
transform-origin: top left; transform-origin: top left;
} }
/* Hilangkan tombol tutup & print */
.no-print { .no-print {
display: none !important; display: none !important;
} }
} }
</style> </style>