国际版独立

This commit is contained in:
2026-04-29 11:10:29 +08:00
parent 120eba6c6a
commit 6913d9266b
10 changed files with 742 additions and 106 deletions
+31 -3
View File
@@ -34,12 +34,12 @@
<view class="pricing-banner">
<view class="pricing-main">
<text class="price-symbol">¥</text>
<text class="price">{{ deviceFeeConfig.maxHourPrice || '5.00' }}</text>
<text class="price-symbol">{{ displayCurrencySymbol }}</text>
<text class="price">{{ displayHourlyPrice }}</text>
<text class="unit">/{{ getPriceUnit() }}</text>
</view>
<view class="cap-badge">
<text class="cap-text">{{ deviceInfo.depositAmount || '99' }}{{ $t('device.capLimit') }}</text>
<text class="cap-text">{{ displayDepositCap }}{{ $t('device.capLimit') }}</text>
</view>
</view>
@@ -129,6 +129,7 @@
import {
ref,
reactive,
computed,
onMounted
} from 'vue'
import {
@@ -178,6 +179,8 @@
const isWechatMiniProgram = ref(false)
const isAlipayMiniProgram = ref(false)
const isH5 = ref(false)
const IDR_DEPOSIT_DISPLAY = 99000
const IDR_HOUR_PRICE_DISPLAY = 6000
// 生命周期 onLoad 钩子
onLoad(async (options) => {
@@ -499,6 +502,7 @@
// 获取价格单位文本
const getPriceUnit = () => {
if (isIdrCurrency.value) return t('time.hour')
console.log(deviceInfo.value);
// 按分钟计费
if (deviceInfo.value && deviceInfo.value.feeType === 'minute') {
@@ -547,6 +551,9 @@
// 生成计费说明文本
const getPricingInfoText = () => {
if (isIdrCurrency.value) {
return `${displayCurrencySymbol.value}${displayHourlyPrice.value}/${t('time.hour')}`
}
const unitPrice = getBillingUnitPrice()
const maxHourPrice = deviceFeeConfig.value.maxHourPrice || '5'
@@ -562,6 +569,9 @@
// 生成详细说明文本
const getDetailInfoText = () => {
if (isIdrCurrency.value) {
return `不足1${t('time.hour')}按1${t('time.hour')}计费,封顶${displayCurrencySymbol.value}${displayDepositCap.value},持续计费至${displayCurrencySymbol.value}${displayDepositCap.value}视为买断`
}
const freeMinutes = getFreeMinutes()
const unitMinutes = getBillingUnitMinutes()
const depositAmount = deviceInfo.value.depositAmount || '99'
@@ -584,6 +594,24 @@
}
}
const currencyCode = computed(() => {
return (positionInfo.value?.currency || '').toUpperCase()
})
const isIdrCurrency = computed(() => currencyCode.value === 'IDR')
const displayCurrencySymbol = computed(() => (isIdrCurrency.value ? 'Rp ' : '¥'))
const displayHourlyPrice = computed(() => {
if (isIdrCurrency.value) return `${IDR_HOUR_PRICE_DISPLAY}`
return deviceFeeConfig.value.maxHourPrice || '5.00'
})
const displayDepositCap = computed(() => {
if (isIdrCurrency.value) return `${IDR_DEPOSIT_DISPLAY}`
return deviceInfo.value.depositAmount || '99'
})
// 提交租借订单
const submitRentOrder = async (payWay) => {
try {
+86 -97
View File
@@ -17,80 +17,25 @@
</view>
<!-- 内容区域 -->
<view class="main-content" :style="mainContentStyle">
<!-- 全屏地图组件 -->
<!-- 支付宝小程序使用专用组件 -->
<!-- #ifdef MP-ALIPAY -->
<MapComponentAlipay v-if="!isLoading && userLocation && !locationPermissionDenied" ref="mapRef"
:userLocation="userLocation" :positionList="positionList" :filteredPositions="filteredPositions"
:searchKeyword="searchKeyword" :enableMarkers="true" :bannerImages="bannerImages"
:hideMapOverlays="showGuidePopup || showNoticePopup || showActivityPopup" @relocate="handleRelocate"
@scan="handleScan" @showList="showLocationList" @markerTap="selectPosition"
@mapCenterChange="onMapCenterChange" @bannerClick="handleBannerClick" @guide="openGuidePopup" />
<!-- #endif -->
<!-- 非支付宝小程序使用通用组件 -->
<!-- #ifndef MP-ALIPAY -->
<MapComponent v-if="!isLoading && userLocation && !locationPermissionDenied" ref="mapRef"
:userLocation="userLocation" :positionList="positionList" :filteredPositions="filteredPositions"
:searchKeyword="searchKeyword" :enableMarkers="true" :bannerImages="bannerImages"
:hideMapOverlays="showGuidePopup || showNoticePopup || showActivityPopup" @relocate="handleRelocate"
@scan="handleScan" @showList="showLocationList" @markerTap="selectPosition"
@mapCenterChange="onMapCenterChange" @bannerClick="handleBannerClick" @guide="openGuidePopup" />
<!-- #endif -->
<!-- #ifndef H5 -->
<HomeMainNonH5 ref="mapRef" :mainContentStyle="mainContentStyle" :isLoading="isLoading" :userLocation="userLocation"
:locationPermissionDenied="locationPermissionDenied" :positionList="positionList"
:filteredPositions="filteredPositions" :searchKeyword="searchKeyword" :bannerImages="bannerImages"
:hideMapOverlays="showGuidePopup || showNoticePopup || showActivityPopup"
:locationPermissionText="$t('home.locationPermissionOffTip')" :enableLocationText="$t('home.enableLocation')"
:loadingLocationText="$t('common.loadingLocation')" :buyDeviceText="$t('home.buyDevice')"
:scanText="$t('home.scanToUse')" :personalCenterText="$t('home.personalCenter')" @relocate="handleRelocate"
@scan="handleScan" @showList="showLocationList" @markerTap="selectPosition" @mapCenterChange="onMapCenterChange"
@bannerClick="handleBannerClick" @guide="openGuidePopup" @enableLocation="handleEnableLocation" @buy="goToBuy"
@my="goMy" />
<!-- #endif -->
<!-- 地图加载状态 -->
<!-- #ifdef MP-ALIPAY -->
<view v-if="!userLocation" class="location-denied-placeholder">
<view class="denied-content">
<text class="denied-text">{{ $t('home.locationPermissionOffTip') }}</text>
<view class="denied-enable-btn" @click="handleEnableLocation">
<text class="denied-enable-btn-text">{{ $t('home.enableLocation') }}</text>
</view>
</view>
</view>
<!-- 支付宝端拒绝定位后直接展示提示不展示 common.loadingLocation -->
<!-- #endif -->
<!-- #ifndef MP-ALIPAY -->
<view v-if="isLoading || !userLocation" class="map-loading-placeholder">
<view class="loading-content">
<view class="loading-spinner"></view>
<text>{{ $t('common.loadingLocation') }}</text>
</view>
</view>
<!-- #endif -->
</view>
<!-- 底部操作栏附近设备 / 扫码使用 / 我的 -->
<view class="bottom-actions">
<!-- <view class="action-btn secondary small btn-nearby" @click="showLocationList">
<view class="icon-wrap">
<image class="action-icon" src="/static/map.png" mode="aspectFit" />
</view>
<text class="action-label">{{ $t('home.nearbyDevices') }}</text>
</view> -->
<view class="action-btn secondary small btn-nearby" @click="goToBuy">
<view class="icon-wrap">
<image src="/static/shop_icon.png" class="action-icon" mode="scaleToFill" lazy-load="true"></image>
</view>
<text class="action-label">{{ $t('home.buyDevice') }}</text>
</view>
<view class="action-btn primary btn-scan" @click="handleScan">
<view class="icon-wrap">
<image class="action-icon" src="/static/scan-icon.png" mode="aspectFill" lazy-load="true" />
</view>
<text class="primary-label">{{ $t('home.scanToUse') }}</text>
</view>
<view class="action-btn secondary small btn-my" @click="goMy">
<view class="icon-wrap">
<image class="action-icon" src="/static/user.png" mode="aspectFit" lazy-load="true" />
</view>
<text class="action-label">{{ $t('home.personalCenter') }}</text>
</view>
</view>
<!-- #ifdef H5 -->
<HomeMainH5 :mainContentStyle="mainContentStyle" :bannerImages="bannerImages" :loadingText="$t('common.loading')"
:buyDeviceText="$t('home.buyDevice')" :scanText="$t('home.scanToUse')"
:personalCenterText="$t('home.personalCenter')" @bannerClick="handleBannerClick" @scan="handleScan"
@buy="goToBuy" @my="goMy" />
<!-- #endif -->
<!-- 场地列表弹窗组件 -->
<LocationListSheet :show="showLocationPopup" :expanded="isExpanded" :positions="filteredPositions"
@@ -256,12 +201,8 @@
calculateDistanceSync,
testDistanceCalculation
} from '../../utils/mapUtils.js'
// 同样需要使用相对路径引入组件
// 注意:从 pages/index/ 目录访问 components/ 需要使用 ../../components/ 路径
import MapComponent from '../../components/MapComponent.vue'
// #ifdef MP-ALIPAY
import MapComponentAlipay from '../../components/MapComponentAlipay.vue'
// #endif
import HomeMainNonH5 from '../../components/home/HomeMainNonH5.vue'
import HomeMainH5 from '../../components/home/HomeMainH5.vue'
import LocationListSheet from '../../components/LocationListSheet.vue'
import {
useI18n
@@ -441,27 +382,40 @@
appPlatform = 'ali'
// #endif
// 调用接口获取广告内容
const res = await getCurrentAdvertisement({
appPlatform: appPlatform, // 微信平台
appType: 'user', // 用户端
pictureLocation: 'home_banner'
})
const platformCandidates = []
if (appPlatform) {
platformCandidates.push(appPlatform)
}
// #ifdef H5
// H5 无固定 appPlatform,依次尝试常见值,兼容后端按平台分组配置广告位
platformCandidates.push('h5', 'wechat', 'ali')
// #endif
console.log('首页广告响应:', res)
let loaded = false
for (const platform of Array.from(new Set(platformCandidates))) {
// 调用接口获取广告内容
const res = await getCurrentAdvertisement({
appPlatform: platform,
appType: 'user',
pictureLocation: 'home_banner'
})
if (res && res.code === 200 && res.data) {
// 使用 imageList 字段(包含图片和链接信息)
const imageList = res.data.imageList || []
if (imageList.length > 0) {
bannerImageList.value = imageList
// 提取图片URL用于展示
bannerImages.value = imageList.map(item => item.imageUrl)
} else {
console.warn('未获取到广告图片')
console.log('首页广告响应:', platform, res)
if (res && res.code === 200 && res.data) {
const imageList = res.data.imageList || []
if (imageList.length > 0) {
bannerImageList.value = imageList
// 提取图片URL用于展示
bannerImages.value = imageList.map(item => item.imageUrl)
loaded = true
break
}
}
} else {
console.warn('获取首页广告失败:', res?.msg || '未知错误')
}
if (!loaded) {
console.warn('未获取到首页广告图片')
}
} catch (error) {
console.error('获取首页广告失败:', error)
@@ -668,6 +622,11 @@
getBannerImages()
])
// #ifdef H5
// H5 首页不展示地图,跳过定位与附近设备加载
return
// #endif
// 1. 先获取用户位置
await getUserLocationAndAddress()
@@ -1626,6 +1585,36 @@
box-sizing: border-box;
}
.h5-banner-section {
padding: 24rpx 20rpx 0;
box-sizing: border-box;
}
.h5-banner-swiper {
width: 100%;
height: 320rpx;
border-radius: 20rpx;
overflow: hidden;
background: #f5f5f5;
}
.h5-banner-item {
width: 100%;
height: 100%;
}
.h5-banner-image {
width: 100%;
height: 100%;
}
.h5-banner-empty {
padding: 80rpx 20rpx 0;
text-align: center;
color: #999;
font-size: 26rpx;
}
/* 顶部Logo和通知栏 */
.header-section {
width: 92%;