diff --git a/frontend/src/features/listings/views/HomeView.vue b/frontend/src/features/listings/views/HomeView.vue index 8fdbe23..ac83f3c 100644 --- a/frontend/src/features/listings/views/HomeView.vue +++ b/frontend/src/features/listings/views/HomeView.vue @@ -40,7 +40,7 @@ import HomeBanner from '../components/HomeBanner.vue' import HomeFilters from '../components/HomeFilters.vue' import HomeZones from '../components/HomeZones.vue' import ListingCard from '../components/ListingCard.vue' -import { useDistributionSiteStore } from '@/stores/distributionSite' +import { mapDistributionHomeBanners, useDistributionSiteStore } from '@/stores/distributionSite' const siteStore = useDistributionSiteStore() @@ -59,28 +59,8 @@ const displayAnnouncements = computed(() => { }) const banners = ref(defaultHomeBanners) const displayBanners = computed(() => { - if (siteStore.isDistribution && siteStore.banners && siteStore.banners.length > 0) { - return siteStore.banners.map(b => { - const imageUrl = b.image_url?.trim() || '' - // 整张海报已含文案。再叠标题会触发整幅压暗遮罩,左右两侧颜色会被压暗。 - if (imageUrl) { - return { - eyebrow: '', - title: '', - badge: '本店精选', - pill: '', - tone: 'gold', - image_url: imageUrl, - } - } - return { - eyebrow: siteStore.siteName, - title: b.title || '精选游戏账号 · 随租随玩', - badge: '本店精选', - pill: '官方保障', - tone: 'gold', - } - }) + if (siteStore.isDistribution && siteStore.banners.length > 0) { + return mapDistributionHomeBanners(siteStore.banners, siteStore.siteName) } return banners.value }) @@ -461,7 +441,7 @@ if (!restored) { {{ siteStore.storefrontText.hero_badge }} -

{{ siteStore.siteName }}

+

{{ siteStore.coBrandName }}

{{ siteStore.storefrontText.hero_desc }}

diff --git a/frontend/src/features/listings/views/MobileHomeView.css b/frontend/src/features/listings/views/MobileHomeView.css index 7fee354..19ae8d0 100644 --- a/frontend/src/features/listings/views/MobileHomeView.css +++ b/frontend/src/features/listings/views/MobileHomeView.css @@ -328,6 +328,15 @@ object-fit: cover; } +.mobile-banner.has-image:not(.has-copy) { + background: #0f172a; +} + +.mobile-banner.has-image:not(.has-copy) .banner-image { + object-fit: contain; + background: #0f172a; +} + .mobile-banner.has-image.has-copy::after { position: absolute; inset: 0; diff --git a/frontend/src/features/listings/views/MobileHomeView.vue b/frontend/src/features/listings/views/MobileHomeView.vue index f2d0306..700b02e 100644 --- a/frontend/src/features/listings/views/MobileHomeView.vue +++ b/frontend/src/features/listings/views/MobileHomeView.vue @@ -60,7 +60,7 @@ import { getListingResources, } from '@/shared/utils/listingDisplay' import { buildMobileHomeListSignature, useMobileHomeCacheStore } from '@/stores/mobileHomeCache' -import { useDistributionSiteStore } from '@/stores/distributionSite' +import { mapDistributionHomeBanners, useDistributionSiteStore } from '@/stores/distributionSite' import { useSessionStore } from '@/stores/session' const router = useRouter() @@ -97,6 +97,12 @@ const displayAnnouncements = computed(() => { return announcements.value }) const bannerSlides = ref(defaultHomeBanners) +const displayBanners = computed(() => { + if (siteStore.isDistribution && siteStore.banners.length > 0) { + return mapDistributionHomeBanners(siteStore.banners, siteStore.siteName) + } + return bannerSlides.value +}) const awRecycle = ref({ ...defaultAWRecycleConfig }) const awRecyclePreviewVisible = ref(false) const cooperationFeedback = ref({ ...defaultCooperationFeedbackConfig }) @@ -507,7 +513,7 @@ function openCooperationFeedback() { function openBannerPreview(slide: HomeBannerSlide) { const url = slide.image_url?.trim() if (!url) return - const images = bannerSlides.value + const images = displayBanners.value .map(item => item.image_url?.trim() || '') .filter((item): item is string => Boolean(item)) const startPosition = images.indexOf(url) @@ -903,14 +909,14 @@ if (!restoreHomeConfigFromCache()) {
{{ siteStore.storefrontText.hero_badge }} - {{ siteStore.siteName }} + {{ siteStore.coBrandName }}

{{ siteStore.storefrontText.card_sub }}