From 2fd1a1e284f1b3eb3365e74e371dc5c89a1496b2 Mon Sep 17 00:00:00 2001
From: tcubic <123456>
Date: Fri, 5 Aug 2022 17:52:24 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E8=BD=AC=E7=9B=98=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LuckyWheel.vue | 39 ++++++++++++++++++++++++++++++-----
 1 file changed, 34 insertions(+), 5 deletions(-)

diff --git a/src/components/LuckyWheel.vue b/src/components/LuckyWheel.vue
index 1afff31..ed02f24 100644
--- a/src/components/LuckyWheel.vue
+++ b/src/components/LuckyWheel.vue
@@ -37,7 +37,7 @@
 			<!-- 对照div 重点 -->
 			<div class="relative-box" ref="container"></div>
 
-			<div class="btn" @click="btn">开始抽奖</div>
+			<!-- <div class="btn" @click="btn">开始抽奖</div> -->
 		</div>
 	</div>
 </template>
@@ -89,6 +89,19 @@ const aniGroup = ref([]);
 const container = ref();
 
 const eqcode = ref(require("../assets/img/pop/eqcode.png"));
+const luckyWheelStatus = ref(false);
+
+
+
+// 大转盘结束回调
+const isStop = () => {
+  if (!luckyWheelStatus.value) {
+    luckyWheelStatus.value = true;
+    console.log("大转盘结束");
+	emit('luckyWheel')  //告诉主页弹出相应结果弹窗
+  }
+};
+
 
 // 页面挂载前
 onBeforeMount(() => {});
@@ -168,6 +181,14 @@ const showDrawAni = (bingo, repeat) => {
 					offsetY: 70,
 					alignOrigin: [0.5, 0],
 				},
+				onStart: ()=>{
+					if (i == pArr.length - 1) {
+            setTimeout(() => {
+            //   console.log("停止2");
+			  isStop()
+            }, 5000);
+          }
+				},
 				onUpdate: () => {
 					// if (i === 1) console.log(ani.progress());
 				},
@@ -195,22 +216,30 @@ const btn = () => {
 	// 第一个参数 对应奖品对应id, 第二个参数是是否多旋转一会儿 fasle旋转一圈就停止
 	showDrawAni(1, true);
 };
+
+// 暴露出方法给父组件调用
+defineExpose({
+  showDrawAni,
+});
+
+
 </script>
 
 <style lang="scss" scoped>
 .LuckyWheelCon {
 	width: 100%;
-	height: 100%;
-	position: fixed;
-	z-index: 10;
+	height: 800px;
+	position: absolute;
+	// z-index: 10;
 	top: 0;
 	left: 0;
+	pointer-events: none;
 	// right: 0;
 	// bottom: 0;
 	// display: flex;
 	// justify-content: center;
 	// align-items: center;
-	background-color: rgba(0, 0, 0, 0.3);
+	// background-color: rgba(0, 0, 0, 0.3);
 
 	.LuckyWheel_container {
 		position: absolute;