chore: import WonderQ project

WonderQ-MiniAPP/src/pages/home/index.vue

@@ -0,0 +1,93 @@
+<template>
+  <AppShell>
+    <scroll-view id="home-scroll" scroll-y class="h-screen safe-bottom no-scrollbar" @scroll="onScroll">
+      <view class="relative">
+        <swiper class="h-[620px]" circular autoplay :interval="4600" :current="heroIndex"
+          @change="heroIndex = Number($event.detail.current)">
+          <swiper-item v-for="slide in appState.data.heroSlides" :key="slide.id || slide.image">
+            <view class="relative m-0 h-full w-full overflow-hidden rounded-none p-0 text-left"
+              @click="openHero(slide.title)">
+              <image class="absolute inset-0 h-full w-full" :src="slide.image" mode="aspectFill" />
+            </view>
+          </swiper-item>
+        </swiper>
+        <view class="absolute bottom-8 left-0 right-0 flex justify-center gap-2">
+          <text v-for="(_, index) in appState.data.heroSlides" :key="index" class="h-1.5 rounded-full transition-all"
+            :class="heroIndex === index ? 'w-6 bg-white' : 'w-1.5 bg-white/50'" />
+        </view>
+      </view>
+
+      <view class="py-6">
+        <SectionHeading title="万趣用车" subtitle="2-8人小团，按人数和行李匹配车型" />
+        <view class="grid grid-cols-2 gap-3 px-4">
+          <view v-for="vehicle in vehicleOptions" :key="vehicle.title"
+            class="tap-feedback m-0 overflow-hidden rounded-[22px] p-0 text-left soft-card" @click="goDemand('贵州')">
+            <image class="block h-[118px] w-full" :src="vehicle.image" mode="aspectFill" />
+            <view class="p-3">
+              <text class="home-card-title-clamp text-[15px] font-bold text-[#1f2c25]">{{
+                vehicle.title
+              }}</text>
+              <text class="mt-1 text-clamp-2 text-[11px] leading-4 text-[#718073]">{{ vehicle.description }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+    </scroll-view>
+
+    <view id="home-topbar"
+      class="top-safe fixed left-1/2 top-0 z-30 w-full max-w-[430px] -translate-x-1/2 border-b px-4 pb-2 pt-2"
+      :class="scrolled
+        ? 'border-[#1f6b57]/15 bg-white/95 text-[#1f2924]'
+        : 'border-white/20 bg-[#2f2618]/20 text-white'
+        ">
+      <view class="flex h-11 items-center justify-between gap-2">
+        <text class="min-w-0 flex-1 truncate text-[16px] font-bold leading-[44px]">{{
+          BRAND_FULL_NAME
+        }}</text>
+        <view class="-space-x-3 flex items-center">
+          <view aria-label="搜索" class="tap-feedback m-0 flex h-11 w-11 items-center justify-center rounded-[10px] p-0" :class="scrolled ? 'text-[#1f6b57]' : 'text-white/95'
+            " @click="goSearch('贵州')">
+            <uni-icons type="search" :size="22" :color="scrolled ? '#1f6b57' : '#ffffff'" />
+          </view>
+          <view aria-label="客服" class="tap-feedback m-0 flex h-11 w-11 items-center justify-center rounded-[10px] p-0" :class="scrolled ? 'text-[#1f6b57]' : 'text-white/95'
+            " @click="supportOpen = true">
+            <uni-icons type="headphones" :size="22" :color="scrolled ? '#1f6b57' : '#ffffff'" />
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <BottomNav active="home" />
+    <SupportSheet :open="supportOpen" @close="supportOpen = false" />
+  </AppShell>
+</template>
+
+<script setup lang="ts">
+import { computed, ref } from "vue";
+import { onShow } from "@dcloudio/uni-app";
+import AppShell from "@/components/AppShell.vue";
+import BottomNav from "@/components/BottomNav.vue";
+import SectionHeading from "@/components/SectionHeading.vue";
+import SupportSheet from "@/components/SupportSheet.vue";
+import { goDemand, goSearch } from "@/lib/navigation";
+import { appState, loadAppData } from "@/lib/store";
+import { BRAND_FULL_NAME } from "@/lib/types";
+
+const heroIndex = ref(0);
+const scrolled = ref(false);
+const supportOpen = ref(false);
+const vehicleOptions = computed(() => appState.data.vehicleOptions);
+
+onShow(() => {
+  void loadAppData();
+});
+
+function onScroll(event: { detail: { scrollTop: number } }) {
+  const scrollTop = event.detail.scrollTop;
+  scrolled.value = scrollTop > 24;
+}
+
+function openHero(title: string) {
+  goSearch(title);
+}
+</script>