hookehuyr

联调生成小程序二维码

/*
* @Date: 2022-10-20 13:15:00
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2022-10-26 11:36:29
* @LastEditTime: 2022-10-28 17:34:06
* @FilePath: /swx/src/api/Activity/index.js
* @Description: 活动信息
*/
......@@ -13,6 +13,7 @@ const Api = {
ACTIVITY_COPY: '/srv/?a=activity_copy',
ACTIVITY_END: '/srv/?a=activity_end',
ACTIVITY_DEL: '/srv/?a=activity_del',
ACTIVITY_QRCODE: '/srv/?a=activity_info_qrcode',
}
/**
......@@ -44,3 +45,9 @@ export const endActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_END, params)
* @returns
*/
export const delActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_DEL, params));
/**
* @description: 生成小程序码
* @returns
*/
export const qrCodeActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_QRCODE, params));
......
<!--
* @Date: 2022-09-26 14:36:57
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2022-10-28 13:50:13
* @LastEditTime: 2022-10-28 17:56:57
* @FilePath: /swx/src/pages/activityDetail/index.vue
* @Description: 活动详情页
-->
......@@ -152,6 +152,7 @@ import PosterBuilder from '@/components/PosterBuilder/index.vue';
import { ref, onMounted } from "vue";
import * as dayjs from 'dayjs'
import { infoUserAPI } from '@/api/User/index';
import { qrCodeActivityAPI } from '@/api/Activity/index';
import icon_share from '@/images/icon/share.png'
const nickname = ref('');
......@@ -196,232 +197,236 @@ const onClickPost = () => {
const startDraw = ref(false)
const posterPath = ref('')
let base = {}
let qrcode_url = '';
const start = async () => {
const { code, data } = await activityInfoAPI({ i: getCurrentPageParam().id });
if (code) {
data.activity.activity_time = formatDate(data.activity.activity_time);
const activity = data.activity;
base = {
width: 1024,
height: 1334,
backgroundColor: '',
debug: false,
blocks: [
{
x: 40,
y: 20,
width: 950,
height: 1200,
paddingLeft: 0,
paddingRight: 0,
borderWidth: 1,
borderColor: '#D9DCD5',
backgroundColor: '#fff',
borderRadius: 16,
// borderRadiusGroup: [0, 0, 18, 18],
},
{
x: 40,
y: 730,
// width: 580,
height: 75,
paddingLeft: 80,
paddingRight: 0,
borderWidth: 0,
text: {
x: 0,
y: 0,
const qrcode = await qrCodeActivityAPI({ i: getCurrentPageParam().id });
if (qrcode.code) {
qrcode_url = qrcode.data.qrcode_url;
base = {
width: 1024,
height: 1334,
backgroundColor: '',
debug: false,
blocks: [
{
x: 40,
y: 20,
width: 950,
height: 1200,
paddingLeft: 0,
paddingRight: 0,
borderWidth: 1,
borderColor: '#D9DCD5',
backgroundColor: '#fff',
borderRadius: 16,
// borderRadiusGroup: [0, 0, 18, 18],
},
{
x: 40,
y: 730,
// width: 580,
height: 75,
paddingLeft: 80,
paddingRight: 0,
borderWidth: 0,
text: {
x: 0,
y: 0,
text: activity.activity_time,
fontSize: 40,
color: '#222',
opacity: 1,
baseLine: 'top',
lineHeight: 48,
lineNum: 2,
textAlign: 'left',
// width: 580,
zIndex: 0,
},
backgroundColor: '#FFF9F3',
// borderColor: 'red',
// backgroundColor: '#EFF3F5',
// borderRadius: 0,
borderRadiusGroup: [0, 25, 25, 0],
// borderRadius: 16,
// zIndex: 100,
},
{
x: 40,
y: 830,
// width: 580,
height: 75,
paddingLeft: 80,
paddingRight: 0,
borderWidth: 0,
text: {
x: 0,
y: 0,
text: activity.address,
fontSize: 40,
color: '#222',
opacity: 1,
baseLine: 'top',
lineHeight: 48,
lineNum: 2,
textAlign: 'left',
// width: 580,
zIndex: 0,
},
backgroundColor: '#FFF9F3',
// borderColor: 'red',
// backgroundColor: '#EFF3F5',
// borderRadius: 0,
borderRadiusGroup: [0, 25, 25, 0],
// borderRadius: 16,
// zIndex: 100,
},
],
texts: [
{
x: 80,
y: 630,
text: activity.name,
fontSize: 50,
color: '#000',
opacity: 1,
baseLine: 'middle',
lineHeight: 60,
lineNum: 2,
textAlign: 'left',
width: 800,
zIndex: 999,
// fontWeight: 'bold',
fontFamily: 'Monospace',
},
{
x: 135,
y: 770,
text: activity.activity_time,
fontSize: 40,
color: '#222',
opacity: 1,
baseLine: 'top',
baseLine: 'middle',
lineHeight: 48,
lineNum: 2,
textAlign: 'left',
// width: 580,
zIndex: 0,
zIndex: 999,
},
backgroundColor: '#FFF9F3',
// borderColor: 'red',
// backgroundColor: '#EFF3F5',
// borderRadius: 0,
borderRadiusGroup: [0, 25, 25, 0],
// borderRadius: 16,
// zIndex: 100,
},
{
x: 40,
y: 830,
// width: 580,
height: 75,
paddingLeft: 80,
paddingRight: 0,
borderWidth: 0,
text: {
x: 0,
y: 0,
{
x: 135,
y: 870,
text: activity.address,
fontSize: 40,
color: '#222',
opacity: 1,
baseLine: 'top',
baseLine: 'middle',
lineHeight: 48,
lineNum: 2,
textAlign: 'left',
// width: 580,
zIndex: 0,
zIndex: 999,
},
backgroundColor: '#FFF9F3',
// borderColor: 'red',
// backgroundColor: '#EFF3F5',
// borderRadius: 0,
borderRadiusGroup: [0, 25, 25, 0],
// borderRadius: 16,
// zIndex: 100,
},
],
texts: [
{
x: 80,
y: 630,
text: activity.name,
fontSize: 50,
color: '#000',
opacity: 1,
baseLine: 'middle',
lineHeight: 60,
lineNum: 2,
textAlign: 'left',
width: 800,
zIndex: 999,
// fontWeight: 'bold',
fontFamily: 'Monospace',
},
{
x: 135,
y: 770,
text: activity.activity_time,
fontSize: 40,
color: '#222',
opacity: 1,
baseLine: 'middle',
lineHeight: 48,
lineNum: 2,
textAlign: 'left',
// width: 580,
zIndex: 999,
},
{
x: 135,
y: 870,
text: activity.address,
fontSize: 40,
color: '#222',
opacity: 1,
baseLine: 'middle',
lineHeight: 48,
lineNum: 2,
textAlign: 'left',
// width: 580,
zIndex: 999,
},
{
x: 300,
y: 1080,
text: nickname.value,
fontSize: 50,
color: '#333',
opacity: 1,
baseLine: 'middle',
textAlign: 'left',
lineHeight: 50,
lineNum: 1,
zIndex: 999,
},
{
x: 300,
y: 1150,
text: '邀请你一起来活动!',
fontSize: 42,
color: '#8F9399',
opacity: 1,
baseLine: 'middle',
textAlign: 'left',
lineHeight: 42,
lineNum: 1,
zIndex: 999,
}
],
images: [
{
url: activity.cover,
width: 950,
height: 500,
x: 40,
y: 20,
// borderRadius: 16,
borderRadiusGroup: [18, 18, 0, 0],
zIndex: 10,
// borderRadius: 150,
// borderWidth: 10,
// borderColor: 'red',
},
{
url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5d2bmijj200s00s0sh.jpg',
width: 40,
height: 40,
x: 80,
y: 750,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
{
url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5dc9q31j200o00u0ol.jpg',
width: 35,
height: 40,
x: 80,
y: 850,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
{
url: avatar.value,
width: 170,
height: 170,
x: 80,
y: 1030,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
{
url: 'https://pic.juncao.cc/cms/images/minapp.jpg',
width: 170,
height: 170,
x: 750,
y: 1030,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
],
lines: [
{
startY: 970,
startX: 80,
endX: 950,
endY: 971,
width: 1,
color: '#8F9399',
}
]
{
x: 300,
y: 1080,
text: nickname.value,
fontSize: 50,
color: '#333',
opacity: 1,
baseLine: 'middle',
textAlign: 'left',
lineHeight: 50,
lineNum: 1,
zIndex: 999,
},
{
x: 300,
y: 1150,
text: '邀请你一起来活动!',
fontSize: 42,
color: '#8F9399',
opacity: 1,
baseLine: 'middle',
textAlign: 'left',
lineHeight: 42,
lineNum: 1,
zIndex: 999,
}
],
images: [
{
url: activity.cover,
width: 950,
height: 500,
x: 40,
y: 20,
// borderRadius: 16,
borderRadiusGroup: [18, 18, 0, 0],
zIndex: 10,
// borderRadius: 150,
// borderWidth: 10,
// borderColor: 'red',
},
{
url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5d2bmijj200s00s0sh.jpg',
width: 40,
height: 40,
x: 80,
y: 750,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
{
url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5dc9q31j200o00u0ol.jpg',
width: 35,
height: 40,
x: 80,
y: 850,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
{
url: avatar.value,
width: 170,
height: 170,
x: 80,
y: 1030,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
{
url: qrcode_url,
width: 170,
height: 170,
x: 750,
y: 1030,
borderRadius: 100,
borderWidth: 0,
zIndex: 10,
},
],
lines: [
{
startY: 970,
startX: 80,
endX: 950,
endY: 971,
width: 1,
color: '#8F9399',
}
]
}
startDraw.value = true;
if (!posterPath.value) Taro.showLoading();
}
startDraw.value = true;
if (!posterPath.value) Taro.showLoading();
}
}
const drawSuccess = (result) => {
......