<script setup>
import useOrderInfo from "~/components/pos/composables/useOrderInfo";

const props = defineProps({
  invoiceId: Number,
  finalizeOrder: Function,
});
const { total } = useOrderInfo();
</script>
<template>
  <div class="is-flex is-flex-direction-column is-gap-2 is-align-items-center">
    <NuxtImg
      :src="$qr(total)"
      class="h-full max-h-140"
      alt="VietQR code"
    />
    <button
      @click="finalizeOrder(invoiceId)"
      class="button is-primary"
    >
      <span class="icon">
        <Icon
          name="material-symbols:check-rounded"
          :size="18"
        />
      </span>
      <span>Xác nhận thanh toán</span>
    </button>
  </div>
</template>
