This commit is contained in:
王一嘉
2025-07-14 18:05:57 +08:00
parent d68450709b
commit 62fd756962
2 changed files with 14 additions and 12 deletions

View File

@@ -1,6 +1,6 @@
<script setup> <script setup>
import UQRCode from 'uqrcodejs'; import UQRCode from 'uqrcodejs';
import {onMounted, ref} from 'vue'; import {onMounted, ref, onUnmounted} from 'vue';
const emits = defineEmits(['handleLongPress']); const emits = defineEmits(['handleLongPress']);
const {bg, invite, member_url} = defineProps({ const {bg, invite, member_url} = defineProps({
@@ -25,13 +25,22 @@ const itemList = [
const CanvasRef = ref(); const CanvasRef = ref();
const QRRef = ref(); const QRRef = ref();
let canvas = null; let canvas = null;
let timer = null;
const imageSrc = ref(null);
onMounted(() => { onMounted(() => {
const _canvas = CanvasRef.value.$el.children[0]; const _canvas = CanvasRef.value.$el.children[0];
const ctx = _canvas.getContext("2d"); const ctx = _canvas.getContext("2d");
canvas = _canvas; canvas = _canvas;
draw(ctx, _canvas); draw(ctx, _canvas);
timer = setInterval(() => {
imageSrc.value = canvas.toDataURL('image/png')
}, 1000)
}); });
onUnmounted(() => {
clearInterval(timer);
})
const draw = (ctx, canvas) => { const draw = (ctx, canvas) => {
const img = new Image(); const img = new Image();
img.crossOrigin = 'Anonymous'; img.crossOrigin = 'Anonymous';
@@ -59,18 +68,15 @@ const draw = (ctx, canvas) => {
}); });
} }
} }
const handleLongPress = () => {
emits('handleLongPress', canvas.toDataURL('image/png'));
}
</script> </script>
<template> <template>
<view class="!size-full relative" @longpress="handleLongPress"> <view class="!size-full relative">
<canvas class="!absolute !size-[200px] opacity-0" ref="QRRef"></canvas> <canvas class="!absolute !size-[200px] opacity-0" ref="QRRef"></canvas>
<canvas <canvas
class="!size-full" class="!size-full"
ref="CanvasRef"/> ref="CanvasRef"/>
<image class="!size-full !absolute z-50 left-0 top-0 test" :src="imageSrc"></image>
</view> </view>
</template> </template>

View File

@@ -11,6 +11,7 @@ import yqhyBg from '../../static/icons/yqhy-bg.png';
import XNav from "../../components/XNav.vue"; import XNav from "../../components/XNav.vue";
import Api from "../../api/index.js"; import Api from "../../api/index.js";
import Poster from "./Poster.vue"; import Poster from "./Poster.vue";
import {download} from "../../utils/uils.js";
const swiperCur = ref(0); const swiperCur = ref(0);
const showActionSheet = ref(false); const showActionSheet = ref(false);
@@ -39,12 +40,7 @@ const handleLongPress = (base64) => {
const success = ({type}) => { const success = ({type}) => {
if (type === 1) { if (type === 1) {
const link = document.createElement('a'); download(nowActive);
link.href = nowActive;
link.download = '邀请海报.png';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
} }
} }
</script> </script>