diff --git a/src/views/choujiang/index.vue b/src/views/choujiang/index.vue index 0cddadf..27bde43 100644 --- a/src/views/choujiang/index.vue +++ b/src/views/choujiang/index.vue @@ -159,7 +159,7 @@ async function handleLotteryClick() { break; case "ready": - if (waitingForNextReveal.value) { + if (waitingForNextReveal.value || lastRevealed.value === 0) { console.log("waitingForNextReveal.value", waitingForNextReveal.value); // 显示弹窗提示 showPrizeExhaustedModal.value = true; diff --git a/src/views/choujiang/lottery/PrizePanel.vue b/src/views/choujiang/lottery/PrizePanel.vue index 6ae470b..7d6b596 100644 --- a/src/views/choujiang/lottery/PrizePanel.vue +++ b/src/views/choujiang/lottery/PrizePanel.vue @@ -51,14 +51,11 @@ /> - + +
@@ -289,9 +286,7 @@ console.log("fakeWinners", fakeWinners.value); import { getGetPrizeUserListApi } from "../../../api/API"; const updateWinners = async () => { try { - const response = await getGetPrizeUserListApi({ - - }); + const response = await getGetPrizeUserListApi({}); console.log("updatePrizeList response", response); fakeWinners.value = response.data.list; console.log("updateWinners fakeWinners", fakeWinners.value); @@ -394,7 +389,7 @@ function getProgressPercent(prize) { background: none; z-index: 10; min-width: 300px; - max-width: 342px; + max-width: 362px; text-align: left; display: flex; flex-direction: column; @@ -403,6 +398,7 @@ function getProgressPercent(prize) { overflow-x: hidden !important; overflow-y: auto; padding-right: 10px; + padding-left: 10px; scrollbar-width: thin; scrollbar-color: #ffd283 rgba(255, 210, 131, 0.3); /* Firefox */ } @@ -412,6 +408,8 @@ function getProgressPercent(prize) { z-index: 10; min-width: 320px; max-width: 342px; + padding-right: 10px; + padding-left: 10px; text-align: left; display: flex; } @@ -490,17 +488,10 @@ function getProgressPercent(prize) { color: #d84315; font-weight: 500; } -/* .prize-row-bottom { - background: linear-gradient(90deg, #ff9800 0%, #ff5722 100%); - background: #8a3500; - border-radius: 16px; - color: #fff; - font-size: 20px; - font-weight: bold; - padding: 2px 0 2px 0; - justify-content: center; - min-width: 80px; -} */ +.prize-row-bottom { + /* margin-bottom: 8px; */ + /* border: 1px solid #ea2b0a; */ +} .custom-arrow-icon { font-size: 24px; /* 图标大小 */ color: #d84315; /* 图标颜色,使用项目主题橙色 */ @@ -531,14 +522,14 @@ function getProgressPercent(prize) { background: none; z-index: 10; min-width: 320px; - max-width: 342px; + max-width: 362px; display: flex; flex-direction: column; } .prize-panel-footer { position: relative; - width: 100%; + /* width: 100%; */ display: flex; flex-direction: column; align-items: center; @@ -654,8 +645,8 @@ function getProgressPercent(prize) { } .progress-bar-bg { position: relative; - width: 220px; - height: 28px; + width: 228px; + height: 30px; background: #e9620e; border-radius: 16px; overflow: hidden; @@ -668,6 +659,7 @@ function getProgressPercent(prize) { position: absolute; left: 0; top: 0; + /* width: 100%; */ height: 100%; /* background: linear-gradient(90deg, #ff9800 0%, #8a3500 100%); */ background: #8a3500; @@ -708,9 +700,14 @@ function getProgressPercent(prize) { .prize-panel-item.revealed-highlight { /* border: 3px solid #ff9800; */ box-shadow: 0 0 16px 4px #ff9800aa; - transform: scale(1.05); + transform: scale(1.03); z-index: 2; transition: all 0.3s; + /* 确保放大的元素不被遮挡 */ + position: relative; + /* margin: 8px 0; */ + /* 为放大的元素留出空间 */ + transform-origin: center center; } .prize-panel-item.disabled {