This commit is contained in:
2026-04-23 14:57:35 +08:00
parent c77780fa0e
commit 739e08157b
97 changed files with 6120 additions and 14939 deletions

View File

@@ -131,14 +131,14 @@ function scaleQrRectForPoster(position, posterInfo, modeKey) {
// QR码位置配置为每个海报单独配置
const qrCodePositions = ref({
promote: [
{ x: 405, y: 1620, size: 480 }, // tg_qrcode_1.png
{ x: 405, y: 1620, size: 480 }, // tg_qrcode_2.jpg
{ x: 405, y: 1620, size: 480 }, // tg_qrcode_3.jpg
{ x: 405, y: 1620, size: 480 }, // tg_qrcode_4.jpg
{ x: 405, y: 1620, size: 480 }, // tg_qrcode_5.jpg
{ x: 180, y: 1440, size: 300 }, // tg_qrcode_6.jpg
{ x: 255, y: 940, size: 250 }, // tg_qrcode_7.jpg
{ x: 255, y: 940, size: 250 }, // tg_qrcode_8.jpg
{ x: 405, y: 1270, size: 440 }, // tg_qrcode_1.png
{ x: 405, y: 1270, size: 440 }, // tg_qrcode_2.jpg
{ x: 405, y: 1270, size: 440 }, // tg_qrcode_3.jpg
{ x: 405, y: 1270, size: 440 }, // tg_qrcode_4.jpg
{ x: 405, y: 1270, size: 440 }, // tg_qrcode_5.jpg
{ x: 210, y: 1660, size: 340 }, // tg_qrcode_6.jpg
{ x: 405, y: 1270, size: 440 }, // tg_qrcode_7.jpg
{ x: 405, y: 1270, size: 440 }, // tg_qrcode_8.jpg
],
// invitation模式的配置 (yq_qrcode)
invitation: [
@@ -784,37 +784,28 @@ export default {
<!-- 放在弹窗外避免 wd-popup 关闭时子树未挂载导致 APP 无法 createCanvasContext -->
<canvas v-if="!isWebPlatform" :id="QR_GEN_CANVAS_ID" :canvas-id="QR_GEN_CANVAS_ID" class="poster-qr-gen-canvas" />
<!-- App仅作 renderjs change 锚点真正画布在 renderjs createElement('canvas') -->
<view
v-if="!isWebPlatform" class="poster-renderjs-anchor" :poster-merge-req="posterMergeRequest"
:change:poster-merge-req="posterRender.onMergeReqChange" aria-hidden="true"
/>
<view v-if="!isWebPlatform" class="poster-renderjs-anchor" :poster-merge-req="posterMergeRequest"
:change:poster-merge-req="posterRender.onMergeReqChange" aria-hidden="true" />
<wd-popup v-model="show" round position="bottom" :style="{ maxHeight: '95vh' }">
<view class="qrcode-popup-container">
<view class="qrcode-content">
<swiper
class="poster-swiper rounded-lg shadow sm:rounded-xl" indicator-color="white" circular indicator-dots
@change="onSwipeChange"
>
<swiper class="poster-swiper rounded-lg shadow sm:rounded-xl" indicator-color="white" circular indicator-dots
@change="onSwipeChange">
<swiper-item v-for="(_, index) in posterImages" :key="index" class="poster-swiper-item">
<view class="poster-canvas-box">
<template v-if="isWebPlatform">
<view class="poster-preview-box web-preview">
<canvas
:id="getCanvasId(index)" :ref="(el) => (posterCanvasRefs[index] = el)"
<canvas :id="getCanvasId(index)" :ref="(el) => (posterCanvasRefs[index] = el)"
:canvas-id="getCanvasId(index)" :width="posterCanvasSizes[index]?.width ?? 300"
:height="posterCanvasSizes[index]?.height ?? 300"
:style="posterCanvasContainStyle(index)"
class="poster-canvas poster-canvas--h5-contain rounded-lg sm:rounded-xl"
/>
:height="posterCanvasSizes[index]?.height ?? 300" :style="posterCanvasContainStyle(index)"
class="poster-canvas poster-canvas--h5-contain rounded-lg sm:rounded-xl" />
</view>
</template>
<template v-else>
<!-- App预览与保存同源aspectFit 在轮播高度内整图可见等比宽可不拉满 -->
<view v-if="posterCompositePath[index]" class="poster-app-preview">
<image
:src="posterCompositePath[index]" mode="aspectFit"
class="poster-app-composite rounded-lg sm:rounded-xl"
/>
<image :src="posterCompositePath[index]" mode="aspectFit"
class="poster-app-composite rounded-lg sm:rounded-xl" />
</view>
<view v-else class="poster-preview-placeholder">
<text class="poster-preview-placeholder-text">
@@ -874,10 +865,8 @@ export default {
</wd-popup>
<!-- 图片保存指引遮罩层 -->
<ImageSaveGuide
:show="showImageGuide" :image-url="currentImageUrl" :title="imageGuideTitle"
@close="closeImageGuide"
/>
<ImageSaveGuide :show="showImageGuide" :image-url="currentImageUrl" :title="imageGuideTitle"
@close="closeImageGuide" />
</template>
<style lang="scss" scoped>
@@ -943,7 +932,7 @@ export default {
box-sizing: border-box;
}
.poster-canvas-box > view {
.poster-canvas-box>view {
flex: 1;
min-width: 0;
min-height: 0;
@@ -1085,13 +1074,13 @@ export default {
}
}
/* 优化 van-divider 在小屏幕上的间距 */
:deep(.van-divider) {
/* 优化 wd-divider 在小屏幕上的间距 */
:deep(.wd-divider) {
margin: 0.5rem 0;
}
@media (min-width: 640px) {
:deep(.van-divider) {
:deep(.wd-divider) {
margin: 0.75rem 0;
}
}