diff --git a/src/assets/font/HarmonyOS_Sans_SC_Regular.ttf b/src/assets/font/HarmonyOS_Sans_SC_Regular.ttf index 470f3b7..aff150a 100644 Binary files a/src/assets/font/HarmonyOS_Sans_SC_Regular.ttf and b/src/assets/font/HarmonyOS_Sans_SC_Regular.ttf differ diff --git a/src/assets/images/index/bg.jpg b/src/assets/images/index/bg.jpg index 5f483cf..6b17e98 100644 Binary files a/src/assets/images/index/bg.jpg and b/src/assets/images/index/bg.jpg differ diff --git a/src/assets/images/index/bottom-bg.png b/src/assets/images/index/bottom-bg.png deleted file mode 100644 index a8f7518..0000000 Binary files a/src/assets/images/index/bottom-bg.png and /dev/null differ diff --git a/src/assets/images/index/btn.png b/src/assets/images/index/btn.png new file mode 100644 index 0000000..248fd12 Binary files /dev/null and b/src/assets/images/index/btn.png differ diff --git a/src/assets/images/index/card-1.png b/src/assets/images/index/card-1.png new file mode 100644 index 0000000..32304d8 Binary files /dev/null and b/src/assets/images/index/card-1.png differ diff --git a/src/assets/images/index/card-2.png b/src/assets/images/index/card-2.png new file mode 100644 index 0000000..e639d8e Binary files /dev/null and b/src/assets/images/index/card-2.png differ diff --git a/src/assets/images/index/card-3.png b/src/assets/images/index/card-3.png new file mode 100644 index 0000000..d9740b9 Binary files /dev/null and b/src/assets/images/index/card-3.png differ diff --git a/src/assets/images/index/card-4.png b/src/assets/images/index/card-4.png new file mode 100644 index 0000000..aae9fe9 Binary files /dev/null and b/src/assets/images/index/card-4.png differ diff --git a/src/assets/images/index/card-5.png b/src/assets/images/index/card-5.png new file mode 100644 index 0000000..dbbdd2e Binary files /dev/null and b/src/assets/images/index/card-5.png differ diff --git a/src/assets/images/index/cloud.png b/src/assets/images/index/cloud.png deleted file mode 100644 index 9c938be..0000000 Binary files a/src/assets/images/index/cloud.png and /dev/null differ diff --git a/src/assets/images/index/fan-1.png b/src/assets/images/index/fan-1.png deleted file mode 100644 index 4c97ab8..0000000 Binary files a/src/assets/images/index/fan-1.png and /dev/null differ diff --git a/src/assets/images/index/fan-2.png b/src/assets/images/index/fan-2.png deleted file mode 100644 index bfeaae9..0000000 Binary files a/src/assets/images/index/fan-2.png and /dev/null differ diff --git a/src/assets/images/index/fan-3.png b/src/assets/images/index/fan-3.png deleted file mode 100644 index 1e02f5b..0000000 Binary files a/src/assets/images/index/fan-3.png and /dev/null differ diff --git a/src/assets/images/index/fan-4.png b/src/assets/images/index/fan-4.png deleted file mode 100644 index edd8ba7..0000000 Binary files a/src/assets/images/index/fan-4.png and /dev/null differ diff --git a/src/assets/images/index/firework.png b/src/assets/images/index/firework.png deleted file mode 100644 index 7f46295..0000000 Binary files a/src/assets/images/index/firework.png and /dev/null differ diff --git a/src/assets/images/index/gift-icon.png b/src/assets/images/index/gift-icon.png deleted file mode 100644 index a5db748..0000000 Binary files a/src/assets/images/index/gift-icon.png and /dev/null differ diff --git a/src/assets/images/index/line.png b/src/assets/images/index/line.png new file mode 100644 index 0000000..ded1284 Binary files /dev/null and b/src/assets/images/index/line.png differ diff --git a/src/assets/images/index/logo.png b/src/assets/images/index/logo.png index 8997c36..7f17852 100644 Binary files a/src/assets/images/index/logo.png and b/src/assets/images/index/logo.png differ diff --git a/src/assets/images/index/megaphone.png b/src/assets/images/index/megaphone.png new file mode 100644 index 0000000..ca1228e Binary files /dev/null and b/src/assets/images/index/megaphone.png differ diff --git a/src/assets/images/index/paper.png b/src/assets/images/index/paper.png new file mode 100644 index 0000000..ae7508a Binary files /dev/null and b/src/assets/images/index/paper.png differ diff --git a/src/assets/images/index/pet-icon.png b/src/assets/images/index/pet-icon.png deleted file mode 100644 index ea61273..0000000 Binary files a/src/assets/images/index/pet-icon.png and /dev/null differ diff --git a/src/assets/images/index/prize-btn.png b/src/assets/images/index/prize-btn.png deleted file mode 100644 index 7e4f6e9..0000000 Binary files a/src/assets/images/index/prize-btn.png and /dev/null differ diff --git a/src/assets/images/index/rule-btn.png b/src/assets/images/index/rule-btn.png deleted file mode 100644 index b149115..0000000 Binary files a/src/assets/images/index/rule-btn.png and /dev/null differ diff --git a/src/assets/images/index/start-btn.png b/src/assets/images/index/start-btn.png deleted file mode 100644 index fc56e4f..0000000 Binary files a/src/assets/images/index/start-btn.png and /dev/null differ diff --git a/src/assets/images/index/sub-title.png b/src/assets/images/index/sub-title.png deleted file mode 100644 index 1fa7c29..0000000 Binary files a/src/assets/images/index/sub-title.png and /dev/null differ diff --git a/src/assets/images/index/text.png b/src/assets/images/index/text.png new file mode 100644 index 0000000..3043aac Binary files /dev/null and b/src/assets/images/index/text.png differ diff --git a/src/assets/images/index/time.png b/src/assets/images/index/time.png new file mode 100644 index 0000000..95cf377 Binary files /dev/null and b/src/assets/images/index/time.png differ diff --git a/src/assets/images/index/title.png b/src/assets/images/index/title.png index 845be4e..148e453 100644 Binary files a/src/assets/images/index/title.png and b/src/assets/images/index/title.png differ diff --git a/src/assets/images/index/windows.png b/src/assets/images/index/windows.png deleted file mode 100644 index 111f53f..0000000 Binary files a/src/assets/images/index/windows.png and /dev/null differ diff --git a/src/assets/images/load/icon-2.png b/src/assets/images/load/icon-2.png new file mode 100644 index 0000000..b206925 Binary files /dev/null and b/src/assets/images/load/icon-2.png differ diff --git a/src/assets/images/load/icon.png b/src/assets/images/load/icon.png index 278f1da..6482eb6 100644 Binary files a/src/assets/images/load/icon.png and b/src/assets/images/load/icon.png differ diff --git a/src/assets/images/qa/baozhu.png b/src/assets/images/qa/baozhu.png deleted file mode 100644 index d30ab71..0000000 Binary files a/src/assets/images/qa/baozhu.png and /dev/null differ diff --git a/src/assets/images/qa/bg.jpg b/src/assets/images/qa/bg.jpg deleted file mode 100644 index 2d0ba1a..0000000 Binary files a/src/assets/images/qa/bg.jpg and /dev/null differ diff --git a/src/assets/images/qa/bottom-bg.png b/src/assets/images/qa/bottom-bg.png deleted file mode 100644 index 380d608..0000000 Binary files a/src/assets/images/qa/bottom-bg.png and /dev/null differ diff --git a/src/assets/images/qa/correct.png b/src/assets/images/qa/correct.png index 56d7f65..fc99546 100644 Binary files a/src/assets/images/qa/correct.png and b/src/assets/images/qa/correct.png differ diff --git a/src/assets/images/qa/create-btn.png b/src/assets/images/qa/create-btn.png index 46bf292..23b3c7f 100644 Binary files a/src/assets/images/qa/create-btn.png and b/src/assets/images/qa/create-btn.png differ diff --git a/src/assets/images/qa/go-back.png b/src/assets/images/qa/go-back.png deleted file mode 100644 index 799320d..0000000 Binary files a/src/assets/images/qa/go-back.png and /dev/null differ diff --git a/src/assets/images/qa/gold-icon-2.png b/src/assets/images/qa/gold-icon-2.png deleted file mode 100644 index 5547834..0000000 Binary files a/src/assets/images/qa/gold-icon-2.png and /dev/null differ diff --git a/src/assets/images/qa/gold-icon.png b/src/assets/images/qa/gold-icon.png deleted file mode 100644 index 1612cdf..0000000 Binary files a/src/assets/images/qa/gold-icon.png and /dev/null differ diff --git a/src/assets/images/qa/incorrect.png b/src/assets/images/qa/incorrect.png index 2ab3ec4..67f3960 100644 Binary files a/src/assets/images/qa/incorrect.png and b/src/assets/images/qa/incorrect.png differ diff --git a/src/assets/images/qa/lantern-icon.png b/src/assets/images/qa/lantern-icon.png deleted file mode 100644 index 5e18d0d..0000000 Binary files a/src/assets/images/qa/lantern-icon.png and /dev/null differ diff --git a/src/assets/images/qa/megaphone.png b/src/assets/images/qa/megaphone.png new file mode 100644 index 0000000..7f00a25 Binary files /dev/null and b/src/assets/images/qa/megaphone.png differ diff --git a/src/assets/images/qa/next-btn.png b/src/assets/images/qa/next-btn.png deleted file mode 100644 index cb1fc08..0000000 Binary files a/src/assets/images/qa/next-btn.png and /dev/null differ diff --git a/src/assets/images/qa/paper.png b/src/assets/images/qa/paper.png new file mode 100644 index 0000000..b80391c Binary files /dev/null and b/src/assets/images/qa/paper.png differ diff --git a/src/assets/images/qa/question-box.png b/src/assets/images/qa/question-box.png deleted file mode 100644 index 9fa6918..0000000 Binary files a/src/assets/images/qa/question-box.png and /dev/null differ diff --git a/src/assets/images/question-list/arrow-l.png b/src/assets/images/question-list/arrow-l.png new file mode 100644 index 0000000..0c0e065 Binary files /dev/null and b/src/assets/images/question-list/arrow-l.png differ diff --git a/src/assets/images/question-list/bg.jpg b/src/assets/images/question-list/bg.jpg deleted file mode 100644 index 56a2dbe..0000000 Binary files a/src/assets/images/question-list/bg.jpg and /dev/null differ diff --git a/src/assets/images/question-list/bottom-bg.png b/src/assets/images/question-list/bottom-bg.png deleted file mode 100644 index 5008c28..0000000 Binary files a/src/assets/images/question-list/bottom-bg.png and /dev/null differ diff --git a/src/assets/images/question-list/bottom-icon-1.png b/src/assets/images/question-list/bottom-icon-1.png deleted file mode 100644 index 74dda58..0000000 Binary files a/src/assets/images/question-list/bottom-icon-1.png and /dev/null differ diff --git a/src/assets/images/question-list/bottom-icon-2.png b/src/assets/images/question-list/bottom-icon-2.png deleted file mode 100644 index 92d3ee8..0000000 Binary files a/src/assets/images/question-list/bottom-icon-2.png and /dev/null differ diff --git a/src/assets/images/question-list/box.png b/src/assets/images/question-list/box.png deleted file mode 100644 index f1c740b..0000000 Binary files a/src/assets/images/question-list/box.png and /dev/null differ diff --git a/src/assets/images/question-list/btn.png b/src/assets/images/question-list/btn.png new file mode 100644 index 0000000..fe751e5 Binary files /dev/null and b/src/assets/images/question-list/btn.png differ diff --git a/src/assets/images/question-list/card-1.png b/src/assets/images/question-list/card-1.png new file mode 100644 index 0000000..b1760bd Binary files /dev/null and b/src/assets/images/question-list/card-1.png differ diff --git a/src/assets/images/question-list/card-2.png b/src/assets/images/question-list/card-2.png new file mode 100644 index 0000000..b1760bd Binary files /dev/null and b/src/assets/images/question-list/card-2.png differ diff --git a/src/assets/images/question-list/card-3.png b/src/assets/images/question-list/card-3.png new file mode 100644 index 0000000..b1760bd Binary files /dev/null and b/src/assets/images/question-list/card-3.png differ diff --git a/src/assets/images/question-list/cls-btn.png b/src/assets/images/question-list/cls-btn.png deleted file mode 100644 index e8d9470..0000000 Binary files a/src/assets/images/question-list/cls-btn.png and /dev/null differ diff --git a/src/assets/images/question-list/firework-icon.png b/src/assets/images/question-list/firework-icon.png deleted file mode 100644 index 724e795..0000000 Binary files a/src/assets/images/question-list/firework-icon.png and /dev/null differ diff --git a/src/assets/images/question-list/gift-1.png b/src/assets/images/question-list/gift-1.png deleted file mode 100644 index 034eb1b..0000000 Binary files a/src/assets/images/question-list/gift-1.png and /dev/null differ diff --git a/src/assets/images/question-list/gift-2.png b/src/assets/images/question-list/gift-2.png deleted file mode 100644 index e3c638a..0000000 Binary files a/src/assets/images/question-list/gift-2.png and /dev/null differ diff --git a/src/assets/images/question-list/icon-1.png b/src/assets/images/question-list/icon-1.png deleted file mode 100644 index 8e9e9ca..0000000 Binary files a/src/assets/images/question-list/icon-1.png and /dev/null differ diff --git a/src/assets/images/question-list/icon-2.png b/src/assets/images/question-list/icon-2.png deleted file mode 100644 index 3de8c90..0000000 Binary files a/src/assets/images/question-list/icon-2.png and /dev/null differ diff --git a/src/assets/images/question-list/icon-3.png b/src/assets/images/question-list/icon-3.png deleted file mode 100644 index ac367d5..0000000 Binary files a/src/assets/images/question-list/icon-3.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-1.png b/src/assets/images/question-list/larnten-1.png deleted file mode 100644 index 559f213..0000000 Binary files a/src/assets/images/question-list/larnten-1.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-10.png b/src/assets/images/question-list/larnten-10.png deleted file mode 100644 index 16f797f..0000000 Binary files a/src/assets/images/question-list/larnten-10.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-11.png b/src/assets/images/question-list/larnten-11.png deleted file mode 100644 index b9d6843..0000000 Binary files a/src/assets/images/question-list/larnten-11.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-2.png b/src/assets/images/question-list/larnten-2.png deleted file mode 100644 index 3090dc8..0000000 Binary files a/src/assets/images/question-list/larnten-2.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-3.png b/src/assets/images/question-list/larnten-3.png deleted file mode 100644 index e74fbcf..0000000 Binary files a/src/assets/images/question-list/larnten-3.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-4.png b/src/assets/images/question-list/larnten-4.png deleted file mode 100644 index 8ea3aaa..0000000 Binary files a/src/assets/images/question-list/larnten-4.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-5.png b/src/assets/images/question-list/larnten-5.png deleted file mode 100644 index 9a3b6d3..0000000 Binary files a/src/assets/images/question-list/larnten-5.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-6.png b/src/assets/images/question-list/larnten-6.png deleted file mode 100644 index 15f2800..0000000 Binary files a/src/assets/images/question-list/larnten-6.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-7.png b/src/assets/images/question-list/larnten-7.png deleted file mode 100644 index 7efdf88..0000000 Binary files a/src/assets/images/question-list/larnten-7.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-8.png b/src/assets/images/question-list/larnten-8.png deleted file mode 100644 index 26f2c5b..0000000 Binary files a/src/assets/images/question-list/larnten-8.png and /dev/null differ diff --git a/src/assets/images/question-list/larnten-9.png b/src/assets/images/question-list/larnten-9.png deleted file mode 100644 index c64e163..0000000 Binary files a/src/assets/images/question-list/larnten-9.png and /dev/null differ diff --git a/src/assets/images/question-list/left-arrow.png b/src/assets/images/question-list/left-arrow.png deleted file mode 100644 index 58c08a3..0000000 Binary files a/src/assets/images/question-list/left-arrow.png and /dev/null differ diff --git a/src/assets/images/question-list/megaphone.png b/src/assets/images/question-list/megaphone.png new file mode 100644 index 0000000..1253727 Binary files /dev/null and b/src/assets/images/question-list/megaphone.png differ diff --git a/src/assets/images/question-list/right-arrow.png b/src/assets/images/question-list/right-arrow.png deleted file mode 100644 index 8a44c6e..0000000 Binary files a/src/assets/images/question-list/right-arrow.png and /dev/null differ diff --git a/src/assets/images/rule/arrow.png b/src/assets/images/rule/arrow.png index 540dbfb..08b4040 100644 Binary files a/src/assets/images/rule/arrow.png and b/src/assets/images/rule/arrow.png differ diff --git a/src/assets/images/rule/cls-btn.png b/src/assets/images/rule/cls-btn.png index c8b48bb..241f641 100644 Binary files a/src/assets/images/rule/cls-btn.png and b/src/assets/images/rule/cls-btn.png differ diff --git a/src/assets/images/rule/icon.png b/src/assets/images/rule/icon.png index 4b0bc42..a122d90 100644 Binary files a/src/assets/images/rule/icon.png and b/src/assets/images/rule/icon.png differ diff --git a/src/assets/images/rule/rule-box.png b/src/assets/images/rule/rule-box.png index c6b90f9..e7657c0 100644 Binary files a/src/assets/images/rule/rule-box.png and b/src/assets/images/rule/rule-box.png differ diff --git a/src/components/Index.vue b/src/components/Index.vue index 6d35dd5..7a6a312 100644 --- a/src/components/Index.vue +++ b/src/components/Index.vue @@ -36,30 +36,29 @@ const showRule = (event) => { onMounted(() => { gsap.from(".index-bg", { duration: 1, scale: 1.2, autoAlpha: 0 }); - gsap.from(".index-bottom-bg", { duration: 1, y: 100, }); - gsap.from(".index-windows", { duration: 1, scale: 0.5, autoAlpha: 0, }); - gsap.from(".index-pet", { duration: 1, y: -50, autoAlpha: 0, delay: 0.5 }); + gsap.from(".index-paper", { duration: 1, y: 20, autoAlpha: 0, delay: 0.3, }); + gsap.from(".index-card-1", { duration: 1, scale: 1.2, autoAlpha: 0, delay: 0.5, }); + gsap.from(".index-card-2", { duration: 1, scale: 1.2, autoAlpha: 0, delay: 0.7, }); + gsap.from(".index-card-3", { duration: 1, scale: 1.2, autoAlpha: 0, delay: 0.5, }); + gsap.from(".index-card-4", { duration: 1, scale: 1.2, autoAlpha: 0, delay: 0.7, }); + gsap.from(".index-card-5", { duration: 1, scale: 1.2, autoAlpha: 0, delay: 0.5, }); gsap.from(".index-title", { duration: 1, y: 20, autoAlpha: 0, delay: 1 }); - gsap.from(".index-sub-title", { duration: 1, scale: 0, autoAlpha: 0, delay: 1.2 }); - gsap.from(".index-fan-1", { duration: 1, x: -220, autoAlpha: 0, delay: 0.5 }); - gsap.from(".index-fan-3", { duration: 1, x: 220, autoAlpha: 0, delay: 0.5 }); - gsap.from(".index-firework", { duration: 1, scale: 0, autoAlpha: 0, delay: 0.3 }); - gsap.from(".index-fan-2", { duration: 1, x: -220, autoAlpha: 0, delay: 0.75 }); - gsap.from(".index-gift", { duration: 1, y: 50, autoAlpha: 0, delay: 0.75 }); - gsap.from(".index-fan-4", { duration: 1, x: 220, autoAlpha: 0, delay: 0.75 }); + gsap.from(".index-time", { duration: 1, x: 40, autoAlpha: 0, delay: 1 }); + gsap.from(".index-text", { duration: 1, scale: 2, autoAlpha: 0, delay: 1 }); + gsap.from(".index-megaphone", { duration: 1, x: 140, autoAlpha: 0, delay: 1 }); 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-rule-btn", { duration: 1, x: -100, autoAlpha: 0, delay: 1.3 }); 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, @@ -67,14 +66,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-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' }) - gsap.to('.index-fan-4', { duration: 2, x: '+=20', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.index-pet', { duration: 2, y: '-=10', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.index-gift', { duration: 2, y: '-=10', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.index-start-btn', { duration: 1, scale: '0.85', repeat: -1, yoyo: true, ease: 'bounce.out' }) + gsap.to('.index-start-btn', { duration: 1, scale: '0.95', repeat: -1, yoyo: true, ease: 'bounce.out' }) } }); @@ -94,27 +86,32 @@ const showVC = () => {
-
-
-
-
-
-
-
- -
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
活动规则
+
我的奖品
- 风险提示:本材料由平安理财有限责任公司(以下简称“平安理财”)制作并提供。本资料内容及观点仅供参考，不构成对任何人的投资建议。以上产品投资管理机构/管理人为平安理财，代理销售机构不承担产品的投资、兑付和风险管理的责任。以上产品通过代理销售机构渠道销售的，产品风险评级应当以代理销售机构最终披露的评级结果为准。以上产品为非保本浮动收益理财产品，具体以产品说明书或产品公告披露为准。产品的业绩比较基准指管理人基于过往投资经验以及对产品存续期投资市场波动的预判而对本产品所设定的投资目标，业绩比较基准不是预期收益率，不代表产品的未来表现和实际收益，不构成对产品收益的承诺。理财产品过往业绩不代表其未来表现，不等于理财产品实际收益，投资须谨慎。过往业绩相关数据已经托管人核对。理财非存款，产品有风险，投资须谨慎。金融消费者不得利用金融产品和服务从事违法活动。 +
数据来源：平安理财，数据截至2025年4月11日，产品历史业绩不代表未来表现
+ 风险提示:本材料由平安理财有限责任公司(以下简称“平安理财”)制作并提供。 + 本资料内容及观点仅供参考，不构成对任何人的投资建议。 + 以上产品投资管理机构/管理人为平安理财，代理销售机构不承担产品的投资、兑付和风险管理的责任。以上产品通过代理销售机构渠道销售的，产品风险评级应当以代理销售机构最终披露的评级结果为准。以上产品为非保本浮动收益理财产品，具体以产品说明书或产品公告披露为准。产品的业绩比较基准指管理人基于过往投资经验以及对产品存续期投资市场波动的预判而对本产品所设定的投资目标，业绩比较基准不是预期收益率，不代表产品的未来表现和实际收益，不构成对产品收益的承诺。 + 理财产品过往业绩不代表其未来表现，不等于理财产品实际收益，投资须谨慎。过往业绩相关数据已经托管人核对。理财非存款，产品有风险，投资须谨慎。 + + 金融消费者不得利用金融产品和服务从事违法活动。 +
@@ -124,7 +121,7 @@ const showVC = () => { .IndexPage { @include pos(100%, 100vh, 0px, 0px); overflow: hidden; - background: linear-gradient(135deg, #a11b15, #f80c00); + background: linear-gradient(135deg, #d6d1ca, #e5dccf); .index-bg { @include pos(750px, 1624px, 0px, 50%); @@ -136,23 +133,6 @@ const showVC = () => { @include pos(750px, 1624px, 0px, 50%); transform: translateY(-50%); - .index-bottom-bg { - pointer-events: none; - @include pos(750px, 549px, 0px, 1075px); - @include bg_pos("index/bottom-bg.png"); - } - - .index-fan-1 { - pointer-events: none; - @include pos(235px, 574px, 0px, 60px); - @include bg_pos("index/fan-1.png"); - } - - .index-fan-2 { - pointer-events: none; - @include pos(316px, 317px, -205px, 405px); - @include bg_pos("index/fan-2.png"); - } .index-logo { pointer-events: none; @@ -160,95 +140,115 @@ const showVC = () => { @include bg_pos("index/logo.png"); } - .index-fan-3 { - pointer-events: none; - @include pos(370px, 334px, 545px, 910px); - @include bg_pos("index/fan-3.png"); + .index-paper { + @include pos(706px, 777px, 19px, 394px); + @include bg_pos("index/paper.png"); + + .index-title { + // pointer-events: none; + @include pos(611px, 233px, 59px, -56px); + @include bg_pos("index/title.png"); + } + + .index-time { + @include pos(385px, 70px, 257px, 161px); + @include bg_pos("index/time.png"); + } + + .index-card-1 { + @include pos(207px, 182px, 45px, 194px); + @include bg_pos("index/card-1.png"); + } + + .index-card-2 { + @include pos(227px, 159px, 275px, 260px); + @include bg_pos("index/card-2.png"); + } + + .index-card-3 { + @include pos(208px, 180px, 496px, 237px); + @include bg_pos("index/card-3.png"); + } + + .index-card-4 { + @include pos(204px, 168px, 77px, 460px); + @include bg_pos("index/card-4.png"); + } + + .index-card-5 { + @include pos(215px, 162px, 358px, 524px); + @include bg_pos("index/card-5.png"); + } + + .index-text { + @include pos(325px, 74px, 307px, 448px); + @include bg_pos("index/text.png"); + } + + .index-line { + @include pos(661px, 359px, 22px, 346px); + @include bg_pos("index/line.png"); + } } - .index-fan-4 { - pointer-events: none; - @include pos(350px, 205px, 494px, 1011px); - @include bg_pos("index/fan-4.png"); + + .index-megaphone { + @include pos(104px, 113px, 646px, 540px); + @include bg_pos("index/megaphone.png"); } - .index-cloud { - pointer-events: none; - @include pos(88px, 46px, 621px, 253px); - @include bg_pos("index/cloud.png"); - } - - .index-gift { - pointer-events: none; - @include pos(169px, 172px, 16px, 1004px); - @include bg_pos("index/gift-icon.png"); - } - - .index-windows { - pointer-events: none; - @include pos(743px, 744px, 3px, 440px); - @include bg_pos("index/windows.png"); - } - - .index-pet { - pointer-events: none; - @include pos(378px, 452px, 187px, 614px); - @include bg_pos("index/pet-icon.png"); - } - - .index-title { - // pointer-events: none; - @include pos(528px, 198px, 111px, 231px); - @include bg_pos("index/title.png"); - } - - .index-sub-title { - pointer-events: none; - @include pos(200px, 130px, 517px, 472px); - @include bg_pos("index/sub-title.png"); - } - - .index-firework { - pointer-events: none; - @include pos(95px, 95px, -38px, 889px); - @include bg_pos("index/firework.png"); + .index-left-btn{ + border: 2px solid rgb(255, 255, 255); + background-color: rgb(243, 87, 4); + box-shadow: 0px 6px 11px 0px rgba(155, 122, 68, 0.4); + font-size: 25px; + display: flex; + align-items: center; + justify-content:center; + padding-left: 20px; + color: #ffffff; + letter-spacing: 1.5px; + border-radius: 21px; } .index-rule-btn { - @include pos(184px, 49px, -37px, 506px); - @include bg_pos("index/rule-btn.png"); + @include pos(184px, 49px, -37px, 578px); } .index-prize-btn { - @include pos(184px, 49px, -37px, 575px); - @include bg_pos("index/prize-btn.png"); + @include pos(184px, 49px, -37px, 642px); } .index-start-btn { - @include pos(319px, 93px, 241px, 1169px); - @include bg_pos("index/start-btn.png"); + @include pos(339px, 117px, 203px, 1077px); + @include bg_pos("index/btn.png"); } .index-agreement { font-family: "HarmonyOS_Sans_SC_Regular"; pointer-events: none; @include pos(736px, 182px, 7px, 1258px); - // background: rgba($color: #f49e6a, $alpha: 0.55); font-size: 14px; text-align: justify; letter-spacing: 0.1px; - color: #ff8c84; + color: #815e3c; padding: 10px; box-sizing: border-box; border-radius: 10px; line-height: 20px; + .tips { + text-align: center; + margin: 10px; + color: #ab7133; + } + .b { font-weight: 700; } .orange { - color: #fdf9de; + color: #ff7127; font-weight: 700; } } diff --git a/src/components/Loading.vue b/src/components/Loading.vue index d860600..61f81f8 100644 --- a/src/components/Loading.vue +++ b/src/components/Loading.vue @@ -41,7 +41,6 @@ onMounted(() => { name: "内页资源", imgs: pageImg, callback: (progress) => { - // console.log('进度：', progress); gsap.set(".bar", { width: progress + "%" }); loadNum.value = progress; }, @@ -66,11 +65,13 @@ onMounted(() => {
-
+
-
{{ loadNum }}%
+
+ {{ loadNum }}% +
@@ -85,7 +86,7 @@ onMounted(() => { .load-bg { @include pos(750px, 100%, 0px, 50%); transform: translateY(-50%); - @include bg_pos("load/bg.jpg"); + @include bg_pos("index/bg.jpg"); } .load-container { @@ -93,40 +94,48 @@ onMounted(() => { @include box(750px, 1180px); // transform: translateY(-50%); - .load-icon{ - @include pos(101px, 55px, 325px, 370px); + .load-icon { + @include pos(363px, 136px, 335px, 320px); @include bg_pos("load/icon.png"); } .load-box { - @include pos(512px, 35px, 119px, 450px); - border-style: solid; - border-width: 2px; - border-color: #e17c4d; - border-radius: 20px; - padding: 2px; + @include pos(582px, 45px, 83px, 450px); + border-radius: 25px; + padding: 1px; + border: 1px solid rgb(243, 87, 4); + .bar { - @include box(0%, 26px); + @include box(0%, 38px); border-radius: 20px; - background: linear-gradient( -178deg, rgb(255,184,127) 0%, rgb(255,238,186) 100%); - background-image: -webkit-linear-gradient( -178deg, rgb(255,184,127) 0%, rgb(255,238,186) 100%); + border: 1px solid rgb(255, 255, 255); + + background-image: -webkit-linear-gradient(0deg, #f7c86f 0%, #f25501 100%); } } .load-num { - @include pos(750px, 50px, 0px, 511px); - text-align: center; - font-size: 38px; - color: #ffaf5e; - line-height: 40px; - font-weight: 700; - background: linear-gradient(to right, #f2733a, #ffd667); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - // letter-spacing: 2px; + @include pos(235px, 80px, 256px, 511px); + @include bg_pos("load/icon-2.png"); + + @include flexCen(); + + + .num { + font-size: 40px; + color: #f25501; + font-weight: 700; + + /* 文字填充色 */ + text-shadow: + -1px -1px 0 #ffffff, + 1px -1px 0 #ffffff, + -1px 1px 0 #ffffff, + 1px 1px 0 #ffffff; + /* 四个方向阴影叠加 */ + } } .btn { diff --git a/src/components/Question.vue b/src/components/Question.vue index 86904a5..c975844 100644 --- a/src/components/Question.vue +++ b/src/components/Question.vue @@ -7,7 +7,7 @@ import { useMainStore } from "@/store"; import { subAnswer } from "@/api"; // 页面配置初始化 -const emit = defineEmits(["hide", "showResult","QuestionPage"]); +const emit = defineEmits(["hide", "showResult", "QuestionPage"]); const userStore = useMainStore(); const props = defineProps({ @@ -33,7 +33,6 @@ const answerFn = (item, event) => { // console.log('当前题目：', currentId.value + 1); debounceTap(e, () => { - gsap.set('.option-tips,.analysis', { autoAlpha: 1 }) gsap.set('.answer-box', { pointerEvents: 'none' }) isChecked.value = true checkedOption.value = item.aid @@ -110,7 +109,6 @@ const viewResult = (event) => { onMounted(() => { gsap.from('.question-bg', { duration: 0.5, autoAlpha: 0, }) gsap.from('.question-box', { duration: 0.5, scale: 0.4, autoAlpha: 0, }) - gsap.to('.question-lantern-icon', { duration: 5, transformOrigin: '100% 0%', rotation: '10deg', repeat: -1, yoyo: true, ease: 'none' }) }); @@ -122,45 +120,32 @@ onMounted(() => {
-
{{ questionList[currentId].id }}
{{ item }}
-
打一个字
-
-
- {{ item.aid }}.{{ a }} +
+ {{ item.aid }}.{{ item.text }}
-
-
-
- -
-
- 提示: - -
-
+
{{ t }}
+
-
-
-
@@ -175,7 +160,7 @@ onMounted(() => { .question-bg { @include pos(750px, 1624px, 0px, 50%); transform: translateY(-50%); - background-color: rgba($color: #000000, $alpha: 0.6); + background-color: rgba($color: #000000, $alpha: 0.3); } @@ -192,35 +177,12 @@ onMounted(() => { .question-box { - @include pos(616px, 873px, 68px, 350px); - @include bg_pos("qa/question-box.png"); + @include pos(721px, 857px, 20px, 340px); + @include bg_pos("qa/paper.png"); - .answer-larnten { - @include pos(310px, 526px, -120px, -120px); - @include bg_pos('qa/lantern-icon.png'); - pointer-events: none - } - - .answer-baozhu { - @include pos(145px, 167px, 507px, 725px); - @include bg_pos('qa/baozhu.png'); - pointer-events: none - } - - .qa-number { - @include pos(100px, 56px, 255px, 79px); - font-size: 40px; - font-style: italic; - color: #c61a1a; - font-weight: 700; - display: flex; - justify-content: center; - align-items: center; - } - .qa-question-box { - @include pos(570px, 700px, 22px, 194px); + @include pos(563px, 660px, 74px, 126px); display: flex; flex-direction: column; // justify-content: space-around; @@ -229,32 +191,19 @@ onMounted(() => { // 问题样式 .question { - display: flex; - flex-direction: column; - // margin-bottom: 10px; - height: 270px; - justify-content: center; .question-text { width: 100%; - font-family: 'DouyinSansBold'; - font-size: 35px; - color: rgb(255, 255, 255); - text-align: center; + font-family: 'HarmonyOS_Sans_SC_Regular'; + font-size: 34px; + color: #9e4b00; + padding: 10px; text-shadow: 0.675px 2.923px 6px rgba(164, 18, 14, 0.004); // -webkit-transform: matrix( 0.63514641527437,0,0,0.63514641527437,0,0); } - .question-tips { - font-size: 25px; - width: 100%; - font-family: 'DouyinSansBold'; - color: rgb(255, 255, 255); - text-align: center; - padding: 10px; - text-shadow: 0.675px 2.923px 6px rgba(164, 18, 14, 0.004); - } + } // 选项样式 @@ -262,75 +211,53 @@ onMounted(() => { display: flex; flex-direction: column; align-items: center; - justify-content: space-between; + justify-content: space-around; height: 200px; - - - // 选中状态 .checked { border: 1px solid rgb(255, 238, 186) !important; - background-image: linear-gradient(177deg, rgb(255, 184, 127) 0%, rgb(255, 238, 186) 100%); - background-image: -webkit-linear-gradient(177deg, rgb(255, 184, 127) 0%, rgb(255, 238, 186) 100%); + background-color: #d42122; .answer-option { color: #96100f; } .answer-text-box { - color: #96100f !important; + color: #fff2b9 !important; } } .no-checked { - // background-image: -webkit-linear-gradient(177deg, rgb(195, 59, 22) 0%, rgb(209, 84, 51) 100%); - // box-shadow: 0px 3px 6px 0px rgba(133, 0, 3, 0.85), inset 0px 2px 5px 0px rgba(236, 74, 42, 0.004); - - box-shadow: 0px 3px 6px 0px rgba(133, 0, 3, 0.85),inset 0px 2px 5px 0px rgba(236, 74, 42, 0.004); - background-image: -webkit-linear-gradient( 177deg, rgb(195,59,22) 0%, rgb(209,84,51) 100%); - - - + background-color: #fff2b9; .answer-option { - color: #ffe2ad; + color: #9e4b00; } .answer-text-box { - color: #ffe2ad !important; + color: #9e4b00 !important; } } - .checked{ - - } - - - .answer { - @include box(350px, 92px); - + @include box(350px, 65px); position: relative; - border-radius: 47.5px; - // border: 2px solid rgb(255, 225, 172); - // margin-bottom: 35px; - justify-content: space-between; + border-radius: 32.5px; display: flex; - flex-direction: row; justify-content: space-around; - align-items: center; + border: 1px solid #fff; + text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); .click-area { - @include pos(350px, 92px, 0px, 0px); - border-radius: 47.5px; + @include pos(350px, 65px, 0px, 0px); + border-radius: 32.5px; } .option-tips { @include box(60px, 60px); - visibility: hidden; .correct { @include box(100%, 100%); @@ -369,31 +296,20 @@ onMounted(() => { } - // 解析样式 - .analysis { - // visibility: hidden; - width: 95%; + + .question-tips { + font-size: 25px; + width: 100%; font-family: 'HarmonyOS_Sans_SC_Regular'; - font-size: 20px; - color: #ffffff; + color: #ab7133; text-align: center; - height: 100px; - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; - - .analysis-tips { - background-color: rgb(175, 13, 12); - padding: 5px 10px; - margin-right: 3px; - - } + padding: 10px; } + .return-btn { @include box(246px, 73px); - @include bg_pos("qa/go-back.png"); + @include bg_pos("rule/cls-btn.png"); display: none; } @@ -407,11 +323,6 @@ onMounted(() => { } } - .question-gold-icon-1 { - pointer-events: none; - @include pos(135px, 128px, 604px, 773px); - @include bg_pos("qa/gold-icon.png"); - } diff --git a/src/components/QuestionList.vue b/src/components/QuestionList.vue index 8aac267..e6a34cd 100644 --- a/src/components/QuestionList.vue +++ b/src/components/QuestionList.vue @@ -2,32 +2,20 @@
-
-
-
-
-
-
-
-
-
选择一盏灯你喜欢的花灯
-
开始猜谜吧
-
+
-
-
- - + -
- +
+
-
@@ -45,22 +33,20 @@ import gsap from "gsap" const emit = defineEmits(['QuestionList', "showResult"]); -const showQuestion = ref(false) +const showQuestion = ref(true) const questionId = ref(1) // 获取灯笼图片 function getLarntenImg(item) { - return new URL(`../assets/images/question-list/larnten-${item}.png`, import.meta.url).href + return new URL(`../assets/images/question-list/card-${item}.png`, import.meta.url).href } const onShowQuestion = (event) => { let e = event.target; - - debounceTap(e, () => { // 获取当前选中灯笼的序号 1-11 - const swiper = document.querySelector('.larnten-swiper').swiper; + const swiper = document.querySelector('.card-swiper').swiper; // swiper开启了loop const activeIndex = swiper.realIndex + 1; console.log('activeIndex', activeIndex); @@ -81,88 +67,10 @@ const showPoster = () => { duration: 0.3, autoAlpha: 1, }); - gsap.from(".ql-select-text", { - duration: 0.7, - scale: 1.2, - autoAlpha: 0, - }); - gsap.from(".ql-swiper-box", { - duration: 0.7, - scale: 0.6, - autoAlpha: 0, - }); - gsap.from(".ql--top-icon-1", { - duration: 0.7, - scale: 0.7, - autoAlpha: 0, - delay: 0.3 - }); - gsap.from(".ql--top-icon-2", { - duration: 0.7, - y: -30, - autoAlpha: 0, - delay: 0.5 - }); - gsap.from(".ql--top-icon-3", { - duration: 0.7, - y: -30, - autoAlpha: 0, - delay: 0.7 - }); - gsap.from(".ql--bottom-gift-1", { - duration: 0.7, - y: 30, - autoAlpha: 0, - delay: 0.7 - }); - gsap.from(".ql--bottom-gift-2", { - duration: 0.7, - x: -50, - autoAlpha: 0, - delay: 0.5 - }); - gsap.from(".ql--bottom-icon-1", { - duration: 0.7, - y: 30, - autoAlpha: 0, - delay: 0.5 - }); - gsap.from(".ql-start-btn", { - duration: 0.7, - scale: 0, - autoAlpha: 0, - delay: 0.7, - }); - gsap.from(".ql-bottom-bg", { - duration: 0.7, - y: 130, - autoAlpha: 0, - delay: 0.2, - }); - gsap.from(".ql--bottom-icon-2", { - duration: 0.7, - y: 30, - autoAlpha: 0, - delay: 0.7, - onComplete: () => { - // gsap.to('.index-cloud',{duration:2,x:-30,repeat:-1,yoyo:true,ease:'none'}) - gsap.to('.ql--top-icon-1', { duration: 2, y: '-=30', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.ql--top-icon-3', { duration: 1.5, x: '-=20', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.ql--top-icon-2', { duration: 1.5, y: '+=20', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.ql--bottom-gift-1', { duration: 2, y: '+=20', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.ql--bottom-gift-2', { duration: 2, y: '-=10', repeat: -1, yoyo: true, ease: 'none' }) - gsap.to('.ql--bottom-icon-2', { duration: 2, x: '-=10', repeat: -1, yoyo: true, ease: 'none' }) - // 以图片为上边中间为中心旋转 + // gsap.fromTo('.larnten-slide', { rotation: 0 }, { duration: 2, rotation: 5, transformOrigin: 'top center', repeat: -1, yoyo: true, ease: 'none' }) + + - gsap.fromTo('.larnten-slide', { rotation: 0 }, { duration: 2, rotation: 5, transformOrigin: 'top center', repeat: -1, yoyo: true, ease: 'none' }) - - const gl = gsap.timeline({ repeat: -1 }) - gl.to('.larnten-slide',{duration:2,rotation: -5,transformOrigin: 'top center', ease: 'none'}) - gl.to('.larnten-slide',{duration:2,rotation: 0,transformOrigin: 'top center', ease: 'none'}) - gl.to('.larnten-slide',{duration:2,rotation: 5,transformOrigin: 'top center', ease: 'none'}) - gl.to('.larnten-slide',{duration:2,rotation: 0,transformOrigin: 'top center', ease: 'none'}) - } - }); } @@ -187,35 +95,28 @@ register(); .question-list-bg { @include pos(750px, 1624px, 0px, 50%); transform: translateY(-50%); - @include bg_pos("question-list/bg.jpg"); + @include bg_pos("index/bg.jpg"); } .question-list-container { @include pos(750px, 1624px, 0px, 50%); transform: translateY(-50%); + .ql-logo { + pointer-events: none; + @include pos(632px, 94px, 59px, 180px); + @include bg_pos("index/logo.png"); + } - .ql-select-text { - font-family: 'DouyinSansBold'; - position: absolute; - width: 100%; - top: 307px; - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; - - .select-text { - line-height: 50px; - font-size: 33px; - color: rgb(255, 255, 255); - font-weight: bold; - text-shadow: 0.675px 2.923px 6px rgba(164, 18, 14, 0.004); - } + .ql-icon { + @include pos(213px, 121px, 558px, 453px); + @include bg_pos("question-list/megaphone.png"); + pointer-events: none; + z-index: 9; } .ql-swiper-box { - @include pos(655px, 778px, 49px, 448px); + @include pos(689px, 522px, 31px, 514px); // background-color: aliceblue; // overflow: hidden; display: flex; @@ -223,73 +124,20 @@ register(); justify-content: center; // pointer-events: none; - .larnten-box { - @include pos(428px, 639px, 113.5px, 0px); - @include bg_pos("question-list/box.png"); - } - .larnten-box-firework { - @include pos(102px, 109px, 451.5px, 20px); - @include bg_pos("question-list/firework-icon.png"); - } - - .larnten-swiper { - @include box(655px, 778px); + .card-swiper { + @include box(689px, 522px); position: relative; - // display: flex; - // align-items: center; - // justify-content: center; - .larnten-slide { + + .card-slide { pointer-events: none; - } + @include box(555px, 522px); - .larnten-slide-1 { - @include box(527px, 697px); - } - - .larnten-slide-2 { - @include box(482px, 743px); - } - - .larnten-slide-3 { - @include box(478px, 714px); - } - - .larnten-slide-4 { - @include box(441px, 722px); - } - - .larnten-slide-5 { - @include box(473px, 778px); - } - - .larnten-slide-6 { - @include box(437px, 751px); - } - - .larnten-slide-7 { - @include box(478px, 731px); - } - - .larnten-slide-8 { - @include box(446px, 743px); - } - - .larnten-slide-9 { - @include box(481px, 691px); - } - - .larnten-slide-10 { - @include box(460px, 713px); - } - - .larnten-slide-11 { - @include box(383px, 756px); } - .larnten-img { + .card-img { @include box(100%, 100%); pointer-events: none; } @@ -298,57 +146,9 @@ register(); } - .ql--top-icon-1 { - pointer-events: none; - @include pos(405px, 659px, -193px, -213px); - @include bg_pos("question-list/icon-1.png"); - } - - .ql--top-icon-2 { - pointer-events: none; - @include pos(412px, 240px, 503px, -55px); - @include bg_pos("question-list/icon-2.png"); - } - - .ql--top-icon-3 { - pointer-events: none; - @include pos(300px, 434px, 611px, -71px); - @include bg_pos("question-list/icon-3.png"); - } - - .ql-bottom-bg { - pointer-events: none; - @include pos(750px, 374px, 0px, 1250px); - @include bg_pos("question-list/bottom-bg.png"); - } - - .ql--bottom-icon-1 { - pointer-events: none; - @include pos(293px, 292px, -186px, 1109px); - @include bg_pos("question-list/bottom-icon-1.png"); - } - - .ql--bottom-icon-2 { - pointer-events: none; - @include pos(698px, 497px, -287px, 1130px); - @include bg_pos("question-list/bottom-icon-2.png"); - } - - .ql--bottom-gift-1 { - pointer-events: none; - @include pos(144px, 145px, 512px, 1215px); - @include bg_pos("question-list/gift-1.png"); - } - - .ql--bottom-gift-2 { - pointer-events: none; - @include pos(184px, 188px, 611px, 1129px); - @include bg_pos("question-list/gift-2.png"); - } - .ql-start-btn { - @include pos(319px, 93px, 235.5px, 1150px); - @include bg_pos("index/start-btn.png"); + @include pos(376px, 114px, 188px, 1129px); + @include bg_pos("index/btn.png"); z-index: 99; } } @@ -362,12 +162,12 @@ register(); /* 设置按钮颜色 */ // background-color: rgba(0, 0, 0, 0.5); /* 设置按钮背景颜色 */ // border-radius: 50%; /* 设置按钮圆角 */ - @include box(59px, 81px); + @include box(44px, 54px); display: flex; align-items: center; justify-content: center; position: absolute; - top: 50%; + // top: 50%; transform: translateY(-50%); } @@ -380,12 +180,12 @@ register(); ::v-deep .swiper-button-prev { // left: 20px; /* 设置按钮位置 */ - @include bg_pos("question-list/left-arrow.png"); + @include bg_pos("question-list/arrow-l.png"); } ::v-deep .swiper-button-next { // right: 20px; /* 设置按钮位置 */ - @include bg_pos("question-list/right-arrow.png"); + @include bg_pos("question-list/arrow-l.png"); // right: 0px; } diff --git a/src/components/Rule.vue b/src/components/Rule.vue index 934e2c7..6d89d45 100644 --- a/src/components/Rule.vue +++ b/src/components/Rule.vue @@ -94,29 +94,29 @@ onMounted(() => { .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(612px, 794px); + @include box(685px, 876px); overflow: hidden; .content { .rule-content { - @include box(612px, 794px); + @include box(685px, 876px); @include bg_pos("rule/rule-box.png"); position: relative; overflow: hidden; .rule-text-area { - @include pos(612px, 676px, 0px, 101px); + @include pos(635px, 709px, 25px, 83px); overflow: hidden; // overflow-y: scroll; padding: 0px 20px; .part { - color: #a31b15; + color: #a74f00; font-size: 20px; line-height: 35px; margin-top: 30px; @@ -127,7 +127,7 @@ onMounted(() => { .blod { font-weight: 700; - color: #6c0500; + color: #a74f00; } .margin-bottom-area { @@ -138,20 +138,20 @@ onMounted(() => { } .rule-arrow { - @include pos(149px, 84px, 231px, 682px); + @include pos(161px, 102px, 262px, 682px); @include bg_pos("rule/arrow.png"); pointer-events: none; } .rule-bottom-bg { - // visibility: hidden; - @include pos(588px, 102px, 12px, 682px); - pointer-events: none; - background-image: -webkit-linear-gradient(90deg, rgba(255, 238, 186, 0.7), rgba(255, 255, 255, 0.1) 100%); + // @include pos(685px, 102px, 0px, 712px); + // border-radius: 10px; + // pointer-events: none; + // background-image: -webkit-linear-gradient(90deg, rgba(255, 238, 186, 0.7), rgba(255, 255, 255, 0.1) 100%); } .rule-icon { - @include pos(118px, 146px, 511px, 25px); + @include pos(97px, 120px, 561px, 25px); @include bg_pos("rule/icon.png"); pointer-events: none; } @@ -161,9 +161,9 @@ onMounted(() => { } .rule-cls-btn { - @include box(43px, 43px); + @include box(49px, 49px); @include bg_pos("rule/cls-btn.png"); - margin-top: 40px; + margin-top: 0px; } } \ No newline at end of file diff --git a/src/data/imgList.js b/src/data/imgList.js index 878b20a..a51f845 100644 --- a/src/data/imgList.js +++ b/src/data/imgList.js @@ -1,102 +1,9 @@ const load = ["load/icon.png", "load/bg.jpg"]; const page = [ - "index/prize-btn.png", + "index/card-1.png", - "index/bg.jpg", - "index/bottom-bg.png", - "index/cloud.png", - "index/fan-1.png", - "index/fan-2.png", - "index/fan-3.png", - "index/fan-4.png", - "index/firework.png", - "index/gift-icon.png", - "index/logo.png", - "index/pet-icon.png", - "index/prize-btn.png", - "index/rule-btn.png", - "index/start-btn.png", - "index/sub-title.png", - "index/title.png", - "index/windows.png", - "poster/card-1.png", - "poster/card-10.png", - "poster/card-11.png", - "poster/card-2.png", - "poster/card-3.png", - "poster/card-4.png", - "poster/card-5.png", - "poster/card-6.png", - "poster/card-7.png", - "poster/card-8.png", - "poster/card-9.png", - "poster/poster-1.jpg", - "poster/poster-10.jpg", - "poster/poster-11.jpg", - "poster/poster-2.jpg", - "poster/poster-3.jpg", - "poster/poster-4.jpg", - "poster/poster-5.jpg", - "poster/poster-6.jpg", - "poster/poster-7.jpg", - "poster/poster-8.jpg", - "poster/poster-9.jpg", - - "prize/cls-btn.png", - "prize/copy-btn.png", - "prize/draw-box.png", - "prize/draw-text.png", - "prize/light.png", - "prize/myPrize-box.png", - "prize/no-prize.png", - "prize/star.png", - "prize/tips.png", - - "qa/baozhu.png", - "qa/bg.jpg", - "qa/bottom-bg.png", - "qa/correct.png", - "qa/create-btn.png", - "qa/go-back.png", - "qa/gold-icon-2.png", - "qa/gold-icon.png", - "qa/incorrect.png", - "qa/lantern-icon.png", - "qa/next-btn.png", - "qa/question-box.png", - - "question-list/bg.jpg", - "question-list/bottom-bg.png", - "question-list/bottom-icon-1.png", - "question-list/bottom-icon-2.png", - "question-list/box.png", - "question-list/cls-btn.png", - "question-list/firework-icon.png", - "question-list/gift-1.png", - "question-list/gift-2.png", - "question-list/icon-1.png", - "question-list/icon-2.png", - "question-list/icon-3.png", - "question-list/larnten-1.png", - "question-list/larnten-10.png", - "question-list/larnten-11.png", - "question-list/larnten-2.png", - "question-list/larnten-3.png", - "question-list/larnten-4.png", - "question-list/larnten-5.png", - "question-list/larnten-6.png", - "question-list/larnten-7.png", - "question-list/larnten-8.png", - "question-list/larnten-9.png", - "question-list/left-arrow.png", - "question-list/right-arrow.png", - - "rule/arrow.png", - "rule/cls-btn.png", - "rule/icon.png", - "rule/rule-box.png", ]; // 处理为vite引入图片格式 diff --git a/src/data/index.js b/src/data/index.js index 6f04404..0331dbb 100644 --- a/src/data/index.js +++ b/src/data/index.js @@ -1,221 +1,97 @@ export const data = [ { id: 1, - question: ["把户口迁到一块"], + question: ["欢迎你打卡这座8D魔幻山城：轨道交通在楼宇腹中游走，立交桥如基因链螺旋攀升，万家灯火在悬崖上生长出十三层吊脚楼。这座将三维空间玩到极致的城市是？"], answer: [ { aid: "A", - text: ["启"], - result: "correct", + text: "重庆", + result: 1, }, { aid: "B", - text: ["航"], - result: "incorrect", + text: "成都", + result: 0, }, ], - analysis: [ - `启航系列旗下产品连续3年获得金牛奖。`, - `（2022-2024年）`, + tips: [ + `一座被火锅”包围“的城市`, ], }, { id: 2, - question: ["演出时间，不要说话"], + question: ["欢迎你来到这处塞上秘境：沙海与翡翠绿洲相拥而眠，千年岩画镌刻着骆驼商队的丝路密码。母亲河在此织就翡翠腰带，烽燧残垣与星空共同丈量着天地琴弦。这处同时拥有流动史诗与永恒星辰的秘境是？"], answer: [ { aid: "A", - text: ["灵"], - result: "incorrect", + text: "宁夏", + result: 1, }, { aid: "B", - text: ["活"], - result: "correct", + text: "新疆", + result: 0, }, ], - analysis: [ - `灵活成长系列是低波稳健的持有期固收产品，`, - `同时兼顾流动性和收益空间。`, + tips: [ + `有”塞上江南“美称的少数民族自治区`, ], }, { id: 3, - question: ["秋前隐后最可靠"], + question: ["欢迎你打卡这座『四季如春』的童话城：鲜花在冬天抢了春天的戏，海鸥与彩云齐飞，石头森林藏着万年奇景，蓝花雨巷把街道染成紫色星河。问：这座被春天永久收藏的城市是？"], answer: [ { aid: "A", - text: ["稳"], - result: "correct", + text: "贵阳", + result: 0, }, { aid: "B", - text: ["健"], - result: "incorrect", + text: "昆明", + result: 1, }, ], - analysis: [ - `稳健精选是主投低波稳健类资产的封闭产品系列，`, - `历史到期兑付正收益概率100%（数据时间2025.1.9）。`, + tips: [ + `”彩云之南“的首府`, ], }, { id: 4, - question: ["上等木料来造桥"], + question: ["欢迎你闯入这座通宵狂欢的『古今混搭城』：唐代楼阁挂满灯笼，网红不倒翁小姐姐在人群中飘摇。猜猜这是哪座古都的网红步行街，能把长安城的盛世繁华变成24小时不打烊的嘉年华的城市是？"], answer: [ { aid: "A", - text: ["策"], - result: "correct", + text: "太原", + result: 0, }, { aid: "B", - text: ["略"], - result: "incorrect", + text: "西安", + result: 1, }, ], - analysis: [ - `启元策略系列运用自研利率债量化交易模型，`, - `是利率时代有助提升收益的固收理财。`, + tips: [ + `拥有被成为”世界第八大奇迹“的秦始皇陵兵马俑`, ], }, { id: 5, - question: ["秋前别后再相聚"], + question: ["欢迎你来到这座『科技主题乐园』——摩天大楼间闪着AI电子屏瀑布，无人机表演在夜空中拼出会动的二维码，华强北的电子零件能拼出太空卫星，问：哪座城市用代码写诗，让城市灯光秀变成通往未来的动画片？"], answer: [ { aid: "A", - text: ["稳"], - result: "incorrect", + text: "深圳", + result: 1, }, { aid: "B", - text: ["利"], - result: "correct", + text: "广州", + result: 0, }, ], - analysis: [ - `启元稳利以低波资产筑底，是闲钱理财升级好去处。`, - ], - }, - { - id: 6, - question: ["宝玉不在姑娘在"], - answer: [ - { - aid: "A", - text: ["安"], - result: "correct", - }, - { - aid: "B", - text: ["鑫"], - result: "incorrect", - }, - ], - analysis: [ - `新安鑫系列运用结构化工具风险向下有底，收益向上有空间，`, - `是投资者参与股市指数的“安鑫”之选。`, - ], - }, - { - id: 7, - question: ["水帘洞二十三"], - answer: [ - { - aid: "A", - text: ["坤"], - result: "incorrect", - }, - { - aid: "B", - text: ["润"], - result: "correct", - }, - ], - analysis: [ - `坤润红利价值的红利低波策略可筛选出低估值、`, - `高股息、高质量企业。`, - ], - }, - { - id: 8, - question: ["太阳的儿子"], - answer: [ - { - aid: "A", - text: ["星"], - result: "correct", - }, - { - aid: "B", - text: ["辰"], - result: "incorrect", - }, - ], - analysis: [ - `星辰系列以价值投资为基础，构建低风险低估值`, - `和持续成长的组合，是以绝对收益为目标的含权理财。`, - ], - }, - { - id: 9, - question: ["人来凑成桌"], - answer: [ - { - aid: "A", - text: ["卓"], - result: "correct", - }, - { - aid: "B", - text: ["越"], - result: "incorrect", - }, - ], - analysis: [ - `卓越稳健系列是适合中长期配置需求的“固收+理财”，`, - `在低息环境下通过合理的资产配置突显股债性价比。`, - ], - }, - { - id: 10, - question: ["相逢立即成知音"], - answer: [ - { - aid: "A", - text: ["智"], - result: "correct", - }, - { - aid: "B", - text: ["享"], - result: "incorrect", - }, - ], - analysis: [ - `智享全周期运用全天候策略均衡配置全球多元资产，`, - `助力投资者把握全球市场的交易机会。`, - ], - }, - { - id: 11, - question: ["春来又听泉声响"], - answer: [ - { - aid: "A", - text: ["智"], - result: "correct", - }, - { - aid: "B", - text: ["享"], - result: "incorrect", - }, - ], - analysis: [ - `权心全益是平安理财发挥多资产多策略投资优势，`, - `用心捕捉权益市场机会，打造稳健的含权产品体系。`, + tips: [ + `全国最早实行对外开放的四个经济特区之一`, ], }, ]; diff --git a/src/page/Home/App.vue b/src/page/Home/App.vue index de06649..72bfc25 100644 --- a/src/page/Home/App.vue +++ b/src/page/Home/App.vue @@ -79,7 +79,7 @@ const myPrizeFn = (item) => { }; const QuestionListRef= ref(null) -const showQuestionList = ref(false); +const showQuestionList = ref(true); const questionListFn = (item) => { if (item.action == "hide") { showQuestionList.value = false; @@ -243,7 +243,8 @@ const playMusic = () => {