|
@ -48,18 +48,11 @@ |
|
|
/> |
|
|
/> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div></div> |
|
|
|
|
|
<div></div> |
|
|
|
|
|
<div></div> |
|
|
|
|
|
<div></div> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
<div class="prize-panel-footer"> |
|
|
<div class="prize-panel-footer"> |
|
|
<div class="arrow-up" @click="openWinnerList"></div> |
|
|
<div class="arrow-up" @click="openWinnerList"></div> |
|
|
<button |
|
|
|
|
|
ref="winnerBtnRef" |
|
|
|
|
|
class="winner-btn" |
|
|
|
|
|
@click="toggleWinnerList" |
|
|
|
|
|
> |
|
|
|
|
|
|
|
|
<button ref="winnerBtnRef" class="winner-btn" @click="toggleWinnerList"> |
|
|
获奖名单 |
|
|
获奖名单 |
|
|
</button> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
@ -277,9 +270,7 @@ console.log("fakeWinners", fakeWinners.value); |
|
|
import { getGetPrizeUserListApi } from "../../../api/API"; |
|
|
import { getGetPrizeUserListApi } from "../../../api/API"; |
|
|
const updateWinners = async () => { |
|
|
const updateWinners = async () => { |
|
|
try { |
|
|
try { |
|
|
const response = await getGetPrizeUserListApi({ |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
const response = await getGetPrizeUserListApi({}); |
|
|
console.log("updatePrizeList response", response); |
|
|
console.log("updatePrizeList response", response); |
|
|
fakeWinners.value = response.data.list; |
|
|
fakeWinners.value = response.data.list; |
|
|
console.log("updateWinners fakeWinners", fakeWinners.value); |
|
|
console.log("updateWinners fakeWinners", fakeWinners.value); |
|
@ -373,7 +364,7 @@ function getProgressPercent(prize) { |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
flex-direction: column; |
|
|
gap: 18px; |
|
|
gap: 18px; |
|
|
height: 700px; |
|
|
|
|
|
|
|
|
max-height: 700px; |
|
|
overflow-x: hidden !important; |
|
|
overflow-x: hidden !important; |
|
|
overflow-y: auto; |
|
|
overflow-y: auto; |
|
|
padding-right: 10px; |
|
|
padding-right: 10px; |
|
@ -387,6 +378,8 @@ function getProgressPercent(prize) { |
|
|
z-index: 10; |
|
|
z-index: 10; |
|
|
min-width: 320px; |
|
|
min-width: 320px; |
|
|
max-width: 342px; |
|
|
max-width: 342px; |
|
|
|
|
|
padding-right: 10px; |
|
|
|
|
|
padding-left: 10px; |
|
|
text-align: left; |
|
|
text-align: left; |
|
|
display: flex; |
|
|
display: flex; |
|
|
} |
|
|
} |
|
@ -465,17 +458,10 @@ function getProgressPercent(prize) { |
|
|
color: #d84315; |
|
|
color: #d84315; |
|
|
font-weight: 500; |
|
|
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 { |
|
|
.custom-arrow-icon { |
|
|
font-size: 24px; /* 图标大小 */ |
|
|
font-size: 24px; /* 图标大小 */ |
|
|
color: #d84315; /* 图标颜色,使用项目主题橙色 */ |
|
|
color: #d84315; /* 图标颜色,使用项目主题橙色 */ |
|
@ -513,7 +499,7 @@ function getProgressPercent(prize) { |
|
|
|
|
|
|
|
|
.prize-panel-footer { |
|
|
.prize-panel-footer { |
|
|
position: relative; |
|
|
position: relative; |
|
|
width: 100%; |
|
|
|
|
|
|
|
|
/* width: 100%; */ |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
flex-direction: column; |
|
|
align-items: center; |
|
|
align-items: center; |
|
@ -629,8 +615,8 @@ function getProgressPercent(prize) { |
|
|
} |
|
|
} |
|
|
.progress-bar-bg { |
|
|
.progress-bar-bg { |
|
|
position: relative; |
|
|
position: relative; |
|
|
width: 220px; |
|
|
|
|
|
height: 28px; |
|
|
|
|
|
|
|
|
width: 228px; |
|
|
|
|
|
height: 30px; |
|
|
background: #e9620e; |
|
|
background: #e9620e; |
|
|
border-radius: 16px; |
|
|
border-radius: 16px; |
|
|
overflow: hidden; |
|
|
overflow: hidden; |
|
@ -643,6 +629,7 @@ function getProgressPercent(prize) { |
|
|
position: absolute; |
|
|
position: absolute; |
|
|
left: 0; |
|
|
left: 0; |
|
|
top: 0; |
|
|
top: 0; |
|
|
|
|
|
/* width: 100%; */ |
|
|
height: 100%; |
|
|
height: 100%; |
|
|
/* background: linear-gradient(90deg, #ff9800 0%, #8a3500 100%); */ |
|
|
/* background: linear-gradient(90deg, #ff9800 0%, #8a3500 100%); */ |
|
|
background: #8a3500; |
|
|
background: #8a3500; |
|
|