feat: 对接了首页的接口
This commit is contained in:
@@ -8,7 +8,7 @@
|
|||||||
:id="'tab-' + idx"
|
:id="'tab-' + idx"
|
||||||
class="tab-item"
|
class="tab-item"
|
||||||
:class="{ active: modelValue === idx }"
|
:class="{ active: modelValue === idx }"
|
||||||
@tap="handleSwitch(idx)"
|
@tap="handleSwitch(tab, idx)"
|
||||||
>
|
>
|
||||||
<view class="tab-content">
|
<view class="tab-content">
|
||||||
<view class="tab-label">
|
<view class="tab-label">
|
||||||
@@ -29,21 +29,15 @@ const props = defineProps({
|
|||||||
modelValue: { type: Number, default: 0 },
|
modelValue: { type: Number, default: 0 },
|
||||||
tabs: {
|
tabs: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: () => [
|
default: () => [],
|
||||||
{ label: '小七孔古桥' },
|
|
||||||
{ label: '翠谷瀑布' },
|
|
||||||
{ label: '鸳鸯湖' },
|
|
||||||
{ label: '天河潭' },
|
|
||||||
{ label: '卧龙潭' }
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const emit = defineEmits(['update:modelValue', 'change']);
|
const emit = defineEmits(['update:modelValue', 'change']);
|
||||||
|
|
||||||
const handleSwitch = (i) => {
|
const handleSwitch = (tab, idx) => {
|
||||||
emit('update:modelValue', i);
|
emit('update:modelValue', idx);
|
||||||
emit('change', i);
|
emit('change', { tab, idx });
|
||||||
};
|
};
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -1,26 +1,38 @@
|
|||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
<FindTabs
|
<FindTabs
|
||||||
|
v-if="discoveryTabs.length > 0"
|
||||||
v-model="activeIndex"
|
v-model="activeIndex"
|
||||||
:tabs="discoveryTabs"
|
:tabs="discoveryTabs"
|
||||||
|
@change="handleTabChange"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<CardSwiper
|
<CardSwiper
|
||||||
|
v-if="discoveryCards.length > 0"
|
||||||
:list="discoveryCards"
|
:list="discoveryCards"
|
||||||
@card-click="cardClick" />
|
@card-click="cardClick" />
|
||||||
<QuickQuestions />
|
|
||||||
|
|
||||||
|
<QuickQuestions />
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { computed, ref } from "vue";
|
import { computed, onMounted, ref } from "vue";
|
||||||
import FindTabs from "./components/FindTabs/index.vue";
|
import FindTabs from "./components/FindTabs/index.vue";
|
||||||
import CardSwiper from "./components/CardSwiper/index.vue";
|
import CardSwiper from "./components/CardSwiper/index.vue";
|
||||||
import QuickQuestions from "./components/QuickQuestions/index.vue";
|
import QuickQuestions from "./components/QuickQuestions/index.vue";
|
||||||
import discoveryCover from "@/components/ImageSwiper/images/2025-07-12_180248.jpg";
|
import discoveryCover from "@/components/ImageSwiper/images/2025-07-12_180248.jpg";
|
||||||
|
|
||||||
|
import { homeTabsData, homeTabContentData, homeQuickQuestionData } from "../../request/api/MainPageDataApi";
|
||||||
|
import { useAppStore } from "@/store";
|
||||||
|
const appStore = useAppStore();
|
||||||
|
/// 从个渠道获取如二维码
|
||||||
|
const sceneId = appStore.sceneId || "";
|
||||||
|
|
||||||
const activeIndex = ref(0);
|
const activeIndex = ref(0);
|
||||||
|
const discoveryTabs = ref([]);
|
||||||
|
|
||||||
const discoveryCards = ref([
|
const discoveryCards = ref([
|
||||||
{
|
{
|
||||||
title: "卧龙潭漂流",
|
title: "卧龙潭漂流",
|
||||||
@@ -52,16 +64,71 @@ const discoveryCards = ref([
|
|||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const discoveryTabs = computed(() =>
|
/// tabs 切换事件
|
||||||
discoveryCards.value.map((item) => ({
|
const handleTabChange = ({ tab, idx }) => {
|
||||||
label: item.tabLabel || item.title,
|
if (activeIndex.value === idx) return;
|
||||||
}))
|
activeIndex.value = idx;
|
||||||
);
|
queryDiscoveryData(tab.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 卡片点击事件
|
||||||
const cardClick = (item) => {
|
const cardClick = (item) => {
|
||||||
console.log(JSON.stringify(item));
|
console.log(JSON.stringify(item));
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/// 请求发现页tab数据
|
||||||
|
const queryTabsList = async () => {
|
||||||
|
const res = await homeTabsData();
|
||||||
|
if (res.code === 0) {
|
||||||
|
/// 处理tab数据
|
||||||
|
const tabList = res.data.map((item) => ({
|
||||||
|
id: item.id,
|
||||||
|
label: item.tagName,
|
||||||
|
}));
|
||||||
|
/// 设置tab数据
|
||||||
|
discoveryTabs.value = tabList;
|
||||||
|
|
||||||
|
/// 查询是否有sceneId参数
|
||||||
|
const activeTab = discoveryTabs.value.find((tab) => {
|
||||||
|
return tab.id === sceneId;
|
||||||
|
});
|
||||||
|
|
||||||
|
/// 如果有则优先展示对应tab数据,没有则展示第一个tab数据
|
||||||
|
if (activeTab) {
|
||||||
|
queryDiscoveryData(sceneId);
|
||||||
|
} else {
|
||||||
|
queryDiscoveryData(discoveryTabs.value[0].id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 统一请求发现页数据
|
||||||
|
const queryDiscoveryData = async (tabId) => {
|
||||||
|
queryDiscoveryCards(tabId);
|
||||||
|
queryQuickQuestionData(tabId);
|
||||||
|
};
|
||||||
|
|
||||||
|
/// 请求发现页卡片数据
|
||||||
|
const queryDiscoveryCards = async (tabId) => {
|
||||||
|
const res = await homeTabContentData({ tagId: tabId });
|
||||||
|
if (res.code === 0) {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 请求快速问题列表数据
|
||||||
|
const queryQuickQuestionData = async (tabId) => {
|
||||||
|
const res = await homeQuickQuestionData({ tagId: tabId });
|
||||||
|
if (res.code === 0) {
|
||||||
|
console.log("快速问题列表:", res.data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 组件挂载后请求数据
|
||||||
|
onMounted(() => {
|
||||||
|
queryTabsList();
|
||||||
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -58,7 +58,7 @@ const getWeixinMiniProgramParams = (e) => {
|
|||||||
if (e.q && e.q != "undefined") {
|
if (e.q && e.q != "undefined") {
|
||||||
const qrUrl = decodeURIComponent(e.q); // 获取到二维码原始链接内容
|
const qrUrl = decodeURIComponent(e.q); // 获取到二维码原始链接内容
|
||||||
const params = getUrlParams(qrUrl);
|
const params = getUrlParams(qrUrl);
|
||||||
appStore.setSceneId(params.sceneId);
|
appStore.setSceneId(params.sceneId || params.tagId);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,20 @@
|
|||||||
import request from "../base/request";
|
import request from "../base/request";
|
||||||
|
|
||||||
|
/// 首页tab场景数据
|
||||||
|
function homeTabsData(args) {
|
||||||
|
return request.post("/hotelBiz/mainScene/queryTagListWithCache", args);
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 首页tab场景下内容数据
|
||||||
|
function homeTabContentData(args) {
|
||||||
|
return request.post("/hotelBiz/mainScene/queryContentListWithCache", args);
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 快速问题列表
|
||||||
|
function homeQuickQuestionData(args) {
|
||||||
|
return request.post("/hotelBiz/mainScene/queryQuickQuestionListWithCache", args);
|
||||||
|
}
|
||||||
|
|
||||||
/// 主页数据
|
/// 主页数据
|
||||||
function mainPageData(args) {
|
function mainPageData(args) {
|
||||||
return request.post("/hotelBiz/mainScene/mainPageData", args);
|
return request.post("/hotelBiz/mainScene/mainPageData", args);
|
||||||
@@ -16,4 +31,11 @@ function discoveryCradComponent() {
|
|||||||
return request.get("/hotelBiz/mainScene/discoveryComponent", {});
|
return request.get("/hotelBiz/mainScene/discoveryComponent", {});
|
||||||
}
|
}
|
||||||
|
|
||||||
export { mainPageData, quickBookingComponent, discoveryCradComponent };
|
export {
|
||||||
|
homeTabsData,
|
||||||
|
homeTabContentData,
|
||||||
|
homeQuickQuestionData,
|
||||||
|
mainPageData,
|
||||||
|
quickBookingComponent,
|
||||||
|
discoveryCradComponent
|
||||||
|
};
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import { getServiceUrl } from "../api/GetServiceUrlApi";
|
|||||||
const versionValue = "1.1.1";
|
const versionValue = "1.1.1";
|
||||||
|
|
||||||
/// 是否是测试版本, 测试版本为true, 发布版本为false
|
/// 是否是测试版本, 测试版本为true, 发布版本为false
|
||||||
const developVersion = false;
|
const developVersion = true;
|
||||||
|
|
||||||
// 获取服务地址
|
// 获取服务地址
|
||||||
const getEvnUrl = async () => {
|
const getEvnUrl = async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user