整合

src/components/Draw.vue

@@ -2,7 +2,7 @@
 import gsap from "gsap";
 import { addPoint, debounceTap } from "@/plugins";
 import { Toast } from "vant";
-import { Clipboard } from "v-clipboard";
+import useClipboard from 'vue-clipboard3'
 import { useMainStore } from "@/store";
 import { drawApi } from "@/api";
 
@@ -10,7 +10,9 @@ import { drawApi } from "@/api";
 const emit = defineEmits(["DrawPage"]);
 const userStore = useMainStore();
 
-const money = ref("8.88");
+
+
+const money = ref("1.88");
 const code = ref("sss");
 
 const showResult = ref(false);
@@ -20,45 +22,35 @@ const drawFn = (event) => {
   let e = event.target.parentElement;
   debounceTap(e, async () => {
     console.log("抽奖");
-    if(userStore.hasDraw){
+    if (userStore.hasDraw) {
       Toast.loading({
-      message: "抽奖中",
-      forbidClick: true,
-      duration: 0,
-    });
-    gsap.fromTo(
-      e,
-      { rotation: "-30" },
-      { rotation: "+30", repeat: -1, yoyo: true, ease: "none", duration: 0.3 }
-    );
+        message: "抽奖中",
+        forbidClick: true,
+        duration: 0,
+      });
+      gsap.fromTo(
+        e,
+        { rotation: "-30" },
+        { rotation: "+30", repeat: -1, yoyo: true, ease: "none", duration: 0.3 }
+      );
 
-    drawApi(
-      { subAnswerKey: userStore.drawKey },
-      userStore.token
-    ).then(res => {
-      if (res.code == 0) {
-        console.log('正常抽奖');
-        // isDrawn后端判断有没有中奖
-        hasPrize.value = res.data.isDrawn == 1 ? true : false; // true 中奖 || false 未中奖
-        userStore.updateDraw(); // 更新抽奖机会
+      drawApi(
+        { subAnswerKey: userStore.drawKey },
+        userStore.token
+      ).then(res => {
+        if (res.code == 0) {
+          console.log('正常抽奖');
+          // isDrawn后端判断有没有中奖
+          hasPrize.value = res.data.isDrawn == 1 ? true : false; // true 中奖 || false 未中奖
+          userStore.updateDraw(); // 更新抽奖机会
 
-        // 有奖品的话更新奖品信息
-        if (res.data.isDrawn == 1) {
-          money.value = res.data.prizeAmount;
-          code.value = res.data.prizeCode;
-          userStore.updatePrize(res.data);
-        }
-      } else {
-        console.log('抽奖异常');
-        if (res.code == 6003) {
-          console.log('6003', res);
-          Toast(res.msg)
-          userStore.updateDraw();
+          // 有奖品的话更新奖品信息
+          if (res.data.isDrawn == 1) {
+            money.value = res.data.prizeAmount;
+            code.value = res.data.prizeCode;
+            userStore.updatePrize(res.data);
+          }
 
-        } else {
-          console.log('eroor', res);
-          hasPrize.value = false; // true 中奖 || false 未中奖
-          userStore.updateDraw();
           setTimeout(() => {
             Toast.clear();
             showResult.value = true;
@@ -69,10 +61,31 @@ const drawFn = (event) => {
             });
             gsap.killTweensOf(".draw-light,.draw");
           }, 1000);
+        } else {
+          console.log('抽奖异常');
+          if (res.code == 6003) {
+            console.log('6003', res);
+            Toast(res.msg)
+            userStore.updateDraw();
+
+          } else {
+            console.log('eroor', res);
+            hasPrize.value = false; // true 中奖 || false 未中奖
+            userStore.updateDraw();
+            setTimeout(() => {
+              Toast.clear();
+              showResult.value = true;
+              gsap.from(".result-container", {
+                duration: 0.5,
+                scale: 0.7,
+                autoAlpha: 0,
+              });
+              gsap.killTweensOf(".draw-light,.draw");
+            }, 1000);
+          }
         }
-      }
-    })
-    }else{
+      })
+    } else {
       Toast('今日抽奖次数已用完！')
     }
 
@@ -93,12 +106,14 @@ const hide = (event) => {
 };
 const copyFn = (event) => {
   let e = event.target;
-  debounceTap(e, () => {
-    Clipboard.copy(code.value);
+  toClipboard(code.value)
+  debounceTap(e, async() => {
     Toast(`复制成功：${code.value}`);
   });
 };
 
+
+
 const entryAni = () => {
   gsap.from(".DrawPage", { duration: 0.2, autoAlpha: 0 });
   gsap.from(".draw-container", { duration: 0.5, autoAlpha: 0, scale: 0.7 });
@@ -126,7 +141,7 @@ onMounted(() => {
       </div>
       <div class="draw-star"></div>
       <div class="draw-tips"></div>
-    <!-- 关闭按钮 -->
+      <!-- 关闭按钮 -->
       <div class="draw-cls-btn" @click="hide($event)"></div>
     </div>
     <div v-show="showResult" class="result-container">
@@ -160,11 +175,11 @@ onMounted(() => {
     @include box(685px, 694px);
     position: relative;
 
-    
-  .draw-cls-btn{
-    @include pos(82px, 82px,300.5px,670px);
+
+    .draw-cls-btn {
+      @include pos(82px, 82px, 300.5px, 670px);
       @include bg_pos("prize/cls-btn.png");
-  }
+    }
 
     .draw-light {
       pointer-events: none;

src/components/MyPrize.vue

@@ -2,25 +2,27 @@
 import { debounceTap } from "@/plugins";
 import gsap from "gsap";
 import { Toast } from "vant";
-import { Clipboard } from "v-clipboard";
+import useClipboard from 'vue-clipboard3'
 import { useMainStore } from "@/store";
 import { onMounted } from "vue";
 
 // 页面配置初始化
 const emit = defineEmits(["MyPrizePage"]);
 const userStore = useMainStore();
+const { toClipboard } = useClipboard()
 
 const money = ref(userStore.prizeMoney);
 const code = ref(userStore.prizeCode);
 
 const copyFn = (event) => {
   let e = event.target;
+  toClipboard(code.value)
   debounceTap(e, () => {
-    Clipboard.copy(code.value);
     Toast(`复制成功：${code.value}`);
   });
 };
 
+
 const hide = (event) => {
   let e = event.target;
   debounceTap(e, () => {