feat; 数据字段对接

This commit is contained in:
2026-08-06 15:34:53 +08:00
parent 22b1686c26
commit b5206c18d1
2 changed files with 38 additions and 32 deletions

View File

@@ -9,7 +9,7 @@
<view class="flex w-full gap-[12px]">
<view
v-for="goods in goodsList"
:key="goods.commodityId"
:key="goods.resource?.payload?.commodityId"
class="flex h-[88px]"
:class="{
'w-full': !hasMultipleGoods,
@@ -19,23 +19,23 @@
<view
class="h-[88px] w-[88px] shrink-0 overflow-hidden rounded-[16px] bg-[#eef8f2] shadow-[0_4px_18px_rgba(31,110,74,0.08)]"
>
<image class="h-full w-full" :src="goods.image" mode="aspectFill" />
<image class="h-full w-full" :src="goods.resource?.payload?.commodityPhoto" mode="aspectFill" />
</view>
<view
class="box-border flex h-full min-w-0 flex-1 flex-col rounded-[16px] bg-white px-[12px] py-[8px] shadow-[0_4px_18px_rgba(31,110,74,0.08)]"
>
<text class="block truncate text-[14px] font-semibold leading-[22px] text-[#1f2937]">
{{ goods.title }}
{{ goods.resource?.payload?.commodityName }}
</text>
<text class="mt-[2px] block truncate text-[11px] leading-[18px] text-[#9ca3af]">
{{ goods.description }}
{{ goods.resource?.payload?.commodityDescription }}
</text>
<view class="mt-auto flex items-end justify-between gap-[8px]">
<view class="min-w-0 flex-1 truncate font-bold text-[#111827]">
<text class="text-[14px]">¥</text>
<text class="text-[20px] leading-[28px]">{{ goods.price }}</text>
<text class="text-[20px] leading-[28px]">{{ goods.resource?.payload?.specificationPrice }}</text>
</view>
<button
class="m-0 flex h-[26px] shrink-0 items-center justify-center rounded-full bg-[#20cf6d] px-[12px] text-[14px] leading-none text-white after:border-0"
@@ -52,30 +52,22 @@
</template>
<script setup>
import { computed, ref } from "vue";
import { computed } from "vue";
const goodsList = ref([
{
commodityId: "xiaoqikong-rafting",
image: "https://one-feel-config-images-bucket.oss-cn-chengdu.aliyuncs.com/xiaoqi/tickets/product-boat-rafting.jpg",
title: "卧龙潭漂游",
description: "含防水袋 · 全程约 30 分钟",
price: "69.0",
const props = defineProps({
list: {
type: Array,
default: () => [],
},
{
commodityId: "xiaoqikong-classic",
image: "https://one-feel-config-images-bucket.oss-cn-chengdu.aliyuncs.com/xiaoqi/tickets/product-classic-forest-path.jpg",
title: "小七孔经典畅游",
description: "含门票及观光车 · 随买随用",
price: "188.0",
},
]);
});
const goodsList = computed(() => props.list);
const hasMultipleGoods = computed(() => goodsList.value.length > 1);
const handleBuy = (goods) => {
uni.navigateTo({
url: `/pages/goods/index?commodityId=${encodeURIComponent(goods.commodityId)}`,
url: `/pages/goods/index?commodityId=${encodeURIComponent(goods.resource?.payload?.commodityId)}`,
});
};
</script>

View File

@@ -23,10 +23,13 @@
<CardSwiper v-if="discoveryCards.length > 0" :list="discoveryCards" @didSelectItem="handleCardClick" />
<ExploreCards v-if="exploreCards.length > 0" :list="exploreCards" @didSelectItem="handleCardClick" />
<DiscoveryPhotoToolCard @didSelectItem="handleToolCardClick" @didSelectOption="handleToolOptionClick" />
<DiscoveryAudioToolCard @didSelectItem="handleToolCardClick" />
<DiscoveryGuideMapToolCard @didSelectItem="handleToolCardClick" />
<DiscoveryGoodsCard />
<DiscoveryPhotoToolCard v-if="discoveryPhotoToolData" :item="discoveryPhotoToolData"
@didSelectItem="handleToolCardClick" @didSelectOption="handleToolOptionClick" />
<DiscoveryAudioToolCard v-if="discoveryAudioToolData" :item="discoveryAudioToolData"
@didSelectItem="handleToolCardClick" />
<DiscoveryGuideMapToolCard v-if="discoveryGuideMapToolData" :item="discoveryGuideMapToolData"
@didSelectItem="handleToolCardClick" />
<DiscoveryGoodsCard v-if="discoveryGoodsData.length > 0" :list="discoveryGoodsData" />
<QuickQuestions v-if="discoveryQuickQuestions.length > 0" :list="discoveryQuickQuestions"
@didSelectItem="handleQuickQuestionClick" />
@@ -65,7 +68,10 @@ const discoveryTabs = ref([]);
const discoveryCards = ref([]);
const exploreCards = ref([]);
const discoveryQuickQuestions = ref([]);
const discoveryResourceCenterItems = ref([]);
const discoveryPhotoToolData = ref(null);
const discoveryAudioToolData = ref(null);
const discoveryGuideMapToolData = ref(null);
const discoveryGoodsData = ref([]);
const emit = defineEmits(["content-scroll"]);
/// 是否是主景区引导页 默认是 true点击主景区后为 false
@@ -85,7 +91,10 @@ const handleMainPanoramaClick = () => {
discoveryCards.value = [];
exploreCards.value = [];
discoveryQuickQuestions.value = [];
discoveryResourceCenterItems.value = [];
discoveryPhotoToolData.value = null;
discoveryAudioToolData.value = null;
discoveryGuideMapToolData.value = null;
discoveryGoodsData.value = [];
};
@@ -183,11 +192,16 @@ const queryQuickQuestionData = async (tabId) => {
}
/// 按资源集编码读取当前生效快照
const loadResourceCenterDataList = async (resourceSetCode) => {
if (!resourceSetCode) return;
const res = await resourceCenterData({ resourceSetCode });
const loadResourceCenterDataList = async (setCode) => {
if (!setCode) return;
const res = await resourceCenterData({ setCode });
if (res.code === 0) {
discoveryResourceCenterItems.value = res.data;
const discoveryResourceItems = res.data.items || [];
// AUDIO POI COMMODITY COMPONENT
discoveryPhotoToolData.value = discoveryResourceItems.find(item => item.resource?.type === 'COMPONENT') || null;
discoveryAudioToolData.value = discoveryResourceItems.find(item => item.resource?.type === 'AUDIO') || null;
discoveryGuideMapToolData.value = discoveryResourceItems.find(item => item.resource?.type === 'POI') || null;
discoveryGoodsData.value = discoveryResourceItems.filter(item => item.resource?.type === 'COMMODITY') || [];
}
}