feat(新年活动): 完善页面功能

src/api/lottery.js

@@ -71,9 +71,9 @@ export const activityDetail = async (activityCode) => {
 }
 
 // 获取充值记录
-export const myRecharge = async () => {
+export const myRecharge = async (activityId) => {
   try {
-    const response = await get(`/activity/lottery/my-recharge`)
+    const response = await get(`/activity/lottery/my-recharge?activityId=${activityId}`)
     return response
   } catch (error) {
     console.error('Failed to fetch get my recharge:', error)

src/views/Activities/NewYear/components/topUser.vue

@@ -73,13 +73,6 @@
             height: distributionValueHeight,
           }"
         >
-          <img
-            v-smart-img
-            src="/src/assets/icon/coin.png"
-            alt=""
-            style="display: block"
-            :style="{ width: coinWidth }"
-          />
           <div
             style="font-weight: 590"
             class="showText"
@@ -88,7 +81,7 @@
               color: ranking == '1' ? `#FFE601` : '#FFF',
             }"
           >
-            {{ distributionValue }}
+            ${{ distributionValue }}
           </div>
         </div>
       </div>

src/views/Activities/NewYear/index.vue

@@ -12,7 +12,7 @@
       <div class="bg-layer">
         <img
           v-smart-img
-          v-for="(value, index) in 7"
+          v-for="(value, index) in 4"
           :src="imageUrl(`bg${index}`)"
           alt=""
           class="bg-image"
@@ -53,13 +53,13 @@
             </div>
           </div>
 
-          <!-- 帮助按钮 -->
+          <!-- 规则按钮 -->
           <img
             v-smart-img
             :src="imageUrl(getImgName('helpBt'))"
             alt=""
             style="display: block; width: 25vw"
-            @click="helpShow = true"
+            @click="ruleShow = true"
           />
         </div>
 
@@ -412,7 +412,7 @@
               v-for="(listItem, index) in showRanking"
               :key="listItem.userId"
               :imgUrl="imageUrl('RankingItem')"
-              :contentStyle="`padding: 0 13%`"
+              :contentStyle="`padding: 0 9%`"
               :lazy="true"
               :immediate="index < 2"
               @click="viewUserInfo(listItem.userId)"
@@ -481,14 +481,8 @@
                   align-items: center;
                 "
               >
-                <img
-                  v-smart-img
-                  src="/src/assets/icon/coin.png"
-                  alt=""
-                  style="display: block; width: 1.5em; aspect-ratio: 1/1; object-fit: cover"
-                />
                 <div style="color: #ffe601; font-weight: 700" class="UserNickname">
-                  {{ listItem?.amount }}
+                  ${{ listItem?.amount }}
                 </div>
               </div>
             </itemCenter>
@@ -540,13 +534,13 @@
                 "
                 :style="[getGridPosition(index)]"
               >
-                <img
+                <!-- <img
                   v-smart-img
                   :src="prize.prizeImage || ''"
                   :alt="prize.prizeName || ''"
                   width="60%"
                   style="display: block"
-                />
+                /> -->
                 <!-- <div style="font-size: 0.8em">{{ prize.prizeName }}</div> -->
 
                 <!-- 转到的奖品项 -->
@@ -603,7 +597,7 @@
               margin: -80vw 4vw 0;
               display: flex;
               flex-direction: column;
-              gap: 4vw;
+              gap: 2vw;
               padding: 12px;
               border-radius: 12px;
               background: linear-gradient(
@@ -646,17 +640,17 @@
           >
             <div style="display: flex; justify-content: space-between; align-items: center">
               <div style="font-size: 1.2em; font-weight: 700">
-                Total Spins:({{ totalDraw?.usedCount || 0 }}/100)
+                Total Tickets:({{ totalDraw?.usedCount || 0 }}/100)
               </div>
             </div>
-            <div style="display: flex; justify-content: space-between; align-items: center">
+            <div style="display: flex; align-items: center; gap: 4vw">
-              <div>Lucky Dollars Medal*permanent</div>
               <img
                 v-smart-img
-                src="/src/assets/icon/arrowWhite.png"
+                :src="imageUrl('LuckyDollarsMedal')"
                 alt=""
-                style="display: block; width: 5vw"
+                style="display: block; width: 18vw"
               />
+              <div>Lucky Dollars Medal*permanent</div>
             </div>
           </div>
 
@@ -715,9 +709,19 @@
               v-for="task in taskList"
               style="
                 border-radius: 12px;
-                background: rgba(255, 255, 255, 0.2);
+                border: 2px solid #fff;
-                box-shadow: 0 0 4px 0 rgba(1, 255, 39, 0.25);
+                background: linear-gradient(
-                backdrop-filter: blur(32px);
+                  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%
+                );
+                box-shadow: 0 36.858px 13.981px 0 rgba(151, 176, 255, 0.02),
+                  0 20.335px 12.71px 0 rgba(151, 176, 255, 0.08),
+                  0 8.897px 8.897px 0 rgba(151, 176, 255, 0.13),
+                  0 2.542px 5.084px 0 rgba(151, 176, 255, 0.15);
+                backdrop-filter: blur(4.5px);
+
                 display: flex;
                 padding: 8px;
                 justify-content: space-between;
@@ -762,18 +766,14 @@
 
               <!-- 内容 -->
               <div style="width: 60%">
-                <div>
+                <!-- 任务进度 -->
-                  <div
+                <div style="color: #fff; font-weight: 590; font-size: 0.9em">
-                    v-if="task.taskType == 1"
+                  {{ showTarget(task) }}
-                    style="color: rgba(0, 0, 0, 0.8); font-weight: 590"
-                  >
-                    {{ showTarget(task) }}
-                  </div>
-                  <div v-else style="color: rgba(0, 0, 0, 0.8); font-weight: 590">
-                    {{ task.taskName }}
-                  </div>
                 </div>
+
+                <!-- 任务奖励 -->
                 <div style="display: flex; align-items: center; gap: 8px">
+                  <div style="color: #fff; font-weight: 590">Rewards:</div>
                   <img
                     v-smart-img
                     :src="imageUrl('ticket')"
@@ -781,7 +781,7 @@
                     width="15%"
                     style="display: block"
                   />
-                  <div style="color: #2f0; font-weight: 590">*{{ task.rewardValue }}</div>
+                  <div style="color: #fff; font-weight: 590">*{{ task.rewardValue }}</div>
                 </div>
               </div>
 
@@ -905,13 +905,13 @@
                 gap: 4px;
               "
             >
-              <!-- 规则按钮 -->
+              <!-- 帮助按钮 -->
               <img
                 v-smart-img
                 src="/src/assets/icon/helpWhite.png"
                 alt=""
                 class="ruleBt"
-                @click="ruleShow = true"
+                @click="helpShow = true"
               />
               <!-- 名称 -->
               <div
@@ -1304,15 +1304,7 @@
             align-items: center;
           "
         >
-          <img
+          <div style="color: #ffe601; font-weight: 700">${{ myRanking?.amount || 0 }}</div>
-            v-smart-img
-            src="/src/assets/icon/coin.png"
-            alt=""
-            style="display: block; width: 1.5em; aspect-ratio: 1/1; object-fit: cover"
-          />
-          <div style="color: #ffe601; font-weight: 700">
-            {{ myRanking?.amount || 0 }}
-          </div>
         </div>
       </itemCenter>
 
@@ -1743,19 +1735,27 @@ const taskList = ref([])
 
 // 展示任务目标
 const showTarget = (task) => {
-  let timeType = task.targetValue < 60
+  if (task.targetType == 'MIC_TIME') {
-  let currentValue = timeType ? task.currentValue : task.currentValue / 60
+    let timeType = task.targetValue < 60
-  let targetValue = timeType ? task.targetValue : task.targetValue / 60
+    let currentValue = timeType ? task.currentValue : task.currentValue / 60
-  // 直接去除小数部分（向下取整）
+    let targetValue = timeType ? task.targetValue : task.targetValue / 60
-  currentValue = Math.floor(currentValue)
+    // 直接去除小数部分（向下取整）
-  targetValue = Math.floor(targetValue)
+    currentValue = Math.floor(currentValue)
-  let timeUnit = timeType ? t('minutes_short') : t('hours_short')
+    targetValue = Math.floor(targetValue)
+    let timeUnit = timeType ? t('minutes_short') : t('hours_short')
 
-  return t('on_mic_progress', {
+    return t('on_mic_progress', {
-    current: currentValue,
+      current: currentValue,
-    total: targetValue,
+      total: targetValue,
-    unit: timeUnit,
+      unit: timeUnit,
-  })
+    })
+  } else if (task.targetType == 'SEND_GIFT') {
+    return `${task.taskName}(${task.currentValue}/${task.targetValue})`
+  } else if (task.targetType == 'SPEND_COINS') {
+    return `${task.taskName}(${task.currentValue}/${task.targetValue})`
+  } else if (task.targetType == 'RECHARGE_AMOUNT') {
+    return `${task.taskName}(${task.currentValue}/${task.targetValue})`
+  }
 }
 
 // 选中的收款人
@@ -2076,7 +2076,7 @@ const getActivityDetail = async () => {
 
 //获取充值记录
 const getMyRecharge = async () => {
-  const resMyRecharge = await myRecharge()
+  const resMyRecharge = await myRecharge('2005571533988298753')
   if (resMyRecharge.status && resMyRecharge.body) {
     myRechargeRecode.value = resMyRecharge.body
   } else {
@@ -2124,8 +2124,9 @@ const getActivityReward = async () => {
             content: 30,
           },
           {
-            type: 'Gift',
+            type: 'GIFT',
             cover: imageUrl('reward_gift'),
+            content: 1,
           },
         ]
       } else if (rewards.sort == 5) {
@@ -2136,8 +2137,9 @@ const getActivityReward = async () => {
             content: 40,
           },
           {
-            type: 'Gift',
+            type: 'GIFT',
             cover: imageUrl('reward_gift'),
+            content: 1,
           },
         ]
       } else if (rewards.sort == 6) {
@@ -2148,8 +2150,9 @@ const getActivityReward = async () => {
             content: 50,
           },
           {
-            type: 'Gift',
+            type: 'GIFT',
             cover: imageUrl('reward_gift'),
+            content: 1,
           },
           {
             type: 'PROPS',
@@ -2311,9 +2314,6 @@ const preloadCriticalImages = async () => {
     imageUrl('bg1'),
     imageUrl('bg2'),
     imageUrl('bg3'),
-    imageUrl('bg4'),
-    imageUrl('bg5'),
-    imageUrl('bg6'),
     imageUrl('myAvatarFrame'),
     imageUrl('myInfoBg'),
     imageUrl('rankBt'),
@@ -2341,9 +2341,6 @@ const preloadCriticalImages = async () => {
     imageUrl('bg1'),
     imageUrl('bg2'),
     imageUrl('bg3'),
-    imageUrl('bg4'),
-    imageUrl('bg5'),
-    imageUrl('bg6'),
     imageUrl('myAvatarFrame'),
     imageUrl('myInfoBg'),
     imageUrl('rankBt_ar'),