完成抽奖页面,结果页面事件逻辑,待给到设计稿更新页面

This commit is contained in:
Andy Leong
2024-01-15 18:44:31 +08:00
parent 96ad18a766
commit 1024c33440
21 changed files with 385 additions and 50 deletions

View File

@@ -1,7 +1,7 @@
<script setup name="Question">
import { Button, Toast } from "vant";
import gsap from "gsap";
import data from "@/data";
import { data } from "@/data";
import { debounceTap, FYShuffle, mostValue } from "@/plugins";
import { onMounted } from "vue";
@@ -190,16 +190,9 @@ onMounted(() => {
</div>
</div>
<div class="answer-box">
<div
class="answer"
v-for="(item, index) in questionList[currentId].answer"
:class="'answer-' + index"
:key="index"
>
<div
class="answer-bg"
:class="activeId == item.aid ? 'active' : ''"
></div>
<div class="answer" v-for="(item, index) in questionList[currentId].answer" :class="'answer-' + index"
:key="index">
<div class="answer-bg" :class="activeId == item.aid ? 'active' : ''"></div>
<div class="answer-text">
<div class="content-before"></div>
<div class="content-after"></div>
@@ -245,6 +238,7 @@ onMounted(() => {
@include bg_pos("qa/question.png");
font-family: "alimama";
color: #c6672c;
.question-order {
@include pos(544px, 75px, 87px, 112px);
display: flex;
@@ -254,6 +248,7 @@ onMounted(() => {
font-weight: 700;
line-height: 80px;
}
.question-text {
@include pos(544px, 150px, 87px, 192px);
box-sizing: border-box;
@@ -264,6 +259,7 @@ onMounted(() => {
font-size: 40px;
font-weight: 700;
line-height: 50px;
.text {
width: 80%;
// height: 100%;
@@ -286,11 +282,13 @@ onMounted(() => {
position: absolute;
// font-family: "alimama";
color: #c6672c;
.answer-bg {
@include pos(481px, 471px, 0px, 0px);
@include bg_pos("qa/answer-box-1.png");
pointer-events: none;
}
.active {
@include bg_pos("qa/answer-box-2.png");
@@ -350,6 +348,7 @@ onMounted(() => {
top: 0px;
left: 6px;
}
.answer:nth-child(2) {
top: 414px;
left: 258px;