feat: 初始化前端项目基础结构

- 添加项目配置文件(tsconfig, eslint, prettier等)
- 实现基础路由和页面布局
- 添加全局状态管理和API请求封装
- 集成UI组件库和主题系统
- 添加文档网站和示例页面
- 配置CI/CD和工作流

frontend/app/src/layouts/default.vue

@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+</script>
+
+<script lang="ts">
+export default {
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared',
+  },
+}
+</script>
+
+<template>
+  <slot />
+</template>

frontend/app/src/layouts/tabbar.vue

@@ -0,0 +1,47 @@
+<script lang="ts" setup>
+const router = useRouter()
+
+const route = useRoute()
+
+const { activeTabbar, getTabbarItemValue, setTabbarItemActive, tabbarList } = useTabbar()
+
+function handleTabbarChange({ value }: { value: string }) {
+  setTabbarItemActive(value)
+  router.pushTab({ name: value })
+}
+
+onMounted(() => {
+  // #ifdef APP
+  uni.hideTabBar()
+  // #endif
+  nextTick(() => {
+    if (route.name && route.name !== activeTabbar.value.name) {
+      setTabbarItemActive(route.name)
+    }
+  })
+})
+</script>
+
+<script lang="ts">
+export default {
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared',
+  },
+}
+</script>
+
+<template>
+  <slot />
+  <wd-gap safe-area-bottom height="var(--wot-tabbar-height, 50px)" />
+  <wd-tabbar
+    :model-value="activeTabbar.name" bordered safe-area-inset-bottom fixed
+    @change="handleTabbarChange"
+  >
+    <wd-tabbar-item
+      v-for="(item, index) in tabbarList" :key="index" :name="item.name"
+      :value="getTabbarItemValue(item.name)" :title="item.title" :icon="item.icon"
+    />
+  </wd-tabbar>
+</template>