汇总

src/components/Index.vue

@@ -44,6 +44,7 @@ onMounted(() => {
   gsap.from(".index-fan-3", { duration: 1, x: 220, autoAlpha: 0,delay:0.5 });
   gsap.from(".index-fan-2", { duration: 1, x: -220, autoAlpha: 0,delay:0.75 });
   gsap.from(".index-fan-4", { duration: 1, x: 220, autoAlpha: 0,delay:0.75 });
+  gsap.from(".index-logo", { duration: 1, y: 20, autoAlpha: 0,delay:0.75 });
   gsap.from(".index-rule-btn", { duration: 1, x: -100, autoAlpha: 0 });
   gsap.from(".index-prize-btn", {
     duration: 1,
@@ -63,7 +64,7 @@ onMounted(() => {
     autoAlpha: 0,
     delay: 0.5,
     onComplete:()=>{
-      gsap.to('.index-cloud',{duration:2,x:-30,repeat:-1,yoyo:true,ease:'none'})
+      // gsap.to('.index-cloud',{duration:2,x:-30,repeat:-1,yoyo:true,ease:'none'})
       gsap.to('.index-fan-1',{duration:2,x:'-=30',repeat:-1,yoyo:true,ease:'none'})
       gsap.to('.index-fan-2',{duration:1.5,x:'-=20',repeat:-1,yoyo:true,ease:'none'})
       gsap.to('.index-fan-3',{duration:1.5,y:'+=20',repeat:-1,yoyo:true,ease:'none'})
@@ -97,7 +98,7 @@ const showVC = () => {
       <div class="index-fan-4"></div>
       <div class="index-logo"></div>
       <div class="index-bottom-bg"></div>
-      <div class="index-cloud"></div>
+      <!-- <div class="index-cloud"></div> -->
       <div class="index-firework"></div>
       <div class="index-windows"></div>
       <div class="index-pet"></div>
@@ -171,7 +172,7 @@ const showVC = () => {
 
     .index-firework{
       pointer-events: none;
-      @include pos(120px, 120px, 605px, 437px);
+      @include pos(120px, 120px, 651px, 474px);
       @include bg_pos("index/firework.png");
     }
 
@@ -189,17 +190,17 @@ const showVC = () => {
 
     .index-title {
       // pointer-events: none;
-      @include pos(542px, 101px, 104px, 309px);
+      @include pos(542px, 101px, 104px, 369px);
       @include bg_pos("index/title.png");
     }
 
     .index-rule-btn {
-      @include pos(184px, 49px, -37px, 446px);
+      @include pos(184px, 49px, -37px, 506px);
       @include bg_pos("index/rule-btn.png");
     }
 
     .index-prize-btn {
-      @include pos(184px, 49px, -37px, 515px);
+      @include pos(184px, 49px, -37px, 575px);
       @include bg_pos("index/prize-btn.png");
     }
 

src/components/Question.vue

@@ -169,7 +169,9 @@ onMounted(() => {
             </div>
           </div>
           <!-- 解析 -->
-          <div class="analysis">{{ questionList[currentId].analysis }}</div>
+          <div class="analysis" >
+            <div v-for="li in questionList[currentId].analysis" :key="li">{{li}}</div>
+          </div>
           <div class="next-btn" @click="nextQuestion($event)"></div>
           <div class="create-btn" @click="viewResult($event)"></div>
         </div>
@@ -265,7 +267,9 @@ onMounted(() => {
         .question {
           display: flex;
           flex-direction: column;
-          margin-bottom: 10px;
+          // margin-bottom: 10px;
+          height: 270px;
+          justify-content: center;
 
           .question-text {
             width: 100%;
@@ -294,6 +298,8 @@ onMounted(() => {
           display: flex;
           flex-direction: column;
           align-items: center;
+          justify-content: space-between;
+          height: 200px;
 
           // 选中状态
           .correct-bg {
@@ -332,7 +338,8 @@ onMounted(() => {
             position: relative;
             border-radius: 47.5px;
             border: 2px solid rgb(255, 225, 172);
-            margin-bottom: 35px;
+            // margin-bottom: 35px;
+            justify-content: space-between;
             display: flex;
             flex-direction: row;
             justify-content: space-around;
@@ -388,15 +395,17 @@ onMounted(() => {
         // 解析样式
         .analysis {
           visibility: hidden;
-          width: 100%;
+          width: 95%;
           font-family: 'HarmonyOS_Sans_SC_Regular';
           font-size: 20px;
           color: #ffe2ad;
           text-align: center;
-          padding: 20px;
+          // padding: 20px;
-          height: 80px;
+          height: 100px;
-          line-height: 30px;
+          display: flex;
-          margin-bottom: 20px;
+          justify-content: center;
+          align-items: center;
+          flex-direction: column;
         }
 
         .next-btn{

src/components/Rule.vue

@@ -39,7 +39,7 @@ onMounted(() => {
                         <div class="part">
                             <div>活动攻略：</div>
                             <div>
-                                1、【赏花灯闹元宵】活动共设计3道题目，全部选择完毕后即可获取测试结果。参与抽奖活动；
+                                1、【猜灯谜闹元宵】活动共设计3道题目，全部选择完毕后即可获取测试结果。参与抽奖活动；
                             </div>
                             <div>2、活动期间不限制参与测试次数，每人每日有1次抽奖机会。</div>
                         </div>

src/data/index.js

@@ -44,7 +44,7 @@ export const data = [
                 result:'incorrect',
             },
         ],
-        analysis: '（注：截止2024年2月19日，启航系列历史到期正收益概率100%）'
+        analysis: ['（注：截止2024年2月19日，启航','系列历史到期正收益概率100%）']
     },
     {
         id: 3,
@@ -68,6 +68,6 @@ export const data = [
                 result:'incorrect',
             },
         ],
-        analysis: '（注：截止2024年2月19日，稳健精选系列（封闭型）历史到期业绩基准达标率100%）'
+        analysis: ['（注：截止2024年2月19日，稳健精选系列（封闭型）','历史到期业绩基准达标率100%）']
     },
 ]

src/page/Home/App.vue

@@ -231,7 +231,7 @@ const playMusic = () => {
 }
 
 #musicBtn {
-  @include pos(60px, 60px, 50px, 40px);
+  @include pos(60px, 60px, 50px, 35px);
   z-index: 99;
 }