36 lines
1.1 KiB
Vue
36 lines
1.1 KiB
Vue
<template>
|
|
<h3 class="text-lg font-semibold mb-4 text-gray-800">Transaksi</h3>
|
|
<table class="w-full border border-B rounded-lg text-sm">
|
|
<thead class="bg-A text-D">
|
|
<tr>
|
|
<th class="border border-B p-2">Tanggal</th>
|
|
<th class="border border-B p-2">Kode Transaksi</th>
|
|
<th class="border border-B p-2">Pendapatan</th>
|
|
<th class="border border-B p-2">Detail Item</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="trx in props.transaksi" :key="trx.id" class="hover:bg-A">
|
|
<td class="border border-B p-2">{{ trx.tanggal }}</td>
|
|
<td class="border border-B p-2">{{ trx.kode }}</td>
|
|
<td class="border border-B p-2">Rp{{ (trx.pendapatan || 0).toLocaleString() }}</td>
|
|
<td class="border border-B p-2 text-center">
|
|
<button @click="$emit('detail', trx)"
|
|
class="px-3 py-1 rounded-md bg-D text-A hover:bg-D/80 transition">Detail</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</template>
|
|
|
|
<script setup>
|
|
const props = defineProps({
|
|
transaksi: {
|
|
type: Array,
|
|
default: () => []
|
|
}
|
|
})
|
|
|
|
defineEmits(['detail'])
|
|
</script>
|