Hooke / swx_weapp

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
7656caad 1 parent 3e2a842a

联调生成小程序二维码

Inline Side-by-side
Showing 2 changed files with 216 additions and 204 deletions
1 /* 1 /*
2 * @Date: 2022-10-20 13:15:00 2 * @Date: 2022-10-20 13:15:00
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-10-26 11:36:29 4 + * @LastEditTime: 2022-10-28 17:34:06
5 * @FilePath: /swx/src/api/Activity/index.js 5 * @FilePath: /swx/src/api/Activity/index.js
6 * @Description: 活动信息 6 * @Description: 活动信息
7 */ 7 */
...@@ -13,6 +13,7 @@ const Api = { ...@@ -13,6 +13,7 @@ const Api = {
13 ACTIVITY_COPY: '/srv/?a=activity_copy', 13 ACTIVITY_COPY: '/srv/?a=activity_copy',
14 ACTIVITY_END: '/srv/?a=activity_end', 14 ACTIVITY_END: '/srv/?a=activity_end',
15 ACTIVITY_DEL: '/srv/?a=activity_del', 15 ACTIVITY_DEL: '/srv/?a=activity_del',
16 + ACTIVITY_QRCODE: '/srv/?a=activity_info_qrcode',
16 } 17 }
17 18
18 /** 19 /**
...@@ -44,3 +45,9 @@ export const endActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_END, params) ...@@ -44,3 +45,9 @@ export const endActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_END, params)
44 * @returns 45 * @returns
45 */ 46 */
46 export const delActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_DEL, params)); 47 export const delActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_DEL, params));
48 +
49 +/**
50 + * @description: 生成小程序码
51 + * @returns
52 + */
53 +export const qrCodeActivityAPI = (params) => fn(fetch.get(Api.ACTIVITY_QRCODE, params));
......
1 <!-- 1 <!--
2 * @Date: 2022-09-26 14:36:57 2 * @Date: 2022-09-26 14:36:57
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-10-28 13:50:13 4 + * @LastEditTime: 2022-10-28 17:56:57
5 * @FilePath: /swx/src/pages/activityDetail/index.vue 5 * @FilePath: /swx/src/pages/activityDetail/index.vue
6 * @Description: 活动详情页 6 * @Description: 活动详情页
7 --> 7 -->
...@@ -152,6 +152,7 @@ import PosterBuilder from '@/components/PosterBuilder/index.vue'; ...@@ -152,6 +152,7 @@ import PosterBuilder from '@/components/PosterBuilder/index.vue';
152 import { ref, onMounted } from "vue"; 152 import { ref, onMounted } from "vue";
153 import * as dayjs from 'dayjs' 153 import * as dayjs from 'dayjs'
154 import { infoUserAPI } from '@/api/User/index'; 154 import { infoUserAPI } from '@/api/User/index';
155 +import { qrCodeActivityAPI } from '@/api/Activity/index';
155 import icon_share from '@/images/icon/share.png' 156 import icon_share from '@/images/icon/share.png'
156 157
157 const nickname = ref(''); 158 const nickname = ref('');
...@@ -196,232 +197,236 @@ const onClickPost = () => { ...@@ -196,232 +197,236 @@ const onClickPost = () => {
196 const startDraw = ref(false) 197 const startDraw = ref(false)
197 const posterPath = ref('') 198 const posterPath = ref('')
198 let base = {} 199 let base = {}
199 - 200 +let qrcode_url = '';
200 const start = async () => { 201 const start = async () => {
201 const { code, data } = await activityInfoAPI({ i: getCurrentPageParam().id }); 202 const { code, data } = await activityInfoAPI({ i: getCurrentPageParam().id });
202 if (code) { 203 if (code) {
203 data.activity.activity_time = formatDate(data.activity.activity_time); 204 data.activity.activity_time = formatDate(data.activity.activity_time);
204 const activity = data.activity; 205 const activity = data.activity;
205 - base = { 206 + const qrcode = await qrCodeActivityAPI({ i: getCurrentPageParam().id });
206 - width: 1024, 207 + if (qrcode.code) {
207 - height: 1334, 208 + qrcode_url = qrcode.data.qrcode_url;
208 - backgroundColor: '', 209 + base = {
209 - debug: false, 210 + width: 1024,
210 - blocks: [ 211 + height: 1334,
211 - { 212 + backgroundColor: '',
212 - x: 40, 213 + debug: false,
213 - y: 20, 214 + blocks: [
214 - width: 950, 215 + {
215 - height: 1200, 216 + x: 40,
216 - paddingLeft: 0, 217 + y: 20,
217 - paddingRight: 0, 218 + width: 950,
218 - borderWidth: 1, 219 + height: 1200,
219 - borderColor: '#D9DCD5', 220 + paddingLeft: 0,
220 - backgroundColor: '#fff', 221 + paddingRight: 0,
221 - borderRadius: 16, 222 + borderWidth: 1,
222 - // borderRadiusGroup: [0, 0, 18, 18], 223 + borderColor: '#D9DCD5',
223 - }, 224 + backgroundColor: '#fff',
224 - { 225 + borderRadius: 16,
225 - x: 40, 226 + // borderRadiusGroup: [0, 0, 18, 18],
226 - y: 730, 227 + },
227 - // width: 580, 228 + {
228 - height: 75, 229 + x: 40,
229 - paddingLeft: 80, 230 + y: 730,
230 - paddingRight: 0, 231 + // width: 580,
231 - borderWidth: 0, 232 + height: 75,
232 - text: { 233 + paddingLeft: 80,
233 - x: 0, 234 + paddingRight: 0,
234 - y: 0, 235 + borderWidth: 0,
236 + text: {
237 + x: 0,
238 + y: 0,
239 + text: activity.activity_time,
240 + fontSize: 40,
241 + color: '#222',
242 + opacity: 1,
243 + baseLine: 'top',
244 + lineHeight: 48,
245 + lineNum: 2,
246 + textAlign: 'left',
247 + // width: 580,
248 + zIndex: 0,
249 + },
250 + backgroundColor: '#FFF9F3',
251 + // borderColor: 'red',
252 + // backgroundColor: '#EFF3F5',
253 + // borderRadius: 0,
254 + borderRadiusGroup: [0, 25, 25, 0],
255 + // borderRadius: 16,
256 + // zIndex: 100,
257 + },
258 + {
259 + x: 40,
260 + y: 830,
261 + // width: 580,
262 + height: 75,
263 + paddingLeft: 80,
264 + paddingRight: 0,
265 + borderWidth: 0,
266 + text: {
267 + x: 0,
268 + y: 0,
269 + text: activity.address,
270 + fontSize: 40,
271 + color: '#222',
272 + opacity: 1,
273 + baseLine: 'top',
274 + lineHeight: 48,
275 + lineNum: 2,
276 + textAlign: 'left',
277 + // width: 580,
278 + zIndex: 0,
279 + },
280 + backgroundColor: '#FFF9F3',
281 + // borderColor: 'red',
282 + // backgroundColor: '#EFF3F5',
283 + // borderRadius: 0,
284 + borderRadiusGroup: [0, 25, 25, 0],
285 + // borderRadius: 16,
286 + // zIndex: 100,
287 + },
288 + ],
289 + texts: [
290 + {
291 + x: 80,
292 + y: 630,
293 + text: activity.name,
294 + fontSize: 50,
295 + color: '#000',
296 + opacity: 1,
297 + baseLine: 'middle',
298 + lineHeight: 60,
299 + lineNum: 2,
300 + textAlign: 'left',
301 + width: 800,
302 + zIndex: 999,
303 + // fontWeight: 'bold',
304 + fontFamily: 'Monospace',
305 + },
306 + {
307 + x: 135,
308 + y: 770,
235 text: activity.activity_time, 309 text: activity.activity_time,
236 fontSize: 40, 310 fontSize: 40,
237 color: '#222', 311 color: '#222',
238 opacity: 1, 312 opacity: 1,
239 - baseLine: 'top', 313 + baseLine: 'middle',
240 lineHeight: 48, 314 lineHeight: 48,
241 lineNum: 2, 315 lineNum: 2,
242 textAlign: 'left', 316 textAlign: 'left',
243 // width: 580, 317 // width: 580,
244 - zIndex: 0, 318 + zIndex: 999,
245 }, 319 },
246 - backgroundColor: '#FFF9F3', 320 + {
247 - // borderColor: 'red', 321 + x: 135,
248 - // backgroundColor: '#EFF3F5', 322 + y: 870,
249 - // borderRadius: 0,
250 - borderRadiusGroup: [0, 25, 25, 0],
251 - // borderRadius: 16,
252 - // zIndex: 100,
253 - },
254 - {
255 - x: 40,
256 - y: 830,
257 - // width: 580,
258 - height: 75,
259 - paddingLeft: 80,
260 - paddingRight: 0,
261 - borderWidth: 0,
262 - text: {
263 - x: 0,
264 - y: 0,
265 text: activity.address, 323 text: activity.address,
266 fontSize: 40, 324 fontSize: 40,
267 color: '#222', 325 color: '#222',
268 opacity: 1, 326 opacity: 1,
269 - baseLine: 'top', 327 + baseLine: 'middle',
270 lineHeight: 48, 328 lineHeight: 48,
271 lineNum: 2, 329 lineNum: 2,
272 textAlign: 'left', 330 textAlign: 'left',
273 // width: 580, 331 // width: 580,
274 - zIndex: 0, 332 + zIndex: 999,
275 }, 333 },
276 - backgroundColor: '#FFF9F3', 334 + {
277 - // borderColor: 'red', 335 + x: 300,
278 - // backgroundColor: '#EFF3F5', 336 + y: 1080,
279 - // borderRadius: 0, 337 + text: nickname.value,
280 - borderRadiusGroup: [0, 25, 25, 0], 338 + fontSize: 50,
281 - // borderRadius: 16, 339 + color: '#333',
282 - // zIndex: 100, 340 + opacity: 1,
283 - }, 341 + baseLine: 'middle',
284 - ], 342 + textAlign: 'left',
285 - texts: [ 343 + lineHeight: 50,
286 - { 344 + lineNum: 1,
287 - x: 80, 345 + zIndex: 999,
288 - y: 630, 346 + },
289 - text: activity.name, 347 + {
290 - fontSize: 50, 348 + x: 300,
291 - color: '#000', 349 + y: 1150,
292 - opacity: 1, 350 + text: '邀请你一起来活动！',
293 - baseLine: 'middle', 351 + fontSize: 42,
294 - lineHeight: 60, 352 + color: '#8F9399',
295 - lineNum: 2, 353 + opacity: 1,
296 - textAlign: 'left', 354 + baseLine: 'middle',
297 - width: 800, 355 + textAlign: 'left',
298 - zIndex: 999, 356 + lineHeight: 42,
299 - // fontWeight: 'bold', 357 + lineNum: 1,
300 - fontFamily: 'Monospace', 358 + zIndex: 999,
301 - }, 359 + }
302 - { 360 + ],
303 - x: 135, 361 + images: [
304 - y: 770, 362 + {
305 - text: activity.activity_time, 363 + url: activity.cover,
306 - fontSize: 40, 364 + width: 950,
307 - color: '#222', 365 + height: 500,
308 - opacity: 1, 366 + x: 40,
309 - baseLine: 'middle', 367 + y: 20,
310 - lineHeight: 48, 368 + // borderRadius: 16,
311 - lineNum: 2, 369 + borderRadiusGroup: [18, 18, 0, 0],
312 - textAlign: 'left', 370 + zIndex: 10,
313 - // width: 580, 371 + // borderRadius: 150,
314 - zIndex: 999, 372 + // borderWidth: 10,
315 - }, 373 + // borderColor: 'red',
316 - { 374 + },
317 - x: 135, 375 + {
318 - y: 870, 376 + url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5d2bmijj200s00s0sh.jpg',
319 - text: activity.address, 377 + width: 40,
320 - fontSize: 40, 378 + height: 40,
321 - color: '#222', 379 + x: 80,
322 - opacity: 1, 380 + y: 750,
323 - baseLine: 'middle', 381 + borderRadius: 100,
324 - lineHeight: 48, 382 + borderWidth: 0,
325 - lineNum: 2, 383 + zIndex: 10,
326 - textAlign: 'left', 384 + },
327 - // width: 580, 385 + {
328 - zIndex: 999, 386 + url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5dc9q31j200o00u0ol.jpg',
329 - }, 387 + width: 35,
330 - { 388 + height: 40,
331 - x: 300, 389 + x: 80,
332 - y: 1080, 390 + y: 850,
333 - text: nickname.value, 391 + borderRadius: 100,
334 - fontSize: 50, 392 + borderWidth: 0,
335 - color: '#333', 393 + zIndex: 10,
336 - opacity: 1, 394 + },
337 - baseLine: 'middle', 395 + {
338 - textAlign: 'left', 396 + url: avatar.value,
339 - lineHeight: 50, 397 + width: 170,
340 - lineNum: 1, 398 + height: 170,
341 - zIndex: 999, 399 + x: 80,
342 - }, 400 + y: 1030,
343 - { 401 + borderRadius: 100,
344 - x: 300, 402 + borderWidth: 0,
345 - y: 1150, 403 + zIndex: 10,
346 - text: '邀请你一起来活动！', 404 + },
347 - fontSize: 42, 405 + {
348 - color: '#8F9399', 406 + url: qrcode_url,
349 - opacity: 1, 407 + width: 170,
350 - baseLine: 'middle', 408 + height: 170,
351 - textAlign: 'left', 409 + x: 750,
352 - lineHeight: 42, 410 + y: 1030,
353 - lineNum: 1, 411 + borderRadius: 100,
354 - zIndex: 999, 412 + borderWidth: 0,
355 - } 413 + zIndex: 10,
356 - ], 414 + },
357 - images: [ 415 + ],
358 - { 416 + lines: [
359 - url: activity.cover, 417 + {
360 - width: 950, 418 + startY: 970,
361 - height: 500, 419 + startX: 80,
362 - x: 40, 420 + endX: 950,
363 - y: 20, 421 + endY: 971,
364 - // borderRadius: 16, 422 + width: 1,
365 - borderRadiusGroup: [18, 18, 0, 0], 423 + color: '#8F9399',
366 - zIndex: 10, 424 + }
367 - // borderRadius: 150, 425 + ]
368 - // borderWidth: 10, 426 + }
369 - // borderColor: 'red', 427 + startDraw.value = true;
370 - }, 428 + if (!posterPath.value) Taro.showLoading();
371 - {
372 - url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5d2bmijj200s00s0sh.jpg',
373 - width: 40,
374 - height: 40,
375 - x: 80,
376 - y: 750,
377 - borderRadius: 100,
378 - borderWidth: 0,
379 - zIndex: 10,
380 - },
381 - {
382 - url: 'https://tva1.sinaimg.cn/large/5f01a858gy1h6l5dc9q31j200o00u0ol.jpg',
383 - width: 35,
384 - height: 40,
385 - x: 80,
386 - y: 850,
387 - borderRadius: 100,
388 - borderWidth: 0,
389 - zIndex: 10,
390 - },
391 - {
392 - url: avatar.value,
393 - width: 170,
394 - height: 170,
395 - x: 80,
396 - y: 1030,
397 - borderRadius: 100,
398 - borderWidth: 0,
399 - zIndex: 10,
400 - },
401 - {
402 - url: 'https://pic.juncao.cc/cms/images/minapp.jpg',
403 - width: 170,
404 - height: 170,
405 - x: 750,
406 - y: 1030,
407 - borderRadius: 100,
408 - borderWidth: 0,
409 - zIndex: 10,
410 - },
411 - ],
412 - lines: [
413 - {
414 - startY: 970,
415 - startX: 80,
416 - endX: 950,
417 - endY: 971,
418 - width: 1,
419 - color: '#8F9399',
420 - }
421 - ]
422 } 429 }
423 - startDraw.value = true;
424 - if (!posterPath.value) Taro.showLoading();
425 } 430 }
426 } 431 }
427 const drawSuccess = (result) => { 432 const drawSuccess = (result) => {
......