88 lines
2.8 KiB
Vue
88 lines
2.8 KiB
Vue
<template>
|
|
<div class="min-h-screen bg-background">
|
|
<header class="border-b">
|
|
<div class="container mx-auto px-4 py-4">
|
|
<div class="flex items-center justify-between">
|
|
<NuxtLink to="/" class="text-xl font-bold">Neo Platform</NuxtLink>
|
|
<nav class="flex gap-4">
|
|
<NuxtLink
|
|
v-for="page in pages"
|
|
:key="page.id"
|
|
:to="`/app/${appSlug}/${page.slug}`"
|
|
class="text-sm hover:text-primary"
|
|
>
|
|
{{ page.label }}
|
|
</NuxtLink>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<main class="container mx-auto px-4 py-8">
|
|
<div v-if="loading" class="text-center py-12">Loading...</div>
|
|
<div v-else-if="error" class="text-destructive">Error: {{ error }}</div>
|
|
<div v-else-if="page">
|
|
<h1 class="text-3xl font-bold mb-6">{{ page.label }}</h1>
|
|
<p class="text-muted-foreground mb-4">Page Type: {{ page.type }}</p>
|
|
|
|
<div v-if="page.objectApiName">
|
|
<h2 class="text-xl font-semibold mb-4">{{ page.object?.label }} Records</h2>
|
|
|
|
<div v-if="loadingRecords" class="text-center py-8">Loading records...</div>
|
|
<div v-else-if="records.length === 0" class="text-center py-8 text-muted-foreground">
|
|
No records found
|
|
</div>
|
|
<div v-else class="space-y-2">
|
|
<NuxtLink
|
|
v-for="record in records"
|
|
:key="record.id"
|
|
:to="`/app/${appSlug}/${pageSlug}/${record.id}`"
|
|
class="block p-4 border rounded-lg hover:border-primary transition-colors bg-card"
|
|
>
|
|
<div class="font-medium">{{ record.name || record.id }}</div>
|
|
</NuxtLink>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const route = useRoute()
|
|
const { api } = useApi()
|
|
|
|
const appSlug = computed(() => route.params.appSlug as string)
|
|
const pageSlug = computed(() => route.params.pageSlug as string)
|
|
|
|
const pages = ref<any[]>([])
|
|
const page = ref<any>(null)
|
|
const records = ref<any[]>([])
|
|
const loading = ref(true)
|
|
const loadingRecords = ref(false)
|
|
const error = ref<string | null>(null)
|
|
|
|
const fetchPage = async () => {
|
|
try {
|
|
loading.value = true
|
|
page.value = await api.get(`/runtime/apps/${appSlug.value}/pages/${pageSlug.value}`)
|
|
|
|
const app = await api.get(`/runtime/apps/${appSlug.value}`)
|
|
pages.value = app.pages
|
|
|
|
if (page.value.objectApiName) {
|
|
loadingRecords.value = true
|
|
records.value = await api.get(`/runtime/objects/${page.value.objectApiName}/records`)
|
|
}
|
|
} catch (e: any) {
|
|
error.value = e.message
|
|
} finally {
|
|
loading.value = false
|
|
loadingRecords.value = false
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
fetchPage()
|
|
})
|
|
</script>
|