Initialize the user app and load home banners from the API.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/layouts/DefaultLayout.vue

@@ -0,0 +1,61 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+import BottomNav from '@/components/layout/BottomNav.vue'
+import DesktopSidebar from '@/components/layout/DesktopSidebar.vue'
+import DesktopHeader from '@/components/layout/DesktopHeader.vue'
+
+const route = useRoute()
+
+const showNav = computed(() => {
+  const noNavRoutes = [
+    'login',
+    'register',
+    'otp',
+    'settlement',
+    'check-mode',
+    'check-form',
+    'check-list',
+    'cash-settlement',
+    'order-success',
+  ]
+  return !noNavRoutes.includes(route.name as string) && !route.meta.hideNav
+})
+
+const isWideGuest = computed(() => {
+  const wideRoutes = [
+    'settlement',
+    'check-mode',
+    'check-form',
+    'check-list',
+    'cash-settlement',
+  ]
+  return wideRoutes.includes(route.name as string)
+})
+</script>
+
+<template>
+  <div
+    class="app-shell"
+    :class="{
+      'app-shell--no-nav': !showNav,
+      'app-shell--wide': isWideGuest,
+      'app-shell--with-nav': showNav,
+    }"
+  >
+    <div class="app-layout">
+      <DesktopSidebar v-if="showNav" />
+      <div class="app-frame">
+        <DesktopHeader v-if="showNav" />
+        <main class="app-main">
+          <div class="app-main__content">
+            <div class="app-content">
+              <slot />
+            </div>
+          </div>
+        </main>
+        <BottomNav v-if="showNav" />
+      </div>
+    </div>
+  </div>
+</template>