Files
BarangaySystem/resources/js/Components/Core/Stats/BalanceBox.vue
2026-06-06 18:43:00 +08:00

38 lines
955 B
Vue

<template>
<div class="tf-container">
<div class="tf-balance-box" :style="boxStyle">
<!-- Balance stats -->
<div id="balance_wrapper">
<div class="balance">
<StatsDetailsRow :stats="stats" />
</div>
</div>
<!-- Footer action buttons -->
<WalletFooter
:items="footerItems"
@item-click="(item, idx) => $emit('footer-click', item, idx)"
/>
</div>
</div>
</template>
<script setup>
import StatsDetailsRow from './StatsDetailsRow.vue'
import WalletFooter from './WalletFooter.vue'
defineProps({
/**
* Stats: Array of { title, number, unit, align?, numberId? }
*/
stats: { type: Array, required: true },
/**
* Footer items: Array of { title, icon?, subtitles? }
*/
footerItems: { type: Array, required: true },
boxStyle: { type: String, default: 'border: solid 2px var(--border-color);' },
})
defineEmits(['footer-click'])
</script>