hy/aslan-h5
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(游戏活动页): 优化切换按钮的展示方式

Browse Source
This commit is contained in:
hzj 2025-12-02 17:02:31 +08:00
parent acee64344e
commit 22bd6a106d
1 changed files with 80 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
src/views/Activities/Game/index.vue
View File

@ -50,39 +50,91 @@
v-if="currentLangType == 'en'"
style="display: flex; justify-content: space-around; margin-top: 2vw"
>
<img
v-smart-img
:src="rankingShow ? imageUrl('rankingBtActive') : imageUrl('rankingBt')"
alt=""
style="display: block; width: 40%"
@click="rankingShow = true"
/>
<img
v-smart-img
:src="!rankingShow ? imageUrl('rewardBtActive') : imageUrl('rewardsBt')"
alt=""
style="display: block; width: 40%"
@click="rankingShow = false"
/>
<!-- 排行榜按钮 -->
<div style="width: 40%; position: relative">
<img
v-smart-img
:src="imageUrl('rankingBt')"
alt=""
style="display: block; width: 100%"
:style="{ opacity: rankingShow ? 0 : 1 }"
@click="rankingShow = true"
/>
<img
v-smart-img
:src="imageUrl('rankingBtActive')"
alt=""
style="display: block; width: 100%; position: absolute; top: 0; left: 0"
:style="{ opacity: rankingShow ? 1 : 0 }"
@click="rankingShow = true"
/>
</div>
<!-- 奖励按钮 -->
<div style="width: 40%; position: relative">
<img
v-smart-img
:src="imageUrl('rewardsBt')"
alt=""
style="display: block; width: 100%"
:style="{ opacity: rankingShow ? 1 : 0 }"
@click="rankingShow = false"
/>
<img
v-smart-img
:src="imageUrl('rewardBtActive')"
alt=""
style="display: block; width: 100%; position: absolute; top: 0; left: 0"
:style="{ opacity: rankingShow ? 0 : 1 }"
@click="rankingShow = false"
/>
</div>
</div>
<!-- 阿拉伯语版本 -->
<div
v-if="currentLangType == 'ar'"
style="display: flex; justify-content: space-around; margin-top: 2vw"
>
<img
v-smart-img
:src="rankingShow ? imageUrl('rankingBtActiveAr') : imageUrl('rankingBtAr')"
alt=""
style="display: block; width: 40%"
@click="rankingShow = true"
/>
<img
v-smart-img
:src="!rankingShow ? imageUrl('rewardBtActiveAr') : imageUrl('rewardsBtAr')"
alt=""
style="display: block; width: 40%"
@click="rankingShow = false"
/>
<!-- 排行榜按钮 -->
<div style="width: 40%; position: relative">
<img
v-smart-img
:src="imageUrl('rankingBtAr')"
alt=""
style="display: block; width: 100%"
:style="{ opacity: rankingShow ? 0 : 1 }"
@click="rankingShow = true"
/>
<img
v-smart-img
:src="imageUrl('rankingBtActiveAr')"
alt=""
style="display: block; width: 100%; position: absolute; top: 0; left: 0"
:style="{ opacity: rankingShow ? 1 : 0 }"
@click="rankingShow = true"
/>
</div>
<!-- 奖励按钮 -->
<div style="width: 40%; position: relative">
<img
v-smart-img
:src="imageUrl('rewardsBtAr')"
alt=""
style="display: block; width: 100%"
:style="{ opacity: rankingShow ? 1 : 0 }"
@click="rankingShow = false"
/>
<img
v-smart-img
:src="imageUrl('rewardBtActiveAr')"
alt=""
style="display: block; width: 100%; position: absolute; top: 0; left: 0"
:style="{ opacity: rankingShow ? 0 : 1 }"
@click="rankingShow = false"
/>
</div>
</div>
</div>