Просмотр исходного кода

生成二维码,含团购和作品

孙志雷 6 лет назад
Родитель
Сommit
dacc259674

+ 79 - 42
component/share/share.js

@@ -8,6 +8,10 @@ Component({
     shareType: {
       type: 'String',
       value: ''
+    },
+    shareId: {
+      type: 'String',
+      value: ''
     }
   },
 
@@ -22,7 +26,9 @@ Component({
     iconImg: '',
     title: '',
     path: '',
-    QRCode:''
+    QRCodeImagePath:'',
+    QRCodeImageLocalPath:'',
+    groupPurchaseInfo:{}
   },
 
   /**
@@ -55,36 +61,52 @@ Component({
           }
         })
         .then(() => {
-          ctx.drawImage(this.data.QRCode, 217, 374, 135, 135);
-          console.log(ctx)
-          ctx.draw(true, function (res) {
-            wx.canvasToTempFilePath({
-              x: 0,
-              y: 0,
-              width: 370,
-              height: 507,
-              destWidth: 370,
-              destHeight: 507,
-              canvasId: 'myCanvas',
-              success: (res) => {
-                console.log(res.tempFilePath)
-                wx.saveImageToPhotosAlbum({
-                  filePath: res.path,
-                  success(res) {
-                    console.log(res);
+          debugger;
+          wx.getImageInfo({
+            src: this.data.QRCodeImagePath,//服务器返回的图片地址
+            success: function (res) {
+              //res.path是网络图片的本地地址
+              ctx.drawImage(res.path, 227, 364, 135, 135);
+
+
+
+
+              ctx.draw(true, function (res) {
+                wx.canvasToTempFilePath({
+                  x: 0,
+                  y: 0,
+                  width: 370,
+                  height: 507,
+                  destWidth: 370,
+                  destHeight: 507,
+                  canvasId: 'myCanvas',
+                  success: (res) => {
+                    console.log(res.tempFilePath)
+                    wx.saveImageToPhotosAlbum({
+                      filePath: res.path,
+                      success(res) {
+                        console.log(res);
+                      }
+                    })
+                    that.setData({
+                      imgUrls: res.tempFilePath
+                    }, () => {
+                      wx.hideLoading();
+                    })
+                  },
+                  fail: (res) => {
+                    console.log(res)
                   }
                 })
-                that.setData({
-                  imgUrls: res.tempFilePath
-                }, () => {
-                  wx.hideLoading();
-                })
-              },
-              fail: (res) => {
-                console.log(res)
-              }
-            })
-          })
+              })
+
+
+
+            },
+            fail: function (res) {
+              //失败回调
+            }
+          });
         })
 
 
@@ -92,6 +114,7 @@ Component({
 
     },
     share: function (data) {
+      debugger;
       if (this.data.shareType === 'works') {
 
         this.setData({
@@ -103,7 +126,8 @@ Component({
           // path: data.path,
           QRData:{
             page: data.path,
-            scene: data.scene
+            scene: data.scene,
+            qrCodeId: this.data.shareId
           }
         })
 
@@ -111,7 +135,18 @@ Component({
       if (this.data.shareType === 'group') {
         console.log('团购分享')
         this.setData({
-          shareFlag: !this.data.shareFlag
+          shareFlag: !this.data.shareFlag,
+          avatar: data.avatar,
+          author: data.author,
+          iconImg: data.iconImg,
+          title: data.title,
+          // path: data.path,
+          QRData:{
+            page: data.path,
+            scene: data.scene,
+            qrCodeId: this.data.shareId
+          },
+          groupPurchaseInfo: data.groupPurchaseInfo
         })
       }
       if (this.data.shareType === 'class') {
@@ -127,11 +162,12 @@ Component({
       let download = new Promise((resolve, reject) => {
         let QRCode = () => {
           // 生成二维码并下载
+          debugger;
           httpRequestApi.createQRCode(this.data.QRData).success(res => {
             // let base64 = wx.arrayBufferToBase64(res.data);
             // console.log(a)
             this.setData({
-              QRCode: res.data
+              QRCodeImagePath: res.data.data
             })
             // wx.downloadFile({
             //   url: res,
@@ -146,7 +182,7 @@ Component({
   
             //   }
             // });
-            console.log(this.data.QRCode)
+            console.log(this.data.QRCodeImagePath)
             console.log(res)
             resolve();
           })
@@ -251,27 +287,27 @@ Component({
     // 分享团购的主体内容
     drawGroupGut: function (ctx) {
       let group = new Promise((resolve, reject) => {
-        resolve(() => {
+        //resolve(() => {
           ctx.fillText('郎朗读书声是世上最美的声音', 50, 138)
-          ctx.drawImage('../../../static/groupImg/Combined Shape.png', 11, 348, 196, 65);
+        ctx.drawImage(this.data.groupPurchaseInfo.bgImg, 9, 205, 352, 145);
           ctx.drawImage('../../../static/groupImg/Rectangle 41.png', 134, 358, 59, 20);
           ctx.setFontSize(14)
           ctx.setFillStyle('#fff')
-          ctx.fillText('五人团', 149, 373)
+          ctx.fillText(`${this.data.groupPurchaseInfo.headcount}人团`, 149, 373)
           ctx.setFontSize(16)
           ctx.setFillStyle('#A95A00')
-          ctx.fillText('原价', 24, 373)
+          ctx.fillText('原价', 20, 373)
           ctx.setStrokeStyle('red')
           ctx.moveTo(64, 368)
           ctx.lineTo(114, 368)
           ctx.stroke()
-          ctx.fillText('¥99元', 64, 373)
+          ctx.fillText(`¥${parseFloat(this.data.groupPurchaseInfo.originPrice / 100).toFixed(2)}元`, 64, 373)
           ctx.setFontSize(18)
           ctx.fillText('团购价仅需', 20, 403)
-          ctx.fillText('元', 144, 403)
+          ctx.fillText('元', 174, 403)
           ctx.setFontSize(20)
           ctx.setFillStyle('red')
-          ctx.fillText('¥1', 109, 403)
+          ctx.fillText(`¥${parseFloat(this.data.groupPurchaseInfo.price / 100).toFixed(2)}`, 109, 403)
           ctx.drawImage('../../../static/groupImg/share_bottom.png', 3, 419, 370, 192);
           ctx.setFontSize(20)
           ctx.setFillStyle('red')
@@ -279,9 +315,10 @@ Component({
           ctx.setFontSize(18)
           ctx.setFillStyle('#000')
           ctx.fillText('长按识别二维码参加团购', 9, 493)
-        })
+        //})
+        resolve();
       })
-      return group();
+      return group;
     },
 
 

+ 19 - 9
pages/groupPage/collage-details/collage-details.js

@@ -8,6 +8,8 @@ Page({
    */
   data: {
     hideFlag: true,
+    groupPurchaseInfo: {},
+    organizer: {},
     surplusNum: '',
     joinUserList: [],
     surplusList: [],
@@ -31,11 +33,6 @@ Page({
     ]
   },
 
-  //分享好友触发事件
-  eventListener: function () {
-    //console.log(1);
-  },
-
   //规则页显示和隐藏
   hide: function () {
     this.setData({
@@ -43,14 +40,25 @@ Page({
     })
   },
   //显示分享页 
-  share: function () {
-    console.log(this.shareDialog)
-    this.shareDialog.share();
+  openShare: function () {
+    this.shareDialog = this.selectComponent("#share-dialog");
+    const data = {
+      avatar: this.data.organizer.avatar,
+      author: this.data.organizer.wechatName,
+      iconImg: this.data.groupPurchaseInfo.bgImg,
+      title: this.data.groupPurchaseInfo.productTitle,
+      path: `pages/groupPage/collage-details/collage-details`,
+      scene: `QR${this.data.orderId}`,
+      groupPurchaseInfo: this.data.groupPurchaseInfo
+    }
+    this.shareDialog.share(data);
   },
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
+    options.scene = 'QR1541862338777268';
+    debugger;
     wx.setNavigationBarTitle({
       title: '拼团详情'
     })
@@ -58,7 +66,7 @@ Page({
     if(!options.orderId) {
       return false;
     }
-    const orderId = options.orderId;
+    const orderId = options.orderId ? options.orderId : options.scene.replace('QR', '');
     this.setData({
       orderId
     })
@@ -72,6 +80,8 @@ Page({
       //时间转换
       const timeList = util.formatTime(res.data.data.groupPurchaseOrder.closeTime - res.data.data.groupPurchaseOrder.gmtModified);
       this.setData({
+        groupPurchaseInfo: res.data.data.groupPurchaseInfo,
+        organizer: res.data.data.organizer,
         surplusNum,
         joinUserList: res.data.data.joinUserList,
         surplusList: this.data.surplusList,

+ 2 - 2
pages/groupPage/collage-details/collage-details.wxml

@@ -46,7 +46,7 @@
             </view>
         </view>
-        <view class="invitation-btn" bindtap="share">
+        <view class="invitation-btn" bindtap="openShare">
             <image src="../../../static/groupImg/Invitation.png"></image>
             <text>邀请朋友参加</text>
         </view>
@@ -61,7 +61,7 @@
     </view>
 </view> 
 <canvas canvas-id="myCanvas" style="width:370px; height: 507px; position: absolute; left: -99rpx; top: -999rpx;"></canvas>
-<shareDialog id="share-dialog" shareType='group' bindcustomevent="eventListener"/>
+<shareDialog id="share-dialog" shareType='group' shareId="{{orderId}}"/>
 
 <popup
     typeOf="sendSuccess"

+ 4 - 2
pages/social/works/works.js

@@ -27,6 +27,8 @@ Page({
     },
     onLoad: function (option) {
         console.log(option)
+        debugger;
+        let id = option.id ? option.id : option.scene.replace('QR', '')
 
         wx.setNavigationBarTitle({
             title: option.title //页面标题为路由参数
@@ -34,10 +36,10 @@ Page({
 
         this.setData({
             title: option.title,
-            id: option.id
+            id
         })
         this.uid = wx.getStorageSync('uid');
-        this.getWorks(this.uid, option.id);
+        this.getWorks(this.uid, id);
     },
     // onReady: function () {
 

+ 3 - 3
pages/social/works/works.wxml

@@ -24,10 +24,10 @@
             </view>
         </scroll-view>
     </view>
-    <view class="commentSection">
+    <!-- <view class="commentSection">
         <view class="title">评论({{total}})</view>
         <input class="commentInput" bindconfirm="sendHandler" confirm-type="send" placeholder="听了这么多,说点什么吧" bindinput="inputValue"></input>
-    </view>
+    </view> -->
     <view class="commentArea">
         <view class="commentItem" wx:for="{{replyList}}" wx:key="{{index}}">
             <image class="avatar" src="{{item.avatar}}" />
@@ -68,7 +68,7 @@
     </view>
     <!-- 分享框 -->
     <canvas canvas-id="myCanvas" style="width:370px;z-index=99999; height: 507px; position: absolute; left: -99rpx; top: -999rpx;"></canvas>
-    <shareDialog id="share-dialog" shareType='works' />
+    <shareDialog id="share-dialog" shareType='works' shareId="{{id}}" />
     <!-- 评论框 -->
     <view class="replySection" wx:if="{{replyModal}}">
         <input bindblur="bindTextAreaBlur"  bindconfirm="replySB" confirm-type="send" placeholder="回复" bindinput="inputSBValue" auto-focus auto-height />

+ 2 - 2
project.config.json

@@ -36,12 +36,12 @@
 			"list": []
 		},
 		"miniprogram": {
-			"current": 5,
+			"current": 0,
 			"list": [
 				{
 					"id": 0,
 					"name": "edit",
-					"pathName": "pages/user/walletDetails/walletDetails",
+					"pathName": "pages/groupPage/my-group/my-group",
 					"query": ""
 				},
 				{