@extends('layoutsutama.master3')
@section('content')
        <!-- dari sini -->

       
        <section class="py-24 bg-gradient-to-br from-slate-300 to-white min-h-screen">
            <div class="max-w-7xl mx-auto px-4">
                <!-- <div class="flex justify-center w-full">
            <div class="flex w-1/2 gap-6"> -->
                <!-- Judul -->
                <div class="text-center mb-12">
                    <h2 class="text-3xl font-bold">Ringkasan Pendaftaran</h2>         
                 </div>

                <!-- Kontainer -->
                <div class="flex justify-center">
                    
                    <div class="w-full md:w-[60%] bg-white rounded-2xl shadow-lg p-8 space-y-6">
                            
                        <!-- Judul Tiket -->
                        <div class="border-b pb-4">
                            <h4 class="text-[17px] text-gray-600">Data</h4>  
                        </div>

                        <!-- Form -->
                        <form action="#" method="POST" class="space-y-4">
                            @csrf
                            
                              
                            
                            <table class="w-full text-[15px]  border border-gray-300 border-collapse">
                                <tbody>
                                    <tr class="border border-gray-300">
                                        <td class="w-40 font-medium px-2 py-1">
                                            Nama Lengkap
                                        </td>
                                        <td class="w-1 px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->full_name}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="w-40 font-medium px-2 py-1">
                                            Nama Depan
                                        </td>
                                        <td class="w-1 px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->first_name}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="w-40 font-medium px-2 py-1">
                                            Nama Belakang
                                        </td>
                                        <td class="w-1 px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->last_name}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Alamat
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->alamat}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Email
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->email}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Jenis Kelamin
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->jenis_kelamin}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Phone
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->phone}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Event
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->event_name}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            BIB
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->bib_name}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Ukuran Jersey
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->tshirt_size}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Kategori
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->package}} - {{$prev[0]->participant_name}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Komunitas
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">{{$prev[0]->community}}</td>
                                    </tr>
                                    <tr class="border border-gray-300">
                                        <td class="font-medium px-2 py-1">
                                            Harga
                                        </td>
                                        <td class="px-1">:</td>
                                        <td class="px-2 py-1">Rp. {{number_format($prev[0]->price)}}</td>
                                    </tr>
                                </tbody>
                            </table>
                            <br>
                             <h4 class="text-lg text-red-500 font-bold py-2">PERHATIAN</h4>
                            <table class="w-full text-[15px]  border border-red-500 border-collapse">
                                <tbody>
                                    <tr class="border border-red-500 bg-red-100">
                                        <td class="font-medium px-2 py-1">
                                            <p class="font-medium text-red-500"><strong>PASTIKAN EMAIL YANG DIISIKAN BENAR</strong></p>
                                            karena kami akan mengirimkan bukti konfirmasi registrasi dan pembayaran ke email tersebut.
                                            <p class="py-2"></p>
                                            <p class="font-medium text-red-500"><strong>RUANG PENYIMPANAN EMAIL PASTIKAN TIDAK PENUH</strong></p>
                                            agar anda dapat menerima email dari kami.
                                        </td>   
                                    </tr>
                                </tbody>
                            </table>

                            <div class="text-center pt-4">
                                <div class="flex justify-center">
                                    <a href="#" type="button" id="pay-button" class="text-white btn bg-custom-500 border-custom-500 hover:text-white hover:bg-custom-600 hover:border-custom-600 focus:text-white focus:bg-custom-600 focus:border-custom-600 focus:ring focus:ring-custom-100 active:text-white active:bg-custom-600 active:border-custom-600 active:ring active:ring-custom-100 dark:ring-custom-400/20">
                                        <span class="align-middle">Checkout</span>
                                    </a>
                                </div>
                                <!-- <button type="submit" class="px-6 py-2 bg-sky-500 text-black rounded-lg hover:bg-sky-700">Pembayaran</button> -->
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <!-- </div>
            </div> -->
        </section>



         <!-- sampai sini -->


@section('script')
    <script src="https://app.midtrans.com/snap/snap.js" data-client-key="{{env('MIDTRANS_CLIENT_KEY')}}"></script>
    <script type="text/javascript">
      document.getElementById('pay-button').onclick = function(){
        // SnapToken acquired from previous step
        snap.pay('{{$prev[0]->snap_token}}', {
         
        //   checkout-success
          onSuccess: function(result){
           
            window.location.href ='{{URL::to('checkout/success/'.$prev[0]->order_id)}}';
            
        },
          // Optional
          onPending: function(result){
            /* You may add your own js here, this is just example */ document.getElementById('result-json').innerHTML += JSON.stringify(result, null, 2);
            window.location.href ='{{URL::to('/peserta')}}';   
        },
          // Optional
          onError: function(result){
            /* You may add your own js here, this is just example */ document.getElementById('result-json').innerHTML += JSON.stringify(result, null, 2);
          }
        });
      };
</script>
@endsection

      
@endsection