liangzejun/palc-newyear2024
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
XGL-THINKPAD-X1\rucky 2024-01-23 19:10:52 +08:00
parent 35957f9f8d
commit ec457dc86c
7 changed files with 126 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
src/assets/images/result/product/ENFP .png → src/assets/images/result/product/ENFP.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.2 KiB

After

Width:  |  Height:  |  Size: 8.2 KiB

1
src/components/Draw.vue
View File

@ -9,6 +9,7 @@ import { drawApi } from "@/api";
// 页面配置初始化
const emit = defineEmits(["DrawPage"]);
const userStore = useMainStore();
const { toClipboard } = useClipboard()

25
src/components/Result.vue
View File

@ -123,7 +123,7 @@ const createPoster = (event) => {
{
name: "product",
src: mbtiObj.value.productPic,
pos: { w: 469, h: 102, x: 137, y: 911 },
pos: { w: mbtiObj.value.picPos.w, h: mbtiObj.value.picPos.h, x: 137, y: 911 },
},
// 二维码
{
@ -178,7 +178,7 @@ const createPoster = (event) => {
{
content: mbtiObj.value.product,
style: {
font: "normal 50px fzcy",
font: mbtiObj.value.type == 'ISTJ' || mbtiObj.value.type == 'INTJ' ? "normal 40px fzcy" : "normal 50px fzcy",
pos: { x: 70, y: 876 },
},
},
@ -237,8 +237,10 @@ const hideShare = () => {
</div>
</div>
<div class="mbti-product">
<div class="product">{{ mbtiObj.product }}</div>
<div class="produc-img">
<div class="product"
:class="mbtiObj.type == 'ISTJ' || mbtiObj.type == 'INTJ' ? 'adptFont' : ''"
>{{ mbtiObj.product }}</div>
<div class="produc-img" :style="{width:mbtiObj.picPos.w+'px',height:mbtiObj.picPos.h+'px'}">
<img :src="mbtiObj.productPic" alt="" srcset="" />
</div>
</div>
@ -367,7 +369,7 @@ const hideShare = () => {
}
.mbti-product {
@include pos(475px, 140px, 134px, 948px);
@include pos(630px, 140px, 134px, 948px);
font-family: "fzcy";
.product {
@ -376,12 +378,21 @@ const hideShare = () => {
text-shadow: 0px -1px 0px rgba(255, 255, 255, 0.004);
}
.adptFont{
font-style: 35px;
}
.produc-img {
@include box(469px, 102px);
// @include box(469px, 102px);
margin-left: 10px;
margin-top: 15px;
transform: rotate(0deg);
img {
width: 100%;
// width: 100%;
height: 100%;
@include box(50%,50%);
}
}
}

80
src/data/index.js
View File

@ -211,8 +211,10 @@ export const mbtiList = [
job: '物流师',
des: ['实际且注重事实的个人，', '可靠性不容怀疑'],
blessings: ['脚下有风眼里有光', '心里有爱袋里有财'],
product: '灵活成长存款存单91天',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '灵活成长存款存单91天持有',
productPic: new URL('../assets/images/result/product/ISTJ.png', import.meta.url).href,
picPos:{w:432,h:98}
},
{
type: 'ISTP',
@ -220,7 +222,8 @@ export const mbtiList = [
des: ['大胆而实际的实验家，', '擅长使用任何形式的工具'],
blessings: ['多吃不胖积极向上', '有钱有颜喜乐连年'],
product: '启航增强持有',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
productPic: new URL('../assets/images/result/product/ISTP.png', import.meta.url).href,
picPos:{w:322,h:107}
},
{
type: 'ESTP',
@ -228,39 +231,49 @@ export const mbtiList = [
des: ['聪明，精力充沛善于感知的人们，','每天都在冲向新的冒险'],
blessings: ['人间四月芳菲尽', '吃喝玩乐要尽兴'],
product: '7天成长',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
productPic: new URL('../assets/images/result/product/ESTP.png', import.meta.url).href,
picPos:{w:420,h:101}
},
{
type: 'ESTJ',
job: '总经理',
des: ['出色的管理者，', '在管理事情或人的方面无与伦比'],
blessings: ['朝辞白帝彩云间', '日进斗金赛神仙'],
product: '灵活成长90天',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '灵活成长90天持有',
productPic: new URL('../assets/images/result/product/ESTJ.png', import.meta.url).href,
picPos:{w:441,h:93}
},
{
type: 'ISFJ',
job: '守卫者',
des: ['非常专注而温暖的守护者，', '时刻准备保护爱着的人'],
blessings: ['万般熙攘化清风明月', '四方梦想皆如愿以偿'],
product: '启航一年定开1号',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '灵活成长30天持有',
productPic: new URL('../assets/images/result/product/ISFJ.png', import.meta.url).href,
picPos:{w:441,h:93}
},
{
type: 'ISFP',
job: '探险家',
des: ['灵活有魅力的艺术家，', '时刻准备着探索和体验新鲜事物'],
blessings: ['与时光共新生', '万象更新美好再叙'],
product: '启元策略360',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '启元策略360天持有',
productPic: new URL('../assets/images/result/product/ISFP.png', import.meta.url).href,
picPos:{w:395,h:115}
},
{
type: 'ESFP',
job: '表演者',
des: ['外向随和，', '对生活充满热情，享受物质生活'],
blessings: ['岁岁常欢愉', '年年皆胜意'],
product: '启元添利90天',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '启元添利90天持有',
productPic: new URL('../assets/images/result/product/ESFP.png', import.meta.url).href,
picPos:{w:438,h:93}
},
{
type: 'ESFJ',
@ -268,7 +281,9 @@ export const mbtiList = [
des: ['极有同情心，爱交往受欢迎的人们，', '总是热心提供帮助'],
blessings: ['心有繁花仪锦，', '归来不负韶华'],
product: '灵活成长日开3号',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
productPic: new URL('../assets/images/result/product/ESFJ.png', import.meta.url).href,
picPos:{w:469,h:68}
},
{
type: 'INFJ',
@ -276,7 +291,9 @@ export const mbtiList = [
des: ['安静而神秘，同时鼓舞人心，', '且不知疲倦的理想主义者'],
blessings: ['前路浩浩荡荡', '万事尽可期待'],
product: '启明日申季赎',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
productPic: new URL('../assets/images/result/product/INFJ.png', import.meta.url).href,
picPos:{w:321,h:105}
},
{
type: 'INFP',
@ -284,55 +301,64 @@ export const mbtiList = [
des: ['诗意，善良的利他主义者，', '总是热情地为正当理由提供帮助'],
blessings: ['山外青山楼外楼', '容光焕发没忧愁'],
product: '启元稳利30天',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
productPic: new URL('../assets/images/result/product/INFP.png', import.meta.url).href,
picPos:{w:321,h:105}
},
{
type: 'ENFP',
job: '竞选者',
des: ['热情，有创造力', '爱社交的自由自在的人'],
blessings: ['生活自在内心澎湃', '万物可爱满怀期待'],
product: '灵活成长添利180',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '灵活成长添利180天持有',
productPic: new URL('../assets/images/result/product/ENFP.png', import.meta.url).href,
picPos:{w:452,h:93}
},
{
type: 'ENFJ',
job: '主人公',
des: ['富有魅力鼓舞人心的领导者', '有使听众着迷的能力'],
blessings: ['是金子总会发光', '何况你是龙的传人'],
product: '新安鑫',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '安鑫系列',
productPic: new URL('../assets/images/result/product/ENFJ.png', import.meta.url).href,
picPos:{w:447,h:65}
},
{
type: 'INTJ',
job: '建筑师',
des: ['富有想象力和战略性的思想家，', '一切皆在计划之中'],
blessings: ['岁岁年年，共欢同乐，', '嘉庆与时新'],
product: '启元策略周享270',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '启元策略周享270天持有',
productPic: new URL('../assets/images/result/product/INTJ.png', import.meta.url).href,
picPos:{w:356,h:108}
},
{
type: 'INTP',
job: '逻辑学家',
des: ['具有创造力的发明家，', '对知识有着止不住的渴望'],
blessings: ['烟火向星辰', '所愿皆成真'],
product: '卓越稳健180持有',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '卓越稳健180天持有',
productPic: new URL('../assets/images/result/product/INTP.png', import.meta.url).href,
picPos:{w:372,h:95}
},
{
type: 'ENTP',
job: '辩论家',
des: ['聪明好奇的思想者，', '不会放弃任何智力上的挑战'],
blessings: ['忽如一夜春风来', '今年势必发大财'],
product: '灵活策略90天',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '灵活策略90天持有',
productPic: new URL('../assets/images/result/product/ENTP.png', import.meta.url).href,
picPos:{w:433,h:93}
},
{
type: 'ENTJ',
job: '指挥官',
des: ['大胆，富有想象力且意志强大的领导者，', '总能找到或创造解决方法'],
blessings: ['天生我材必有用', '福禄寿喜财全来'],
product: '星辰添利270',
productPic: new URL('../assets/images/result/product-1.png', import.meta.url).href,
product: '星辰添利270天持有',
productPic: new URL('../assets/images/result/product/ENTJ.png', import.meta.url).href,
picPos:{w:409,h:112}
},
]

56
src/page/Home/App.vue
View File

@ -19,7 +19,7 @@ import MyPrize from "@/components/MyPrize";
import Draw from "@/components/Draw";
import Result from "@/components/Result";
import Rule from "@/components/Rule";
import { createBGM, getQueryString, screenOrientation, isAndriod } from "@/plugins";
import { createBGM, getQueryString, screenOrientation, isAndriod,fontAdpat } from "@/plugins";
import { authorize, getUserInfo } from "@/api";
import { Toast } from "vant";
import { useMainStore } from "@/store";
@ -77,7 +77,7 @@ const drawFn = (item) => {
}
};
const showResult = ref(false);
const showResult = ref(true);
const resultFn = (item) => {
if (item.action == "hide") {
showResult.value = false;
@ -113,6 +113,24 @@ onMounted(() => {
createBGM();
// 开始加载组件
showLoad.value = true;
// ios自动播放音乐
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) => {
@ -184,39 +202,19 @@ onMounted(() => {
}
} else {
showLoad.value = true;
createBGM();
}
});
// 字体适配
const fontAdpat = () => {
if (
typeof WeixinJSBridge == "object" &&
typeof WeixinJSBridge.invoke == "function"
) {
handleFontSize();
} else {
if (document.addEventListener) {
document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
} else if (document.attachEvent) {
document.attachEvent("onWeixinJSBridgeReady", handleFontSize);
}
}
function handleFontSize() {
// 设置网页字体为默认大小
WeixinJSBridge.invoke("setFontSizeCallback", { fontSize: 0 });
// 重写设置网页字体大小的事件
WeixinJSBridge.on("menu:setfont", function () {
WeixinJSBridge.invoke("setFontSizeCallback", { fontSize: 0 });
});
}
};
const playMusic = () => {
if (isAndriod) {
var audio = document.getElementById("audio");
audio.play();
}
if(isAndriod){
var audioEle = document.getElementById("audio");
audioEle.play();
}
}

46
src/plugins/index.js
View File

@ -58,25 +58,6 @@ export function createBGM() {
setTimeout(() => {
audioAni.play()
}, 1000)
// 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();
});
}
@ -595,4 +576,29 @@ export function screenOrientation() {
},
false
);
}
}
// 字体适配
export function fontAdpat () {
if (
typeof WeixinJSBridge == "object" &&
typeof WeixinJSBridge.invoke == "function"
) {
handleFontSize();
} else {
if (document.addEventListener) {
document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
} else if (document.attachEvent) {
document.attachEvent("onWeixinJSBridgeReady", handleFontSize);
}
}
function handleFontSize() {
// 设置网页字体为默认大小
WeixinJSBridge.invoke("setFontSizeCallback", { fontSize: 0 });
// 重写设置网页字体大小的事件
WeixinJSBridge.on("menu:setfont", function () {
WeixinJSBridge.invoke("setFontSizeCallback", { fontSize: 0 });
});
}
};

2
src/store/index.js
View File

@ -6,7 +6,7 @@ export const useMainStore = defineStore("counter", {
return {
hasDraw: true, //是否有抽奖机会
token: 'INFJ',
MBTI: 'INTP', //测试结果
MBTI: 'INFJ', //测试结果
hasPrize: false, //是否有奖品
prizeCode: 'oggSVMbeLgSK', //兑换码
prizeMoney: '8.88', //金额