'update'

完成所有切图
2025-05-26 17:50:11 +08:00 · 2025-05-22 15:51:10 +08:00 · 2025-05-22 15:49:25 +08:00 · 2025-05-22 15:39:52 +08:00 · 2025-05-22 15:14:09 +08:00 · 2025-05-22 15:06:47 +08:00
99 changed files with 8300 additions and 1760 deletions
--- a/index.html
+++ b/index.html
@@ -5,7 +5,8 @@
  <meta charset="UTF-8" />
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
-  <title><%- title%></title>
+  <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
    <title><%- title%></title>
 </head>
 <body>
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -15,25 +15,25 @@
    "axios": "^1.6.3",
    "gsap": "^3.12.4",
    "howler": "^2.2.4",
-    "pinia": "^2.1.7",
+    "pinia": "^2.2.0",
    "qrcode": "^1.5.3",
    "qs": "^6.11.2",
    "vant": "^3.6.12",
    "vconsole": "^3.15.1",
-    "vue": "^3.2.41",
+    "vue": "^3.4.0",
    "vue-clipboard3": "^2.0.0",
    "weixin-js-sdk": "^1.6.5"
  },
  "devDependencies": {
    "@vant/auto-import-resolver": "^1.0.2",
-    "@vitejs/plugin-vue": "^3.2.0",
+    "@vitejs/plugin-vue": "^4.0.0",
    "postcss-px-to-viewport-8-plugin": "^1.2.3",
    "sass": "^1.68.0",
    "sass-loader": "^13.3.2",
    "unplugin-auto-import": "^0.17.3",
    "unplugin-vue-components": "^0.26.0",
-    "vite": "^3.2.3",
+    "vite": "4.5.10",
    "vite-plugin-compression": "^0.5.1",
-    "vite-plugin-html": "^3.2.1"
+    "vite-plugin-html": "^3.2.2"
  }
 }
--- a/src.zip
+++ b/src.zip
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -2,7 +2,7 @@ import http from './http'
 // 获取code
 export function authorize(data, authorization) {
-    return http.post("/h5/oauth/authorize",
+    return http.post("/h5/Oauth/authorize",
        data,
        true,
    );
@@ -10,7 +10,7 @@ export function authorize(data, authorization) {
 // 获取用户信息
 export function getUserInfo(data, authorization) {
-    return http.post("/h5/oauth/getUserInfo",
+    return http.post("/h5/Oauth/getUserInfo",
        data,
        true,
    );
@@ -54,7 +54,7 @@ export function exchangePrize(data, authorization) {
 // 分享接口
 export function getShareConfig(data, authorization) {
-    return http.post("/h5/oauth/getShareConfig",
+    return http.post("/h5/Oauth/getShareConfig",
        data,
        true,
    );
--- a/src/assets/font/DouyinSansBold.ttf
+++ b/src/assets/font/DouyinSansBold.ttf
--- a/src/assets/font/FZZY_Regular.ttf
+++ b/src/assets/font/FZZY_Regular.ttf
--- a/src/assets/font/HarmonyOS_Sans_SC_Regular.ttf
+++ b/src/assets/font/HarmonyOS_Sans_SC_Regular.ttf
--- a/src/assets/font/源字体/FZZY_Regular.ttf
+++ b/src/assets/font/源字体/FZZY_Regular.ttf
--- a/src/assets/images/index/bg.jpg
+++ b/src/assets/images/index/bg.jpg
--- a/src/assets/images/index/btn.png
+++ b/src/assets/images/index/btn.png
--- a/src/assets/images/index/cloud-1.png
+++ b/src/assets/images/index/cloud-1.png
--- a/src/assets/images/index/cloud-2.png
+++ b/src/assets/images/index/cloud-2.png
--- a/src/assets/images/index/island.png
+++ b/src/assets/images/index/island.png
--- a/src/assets/images/index/logo.png
+++ b/src/assets/images/index/logo.png
--- a/src/assets/images/index/prize-btn.png
+++ b/src/assets/images/index/prize-btn.png
--- a/src/assets/images/index/rule-btn.png
+++ b/src/assets/images/index/rule-btn.png
--- a/src/assets/images/index/start-btn.png
+++ b/src/assets/images/index/start-btn.png
--- a/src/assets/images/index/sub-title.png
+++ b/src/assets/images/index/sub-title.png
--- a/src/assets/images/index/time.png
+++ b/src/assets/images/index/time.png
--- a/src/assets/images/index/title.png
+++ b/src/assets/images/index/title.png
--- a/src/assets/images/index/tree-1.png
+++ b/src/assets/images/index/tree-1.png
--- a/src/assets/images/load/bar-box.png
+++ b/src/assets/images/load/bar-box.png
--- a/src/assets/images/load/bar-icon.png
+++ b/src/assets/images/load/bar-icon.png
--- a/src/assets/images/load/bar.png
+++ b/src/assets/images/load/bar.png
--- a/src/assets/images/load/bg.jpg
+++ b/src/assets/images/load/bg.jpg
--- a/src/assets/images/load/icon.png
+++ b/src/assets/images/load/icon.png
--- a/src/assets/images/music-off.png
+++ b/src/assets/images/music-off.png
--- a/src/assets/images/music-on.png
+++ b/src/assets/images/music-on.png
--- a/src/assets/images/orientation-icon.png
+++ b/src/assets/images/orientation-icon.png
--- a/src/assets/images/prize/cls-btn.png
+++ b/src/assets/images/prize/cls-btn.png
--- a/src/assets/images/prize/copy-btn.png
+++ b/src/assets/images/prize/copy-btn.png
--- a/src/assets/images/prize/copy-btn2.png
+++ b/src/assets/images/prize/copy-btn2.png
--- a/src/assets/images/prize/got-btn.png
+++ b/src/assets/images/prize/got-btn.png
--- a/src/assets/images/prize/lucky-bag.png
+++ b/src/assets/images/prize/lucky-bag.png
--- a/src/assets/images/prize/myPrize-box.png
+++ b/src/assets/images/prize/myPrize-box.png
--- a/src/assets/images/prize/myPrize-box2.png
+++ b/src/assets/images/prize/myPrize-box2.png
--- a/src/assets/images/prize/no-get-btn.png
+++ b/src/assets/images/prize/no-get-btn.png
--- a/src/assets/images/prize/prize-box.png
+++ b/src/assets/images/prize/prize-box.png
--- a/src/assets/images/qa/analysis-icon.png
+++ b/src/assets/images/qa/analysis-icon.png
--- a/src/assets/images/qa/bg.jpg
+++ b/src/assets/images/qa/bg.jpg
--- a/src/assets/images/qa/bubble-1.png
+++ b/src/assets/images/qa/bubble-1.png
--- a/src/assets/images/qa/correct-icon.png
+++ b/src/assets/images/qa/correct-icon.png
--- a/src/assets/images/qa/correct.png
+++ b/src/assets/images/qa/correct.png
--- a/src/assets/images/qa/create-btn.png
+++ b/src/assets/images/qa/create-btn.png
--- a/src/assets/images/qa/incorrect-icon.png
+++ b/src/assets/images/qa/incorrect-icon.png
--- a/src/assets/images/qa/incorrect.png
+++ b/src/assets/images/qa/incorrect.png
--- a/src/assets/images/qa/next-btn.png
+++ b/src/assets/images/qa/next-btn.png
--- a/src/assets/images/qa/paper.png
+++ b/src/assets/images/qa/paper.png
--- a/src/assets/images/qa/question-box.png
+++ b/src/assets/images/qa/question-box.png
--- a/src/assets/images/qa/result-box-2.png
+++ b/src/assets/images/qa/result-box-2.png
--- a/src/assets/images/qa/result-box.png
+++ b/src/assets/images/qa/result-box.png
--- a/src/assets/images/qa/text-bg.png
+++ b/src/assets/images/qa/text-bg.png
--- a/src/assets/images/qa/tips-bg-2.png
+++ b/src/assets/images/qa/tips-bg-2.png
--- a/src/assets/images/qa/tips-bg.png
+++ b/src/assets/images/qa/tips-bg.png
--- a/src/assets/images/qa/tree.png
+++ b/src/assets/images/qa/tree.png
--- a/src/assets/images/result/bg.jpg
+++ b/src/assets/images/result/bg.jpg
--- a/src/assets/images/result/card.png
+++ b/src/assets/images/result/card.png
--- a/src/assets/images/result/cls-btn.png
+++ b/src/assets/images/result/cls-btn.png
--- a/src/assets/images/result/create-btn.png
+++ b/src/assets/images/result/create-btn.png
--- a/src/assets/images/result/go-draw-btn.png
+++ b/src/assets/images/result/go-draw-btn.png
--- a/src/assets/images/result/go-share-btn.png
+++ b/src/assets/images/result/go-share-btn.png
--- a/src/assets/images/result/poster-1.jpg
+++ b/src/assets/images/result/poster-1.jpg
--- a/src/assets/images/result/poster-2.jpg
+++ b/src/assets/images/result/poster-2.jpg
--- a/src/assets/images/result/poster-3.jpg
+++ b/src/assets/images/result/poster-3.jpg
--- a/src/assets/images/result/poster-text.png
+++ b/src/assets/images/result/poster-text.png
--- a/src/assets/images/result/poster.jpg
+++ b/src/assets/images/result/poster.jpg
--- a/src/assets/images/result/r-bg-1.jpg
+++ b/src/assets/images/result/r-bg-1.jpg
--- a/src/assets/images/result/r-bg-2.jpg
+++ b/src/assets/images/result/r-bg-2.jpg
--- a/src/assets/images/result/r-bg-3.jpg
+++ b/src/assets/images/result/r-bg-3.jpg
--- a/src/assets/images/result/text-1.png
+++ b/src/assets/images/result/text-1.png
--- a/src/assets/images/result/text-2.png
+++ b/src/assets/images/result/text-2.png
--- a/src/assets/images/result/text-3.png
+++ b/src/assets/images/result/text-3.png
--- a/src/assets/images/result/title.png
+++ b/src/assets/images/result/title.png
--- a/src/assets/images/rule/arrow.png
+++ b/src/assets/images/rule/arrow.png
--- a/src/assets/images/rule/cls-btn.png
+++ b/src/assets/images/rule/cls-btn.png
--- a/src/assets/images/rule/icon.png
+++ b/src/assets/images/rule/icon.png
--- a/src/assets/images/rule/rule-box.png
+++ b/src/assets/images/rule/rule-box.png
--- a/src/assets/images/share.jpg
+++ b/src/assets/images/share.jpg
--- a/src/assets/media/bgm.mp3
+++ b/src/assets/media/bgm.mp3
--- a/src/components/Draw.vue
+++ b/src/components/Draw.vue
@@ -14,7 +14,7 @@ const { toClipboard } = useClipboard()
 const money = ref("1.88");
-const code = ref("sss");
+const code = ref("PAKJ2025");
 const showResult = ref(false);
 const hasPrize = ref(false);
@@ -85,20 +85,6 @@ const drawFn = (event) => {
            }, 1000);
          }
        }
      }).catch(error =>{
        console.log('eroor', error);
            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 {
      Toast('今日抽奖次数已用完！')
@@ -114,7 +100,7 @@ const hide = (event) => {
      duration: 0.3,
      autoAlpha: 0,
      onComplete: () => {
-        emit("DrawPage", {action:"hide"});
+        emit("DrawPage", { action: "hide" });
      },
    });
  });
@@ -122,7 +108,7 @@ const hide = (event) => {
 const copyFn = (event) => {
  let e = event.target;
  toClipboard(code.value)
-  debounceTap(e, async() => {
+  debounceTap(e, async () => {
    Toast(`复制成功：${code.value}`);
  });
 };
@@ -162,17 +148,16 @@ onMounted(() => {
    <div v-show="showResult" class="result-container">
      <!-- 有奖品 -->
      <div class="draw-has" v-show="hasPrize">
        <div class="draw-has-title">恭喜您抽中</div>
        <div class="money">¥{{ money }}元</div>
        <div class="draw-has-text">奖励抽到手，快乐马上有</div>
        <div class="code-box">
-          <div class="code">兑奖码：{{ code }}</div>
+          <span>兑奖码：</span>
-          <div class="copy-btn" @click="copyFn($event)"></div>
+          <span class="code">{{ code }}</span>
-        </div>
+          <span class="copy-btn" @click="copyFn($event)"></span>
        <div class="code-tips">
          <div>兑奖流程：前往微信搜索【平安理财服务号】</div>
          <div>公众号发送“清凉一夏”获取兑换链接，</div>
          <div>输入兑换码兑换奖品。</div>
          <div class="code-tips-text">（兑换码可在主页面“奖品”再次查看并复制）</div>
        </div>
        <div class="exchange-tips">兑换流程：前往微信搜索【平安理财服务号】公众号发送“端午安康”获取兑奖链接，输入兑换码兑换奖品</div>
        <div class="exchnage-tips2">（兑换码可在主页面“我的奖品” 再次查看并复制）</div>
        <div class="cls-btn" @click="hide($event)"></div>
      </div>
      <!-- 没有奖品 -->
@@ -183,7 +168,7 @@ onMounted(() => {
    </div>
  </div>
-</template>  
+</template>
 <style lang="scss" scoped>
 .DrawPage {
@@ -234,56 +219,93 @@ onMounted(() => {
  .draw-has {
    position: relative;
    @include box(665px, 731px);
-    @include bg_pos("prize/myPrize-box.png");
+    @include bg_pos("prize/myPrize-box2.png");
-    position: relative;
+
-    left: 30px;
+    .draw-has-title {
      @include pos(390px, 100px, 110px, 140px);
      font-size: 40px;
      color: #e95b46;
      font-weight: 700;
      letter-spacing: 3px;
      // background-color: aqua;
      @include flexCen();
    }
    .draw-has-text {
      @include pos(390px, 100px, 110px, 300px);
      font-size: 30px;
      color: #e95b46;
      font-weight: 700;
      letter-spacing: 0;
      // background-color: aqua;
      @include flexCen();
    }
    .money {
-      @include pos(370px, 81px, 139px, 239px);
+
-      display: flex;
+      @include pos(390px, 130px, 110px, 200px);
-      justify-content: center;
+      @include flexCen();
      align-items: center;
      color: #e95b46;
      font-weight: 700;
      font-size: 58px;
      letter-spacing: 4px;
      // background-color: rgb(217, 0, 255);
    }
    .code-box {
-      @include pos(390px, 52px, 100px, 508px);
+      @include pos(390px, 52px, 110px, 508px);
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      font-size: 25px;
      font-weight: 700;
      color: #fff6cc;
      span {
        height: 77px;
        line-height: 65px;
      }
      .code {
        font-size: 25px;
        font-weight: 700;
        margin-right: 10px;
-        color: #fff6cc;
+
      }
      .copy-btn {
        @include box(77px, 39px);
-        @include bg_pos("prize/copy-btn2.png");
+        @include bg_pos("prize/copy-btn.png");
      }
    }
-    .code-tips{
+    .exchange-tips {
      @include pos(390px, 152px, 110px, 558px);
      display: flex;
-      flex-direction: column;
+      flex-direction: row;
-      justify-content: space-around;
+      align-items: start;
-      @include pos(410px, 120px, 100px, 560px);
+      justify-content: flex-start;
      // background: rgba($color: #000000, $alpha: .7);
      font-size: 20px;
-        font-weight: 700;
+      // font-weight: 700;
-        color: #fff6cc;
+      color: #fff6cc;
-      .code-tips-text{
+      letter-spacing: 2px;
-        font-size: 17px;
+      // background-color: aqua;
-        text-align: center;
+    }
-      }
+
    .exchnage-tips2 {
      @include pos(390px, 52px, 110px, 638px);
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      font-size: 15px;
      // font-weight: 700;
      color: #fff6cc;
      // background-color: aqua;
    }
    .cls-btn {
-      @include pos(43px, 43px, 517px, 114px);
+      @include pos(82px, 82px, 517px, 114px);
      @include bg_pos("prize/cls-btn.png");
    }
  }
--- a/src/components/Index.vue
+++ b/src/components/Index.vue
@@ -3,8 +3,6 @@ import { Toast } from "vant";
 import { debounceTap } from "@/plugins";
 import gsap from "gsap";
 import { useMainStore } from "@/store";
 import Preloader from "@/plugins/Preloader";
 import { pageQAImg } from "@/data/imgList";
 const emit = defineEmits(["IndexPage"]);
 const userStore = useMainStore();
@@ -35,25 +33,24 @@ const showRule = (event) => {
  });
 };
 onMounted(() => {
-  gsap.from(
+  gsap.from(".index-bg", { duration: 1, scale: 1.2, autoAlpha: 0 });
-    ".index-bg,.index-island,.index-cloud-1,.index-cloud-2,.index-tree-1",
+  gsap.from(".index-title", { duration: 1, y: 20, autoAlpha: 0, delay: 1 });
-    { duration: 1, scale: 1.2, autoAlpha: 0 }
+  gsap.from(".index-time", { duration: 1, x: 40, autoAlpha: 0, delay: 1 });
-  );
+  gsap.from(".index-logo", { duration: 1, y: 20, autoAlpha: 0, delay: 0.75 });
-  gsap.from(".index-title", { duration: 1, y: 20, autoAlpha: 0 });
+  gsap.from(".index-rule-btn", { duration: 1, x: -100, autoAlpha: 0, delay: 1.3 });
  gsap.from(".index-sub-title", { duration: 1, x: 20, autoAlpha: 0 });
  gsap.from(".index-rule-btn", { duration: 1, x: -100, autoAlpha: 0 });
  gsap.from(".index-prize-btn", {
    duration: 1,
    x: -100,
    autoAlpha: 0,
-    delay: 0.3,
+    delay: 1.5,
  });
  gsap.from(".index-start-btn", {
    duration: 1,
    y: 30,
    autoAlpha: 0,
-    delay: 0.5,
+    delay: 1.5,
  });
  gsap.from(".index-agreement", {
    duration: 1,
@@ -61,61 +58,11 @@ onMounted(() => {
    autoAlpha: 0,
    delay: 0.5,
    onComplete: () => {
-      gsap.to(".index-start-btn", {
+      gsap.to('.index-start-btn', { duration: 1, scale: '0.95', repeat: -1, yoyo: true, ease: 'bounce.out' })
-        duration: 1,
+    }
        scale: "0.9",
        repeat: -1,
        yoyo: true,
        ease: "bounce.in",
      });
      gsap.to(".index-cloud-1", {
        duration: 2,
        x: -30,
        repeat: -1,
        yoyo: true,
        ease: "none",
      });
      gsap.to(".index-cloud-2", {
        duration: 2,
        x: 30,
        repeat: -1,
        yoyo: true,
        ease: "none",
      });
      gsap.to(".index-tree-1", {
        duration: 2,
        y: 10,
        repeat: -1,
        yoyo: true,
        ease: "none",
      });
      gsap.to(".index-title", {
        duration: 2.5,
        y: -20,
        repeat: -1,
        yoyo: true,
        ease: "none",
      });
      gsap.to(".index-sub-title", {
        duration: 3,
        x: 10,
        repeat: -1,
        yoyo: true,
        ease: "none",
      });
      // 开始加载答题页面资源
      Preloader({
        name: "加载答题页资源",
        imgs: pageQAImg,
        callback: (progress) => {
          // console.log("进度：", progress);
        },
      }).then((res) => {
        console.log("done!");
      });
    },
  });
 });
 const vcNum = ref(false);
@@ -131,29 +78,21 @@ const showVC = () => {
  <div class="IndexPage" @touchmove.prevent>
    <div class="index-bg"></div>
    <div class="index-container">
      <div class="index-cloud-1"></div>
      <div class="index-cloud-2"></div>
      <div class="index-tree-1"></div>
      <div class="index-island"></div>
      <div class="index-logo"></div>
      <div class="index-title" @click="showVC"></div>
-      <div class="index-sub-title"></div>
+      <div class="index-time"></div>
-      <div class="index-rule-btn" @click="showRule($event)"></div>
+      <div class="index-rule-btn index-left-btn" @click="showRule($event)">活动规则</div>
-      <!-- v-if="userStore.hasPrize" -->
+      <div class="index-prize-btn index-left-btn" v-if="userStore.hasPrize" @click="showMyPrize($event)">我的奖品</div>
      <div class="index-prize-btn" @click="showMyPrize($event)"></div>
      <div class="index-start-btn" @click="start"></div>
      <div class="index-agreement">
-        <div class="agreement">
+        <span>风险提示:本材料由平安理财有限责任公司(以下简称“平安理财”)制作并提供。</span>
-          风险提示:
+        <span class="b">本资料内容及观点仅供参考，不构成对任何人的投资建议。</span>
-          本材料由平安理财有限责任公司(以下简称“平安理财”)制作并提供。<span
+        <span>以上产品投资管理机构/管理人为平安理财，代理销售机构不承担产品的投资、兑付和风险管理的责任。以上产品通过代理销售机构渠道销售的，产品风险评级应当以代理销售机构最终披露的评级结果为准。以上产品为非保本浮动收益理财产品，具体以产品说明书或产品公告披露为准。产品的业绩比较基准指管理人基于过往投资经验以及对产品存续期投资市场波动的预判而对本产品所设定的投资目标，业绩比较基准不是预期收益率，不代表产品的未来表现和实际收益，不构成对产品收益的承诺。</span>
-            class="b"
+        <span class="b">理财产品过往业绩不代表其未来表现，不等于理财产品实际收益，投资须谨慎。过往业绩相关数据已经托管人核对。</span><span
-            >本资料内容及观点仅供参考，不构成对任何人的投资建议。</span
+          class="orange">理财非存款，产品有风险，投资须谨慎。</span>
-          >以上产品投资管理机构/管理人为平安理财，代理销售机构不承担产品的投资、兑付和风险管理的责任。以上产品通过代理销售机构渠道销售的，产品风险评级应当以代理销售机构最终披露的评级结果为准。以上产品为非保本浮动收益理财产品，具体以产品说明书或产品公告披露为准。产品的业绩比较基准指管理人基于过往投资经验以及对产品存续期投资市场波动的预判而对本产品所设定的投资目标，业绩比较基准不是预期收益率，不代表产品的未来表现和实际收益，不构成对产品收益的承诺。<span
+        <span>
-            class="b"
+          金融消费者不得利用金融产品和服务从事违法活动。
-            >理财产品过往业绩不代表其未来表现，不等于理财产品实际收益，投资须谨慎。过往业绩相关数据已经托管人核对。</span
+        </span>
          ><span class="orange">理财非存款，产品有风险，投资须谨慎。</span
          >金融消费者不得利用金融产品和服务从事违法活动。
        </div>
      </div>
    </div>
  </div>
@@ -161,9 +100,9 @@ const showVC = () => {
 <style lang="scss" scoped>
 .IndexPage {
-  @include pos(100%, 100vh, 0px, 0px);
+  @include pos(100%, 1624px, 0px, 0px);
  overflow: hidden;
-  background: linear-gradient(135deg, #90dcff, #51b7ff);
+  background: linear-gradient(135deg, #d6d1ca, #e5dccf);
  .index-bg {
    @include pos(750px, 1624px, 0px, 50%);
@@ -172,93 +111,78 @@ const showVC = () => {
  }
  .index-container {
-    @include pos(750px, 1624px, 0px, 50%);
+    @include pos(750px, 1624px, 0px, 0px);
-    transform: translateY(-50%);
+    // transform: translateY(-50%);
-    // .index-logo{
+
-    //   pointer-events: none;
+    .index-logo {
-    //   @include pos(632px, 94px, 59px, 267px);
+      pointer-events: none;
-    //   @include bg_pos("index/logo.png");
+      @include pos(632px, 94px, 59px, 266px);
-    // }
+      @include bg_pos("index/logo.png");
    }
    .index-title {
      // pointer-events: none;
-      @include pos(633px, 253px, 46px, 254px);
+      @include pos(593px, 156px, 85px, 387px);
      @include bg_pos("index/title.png");
    }
-    .index-island {
+    .index-time {
-      pointer-events: none;
+      @include pos(433px, 58px, 295px, 565px);
-      @include pos(714px, 867px, 15px, 542px);
+      @include bg_pos("index/time.png");
      @include bg_pos("index/island.png");
    }
-    .index-cloud-1 {
+    .index-left-btn {
-      pointer-events: none;
+      border: 2px solid rgb(255, 255, 255);
-      @include pos(210px, 147px, -15px, 535px);
+      background-color: rgb(243, 87, 4);
-      @include bg_pos("index/cloud-1.png");
+      box-shadow: 0px 6px 11px 0px rgba(155, 122, 68, 0.4);
-    }
+      font-size: 25px;
-
+      display: flex;
-    .index-cloud-2 {
+      align-items: center;
-      pointer-events: none;
+      justify-content: center;
-      @include pos(151px, 172px, 656px, 486px);
+      padding-left: 20px;
-      @include bg_pos("index/cloud-2.png");
+      color: #ffffff;
-    }
+      letter-spacing: 1.5px;
-
+      border-radius: 21px;
    .index-tree-1 {
      pointer-events: none;
      @include pos(228px, 199px, -45px, 492px);
      @include bg_pos("index/tree-1.png");
    }
    .index-sub-title {
      pointer-events: none;
      @include pos(423px, 87px, 170px, 486px);
      @include bg_pos("index/sub-title.png");
    }
    .index-rule-btn {
-      @include pos(193px, 50px, 612px, 553px);
+      @include pos(184px, 49px, -37px, 578px);
      @include bg_pos("index/rule-btn.png");
    }
    .index-prize-btn {
-      @include pos(184px, 49px, 612px, 615px);
+      @include pos(184px, 49px, -37px, 642px);
      @include bg_pos("index/prize-btn.png");
    }
    .index-start-btn {
-      @include pos(423px, 152px, 156px, 1025px);
+      @include pos(288px, 93px, 231px, 1097px);
-      @include bg_pos("index/start-btn.png");
+      @include bg_pos("index/btn.png");
    }
    .index-agreement {
-      font-family: "HarmonyOS_Sans_SC_Regular";
+      font-family: "FZZY_Regular";
      pointer-events: none;
-      @include pos(736px, 182px, 7px, 1230px);
+      @include pos(736px, 182px, 7px, 1208px);
      font-size: 14px;
      text-align: justify;
      letter-spacing: 0.1px;
      color: #ffffff;
      padding: 10px;
      box-sizing: border-box;
      border-radius: 10px;
      line-height: 20px;
      .agreement {
        background-color: rgba(255, 255, 255, 0.75);
-        font-size: 14px;
+      .b {
-        text-align: justify;
+        font-weight: 700;
-        letter-spacing: 0.1px;
+      }
        color: #124284;
        padding: 10px;
        box-sizing: border-box;
        border-radius: 2px;
        line-height: 20px;
-        .b {
+      .orange {
-          font-weight: 700;
+        color: #ff7127;
-        }
+        font-weight: 700;
        .orange {
          color: #f5430c;
          font-weight: 700;
        }
      }
    }
  }
 }
 </style>
--- a/src/components/Loading.vue
+++ b/src/components/Loading.vue
@@ -13,6 +13,7 @@ const userStore = useMainStore();
 const loadNum = ref(0);
 onMounted(() => {
  Preloader({
    name: "加载页资源",
    imgs: loadImg,
@@ -24,7 +25,6 @@ onMounted(() => {
      duration: 0.2,
      autoAlpha: 1,
      onComplete: () => {
        // 非本地环境
        if (import.meta.env.VITE_MODE != "dev") {
          getMyPrize({}, userStore.token).then((res) => {
            if (res.code == 0) {
@@ -36,16 +36,17 @@ onMounted(() => {
            }
          });
        }
        Preloader({
          name: "内页资源",
          imgs: pageImg,
-          callback: (progress) => {
+          callback: (progress) => {     
            // console.log('进度：', progress);
            gsap.set(".bar", { width: progress + "%" });
            loadNum.value = progress;
          },
        }).then((res) => {
          console.log("加载完成");
          gsap.to(".LoadPage", {
            duration: 1,
            autoAlpha: 0,
@@ -66,11 +67,11 @@ onMounted(() => {
    <div class="load-container">
      <div class="load-icon"></div>
      <div class="load-box">
-        <div class="bar">
+        <div class="bar"></div>
-          <div class="bar-icon"></div>
+      </div>
-        </div>
+      <div class="load-num">
        <span class="num">{{ loadNum }}%</span>
      </div>
      <div class="load-num">{{ loadNum }}%</div>
    </div>
  </div>
 </template>
@@ -85,7 +86,8 @@ onMounted(() => {
  .load-bg {
    @include pos(750px, 100%, 0px, 50%);
    transform: translateY(-50%);
-    @include bg_pos("load/bg.jpg");
+    background-image: -webkit-linear-gradient(-90deg, #ffffff 15%, #4ebbe5 100%);
  }
  .load-container {
@@ -94,44 +96,46 @@ onMounted(() => {
    // transform: translateY(-50%);
    .load-icon {
-      @include pos(83px, 101px, 325px, 370px);
+      @include pos(409px, 215px,199px, 350px);
      @include bg_pos("load/icon.png");
    }
    .load-box {
-      @include pos(576px, 36px, 87px, 500px);
+      @include pos(582px, 45px, 83px, 450px);
-      border-radius: 20px;
+      border-radius: 25px;
-      overflow: hidden;
+      padding: 1px;
-      padding: 4.5px;
+      border: 1px solid rgb(243, 87, 4);
-      @include bg_pos("load/bar-box.png");
+
      .bar {
-        @include box(0%, 27px);
+        @include box(0%, 38px);
-        position: relative;
+        border-radius: 20px;
-        @include bg_pos("load/bar.png");
+        border: 1px solid rgb(255, 255, 255);
-        background-size: 551px 27px;
+
-        .bar-icon {
+        background-image: -webkit-linear-gradient(0deg, #f7c86f 0%, #f25501 100%);
-          @include box(35px, 36px);
+
          position: absolute;
          top: -4.5px;
          left: 95%;
          @include bg_pos("load/bar-icon.png");
        }
      }
    }
    .load-num {
-      @include pos(750px, 50px, 0px, 570px);
+      @include pos(235px, 80px, 256px, 511px);
-      text-align: center;
+
-      font-size: 38px;
+      @include flexCen();
-      color: rgb(255, 255, 255);
+
-      line-height: 40px;
+
-      font-weight: 700;
+      .num {
-      background: linear-gradient(to right, #dadada, #ffffff);
+        font-size: 40px;
-      background-clip: text;
+        color: #f25501;
-      -webkit-background-clip: text;
+        font-weight: 700;
-      -webkit-text-fill-color: transparent;
+
-      text-shadow: 0.9px 3.897px 0px rgba(44, 182, 255, 0.004);
+        /* 文字填充色 */
        text-shadow:
          -1px -1px 0 #ffffff,
          1px -1px 0 #ffffff,
          -1px 1px 0 #ffffff,
          1px 1px 0 #ffffff;
        /* 四个方向阴影叠加 */
      }
    }
    .btn {
--- a/src/components/MyPrize.vue
+++ b/src/components/MyPrize.vue
@@ -13,8 +13,6 @@ const { toClipboard } = useClipboard();
 const money = ref(userStore.prizeMoney);
 const code = ref(userStore.prizeCode);
 const hasPrize = ref(userStore.hasPrize);
 const copyFn = (event) => {
  let e = event.target;
@@ -48,24 +46,26 @@ onMounted(() => {
 </script>
 <template>
-  <div class="MyPrizePage" @touchmove.prevent>
+  <div class="MyPrizePage">
    <div class="myPrize-container">
-      <div v-if="hasPrize" class="myPrize-has-prize">
+      <div class="myPrize-title">恭喜您抽中</div>
-        <div class="myPrize-icon"></div>
+      <div class="myPrize-money">¥{{ money }}元</div>
-        <div class="myPrize-money">已获得¥{{ money }}元现金红包</div>
+      <div class="myPrize-text">奖励抽到手，快乐马上有</div>
-        <div class="myPrize-code-box">
+      <div class="myPrize-code-box">
-          <div class="code">兑换码：{{ code }}</div>
+        <span>兑奖码：</span>
-          <div class="myPrize-copy-btn" @click="copyFn($event)"></div>
+        <div class="code">{{ code }}</div>
-        </div>
+        <div class="myPrize-copy-btn" @click="copyFn($event)"></div>
        <div class="myPrize-tips">兑换流程：前往微信搜索【平安理财服务号】公众号发送“清凉一夏”获取兑奖链接，输入兑换码兑换奖品。</div>
      </div>
-      <div v-else class="myPrize-no-prize">
+      <div class="exchange-tips">
-        暂无中奖记录
+        兑换流程：前往微信搜索【平安理财服务号】公众号发送“端午安康”获取兑奖链接，输入兑换码兑换奖品
      </div>
      <div class="exchnage-tips2">
        （兑换码可在主页面“我的奖品” 再次查看并复制）
      </div>
      <div class="myPrize-cls-btn" @click="hide($event)"></div>
    </div>
    <div class="myPrize-cls-btn" @click="hide($event)"></div>
  </div>
-</template>  
+</template>
 <style lang="scss" scoped>
 .MyPrizePage {
@@ -75,76 +75,97 @@ onMounted(() => {
  .myPrize-container {
    position: relative;
-    @include box(683px, 585px);
+    @include box(665px, 731px);
-    @include bg_pos("prize/prize-box.png");
+    @include bg_pos("prize/myPrize-box2.png");
-    .myPrize-has-prize {
+    .myPrize-title {
-      @include pos(683px, 485px, 0px, 130px);
+      @include pos(390px, 100px, 110px, 140px);
      font-size: 40px;
      color: #e95b46;
      font-weight: 700;
      letter-spacing: 3px;
      // background-color: aqua;
      @include flexCen();
    }
    .myPrize-text {
      @include pos(390px, 100px, 110px, 300px);
      font-size: 30px;
      color: #e95b46;
      font-weight: 700;
      letter-spacing: 0;
      // background-color: aqua;
      @include flexCen();
    }
    .myPrize-money {
      @include pos(370px, 81px, 139px, 239px);
      display: flex;
-      flex-direction: column;
+      justify-content: center;
      // justify-content: space-around;
      align-items: center;
-      color: #0070d9;
+      color: #e95b46;
      font-weight: 700;
      font-size: 58px;
      letter-spacing: 4px;
    }
-      .myPrize-icon {
+    .myPrize-code-box {
-        @include box(204px, 214px);
+      @include pos(390px, 52px, 110px, 500px);
-        @include bg_pos("prize/lucky-bag.png");
+      display: flex;
-        margin: 20px auto;
+      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      font-size: 25px;
      font-weight: 700;
      color: #fff6cc;
      span {
        // height: 77px;
        line-height: 65px;
      }
-      .myPrize-money {
+      .code {
-        align-items: center;        
+        font-size: 25px;
        font-weight: 700;
-        font-size: 28px;
+        margin-right: 10px;
-        letter-spacing: 2px;
+        color: #fff6cc;
      }
-      .myPrize-code-box {
+      .myPrize-copy-btn {
-        display: flex;
+        @include box(77px, 39px);
-        flex-direction: row;
+        @include bg_pos("prize/copy-btn.png");
        align-items: center;
        width: 70%;
        .code {
          font-size: 20px;
          font-weight: 700;
          margin-right: 10px;
          color: #0070d9;
        }
        .myPrize-copy-btn {
          @include box(52px, 25px);
          @include bg_pos("prize/copy-btn.png");
        }
      }
      .myPrize-tips{
        width: 70%;
        font-size: 20px;
        line-height: 27px;
        // padding: 0px 100px;
      }
    }
-    .myPrize-no-prize{
+    .exchange-tips {
-      @include pos(683px, 485px, 0px, 130px);
+      @include pos(390px, 152px, 110px, 558px);
      display: flex;
-      flex-direction: column;
+      flex-direction: row;
-      // justify-content: space-around;
+      align-items: start;
-      align-items: center;
+      justify-content: flex-start;
-      color: #6b6b6b;
+      font-size: 20px;
-      font-size: 50px;
+      // font-weight: 700;
-      line-height: 400px;
+      color: #fff6cc;
-      pointer-events: none;
+      letter-spacing: 2px;
      // background-color: aqua;
    }
-    
+    .exchnage-tips2 {
-  }
+      @include pos(390px, 52px, 110px, 638px);
-  .myPrize-cls-btn {
+      display: flex;
-      @include box(43px, 43px);
+      flex-direction: row;
-      @include bg_pos("prize/cls-btn.png");
+      align-items: center;
-      margin-top: 50px;
+      justify-content: center;
      font-size: 15px;
      // font-weight: 700;
      color: #fff6cc;
      // background-color: aqua;
    }
    .myPrize-cls-btn {
      @include pos(82px, 82px, 517px, 114px);
      @include bg_pos("prize/cls-btn.png");
    }
  }
 }
-</style>
+</style>
--- a/src/components/Question.vue
+++ b/src/components/Question.vue
@@ -5,51 +5,39 @@ import { data } from "@/data";
 import { debounceTap, FYShuffle, mostValue, judgeBigScreen } from "@/plugins";
 import { useMainStore } from "@/store";
 import { subAnswer } from "@/api";
 import Preloader from "@/plugins/Preloader";
 import { pageResultImg } from "@/data/imgList";
 // 页面配置初始化
 const emit = defineEmits(["QuestionPage"]);
 const userStore = useMainStore();
 // 当前题目
-const currentId = ref(0); //当前id 0~11
+// const currentId = ref(props.questionId); //当前id 0~4
 const currentId = ref(0); //当前id 0~3
 const questionList = ref(data); //随机打乱题库
 const answerList = ref([]); // 答案库统计
 const activeId = ref(""); // 当前题目所选答案选项
 const showResultBtn = ref(false);
 const isChecked = ref(false);
 const checkedOption = ref("");
 const QaResult = ref(1); //当前答题结果
 const correctObj = ref({}); //当前正确选项
 // 答题事件
 const answerFn = (item, event) => {
  let e = event.target.parentElement;
  activeId.value = item.aid; //更新选中状态
  // console.log("选项", item);
  debounceTap(e, () => {
    let cid = questionList.value[currentId.value].id;
    let has = answerList.value.findIndex((obj) => obj.id === cid);
    // 答案库中未存在该题的结果则新增，存在则更新最新选项
    if (has == -1) {
      answerList.value.push({
        id: cid,
        aid: item.aid,
        answer: item.text,
      });
    } else {
      answerList.value[has].aid = item.aid;
      answerList.value[has].answer = item.text;
    }
-    gsap.set(".option-tips,.analysis", { autoAlpha: 1 });
+  debounceTap(e, () => {
    gsap.set(".answer-box", { pointerEvents: "none" });
    isChecked.value = true;
-    // console.log("currentId.value", currentId.value);
+    checkedOption.value = item;
-    if (currentId.value == 2) {
+    console.log("checkedOption", checkedOption.value);
-      // console.log("over");
+    QaResult.value = item.result;
-      gsap.set(".create-btn", { autoAlpha: 1 });
+
-    } else {
+    // 设置正确选项
-      gsap.set(".next-btn", { autoAlpha: 1 });
+    correctObj.value = questionList.value[currentId.value].answer.find(
-    }
+      (item) => item.result == 1
    );
    console.log("correctObj", correctObj.value);
    gsap.to(".qp-result ", { duration: 0.5, autoAlpha: 1, delay: 1 });
  });
 };
@@ -57,12 +45,16 @@ const answerFn = (item, event) => {
 const nextQuestion = (event) => {
  let e = event.target;
  debounceTap(e, () => {
-    isChecked.value = false;
+    gsap.to(".qp-result", {
-    gsap.set(".option-tips,.analysis", { autoAlpha: 0 });
+      duration: 0.5,
-    currentId.value++;
+      autoAlpha: 0,
-    activeId.value = "";
+      onComplete: () => {
-    gsap.set(".answer-box", { pointerEvents: "initial" });
+        isChecked.value = false;
-    gsap.set(".next-btn", { autoAlpha: 0 });
+        checkedOption.value = "";
        gsap.set(".answer-box", { pointerEvents: "auto" });
        currentId.value++;
      },
    });
  });
 };
@@ -70,8 +62,9 @@ const nextQuestion = (event) => {
 const viewResult = (event) => {
  let e = event.target;
  debounceTap(e, () => {
-    // 随机生成海报id
+    // 更新海报id
-    userStore.updatePosterId(getRandomNumber([1, 2, 3]));
+    userStore.posterId = currentId.value + 1;
    gsap.set(".question-box", { pointerEvents: "none" });
    Toast("答题结束");
    Toast.loading({
@@ -90,7 +83,7 @@ const viewResult = (event) => {
        setTimeout(() => {
          Toast.clear();
-          gsap.to(".QuestionPage", {
+          gsap.to(".QuestionPage,.qp-result", {
            duration: 0.5,
            autoAlpha: 0,
            onComplete: () => {
@@ -102,7 +95,7 @@ const viewResult = (event) => {
    } else {
      setTimeout(() => {
        Toast.clear();
-        gsap.to(".QuestionPage", {
+        gsap.to(".QuestionPage,.qp-result", {
          duration: 0.5,
          autoAlpha: 0,
          onComplete: () => {
@@ -114,41 +107,18 @@ const viewResult = (event) => {
  });
 };
 // 从数组中随机生成一个数字
 const getRandomNumber = (arr) => {
  var randomIndex = Math.floor(Math.random() * arr.length);
  return arr[randomIndex];
 };
 onMounted(() => {
  gsap.from(".question-bg", { duration: 0.5, autoAlpha: 0 });
-  gsap.from(".question-box", { duration: 0.5, y: 30, autoAlpha: 0 });
+  gsap.from(".question-box", { duration: 0.5, scale: 0.4, autoAlpha: 0 });
  gsap.from(".answer-box", {
    duration: 0.5,
    y: 30,
    autoAlpha: 0,
    onComplete: () => {
      // 开始加载答题页面资源
      Preloader({
        name: "加载结果页资源",
        imgs: pageResultImg,
        callback: (progress) => {
          // console.log("进度：", progress);
        },
      }).then((res) => {
        console.log("done!");
      });
    },
  });
  gsap.to(".question-tree", {
    duration: 3,
    transformOrigin: "0% 70%",
    rotation: "-10deg",
    repeat: -1,
    yoyo: true,
    ease: "none",
  });
 });
 const getClass = (item) => {
  if (isChecked.value) {
    if (checkedOption.value.aid == item.aid) {
      return item.result ? "correct" : "incorrect";
    }
  }
 };
 </script>
 <template>
@@ -156,12 +126,19 @@ onMounted(() => {
    <div class="question-bg"></div>
    <div class="question-container">
      <div class="question-box">
-        <div class="question-tree"></div>
+        <div class="question-serial">
-        <div class="question-con">
+          <div>
-          <!-- 问题序号 -->
+            <div class="serial-icon"></div>
-          <div class="qa-number">第{{ questionList[currentId].id }}题</div>
+            <div class="serial-text">
-          <div class="qa-question-box">
+              {{ ["题目一", "题目二", "题目三", "题目四"][currentId] }}
-            <!-- 问题 -->
+            </div>
          </div>
          <div class="serial-num">
            {{ currentId + 1 }}/{{ questionList.length }}
          </div>
        </div>
        <div class="qa-question-box">
          <div class="question">
            <div
              class="question-text"
              v-for="item in questionList[currentId].question"
@@ -170,242 +147,300 @@ onMounted(() => {
              {{ item }}
            </div>
          </div>
-        </div>
+          <!-- 选项 -->
-      </div>
+          <div class="answer-box">
-      <!-- 选项 -->
+            <div
-      <div class="answer-box">
+              class="answer"
-        <div
+              :class="getClass(item)"
-          class="answer"
+              v-for="item in questionList[currentId].answer"
-          v-for="(item, index) in questionList[currentId].answer"
+              :key="item.aid"
-          :class="[
+            >
-            isChecked ? item.result + '-text' : '',
+              <div class="answer-text">{{ item.aid }}.{{ item.text }}</div>
-            isChecked ? item.result + '-box' : '',
+              <div
-          ]"
+                class="result-icon"
-          :key="item.aid"
+                v-if="isChecked && item.aid == checkedOption.aid"
-        >
+              >
-          <div class="answer-text" v-for="a in item.text" :key="a">
+                <div
-            {{ item.aid }}.{{ a }}
+                  :class="item.result ? 'icon-correct' : 'icon-incorrect'"
                ></div>
              </div>
              <!-- 可点击区域 -->
              <div class="click-area" @click="answerFn(item, $event)"></div>
            </div>
          </div>
-          <div class="option-tips">
+          <!-- <div class="question-tips" v-for="(t, i) in questionList[currentId].tips" :key="i">
-            <div :class="item.result"></div>
+            <div v-if='questionList[currentId].tips.length == 1'>
-          </div>
+              {{ isChecked ? `${['回答错误！', '回答正确！'][checkedOption.result]}` : `提示：${t}` }}
-          <!-- 对话框气泡 -->
+            </div>
-          <div class="bubble-1"></div>
+            <div v-else>
-          <div :class="index == 0 ? 'bubble-left' : 'bubble-right'"></div>
+              {{ isChecked ? `${i == 0 ? ['回答错误！', '回答正确！'][checkedOption.result] : ''}` : `${i == 0 ? '提示：' : ''}${t}` }}
-          <!-- 可点击区域 -->
+            </div>
-          <div class="click-area" @click="answerFn(item, $event)"></div>
+          </div> -->
        </div>
        <div class="return-btn" @click="nextQuestion($event)"></div>
        <div class="create-btn" @click="viewResult($event)"></div>
      </div>
-      <!-- 解析 -->
+      <div class="question-gold-icon-1"></div>
-      <!-- <div class="analysis">
+    </div>
-        <div v-for="li in questionList[currentId].analysis" :key="li">
+  </div>
-          <span class="analysis-icon"></span>
+  <div class="qp-result">
-          {{ li }}
+    <div
-        </div>
+      class="qp-result-box"
-      </div> -->
+      :class="!QaResult ? 'qp-result-box-0' : 'qp-result-box-1'"
-      <div class="next-btn" @click="nextQuestion($event)"></div>
+    >
-      <div class="create-btn" @click="viewResult($event)"></div>
+      <div
        class="qp-result-icon"
        :class="!QaResult ? 'is-incorrect' : ''"
      ></div>
      <div class="qp-result-content">
        <div
          class="qp-result-text"
          :class="!QaResult ? 'text-bg-2' : 'text-bg-1'"
        >
          {{ QaResult ? "答对啦" : "答错啦" }}
        </div>
        <div class="qp-tips" v-if="!QaResult">
          答案:{{ correctObj.aid }}.{{ correctObj.text }}
        </div>
        <div class="qp-tips-text">解析：{{ questionList[currentId].tips[0] }}</div>
      </div>
    </div>
    <div
      class="next-btn"
      @click="
        currentId == questionList.length - 1
          ? viewResult($event)
          : nextQuestion($event)
      "
    >
      {{ currentId == questionList.length - 1 ? "查看结果" : "下一题" }}
    </div>
    <!-- 进度条 -->
    <Progress
      :percentage="((currentId + 1) / 3) * 100"
      pivot-color="#7232dd"
      :show-pivot="false"
      color="linear-gradient(to right, rgb(49, 116, 246), rgb(83, 131, 227))"
    />
  </div>
 </template>
-<style lang='scss' scope>
+<style lang="scss" scope>
 .QuestionPage {
-  @include pos(100%, 100%, 0px, 0px);
+  @include pos(100%, 1624px, 0px, 0px);
  overflow: hidden;
  .question-bg {
-    @include pos(750px, 1624px, 0px, 50%);
+    @include pos(750px, 1624px, 0px, 0px);
-    transform: translateY(-50%);
+    background-image: -webkit-linear-gradient(
-    @include bg_pos("qa/bg.jpg");
+      -90deg,
      #ffffff 15%,
      #4ebbe5 100%
    );
  }
  .question-container {
-    @include pos(750px, 1180px, 0px, 50%);
+    @include pos(750px, 1624px, 0px, 0px);
    transform: translateY(-50%);
    @include flexCen();
-    justify-content: space-around;
+    background-color: rgba($color: #000000, $alpha: 0.3);
    .question-box {
-      @include box(696px, 441px);
+      @include pos(727px, 769px, 22px, 308px);
-      @include bg_pos("qa/question-box.png");
+      @include bg_pos("qa/paper.png");
      position: relative;
-      .question-tree {
+      .question-serial {
-        @include pos(277px, 232px, -100px, -141px);
+        @include pos(560px, 90px, 110px, 34px);
        @include bg_pos("qa/tree.png");
      }
      .question-con {
        @include pos(696px, 441px, 0px, 0px);
        @include bg_pos("qa/question-box.png");
        .qa-number {
          @include pos(696px, 86px, 0px, 0px);
          font-size: 40px;
          color: #ffffff;
          font-weight: 700;
          display: flex;
          justify-content: center;
          align-items: center;
          text-align: justifyLeft;
          text-shadow: 0px 6px 6px rgba(49, 116, 246, 0.9);
        }
        .qa-question-box {
          @include pos(626px, 243px, 37px, 177px);
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          // 问题样式
          .question-text {
            width: 100%;
            font-family: "HarmonyOS_Sans_SC_Regular";
            font-size: 30px;
            letter-spacing: 1.5px;
            color: #065ac6;
            text-align: center;
            padding: 40px;
            text-align: justify;
            line-height: 55px;
          }
        }
      }
    }
    // 选项样式
    .answer-box {
      @include box(750px, 205px);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      color: #065ac6;
      font-size: 26px;
      line-height: 80px;
      margin-top: 40px;
      padding: 0 50px;
      font-family: "HarmonyOS_Sans_SC_Regular";
      .answer {
        display: flex;
        flex-direction: row;
-        justify-content: space-around;
+        flex-wrap: nowrap;
-        line-height: 75px;
+        justify-content: space-between;
-        height: 74px;
+        align-items: center;
-        padding: 0px 30px;
+        .serial-text {
-        border-radius: 50px;
+          color: #ffffff;
-        border: 1px solid rgb(255, 255, 255);
+          font-size: 40px;
        background-color: rgba(255, 255, 255, 0.361);
        position: relative;
        box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.361) inset;
        .answer-text {
          white-space: nowrap;
        }
-
+        .serial-num {
-        .bubble-1 {
+          font-size: 60px;
-          @include pos(55px, 5px, 88px, 7px);
+          padding-right: 20px;
-          @include bg_pos("qa/bubble-1.png");
+          color: transparent;
-        }
+          -webkit-text-stroke: 3px #ffffff; /* 控制描边粗细和颜色 */
-
+          text-stroke: 3px #ffffff;
-        .bubble-left {
+          opacity: 0.5;
          @include pos(26px, 15px, 88px, 72px);
          border: 10px solid transparent;
          border-top-color: rgba(255, 255, 255, 0.9);
          border-bottom: 0;
          margin-left: -10px;
          margin-bottom: -10px;
          // @include bg_pos("qa/jiao-1.png");
        }
        .bubble-right {
          @include box(26px, 15px);
          border: 10px solid transparent;
          border-top-color: rgba(255, 255, 255, 0.9);
          border-bottom: 0;
          margin-left: -5px;
          margin-bottom: -5px;
          position: absolute;
          top: 72px;
          right: 88px;
        }
        .click-area {
          @include pos(100%, 100%, 0px, 0px);
          border-radius: 47.5px;
          // background: rgba($color: #000000, $alpha: 0.5);
        }
      }
-      .correct-text {
+      .qa-question-box {
-        color: #e74c00;
+        @include pos(563px, 660px, 74px, 116px);
-        // background-color: rgba(255, 255, 255, 0.471);
+        display: flex;
-        box-shadow: 5px 5px 5px rgba(255, 240, 192, 0.471) inset;
+        flex-direction: column;
-      }
+        justify-content: flex-start;
        align-items: center;
-      .option-tips {
+        // 问题样式
-        @include box(40px, 40px);
+        .question {
-        visibility: hidden;
+          margin: 40px auto;
-        .correct {
+          .question-text {
-          @include box(74px, 74px);
+            font-family: "FZZY_Regular";
-          @include bg_pos("qa/correct.png");
+            font-size: 34px;
-          position: absolute;
+            color: #55240d;
-          right: -20px;
+            line-height: 50px;
-          top: 0px;
+            text-align: justify;
            font-weight: 700;
          }
        }
-        .incorrect {
+        // 选项样式
-          @include box(74px, 74px);
+        .answer-box {
-          @include bg_pos("qa/incorrect.png");
+          display: flex;
-          position: absolute;
+          flex-direction: column;
-          right: -20px;
+          align-items: center;
-          top: 0px;
+          justify-content: space-around;
          // height: 200px;
          // 选项通用样式
          .answer {
            width: 504px;
            position: relative;
            border-radius: 32.5px;
            display: flex;
            justify-content: center;
            align-items: center;
            border: 1px solid #fff;
            color: #9e4b00;
            background-color: #fff2b9;
            margin-bottom: 30px;
            padding: 10px 20px;
            .answer-text {
              font-size: 30px;
              line-height: 40px;
              @include flexCen();
            }
            .click-area {
              width: 100%;
              height: 100%;
              border-radius: 32.5px;
              position: absolute;
            }
            .result-icon {
              position: absolute;
              @include box(504px, 45px);
              top: 50%;
              transform: translateY(-55%);
              left: 460px;
              .icon-correct {
                @include box(76px, 56px);
                @include bg_pos("qa/correct.png");
              }
              .icon-incorrect {
                @include box(52px, 54px);
                @include bg_pos("qa/incorrect.png");
              }
            }
          }
          .correct {
            color: #ffe8b4;
            font-weight: 700;
            // background: linear-gradient(-45deg, #facc22, #f83600);
            background-color: #f83600;
            border: 2px solid #f0d0ad;
            // 外发光效果
            box-shadow: 0px 5px 10px rgba($color: #0188d5, $alpha: 0.5);
            border-radius: 32.5px;
          }
          .incorrect {
            color: #f83600;
            font-weight: 700;
          }
        }
        .question-tips {
          font-size: 25px;
          width: 100%;
          font-family: "FZZY_Regular";
          color: #ab7133;
          text-align: center;
          padding: 5px;
        }
      }
    }
    // 解析样式
    .analysis {
      visibility: hidden;
      width: 95%;
      font-family: "HarmonyOS_Sans_SC_Regular";
      font-size: 25px;
      color: #e74c00;
      text-align: justify;
      padding: 10px 50px;
      // height: 100px;
      .analysis-icon {
        display: inline-block;
        @include box(32px, 31px);
        @include bg_pos("qa/analysis-icon.png");
      }
    }
    .next-btn {
      @include box(256px, 70px);
      @include bg_pos("qa/next-btn.png");
      // display: none;
      visibility: hidden;
    }
    .create-btn {
      @include box(256px, 70px);
      @include bg_pos("qa/create-btn.png");
      // display: none;
      visibility: hidden;
    }
  }
 }
-</style>
+
 .qp-result {
  @include pos(100%, 1624px, 0px, 0px);
  overflow: hidden;
  @include flexCen();
  background-color: rgba($color: #000000, $alpha: 0.6);
  visibility: hidden;
  .qp-result-box {
    @include box(569px, 526px);
    position: relative;
    .qp-result-icon {
      @include pos(112px, 112px, 223px, -30px);
      @include bg_pos("qa/correct-icon.png");
    }
    .is-incorrect {
      @include bg_pos("qa/incorrect-icon.png");
    }
    .qp-result-content {
      @include pos(569px, 430px, 0px, 95px);
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      .qp-result-text {
        @include box(319px, 47px);
        text-align: center;
        width: 100%;
        font-size: 35px;
        color: #ffffff;
        margin: 20px auto;
      }
      .text-bg-1 {
        @include bg_pos("qa/tips-bg.png");
      }
      .text-bg-2 {
        @include bg_pos("qa/tips-bg-2.png");
      }
      .qp-tips {
        width: 80%;
        text-align: center;
        font-size: 25px;
        color: #ff0000;
      }
      .qp-tips-text {
        width: 100%;
        padding: 10px 20px;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color: #b3640d;
      }
    }
  }
  .qp-result-box-1 {
    @include bg_pos("qa/result-box.png");
  }
  .qp-result-box-0 {
    @include bg_pos("qa/result-box-2.png");
  }
  .next-btn {
    @include box(190px, 65px);
    border: 1px solid #ffffff;
    @include flexCen();
    font-size: 35px;
    color: #ffffff;
    border-radius: 31px;
    margin-top: 50px;
  }
 }
 </style>
--- a/src/components/Result.vue
+++ b/src/components/Result.vue
@@ -2,7 +2,7 @@
 import { gsap } from "gsap";
 import { debounceTap } from "@/plugins";
 import { useMainStore } from "@/store";
-import { posterCreate } from "@/plugins";
+
 import { Toast } from "vant";
 import QRCode from "qrcode";
 import { reactive } from "vue";
@@ -10,97 +10,85 @@ import { reactive } from "vue";
 // 页面配置初始化
 const emit = defineEmits(["ResultPage"]);
 const userStore = useMainStore();
-const posterId = ref(Math.floor(Math.random() * 3) + 1); //海报背景id：1～3
+const posterId = ref(userStore.posterId); //海报背景id：1～11
-const posterTextSrc = new URL(`../assets/images/result/poster-text.png`, import.meta.url).href
+console.log("海报id", posterId.value);
-const posterImgList = reactive([
+const posterImgSrc = new URL(
-  new URL(`../assets/images/result/poster-1.jpg`, import.meta.url).href,
+  `../assets/images/result/poster.jpg`,
-  new URL(`../assets/images/result/poster-2.jpg`, import.meta.url).href,
+  import.meta.url
-  new URL(`../assets/images/result/poster-3.jpg`, import.meta.url).href,
+).href;
 ]);
 // 生成二维码逻辑
 const eqcodePic = ref();
-onMounted(() => {
+onMounted(async () => {
-  console.log("posterId:", posterId.value);
+  // 执行任务队列
-  let eqCodeUrl = import.meta.env.VITE_URL;
+  await executeTasks();
  QRCode.toDataURL(eqCodeUrl)
    .then((url) => {
      eqcodePic.value = url;
      // console.log("eq", eqcodePic.value);
    })
    .catch((err) => {
      console.error(err);
    });
  gsap.from(".result-bg", {
    duration: 0.7,
    scale: 1.2,
    autoAlpha: 0,
  });
  gsap.from(".result-title", {
    duration: 0.7,
    y: 20,
    autoAlpha: 0,
    delay:0.3,
  });
  gsap.from(".r-text", {
    duration: 0.7,
    scale: .5,
    autoAlpha: 0,
    delay:0.5,
  });
  gsap.from(".create-poster", {
    duration: 0.7,
    y: 20,
    autoAlpha: 0,
    delay:1,
    onComplete:()=>{
      gsap.to('.create-poster',{duration:1,scale:'0.9',repeat:-1,yoyo:true,ease:'bounce.in'})
    }
  });
 });
-// 生成海报逻辑
+// 这是新加的函数封装异步任务
-const createPoster = (event) => {
+const executeTasks = async () => {
-  let e = event.target.parentElement;
+  console.log("二维码生成中...");
  debounceTap(e, () => {
    // 海报生成
    posterCreate(
      { width: 750, height: 1334 }, //海报尺寸
      // 海报素材，按顺序依次渲染
      [
        // 背景
        {
          name: "bg",
          src: posterImgList[posterId.value - 1],
          pos: { w: 750, h: 1334, x: 0, y: 0 },
        },
        //   二维码
        {
          name: "eqcode",
          src: eqcodePic.value,
          pos: { w: 194, h: 195, x: 502, y: 1090 },
        },
        // 文案
        {
          name: "text",
          src: posterTextSrc,
          pos: { w: 347, h: 155, x: 81, y: 1113 },
        },
      ]
    );
-    // gsap.to('.posterPop',{duration:0.5,autoAlpha:1})
+  // 生成二维码
  const eqCodeUrl = import.meta.env.VITE_URL;
  eqcodePic.value = await QRCode.toDataURL(eqCodeUrl);
  console.log("生成海报中...");
  if (posterImgSrc && eqcodePic.value) {
    posterCreate({ width: 750, height: 2502 }, [
      { name: "bg", src: posterImgSrc, pos: { w: 750, h: 2502, x: 0, y: 0 } },
      {
        name: "eqcode",
        src: eqcodePic.value,
        pos: { w: 187, h: 187, x: 527, y: 2227 },
      },
    ]);
  } else {
    Toast.fail({ message: "生成失败" });
    emit("ResultPage", { action: "hide" });
  }
 };
 const showPoster = () => {
  gsap.to(".posterPop", {
    duration: 0.3,
    autoAlpha: 1,
  });
  gsap.from(".poster-title", {
    duration: 0.7,
    scale: 0.3,
    autoAlpha: 0,
  });
  gsap.from(".poster-box", {
    duration: 0.7,
    scale: 0.6,
    autoAlpha: 0,
  });
  gsap.from(".save-tips", {
    duration: 0.7,
    scale: 0.7,
    autoAlpha: 0,
    delay: 0.3,
  });
  gsap.from(".go-draw", {
    duration: 0.7,
    y: -30,
    autoAlpha: 0,
    delay: 0.5,
  });
  gsap.from(".go-share", {
    duration: 0.7,
    y: -30,
    autoAlpha: 0,
    delay: 0.7,
  });
 };
 // 去抽奖
 const goDraw = (event) => {
-  let e = event.target.parentElement;
+  let e = event.target;
  console.log('e',e);
  debounceTap(e, () => {
    if (userStore.hasDraw) {
      emit("ResultPage", { action: "showDraw" });
@@ -114,13 +102,32 @@ const goDraw = (event) => {
 const hidePop = (event) => {
  let e = event.target;
  debounceTap(e, () => {
-    gsap.to(".posterPop", { duration: 0.5, autoAlpha: 0 });
+    gsap.to(".posterPop", {
      duration: 0.5,
      autoAlpha: 0,
      onComplete: () => {
        emit("ResultPage", { action: "hide" });
      },
    });
  });
 };
 const hide = (event) => {
  let e = event.target;
  debounceTap(e, () => {
    gsap.to(".posterPop", {
      duration: 0.5,
      autoAlpha: 0,
      onComplete: () => {
        emit("ResultPage", { action: "showQuestion" });
      },
    });
  });
 };
 // 展示分享
 const goShare = (event) => {
-  let e = event.target.parentElement;
+  let e = event.target;
  debounceTap(e, () => {
    gsap.to(".sharePop", { duration: 0.5, autoAlpha: 1 });
  });
@@ -130,39 +137,96 @@ const goShare = (event) => {
 const hideShare = () => {
  gsap.to(".sharePop", { duration: 0.5, autoAlpha: 0 });
 };
 // 海报生成
 const posterCreate = (option, imageArr) => {
  let posterUrl = "";
  const { width, height } = option;
  Toast.loading({
    message: "海报生成中",
    duration: 0,
    forbidClick: true,
  });
  let mycanvas = document.createElement("canvas"); // 创建一个canvas画布元素
  let ctx = mycanvas.getContext("2d");
  mycanvas.style.width = `${width}px`; //设置canvas的宽
  mycanvas.style.height = `${height}px`; //设置canvas的高
  mycanvas.width = width;
  mycanvas.height = height;
  //Promise对象加载资源
  let loader_p = [];
  imageArr.map((item) => {
    const _p = new Promise((resolve) => {
      const img = new Image();
      img.crossOrigin = "Anonymous";
      img.onload = () => {
        resolve(img);
      };
      img.src = item.src;
    });
    loader_p.push(_p);
  });
  //Promise的.all方法，当所有预加载的图像加载好的回调函数
  Promise.all(loader_p)
    .then((imgList) => {
      console.log("imgList", imgList);
      // 图片素材遍历绘制
      imgList.map((item, index) => {
        ctx.drawImage(
          item,
          imageArr[index].pos.x,
          imageArr[index].pos.y,
          imageArr[index].pos.w,
          imageArr[index].pos.h
        ); //原生canvas的绘制图片方法，直接百度搜索 `js drawImage`查看方法的参数
      });
      //海报绘制完 ，转成图片对象
      return mycanvas.toDataURL("image/jpeg", 1);
    })
    .then((baseURL) => {
      //返回的图片地址，就是最后海报的地址，可以放在DOM显示
      let posterImg = document.querySelector("#posterSrc");
      posterImg.src = baseURL;
      setTimeout(() => {
        // 展示海报
        showPoster();
        Toast.success({ message: "生成成功！" });
      }, 500);
    })
    .catch((error) => {
      console.error("生成海报失败");
      gsap.to(".posterPop", {
        duration: 0.5,
        autoAlpha: 0,
        onComplete: () => {
          emit("ResultPage", { action: "hide" });
        },
      });
      Toast.fail({ message: "生成失败，请重试！" });
    });
  // return posterUrl
 };
 </script>
 <template>
  <div class="ResultPage" @touchmove.prevent>
    <div :class="'result-bg-' + posterId" class="result-bg"></div>
    <div class="result-container">
      <!-- 标题 -->
      <div class="result-title"></div>
      <!-- 文案 -->
      <div :class="'r-text-' + posterId" class="r-text"></div>
      <!-- 生成海报按钮 -->
      <div class="create-poster" >
        <div class="r-click-area" @click="createPoster($event)"></div>
      </div>
    </div>
  </div>
  <!-- 海报弹窗 -->
  <div class="posterPop" @touchmove.prevent>
-    <div class="cls-btn-box">
+    <div class="poster-bg"></div>
-      <div class="cls-btn" @click="hidePop($event)"></div>
+    <div class="poster-container">
-    </div>
+      <div class="poster-title"></div>
-    <div class="poster-box">
+      <div class="poster-box">
-      <div class="poster" :class="'poster-' + posterId">
+        <div class="poster">
-        <img id="posterSrc" src="" alt="" srcset="" />
+          <img id="posterSrc" src="" alt="" srcset="" />
        </div>
        <!-- <div class="poster-cls-btn" @click="hide($event)"></div> -->
      </div>
-    </div>
+      <div class="save-tips">*长按保存海报</div>
-    <div class="save-tips">*长按保存海报</div>
+      <div class="btn-box">
-    <div class="btn-box">
+        <div class="go-draw" @click="goDraw($event)"></div>
-      <div class="go-draw" >
+        <div class="go-share" @click="goShare($event)"></div>
        <div class="r-click-area" @click="goDraw($event)"></div>
      </div>
      <div class="go-share" >
        <div class="r-click-area" @click="goShare($event)"></div>
      </div>
    </div>
  </div>
@@ -171,135 +235,77 @@ const hideShare = () => {
    <div class="tips-pic"></div>
    <div class="tips-text">点击右上角分享给你的好友！</div>
  </div>
-</template>  
+</template>
 <style lang="scss" scoped>
 .ResultPage {
  @include fixed();
  background-color: azure;
  .result-bg-1 {
    @include pos(750px, 1624px, 0px, 50%);
    @include bg_pos("result/r-bg-1.jpg");
    transform: translateY(-50%);
    pointer-events: none;
  }
  .result-bg-2 {
    @include pos(750px, 1624px, 0px, 50%);
    @include bg_pos("result/r-bg-2.jpg");
    transform: translateY(-50%);
    pointer-events: none;
  }
  .result-bg-3 {
    @include pos(750px, 1624px, 0px, 50%);
    @include bg_pos("result/r-bg-3.jpg");
    transform: translateY(-50%);
    pointer-events: none;
  }
  .result-container {
    @include pos(750px, 1624px, 0px, 50%);
    transform: translateY(-50%);
    .result-title {
      @include pos(537px, 116px, 118px, 258px);
      @include bg_pos("result/title.png");
      pointer-events: none;
    }
    .r-text {
      pointer-events: none;
    }
    .r-text-1 {
      @include pos(642px, 865px, 67px, 396px);
      @include bg_pos("result/text-1.png");
    }
    .r-text-2 {
      @include pos(644px, 830px, 59px, 407px);
      @include bg_pos("result/text-2.png");
    }
    .r-text-3 {
      @include pos(642px, 876px, 63px, 392px);
      @include bg_pos("result/text-3.png");
    }
    .create-poster {
      @include pos(337px, 151px, 206px, 1253px);
      @include bg_pos("result/create-btn.png");
      .r-click-area {
      @include pos(256px, 69px, 35px, 14px);
    }
    }
  }
 }
 .posterPop {
-  @include fixed();
+  @include pos(100%, 1624px, 0px, 0px);
-  @include flexCen();
+  overflow: hidden;
-  background-color: rgba($color: #000000, $alpha: 0.6);
+  background: linear-gradient(135deg, #d6d1ca, #e5dccf);
  visibility: hidden;
-  .cls-btn-box {
+  .poster-bg {
-    width: 617px;
+    @include pos(750px, 1624px, 0px, 0px);
-    display: flex;
+    // transform: translateY(-50%);
-    justify-content: flex-end;
+    @include bg_pos("index/bg.jpg");
  }
-    .cls-btn {
+  .poster-container {
-      @include box(43px, 43px);
+    @include pos(750px, 1624px, 0px, 0px);
-      @include bg_pos("result/cls-btn.png");
+    @include flexCen();
-      margin-right: -20px;
+    background-color: rgba($color: #000000, $alpha: 0.3);
    .poster-title {
      @include box(592px, 156px);
      @include bg_pos("index/title.png");
    }
  }
-  .save-tips {
+    .save-tips {
-    font-size: 20px;
+      font-size: 20px;
-    line-height: 20px;
+      line-height: 20px;
-    margin-top: 20px;
+      color: #ffffff;
-    color: #fff;
+      letter-spacing: 2px;
-    letter-spacing: 2px;
+    }
  }
-  .poster-box {
+    .poster-box {
-    @include box(617px, 881px);
+      @include box(720px, 882px);
-    margin-top: 20px;
+      margin-top: 20px;
    overflow: hidden;
    .poster {
      @include box(100%, 100%);
      overflow: hidden;
-      display: flex;
+      position: relative;
-      justify-content: center;
+
-      #posterSrc {
+      .poster-cls-btn {
-        // @include box(100%, 100%);
+        @include pos(53px, 53px, 660px, 10px);
-        width: 80%;
+        @include bg_pos("result/cls-btn.png");
-        border: 1px solid #fff;
+      }
-        border-radius: 20px;
+
-        // opacity: 0;
+      .poster {
        @include box(100%, 100%);
        overflow: hidden;
        @include bg_pos("result/card.png");
        #posterSrc {
          @include box(100%, 100%);
          opacity: 0;
        }
      }
    }
  }
-  .btn-box {
+    .btn-box {
-    @include box(650px, 76px);
+      @include box(550px, 91px);
-    display: flex;
+      display: flex;
-    justify-content: space-around;
+      justify-content: space-between;
-    margin-top: 20px;
+      align-items: center;
-    .r-click-area {
+      margin-top: 20px;
      @include pos(256px, 69px, 35px, 14px);
    }
-    .go-draw {
+      .go-draw {
-      @include box(337px, 151px);
+        @include box(243px, 91px);
-      @include bg_pos("result/go-draw-btn.png");
+        @include bg_pos("result/go-draw-btn.png");
-      position: relative;
+      }
    }
-    .go-share {
+      .go-share {
-      @include box(337px, 151px);
+        @include box(243px, 91px);
-      @include bg_pos("result/go-share-btn.png");
+        @include bg_pos("result/go-share-btn.png");
-      position: relative;
+      }
    }
  }
 }
@@ -310,16 +316,16 @@ const hideShare = () => {
  visibility: hidden;
  .tips-pic {
-    @include pos(100px, 100px, 600px, 100px);
+    @include pos(100px, 100px, 600px, 180px);
    @include bg_pos("result/share-tips.svg");
    stroke: #ffffff;
  }
  .tips-text {
    font-size: 25px;
-    @include pos(750px, 100px, 0px, 220px);
+    @include pos(750px, 100px, 0px, 300px);
    color: #ffffff;
    text-align: right;
  }
 }
-</style>
+</style>
--- a/src/components/Rule.vue
+++ b/src/components/Rule.vue
@@ -17,11 +17,11 @@ let scroll = ref()
 onMounted(() => {
    let wrapper = document.querySelector('.wrapper')
-     scroll.value = new BScroll(wrapper)
+    scroll.value = new BScroll(wrapper)
    gsap.from(".RulePage", { duration: 0.2, autoAlpha: 0 });
    gsap.from(".rule-container", { duration: 0.5, autoAlpha: 0, scale: 0.7 });
-    gsap.to(".rule-arrow", { duration: 2.5, y: 10,repeat:-1,yoyo:true  });
+    gsap.to(".rule-arrow", { duration: 2.5, y: 10, repeat: -1, yoyo: true });
 });
 </script>
@@ -32,49 +32,53 @@ onMounted(() => {
                <div class="rule-content">
                    <div class="rule-text-area wrapper">
                        <div>
-                        <div class="part">
+                            <div class="part">
-                            <div>活动时间：</div>
+                                <div>活动时间：2025年5月29日——5月31日</div>
-                            <div>2024年8月14日8:30-2024年8月16日17:30</div>
+                                <div>活动奖励：微信红包</div>
-                            <div>活动奖励：微信红包</div>
+                            </div>
                            <div class="part">
                                <div>活动攻略：</div>
                                <div>
                                    1、【龙舟争渡 稳健为先——端午赛龙舟中的投资哲学】活动共设计4道题目，首页进入后点击进行答题，全部答对即可获取专属赛龙舟海报，并参与抽奖；答错时刷新即可重新回答本题。
                                </div>
                                <div>2、活动期间不限制参与答题次数，每人每日有1次抽奖机会。</div>
                            </div>
                            <div class="part">
                                <div>领奖说明：</div>
                                <div>
                                    1、中奖后在中奖页面复制兑换码，前往<span
                                        class="blod">[平安理财服务号]</span>消息框输入“端午安康”获取兑换链接，进入链接输入兑换码兑换奖品。如关闭了中奖界面，可在首页-[我的奖品]
                                    内查看兑换码；
                                </div>
                                <div>2、成功领奖后，奖品将会在24小时内自动到账，请耐心等候；</div>
                                <div>3、中奖人请在活动结束前进行兑换，逾期视为弃权。</div>
                            </div>
                            <div class="part">
                                <div>其他：</div>
                                活动期间如遇到任何问题，请在<span class="blod">[平安理财服务号]</span>后台咨询，我们会在一个工作日内回复。
                                <div>说明：平安理财有权对活动规则进行解释</div>
                            </div>
                            <div class="part">
                                <div>活动说明：</div>
                                <div>
                                    （1）本活动由平安理财有限责任公司主办，为保证活动的公平公正，活动结束后主办方将对中奖用户信息进行核对，用户若有下列任何一种行为或情况的，主办方有权不经另行通知，取消其参与活动以及获奖资格，收回奖品权益，并保留追究其法律责任的权利：
                                </div>
                                <div>
                                    (2)以任何机器人软件、蜘蛛软件、爬虫软件、刷奖软件或其它任何自动方式、不正当手段等参与本活动;同一用户(包含相同手机号、相同收货信息、相同移动设备号、相同IP地址等）单日内恶意切换微信账号参加活动，扰乱正常抽奖秩序，影响活动公平性的；
                                </div>
                                <div>
                                    (3)有任何违反法律法规、诚实信用、公序良俗、公平公正、平安理财平台规则等行为；
                                </div>
                                <div>
                                    (4)平安理财保留调整、暂停和终止本活动的权利，并经公告后生效；
                                </div>
                                <div>
                                    (5)用户参与本活动，即视为理解并同意本活动细则。在法律法规及监管规定的范围内，平安理财有权对活动规则进行解释，并根据活动实际情况对本活动的规则进行变动或调整，相关变动或调整将公布在规则页面，并于公布时即时生效。
                                </div>
                            </div>
                            <div class="margin-bottom-area"></div>
                        </div>
                        <div class="part">
                            <div>活动攻略：</div>
                            <div>
                                1、进入活动参加【好“理”在手，邂逅清凉一夏】答题，共设计3道题目，全部选择完毕后即可参与抽奖活动；
                            </div>
                            <div>2、活动期间不限制参与答题次数，每人每日有1次抽奖机会。</div>
                        </div>
                        <div class="part">
                            <div>领奖说明：</div>
                            <div>
                                <span class="blod">1、中奖后在中奖页面复制兑换码，前往[平安理财服务号] 消息框输入“清凉一夏”获取兑换链接，进入链接输入兑换码兑换奖品。</span>如关闭了中奖界面，可在首页-[我的奖品] 内查看兑换码；
                            </div>
                            <div>2、成功领奖后，奖品将会在24小时内自动到账，请耐心等候；</div>
                            <div>3、中奖人请在活动结束前进行兑换，逾期视为弃权。</div>
                        </div>
                        <div class="part">
                            <div>其他说明：</div>
                            <div>
                                1、本活动由平安理财有限责任公司主办，为保证活动的公平公正，活动结束后主办方将对中奖用户信息进行核对，用户若有下列任何一种行为或情况的，主办方有权不经另行通知，取消其参与活动以及获奖资格，收回奖品权益，井保留追究其法律责任的权利:
                            </div>
                            <div>
                                (1) 以任何机器人软件、蜘蛛软件、爬虫软件、刷奖软件或其它任何自动方式不正当手段等参与本活动；
                            </div>
                            <div>
                                (2) 同一用户(包含相同手机号、相同收货信息、相同移动设备号、相同IP地址等) 单日内恶意切换微信账号参加活动，扰乱正常抽奖秩序，影响活动公平性的;
                            </div>
                            <div>
                                (3) 有任何违反法律法规、诚实信用、公序良俗、公平公正、平安理财平台规则等行为;
                            </div>
                            <div>
                                2、平安理财保留调整、暂停和终止本活动的权利，并经公告后生效;
                            </div>
                            <div>
                                3、用户参与本活动，即视为理解并同意本活动细则。在法律规定的范围内，平安理财有权对活动规则进行解释，并根据活动实际情况对本活动的规则进行变动或调整，相关变动或调整将公布在规则页面，并于公布时即时生效。
                            </div>
                        </div>
                        <div class="margin-bottom-area"></div>
                    </div>
                    </div>
                </div>
                <div class="rule-bottom-bg"></div>
@@ -84,49 +88,49 @@ onMounted(() => {
        </div>
        <div class="rule-cls-btn" @click="hide($event)"></div>
    </div>
-</template>  
+</template>
 <style lang="scss" scoped>
 .RulePage {
    @include fixed();
    @include flexCen();
-    background-color: rgba($color: #000000, $alpha: 0.7);
+    background-color: rgba($color: #000000, $alpha: 0.3);
    .rule-container {
        position: relative;
-        @include box(664px, 861px);
+        @include box(708px, 880px);
        overflow: hidden;
        .content {
            .rule-content {
-                @include box(663px, 861px);
+                @include box(708px, 880px);
                @include bg_pos("rule/rule-box.png");
                position: relative;
                overflow: hidden;
                .rule-text-area {
-                    @include pos(663px, 645px, 0px, 131px);
+                    @include pos(635px, 709px, 25px, 83px);
                    overflow: hidden;
                    // overflow-y: scroll;
-                    padding: 0px 50px;
+                    padding: 0px 20px;
-                    
+
                    .part {
-                        color: #0070d9;
+                        color: #a74f00;
-                        font-size: 24px;
+                        font-size: 20px;
-                        line-height: 40px;
+                        line-height: 35px;
                        margin-top: 30px;
                        text-align: justify;
                        padding: 0 10px;
                        font-family: 'HarmonyOS_Sans_SC_Regular';
                    }
-                    .blod{
+                    .blod {
                        font-weight: 700;
-                        color: #0070d9;
+                        color: #a74f00;
                    }
-                    .margin-bottom-area{
+                    .margin-bottom-area {
                        // margin-bottom: 100px;
                        height: 100px;
                    }
@@ -134,30 +138,32 @@ onMounted(() => {
            }
            .rule-arrow {
-                @include pos(149px, 84px, 257px, 712px);
+                @include pos(161px, 102px, 262px, 682px);
                @include bg_pos("rule/arrow.png");
                pointer-events: none;
            }
            .rule-bottom-bg {
-                // visibility: hidden;
+                // @include pos(685px, 102px, 0px, 712px);
-                @include pos(600px, 102px, 30px, 728px);
+                // border-radius: 10px;
-                pointer-events: none;
+                // pointer-events: none;
-                background-image: -webkit-linear-gradient( 90deg, rgba(0, 112, 217, 0.1) , rgba(255, 255, 255, 0.1) 100%);
+                // background-image: -webkit-linear-gradient(90deg, rgba(255, 238, 186, 0.7), rgba(255, 255, 255, 0.1) 100%);
            }
            .rule-icon {
-                @include pos(165px, 180px, 517px, 666px);
+                @include pos(121px, 104px, 501px, 25px);
                @include bg_pos("rule/icon.png");
                pointer-events: none;
            }
-            
+
        }
    }
    .rule-cls-btn {
-        @include box(43px, 43px);
+        @include box(49px, 49px);
        @include bg_pos("rule/cls-btn.png");
-        margin-top: 40px;
+        margin-top: 0px;
    }
 }
 </style>
--- a/src/data/imgList.js
+++ b/src/data/imgList.js
@@ -1,69 +1,52 @@
-const load = ["load/icon.png", "load/bg.jpg"];
+const load = [
-
+  "load/icon.png",
-const page = [
+  "music-on.png",
-  "index/logo.png",
+  "music-off.png",
-  "index/rule-btn.png",
+  "share.jpg",
-  "index/sub-title.png",
+  "orientation-icon.png",
  "index/cloud-2.png",
  "index/prize-btn.png",
  "index/cloud-1.png",
  "index/bg.jpg",
  "index/start-btn.png",
  "index/tree-1.png",
  "index/title.png",
  "index/island.png",
  "rule/cls-btn.png",
  "rule/arrow.png",
  "rule/rule-box.png",
  "rule/icon.png",
 ];
-// 问题页面
+const page = [
-const pageQA = [
+  "index/title.png",
-  "qa/bubble-1.png",
+  "index/time.png",
-  "qa/analysis-icon.png",
+  "index/btn.png",
-  "qa/create-btn.png",
+  "index/logo.png",
-  "qa/next-btn.png",
+  "index/bg.jpg",
  "qa/incorrect.png",
  "qa/correct.png",
  "qa/question-box.png",
  "qa/tree.png",
  "qa/bg.jpg",
 ]
 // 结果页面
 const pageResult = [
  "prize/copy-btn2.png",
  "prize/copy-btn.png",
  "prize/cls-btn.png",
  "prize/got-btn.png",
  "prize/no-get-btn.png",
  "prize/draw-text.png",
  "prize/tips.png",
  "prize/no-prize.png",
  "prize/lucky-bag.png",
  "prize/star.png",
  "prize/myPrize-box2.png",
  "prize/no-prize.png",
  "prize/light.png",
  "prize/prize-box.png",
  "prize/myPrize-box.png",
  "prize/draw-text.png",
  "prize/cls-btn.png",
  "prize/copy-btn.png",
  "prize/draw-box.png",
  "qa/text-bg.png",
  "qa/result-box.png",
  "qa/incorrect.png",
  "qa/paper.png",
  "qa/incorrect-icon.png",
  "qa/correct-icon.png",
  "qa/correct.png",
  "qa/result-box-2.png",
  "qa/tips-bg.png",
  "qa/tips-bg-2.png",
  "result/poster.jpg",
  "result/card.png",
  "result/cls-btn.png",
  "result/poster-text.png",
  "result/go-draw-btn.png",
  "result/go-share-btn.png",
-  "result/text-1.png",
+  "result/bg.jpg",
-  "result/title.png",
+
-  "result/create-btn.png",
+  "rule/rule-box.png",
-  "result/text-3.png",
+  "rule/arrow.png",
-  "result/text-2.png",
+  "rule/cls-btn.png",
-  "result/r-bg-2.jpg",
+  "rule/icon.png",
-  "result/r-bg-1.jpg",
+];
  "result/r-bg-3.jpg",
  // "result/poster-1.jpg",
  // "result/poster-3.jpg",
  // "result/poster-2.jpg",
 ]
 // 处理为vite引入图片格式
 function imgCreate(url, img) {
@@ -71,15 +54,8 @@ function imgCreate(url, img) {
  img.push(i);
 }
 const loadImg = [];
 const pageImg = [];
 const pageQAImg = [];
 const pageResultImg = [];
 load.forEach((element) => {
  imgCreate(element, loadImg);
@@ -89,12 +65,4 @@ page.forEach((element) => {
  imgCreate(element, pageImg);
 });
-pageQA.forEach((element) => {
+export { loadImg, pageImg };
  imgCreate(element, pageQAImg);
 });
 pageResult.forEach((element) => {
  imgCreate(element, pageResultImg);
 });
 export { loadImg, pageImg,pageQAImg,pageResultImg };
--- a/src/data/index.js
+++ b/src/data/index.js
@@ -1,72 +1,78 @@
 export const data = [
-    {
+  {
-        id: 1,
+    id: 1,
-        type: '1',
+    question: [
-        question: [
+      "赛龙舟时，鼓手用节奏统一行动，舵手把控方向，划手齐心发力，三者缺一不可。这体现了哪种投资模式？",
-            '低波稳健类产品通常是指配置大比例低波资产，不投资权益类资产的产品 \n，受债市波动影响较小且不受股市影响。低波稳健类产品的产品风险评级是哪个？',
+    ],
-        ],
+    answer: [
-        answer: [
+      {
-            {
+        aid: "A",
-                aid: 'A',
+        text: "平台化高效协作投资模式，集体智慧",
-                text: [
+        result: 1,
-                    'R1低风险或R2中低风险',
+      },
-                ],
+      {
-                result:'correct',
+        aid: "B",
-            },
+        text: "明星基金经理的单打独斗，个人英雄主义",
-            {
+        result: 0,
-                aid: 'B',
+      },
-                text: [
+    ],
-                    'R4及以上高风险',
+    tips: [`平安理财采取平台化、模块化的投资模式，通过团队作战能更好协调更优势、更广泛的资源，并最终为客户创造可持续的投资收益，截至 2025 年 5月15日已累计为 1700 万名客户创造1092亿元投资收益。`],
-                ],
+  },
-                result:'incorrect',
+  {
-            },
+    id: 2,
-        ],
+    question: [
-        analysis: ['解析：选择B。虽然市场热点可能带来诱人的收益，但理财的基本原则是风险管理。通过将投资分散在不同的理财产品和市场，可以降低单一投资的风险，争取资产增长的机会。']
+      "赛龙舟经常会遇上河道弯曲或河流湍急，常常出现翻船风险，为了确保顺利抵达终点，在拐弯及面对急流时所使用的技巧与投资中的哪种情况相符？",
-    },
+    ],
-    {
+    answer: [
-        id: 2,
+      {
-        question: [
+        aid: "A",
-            '经常热衷于购买现金管理类产品的投资者，如果希望进行“稳健的理财进阶”，需要牺牲一定流动性换取收益空间，以下哪类产品可以帮助实现：',
+        text: "追求单车变摩托，冒险前进，重仓搏一把",
-        ],
+        result: 0,
-        answer: [
+      },
-            {
+      {
-                aid: 'A',
+        aid: "B",
-                text: [
+        text: "坚持绝对收益目标，严格风险控制，稳健为先",
-                    '最短持有期类理财产品',
+        result: 1,
-                ],
+      },
-                result:'correct',
+    ],
-            },
+    tips: [`稳健是资产长期增值的关键，平安理财坚持以绝对收益为目标，截至2025年5月15日，旗下定开/封闭式多个产品线实现历史到期兑付100%正收益（如启航系列、稳健精选系列、启元系列、新安鑫系列、卓越成长系列、卓越稳健系列等）。`],
-            {
+  },
-                aid: 'B',
+  {
-                text: [
+    id: 3,
-                    '混合类理财产品',
+    question: [
-                ],
+      "赛龙舟中，队伍需在发令枪响的瞬间同步起桨，冲刺阶段更需高频划桨。这与下列哪种投资策略相符？",
-                result:'incorrect',
+    ],
-            },
+    answer: [
-        ],
+      {
-        analysis: ['解析：选择B。现金类产品具有高流动性的特征，更适合日常流动资金。但在长期限选择中，固收理财拥有较大的投资范围和空间，运用策略提供稳健体验，有效平衡风险，力争增厚收益机会，闲钱再进阶。因此不同的资金用途记得匹配不同产品噢。']
+        aid: "A",
-    },
+        text: "精准把握市场机会，适当追求超额收益",
-    {
+        result: 1,
-        id: 3,
+      },
-        question: [
+      {
-            '低波稳健类理财通常会通过估值、资产、策略三方面实现“低波稳健”的特征，以下哪个描述是正确的：',
+        aid: "B",
-        ],
+        text: "一旦配置长期不动，顺其自然随遇而安",
-        answer: [
+        result: 0,
-            {
+      },
-                aid: 'A',
+    ],
-                text: [
+    tips: [`稳健为先的前提下，平安理财通过多资产、多策略的能力优势，在低利率时代中力争为投资者创造相对不错的超额收益。如鑫享全球动量策略日开180天持有1号A今年以来年`],
-                    '精选存单存款等低波资产的理财产品更稳健',
+  },
-                ],
+  {
-                result:'correct',
+    id: 4,
-            },
+    question: [
-            {
+      "赛龙舟通常500米，但有一种达到了30公里，号称龙舟马拉松。如果说500米赛龙舟对应的是投资中短期主义，那么龙舟马拉松对应的是哪种情怀？",
-                aid: 'B',
+    ],
-                text: [
+    answer: [
-                    '混合估值法不能在市场震荡时帮助净值更平稳',
+      {
-                ],
+        aid: "A",
-                result:'incorrect',
+        text: "投机主义，左右摇摆或见风使舵",
-            },
+        result: 0,
-        ],
+      },
-        analysis: ['解析：选择A。最短持有期理财产品拥有较为灵活的申赎机制，在持有时间超过最短持有的时间要求后，随时可发起赎回，闲置时力争收益机会，用钱时满足你的流动性需求。']
+      {
-    },
+        aid: "B",
-]
+        text: "长期主义精神，坚持长期稳健经营理念",
        result: 1,
      },
    ],
    tips: [`行稳方能致远。长期主义是以长远视角进行决策和行动的价值观，其核心在于追求可持续的价值增长，而非短期利益的最大化。这是平安理财自成立以来一直坚持的投资和经营理念。`],
  },
 ];
--- a/src/page/Home/App.vue
+++ b/src/page/Home/App.vue
@@ -1,12 +1,25 @@
 <template>
-  <div class="home" @click.once="playMusic">
+  <div class="home" @click.once="firstClick">
-    <Index v-if="showIndex" @IndexPage="indexFn"></Index>
+    <div class="home-container">
-    <Question v-if="showQuestion" @QuestionPage="questionFn"></Question>
+      <Index v-if="showIndex" @IndexPage="indexFn"></Index>
-    <Result v-if="showResult" @ResultPage="resultFn"></Result>
+      <Question v-if="showQuestion" @QuestionPage="questionFn"></Question>
-    <MyPrize v-if="showMyPrize" @MyPrizePage="myPrizeFn"></MyPrize>
+      <Result v-if="showResult" @ResultPage="resultFn"></Result>
-    <Draw v-if="showDraw" @DrawPage="drawFn"></Draw>
+      <MyPrize v-if="showMyPrize" @MyPrizePage="myPrizeFn"></MyPrize>
-    <Rule v-if="showRule" @RulePage="ruleFn"></Rule>
+      <Draw v-if="showDraw" @DrawPage="drawFn"></Draw>
-    <Loading v-if="showLoad" @LoadPage="loadFn"></Loading>
+      <Rule v-if="showRule" @RulePage="ruleFn"></Rule>
      <Loading v-if="showLoad" @LoadPage="loadFn"></Loading>
      <!-- 音乐图标 -->
      <div class="music_icon" @click="musicPlay">
        <audio
          style="display: none; height: 0"
          id="bg-music"
          autoplay="autoplay"
          preload="auto"
          :src="musicUrl"
          loop="loop"
        ></audio>
      </div>
    </div>
  </div>
 </template>
@@ -19,27 +32,16 @@ import MyPrize from "@/components/MyPrize";
 import Draw from "@/components/Draw";
 import Result from "@/components/Result";
 import Rule from "@/components/Rule";
-import {
+import { getQueryString, screenOrientation, fontAdpat } from "@/plugins";
  createBGM,
  getQueryString,
  screenOrientation,
  isAndriod,
  fontAdpat,
 } from "@/plugins";
 import { authorize, getUserInfo } from "@/api";
 import { Toast } from "vant";
 import { useMainStore } from "@/store";
 const userStore = useMainStore();
-const showLoad = ref(false);
+const musicUrl = new URL(`@/assets/media/bgm.mp3`, import.meta.url).href;
 const showIndex = ref(false);
 const showQuestion = ref(false);
 const showMyPrize = ref(false);
 const showDraw = ref(false);
 const showRule = ref(false);
 const showResult = ref(false);
 const showLoad = ref(false);
 const loadFn = (item) => {
  if (item.action == "hide") {
    showLoad.value = false;
@@ -47,6 +49,7 @@ const loadFn = (item) => {
  }
 };
 const showIndex = ref(false);
 const indexFn = (item) => {
  if (item.action == "hide") {
    showIndex.value = false;
@@ -63,6 +66,7 @@ const indexFn = (item) => {
  }
 };
 const showQuestion = ref(false);
 const questionFn = (item) => {
  if (item.action == "hide") {
    showQuestion.value = false;
@@ -74,27 +78,33 @@ const questionFn = (item) => {
  }
 };
 const showMyPrize = ref(false);
 const myPrizeFn = (item) => {
  if (item.action == "hide") {
    showMyPrize.value = false;
  }
 };
 const showDraw = ref(false);
 const drawFn = (item) => {
  if (item.action == "hide") {
    showDraw.value = false;
  }
 };
 const showResult = ref(false);
 const resultFn = (item) => {
  if (item.action == "hide") {
    showResult.value = false;
    console.log("hide", showResult.value);
  }
  if (item.action == "showDraw") {
    showDraw.value = true;
  }
 };
 const showRule = ref(false);
 const ruleFn = (item) => {
  if (item.action == "hide") {
    showRule.value = false;
@@ -115,27 +125,10 @@ onMounted(() => {
        if (res.code == 0) {
          console.log("我的信息：", res.data);
          userStore.updateToken(res.data);
          createBGM();
          // 开始加载组件
          showLoad.value = true;
-
+          iosMusic(); //自动播放音乐
-          // ios自动播放音乐
+          gsap.set(".music_icon", { autoAlpha: 1 });
          document.addEventListener("DOMContentLoaded", function () {
            function audioAutoPlay() {
              var audio = document.getElementById("musicBtn");
              audio.play();
              document.addEventListener(
                "WeixinJSBridgeReady",
                function () {
                  WeixinJSBridge.invoke("getNetworkType", {}, function (e) {
                    audio.play();
                  });
                },
                false
              );
            }
            audioAutoPlay();
          });
          return;
        } else {
          authorize({ scopeType: 1, redirectUri: url }).then((res) => {
@@ -211,29 +204,93 @@ onMounted(() => {
    }
  } else {
    showLoad.value = true;
-    createBGM();
+    iosMusic(); //自动播放音乐
    gsap.set(".music_icon", { autoAlpha: 1 });
  }
 });
-const playMusic = () => {
+// ios端音乐自动播放
-  var audioEle = document.getElementById("audio");
+const iosMusic = () => {
-  audioEle.play();
+  // ios自动播放音乐
  document.addEventListener("DOMContentLoaded", function () {
    function audioAutoPlay() {
      var audio = document.getElementById("bg-music");
      audio.play();
      document.addEventListener(
        "WeixinJSBridgeReady",
        function () {
          WeixinJSBridge.invoke("getNetworkType", {}, function (e) {
            audio.play();
          });
        },
        false
      );
    }
    audioAutoPlay();
  });
  musicBtnAni.fromTo(
    ".music_icon",
    { rotation: "0" },
    { rotation: "+=360", repeat: -1, duration: 7, ease: "none" }
  );
  musicBtnAni.play();
 };
 // 音乐播放
 const musicBtnAni = gsap.timeline();
 const playStatu = ref(true);
 const musicPlay = () => {
  let audio = document.getElementById("bg-music");
  if (playStatu.value == true) {
    musicBtnAni.pause();
    audio.pause();
    playStatu.value = false;
    console.log("暂停");
  } else {
    musicBtnAni.play();
    audio.play();
    playStatu.value = true;
    console.log("播放");
  }
 };
 const firstClick = () => {
  let audio = document.getElementById("bg-music");
  musicBtnAni.play();
  audio.play();
  playStatu.value = true;
  console.log("播放");
 };
 </script>
-<style lang="scss" >
+<style lang="scss">
 #app {
  overflow: hidden;
-  background: linear-gradient(135deg, #90dcff, #51b7ff);
+  background: linear-gradient(135deg, #d6d1ca, #e5dccf);
  // font-family: "FZZY_Regular";
 }
 #__vconsole {
  visibility: hidden;
 }
-#musicBtn {
+.music_icon {
-  @include pos(60px, 60px, 50px, 35px);
+  @include pos(60px, 60px, 20px, 305px);
  @include bg_pos("music-on.png");
  z-index: 99;
  visibility: hidden;
 }
 .home {
  @include pos(100%, 100vh, 0px, 0px);
  overflow: hidden;
  .home-container {
    @include pos(750px, 1624px, 0px, 50%);
    transform: translateY(-50%);
  }
 }
 // 音乐-on样式
@@ -246,12 +303,6 @@ const playMusic = () => {
  @include bg_pos("music-off.png");
 }
 .home {
  @include box(750px, 100vh);
  overflow: hidden;
  margin: 0 auto;
 }
 .orientationPop {
  @include fixed();
  @include flexCen();
--- a/src/page/Home/main.js
+++ b/src/page/Home/main.js
@@ -19,8 +19,8 @@ app.config.globalProperties.imgUrl = (url) => {
 // 微信分享配置
 wxShare({
-    title: '好“理”在手，邂逅清凉一夏',
+    title: '龙舟争渡 稳健为先',
-    desc: '答题闯关 ，惊喜享不停',
+    desc: '端午赛龙舟中的投资哲学',
 })
 // 测试环境开vconsole
--- a/src/plugins/index.js
+++ b/src/plugins/index.js
@@ -328,7 +328,7 @@ export function addPointByBd(des) {
 }
 // 防抖函数
-export function debounceTap(target, callbacks, timeScale = 0.7) {
+export function debounceTap(target, callbacks, timeScale = 1) {
    if (!btnEnable.value) return false
    btnEnable.value = false;
    let createAni = () => {
--- a/src/plugins/wxshare.js
+++ b/src/plugins/wxshare.js
@@ -3,7 +3,7 @@ import axios from "axios";
 import { Toast } from "vant";
 import {getShareConfig } from '@/api'
-const imgUrl = new URL(`@/assets/images/share.jpg`, import.meta.url).href
+const imgUrl = new URL(`../assets/images/share.jpg`, import.meta.url).href
 const linkUrl = import.meta.env.VITE_HOST + import.meta.env.VITE_FOLDER
 export function wxShare(option) {
@@ -31,6 +31,7 @@ export function wxShare(option) {
                ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
            })
            wx.ready(function () {
                console.log('share config success');
                wx.onMenuShareTimeline({
                    link: import.meta.env.VITE_URL, // 分享链接
                    title: option.title, // 分享标题
@@ -56,4 +57,5 @@ export function wxShare(option) {
        })
        .catch(() => {
        });
-}
+}
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,42 +1,41 @@
 // pinia仓库
-import { defineStore } from "pinia"
+import { defineStore } from "pinia";
 export const useMainStore = defineStore("counter", {
-    state: () => {
+  state: () => {
-        return {
+    return {
-            hasDraw: true, //是否有抽奖机会
+      hasDraw: true, //是否有抽奖机会
-            token: '',
+      token: "",
-            posterId: 3,    //测试结果
+      posterId: 1, //测试结果
-            hasPrize: false,  //是否有奖品
+      hasPrize: false, //是否有奖品
-            prizeCode: 'oggSVMbeLgSK', //兑换码
+      prizeCode: "oggSVMbeLgSK", //兑换码
-            prizeMoney: '8.88', //金额
+      prizeMoney: "8.88", //金额
-            drawKey: '',
+      drawKey: "",
-        }
+    };
  },
  // 相当于computed属性，对state进行二次加工
  getters: {},
  // 异步处理方法
  actions: {
    updateToken(data) {
      this.token = data.authorization;
      this.hasDraw = data.drawNumber == 0 ? false : true;
    },
-    // 相当于computed属性，对state进行二次加工
+    updatePrize(data) {
-    getters: {},
+      this.prizeCode = data.prizeCode;
-    // 异步处理方法
+      this.prizeMoney = data.prizeAmount;
-    actions: {
+      this.hasPrize = true;
        updateToken(data) {
            this.token = data.authorization
            this.hasDraw = data.drawNumber == 0 ? false : true
        },
        updatePrize(data) {
            this.prizeCode = data.prizeCode
            this.prizeMoney = data.prizeAmount
            this.hasPrize = true
        },
        updatePosterId(id) {
            this.posterId = id
        },
        updateDrawKey(data) {
            console.log('保存结果:', data);
            this.drawKey = data.subKey
            this.hasDraw = data.drawFlag
        },
        updateDraw(value) {
            this.hasDraw = false
        }
    },
-})
+    updatePosterId(id) {
      this.posterId = id;
    },
    updateDrawKey(data) {
      console.log("保存结果:", data);
      this.drawKey = data.subKey;
      this.hasDraw = data.drawFlag;
    },
    updateDraw(value) {
      this.hasDraw = false;
    },
  },
 });
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -45,14 +45,14 @@ body {
 }
-
+/*--------------------
-
+   自定义样式
 -------------------*/
@font-face {
-  font-family: "HarmonyOS_Sans_SC_Regular";
+  font-family: "FZZY_Regular";
-  src: url(@/assets/font/HarmonyOS_Sans_SC_Regular.ttf) format("truetype");
+  src: url(@/assets/font/FZZY_Regular.ttf) format("truetype");
 }
 * {
  padding: 0;
  margin: 0;
--- a/vite.config.js
+++ b/vite.config.js
@@ -33,7 +33,7 @@ export default defineConfig(({ command, mode }) => {
            template: 'index.html',
            injectOptions: {
              data: {
-                title: '好“理”在手 邂逅清凉一夏',
+                title: '龙舟争渡 稳健为先',
              },
            }
          },
@@ -86,7 +86,7 @@ export default defineConfig(({ command, mode }) => {
            propList: ['*'], // 能转化为vw的属性列表
            viewportUnit: 'vw', // 希望使用的视口单位
            fontViewportUnit: 'vw', // 字体使用的视口单位
-            selectorBlackList: ['home', 'pc-content'], // 需要忽略的CSS选择器，不会转为视口单位，使用原有的px等单位。
+            selectorBlackList: [ 'pc-content'], // 需要忽略的CSS选择器，不会转为视口单位，使用原有的px等单位。
            minPixelValue: 1, // 设置最小的转换数值，如果为1的话，只有大于1的值会被转换
            mediaQuery: true, // 媒体查询里的单位是否需要转换单位
            replace: true, //  是否直接更换属性值，而不添加备用属性
--- a/yarn.lock
+++ b/yarn.lock
--- a/字体压缩.txt
+++ b/字体压缩.txt
@@ -1,142 +0,0 @@
 <template>
    <div class="RulePage" @touchmove.prevent>
        <div class="rule-container">      <div class="index-agreement">
          风险提示: 本材料由平安理财有限责任公司(以下简称“平安理财”)制作并提供。<span
          class="b">本资料内容及观点仅供参考，不构成对任何人的投资建议。</span>以上产品投资管理机构/管理人为平安理财，代理销售机构不承担产品的投资、兑付和风险管理的责任。以上产品通过代理销售机构渠道销售的，产品风险评级应当以代理销售机构最终披露的评级结果为准。以上产品为非保本浮动收益理财产品，具体以产品说明书或产品公告披露为准。产品的业绩比较基准指管理人基于过往投资经验以及对产品存续期投资市场波动的预判而对本产品所设定的投资目标，业绩比较基准不是预期收益率，不代表产品的未来表现和实际收益，不构成对产品收益的承诺。<span
          class="b">理财产品过往业绩不代表其未来表现，不等于理财产品实际收益，投资须谨慎。过往业绩相关数据已经托管人核对。</span><span class="orange">理财非存款，产品有风险，投资须谨慎。</span>金融消费者不得利用金融产品和服务从事违法活动。
      </div>
            <div class="content">
                <div class="rule-content">
                    <div class="rule-text-area wrapper">
                        <div>
                        <div class="part">
                            <div>活动时间：2024年7月31日——8月2日</div>
                            <div>活动奖励：微信红包</div>
                        </div>
                        <div class="part">第{{ questionList[currentId].id }}题
                            <div>活动攻略：</div>
                            <div>
                                1、进入活动参加【好理在手 邂逅清凉一夏】答题，共设计3道题目，全部选择完毕后即可参与抽奖活动；
                            </div>
                            <div>2、活动期间不限制参与答题次数，每人每日有1次抽奖机会。</div>
                        </div>
                        <div class="part">
                            <div>领奖说明：</div>
                            <div>
                                <span class="blod">1、中奖后在中奖页面复制兑换码，前往[平安理财服务号] 消息框输入“清凉一夏”获取兑换链接，进入链接输入兑换码兑换奖品。</span>如关闭了中奖界面，可在首页-[我的奖品] 内查看兑换码；
                            </div>
                            <div>2、成功领奖后，奖品将会在24小时内自动到账，请耐心等候；</div>
                            <div>3、中奖人请在活动结束前进行兑换，逾期视为弃权。</div>
                            <div class="part">其他：</div>
                            <div>
                                活动期间如遇到任何问题，请在<span class="blod">[平安理财服务号]</span>后台咨询，我们会在一个工作日内回复。
                            </div>
                            <div class="part">说明：平安理财有权对活动规则进行解释</div>
                        </div>
                        <div class="part">
                            <div>活动规则：</div>
                            <div>
                                1、本活动由平安理财有限责任公司主办，为保证活动的公平公正，活动结束后主办方将对中奖用户信息进行核对，用户若有下列任何一种行为或情况的，主办方有权不经另行通知，取消其参与活动以及获奖资格，收回奖品权益，井保留追究其法律责任的权利:
                            </div>
                            <div>
                                (1) 以任何机器人软件、蜘蛛软件、爬虫软件、刷奖软件或其它任何自动方式不正当手段等参与本活动；
                            </div>
                            <div>
                                (2) 同一用户(包含相同手机号、相同收货信息、相同移动设备号、相同IP地址等) 单日内恶意切换微信账号参加活动，扰乱正常抽奖秩序，影响活动公平性的;
                            </div>
                            <div>
                                (3) 有任何违反法律法规、诚实信用、公序良俗、公平公正、平安理财平台规则等行为;
                            </div>
                            <div>
                                2、平安理财保留调整、暂停和终止本活动的权利，并经公告后生效;
                            </div>
                            <div>
                                3、用户参与本活动，即视为理解并同意本活动细则。在法律规定的范围内，平安理财有权对活动规则进行解释，并根据活动实际情况对本活动的规则进行变动或调整，相关变动或调整将公布在规则页面，并于公布时即时生效。
                            </div>
                        </div>
                        <div class="margin-bottom-area"></div>
                    </div>
                    </div>
                </div>
                <div class="rule-bottom-bg"></div>
                <div class="rule-arrow"></div>
                <div class="rule-icon"></div>
            </div>
        </div>
        <div class="rule-cls-btn" @click="hide($event)"></div>
    </div>
 </template>  
 1234567890,./
 export const data = [
    {
        id: 1,
        question: [
            '激情夏日温度攀升，理财投资热情高涨。当理财市场有波动、收益上涨，别人劝你搏一搏时，正确的做法是:',
        ],
        answer: [
            {
                aid: 'A',
                text: [
                    '当然all in，我就是热点中心',
                ],
                result:'incorrect',
            },
            {
                aid: 'B',
                text: [
                    '鸡蛋不放在一个篮子里，样样都来点儿',
                ],
                result:'correct',
            },
        ],
        analysis: ['解析：选择B。虽然市场热点可能带来诱人的收益，但理财的基本原则是风险管理。通过将投资分散在不同的理财产品和市场，可以降低单一投资的风险，争取资产增长的机会。']
    },
    {
        id: 2,
        question: [
            '2、夏日闲钱早规划，get生活小确幸。长期来看，选择哪类型理财，可以较稳健地进行闲钱进阶？',
        ],
        answer: [
            {
                aid: 'A',
                text: [
                    '较低风险的现金类产品',
                ],
                result:'incorrect',
            },
            {
                aid: 'B',
                text: [
                    '策略稳健的固收类理财产品',
                ],
                result:'correct',
            },
        ],
        analysis: ['解析：选择B。现金类产品具有高流动性的特征，更适合日常流动资金。但在长期限选择中，固收理财拥有较大的投资范围和空间，运用策略提供稳健体验，有效平衡风险，力争增厚收益机会，闲钱再进阶。因此不同的资金用途记得匹配不同产品噢。']
    },
    {
        id: 3,
        question: [
            '3、夏天的快乐是多巴胺旅行给的！想要一场说走就走的快乐，平时的旅行备用金该如何准备才好呢？',
        ],
        answer: [
            {
                aid: 'A',
                text: [
                    '购买最短持有期理财产品，享灵活与收益空间',
                ],
                result:'correct',
            },
            {
                aid: 'B',
                text: [
                    '船到桥头自然直',
                ],
                result:'incorrect',
            },
        ],
        analysis: ['解析：选择A。最短持有期理财产品拥有较为灵活的申赎机制，在持有时间超过最短持有的时间要求后，随时可发起赎回，闲置时力争收益机会，用钱时满足你的流动性需求。']
    },
 ]
 abAbB元
--- a/字体生成.txt
+++ b/字体生成.txt
Author	SHA1	Message	Date
liangzejun	c458a512bb	'update'	2025-05-26 17:50:11 +08:00
梁泽军	f6e435cece	完成所有切图	2025-05-22 15:51:10 +08:00
梁泽军	6bb2497d7c	完成所有切图	2025-05-22 15:49:25 +08:00
liangzejun	ef44ba761d	'update'	2025-05-22 15:39:52 +08:00
梁泽军	68c4a94916	完成所有切图	2025-05-22 15:14:09 +08:00
liangzejun	124e44bae2	'update'	2025-05-22 15:06:47 +08:00
梁泽军	913e82905b	完成所有切图	2025-05-21 10:45:47 +08:00
梁泽军	e340bc89c6	完成所有切图	2025-05-21 10:42:37 +08:00
梁泽军	749a61f00b	初始化端午项目	2025-05-20 18:28:02 +08:00