Merge branch 'milestone-20250722-抽奖' into pangluotong/feature-20250712103401-抽奖

.env.development

@@ -2,7 +2,7 @@
 VITE_ENV = 'development'
 VITE_OUTPUT_DIR = 'dev'
 # public path
-VITE_PUBLIC_PATH = /
+VITE_PUBLIC_PATH = /test
 
 #新数据接口
 VITE_APP_API_BASE_URL = "https://dbqb.nfdxy.net/devLotApi"

.env.production

@@ -2,7 +2,7 @@
 VITE_ENV = 'production'
 VITE_OUTPUT_DIR = 'dist'
 # public path
-VITE_PUBLIC_PATH = /aixiaocaishen
+VITE_PUBLIC_PATH = /
 # VITE_PUBLIC_PATH = /
 
 # Whether to open mock

src/views/choujiang/hxl-cj/cj.vue

@@ -376,7 +376,7 @@ const initAll = async () => {
   prizes.value.forEach((item, index) => {
     item.type = index;
     item.count = item.amount;
-    item.leftCount = item.amount; //剩余次数（用于计算奖品下方的进度条的百分比）
+    item.leftCount = item.remainNum; //剩余次数（用于计算奖品下方的进度条的百分比）
     item.hasCount = item.amount; //已抽次数（用于计算出奖）
     item.isLook = false; //
     EACH_COUNT.push(item.perWin);
@@ -917,7 +917,7 @@ function switchPage(direction) {
     const object = threeDCards[cardIndex];
     const cardPage = Math.floor(index / cardsPerPage);
     const isVisible = cardPage === newPage;
-
+    const wasVisible = cardPage === pageIndex.value;
     // 计算在当前页中的索引
     const pageNowIndex = index % cardsPerPage;
     const pageLocate = pageLocates[cardPage][pageNowIndex];
@@ -930,11 +930,53 @@ function switchPage(direction) {
     //   "pageLocate",
     //   pageLocate
     // );
+
+    // 根据切换方向决定动画效果
+    let targetY;
+    if (isVisible) {
+      // 当前页要显示的卡片
+      if (direction === "next") {
+        // 索引增大：从下方飞出
+        targetY = pageLocate.y;
+      } else {
+        // 索引减少：从上方飞出
+        targetY = pageLocate.y;
+      }
+    } else {
+      // 当前页要隐藏的卡片
+      if (direction === "next") {
+        // 索引增大：向上飞走
+        targetY = pageLocate.y + 1000;
+      } else {
+        // 索引减少：向下飞走
+        targetY = pageLocate.y - 1000;
+      }
+    }
+
+    // 设置起始位置
+    let startY;
+    if (wasVisible) {
+      // 当前页的卡片从当前位置开始
+      startY = object.position.y;
+    } else {
+      // 非当前页的卡片从隐藏位置开始
+      if (direction === "next") {
+        // 索引增大：从下方开始
+        startY = pageLocate.y - 1000;
+      } else {
+        // 索引减少：从上方开始
+        startY = pageLocate.y + 1000;
+      }
+    }
+
+    // 先设置起始位置
+    object.position.y = startY;
+
     new TWEEN.Tween(object.position)
       .to(
         {
           x: pageLocate.x,
-          y: isVisible ? pageLocate.y : pageLocate.y + 1000,
+          y: targetY,
           z: 2100,
         },
         duration
@@ -1073,16 +1115,17 @@ const lotteryBtn = () => {
 
   getPrizeUsers.value = [];
   let params = {
-    gradeName: currentPrize.value.gradeName,
-    prizeName: currentPrize.value.prizeName,
+    gradeId: currentPrize.value.gradeId,
+    prizeId: currentPrize.value.prizeId,
     perWin: currentPrize.value.perWin,
+    remainNum: currentPrize.value.leftCount,
   };
   // 异步调用API，不阻塞后续代码执行
   startLotteryApi(params)
     .then((res) => {
       // API返回结果时赋值
-      getPrizeUsers.value = res.data || [];
-      console.log("API返回结果:", res.data);
+      getPrizeUsers.value = res.data.data || [];
+      console.log("API返回结果:", res.data.data);
     })
     .catch((err) => {
       console.error("API调用失败:", err);
@@ -1114,7 +1157,8 @@ const lottery = () => {
     selectedCardIndex = [];
     // 当前同时抽取的数目,当前奖品抽完还可以继续抽，但是不记录数据
 
-    for (let i = 0; i < getPrizeUsers.value; i++) {
+    for (let i = 0; i < getPrizeUsers.value.length; i++) {
+      console.log("111", getPrizeUsers.value[i]);
       currentLuckys.push(getPrizeUsers.value[i]);
       currentPrize.value.hasCount--;
 
@@ -1164,7 +1208,7 @@ function random(num) {
  */
 function changeCard(cardIndex, user) {
   let card = threeDCards[cardIndex].element;
-
+  // console.log("user", user);
   card.innerHTML = `<div class="name">${user.jwcode}</div>`;
 }
 
@@ -1176,7 +1220,7 @@ function changeSelectedCard(cardIndex, user) {
 
   let card = threeDCards[cardIndex].element;
 
-  card.innerHTML = `<div class="name">${user[1]}</div>`;
+  card.innerHTML = `<div class="name">${user.jwcode}</div>`;
 }
 /**
  * 切换名牌背景

src/views/choujiang/lottery/PrizePanel.vue

@@ -36,9 +36,6 @@
                   <span class="progress-bar-text">
                     {{ getLeftCount(prize) }}/{{ prize.count }}
                   </span>
-
-
-                  
                 </div>
               </div>
             </div>
@@ -55,6 +52,7 @@
         <div></div>
         <div></div>
         <div></div>
+      </div>
       <div class="prize-panel-footer">
         <div class="arrow-up" @click="openWinnerList"></div>
         <button
@@ -67,7 +65,6 @@
       </div>
     </div>
   </div>
-  </div>
 
   <div v-else>
     <div class="prize-panel-root">
@@ -111,7 +108,8 @@
                       prizes[lastRevealedIdx].count
                     }}
                   </span>
-                </div>  <div class="prize-panel-footer">
+                </div>
+                <div class="prize-panel-footer">
                   <div class="arrow-down" @click="toggleWinnerList"></div>
                   <div
                     v-if="showWinnerList"
@@ -163,10 +161,8 @@
             </div>
           </div>
         </div>
-        
       </div>
     </div>
-  
   </div>
 </template>
 
@@ -175,7 +171,6 @@ import { ref, computed, nextTick, watch, onMounted } from "vue";
 import { useLotteryStore } from "../../../store/lottery";
 import { useDataManager } from "../lottery/dataManager";
 
-
 const props = defineProps({
   prizes: Array,
 });
@@ -242,7 +237,10 @@ function canRevealPrize(idx) {
 // 卡片点击事件
 function handleReveal(idx) {
   // 检查是否可以揭秘这个奖品
-  if (idx !== nextRevealIdx.value ) {alert("请按顺序揭秘奖品!"); return;}
+  if (idx !== nextRevealIdx.value) {
+    alert("请按顺序揭秘奖品!");
+    return;
+  }
   if (idx === nextRevealIdx.value && canRevealPrize(idx)) {
     revealedCount.value++;
     lastRevealedIdx.value = idx; // 记录最新揭秘的索引
@@ -279,7 +277,9 @@ 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);
@@ -288,7 +288,6 @@ const updateWinners = async () => {
   }
 };
 async function openWinnerList() {
-
   // showWinnerList.value = true;
   if (!showWinnerList.value) {
     if (revealedCount.value === 0) {
@@ -361,23 +360,20 @@ function getProgressPercent(prize) {
 // onMounted(() => {
 //   updateWinners();
 // });
-
 </script>
 
 <style scoped>
 .prize-panel-list {
-  position: absolute;
-  top: 20px;
-  left: 20px;
+  position: relative;
   background: none;
   z-index: 10;
-  min-width: 320px;
+  min-width: 300px;
   max-width: 342px;
   text-align: left;
   display: flex;
   flex-direction: column;
   gap: 18px;
-  height: 400px;
+  height: 700px;
   overflow-x: hidden !important;
   overflow-y: auto;
   padding-right: 10px;
@@ -385,15 +381,14 @@ function getProgressPercent(prize) {
   scrollbar-color: #ffd283 rgba(255, 210, 131, 0.3); /* Firefox */
 }
 .prize-panel-list1 {
-  position: absolute;
-  top: 20px;
-  left: 20px;
+  position: relative;
   background: none;
   z-index: 10;
   min-width: 320px;
   max-width: 342px;
   text-align: left;
-    display: flex;}
+  display: flex;
+}
 
 .prize-panel-list::-webkit-scrollbar {
   width: 6px;
@@ -503,10 +498,20 @@ function getProgressPercent(prize) {
   font-size: 20px;
   font-weight: bold;
 }
+.prize-panel-root {
+  position: absolute;
+  top: 20px;
+  left: 20px;
+  background: none;
+  z-index: 10;
+  min-width: 320px;
+  max-width: 342px;
+  display: flex;
+  flex-direction: column;
+}
+
 .prize-panel-footer {
-  position: fixed;
-     right: 750px;
-    bottom: 435px;
+  position: relative;
   width: 100%;
   display: flex;
   flex-direction: column;
@@ -514,6 +519,7 @@ function getProgressPercent(prize) {
   z-index: 20;
   padding: 10px 0;
   border-radius: 0 0 6px 6px;
+  margin-top: 10px;
 }
 .arrow-up {
   position: relative;
@@ -537,7 +543,6 @@ function getProgressPercent(prize) {
   background-image: url("../../../assets/展开.png");
   background-size: cover;
   background-position: center;
-  
 }
 .winner-btn {
   background: rgba(255, 210, 131, 0.8);
@@ -553,7 +558,7 @@ function getProgressPercent(prize) {
 .winner-modal-mask {
   position: fixed;
   top: 142px;
-  left:-4px;
+  left: -4px;
   width: 100vw;
   height: 100vh;
   background: rgba(0, 0, 0, 0.01);