zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(discovery): switch card component based on active tab

Browse Source 
add computed property to check panorama guide tab, import required dependencies and CardSwiper component, update template conditional rendering
This commit is contained in:
duanshuwen
2026-07-07 09:36:31 +08:00
parent 808ca48668
commit 4fb43876f5
1 changed files with 16 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/pages/Discovery/index.vue
View File

@@ -6,7 +6,16 @@
<scroll-view class="discovery-scroll" scroll-y @scroll="handleContentScroll"> <scroll-view class="discovery-scroll" scroll-y @scroll="handleContentScroll">
<view class="discovery-body"> <view class="discovery-body">
<ExploreCards v-if="discoveryCards.length > 0" :list="discoveryCards" @didSelectItem="handleCardClick" /> <ExploreCards
v-if="discoveryCards.length > 0 && isPanoramaGuideTab"
:list="discoveryCards"
@didSelectItem="handleCardClick"
/>
<CardSwiper
v-else-if="discoveryCards.length > 0"
:list="discoveryCards"
@didSelectItem="handleCardClick"
/>
<QuickQuestions v-if="discoveryQuickQuestions.length > 0" :list="discoveryQuickQuestions" <QuickQuestions v-if="discoveryQuickQuestions.length > 0" :list="discoveryQuickQuestions"
@didSelectItem="handleQuickQuestionClick" /> @didSelectItem="handleQuickQuestionClick" />
@@ -20,12 +29,13 @@
</template> </template>
<script setup> <script setup>
import { onMounted, ref } from "vue"; import { computed, onMounted, ref } from "vue";
import { SEND_MESSAGE_CONTENT_TEXT, SEND_MESSAGE_COMMAND_TYPE } from "@/constant/constant"; import { SEND_MESSAGE_CONTENT_TEXT, SEND_MESSAGE_COMMAND_TYPE } from "@/constant/constant";
import { navigateTo } from "@/router"; import { navigateTo } from "@/router";
import { getAccessToken } from "@/constant/token"; import { getAccessToken } from "@/constant/token";
import FindTabs from "./components/FindTabs/index.vue"; import FindTabs from "./components/FindTabs/index.vue";
import CardSwiper from "./components/CardSwiper/index.vue";
import ExploreCards from "./components/ExploreCards/index.vue"; import ExploreCards from "./components/ExploreCards/index.vue";
import QuickQuestions from "./components/QuickQuestions/index.vue"; import QuickQuestions from "./components/QuickQuestions/index.vue";
import DiscoveryPhotoToolCard from "./components/DiscoveryPhotoToolCard/index.vue"; import DiscoveryPhotoToolCard from "./components/DiscoveryPhotoToolCard/index.vue";
@@ -47,6 +57,10 @@ const discoveryCards = ref([]);
const discoveryQuickQuestions = ref([]); const discoveryQuickQuestions = ref([]);
const emit = defineEmits(["content-scroll"]); const emit = defineEmits(["content-scroll"]);
const isPanoramaGuideTab = computed(() => {
return discoveryTabs.value[activeIndex.value]?.label === "全景攻略";
});
const handleContentScroll = (e) => { const handleContentScroll = (e) => {
emit("content-scroll", { emit("content-scroll", {
scrollTop: Number(e.detail?.scrollTop || 0), scrollTop: Number(e.detail?.scrollTop || 0),