国际版独立
This commit is contained in:
@@ -0,0 +1,294 @@
|
|||||||
|
<template>
|
||||||
|
<view class="h5-home-wrap">
|
||||||
|
<view class="main-content" :style="mainContentStyle">
|
||||||
|
<view class="h5-banner-section" v-if="bannerImages && bannerImages.length > 0">
|
||||||
|
<swiper class="h5-banner-swiper" :indicator-dots="bannerImages.length > 1" :autoplay="true" :interval="4000"
|
||||||
|
:duration="500" circular>
|
||||||
|
<swiper-item v-for="(img, idx) in bannerImages" :key="idx">
|
||||||
|
<view class="h5-banner-item" @click="$emit('bannerClick', idx)">
|
||||||
|
<image :src="img" mode="aspectFill" class="h5-banner-image"></image>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
<view class="h5-banner-empty" v-else>
|
||||||
|
<text>{{ loadingText }}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="h5-cta-card">
|
||||||
|
<view class="h5-cta-header">
|
||||||
|
<text class="h5-cta-title">{{ scanText }}</text>
|
||||||
|
<text class="h5-cta-desc">{{ t('home.h5ScanDesc') }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="h5-cta-btn" @click="$emit('scan')">
|
||||||
|
<image class="h5-cta-icon" src="/static/scan-icon.png" mode="aspectFit" />
|
||||||
|
<text class="h5-cta-btn-text">{{ scanText }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="h5-section">
|
||||||
|
<view class="h5-section-title">{{ t('home.h5HowItWorks') }}</view>
|
||||||
|
<view class="h5-steps">
|
||||||
|
<view class="h5-step-item">
|
||||||
|
<text class="h5-step-index">1</text>
|
||||||
|
<text class="h5-step-text">{{ t('home.h5StepScan') }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="h5-step-item">
|
||||||
|
<text class="h5-step-index">2</text>
|
||||||
|
<text class="h5-step-text">{{ t('home.h5StepUnlock') }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="h5-step-item">
|
||||||
|
<text class="h5-step-index">3</text>
|
||||||
|
<text class="h5-step-text">{{ t('home.h5StepReturn') }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="h5-section">
|
||||||
|
<view class="h5-section-title">{{ t('home.h5ServiceTitle') }}</view>
|
||||||
|
<view class="h5-tags">
|
||||||
|
<text class="h5-tag">{{ t('home.h5ServiceSupport') }}</text>
|
||||||
|
<text class="h5-tag">{{ t('home.h5ServiceSafePayment') }}</text>
|
||||||
|
<text class="h5-tag">{{ t('home.h5ServiceEasyReturn') }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="h5-bottom-actions">
|
||||||
|
<view class="action-btn secondary" @click="$emit('buy')">
|
||||||
|
<image class="action-icon" src="/static/shop_icon.png" mode="aspectFit" />
|
||||||
|
<text class="action-label">{{ buyDeviceText }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="action-btn primary" @click="$emit('scan')">
|
||||||
|
<image class="action-icon" src="/static/scan-icon.png" mode="aspectFit" />
|
||||||
|
<text class="action-label primary-label">{{ scanText }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="action-btn secondary" @click="$emit('my')">
|
||||||
|
<image class="action-icon" src="/static/user.png" mode="aspectFit" />
|
||||||
|
<text class="action-label">{{ personalCenterText }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { useI18n } from '../../utils/i18n.js'
|
||||||
|
|
||||||
|
const { t } = useI18n()
|
||||||
|
|
||||||
|
defineEmits(['bannerClick', 'scan', 'buy', 'my'])
|
||||||
|
defineProps({
|
||||||
|
mainContentStyle: { type: Object, default: () => ({}) },
|
||||||
|
bannerImages: { type: Array, default: () => [] },
|
||||||
|
loadingText: { type: String, default: '' },
|
||||||
|
buyDeviceText: { type: String, default: '' },
|
||||||
|
scanText: { type: String, default: '' },
|
||||||
|
personalCenterText: { type: String, default: '' }
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.h5-home-wrap {
|
||||||
|
min-height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-content {
|
||||||
|
padding-bottom: 220rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.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,
|
||||||
|
.h5-banner-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-banner-empty {
|
||||||
|
padding: 80rpx 20rpx 0;
|
||||||
|
text-align: center;
|
||||||
|
color: #999;
|
||||||
|
font-size: 26rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-cta-card {
|
||||||
|
margin: 20rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
background: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 20rpx;
|
||||||
|
box-shadow: 0 6rpx 18rpx rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-cta-header {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-cta-title {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #1f7d43;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-cta-desc {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #4f7b61;
|
||||||
|
margin-top: 8rpx;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-cta-btn {
|
||||||
|
height: 76rpx;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
background: #3EAB64;
|
||||||
|
border-radius: 38rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-cta-icon {
|
||||||
|
width: 30rpx;
|
||||||
|
height: 30rpx;
|
||||||
|
filter: brightness(0) invert(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-cta-btn-text {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-section {
|
||||||
|
margin: 0 20rpx 20rpx;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
padding: 20rpx;
|
||||||
|
box-shadow: 0 6rpx 18rpx rgba(0, 0, 0, 0.04);
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-section-title {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #2d2d2d;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-steps {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-step-item {
|
||||||
|
background: #f4f8f6;
|
||||||
|
border-radius: 14rpx;
|
||||||
|
padding: 16rpx 10rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-step-index {
|
||||||
|
width: 34rpx;
|
||||||
|
height: 34rpx;
|
||||||
|
background: #3EAB64;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-step-text {
|
||||||
|
font-size: 22rpx;
|
||||||
|
color: #315c46;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-tags {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-tag {
|
||||||
|
padding: 10rpx 16rpx;
|
||||||
|
background: #eef8f1;
|
||||||
|
color: #2e7d4f;
|
||||||
|
border-radius: 999rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h5-bottom-actions {
|
||||||
|
position: fixed;
|
||||||
|
left: 20rpx;
|
||||||
|
right: 20rpx;
|
||||||
|
bottom: 30rpx;
|
||||||
|
z-index: 1200;
|
||||||
|
padding: 14rpx;
|
||||||
|
background: rgba(255, 255, 255, 0.96);
|
||||||
|
border-radius: 56rpx;
|
||||||
|
box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn {
|
||||||
|
height: 86rpx;
|
||||||
|
border-radius: 43rpx;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn.primary {
|
||||||
|
flex: 1;
|
||||||
|
background: #3EAB64;
|
||||||
|
max-width: 360rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn.secondary {
|
||||||
|
width: 150rpx;
|
||||||
|
background: #f4f6f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-icon {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn.primary .action-icon {
|
||||||
|
filter: brightness(0) invert(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-label {
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,276 @@
|
|||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="main-content" :style="mainContentStyle">
|
||||||
|
<!-- 支付宝小程序使用专用组件 -->
|
||||||
|
<!-- #ifdef MP-ALIPAY -->
|
||||||
|
<MapComponentAlipay v-if="!isLoading && userLocation && !locationPermissionDenied" ref="innerMapRef"
|
||||||
|
:userLocation="userLocation" :positionList="positionList" :filteredPositions="filteredPositions"
|
||||||
|
:searchKeyword="searchKeyword" :enableMarkers="true" :bannerImages="bannerImages"
|
||||||
|
:hideMapOverlays="hideMapOverlays" @relocate="$emit('relocate')" @scan="$emit('scan')"
|
||||||
|
@showList="$emit('showList')" @markerTap="$emit('markerTap', $event)"
|
||||||
|
@mapCenterChange="$emit('mapCenterChange', $event)" @bannerClick="$emit('bannerClick', $event)"
|
||||||
|
@guide="$emit('guide')" />
|
||||||
|
<!-- #endif -->
|
||||||
|
|
||||||
|
<!-- 非支付宝小程序使用通用组件 -->
|
||||||
|
<!-- #ifndef MP-ALIPAY -->
|
||||||
|
<MapComponent v-if="!isLoading && userLocation && !locationPermissionDenied" ref="innerMapRef"
|
||||||
|
:userLocation="userLocation" :positionList="positionList" :filteredPositions="filteredPositions"
|
||||||
|
:searchKeyword="searchKeyword" :enableMarkers="true" :bannerImages="bannerImages"
|
||||||
|
:hideMapOverlays="hideMapOverlays" @relocate="$emit('relocate')" @scan="$emit('scan')"
|
||||||
|
@showList="$emit('showList')" @markerTap="$emit('markerTap', $event)"
|
||||||
|
@mapCenterChange="$emit('mapCenterChange', $event)" @bannerClick="$emit('bannerClick', $event)"
|
||||||
|
@guide="$emit('guide')" />
|
||||||
|
<!-- #endif -->
|
||||||
|
|
||||||
|
<!-- 地图加载状态 -->
|
||||||
|
<!-- #ifdef MP-ALIPAY -->
|
||||||
|
<view v-if="!userLocation" class="location-denied-placeholder">
|
||||||
|
<view class="denied-content">
|
||||||
|
<text class="denied-text">{{ locationPermissionText }}</text>
|
||||||
|
<view class="denied-enable-btn" @click="$emit('enableLocation')">
|
||||||
|
<text class="denied-enable-btn-text">{{ enableLocationText }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
|
||||||
|
<!-- #ifndef MP-ALIPAY -->
|
||||||
|
<view v-if="isLoading || !userLocation" class="map-loading-placeholder">
|
||||||
|
<view class="loading-content">
|
||||||
|
<view class="loading-spinner"></view>
|
||||||
|
<text>{{ loadingLocationText }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="bottom-actions">
|
||||||
|
<view class="action-btn secondary small btn-nearby" @click="$emit('buy')">
|
||||||
|
<view class="icon-wrap">
|
||||||
|
<image src="/static/shop_icon.png" class="action-icon" mode="scaleToFill" lazy-load="true"></image>
|
||||||
|
</view>
|
||||||
|
<text class="action-label">{{ buyDeviceText }}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="action-btn primary btn-scan" @click="$emit('scan')">
|
||||||
|
<view class="icon-wrap">
|
||||||
|
<image class="action-icon" src="/static/scan-icon.png" mode="aspectFill" lazy-load="true" />
|
||||||
|
</view>
|
||||||
|
<text class="primary-label">{{ scanText }}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="action-btn secondary small btn-my" @click="$emit('my')">
|
||||||
|
<view class="icon-wrap">
|
||||||
|
<image class="action-icon" src="/static/user.png" mode="aspectFit" lazy-load="true" />
|
||||||
|
</view>
|
||||||
|
<text class="action-label">{{ personalCenterText }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { computed, ref } from 'vue'
|
||||||
|
import MapComponent from '../MapComponent.vue'
|
||||||
|
// #ifdef MP-ALIPAY
|
||||||
|
import MapComponentAlipay from '../MapComponentAlipay.vue'
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
defineEmits(['relocate', 'scan', 'showList', 'markerTap', 'mapCenterChange', 'bannerClick', 'guide', 'enableLocation', 'buy', 'my'])
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
mainContentStyle: { type: Object, default: () => ({}) },
|
||||||
|
isLoading: { type: Boolean, default: false },
|
||||||
|
userLocation: { type: Object, default: null },
|
||||||
|
locationPermissionDenied: { type: Boolean, default: false },
|
||||||
|
positionList: { type: Array, default: () => [] },
|
||||||
|
filteredPositions: { type: Array, default: () => [] },
|
||||||
|
searchKeyword: { type: String, default: '' },
|
||||||
|
bannerImages: { type: Array, default: () => [] },
|
||||||
|
hideMapOverlays: { type: Boolean, default: false },
|
||||||
|
locationPermissionText: { type: String, default: '' },
|
||||||
|
enableLocationText: { type: String, default: '' },
|
||||||
|
loadingLocationText: { type: String, default: '' },
|
||||||
|
buyDeviceText: { type: String, default: '' },
|
||||||
|
scanText: { type: String, default: '' },
|
||||||
|
personalCenterText: { type: String, default: '' }
|
||||||
|
})
|
||||||
|
|
||||||
|
const innerMapRef = ref(null)
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
mapCenter: computed(() => innerMapRef.value?.mapCenter || null),
|
||||||
|
moveToLocation: (location) => innerMapRef.value && innerMapRef.value.moveToLocation && innerMapRef.value.moveToLocation(location)
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.main-content {
|
||||||
|
flex: 1;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
padding-bottom: 180rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.map-loading-placeholder {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 180rpx;
|
||||||
|
background: #f6f7fb;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 100;
|
||||||
|
|
||||||
|
.loading-content {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 40rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.loading-spinner {
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
border: 4rpx solid #f0f0f0;
|
||||||
|
border-top: 4rpx solid #2196F3;
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: spin 1s linear infinite;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
0% { transform: rotate(0deg); }
|
||||||
|
100% { transform: rotate(360deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.location-denied-placeholder {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 180rpx;
|
||||||
|
background: #f6f7fb;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 0 40rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.denied-content {
|
||||||
|
width: 100%;
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 40rpx;
|
||||||
|
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||||
|
}
|
||||||
|
|
||||||
|
.denied-text {
|
||||||
|
display: block;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.denied-enable-btn {
|
||||||
|
margin-top: 28rpx;
|
||||||
|
width: 100%;
|
||||||
|
height: 88rpx;
|
||||||
|
background: #3EAB64;
|
||||||
|
border-radius: 44rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.denied-enable-btn-text {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom-actions {
|
||||||
|
position: fixed;
|
||||||
|
left: 20rpx;
|
||||||
|
right: 20rpx;
|
||||||
|
bottom: 40rpx;
|
||||||
|
z-index: 1200;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn.primary {
|
||||||
|
background: #3EAB64;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 56rpx;
|
||||||
|
height: 112rpx;
|
||||||
|
flex: 1;
|
||||||
|
max-width: 400rpx;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
flex-direction: row;
|
||||||
|
gap: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn.secondary {
|
||||||
|
color: #333;
|
||||||
|
border-radius: 24rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
width: 140rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
padding: 8rpx 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-wrap {
|
||||||
|
width: 36rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-scan .icon-wrap {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-icon {
|
||||||
|
width: 36rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-scan .action-icon {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
filter: brightness(0) invert(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-label {
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-label {
|
||||||
|
line-height: 1.2;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
+2
-1
@@ -1,5 +1,6 @@
|
|||||||
// export const URL = "https://my.gxfs123.com/api" //正式服务器-弃用
|
// export const URL = "https://my.gxfs123.com/api" //正式服务器-弃用
|
||||||
export const URL = "https://manager.fdzpower.com/api" //正式服务器
|
// export const URL = "https://manager.fdzpower.com/api" //正式国内服务器
|
||||||
|
export const URL = "https://ina.fdzpower.com/api" //正式国外服务器
|
||||||
// export const URL = "https://fansdev.gxfs123.com/api" //测试服务器
|
// export const URL = "https://fansdev.gxfs123.com/api" //测试服务器
|
||||||
// export const URL = "http://192.168.0.158:8080" //本地调试
|
// export const URL = "http://192.168.0.158:8080" //本地调试
|
||||||
// export const URL = "http://127.0.0.1:8080" //本地调试
|
// export const URL = "http://127.0.0.1:8080" //本地调试
|
||||||
|
|||||||
@@ -92,6 +92,15 @@ export default {
|
|||||||
relocate: 'Relocate',
|
relocate: 'Relocate',
|
||||||
search: 'Search',
|
search: 'Search',
|
||||||
service: 'Service',
|
service: 'Service',
|
||||||
|
h5ScanDesc: 'Scan the device QR code to start',
|
||||||
|
h5HowItWorks: 'How It Works',
|
||||||
|
h5StepScan: 'Scan',
|
||||||
|
h5StepUnlock: 'Device Ejects',
|
||||||
|
h5StepReturn: 'Return',
|
||||||
|
h5ServiceTitle: 'Service',
|
||||||
|
h5ServiceSupport: '24/7 Support',
|
||||||
|
h5ServiceSafePayment: 'Safe Payment',
|
||||||
|
h5ServiceEasyReturn: 'Easy Return',
|
||||||
searchPlaceholder: 'Search locations',
|
searchPlaceholder: 'Search locations',
|
||||||
nearbyDeviceLocation: 'Nearby',
|
nearbyDeviceLocation: 'Nearby',
|
||||||
noNearbyDevice: 'No devices nearby',
|
noNearbyDevice: 'No devices nearby',
|
||||||
|
|||||||
@@ -92,6 +92,15 @@ export default {
|
|||||||
relocate: 'Lokasi Ulang',
|
relocate: 'Lokasi Ulang',
|
||||||
search: 'Cari',
|
search: 'Cari',
|
||||||
service: 'Layanan Pelanggan',
|
service: 'Layanan Pelanggan',
|
||||||
|
h5ScanDesc: 'Pindai kode QR perangkat untuk mulai menggunakan',
|
||||||
|
h5HowItWorks: 'Cara Penggunaan',
|
||||||
|
h5StepScan: 'Pindai',
|
||||||
|
h5StepUnlock: 'Perangkat Keluar',
|
||||||
|
h5StepReturn: 'Kembalikan',
|
||||||
|
h5ServiceTitle: 'Layanan',
|
||||||
|
h5ServiceSupport: 'Dukungan 24/7',
|
||||||
|
h5ServiceSafePayment: 'Pembayaran Aman',
|
||||||
|
h5ServiceEasyReturn: 'Pengembalian Mudah',
|
||||||
searchPlaceholder: 'Cari lokasi terdekat',
|
searchPlaceholder: 'Cari lokasi terdekat',
|
||||||
nearbyDeviceLocation: 'Lokasi Perangkat Terdekat',
|
nearbyDeviceLocation: 'Lokasi Perangkat Terdekat',
|
||||||
noNearbyDevice: 'Tidak ada perangkat terdekat',
|
noNearbyDevice: 'Tidak ada perangkat terdekat',
|
||||||
|
|||||||
@@ -91,6 +91,15 @@ export default {
|
|||||||
relocate: '重新定位',
|
relocate: '重新定位',
|
||||||
search: '搜索',
|
search: '搜索',
|
||||||
service: '客服',
|
service: '客服',
|
||||||
|
h5ScanDesc: '扫描设备二维码,立即开始使用',
|
||||||
|
h5HowItWorks: '使用流程',
|
||||||
|
h5StepScan: '扫码',
|
||||||
|
h5StepUnlock: '设备弹出',
|
||||||
|
h5StepReturn: '归还',
|
||||||
|
h5ServiceTitle: '服务保障',
|
||||||
|
h5ServiceSupport: '24小时在线客服',
|
||||||
|
h5ServiceSafePayment: '安全支付',
|
||||||
|
h5ServiceEasyReturn: '便捷归还',
|
||||||
searchPlaceholder: '搜索附近场地',
|
searchPlaceholder: '搜索附近场地',
|
||||||
nearbyDeviceLocation: '附近设备场地',
|
nearbyDeviceLocation: '附近设备场地',
|
||||||
noNearbyDevice: '附近暂无设备',
|
noNearbyDevice: '附近暂无设备',
|
||||||
|
|||||||
+31
-3
@@ -34,12 +34,12 @@
|
|||||||
|
|
||||||
<view class="pricing-banner">
|
<view class="pricing-banner">
|
||||||
<view class="pricing-main">
|
<view class="pricing-main">
|
||||||
<text class="price-symbol">¥</text>
|
<text class="price-symbol">{{ displayCurrencySymbol }}</text>
|
||||||
<text class="price">{{ deviceFeeConfig.maxHourPrice || '5.00' }}</text>
|
<text class="price">{{ displayHourlyPrice }}</text>
|
||||||
<text class="unit">/{{ getPriceUnit() }}</text>
|
<text class="unit">/{{ getPriceUnit() }}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="cap-badge">
|
<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>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
@@ -129,6 +129,7 @@
|
|||||||
import {
|
import {
|
||||||
ref,
|
ref,
|
||||||
reactive,
|
reactive,
|
||||||
|
computed,
|
||||||
onMounted
|
onMounted
|
||||||
} from 'vue'
|
} from 'vue'
|
||||||
import {
|
import {
|
||||||
@@ -178,6 +179,8 @@
|
|||||||
const isWechatMiniProgram = ref(false)
|
const isWechatMiniProgram = ref(false)
|
||||||
const isAlipayMiniProgram = ref(false)
|
const isAlipayMiniProgram = ref(false)
|
||||||
const isH5 = ref(false)
|
const isH5 = ref(false)
|
||||||
|
const IDR_DEPOSIT_DISPLAY = 99000
|
||||||
|
const IDR_HOUR_PRICE_DISPLAY = 6000
|
||||||
|
|
||||||
// 生命周期 onLoad 钩子
|
// 生命周期 onLoad 钩子
|
||||||
onLoad(async (options) => {
|
onLoad(async (options) => {
|
||||||
@@ -499,6 +502,7 @@
|
|||||||
|
|
||||||
// 获取价格单位文本
|
// 获取价格单位文本
|
||||||
const getPriceUnit = () => {
|
const getPriceUnit = () => {
|
||||||
|
if (isIdrCurrency.value) return t('time.hour')
|
||||||
console.log(deviceInfo.value);
|
console.log(deviceInfo.value);
|
||||||
// 按分钟计费
|
// 按分钟计费
|
||||||
if (deviceInfo.value && deviceInfo.value.feeType === 'minute') {
|
if (deviceInfo.value && deviceInfo.value.feeType === 'minute') {
|
||||||
@@ -547,6 +551,9 @@
|
|||||||
|
|
||||||
// 生成计费说明文本
|
// 生成计费说明文本
|
||||||
const getPricingInfoText = () => {
|
const getPricingInfoText = () => {
|
||||||
|
if (isIdrCurrency.value) {
|
||||||
|
return `${displayCurrencySymbol.value}${displayHourlyPrice.value}/${t('time.hour')}`
|
||||||
|
}
|
||||||
const unitPrice = getBillingUnitPrice()
|
const unitPrice = getBillingUnitPrice()
|
||||||
const maxHourPrice = deviceFeeConfig.value.maxHourPrice || '5'
|
const maxHourPrice = deviceFeeConfig.value.maxHourPrice || '5'
|
||||||
|
|
||||||
@@ -562,6 +569,9 @@
|
|||||||
|
|
||||||
// 生成详细说明文本
|
// 生成详细说明文本
|
||||||
const getDetailInfoText = () => {
|
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 freeMinutes = getFreeMinutes()
|
||||||
const unitMinutes = getBillingUnitMinutes()
|
const unitMinutes = getBillingUnitMinutes()
|
||||||
const depositAmount = deviceInfo.value.depositAmount || '99'
|
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) => {
|
const submitRentOrder = async (payWay) => {
|
||||||
try {
|
try {
|
||||||
|
|||||||
+86
-97
@@ -17,80 +17,25 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 内容区域 -->
|
<!-- 内容区域 -->
|
||||||
<view class="main-content" :style="mainContentStyle">
|
<!-- #ifndef H5 -->
|
||||||
<!-- 全屏地图组件 -->
|
<HomeMainNonH5 ref="mapRef" :mainContentStyle="mainContentStyle" :isLoading="isLoading" :userLocation="userLocation"
|
||||||
<!-- 支付宝小程序使用专用组件 -->
|
:locationPermissionDenied="locationPermissionDenied" :positionList="positionList"
|
||||||
<!-- #ifdef MP-ALIPAY -->
|
:filteredPositions="filteredPositions" :searchKeyword="searchKeyword" :bannerImages="bannerImages"
|
||||||
<MapComponentAlipay v-if="!isLoading && userLocation && !locationPermissionDenied" ref="mapRef"
|
:hideMapOverlays="showGuidePopup || showNoticePopup || showActivityPopup"
|
||||||
:userLocation="userLocation" :positionList="positionList" :filteredPositions="filteredPositions"
|
:locationPermissionText="$t('home.locationPermissionOffTip')" :enableLocationText="$t('home.enableLocation')"
|
||||||
:searchKeyword="searchKeyword" :enableMarkers="true" :bannerImages="bannerImages"
|
:loadingLocationText="$t('common.loadingLocation')" :buyDeviceText="$t('home.buyDevice')"
|
||||||
:hideMapOverlays="showGuidePopup || showNoticePopup || showActivityPopup" @relocate="handleRelocate"
|
:scanText="$t('home.scanToUse')" :personalCenterText="$t('home.personalCenter')" @relocate="handleRelocate"
|
||||||
@scan="handleScan" @showList="showLocationList" @markerTap="selectPosition"
|
@scan="handleScan" @showList="showLocationList" @markerTap="selectPosition" @mapCenterChange="onMapCenterChange"
|
||||||
@mapCenterChange="onMapCenterChange" @bannerClick="handleBannerClick" @guide="openGuidePopup" />
|
@bannerClick="handleBannerClick" @guide="openGuidePopup" @enableLocation="handleEnableLocation" @buy="goToBuy"
|
||||||
<!-- #endif -->
|
@my="goMy" />
|
||||||
<!-- 非支付宝小程序使用通用组件 -->
|
<!-- #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 -->
|
|
||||||
|
|
||||||
<!-- 地图加载状态 -->
|
<!-- #ifdef H5 -->
|
||||||
<!-- #ifdef MP-ALIPAY -->
|
<HomeMainH5 :mainContentStyle="mainContentStyle" :bannerImages="bannerImages" :loadingText="$t('common.loading')"
|
||||||
<view v-if="!userLocation" class="location-denied-placeholder">
|
:buyDeviceText="$t('home.buyDevice')" :scanText="$t('home.scanToUse')"
|
||||||
<view class="denied-content">
|
:personalCenterText="$t('home.personalCenter')" @bannerClick="handleBannerClick" @scan="handleScan"
|
||||||
<text class="denied-text">{{ $t('home.locationPermissionOffTip') }}</text>
|
@buy="goToBuy" @my="goMy" />
|
||||||
<view class="denied-enable-btn" @click="handleEnableLocation">
|
<!-- #endif -->
|
||||||
<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>
|
|
||||||
|
|
||||||
<!-- 场地列表弹窗组件 -->
|
<!-- 场地列表弹窗组件 -->
|
||||||
<LocationListSheet :show="showLocationPopup" :expanded="isExpanded" :positions="filteredPositions"
|
<LocationListSheet :show="showLocationPopup" :expanded="isExpanded" :positions="filteredPositions"
|
||||||
@@ -256,12 +201,8 @@
|
|||||||
calculateDistanceSync,
|
calculateDistanceSync,
|
||||||
testDistanceCalculation
|
testDistanceCalculation
|
||||||
} from '../../utils/mapUtils.js'
|
} from '../../utils/mapUtils.js'
|
||||||
// 同样需要使用相对路径引入组件
|
import HomeMainNonH5 from '../../components/home/HomeMainNonH5.vue'
|
||||||
// 注意:从 pages/index/ 目录访问 components/ 需要使用 ../../components/ 路径
|
import HomeMainH5 from '../../components/home/HomeMainH5.vue'
|
||||||
import MapComponent from '../../components/MapComponent.vue'
|
|
||||||
// #ifdef MP-ALIPAY
|
|
||||||
import MapComponentAlipay from '../../components/MapComponentAlipay.vue'
|
|
||||||
// #endif
|
|
||||||
import LocationListSheet from '../../components/LocationListSheet.vue'
|
import LocationListSheet from '../../components/LocationListSheet.vue'
|
||||||
import {
|
import {
|
||||||
useI18n
|
useI18n
|
||||||
@@ -441,27 +382,40 @@
|
|||||||
appPlatform = 'ali'
|
appPlatform = 'ali'
|
||||||
// #endif
|
// #endif
|
||||||
|
|
||||||
// 调用接口获取广告内容
|
const platformCandidates = []
|
||||||
const res = await getCurrentAdvertisement({
|
if (appPlatform) {
|
||||||
appPlatform: appPlatform, // 微信平台
|
platformCandidates.push(appPlatform)
|
||||||
appType: 'user', // 用户端
|
}
|
||||||
pictureLocation: 'home_banner'
|
// #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) {
|
console.log('首页广告响应:', platform, res)
|
||||||
// 使用 imageList 字段(包含图片和链接信息)
|
|
||||||
const imageList = res.data.imageList || []
|
if (res && res.code === 200 && res.data) {
|
||||||
if (imageList.length > 0) {
|
const imageList = res.data.imageList || []
|
||||||
bannerImageList.value = imageList
|
if (imageList.length > 0) {
|
||||||
// 提取图片URL用于展示
|
bannerImageList.value = imageList
|
||||||
bannerImages.value = imageList.map(item => item.imageUrl)
|
// 提取图片URL用于展示
|
||||||
} else {
|
bannerImages.value = imageList.map(item => item.imageUrl)
|
||||||
console.warn('未获取到广告图片')
|
loaded = true
|
||||||
|
break
|
||||||
|
}
|
||||||
}
|
}
|
||||||
} else {
|
}
|
||||||
console.warn('获取首页广告失败:', res?.msg || '未知错误')
|
|
||||||
|
if (!loaded) {
|
||||||
|
console.warn('未获取到首页广告图片')
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('获取首页广告失败:', error)
|
console.error('获取首页广告失败:', error)
|
||||||
@@ -668,6 +622,11 @@
|
|||||||
getBannerImages()
|
getBannerImages()
|
||||||
])
|
])
|
||||||
|
|
||||||
|
// #ifdef H5
|
||||||
|
// H5 首页不展示地图,跳过定位与附近设备加载
|
||||||
|
return
|
||||||
|
// #endif
|
||||||
|
|
||||||
// 1. 先获取用户位置
|
// 1. 先获取用户位置
|
||||||
await getUserLocationAndAddress()
|
await getUserLocationAndAddress()
|
||||||
|
|
||||||
@@ -1626,6 +1585,36 @@
|
|||||||
box-sizing: border-box;
|
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和通知栏 */
|
/* 顶部Logo和通知栏 */
|
||||||
.header-section {
|
.header-section {
|
||||||
width: 92%;
|
width: 92%;
|
||||||
|
|||||||
@@ -124,6 +124,8 @@
|
|||||||
const deviceInfo = ref(null)
|
const deviceInfo = ref(null)
|
||||||
const passedTotalAmount = ref(null)
|
const passedTotalAmount = ref(null)
|
||||||
const passedDepositAmount = ref(null)
|
const passedDepositAmount = ref(null)
|
||||||
|
const currencyCode = ref('USD')
|
||||||
|
const IDR_DEPOSIT_DISPLAY = 99000
|
||||||
|
|
||||||
// 支付方式相关(微信/支付宝/H5-Antom 多平台)
|
// 支付方式相关(微信/支付宝/H5-Antom 多平台)
|
||||||
const paymentMethods = ref([])
|
const paymentMethods = ref([])
|
||||||
@@ -149,6 +151,9 @@
|
|||||||
})
|
})
|
||||||
|
|
||||||
const totalAmount = computed(() => {
|
const totalAmount = computed(() => {
|
||||||
|
if (currencyCode.value === 'IDR') {
|
||||||
|
return `${IDR_DEPOSIT_DISPLAY}`
|
||||||
|
}
|
||||||
if (passedTotalAmount.value !== null) {
|
if (passedTotalAmount.value !== null) {
|
||||||
return parseFloat(passedTotalAmount.value).toFixed(2);
|
return parseFloat(passedTotalAmount.value).toFixed(2);
|
||||||
}
|
}
|
||||||
@@ -156,7 +161,10 @@
|
|||||||
return deposit.toFixed(2)
|
return deposit.toFixed(2)
|
||||||
})
|
})
|
||||||
|
|
||||||
const currencySymbol = computed(() => 'USD')
|
const currencySymbol = computed(() => {
|
||||||
|
if (currencyCode.value === 'IDR') return 'Rp'
|
||||||
|
return 'USD'
|
||||||
|
})
|
||||||
|
|
||||||
// 加载订单信息
|
// 加载订单信息
|
||||||
const loadOrderInfo = async () => {
|
const loadOrderInfo = async () => {
|
||||||
@@ -244,10 +252,14 @@
|
|||||||
const res = await getDeviceInfo(deviceNo.value);
|
const res = await getDeviceInfo(deviceNo.value);
|
||||||
if (res.code === 200 && res.data) {
|
if (res.code === 200 && res.data) {
|
||||||
deviceInfo.value = res.data.device;
|
deviceInfo.value = res.data.device;
|
||||||
|
currencyCode.value = (res.data?.position?.currency || currencyCode.value || 'USD').toUpperCase()
|
||||||
|
|
||||||
if (deviceInfo.value && deviceInfo.value.depositAmount) {
|
if (deviceInfo.value && deviceInfo.value.depositAmount) {
|
||||||
orderInfo.value.deposit = deviceInfo.value.depositAmount;
|
orderInfo.value.deposit = deviceInfo.value.depositAmount;
|
||||||
}
|
}
|
||||||
|
if (currencyCode.value === 'IDR') {
|
||||||
|
orderInfo.value.deposit = `${IDR_DEPOSIT_DISPLAY}`
|
||||||
|
}
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('获取设备信息失败:', error);
|
console.error('获取设备信息失败:', error);
|
||||||
|
|||||||
@@ -24,6 +24,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 验证码输入 -->
|
<!-- 验证码输入 -->
|
||||||
|
<!-- #ifndef H5 -->
|
||||||
<view class="form-group">
|
<view class="form-group">
|
||||||
<view class="code-input-wrapper">
|
<view class="code-input-wrapper">
|
||||||
<input
|
<input
|
||||||
@@ -38,6 +39,7 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
|
||||||
<!-- 区域提示 -->
|
<!-- 区域提示 -->
|
||||||
<view class="region-notice">
|
<view class="region-notice">
|
||||||
@@ -50,6 +52,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 协议勾选 -->
|
<!-- 协议勾选 -->
|
||||||
|
<!-- #ifndef H5 -->
|
||||||
<view class="agreement-box">
|
<view class="agreement-box">
|
||||||
<checkbox-group @change="onAgreementChange">
|
<checkbox-group @change="onAgreementChange">
|
||||||
<label class="agreement-label">
|
<label class="agreement-label">
|
||||||
@@ -63,6 +66,7 @@
|
|||||||
</label>
|
</label>
|
||||||
</checkbox-group>
|
</checkbox-group>
|
||||||
</view>
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -170,24 +174,29 @@
|
|||||||
// 登录
|
// 登录
|
||||||
const handleLogin = async () => {
|
const handleLogin = async () => {
|
||||||
if (!validatePhone()) return
|
if (!validatePhone()) return
|
||||||
|
|
||||||
|
// #ifndef H5
|
||||||
if (!verifyCode.value) {
|
if (!verifyCode.value) {
|
||||||
uni.showToast({ title: t('auth.codeRequired'), icon: 'none' })
|
uni.showToast({ title: t('auth.codeRequired'), icon: 'none' })
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef H5
|
||||||
if (!isAgreed.value) {
|
if (!isAgreed.value) {
|
||||||
uni.showToast({ title: t('auth.pleaseAgreeToTerms'), icon: 'none' })
|
uni.showToast({ title: t('auth.pleaseAgreeToTerms'), icon: 'none' })
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
// #endif
|
||||||
|
|
||||||
try {
|
try {
|
||||||
uni.showLoading({ title: t('common.loggingIn') })
|
uni.showLoading({ title: t('common.loggingIn') })
|
||||||
const res = await quickLogin({
|
const res = await quickLogin({
|
||||||
loginType: 'SMS',
|
loginType: 'SMS',
|
||||||
appid,
|
appid,
|
||||||
phonenumber: getSubmitPhoneNumber(),
|
phonenumber: getSubmitPhoneNumber(),
|
||||||
smsCode: verifyCode.value
|
// H5 按产品要求不做验证码发送与校验,小程序端保持原流程
|
||||||
|
smsCode: verifyCode.value || ''
|
||||||
})
|
})
|
||||||
|
|
||||||
if (res && res.code !== 200) {
|
if (res && res.code !== 200) {
|
||||||
|
|||||||
Reference in New Issue
Block a user