70 lines
1.6 KiB
Vue
70 lines
1.6 KiB
Vue
<template>
|
|
<view class="relative flex flex-col h-screen">
|
|
<view
|
|
class="absolute top-0 left-0 w-full z-10"
|
|
:style="{ paddingTop: statusBarHeight + 'px' }"
|
|
>
|
|
<HomeNavBar />
|
|
</view>
|
|
|
|
<view class="relative flex-full">
|
|
<view class="relative">
|
|
<image
|
|
class="w-full block"
|
|
src="https://images.unsplash.com/photo-1506744038136-46273834b3fb?w=800&q=80"
|
|
mode="widthFix"
|
|
/>
|
|
<view
|
|
class="absolute bottom-0 left-0 right-0 flex-full px-12 pt-12 pb-4"
|
|
>
|
|
<HomeWelcome />
|
|
</view>
|
|
</view>
|
|
|
|
<AiTabSwitch
|
|
v-model="tabIndex"
|
|
:list="['探索发现', 'AI伴游']"
|
|
@change="handleChange"
|
|
/>
|
|
|
|
<view class="tab-content">
|
|
<Discovery v-if="tabIndex === 0" />
|
|
<ChatMainList v-if="tabIndex === 1" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from "vue";
|
|
import { onLoad } from "@dcloudio/uni-app";
|
|
|
|
import HomeNavBar from "./components/HomeNavBar.vue";
|
|
import HomeWelcome from "./components/HomeWelcome.vue";
|
|
import AiTabSwitch from "@/components/AiTabSwitch/index.vue";
|
|
import ChatMainList from "../ChatMain/ChatMainList/index.vue";
|
|
import Discovery from "../Discovery/index.vue";
|
|
|
|
const tabIndex = ref(0);
|
|
|
|
const handleChange = (i) => {
|
|
console.log("切换:", i);
|
|
};
|
|
|
|
/// 导航栏相关
|
|
const statusBarHeight = ref(20);
|
|
|
|
/// =============生命周期函数↓================
|
|
onLoad(() => {
|
|
uni.getSystemInfo({
|
|
success: (res) => {
|
|
statusBarHeight.value = res.statusBarHeight || 20;
|
|
},
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|