This commit is contained in:
2025-04-18 16:50:47 +08:00
parent b3ff0f54ae
commit 10fcb332d4
8 changed files with 41 additions and 17 deletions

View File

@@ -14,6 +14,14 @@ const posterId = ref(userStore.posterId); //海报背景id111
console.log('海报id', posterId.value);
// 二维码坐标
const eqcodePosition = [
{w:750,h:2107,x: 527, y: 1882},
{w:750,h:2183,x: 527, y: 1959},
{w:750,h:2194,x: 527, y: 1973},
{w:750,h:2045,x: 527, y: 1824},
{w:750,h:2194,x: 527, y: 1979},
]
const posterImgList = reactive([
new URL(`../assets/images/result/poster-1.jpg`, import.meta.url).href,
@@ -51,10 +59,10 @@ const executeTasks = async () => {
if (posterImgList[posterId.value - 1] && eqcodePic.value) {
posterCreate(
{ width: 750, height: 2106 },
{ width: 750, height: eqcodePosition[posterId.value-1].h },
[
{ name: "bg", src: posterImgList[posterId.value - 1], pos: { w: 750, h: 2106, x: 0, y: 0 } },
{ name: "eqcode", src: eqcodePic.value, pos: { w: 178, h: 178, x: 532, y: 1892 } },
{ name: "bg", src: posterImgList[posterId.value - 1], pos: { w: 750, h: eqcodePosition[posterId.value-1].h, x: 0, y: 0 } },
{ name: "eqcode", src: eqcodePic.value, pos: { w: 187, h: 187, x: eqcodePosition[posterId.value-1].x, y: eqcodePosition[posterId.value-1].y } },
]
);
} else {
@@ -220,7 +228,7 @@ const posterCreate = (option, imageArr) => {
<div class="cls-btn-box">
<div class="cls-btn" @click="hidePop($event)"></div>
</div>
<div class="poster-box">
<div class="poster-box" :class="'poster-box-' + posterId">
<div class="poster" :class="'poster-' + posterId">
<img id="posterSrc" src="" alt="" srcset="">
</div>
@@ -324,6 +332,22 @@ const posterCreate = (option, imageArr) => {
}
}
.poster-box-1{
@include box(713px, 995px);
}
.poster-box-2{
@include box(711px, 1041px);
}
.poster-box-3{
@include box(713px, 995px);
}
.poster-box-4{
@include box(713px, 995px);
}
.poster-box-5{
@include box(713px, 995px);
}
.btn-box {
@include box(550px, 99px);
@@ -353,14 +377,14 @@ const posterCreate = (option, imageArr) => {
visibility: hidden;
.tips-pic {
@include pos(100px, 100px, 600px, 140px);
@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, 260px);
@include pos(750px, 100px, 0px, 300px);
color: #ffffff;
text-align: right;
}