弹窗

src/views/DZP.vue

@@ -70,7 +70,10 @@ function endCallback(prize) {
     // 触发动画
     animateScoreChange()
     // 设置弹窗内容
-    popupMessage.value = `${result}金币`;  //  <---  正确的用法
+    setTimeout(() => {
+      popupMessage.value= `${result}金币`; 
+ }, 1000); //  <---  正确的用法
+  
     showPopup.value = true;
     // 3秒后隐藏弹窗
     setTimeout(() => {
@@ -111,6 +114,7 @@ const animateScoreChange = () => {
             <div v-if="showPopup" class="score-popup" :class="{ 'boom-effect': showPopup }">
             <!-- <div class="score-popup" :class="{ 'boom-effect': showPopup }"> -->
                 <div class="ziti">
+                    
                     {{ popupMessage }}
                 </div>
             </div>
@@ -139,6 +143,8 @@ const animateScoreChange = () => {
     }
 }
 
+
+
 .score-popup {
     /* 基础样式同上 */
 
@@ -152,8 +158,8 @@ const animateScoreChange = () => {
 
     /* 背景图配置 */
     background:
-        url('tanchaung.png') center/contain no-repeat;
-    padding: 240px 160px;
+        url('tanchuang.png') center/contain no-repeat;
+    padding: 120px 80px;
     /* 根据图片留出边距 */
 
     /* 尺寸控制 */
@@ -171,15 +177,17 @@ const animateScoreChange = () => {
 .ziti {
     /* 文字样式 */
     font-family: '华康金文体', 'Arial Black', sans-serif;
+    
     font-size: 100px;
+
     /* 根据图片调整字号 */
-    color: #0e0d0d;
+    color: #ffd904;
     /* 金色文字 */
     line-height: 250px;
     /* 垂直居中文字 */
     text-shadow: 2px 2px 0 #B8860B;
     /* 略微加粗文字 */
-    margin-bottom: 260px;
+    margin-bottom: 100px;
 }
 
 /* 添加艺术字样式 */
@@ -203,6 +211,8 @@ const animateScoreChange = () => {
     z-index: 1000;
 }
 
+
+
 /* 添加分数变化动画 */
 .score-change {
     transform: translateX(-50%) scale(1.2);