diff --git a/backend-baru/app/Http/Controllers/Api/RsvpApiController.php b/backend-baru/app/Http/Controllers/Api/RsvpApiController.php
index a753cf8..79b0f48 100644
--- a/backend-baru/app/Http/Controllers/Api/RsvpApiController.php
+++ b/backend-baru/app/Http/Controllers/Api/RsvpApiController.php
@@ -30,6 +30,7 @@ class RsvpApiController extends Controller
 
             $rsvp = Rsvp::create([
                 'guest_id' => $guest->id,
+                'pelanggan_id' => $guest -> id_pelanggan,
                 'nama' => $validated['nama'],
                 'pesan' => $validated['pesan'],
                 'status_kehadiran' => $validated['status_kehadiran'],
@@ -41,16 +42,11 @@ class RsvpApiController extends Controller
                 'data' => $rsvp,
             ], 201);
 
-        } catch (\Illuminate\Validation\ValidationException $e) {
-            return response()->json([
-                'success' => false,
-                'message' => 'Validasi gagal',
-                'errors' => $e->errors(),
-            ], 422);
         } catch (\Exception $e) {
             return response()->json([
                 'success' => false,
                 'message' => 'Gagal menyimpan RSVP.',
+                'error' => $e->getMessage(),
             ], 500);
         }
     }
diff --git a/backend-baru/app/Models/Pelanggan.php b/backend-baru/app/Models/Pelanggan.php
index 85c67b0..688e8c1 100644
--- a/backend-baru/app/Models/Pelanggan.php
+++ b/backend-baru/app/Models/Pelanggan.php
@@ -39,14 +39,7 @@ class Pelanggan extends Model
 
     public function rsvp()
     {
-        return $this->hasManyThrough(
-            Rsvp::class,
-            Guest::class,
-            'id_pelanggan',
-            'guest_id',
-            'id',
-            'id'
-        );
+        return $this->hasMany(Rsvp::class, 'pelanggan_id');
     }
 
 }
diff --git a/backend-baru/app/Models/Rsvp.php b/backend-baru/app/Models/Rsvp.php
index 949311c..196c99a 100644
--- a/backend-baru/app/Models/Rsvp.php
+++ b/backend-baru/app/Models/Rsvp.php
@@ -8,9 +8,15 @@ use Illuminate\Database\Eloquent\Model;
 class Rsvp extends Model
 {
     use HasFactory;
-    protected $fillable = ['guest_id', 'nama', 'pesan', 'status_kehadiran'];
+    protected $fillable = ['guest_id', 'nama', 'pesan', 'status_kehadiran','pelanggan_id'];
 
     public function guest() {
         return $this->belongsTo(Guest::class);
     }
+
+    public function pelanggan()
+    {
+        return $this->belongsTo(Pelanggan::class, 'pelanggan_id');
+    }
+
 }
diff --git a/backend-baru/config/cors.php b/backend-baru/config/cors.php
index 8a39e6d..a8879ba 100644
--- a/backend-baru/config/cors.php
+++ b/backend-baru/config/cors.php
@@ -19,7 +19,7 @@ return [
 
     'allowed_methods' => ['*'],
 
-    'allowed_origins' => ['*'],
+    'allowed_origins' => ['http://localhost:3001'],
 
     'allowed_origins_patterns' => [],
 
diff --git a/backend-baru/database/factories/RsvpFactory.php b/backend-baru/database/factories/RsvpFactory.php
new file mode 100644
index 0000000..f62adc8
--- /dev/null
+++ b/backend-baru/database/factories/RsvpFactory.php
@@ -0,0 +1,20 @@
+<?php
+
+namespace Database\Factories;
+
+use App\Models\Rsvp;
+use Illuminate\Database\Eloquent\Factories\Factory;
+
+class RsvpFactory extends Factory
+{
+    protected $model = Rsvp::class;
+
+    public function definition(): array
+    {
+        return [
+            'nama' => $this->faker->name(),
+            'pesan' => $this->faker->sentence(8),
+            'status_kehadiran' => $this->faker->randomElement(['hadir', 'tidak_hadir', 'mungkin']),
+        ];
+    }
+}
diff --git a/backend-baru/database/migrations/2025_10_23_032107_create_rsvps_tables.php b/backend-baru/database/migrations/2025_10_23_032107_create_rsvps_tables.php
index 3d12a23..b6ae47d 100644
--- a/backend-baru/database/migrations/2025_10_23_032107_create_rsvps_tables.php
+++ b/backend-baru/database/migrations/2025_10_23_032107_create_rsvps_tables.php
@@ -10,6 +10,7 @@ return new class extends Migration {
         Schema::create('rsvps', function (Blueprint $table) {
             $table->id();
             $table->foreignId('guest_id')->constrained('guests')->cascadeOnDelete(); // Link ke guests table
+            $table->foreignId('pelanggan_id')->constrained('pelanggans')->cascadeOnDelete(); // Link ke guests table
             $table->string('nama');
             $table->text('pesan');
             $table->enum('status_kehadiran', ['hadir', 'tidak_hadir', 'mungkin'])->default('mungkin');
diff --git a/backend-baru/database/seeders/PelangganSeeder.php b/backend-baru/database/seeders/PelangganSeeder.php
index 03ea70a..9968357 100644
--- a/backend-baru/database/seeders/PelangganSeeder.php
+++ b/backend-baru/database/seeders/PelangganSeeder.php
@@ -2,6 +2,7 @@
 
 namespace Database\Seeders;
 
+use App\Models\Rsvp;
 use Illuminate\Database\Seeder;
 use App\Models\Pelanggan;
 use Illuminate\Support\Str;
@@ -18,9 +19,17 @@ class PelangganSeeder extends Seeder
                 'id_pelanggan' => $item->id,
             ])->toArray();
             $guests = array_merge($guests, $guestData);
+
         }
         \App\Models\Guest::insert($guests);
-        
+
+         foreach ($pelanggan as $item) {
+            $guest = $item->guests()->inRandomOrder()->first();
+             Rsvp::factory(3)->create([
+                "pelanggan_id"=>$item->id,
+                "guest_id"=>$guest
+            ]);
+        }
         // $pelanggans = [
         //     [
         //         'nama_pemesan' => 'Arief Dwi Wicaksono',
diff --git a/backend-baru/routes/api.php b/backend-baru/routes/api.php
index cc8059c..fa16df9 100644
--- a/backend-baru/routes/api.php
+++ b/backend-baru/routes/api.php
@@ -30,7 +30,7 @@ Route::get('/pelanggans', [PelangganApiController::class, 'index']);
 // Ambil pelanggan berdasarkan ID
 Route::get('/pelanggans/id/{id}', [PelangganApiController::class, 'show']);
 
-// Ambil pelanggan berdasarkan KODE UNDANGAN
+// Ambil undangan berdasarkan KODE UNDANGAN
 Route::get('/pelanggans/code/{code}', [GuestApiController::class, 'getByInvitationCode']);
 
 // Simpan pesanan baru
diff --git a/proyek-frontend/app/components/templates/Ultah/GuestBook.vue b/proyek-frontend/app/components/templates/Ultah/GuestBook.vue
index 8554fca..fce8865 100644
--- a/proyek-frontend/app/components/templates/Ultah/GuestBook.vue
+++ b/proyek-frontend/app/components/templates/Ultah/GuestBook.vue
@@ -47,27 +47,20 @@ const route = useRoute();
 const config = useRuntimeConfig();
 const backendUrl = config.public.apiBaseUrl;
 const invitationCode = route.params.code || '';
-const guest = route.query.guest
+const guest = route.query.code
 
-
-const messages = ref([]);
-const form = ref({ name: '', message: '', attendance: 'hadir' });
-
-
-// Fungsi untuk mengambil daftar RSVP dari backend
-const fetchMessages = async () => {
-  try {
-    const response = await fetch(`${backendUrl}/api/rsvp/${invitationCode}`);
-    if (!response.ok) throw new Error('Gagal mengambil data RSVP');
-
-    const data = await response.json();
-    messages.value = data.data || []; 
-  } catch (error) {
-    console.error('Error mengambil RSVP:', error);
-    alert('Terjadi kesalahan saat mengambil data RSVP.');
+const props = defineProps({
+  messages: {
+    type: Array,
+    required: false,
+    default: () => []
   }
-};
+})
 
+const messages = ref([...props.messages]) // duplikat supaya bisa diubah
+
+
+const form = ref({ name: '', message: '', attendance: 'hadir' });
 
 // Fungsi untuk mengirim data RSVP ke backend
 const submitMessage = async () => {
@@ -84,6 +77,7 @@ const submitMessage = async () => {
   }
 
   try {
+    console.log('POST to:', `${backendUrl}/api/rsvp/${invitationCode}`, payload)
     const response = await fetch(`${backendUrl}/api/rsvp/${invitationCode}`, {
       method: 'POST',
       headers: {
@@ -97,13 +91,14 @@ const submitMessage = async () => {
       
     });
 
-    if (!response.ok) {
-      throw new Error('Gagal menyimpan RSVP');
+    if (!response.ok) { 
+      console.log(response)
+      throw new Error(`Gagal menyimpan RSVP,${response.errors}`);
     }
-
+  
     const result = await response.json();
     messages.value.push(result.data); // Tambahkan RSVP baru ke daftar
-    form.value = { name: '', message: '', attendance: 'yes' }; // Reset form
+    form.value = { name: '', message: '', attendance: 'hadir' };
     alert(result.message); // Tampilkan pesan sukses dari backend
   } catch (error) {
     console.error('Error menyimpan RSVP:', error);
@@ -114,11 +109,11 @@ const submitMessage = async () => {
 // Fungsi untuk mengatur kelas CSS berdasarkan status kehadiran
 const getAttendanceClass = (attendance) => {
   switch (attendance) {
-    case 'yes':
+    case 'iya':
       return 'bg-green-100 text-green-700';
-    case 'no':
+    case 'tidak':
       return 'bg-red-100 text-red-700';
-    case 'maybe':
+    case 'mungkin':
       return 'bg-yellow-100 text-yellow-700';
     default:
       return 'bg-gray-100 text-gray-700';
@@ -128,19 +123,14 @@ const getAttendanceClass = (attendance) => {
 // Fungsi untuk memformat teks kehadiran
 const formatAttendance = (attendance) => {
   switch (attendance) {
-    case 'yes':
+    case 'iya':
       return 'Hadir';
-    case 'no':
+    case 'tidak':
       return 'Tidak Hadir';
-    case 'maybe':
+    case 'mungkin':
       return 'Mungkin';
     default:
       return attendance;
   }
 };
-
-// Panggil fetchMessages saat komponen dimuat
-onMounted(() => {
-  fetchMessages();
-});
 </script>
\ No newline at end of file
diff --git a/proyek-frontend/app/pages/p/daftar-tamu.vue b/proyek-frontend/app/pages/p/daftar-tamu.vue
index 98b771d..f64b60c 100644
--- a/proyek-frontend/app/pages/p/daftar-tamu.vue
+++ b/proyek-frontend/app/pages/p/daftar-tamu.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="min-h-screen bg-gray-100 flex items-center justify-center p-4">
-    <div class="bg-white p-6 rounded-lg shadow-lg w-full max-w-3xl">
+    <div class="bg-white p-6 rounded-lg shadow-lg w-full max-w-5xl">
       <h1 class="text-2xl font-bold mb-6 text-center text-gray-800">
-        Manajemen Daftar Tamu
+        Manajemen Daftar Tamu & RSVP
       </h1>
 
       <!-- Input Kode Pelanggan -->
@@ -28,16 +28,39 @@
         </p>
       </div>
 
-      <!-- Area Data Tamu (Muncul setelah fetch berhasil) -->
+      <!-- Area Data Tamu -->
       <div v-if="dataLoaded">
         <!-- Info Kode Pelanggan -->
         <div class="bg-blue-50 p-3 rounded-lg mb-6">
           <p class="text-sm text-gray-700">
-            <span class="font-semibold">Kode Pelanggan:</span> 
+            <span class="font-semibold">Kode Pelanggan:</span>
             {{ kodePelanggan.toUpperCase() }}
           </p>
         </div>
-        
+
+        <!-- Ringkasan RSVP (4 kolom) -->
+        <div class="bg-green-50 p-4 rounded-lg mb-6 border border-green-200">
+          <h3 class="font-semibold text-green-800 mb-2">Ringkasan RSVP</h3>
+          <div class="grid grid-cols-2 md:grid-cols-4 gap-4 text-sm">
+            <div>
+              <p class="text-gray-600">Hadir</p>
+              <p class="font-bold text-green-600">{{ rsvpSummary.hadir }}</p>
+            </div>
+            <div>
+              <p class="text-gray-600">Tidak Hadir</p>
+              <p class="font-bold text-red-600">{{ rsvpSummary.tidak_hadir }}</p>
+            </div>
+            <div>
+              <p class="text-gray-600">Mungkin</p>
+              <p class="font-bold text-yellow-600">{{ rsvpSummary.mungkin }}</p>
+            </div>
+            <div>
+              <p class="text-gray-600">Belum RSVP</p>
+              <p class="font-bold text-gray-600">{{ rsvpSummary.belum_rsvp }}</p>
+            </div>
+          </div>
+        </div>
+
         <!-- Form Tambah Tamu -->
         <form @submit.prevent="handleAddGuest" class="mb-6">
           <label class="block text-sm font-semibold text-gray-700 mb-2">
@@ -60,7 +83,7 @@
             </button>
           </div>
         </form>
-        
+
         <p v-if="errorMessage && dataLoaded" class="text-red-500 mb-4 text-sm">
           {{ errorMessage }}
         </p>
@@ -73,29 +96,30 @@
           <h2 class="text-lg font-semibold text-gray-800 mb-3">
             Daftar Tamu ({{ guests.length }})
           </h2>
-          
-          <div v-if="guests.length > 0" class="overflow-x-auto rounded-lg border border-gray-200">
+
+          <div v-if="guests.length > 0" class="overflow-x-auto rounded-lg border border-gray-200 mb-10">
             <table class="w-full">
               <thead>
                 <tr class="bg-gray-100 border-b border-gray-200">
                   <th class="p-3 text-left font-semibold text-gray-700">No</th>
                   <th class="p-3 text-left font-semibold text-gray-700">Nama Tamu</th>
                   <th class="p-3 text-left font-semibold text-gray-700">Kode Invitasi</th>
+                  <th class="p-3 text-left font-semibold text-gray-700">Status RSVP</th>
                   <th class="p-3 text-center font-semibold text-gray-700">Aksi</th>
                 </tr>
               </thead>
               <tbody>
-                <tr 
-                  v-for="(guest, index) in guests" 
-                  :key="guest.id" 
+                <tr
+                  v-for="(guest, index) in guests"
+                  :key="guest.id"
                   class="border-b border-gray-100 hover:bg-gray-50 transition"
                 >
                   <td class="p-3 text-gray-700">{{ index + 1 }}</td>
                   <td class="p-3 text-gray-800 font-medium">{{ guest.nama_tamu }}</td>
                   <td class="p-3">
                     <div class="flex items-center gap-2">
-                      <a 
-                        :href="`${config.public.baseUrl}/p/${guest.kode_invitasi}`" 
+                      <a
+                        :href="`${config.public.baseUrl}/p/${guest.kode_invitasi}`"
                         target="_blank"
                         class="text-gray-600 font-mono text-sm hover:text-blue-600 hover:underline transition"
                         @click.stop
@@ -106,15 +130,31 @@
                         @click="shareInvitationLink(guest.kode_invitasi)"
                         class="bg-indigo-500 hover:bg-indigo-600 text-white px-3 py-1 rounded-lg text-xs font-medium transition shadow-sm whitespace-nowrap flex items-center gap-1"
                         :disabled="loading"
-                        title="Bagikan Link Invitasi"
+                        title="Bagikan Link"
                       >
                         <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.684 13.342C8.886 12.938 9 12.482 9 12c0-.482-.114-.938-.316-1.342m0 2.684a3 3 0 110-2.684m0 2.684l6.632 3.316m-6.632-6l6.632-3.316m0 0a3 3 0 105.367-2.684 3 3 0 00-5.367 2.684zm0 9.316a3 3 0 105.367 2.684 3 3 0 00-5.367-2.684z"></path>
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M8.684 13.342C8.886 12.938 9 12.482 9 12c0-.482-.114-.938-.316-1.342m0 2.684a3 3 0 110-2.684m0 2.684l6.632 3.316m-6.632-6l6.632-3.316m0 0a3 3 0 105.367-2.684 3 3 0 00-5.367 2.684zm0 9.316a3 3 0 105.367 2.684 3 3 0 00-5.367-2.684z"/>
                         </svg>
                         Share
                       </button>
                     </div>
                   </td>
+                  <td class="p-3">
+                    <span
+                      v-if="guest.rsvp"
+                      :class="{
+                        'px-3 py-1 rounded-full text-xs font-medium': true,
+                        'bg-green-100 text-green-800': guest.rsvp.status_kehadiran === 'hadir',
+                        'bg-red-100 text-red-800': guest.rsvp.status_kehadiran === 'tidak_hadir',
+                        'bg-yellow-100 text-yellow-800': guest.rsvp.status_kehadiran === 'mungkin'
+                      }"
+                    >
+                      {{ guest.rsvp.status_kehadiran === 'hadir' ? 'Hadir' :
+                         guest.rsvp.status_kehadiran === 'tidak_hadir' ? 'Tidak Hadir' : 'Mungkin' }}
+                    </span>
+                    <span v-else class="text-gray-400 text-xs italic">Belum RSVP</span>
+                  </td>
                   <td class="p-3 text-center">
                     <button
                       @click="handleDeleteGuest(guest.id)"
@@ -128,9 +168,64 @@
               </tbody>
             </table>
           </div>
-          <div v-else class="text-center py-8 bg-gray-50 rounded-lg border border-gray-200">
-            <p class="text-gray-500">Belum ada tamu yang ditambahkan.</p>
-            <p class="text-gray-400 text-sm mt-2">Tambahkan tamu pertama menggunakan form di atas.</p>
+        </div>
+
+        <!-- Daftar RSVP Lengkap -->
+        <div class="mt-10">
+          <h2 class="text-lg font-semibold text-gray-800 mb-3">
+            Daftar RSVP ({{ allRsvps.length }})
+          </h2>
+
+          <div v-if="allRsvps.length > 0" class="overflow-x-auto rounded-lg border border-gray-200">
+            <table class="w-full text-sm">
+              <thead>
+                <tr class="bg-indigo-50 border-b border-indigo-200">
+                  <th class="p-3 text-left font-semibold text-indigo-700">No</th>
+                  <th class="p-3 text-left font-semibold text-indigo-700">Nama (RSVP)</th>
+                  <th class="p-3 text-left font-semibold text-indigo-700">Nama Tamu (Undangan)</th>
+                  <th class="p-3 text-left font-semibold text-indigo-700">Kode</th>
+                  <th class="p-3 text-left font-semibold text-indigo-700">Status</th>
+                  <th class="p-3 text-left font-semibold text-indigo-700">Ucapan</th>
+                  <th class="p-3 text-left font-semibold text-indigo-700">Waktu</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr
+                  v-for="(rsvp, index) in allRsvps"
+                  :key="rsvp.id"
+                  class="border-b border-gray-100 hover:bg-indigo-50 transition"
+                >
+                  <td class="p-3 text-gray-700">{{ index + 1 }}</td>
+                  <td class="p-3 font-medium text-gray-800">{{ rsvp.nama || '-' }}</td>
+                  <td class="p-3 text-gray-600 italic">{{ rsvp.nama_tamu || '-' }}</td>
+                  <td class="p-3">
+                    <code class="text-xs bg-gray-100 px-2 py-1 rounded">{{ rsvp.kode_invitasi }}</code>
+                  </td>
+                  <td class="p-3">
+                    <span
+                      :class="{
+                        'px-2 py-1 rounded-full text-xs font-medium': true,
+                        'bg-green-100 text-green-800': rsvp.status_kehadiran === 'hadir',
+                        'bg-red-100 text-red-800': rsvp.status_kehadiran === 'tidak_hadir',
+                        'bg-yellow-100 text-yellow-800': rsvp.status_kehadiran === 'mungkin'
+                      }"
+                    >
+                      {{ rsvp.status_kehadiran === 'hadir' ? 'Hadir' :
+                         rsvp.status_kehadiran === 'tidak_hadir' ? 'Tidak Hadir' : 'Mungkin' }}
+                    </span>
+                  </td>
+                  <td class="p-3 text-gray-600 max-w-xs truncate" :title="rsvp.pesan">
+                    {{ rsvp.pesan || '-' }}
+                  </td>
+                  <td class="p-3 text-xs text-gray-500">
+                    {{ formatDate(rsvp.created_at) }}
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+          <div v-else class="text-center py-8 bg-indigo-50 rounded-lg border border-indigo-200">
+            <p class="text-indigo-600 font-medium">Belum ada RSVP dari tamu.</p>
           </div>
         </div>
       </div>
@@ -139,7 +234,7 @@
 </template>
 
 <script setup>
-// State Management
+// ---------- STATE ----------
 const kodePelanggan = ref('');
 const dataLoaded = ref(false);
 const guests = ref([]);
@@ -147,67 +242,63 @@ const namaTamu = ref('');
 const errorMessage = ref('');
 const successMessage = ref('');
 const loading = ref(false);
+const rsvpSummary = ref({ hadir: 0, tidak_hadir: 0, mungkin: 0, belum_rsvp: 0 });
+const allRsvps = ref([]);
+
 const config = useRuntimeConfig();
 const backendUrl = config.public.apiBaseUrl;
 
-// Runtime Config
-const { public: { apiBase } } = useRuntimeConfig();
-
-// Share invitation link
-const shareInvitationLink = async (kodeInvitasi) => {
-  const inviteUrl = `${config.public.baseUrl}/p/${kodeInvitasi}`;
-  
-  if (navigator.share) {
-    // Native Web Share API (mobile)
-    try {
-      await navigator.share({
-        title: 'Undangan Pernikahan',
-        text: 'Silakan buka undangan pernikahan saya',
-        url: inviteUrl,
-      });
-    } catch (error) {
-      if (error.name !== 'AbortError') {
-        copyToClipboard(inviteUrl);
-      }
-    }
-  } else {
-    // Fallback to copy to clipboard (desktop)
-    copyToClipboard(inviteUrl);
-  }
-};
-
-// Copy to clipboard function
-const copyToClipboard = (text) => {
-  navigator.clipboard.writeText(text).then(() => {
-    // Show temporary success message
-    const originalText = successMessage.value;
-    successMessage.value = 'Link undangan berhasil disalin!';
-    setTimeout(() => {
-      successMessage.value = originalText;
-    }, 2000);
-  }).catch((err) => {
-    console.error('Failed to copy: ', err);
-    // Fallback for older browsers
-    const textArea = document.createElement('textarea');
-    textArea.value = text;
-    document.body.appendChild(textArea);
-    textArea.focus();
-    textArea.select();
-    try {
-      document.execCommand('copy');
-      const originalText = successMessage.value;
-      successMessage.value = 'Link undangan berhasil disalin!';
-      setTimeout(() => {
-        successMessage.value = originalText;
-      }, 2000);
-    } catch (err) {
-      console.error('Fallback copy failed: ', err);
-    }
-    document.body.removeChild(textArea);
+// ---------- UTILS ----------
+const formatDate = (dateString) => {
+  if (!dateString) return '-';
+  return new Date(dateString).toLocaleString('id-ID', {
+    day: '2-digit', month: 'short', year: 'numeric',
+    hour: '2-digit', minute: '2-digit'
   });
 };
 
-// Fetch guests data based on customer code
+const shareInvitationLink = async (kodeInvitasi) => {
+  const url = `${config.public.baseUrl}/p/${kodeInvitasi}`;
+  if (navigator.share) {
+    try { await navigator.share({ title: 'Undangan', url }); }
+    catch (e) { if (e.name !== 'AbortError') copyToClipboard(url); }
+  } else copyToClipboard(url);
+};
+
+const copyToClipboard = (text) => {
+  navigator.clipboard.writeText(text).then(() => {
+    const old = successMessage.value;
+    successMessage.value = 'Link disalin!';
+    setTimeout(() => successMessage.value = old, 2000);
+  });
+};
+
+// ---------- FETCH RSVP PER KODE ----------
+const fetchRsvpForGuest = async (kodeInvitasi) => {
+  try {
+    const res = await $fetch(`${backendUrl}/api/rsvp/${kodeInvitasi}`, { method: 'GET' });
+    return res.success && res.data?.length ? res.data[0] : null;
+  } catch (e) {
+    console.error('RSVP fetch error:', e);
+    return null;
+  }
+};
+
+// ---------- FETCH SEMUA RSVP (hanya yang ada) ----------
+const fetchAllRsvps = async () => {
+  const list = [];
+  for (const g of guests.value) {
+    const r = await fetchRsvpForGuest(g.kode_invitasi);
+    if (r) {
+      r.nama_tamu = g.nama_tamu;          // tambahkan nama tamu
+      r.kode_invitasi = g.kode_invitasi;   // tambahkan kode
+      list.push(r);
+    }
+  }
+  allRsvps.value = list.sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
+};
+
+// ---------- FETCH GUESTS + COUNTER ----------
 const handleFetchGuests = async () => {
   if (!kodePelanggan.value.trim()) {
     errorMessage.value = 'Kode pelanggan harus diisi.';
@@ -217,99 +308,81 @@ const handleFetchGuests = async () => {
   loading.value = true;
   errorMessage.value = '';
   successMessage.value = '';
-  
+  rsvpSummary.value = { hadir: 0, tidak_hadir: 0, mungkin: 0, belum_rsvp: 0 };
+  allRsvps.value = [];
+
   try {
-    const response = await $fetch(`${backendUrl}/api/guests/${kodePelanggan.value.toUpperCase()}`, {
-      method: 'GET',
-    });
-    
-    if (response.success) {
-      dataLoaded.value = true;
-      guests.value = response.data || [];
-      successMessage.value = 'Data tamu berhasil dimuat!';
-      setTimeout(() => { successMessage.value = ''; }, 3000);
-    } else {
-      errorMessage.value = response.message || 'Gagal mengambil daftar tamu.';
-      dataLoaded.value = false;
-    }
-  } catch (error) {
-    console.error('Fetch guests error:', error);
-    errorMessage.value = error.data?.message || 'Pelanggan tidak ditemukan atau pesanan belum diterima.';
+    const res = await $fetch(`${backendUrl}/api/guests/${kodePelanggan.value.toUpperCase()}`, { method: 'GET' });
+    if (!res.success) throw new Error(res.message || 'Gagal mengambil data tamu');
+
+    const raw = res.data || [];
+    let hadir = 0, tidak_hadir = 0, mungkin = 0;
+
+    const guestsWithRsvp = await Promise.all(
+      raw.map(async (g) => {
+        const r = await fetchRsvpForGuest(g.kode_invitasi);
+        g.rsvp = r;
+
+        if (r?.status_kehadiran) {
+          if (r.status_kehadiran === 'hadir') hadir++;
+          else if (r.status_kehadiran === 'tidak_hadir') tidak_hadir++;
+          else if (r.status_kehadiran === 'mungkin') mungkin++;
+        }
+        return g;
+      })
+    );
+
+    const total = raw.length;
+    const belum = total - hadir - tidak_hadir - mungkin;
+
+    guests.value = guestsWithRsvp;
+    rsvpSummary.value = { hadir, tidak_hadir, mungkin, belum_rsvp: belum };
+
+    await fetchAllRsvps();
+
+    dataLoaded.value = true;
+    successMessage.value = 'Data tamu & RSVP berhasil dimuat!';
+    setTimeout(() => successMessage.value = '', 3000);
+  } catch (e) {
+    errorMessage.value = e.message || 'Pelanggan tidak ditemukan.';
     dataLoaded.value = false;
   } finally {
     loading.value = false;
   }
 };
 
-// Add new guest
+// ---------- TAMBAH & HAPUS ----------
 const handleAddGuest = async () => {
-  if (!namaTamu.value.trim()) {
-    errorMessage.value = 'Nama tamu harus diisi.';
-    return;
-  }
-
+  if (!namaTamu.value.trim()) { errorMessage.value = 'Nama tamu harus diisi.'; return; }
   loading.value = true;
-  errorMessage.value = '';
-  successMessage.value = '';
-  
   try {
-    const response = await $fetch(`${backendUrl}/api/guests`, {
-      baseURL: apiBase,
+    const res = await $fetch(`${backendUrl}/api/guests`, {
       method: 'POST',
-      body: {
-        kode_pelanggan: kodePelanggan.value.toUpperCase(),
-        nama_tamu: namaTamu.value.trim(),
-      },
+      body: { kode_pelanggan: kodePelanggan.value.toUpperCase(), nama_tamu: namaTamu.value.trim() }
     });
-    
-    if (response.success) {
-      guests.value.push(response.data);
+    if (res.success) {
       namaTamu.value = '';
-      successMessage.value = 'Tamu berhasil ditambahkan!';
-      setTimeout(() => { successMessage.value = ''; }, 3000);
-    } else {
-      errorMessage.value = response.message || 'Gagal menambahkan tamu.';
-    }
-  } catch (error) {
-    console.error('Add guest error:', error);
-    if (error.status === 422 && error.data?.errors) {
-      errorMessage.value = Object.values(error.data.errors).flat().join(' ');
-    } else {
-      errorMessage.value = error.data?.message || 'Terjadi kesalahan saat menambahkan tamu.';
-    }
-  } finally {
-    loading.value = false;
-  }
+      successMessage.value = 'Tamu ditambahkan!';
+      setTimeout(() => successMessage.value = '', 2000);
+      await handleFetchGuests();
+    } else errorMessage.value = res.message || 'Gagal tambah tamu.';
+  } catch (e) {
+    errorMessage.value = e.data?.message || 'Error saat tambah tamu.';
+  } finally { loading.value = false; }
 };
 
-// Delete guest
 const handleDeleteGuest = async (id) => {
-  if (!confirm('Apakah Anda yakin ingin menghapus tamu ini?')) {
-    return;
-  }
-
+  if (!confirm('Hapus tamu ini?')) return;
   loading.value = true;
-  errorMessage.value = '';
-  successMessage.value = '';
-  
   try {
-    const response = await $fetch(`${backendUrl}/api/guests/${id}`, {
-      baseURL: apiBase,
-      method: 'DELETE',
-    });
-    
-    if (response.success) {
-      guests.value = guests.value.filter(guest => guest.id !== id);
-      successMessage.value = 'Tamu berhasil dihapus!';
-      setTimeout(() => { successMessage.value = ''; }, 3000);
-    } else {
-      errorMessage.value = response.message || 'Gagal menghapus tamu.';
-    }
-  } catch (error) {
-    console.error('Delete guest error:', error);
-    errorMessage.value = error.data?.message || 'Terjadi kesalahan saat menghapus tamu.';
-  } finally {
-    loading.value = false;
-  }
+    const res = await $fetch(`${backendUrl}/api/guests/${id}`, { method: 'DELETE' });
+    if (res.success) {
+      successMessage.value = 'Tamu dihapus!';
+      setTimeout(() => successMessage.value = '', 2000);
+      await handleFetchGuests();
+    } else errorMessage.value = res.message || 'Gagal hapus.';
+  } catch (e) {
+    errorMessage.value = e.data?.message || 'Error hapus tamu.';
+  } finally { loading.value = false; }
 };
 </script>
\ No newline at end of file