Neo platform - First Version

frontend/pages/setup/objects/[apiName].vue

@@ -0,0 +1,75 @@
+<template>
+  <div class="min-h-screen bg-background">
+    <header class="border-b">
+      <div class="container mx-auto px-4 py-4">
+        <NuxtLink to="/" class="text-xl font-bold">Neo Platform</NuxtLink>
+      </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="object">
+        <div class="mb-6">
+          <NuxtLink to="/setup/objects" class="text-sm text-primary hover:underline">
+            ← Back to Objects
+          </NuxtLink>
+        </div>
+
+        <h1 class="text-3xl font-bold mb-6">{{ object.label }}</h1>
+
+        <div class="mb-8">
+          <h2 class="text-2xl font-semibold mb-4">Fields</h2>
+          <div class="space-y-2">
+            <div
+              v-for="field in object.fields"
+              :key="field.id"
+              class="p-4 border rounded-lg bg-card"
+            >
+              <div class="flex items-center justify-between">
+                <div>
+                  <h3 class="font-semibold">{{ field.label }}</h3>
+                  <p class="text-sm text-muted-foreground">
+                    Type: {{ field.type }} | API Name: {{ field.apiName }}
+                  </p>
+                </div>
+                <div class="flex gap-2 text-xs">
+                  <span v-if="field.isRequired" class="px-2 py-1 bg-destructive/10 text-destructive rounded">
+                    Required
+                  </span>
+                  <span v-if="field.isUnique" class="px-2 py-1 bg-primary/10 text-primary rounded">
+                    Unique
+                  </span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+  </div>
+</template>
+
+<script setup lang="ts">
+const route = useRoute()
+const { api } = useApi()
+
+const object = ref(null)
+const loading = ref(true)
+const error = ref(null)
+
+const fetchObject = async () => {
+  try {
+    loading.value = true
+    const apiName = route.params.apiName as string
+    object.value = await api.get(`/setup/objects/${apiName}`)
+  } catch (e: any) {
+    error.value = e.message
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  fetchObject()
+})
+</script>