完善原生内容卡与H5详情分工

This commit is contained in:
2026-03-27 21:03:55 +08:00
parent 0e0a724025
commit 0703fd47a2
21 changed files with 903 additions and 83 deletions

View File

@@ -800,8 +800,11 @@ Page({
punchFeedbackText: '',
punchFeedbackTone: 'neutral',
contentCardVisible: false,
contentCardTemplate: 'story',
contentCardTitle: '',
contentCardBody: '',
contentCardActionVisible: false,
contentCardActionText: '查看详情',
punchButtonFxClass: '',
panelProgressFxClass: '',
panelDistanceFxClass: '',
@@ -1117,8 +1120,11 @@ Page({
punchFeedbackText: '',
punchFeedbackTone: 'neutral',
contentCardVisible: false,
contentCardTemplate: 'story',
contentCardTitle: '',
contentCardBody: '',
contentCardActionVisible: false,
contentCardActionText: '查看详情',
punchButtonFxClass: '',
panelProgressFxClass: '',
panelDistanceFxClass: '',
@@ -1903,6 +1909,19 @@ Page({
}
},
handleOpenContentCardDetail() {
if (mapEngine) {
wx.showToast({
title: '打开详情',
icon: 'none',
duration: 900,
})
mapEngine.openCurrentContentCardDetail()
}
},
handleContentCardTap() {},
openH5Experience(request: H5ExperienceRequest) {
wx.navigateTo({
url: '/pages/experience-webview/experience-webview',

View File

@@ -29,13 +29,6 @@
<view class="map-stage__stage-fx {{stageFxClass}}" wx:if="{{stageFxVisible}}"></view>
<view class="game-punch-feedback game-punch-feedback--{{punchFeedbackTone}} {{punchFeedbackFxClass}}" wx:if="{{punchFeedbackVisible}}">{{punchFeedbackText}}</view>
<view class="game-content-card {{contentCardFxClass}}" wx:if="{{contentCardVisible}}" bindtap="handleCloseContentCard">
<view class="game-content-card__title">{{contentCardTitle}}</view>
<view class="game-content-card__body">{{contentCardBody}}</view>
<view class="game-content-card__hint">点击关闭</view>
</view>
<view class="map-stage__overlay-center-layer" wx:if="{{!showDebugPanel && !showGameInfoPanel && !showResultScene && !showSystemSettingsPanel}}">
<view class="center-scale-ruler" wx:if="{{centerScaleRulerVisible}}" style="left: {{centerScaleRulerCenterXPx}}px; top: {{centerScaleRulerZeroYPx}}px; height: {{centerScaleRulerHeightPx}}px;">
<view class="center-scale-ruler__axis" style="bottom: {{centerScaleRulerAxisBottomPx}}px;"></view>
@@ -80,6 +73,23 @@
</view>
</view>
<view
class="game-content-card game-content-card--{{contentCardTemplate}} {{contentCardFxClass}}"
wx:if="{{contentCardVisible}}"
catchtap="handleContentCardTap"
>
<view class="game-content-card__title">{{contentCardTitle}}</view>
<view class="game-content-card__body">{{contentCardBody}}</view>
<view class="game-content-card__action-row {{contentCardActionVisible ? 'game-content-card__action-row--split' : ''}}">
<view
wx:if="{{contentCardActionVisible}}"
class="game-content-card__action"
catchtap="handleOpenContentCardDetail"
>{{contentCardActionText}}</view>
<view class="game-content-card__close" catchtap="handleCloseContentCard">关闭</view>
</view>
</view>
<view class="game-punch-hint" wx:if="{{!showResultScene && showPunchHintBanner && punchHintText}}" style="top: {{topInsetHeight}}px;" catchtouchstart="handlePunchHintTap" catchtouchmove="handlePunchHintTap" catchtouchend="handlePunchHintTap">
<view class="game-punch-hint__text">{{punchHintText}}</view>
<view class="game-punch-hint__close" catchtouchstart="handlePunchHintTap" catchtouchmove="handlePunchHintTap" catchtouchend="handlePunchHintTap" catchtap="handleClosePunchHint">×</view>

View File

@@ -2003,7 +2003,24 @@
background: rgba(248, 251, 244, 0.96);
box-shadow: 0 18rpx 48rpx rgba(22, 48, 32, 0.18);
box-sizing: border-box;
z-index: 17;
z-index: 33;
pointer-events: auto;
}
.game-content-card--minimal {
width: 396rpx;
padding: 24rpx 24rpx 20rpx;
border-radius: 24rpx;
background: rgba(248, 251, 244, 0.94);
}
.game-content-card--focus {
width: 468rpx;
padding: 30rpx 30rpx 26rpx;
border-radius: 30rpx;
background: linear-gradient(180deg, rgba(240, 248, 241, 0.98), rgba(248, 251, 244, 0.96));
box-shadow: 0 22rpx 54rpx rgba(22, 48, 32, 0.2);
border: 2rpx solid rgba(92, 139, 109, 0.14);
}
.game-content-card__title {
@@ -2013,6 +2030,15 @@
color: #163020;
}
.game-content-card--minimal .game-content-card__title {
font-size: 30rpx;
}
.game-content-card--focus .game-content-card__title {
font-size: 36rpx;
color: #103020;
}
.game-content-card__body {
margin-top: 12rpx;
font-size: 24rpx;
@@ -2020,10 +2046,52 @@
color: #45624b;
}
.game-content-card__hint {
margin-top: 16rpx;
font-size: 20rpx;
color: #809284;
.game-content-card--minimal .game-content-card__body {
margin-top: 10rpx;
font-size: 22rpx;
}
.game-content-card--focus .game-content-card__body {
margin-top: 14rpx;
color: #3f5f49;
}
.game-content-card__action-row {
margin-top: 18rpx;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 16rpx;
}
.game-content-card__action-row--split {
justify-content: space-between;
}
.game-content-card__action {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 56rpx;
padding: 0 22rpx;
border-radius: 999rpx;
background: rgba(25, 78, 47, 0.1);
color: #18472d;
font-size: 22rpx;
font-weight: 700;
}
.game-content-card__close {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 56rpx;
padding: 0 22rpx;
border-radius: 999rpx;
background: rgba(16, 32, 20, 0.06);
color: #5a685f;
font-size: 22rpx;
font-weight: 600;
}
.game-content-card--fx-pop {