<template>
  <div class="min-h-screen bg-gray-50 p-8">
    <div class="max-w-4xl mx-auto">
      <h1 class="text-3xl font-bold mb-6 text-center">Test Print Struk</h1>
      
      <StrukView
        :is-open="true"
        :transaksi="dummyTransaksi"
        @close="isOpen = false"
      />
    </div>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import StrukView from '../components/StrukView.vue'

// === Dummy Data ===
const dummyTransaksi = {
  kode_transaksi: 'TRX20250001',
  created_at: '2025-10-28T10:30:00',
  nama_pembeli: 'Budi Santoso',
  alamat: 'Jl. Merdeka',
  no_hp: '08123456789',
  nama_sales: 'Rina',
  ongkos_bikin: 100000,
  total_harga: 2600000,
  itemTransaksi: [
    {
      id: 1,
      harga_deal: 2500000,
      posisi_asal: 'Etalase Depan',
      produk: {
        nama: 'Gelang rantai 5 buah clover merah',
        berat: 5.2,
        kadar: 18,
        foto: [
          { url: 'http://localhost:8000/storage/foto/hVmf9TF2AfnsNUELXtW3F7q30QVCb0S9L1zWnicY.jpg'}
        ]
      }
    },
    // {
    //   id: 2,
    //   harga_deal: 100000,
    //   posisi_asal: 'Brankas',
    //   produk: {
    //     nama: 'Gelang serut daun shimmer mp (mas putih)',
    //     berat: 1.0,
    //     kadar: 24,
    //     foto: [
    //       { url: 'http://localhost:8000/storage/foto/dF0UWskzLYnuOH8ch8DEjz7ZeBWa8wXbyhtYRjRy.jpg'}
    //     ]
    //   }
    // }
  ]
}

// === Modal State ===
const isOpen = ref(false)
</script>
