优化游戏页面进度显示逻辑,新增剩余积分计算和展示格式选择,提升用户体验

This commit is contained in:
yahaozhang
2025-09-15 14:58:46 +08:00
parent e0b644b2d5
commit d32738631a
3 changed files with 27 additions and 1 deletions

View File

@@ -9,7 +9,9 @@
<div class="tab-header"> <div class="tab-header">
<div class="tab-item active">{{ regionDesc || (region === 'Q' ? 'QQ区' : region === 'V' ? '微信区' : region) }}</div> <div class="tab-item active">{{ regionDesc || (region === 'Q' ? 'QQ区' : region === 'V' ? '微信区' : region) }}</div>
<div class="tab-item status-tab">{{ displayStatus }}</div> <div class="tab-item status-tab">{{ displayStatus }}</div>
<div class="tab-item target-tab">{{ completedPoints || 0 }}/{{ totalPoints || 0 }}</div> <div class="tab-item target-tab" v-if="progressDisplayFormat === '1'">{{ completedPoints || 0 }}/{{ totalPoints || 0 }}</div>
<div class="tab-item target-tab" v-else>{{ remainingPoints }}</div>
</div> </div>
@@ -93,6 +95,10 @@ export default {
codeNo: { codeNo: {
type: String, type: String,
default: null default: null
},
progressDisplayFormat: {
type: String,
default: '1'
} }
}, },
data() { data() {
@@ -100,6 +106,14 @@ export default {
timestamp: Date.now() timestamp: Date.now()
} }
}, },
computed: {
remainingPoints() {
const total = this.totalPoints || 0
const completed = this.completedPoints || 0
const diff = total - completed
return diff > 0 ? diff : 0
}
},
mounted() { mounted() {
this.setupImageRefresh() this.setupImageRefresh()
}, },

View File

@@ -25,6 +25,7 @@ export function usePlayState() {
currentPoints: 0, currentPoints: 0,
totalPoints: 1000, totalPoints: 1000,
completedPoints: 0, completedPoints: 0,
progressDisplayFormat: '1',
error: null, error: null,
qrDelaySeconds: 0, qrDelaySeconds: 0,
isWaitingQr: false, isWaitingQr: false,
@@ -114,6 +115,9 @@ export function usePlayState() {
} }
state.completedPoints = gameData.completedPoints || 0 state.completedPoints = gameData.completedPoints || 0
if (gameData.progressDisplayFormat) {
state.progressDisplayFormat = String(gameData.progressDisplayFormat)
}
state.currentPoints = 0 state.currentPoints = 0
console.log('handleLoggedInStatus 执行完成,最终状态:', { console.log('handleLoggedInStatus 执行完成,最终状态:', {
@@ -164,6 +168,9 @@ export function usePlayState() {
state.totalPoints = gameData.totalPoints || 50 state.totalPoints = gameData.totalPoints || 50
state.completedPoints = gameData.completedPoints || state.totalPoints state.completedPoints = gameData.completedPoints || state.totalPoints
if (gameData.progressDisplayFormat) {
state.progressDisplayFormat = String(gameData.progressDisplayFormat)
}
state.currentPoints = state.totalPoints state.currentPoints = state.totalPoints
console.log('已完成状态更新完成:', { console.log('已完成状态更新完成:', {
@@ -207,6 +214,10 @@ export function usePlayState() {
if (data.completedPoints !== undefined) { if (data.completedPoints !== undefined) {
state.completedPoints = data.completedPoints state.completedPoints = data.completedPoints
} }
if (data.progressDisplayFormat) {
state.progressDisplayFormat = String(data.progressDisplayFormat)
}
if (data.assets && data.assets.totalPoints) { if (data.assets && data.assets.totalPoints) {
state.totalPoints = data.assets.totalPoints state.totalPoints = data.assets.totalPoints

View File

@@ -38,6 +38,7 @@
:display-status="getDisplayStatus()" :display-status="getDisplayStatus()"
:completed-points="state.completedPoints" :completed-points="state.completedPoints"
:total-points="state.totalPoints" :total-points="state.totalPoints"
:progress-display-format="state.progressDisplayFormat"
:status-message="getStatusMessage()" :status-message="getStatusMessage()"
:status-message-class="getStatusMessageClass()" :status-message-class="getStatusMessageClass()"
:assets="state.assets" :assets="state.assets"