优化游戏页面图片展示逻辑,使用 machineId 动态生成图片链接,简化资产管理

This commit is contained in:
zyh
2025-08-30 00:37:24 +08:00
parent f892aec86f
commit a2edb52f56
2 changed files with 18 additions and 36 deletions

View File

@@ -18,23 +18,22 @@
<div class="status-message" :class="statusMessageClass">
{{ statusMessage }}
</div>
<!-- 游戏截图展示区域 -->
<div class="image-gallery">
<div class="image-item" v-if="assets?.homepageUrl">
<img :src="assets.homepageUrl" alt="首次主页" class="game-image" />
<div class="image-item" v-if="machineId">
<img :src="`https://2.uzi0.cc/image/${machineId}/首次主页.png`" alt="首次主页" class="game-image" />
<div class="image-label">首次主页</div>
</div>
<div class="image-item" v-if="assets?.firstRewardUrl">
<img :src="assets.firstRewardUrl" alt="首次赏金" class="game-image" style="transform: rotate(-90deg);" />
<div class="image-item" v-if="machineId">
<img :src="`https://2.uzi0.cc/image/${machineId}/首次赏金.png`" alt="首次赏金" class="game-image" style="transform: rotate(-90deg);" />
<div class="image-label">首次赏金</div>
</div>
<div class="image-item" v-if="assets?.midRewardUrl">
<img :src="assets.midRewardUrl" alt="中途赏金" class="game-image" />
<div class="image-item" v-if="machineId">
<img :src="`https://2.uzi0.cc/image/${machineId}/中途赏金.png`" alt="中途赏金" class="game-image" />
<div class="image-label">中途赏金</div>
</div>
<div class="image-item" v-if="assets?.endRewardUrl">
<img :src="assets.endRewardUrl" alt="结束赏金" class="game-image" />
<div class="image-item" v-if="machineId">
<img :src="`https://2.uzi0.cc/image/${machineId}/结束赏金.png`" alt="结束赏金" class="game-image" />
<div class="image-label">结束赏金</div>
</div>
</div>

View File

@@ -79,24 +79,9 @@ export function usePlayState() {
state.status = 'LOGGED_IN'
if(gameData.status == "COMPLETED"){
state.assets = {
homepageUrl: gameData.homepageUrl,
firstRewardUrl: gameData.firstRewardUrl,
midRewardUrl: gameData.midRewardUrl,
endRewardUrl: gameData.endRewardUrl,
qrCodeUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/二维码.png?t=${new Date().getTime()}` : null,
...(gameData.assets || {})
}
} else {
state.assets = {
homepageUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/首次主页.png?t=${new Date().getTime()}` : null,
firstRewardUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/首次赏金.png?t=${new Date().getTime()}` : null,
midRewardUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/中途赏金.png?t=${new Date().getTime()}` : null,
endRewardUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/结束赏金.png?t=${new Date().getTime()}` : null,
qrCodeUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/二维码.png?t=${new Date().getTime()}` : null,
...(gameData.assets || {})
}
state.assets = {
qrCodeUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/二维码.png?t=${new Date().getTime()}` : null,
...(gameData.assets || {})
}
console.log('更新区域信息:', {
@@ -174,10 +159,6 @@ export function usePlayState() {
}
state.assets = {
homepageUrl: gameData.homepageUrl,
firstRewardUrl: gameData.firstRewardUrl,
midRewardUrl: gameData.midRewardUrl,
endRewardUrl: gameData.endRewardUrl,
qrCodeUrl: gameData.mecmachineId ? `https://2.uzi0.cc/image/${gameData.mecmachineId}/二维码.png?t=${Date.now()}` : null
}
@@ -401,17 +382,19 @@ export function usePlayState() {
}
const getCurrentGameImage = () => {
if (!state.assets) return null
if (!state.machineId) return null
const progress = getProgressPercent()
const baseUrl = 'https://2.uzi0.cc/image'
if (progress === 0) {
return state.assets.homepageUrl
return `${baseUrl}/${state.machineId}/首次主页.png`
} else if (progress < 50) {
return state.assets.firstRewardUrl
return `${baseUrl}/${state.machineId}/首次赏金.png`
} else if (progress < 100) {
return state.assets.midRewardUrl
return `${baseUrl}/${state.machineId}/中途赏金.png`
} else {
return state.assets.endRewardUrl
return `${baseUrl}/${state.machineId}/结束赏金.png`
}
}