正在显示
10 个修改的文件
包含
240 行增加
和
172 行删除
images/qr_code.jpg
0 → 100644
55.6 KB
@@ -23,6 +23,8 @@ Page({ | @@ -23,6 +23,8 @@ Page({ | ||
23 | is_join:false, | 23 | is_join:false, |
24 | img_heights: [], //图片宽度 | 24 | img_heights: [], //图片宽度 |
25 | img_width: 750, //默认 | 25 | img_width: 750, //默认 |
26 | + show_canvas: false, | ||
27 | + can_save:false, | ||
26 | }, | 28 | }, |
27 | //获取图片真实宽度 | 29 | //获取图片真实宽度 |
28 | imageLoad: function (e) { | 30 | imageLoad: function (e) { |
@@ -246,6 +248,7 @@ Page({ | @@ -246,6 +248,7 @@ Page({ | ||
246 | count: res.data.count, // 留言板 | 248 | count: res.data.count, // 留言板 |
247 | is_send:res.data.is_send,//能否参加1:不能2:能 | 249 | is_send:res.data.is_send,//能否参加1:不能2:能 |
248 | }); | 250 | }); |
251 | + self.getCode();//获取二维码(此二维码不能进入活动详情,已改为小程序码) | ||
249 | // (0全部,2待拼成,3人数不足未拼成,4已拼成,5已取消,6已完成,7已评价,8已拼成(活动未结束),9删除 | 252 | // (0全部,2待拼成,3人数不足未拼成,4已拼成,5已取消,6已完成,7已评价,8已拼成(活动未结束),9删除 |
250 | const status = res.data.active.status; | 253 | const status = res.data.active.status; |
251 | if (status === 2 || status === 6 || status === 7 || status === 8) { | 254 | if (status === 2 || status === 6 || status === 7 || status === 8) { |
@@ -381,6 +384,35 @@ Page({ | @@ -381,6 +384,35 @@ Page({ | ||
381 | } | 384 | } |
382 | } | 385 | } |
383 | }, | 386 | }, |
387 | + //获取活动二维码 | ||
388 | + getCode() { | ||
389 | + const self = this; | ||
390 | + let url = '/portal/Index/qrCode'; | ||
391 | + let params = { | ||
392 | + id: self.data.detail_id, | ||
393 | + token:wx.getStorageSync('token'), | ||
394 | + type:2,//1拼活动,2拼餐 | ||
395 | + }; | ||
396 | + app.post(url, params, {}).then((res) => { | ||
397 | + console.log('获取活动二维码', res); | ||
398 | + if (+res.code === 1) { | ||
399 | + self.setData({qr_code:res.data},() => { | ||
400 | + // console.log('二维码',self.data.qr_code); | ||
401 | + wx.getImageInfo({ | ||
402 | + src: 'http://' + self.data.qr_code, | ||
403 | + success(res) { | ||
404 | + // console.log('二维码本地路径',res); | ||
405 | + self.setData({local_qr_code:res.path}); | ||
406 | + self.getLocalImage(); | ||
407 | + }, | ||
408 | + fail() { | ||
409 | + console.log('失败'); | ||
410 | + } | ||
411 | + }) | ||
412 | + }); | ||
413 | + } | ||
414 | + }) | ||
415 | + }, | ||
384 | //点击分享 | 416 | //点击分享 |
385 | share() { | 417 | share() { |
386 | this.setData({show_canvas: true}, () => { | 418 | this.setData({show_canvas: true}, () => { |
@@ -399,65 +431,117 @@ Page({ | @@ -399,65 +431,117 @@ Page({ | ||
399 | saveToPhone() { | 431 | saveToPhone() { |
400 | this.getPower(); | 432 | this.getPower(); |
401 | }, | 433 | }, |
402 | - //图片链接转成本地路径 | 434 | + //详情图链接转成本地路径 |
403 | getLocalImage() { | 435 | getLocalImage() { |
404 | - // http://doctor_wechat.w.bronet.cn/20190122101152.png | ||
405 | const self = this; | 436 | const self = this; |
406 | wx.getImageInfo({ | 437 | wx.getImageInfo({ |
407 | src: self.data.detail.banner[0], | 438 | src: self.data.detail.banner[0], |
408 | success(res) { | 439 | success(res) { |
409 | - console.log('图片链接转成本地路径',res); | ||
410 | - self.setData({local_img:res.path}) | ||
411 | - self.drawCard() | ||
412 | - console.log(res.width) | ||
413 | - console.log(res.height) | 440 | + // console.log('详情图本地路径',res); |
441 | + self.setData({local_img:res.path}); | ||
442 | + self.drawCard(); | ||
443 | + // console.log(res.width) | ||
444 | + // console.log(res.height) | ||
414 | } | 445 | } |
415 | }) | 446 | }) |
416 | }, | 447 | }, |
448 | + // 画圆角 ctx、x起点、y起点、w宽度、y高度、r圆角半径、fillColor填充颜色、strokeColor边框颜色 | ||
449 | + roundRect(ctx, x, y, w, h, r, fillColor, strokeColor) { | ||
450 | + const self = this; | ||
451 | + // 开始绘制 | ||
452 | + ctx.beginPath() | ||
453 | + | ||
454 | + // 绘制左上角圆弧 Math.PI = 180度 | ||
455 | + // 圆心x起点、圆心y起点、半径、以3点钟方向顺时针旋转后确认的起始弧度、以3点钟方向顺时针旋转后确认的终止弧度 | ||
456 | + ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5) | ||
457 | + | ||
458 | + // 绘制border-top | ||
459 | + // 移动起点位置 x终点、y终点 | ||
460 | + ctx.moveTo(x + r, y) | ||
461 | + // 画一条线 x终点、y终点 | ||
462 | + ctx.lineTo(x + w - r, y) | ||
463 | + // self.data.ctx.lineTo(x + w, y + r) | ||
464 | + | ||
465 | + // 绘制右上角圆弧 | ||
466 | + ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2) | ||
467 | + | ||
468 | + // 绘制border-right | ||
469 | + ctx.lineTo(x + w, y + h - r) | ||
470 | + // self.data.ctx.lineTo(x + w - r, y + h) | ||
471 | + | ||
472 | + // 绘制右下角圆弧 | ||
473 | + ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5) | ||
474 | + | ||
475 | + // 绘制border-bottom | ||
476 | + ctx.lineTo(x + r, y + h) | ||
477 | + // self.data.ctx.lineTo(x, y + h - r) | ||
478 | + | ||
479 | + // 绘制左下角圆弧 | ||
480 | + ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI) | ||
481 | + | ||
482 | + // 绘制border-left | ||
483 | + ctx.lineTo(x, y + r) | ||
484 | + // self.data.ctx.lineTo(x + r, y) | ||
485 | + | ||
486 | + if (fillColor) { | ||
487 | + // 因为边缘描边存在锯齿,最好指定使用 transparent 填充 | ||
488 | + ctx.setFillStyle(fillColor) | ||
489 | + // 对绘画区域填充 | ||
490 | + ctx.fill() | ||
491 | + } | ||
492 | + | ||
493 | + if (strokeColor) { | ||
494 | + // 因为边缘描边存在锯齿,最好指定使用 transparent 填充 | ||
495 | + ctx.setStrokeStyle(strokeColor) | ||
496 | + // 画出当前路径的边框 | ||
497 | + ctx.stroke() | ||
498 | + } | ||
499 | + // 关闭一个路径 | ||
500 | + // self.data.ctx.closePath() | ||
501 | + | ||
502 | + // 剪切,剪切之后的绘画绘制剪切区域内进行,需要save与restore | ||
503 | + ctx.clip() | ||
504 | + }, | ||
417 | drawCard() { | 505 | drawCard() { |
418 | console.log('开始画'); | 506 | console.log('开始画'); |
419 | const self = this; | 507 | const self = this; |
420 | //先创建一个画布 | 508 | //先创建一个画布 |
421 | const ctx = wx.createCanvasContext("canvas"); | 509 | const ctx = wx.createCanvasContext("canvas"); |
510 | + self.setData({ctx:ctx}); | ||
511 | + // self.roundRect(ctx,0,0,300,302,10,'transparent','transparent');//画圆角 | ||
512 | + // self.roundRect(ctx,0,0,350,402,10,'#000','#000');//画圆角 | ||
513 | + // ctx.arc(150, 75, 50, 0, 2 * Math.PI);//剪切 | ||
514 | + // ctx.setFillStyle('#ffffff'); | ||
515 | + // ctx.fill(); | ||
516 | + // ctx.clip(); | ||
422 | //填充背景色 | 517 | //填充背景色 |
423 | ctx.fillStyle = '#fff'; | 518 | ctx.fillStyle = '#fff'; |
424 | - ctx.fillRect(0, 0, 300, 150); | 519 | + ctx.fillRect(0, 0, 300, 400); |
425 | console.log(self.data.local_img); | 520 | console.log(self.data.local_img); |
521 | + console.log(self.data.qr_code); | ||
426 | //将图片转化为画布 | 522 | //将图片转化为画布 |
427 | - ctx.drawImage(self.data.local_img, 0, 0, 330, 150); | 523 | + ctx.drawImage(self.data.local_img, 0, 0, 300, 170);//详情图 |
428 | console.log(111); | 524 | console.log(111); |
429 | - // ctx.drawImage("../../../../images/tou.png", 20, 166, 30, 30);//头像 | ||
430 | - // ctx.drawImage("../../../../images/code.jpg", 220, 209, 60, 60);//头像 | ||
431 | - //用户名字 | ||
432 | - ctx.setFontSize(13); | ||
433 | - ctx.setFillStyle('#333333'); | 525 | + // ctx.drawImage(self.data.local_qr_code, 220, 209, 60, 60);//二维码 |
526 | + ctx.drawImage('../../../images/qr_code.jpg', 220, 209, 60, 60);//二维码 | ||
527 | + //标题 | ||
528 | + ctx.setFontSize(16); | ||
529 | + ctx.setFillStyle('#000'); | ||
434 | ctx.textAlign = "left"; | 530 | ctx.textAlign = "left"; |
435 | console.log(111); | 531 | console.log(111); |
436 | - ctx.fillText(self.data.detail.userName, 69, 187); | 532 | + ctx.fillText(self.data.detail.title, 26, 196.5); |
533 | + ctx.fillText(self.data.detail.title, 25.5, 197); | ||
437 | ctx.restore(); | 534 | ctx.restore(); |
438 | - //签到天数 | ||
439 | - ctx.setFontSize(17); | ||
440 | - ctx.setFillStyle('#2C82E6'); | ||
441 | - ctx.fillText('连续', 25, 229); | ||
442 | - ctx.restore(); | ||
443 | - ctx.setFillStyle('#2C82E6'); | ||
444 | - ctx.font = 'bold 22px sans-serif'; | ||
445 | - ctx.fillText(self.data.count, 63, 229); | ||
446 | - ctx.restore(); | ||
447 | - ctx.setFontSize(17); | ||
448 | - ctx.setFillStyle('#2C82E6'); | ||
449 | - ctx.font = 'normal 17px sans-serif'; | ||
450 | - ctx.fillText('天签到', 80, 229); | ||
451 | - ctx.restore(); | ||
452 | - | ||
453 | - const text = self.data.detail.content; | ||
454 | - // ctx.fillText('此处放文案此处放文案此处放文案此处放文案此处放文案此处放文案此处放文案', 25, 252,200); | ||
455 | - // ctx.restore(); | 535 | + //地点 |
536 | + ctx.setFontSize(13); | ||
537 | + ctx.setFillStyle('#000000'); | ||
538 | + ctx.fillText('地点:', 25, 229); | ||
539 | + const text = self.data.detail.address; | ||
456 | var chr = text.split("");//这个方法是将一个字符串分割成字符串数组 | 540 | var chr = text.split("");//这个方法是将一个字符串分割成字符串数组 |
457 | var temp = ""; | 541 | var temp = ""; |
458 | var row = []; | 542 | var row = []; |
459 | ctx.setFontSize(13); | 543 | ctx.setFontSize(13); |
460 | - ctx.setFillStyle('#333333'); | 544 | + ctx.setFillStyle('#000000'); |
461 | for (var a = 0; a < chr.length; a++) { | 545 | for (var a = 0; a < chr.length; a++) { |
462 | if (ctx.measureText(temp).width < 170) { | 546 | if (ctx.measureText(temp).width < 170) { |
463 | temp += chr[a]; | 547 | temp += chr[a]; |
@@ -470,10 +554,10 @@ Page({ | @@ -470,10 +554,10 @@ Page({ | ||
470 | } | 554 | } |
471 | row.push(temp); | 555 | row.push(temp); |
472 | 556 | ||
473 | - //如果数组长度大于2 则截取前两个 | ||
474 | - if (row.length > 2) { | ||
475 | - var rowCut = row.slice(0, 2); | ||
476 | - var rowPart = rowCut[1]; | 557 | + //如果数组长度大于1 则截取前1个 |
558 | + if (row.length > 1) { | ||
559 | + var rowCut = row.slice(0, 1); | ||
560 | + var rowPart = rowCut[0]; | ||
477 | var test = ""; | 561 | var test = ""; |
478 | var empty = []; | 562 | var empty = []; |
479 | for (var a = 0; a < rowPart.length; a++) { | 563 | for (var a = 0; a < rowPart.length; a++) { |
@@ -485,15 +569,20 @@ Page({ | @@ -485,15 +569,20 @@ Page({ | ||
485 | } | 569 | } |
486 | } | 570 | } |
487 | empty.push(test); | 571 | empty.push(test); |
488 | - var group = empty[0] + "...";//这里只显示两行,超出的用...表示 | ||
489 | - rowCut.splice(1, 1, group); | 572 | + var group = empty[0] + "...";//这里只显示一行,超出的用...表示 |
573 | + rowCut.splice(0, 1, group); | ||
490 | row = rowCut; | 574 | row = rowCut; |
491 | } | 575 | } |
492 | for (var b = 0; b < row.length; b++) { | 576 | for (var b = 0; b < row.length; b++) { |
493 | - ctx.fillText(row[b], 25, 252 + b * 16, 170); | 577 | + ctx.fillText(row[b], 63, 229 + b * 16, 150); |
494 | } | 578 | } |
495 | ctx.restore(); | 579 | ctx.restore(); |
496 | - | 580 | + //时间 |
581 | + ctx.setFontSize(13); | ||
582 | + ctx.setFillStyle('#333333'); | ||
583 | + ctx.fillText('时间:', 25, 249); | ||
584 | + ctx.fillText(self.data.end_time, 63, 249); | ||
585 | + ctx.restore(); | ||
497 | // ctx.drawImage("../../../../images/home-banner.png", 0, 0, 250, 150) | 586 | // ctx.drawImage("../../../../images/home-banner.png", 0, 0, 250, 150) |
498 | //成功执行,draw方法中进行回调 | 587 | //成功执行,draw方法中进行回调 |
499 | ctx.draw(true, function () { | 588 | ctx.draw(true, function () { |
@@ -24,11 +24,25 @@ | @@ -24,11 +24,25 @@ | ||
24 | <!--<text class='iconfont icon-shoucang0 star2'></text>--> | 24 | <!--<text class='iconfont icon-shoucang0 star2'></text>--> |
25 | <!--<text class="collect_word">收藏</text>--> | 25 | <!--<text class="collect_word">收藏</text>--> |
26 | <!--</view>--> | 26 | <!--</view>--> |
27 | - <button class="share" open-type="share"> | 27 | + <view class="share" bindtap="share"> |
28 | <view class="iconfont icon-fenxiang2"></view> | 28 | <view class="iconfont icon-fenxiang2"></view> |
29 | <text>分享</text> | 29 | <text>分享</text> |
30 | - </button> | 30 | + </view> |
31 | + <!--<button class="share" open-type="share">--> | ||
32 | + <!--<view class="iconfont icon-fenxiang2"></view>--> | ||
33 | + <!--<text>分享</text>--> | ||
34 | + <!--</button>--> | ||
35 | + </view> | ||
36 | + </view> | ||
37 | + <view class='wrap_note canvas-mask' wx:if="{{show_canvas}}" bindtap='hideCanvasMask'> | ||
38 | + <view class="shadow"> | ||
39 | + <canvas class='canvas-poster' canvas-id='canvas'></canvas> | ||
40 | + <view class="button-box"> | ||
41 | + <text bindtap="saveToPhone" class="save-to-phone">保存图片</text> | ||
42 | + <button class="share-btn" open-type="share">分享给好友</button> | ||
43 | + </view> | ||
31 | </view> | 44 | </view> |
45 | + <view class="close-btn" bindtap="closeCanvas"><text class="iconfont icon-guanbi"></text></view> | ||
32 | </view> | 46 | </view> |
33 | <swiper indicator-dots="{{false}}" current="{{current}}" bindchange="swiperChange" | 47 | <swiper indicator-dots="{{false}}" current="{{current}}" bindchange="swiperChange" |
34 | autoplay="{{true}}" interval="3000" duration="1000" | 48 | autoplay="{{true}}" interval="3000" duration="1000" |
@@ -577,4 +577,76 @@ swiper { | @@ -577,4 +577,76 @@ swiper { | ||
577 | left: 0; | 577 | left: 0; |
578 | z-index: 10; | 578 | z-index: 10; |
579 | background: rgba(0,0,0,0.3); | 579 | background: rgba(0,0,0,0.3); |
580 | +} | ||
581 | +.wrap_note { | ||
582 | + width: 100%; | ||
583 | + height: 100%; | ||
584 | + position: fixed; | ||
585 | + z-index: 20; | ||
586 | + background-color: rgba(0, 0, 0, 0.3); | ||
587 | + display: -webkit-box; | ||
588 | + display: -ms-flexbox; | ||
589 | + display: flex; | ||
590 | + -webkit-box-align: center; | ||
591 | + -ms-flex-align: center; | ||
592 | + align-items: center; | ||
593 | + -webkit-box-pack: center; | ||
594 | + -ms-flex-pack: center; | ||
595 | + justify-content: center; | ||
596 | + top: 0; | ||
597 | +} | ||
598 | +.canvas-mask { | ||
599 | + display: flex; | ||
600 | + flex-direction: column; | ||
601 | +} | ||
602 | +.shadow { | ||
603 | + /* background:#fff; */ | ||
604 | + box-shadow: 1rpx 1rpx 40rpx rgba(101, 101, 101, 0.1); | ||
605 | +} | ||
606 | +.canvas-poster { | ||
607 | + /* position: fixed; */ | ||
608 | + /* width: 600rpx; */ | ||
609 | + height: 678rpx; | ||
610 | + /* top: 100%; */ | ||
611 | + /* left: 100%; */ | ||
612 | + /* overflow: hidden; */ | ||
613 | +} | ||
614 | +.button-box { | ||
615 | + width: 100%; | ||
616 | + display: flex; | ||
617 | + align-items: center; | ||
618 | + justify-content: space-between; | ||
619 | + height: 56rpx; | ||
620 | + /* border-top: 1rpx solid #E8E8E8; */ | ||
621 | +} | ||
622 | +.save-to-phone, .share-btn{ | ||
623 | + width: 50%; | ||
624 | + line-height: 56rpx; | ||
625 | + color:#fff; | ||
626 | + font-size: 24rpx; | ||
627 | + text-align: center; | ||
628 | + padding:0; | ||
629 | + background:#323232; | ||
630 | + border-radius: 0; | ||
631 | +} | ||
632 | +.share-btn::after { | ||
633 | + border:0; | ||
634 | +} | ||
635 | +.save-to-phone { | ||
636 | + border-right: 1rpx solid #E8E8E8; | ||
637 | + border-bottom-left-radius: 20rpx; | ||
638 | +} | ||
639 | +.share-btn { | ||
640 | + border-bottom-right-radius: 20rpx; | ||
641 | +} | ||
642 | +.close-btn { | ||
643 | + color: #999999; | ||
644 | + font-size: 60rpx; | ||
645 | + border-radius: 50%; | ||
646 | + /* background-color: #fff; */ | ||
647 | + margin-top: 34rpx; | ||
648 | +} | ||
649 | +.close-btn .icon-guanbi { | ||
650 | + font-size: 50rpx; | ||
651 | + color: #fff; | ||
580 | } | 652 | } |
@@ -41,7 +41,7 @@ Page({ | @@ -41,7 +41,7 @@ Page({ | ||
41 | } | 41 | } |
42 | }) | 42 | }) |
43 | }, | 43 | }, |
44 | - //获取国外名 | 44 | + //获取国外列表 |
45 | getAbroadList() { | 45 | getAbroadList() { |
46 | const self = this; | 46 | const self = this; |
47 | let url = '/portal/Index/addr'; | 47 | let url = '/portal/Index/addr'; |
@@ -62,32 +62,7 @@ Page({ | @@ -62,32 +62,7 @@ Page({ | ||
62 | } | 62 | } |
63 | }) | 63 | }) |
64 | }, | 64 | }, |
65 | - //选择国内城市 | ||
66 | - chooseDomesticCity(e) { | ||
67 | - const current = e.currentTarget.dataset.index; | ||
68 | - wx.showLoading({title:'加载中',mask:true}); | ||
69 | - this.setData({is_show_city:false}); | ||
70 | - const lat = this.data.cityList[current].latng.split(',')[1]; | ||
71 | - const lng = this.data.cityList[current].latng.split(',')[0]; | ||
72 | - this.setData({lat: lat, lng: lng,addr:this.data.cityList[current].title}); | ||
73 | - // console.log('lat', 'lng',lat,lng); | ||
74 | - // this.getIndex(); | ||
75 | - }, | ||
76 | - //选择国外城市 | ||
77 | - chooseAbroadCity(e) { | ||
78 | - const current = e.currentTarget.dataset.index; | ||
79 | - wx.showLoading({title:'加载中',mask:true}); | ||
80 | - this.setData({ | ||
81 | - // current_city: e.detail.value, | ||
82 | - is_city_change: true, | ||
83 | - is_show_city:false | ||
84 | - }); | ||
85 | - const lat = this.data.AbroadCityList[current].latng.split(',')[1]; | ||
86 | - const lng = this.data.AbroadCityList[current].latng.split(',')[0]; | ||
87 | - this.setData({lat: lat, lng: lng,addr:this.data.AbroadCityList[current].title}); | ||
88 | - console.log('lat', 'lng',lat,lng); | ||
89 | - // this.getIndex(); | ||
90 | - }, | 65 | + //选择城市 |
91 | chooseCity(e) { | 66 | chooseCity(e) { |
92 | wx.showLoading({title:'加载中',mask:true}); | 67 | wx.showLoading({title:'加载中',mask:true}); |
93 | const current = e.currentTarget.dataset.index; | 68 | const current = e.currentTarget.dataset.index; |
@@ -276,76 +276,11 @@ Page({ | @@ -276,76 +276,11 @@ Page({ | ||
276 | }) | 276 | }) |
277 | } | 277 | } |
278 | }, | 278 | }, |
279 | - //获取国内城市列表 | ||
280 | - getCityList() { | ||
281 | - const self = this; | ||
282 | - let url = '/portal/Index/cityList'; | ||
283 | - app.post(url, {}, {}).then((res) => { | ||
284 | - console.log('获取城市列表', res); | ||
285 | - if (+res.code === 1) { | ||
286 | - const arr = []; | ||
287 | - res.data.list.forEach((item) => { | ||
288 | - arr.push(item.title) | ||
289 | - }); | ||
290 | - self.setData({ | ||
291 | - city_picker_list: arr, | ||
292 | - cityList:res.data.list, | ||
293 | - }); | ||
294 | - } | ||
295 | - }) | ||
296 | - }, | ||
297 | - //获取国外名 | ||
298 | - getAbroadList() { | ||
299 | - const self = this; | ||
300 | - let url = '/portal/Index/addr'; | ||
301 | - let params = { | ||
302 | - token: wx.getStorageSync('token'), | ||
303 | - }; | ||
304 | - app.post(url, params, {}).then((res) => { | ||
305 | - console.log('获取国外列表', res); | ||
306 | - if (+res.code === 1) { | ||
307 | - const arr = []; | ||
308 | - res.data.forEach((item) => { | ||
309 | - arr.push(item.title) | ||
310 | - }); | ||
311 | - self.setData({ | ||
312 | - Abroad_city_picker_list: arr, | ||
313 | - AbroadCityList:res.data, | ||
314 | - }); | ||
315 | - } | ||
316 | - }) | ||
317 | - }, | ||
318 | - //打开城市列表 | 279 | + //打开城市列表页面 |
319 | chooseCity() { | 280 | chooseCity() { |
320 | // this.setData({is_show_city:!this.data.is_show_city}) | 281 | // this.setData({is_show_city:!this.data.is_show_city}) |
321 | wx.navigateTo({url:'/pages/index/city-list/city-list'}) | 282 | wx.navigateTo({url:'/pages/index/city-list/city-list'}) |
322 | }, | 283 | }, |
323 | - //选择国内城市 | ||
324 | - chooseDomesticCity(e) { | ||
325 | - const current = e.currentTarget.dataset.index; | ||
326 | - wx.showLoading({title:'加载中',mask:true}); | ||
327 | - this.setData({is_show_city:false}); | ||
328 | - const lat = this.data.cityList[current].latng.split(',')[1]; | ||
329 | - const lng = this.data.cityList[current].latng.split(',')[0]; | ||
330 | - this.setData({lat: lat, lng: lng,addr:this.data.cityList[current].title}); | ||
331 | - // console.log('lat', 'lng',lat,lng); | ||
332 | - this.getIndex(); | ||
333 | - }, | ||
334 | - //选择国外城市 | ||
335 | - chooseAbroadCity(e) { | ||
336 | - const current = e.currentTarget.dataset.index; | ||
337 | - wx.showLoading({title:'加载中',mask:true}); | ||
338 | - this.setData({ | ||
339 | - // current_city: e.detail.value, | ||
340 | - is_city_change: true, | ||
341 | - is_show_city:false | ||
342 | - }); | ||
343 | - const lat = this.data.AbroadCityList[current].latng.split(',')[1]; | ||
344 | - const lng = this.data.AbroadCityList[current].latng.split(',')[0]; | ||
345 | - this.setData({lat: lat, lng: lng,addr:this.data.AbroadCityList[current].title}); | ||
346 | - console.log('lat', 'lng',lat,lng); | ||
347 | - this.getIndex(); | ||
348 | - }, | ||
349 | //切换城市 | 284 | //切换城市 |
350 | // cityPickerChange(e) { | 285 | // cityPickerChange(e) { |
351 | // this.setData({ | 286 | // this.setData({ |
@@ -3,6 +3,7 @@ | @@ -3,6 +3,7 @@ | ||
3 | <!--swiper--> | 3 | <!--swiper--> |
4 | <view class="head"> | 4 | <view class="head"> |
5 | <view class="position {{hidden_top?'hidden-active':'visible-active'}}"> | 5 | <view class="position {{hidden_top?'hidden-active':'visible-active'}}"> |
6 | + <!--第一版国内城市--> | ||
6 | <!--<picker class="picker" bindchange="cityPickerChange" value="{{current_city}}" range="{{city_picker_list}}" class="picker">--> | 7 | <!--<picker class="picker" bindchange="cityPickerChange" value="{{current_city}}" range="{{city_picker_list}}" class="picker">--> |
7 | <!--<view class="left">--> | 8 | <!--<view class="left">--> |
8 | <!--<view class="iconfont icon-location"></view>--> | 9 | <!--<view class="iconfont icon-location"></view>--> |
@@ -24,24 +25,6 @@ | @@ -24,24 +25,6 @@ | ||
24 | <!--<view class="iconfont icon-arrow-down"></view>--> | 25 | <!--<view class="iconfont icon-arrow-down"></view>--> |
25 | </view> | 26 | </view> |
26 | </view> | 27 | </view> |
27 | - <view class="section {{is_show_city?'visible-active':'hidden-active'}}" wx:if="{{is_show_city}}"> | ||
28 | - <scroll-view class="area_box {{is_long_screen?'add-height-left':''}}" scroll-y> | ||
29 | - <block wx:for="{{city_picker_list}}" wx:key="index"> | ||
30 | - <view class="area-test" data-index="{{index}}" wx:for-index="idx" bindtap="chooseDomesticCity" | ||
31 | - data-id="{{item.id}}"> | ||
32 | - <view class="area">{{item}}</view> | ||
33 | - </view> | ||
34 | - </block> | ||
35 | - </scroll-view> | ||
36 | - <scroll-view class="area_box {{is_long_screen?'add-height-left':''}}" scroll-y> | ||
37 | - <block wx:for="{{Abroad_city_picker_list}}" wx:key="index"> | ||
38 | - <view class="area-test" data-index="{{index}}" wx:for-index="idx" bindtap="chooseAbroadCity" | ||
39 | - data-id="{{item.id}}"> | ||
40 | - <view class="area">{{item}}</view> | ||
41 | - </view> | ||
42 | - </block> | ||
43 | - </scroll-view> | ||
44 | - </view> | ||
45 | <view class="modal_box" wx:if="{{is_show_city}}" bindtap="handleBackground" catchtouchmove="disableScroll"></view> | 28 | <view class="modal_box" wx:if="{{is_show_city}}" bindtap="handleBackground" catchtouchmove="disableScroll"></view> |
46 | <swiper indicator-dots="{{false}}" current="{{current}}" bindchange="swiperChange" | 29 | <swiper indicator-dots="{{false}}" current="{{current}}" bindchange="swiperChange" |
47 | autoplay="{{true}}" interval="3000" duration="1000"> | 30 | autoplay="{{true}}" interval="3000" duration="1000"> |
@@ -241,7 +241,7 @@ Page({ | @@ -241,7 +241,7 @@ Page({ | ||
241 | count:res.data.count, | 241 | count:res.data.count, |
242 | is_send:res.data.is_send,//能否参加1:不能2:能 | 242 | is_send:res.data.is_send,//能否参加1:不能2:能 |
243 | }); | 243 | }); |
244 | - self.getCode();//获取二维码 | 244 | + self.getCode();//获取二维码(此二维码不能进入活动详情,已改为小程序码) |
245 | // self.getImage(); | 245 | // self.getImage(); |
246 | // self.getLocalImage(); | 246 | // self.getLocalImage(); |
247 | // self.countDown(); | 247 | // self.countDown(); |
@@ -511,22 +511,22 @@ Page({ | @@ -511,22 +511,22 @@ Page({ | ||
511 | //先创建一个画布 | 511 | //先创建一个画布 |
512 | const ctx = wx.createCanvasContext("canvas"); | 512 | const ctx = wx.createCanvasContext("canvas"); |
513 | self.setData({ctx:ctx}); | 513 | self.setData({ctx:ctx}); |
514 | - self.roundRect(ctx,0,0,300,302,10,'transparent','transparent');//画圆角 | ||
515 | - ctx.arc(150, 75, 50, 0, 2 * Math.PI);//剪切 | ||
516 | - ctx.setFillStyle('#ffffff'); | ||
517 | - ctx.fill(); | ||
518 | - ctx.clip(); | 514 | + // self.roundRect(ctx,0,0,300,302,10,'transparent','transparent');//画圆角 |
515 | + // self.roundRect(ctx,0,0,350,402,10,'#000','#000');//画圆角 | ||
516 | + // ctx.arc(150, 75, 50, 0, 2 * Math.PI);//剪切 | ||
517 | + // ctx.setFillStyle('#ffffff'); | ||
518 | + // ctx.fill(); | ||
519 | + // ctx.clip(); | ||
519 | //填充背景色 | 520 | //填充背景色 |
520 | - // ctx.fillStyle = '#fff'; | ||
521 | - ctx.fillRect(30, 30, 300, 150); | 521 | + ctx.fillStyle = '#fff'; |
522 | + ctx.fillRect(0, 0, 300, 400); | ||
522 | console.log(self.data.local_img); | 523 | console.log(self.data.local_img); |
523 | console.log(self.data.qr_code); | 524 | console.log(self.data.qr_code); |
524 | //将图片转化为画布 | 525 | //将图片转化为画布 |
525 | - ctx.drawImage(self.data.local_img, 0, 0, 330, 170);//详情图 | 526 | + ctx.drawImage(self.data.local_img, 0, 0, 300, 170);//详情图 |
526 | console.log(111); | 527 | console.log(111); |
527 | - // ctx.drawImage("../../../../images/tou.png", 20, 166, 30, 30);//头像 | ||
528 | - // ctx.drawImage("../../../../images/code.jpg", 220, 209, 60, 60);//头像 | ||
529 | - ctx.drawImage(self.data.local_qr_code, 220, 209, 60, 60);//二维码 | 528 | + // ctx.drawImage(self.data.local_qr_code, 220, 209, 60, 60);//二维码 |
529 | + ctx.drawImage('../../../images/qr_code.jpg', 220, 209, 60, 60);//二维码 | ||
530 | //标题 | 530 | //标题 |
531 | ctx.setFontSize(16); | 531 | ctx.setFontSize(16); |
532 | ctx.setFillStyle('#000'); | 532 | ctx.setFillStyle('#000'); |
@@ -35,7 +35,7 @@ | @@ -35,7 +35,7 @@ | ||
35 | <canvas class='canvas-poster' canvas-id='canvas'></canvas> | 35 | <canvas class='canvas-poster' canvas-id='canvas'></canvas> |
36 | <view class="button-box"> | 36 | <view class="button-box"> |
37 | <text bindtap="saveToPhone" class="save-to-phone">保存图片</text> | 37 | <text bindtap="saveToPhone" class="save-to-phone">保存图片</text> |
38 | - <button class="share-btn" open-type="share">分享小程序</button> | 38 | + <button class="share-btn" open-type="share">分享给好友</button> |
39 | </view> | 39 | </view> |
40 | </view> | 40 | </view> |
41 | <view class="close-btn" bindtap="closeCanvas"><text class="iconfont icon-guanbi"></text></view> | 41 | <view class="close-btn" bindtap="closeCanvas"><text class="iconfont icon-guanbi"></text></view> |
@@ -609,19 +609,19 @@ swiper { | @@ -609,19 +609,19 @@ swiper { | ||
609 | } | 609 | } |
610 | .canvas-poster { | 610 | .canvas-poster { |
611 | /* position: fixed; */ | 611 | /* position: fixed; */ |
612 | - width: 553rpx; | ||
613 | - height: 532rpx; | 612 | + /* width: 600rpx; */ |
613 | + height: 678rpx; | ||
614 | /* top: 100%; */ | 614 | /* top: 100%; */ |
615 | /* left: 100%; */ | 615 | /* left: 100%; */ |
616 | /* overflow: hidden; */ | 616 | /* overflow: hidden; */ |
617 | } | 617 | } |
618 | .button-box { | 618 | .button-box { |
619 | - width: 545rpx; | 619 | + width: 100%; |
620 | display: flex; | 620 | display: flex; |
621 | align-items: center; | 621 | align-items: center; |
622 | justify-content: space-between; | 622 | justify-content: space-between; |
623 | height: 56rpx; | 623 | height: 56rpx; |
624 | - border-top: 1rpx solid #E8E8E8; | 624 | + /*border-top: 1rpx solid #E8E8E8;*/ |
625 | } | 625 | } |
626 | .save-to-phone, .share-btn{ | 626 | .save-to-phone, .share-btn{ |
627 | width: 50%; | 627 | width: 50%; |
-
请 注册 或 登录 后发表评论