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

feat(cp排行榜): 碎片不足显示弹窗

Browse Source
This commit is contained in:
hzj 2026-01-19 21:39:17 +08:00
parent 03ea153640
commit a985b45945
3 changed files with 56 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/stores/couple.js
View File

@ -2,6 +2,8 @@ import { defineStore } from 'pinia'
export const useCoupleStore = defineStore('couple', {
state: () => ({
fragmentNotEnoughShow: false, //碎片不足
helpShow: false, //帮助展示
topRewardShow: false, // 前三名奖励展示

8
src/views/Ranking/Couple/GamePlay/components/exchange.vue
View File

@ -93,6 +93,8 @@ const getImgName = (filename) => {
}
const {
debris, // 碎片
fragmentNotEnoughShow, // 碎片不足弹窗
exchangeConfirmShow, // 兑换确认弹窗
exchangeItem, // 当前兑换的物品
} = storeToRefs(coupleStore)
@ -113,6 +115,12 @@ const getActivityResource = async () => {
// 用碎片兑换资源
const exchangeGoods = async (goods) => {
// 碎片不足提示
if (debris.value < JSON.parse(goods.rule.jsonData).need_fragments) {
fragmentNotEnoughShow.value = true
return
}
exchangeItem.value = {
userId: getUserId(),
propsGroupId: goods.rule.id,

54
src/views/Ranking/Couple/index.vue
View File

@ -944,11 +944,15 @@
border: 2px solid #fff;
background: linear-gradient(
264deg,
rgba(220, 228, 255, 0.4) 10.17%,
rgba(151, 176, 255, 0.4) 60.22%,
rgba(220, 228, 255, 0.4) 103.12%
rgba(255, 220, 220, 0.4) 10.17%,
rgba(255, 151, 151, 0.4) 60.22%,
rgba(255, 220, 220, 0.4) 103.12%
);
box-shadow: 0 2.542px 5.084px 0 rgba(151, 176, 255, 0.15);
box-shadow:
0 36.858px 13.981px 0 rgba(255, 106, 106, 0.02),
0 20.335px 12.71px 0 rgba(255, 106, 106, 0.08),
0 8.897px 8.897px 0 rgba(255, 106, 106, 0.13),
0 2.542px 5.084px 0 rgba(255, 106, 106, 0.15);
backdrop-filter: blur(4.5px);
display: flex;
@ -1004,11 +1008,15 @@
border: 2px solid #fff;
background: linear-gradient(
264deg,
rgba(220, 228, 255, 0.4) 10.17%,
rgba(151, 176, 255, 0.4) 60.22%,
rgba(220, 228, 255, 0.4) 103.12%
rgba(255, 220, 220, 0.4) 10.17%,
rgba(255, 151, 151, 0.4) 60.22%,
rgba(255, 220, 220, 0.4) 103.12%
);
box-shadow: 0 2.542px 5.084px 0 rgba(151, 176, 255, 0.15);
box-shadow:
0 36.858px 13.981px 0 rgba(255, 106, 106, 0.02),
0 20.335px 12.71px 0 rgba(255, 106, 106, 0.08),
0 8.897px 8.897px 0 rgba(255, 106, 106, 0.13),
0 2.542px 5.084px 0 rgba(255, 106, 106, 0.15);
backdrop-filter: blur(4.5px);
display: flex;
@ -1186,6 +1194,32 @@
/>
</itemCenter>
</div>
<!-- 碎片不足提示 -->
<div
v-show="fragmentNotEnoughShow"
style="position: fixed; top: 50vh; display: flex; justify-content: center; width: 100vw"
@click.stop
>
<div
style="
width: 60vw;
padding: 2vw;
display: flex;
justify-content: center;
align-items: center;
border-radius: 8px;
background: rgba(255, 255, 255, 0.4);
backdrop-filter: blur(32px);
"
>
<div style="font-size: 0.8em; font-weight: 700; color: #fff">
You don't have enough pieces
</div>
</div>
</div>
</maskLayer>
</div>
</div>
@ -1234,6 +1268,8 @@ const route = useRoute()
const coupleStore = useCoupleStore()
const {
fragmentNotEnoughShow, // 碎片不足提示
helpShow, // 帮助弹窗
topRewardShow, // 前三名奖励展示
@ -1351,6 +1387,7 @@ const isPublic = ref(false) // 是否公开
const confirmShow = ref(false) // 二次确认发送弹窗
const maskLayerShow = computed(() => {
return (
fragmentNotEnoughShow.value ||
helpShow.value ||
topRewardShow.value ||
lastLetterShow.value ||
@ -1397,6 +1434,7 @@ const showPopup = (type) => {
// 关闭弹窗
const closedPopup = () => {
fragmentNotEnoughShow.value = false
helpShow.value = false
topRewardShow.value = false
lastLetterShow.value = false