naja/vberp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perbaikan page transport

Browse Source 
"
This commit is contained in:
aji@catalis.app
2025-06-08 19:59:44 +07:00
parent f271341d4a
commit 84694ca894
2 changed files with 626 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

116
src/routes/backoffice/feedback/+page.svelte
View File

@@ -1,59 +1,61 @@
<script>
import { onMount } from 'svelte';
import { supabase } from '$lib/supabaseClient';
let feedbackList = [];
let loading = true;
let error = '';
onMount(async () => {
const { data, error: fetchError } = await supabase
.from('vb_feedback')
.select('*')
.order('checkin_date', { ascending: false });
if (fetchError) {
error = 'Failed to fetch feedback.';
console.error(fetchError);
} else {
feedbackList = data;
}
loading = false;
});
</script>
<h1 class="text-3xl font-bold text-center my-6">Submitted Feedback</h1>
{#if loading}
<p class="text-center text-gray-500">Loading feedback...</p>
{:else if error}
<p class="text-center text-red-600 font-semibold">{error}</p>
{:else if feedbackList.length === 0}
<p class="text-center text-gray-500">No feedback submitted yet.</p>
{:else}
<div class="overflow-x-auto px-4">
<table class="min-w-full bg-white border border-gray-200 rounded-lg shadow-sm">
<thead class="bg-gray-100 text-left">
<tr>
<th class="py-2 px-4 border-b">Villa</th>
<th class="py-2 px-4 border-b">Customer</th>
<th class="py-2 px-4 border-b">Check-in</th>
<th class="py-2 px-4 border-b">Check-out</th>
<th class="py-2 px-4 border-b">Feedback</th>
import { onMount } from "svelte";
import { supabase } from "$lib/supabaseClient";
/** @type {{ villa_name: string; customer_name: string; checkin_date: string; checkout_date: string; feedback: string }[]} */
let feedbackList = [];
let loading = true;
let error = "";
onMount(async () => {
const { data, error: fetchError } = await supabase
.from("vb_feedback")
.select("*")
.order("checkin_date", { ascending: false });
if (fetchError) {
error = "Failed to fetch feedback.";
console.error(fetchError);
} else {
feedbackList = data;
}
loading = false;
});
</script>
<h1 class="text-3xl font-bold text-center my-6">Submitted Feedb ack</h1>
{#if loading}
<p class="text-center text-gray-500">Loading feedback...</p>
{:else if error}
<p class="text-center text-red-600 font-semibold">{error}</p>
{:else if feedbackList.length === 0}
<p class="text-center text-gray-500">No feedback submitted yet.</p>
{:else}
<div class="overflow-x-auto px-4">
<table
class="min-w-full bg-white border border-gray-200 rounded-lg shadow-sm"
>
<thead class="bg-gray-100 text-left">
<tr>
<th class="py-2 px-4 border-b">Villa</th>
<th class="py-2 px-4 border-b">Customer</th>
<th class="py-2 px-4 border-b">Check-in</th>
<th class="py-2 px-4 border-b">Check-out</th>
<th class="py-2 px-4 border-b">Feedback</th>
</tr>
</thead>
<tbody>
{#each feedbackList as item}
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b">{item.villa_name}</td>
<td class="py-2 px-4 border-b">{item.customer_name}</td>
<td class="py-2 px-4 border-b">{item.checkin_date}</td>
<td class="py-2 px-4 border-b">{item.checkout_date}</td>
<td class="py-2 px-4 border-b">{item.feedback}</td>
</tr>
</thead>
<tbody>
{#each feedbackList as item}
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b">{item.villa_name}</td>
<td class="py-2 px-4 border-b">{item.customer_name}</td>
<td class="py-2 px-4 border-b">{item.checkin_date}</td>
<td class="py-2 px-4 border-b">{item.checkout_date}</td>
<td class="py-2 px-4 border-b">{item.feedback}</td>
</tr>
{/each}
</tbody>
</table>
</div>
{/if}
{/each}
</tbody>
</table>
</div>
{/if}