[update] revisi struk

This commit is contained in:
dhilanradya 2025-09-09 11:24:13 +07:00
parent 7f4b41b904
commit b9c562d0a2

View File

@ -52,121 +52,119 @@
<!-- Nomor Transaksi --> <!-- Nomor Transaksi -->
<p class="mt-1 text-sm">TRS-XXX-XXX</p> <p class="mt-1 text-sm">TRS-XXX-XXX</p>
<!-- Table Barang --> <table class="w-full border-D mt-0 text-sm table-fixed">
<table class="w-full border-D mt-0 text-sm"> <thead>
<thead> <tr class="border-b border-D">
<tr class="border-b border-D"> <th class="w-[260px] py-2 border-r border-D">Item</th>
<th class="w-32 py-2 border-r border-D">Item</th> <th class="w-[70px] border-r border-D">Posisi</th>
<th class="w-32 py-2 border-r border-D">Posisi</th> <th class="w-[60px] border-r border-D">Berat</th>
<th class="w-20 border-r border-D">Berat</th> <th class="w-[60px] border-r border-D">Kadar</th>
<th class="w-20 border-r border-D">Kadar</th> <th class="w-[140px] border-r border-D">Harga Satuan</th>
<th class="w-32 border-r border-D">Harga Satuan</th> <th class="w-[60px] border-r border-D">Jumlah</th>
<th class="w-20 border-r border-D">Jumlah</th> <th class="w-[140px]">Total Harga</th>
<th class="w-32">Total Harga</th> </tr>
</tr> </thead>
</thead> <tbody>
<tbody> <!-- Barang 1 -->
<!-- Barang 1 --> <tr class="text-center">
<tr class="text-center"> <td class="flex items-center gap-2 p-2 border-r border-D">
<td class="flex items-center gap-2 p-2 border-r border-D"> <img src="" class="w-12 h-12 object-cover" />
<img src="" class="w-12 h-12 object-cover" /> Ring XXX
Ring XXX </td>
</td> <td class="border-r border-D">A1, Brankas</td>
<td class="border-r border-D">A1, Brankas</td> <td class="border-r border-D">2,4 g</td>
<td class="border-r border-D">2,4 g</td> <td class="border-r border-D">23 K</td>
<td class="border-r border-D">23 K</td> <td class="border-r border-D">Rp9.000.000</td>
<td class="border-r border-D">Rp9.000.000</td> <td class="border-r border-D">2</td>
<td class="border-r border-D">2</td> <td>Rp18.000.000</td>
<td>Rp18.000.000</td> </tr>
</tr>
<!-- Barang 2 --> <!-- Barang 2 -->
<tr class="text-center border-b"> <tr class="text-center border-b">
<td class="flex items-center gap-2 p-2 border-r border-D"> <td class="flex items-center gap-2 p-2 border-r border-D">
<img src="" class="w-12 h-12 object-cover" /> <img src="" class="w-12 h-12 object-cover" />
Necklace XXX Necklace XXX
</td> </td>
<td class="border-r border-D">A2</td> <td class="border-r border-D">A2</td>
<td class="border-r border-D">2,4 g</td> <td class="border-r border-D">2,4 g</td>
<td class="border-r border-D">23 K</td> <td class="border-r border-D">23 K</td>
<td class="border-r border-D">Rp3.000.000</td> <td class="border-r border-D">Rp3.000.000</td>
<td class="border-r border-D">1</td> <td class="border-r border-D">1</td>
<td>Rp3.000.000</td> <td>Rp3.000.000</td>
</tr> </tr>
<tr class="align-top"> <!-- Baris Ongkos + Total -->
<td colspan="2" rowspan="2" class="p-2 text-left align-top"> <tr class="align-top">
<p class="font-semibold">PERHATIAN</p> <td colspan="2" rowspan="2" class="p-2 text-left align-top">
<ol class="list-decimal ml-4 text-xs space-y-1"> <p class="font-semibold">PERHATIAN</p>
<li>Berat barang telah ditimbang dan disaksikan oleh pembeli.</li> <ol class="list-decimal ml-4 text-xs space-y-1">
<li> <li>Berat barang telah ditimbang dan disaksikan oleh pembeli.</li>
Barang yang dikembalikan menurut harga pasaran dan dipotong <li>Barang yang dikembalikan menurut harga pasaran dan <br> dipotong ongkos bikin, barang rusak lain harga.</li>
ongkos bikin, barang rusak lain harga. <li>Barang yang sudah dibeli berarti sudah diperiksa dan disetujui.</li>
</li> <li>Surat ini harap dibawa pada saat menjual kembali.</li>
<li> </ol>
Barang yang sudah dibeli berarti sudah diperiksa dan </td>
disetujui.
</li> <td colspan="2" rowspan="2" class="p-2 text-center align-top">
<li>Surat ini harus dibawa pada saat menjual kembali.</li> <div class="flex flex-col items-center justify-center h-full">
</ol> <p><strong>Sales</strong></p>
</td> <inputSelect
v-model="sales"
:options="[
{ value: 'Timothy', label: 'Timothy' },
{ value: 'Iwan', label: 'Iwan' }
]"
class="mt-16 text-sm rounded bg-B cursor-pointer !w-[160px] text-center [option]:text-left"
/>
</div>
</td>
<td colspan="2" class="p-2 text-right text-sm font-semibold align-top border-r">
<div class="space-y-2">
<p>Ongkos bikin</p>
<p class="text-red-500 text-xs">diluar harga jual</p>
<p>Total</p>
</div>
</td>
<td class="p-2 text-sm align-top">
<div class="space-y-2">
<div class="flex items-center">
<p>Rp</p>
<inputField
class="h-7 px-2 text-sm rounded bg-blue-200 text-left w-full"
/>
</div>
<div class="flex items-center">
<p>Rp</p>
<p class="px-3 py-1 text-left text-sm w-full">21.200.000</p>
</div>
</div>
</td>
</tr>
<!-- Baris Tombol -->
<tr>
<td></td>
<td></td>
<td class="p-2 text-center">
<div class="flex gap-2">
<button class="bg-gray-400 text-white px-6 py-2 rounded w-full">
Batal
</button>
<button class="bg-C text-white px-6 py-2 rounded w-full">
Simpan
</button>
</div>
</td>
</tr>
</tbody>
</table>
<td colspan="3" rowspan="2" class="p-2 text-center align-top">
<div class="flex flex-col items-center justify-center h-full">
<p><strong>Sales</strong></p>
<inputSelect
v-model="sales"
:options="[
{ value: 'Timothy', label: 'Timothy' },
{ value: 'Iwan', label: 'Iwan' }
]"
class="mt-16 text-sm rounded bg-B text-center cursor-pointer !w-[160px]"
/>
</div>
</td>
<td class="p-2 text-right text-sm font-semibold align-top border-r">
<div class="space-y-2">
<p>Ongkos bikin</p>
<p class="text-red-500 text-xs">diluar harga jual</p>
<p>Total</p>
</div>
</td>
<td class="p-2 text-sm align-top">
<div class="space-y-2">
<div class="flex items-center">
<p>Rp</p>
<inputField
class="h-7 px-2 text-sm rounded bg-blue-200 text-left w-full"
/>
</div>
<div class="flex items-center">
<p>Rp</p>
<p class="px-3 py-1 text-left text-sm w-full">21.200.000</p>
</div>
</div>
</td>
</tr>
<tr>
<td class="p-2 text-center">
<button class="bg-gray-400 text-white px-6 py-2 rounded w-full">
Batal
</button>
</td>
<td class="p-2 text-center">
<button class="bg-C text-white px-6 py-2 rounded w-full">
Simpan
</button>
</td>
</tr>
</tbody>
</table>
</div> </div>
<!-- Pesan bawah --> <!-- Pesan bawah -->
@ -179,6 +177,8 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
import logo from '@/../images/logo.png' import logo from '@/../images/logo.png'