Jelajahi Sumber

定制新增和bug修改

wangyong 5 tahun lalu
induk
melakukan
133be32ceb

TEMPAT SAMPAH
customized/images/customized/box_white_big_2.png


TEMPAT SAMPAH
customized/images/customized/box_white_big_2_out.png


+ 122 - 96
customized/pages/boxMade/boxComb/boxComb.js

@@ -8,12 +8,8 @@ Page({
    * 页面的初始数据
    */
   data: {
-    dataPositionObj: { //正面数据
-      top: 184,
-      left: 305,
-      width: 218,
-      height: 218,
-    },
+    dataPositionObj1: {},
+    dataPositionObj2: {},
     imgTouch: {
       isActive: "1",
       src: "https://dlz.info666.com//temp/d945bfb0-5cc6-406d-a814-cf63b099041f.jpg",
@@ -40,27 +36,15 @@ Page({
       height: 132
     },
     rpx: 1,
-    obverseImgObject: ['', '/customized/images/customized/cup_black_big.png', '/customized/images/customized/cup_black_side.png', '/customized/images/customized/cup_black_handle.png', '/customized/images/customized/cup_black_bottom.png', '/customized/images/customized/box_white_big_1.png', '/customized/images/customized/box_white_big_2.png'],
-    // obverseImgObject: {
-    //   '1': ,
-    //   /*正面 */
-    //   '2': '/customized/images/customized/cup_black_side.png',
-    //   /*侧面面 */
-    //   '3': '/customized/images/customized/cup_black_handle.png',
-    //   /*手柄 */
-    //   '4': '/customized/images/customized/cup_black_bottom.png',
-    //   /*底部 */
-    // },
+    obverseImgObject: {},
+
     imgSrcArray: [],
     buildSrcArrayText: {
       '1': '正面',
       '2': '背面',
     },
-    boxImg: {
-      '5': '/customized/images/customized/box_white_big_1_out.png',
-      '6': '/customized/images/customized/box_white_big_2_out.png',
-    },
     buildSrcArray: [],
+    dataId:[],
     customGoodsImg: "",
 
   },
@@ -68,7 +52,16 @@ Page({
   /**
    * 生命周期函数--监听页面加载
    */
-  onLoad: function (options) {},
+  onLoad: function (options) {
+    if ('dataId' in options) {
+      this.setData({
+        obverseImgObject: util.changeImg,//素材
+        dataPositionObj1: util.changeCup(options.dataId.split(',')[0].toString()).dataPositionObj,
+        dataPositionObj2: util.changeCup(options.dataId.split(',')[1].toString()).dataPositionObj,
+        dataId: options.dataId.split(',')
+      })
+    }
+  },
 
   /**
    * 生命周期函数--监听页面初次渲染完成
@@ -79,13 +72,14 @@ Page({
       title: '图片合成中...'
     })
     let that = this,
-      result = true;
+      result = true,
+      dataId = that.data.dataId;
 
-    if (wx.getStorageSync('madeCupImgData5') || wx.getStorageSync('madeCupFontData5')) {
-      that.getCombImg(that, 5);
+    if (wx.getStorageSync('madeCupImgData' + dataId[0]) || wx.getStorageSync('madeCupFontData' + dataId[0])) {
+      that.getCombImg(that, dataId[0],1);
       result = false
-    } else if (wx.getStorageSync('madeCupImgData6') || wx.getStorageSync('madeCupFontData6')) {
-      that.getCombImg(that, 6);
+    } else if (wx.getStorageSync('madeCupImgData' + dataId[1]) || wx.getStorageSync('madeCupFontData' + dataId[1])) {
+      that.getCombImg(that, dataId[1],2);
       result = false
     }
 
@@ -135,7 +129,7 @@ Page({
   onShareAppMessage: function () {
 
   },
-  getCombImg(that, i) {
+  getCombImg(that, i,id) {
     let imgTouch = null,
       dataPositionObj = null;
     that.setData({ // imgSrcArray 初始化
@@ -162,7 +156,7 @@ Page({
                 let dWidth = dataPositionObj.width / imgTouch.width;
                 // canvas截图区域与图片的高度比例
                 let dHeight = dataPositionObj.height / imgTouch.height;
-                const ctx = wx.createCanvasContext('comb-img' + i);
+                const ctx = wx.createCanvasContext('comb-img' + id);
                 //画布中点坐标转移到图片中心
                 let movex = imgTouch.x + imgTouch.width * rpx / 2;
                 let movey = imgTouch.y + imgTouch.height * rpx / 2;
@@ -179,7 +173,7 @@ Page({
                       that.setData({
                         imgSrcArray: imgArray
                       })
-                      that.getCombFont(that, i, true);
+                      that.getCombFont(that, i, true,id);
                     }
                   }, that)
                 })
@@ -190,13 +184,14 @@ Page({
         },
       })
     } else {
-      that.getCombFont(that, i, false);
+      that.getCombFont(that, i, false,id);
+      console.log("没有图片往下执行")
     }
 
 
 
   },
-  getCombFont(that, i, _static) {
+  getCombFont(that, i, _static,id) {
     let fontTouch = null,
       dataPositionObj = null,
       simulationFont = null;
@@ -204,7 +199,9 @@ Page({
       fontTouch = wx.getStorageSync('madeCupFontData' + i);
       simulationFont = wx.getStorageSync('simulationFont' + i);
       dataPositionObj = util.changeCup(i.toString()).dataPositionObj;
-      const ctx = wx.createCanvasContext('comb-font' + i);
+      
+      const ctx = wx.createCanvasContext('comb-font' + id);
+      console.log(id, ctx,"console.log(id,)")
       // ctx.textBaseline = 'top';
       ctx.setFontSize(fontTouch.fontSize);
       ctx.setFillStyle(fontTouch.isColor);
@@ -220,19 +217,20 @@ Page({
       ctx.restore()
       ctx.draw(false, function () {
         wx.canvasToTempFilePath({
-          canvasId: 'comb-font' + i,
+          canvasId: 'comb-font' + id,
           success: function (res) {
             console.log(res)
-            that.getCombFontImg(that, res.tempFilePath, fontTouch, i)
+            that.getCombFontImg(that, res.tempFilePath, fontTouch, i,id)
           }
         }, that)
       })
     } else {
-      that.getComb(that, that.data.imgSrcArray, i, _static)
+      that.getComb(that, that.data.imgSrcArray, i, _static,id)
     }
 
   },
-  getCombFontImg(that, img, fontTouch, i) { // 生产字体图片后在进行处理一次
+  getCombFontImg(that, img, fontTouch, i,id) { // 生产字体图片后在进行处理一次
+    let dataPositionObj = util.changeCup(i.toString()).dataPositionObj;
     wx.getSystemInfo({
       success: function (res) {
         let rpx = res.windowWidth / 750;
@@ -242,16 +240,16 @@ Page({
         // 只要服务器有响应数据,就会把响应内容写入文件并进入 success 回调,业务需要自行判断是否下载到了想要的内容
         console.log(res)
         // canvas截图区域与图片的宽度比例
-        const ctx = wx.createCanvasContext('comb-font' + i + '-2');
+        const ctx = wx.createCanvasContext('comb-font' + id + '-2');
         //画布中点坐标转移到图片中心
-        let movex = fontTouch.x + 536 * rpx / 2;
-        let movey = fontTouch.y + 712 * rpx / 2;
+        let movex = fontTouch.x + dataPositionObj.width * rpx / 2;
+        let movey = fontTouch.y + dataPositionObj.height * rpx / 2;
         ctx.translate(movex, movey);
         ctx.rotate(fontTouch.angle * Math.PI / 180);
-        ctx.drawImage(img, -536 * rpx / 2, -712 * rpx / 2, 536 * rpx, 712 * rpx)
+        ctx.drawImage(img, -dataPositionObj.width * rpx / 2, -dataPositionObj.height * rpx / 2, dataPositionObj.width * rpx, dataPositionObj.height * rpx)
         ctx.draw(false, function () {
           wx.canvasToTempFilePath({
-            canvasId: 'comb-font' + i + '-2',
+            canvasId: 'comb-font' + id + '-2',
             success: function (res) {
               console.log(res)
               let imgArray = that.data.imgSrcArray;
@@ -259,75 +257,104 @@ Page({
               that.setData({
                 imgSrcArray: imgArray
               })
-              that.getComb(that, that.data.imgSrcArray, i, true)
+              that.getComb(that, that.data.imgSrcArray, i, true,id)
             }
           }, that)
         })
       },
     })
   },
-  getComb(that, imgSrcArray, i, _static) {
+  getComb(that, imgSrcArray, i, _static,id) {
     console.log(imgSrcArray, "imgSrcArray")
     if (_static) {
       let imgTouch = wx.getStorageSync('madeCupImgData' + i);
       let dataPositionObj = util.changeCup(i.toString()).dataPositionObj;
-      let canvasBg = that.data.obverseImgObject[i];
-      console.log(canvasBg)
-      wx.getSystemInfo({
-        success: function (res) {
-          let rpx = res.windowWidth / 750;
-          that.setData({
-            rpx: rpx
-          });
-          const ctx = wx.createCanvasContext('comb-canvas' + i);
-          ctx.drawImage(canvasBg, 0, 0, 750 * rpx, 800 * rpx);
-          // 设置背景
-          ctx.draw(true)
-          imgSrcArray.forEach((res) => {
-            ctx.drawImage(res, dataPositionObj.left * rpx, dataPositionObj.top * rpx, dataPositionObj.width * rpx, dataPositionObj.height * rpx);
-          })
-          console.log('开始执行叠加')
-          ctx.drawImage(that.data.boxImg[i], 0, 0, 750 * rpx, 800 * rpx)
-
-          ctx.draw(true, function () {
-            wx.canvasToTempFilePath({
-              canvasId: 'comb-canvas' + i,
+      wx.downloadFile({
+        url: that.data.obverseImgObject[i],
+        success(res){
+          if (res.statusCode === 200) {
+            let canvasBg = res.tempFilePath;
+            wx.getSystemInfo({
               success: function (res) {
-                that.uploadFile(res.tempFilePath, that, function (data) {
-                  console.log(res, "合成成功");
-
-                  let buildSrcArray = that.data.buildSrcArray;
-
-                  buildSrcArray.push({
-                    src: res.tempFilePath,
-                    isActive: i,
-                  });
-                  console.log(buildSrcArray, "buildSrcArray")
-                  that.setData({
-                    buildSrcArray: buildSrcArray,
-                  })
-                  console.log(that.data.buildSrcArray, "buildSrcArray")
-                  if (i < 7) {
-                    i = i + 1
-                    that.getCombImg(that, i);
-                  } else {
-                    wx.hideLoading()
+                let rpx = res.windowWidth / 750;
+                that.setData({
+                  rpx: rpx
+                });
+                const ctx = wx.createCanvasContext('comb-canvas' + id);
+                ctx.drawImage(canvasBg, 0, 0, 750 * rpx, 800 * rpx);
+                // 设置背景
+                ctx.draw(true)
+                imgSrcArray.forEach((res) => {
+                  ctx.drawImage(res, dataPositionObj.left * rpx, dataPositionObj.top * rpx, dataPositionObj.width * rpx, dataPositionObj.height * rpx);
+                })
+                wx.downloadFile({
+                  url: that.data.obverseImgObject[i+'_2'],
+                  success(file){
+                    if (file.statusCode === 200) {
+                      ctx.drawImage(file.tempFilePath, 0, 0, 750 * rpx, 800 * rpx);
+                      ctx.draw(true, function () {
+                        wx.canvasToTempFilePath({
+                          canvasId: 'comb-canvas' + id,
+                          success: function (res) {
+                            that.uploadFile(res.tempFilePath, that, function (data) {
+                              console.log(res, "合成成功");
+
+                              let buildSrcArray = that.data.buildSrcArray;
+
+                              buildSrcArray.push({
+                                src: res.tempFilePath,
+                                isActive: i,
+                              });
+                              console.log(buildSrcArray, "buildSrcArray")
+                              that.setData({
+                                buildSrcArray: buildSrcArray,
+                              })
+                              console.log('第一张图片合成结束,i='+i)
+                              if (i < that.data.dataId[1]) {
+                                i = i*1 + 1
+                                that.getCombImg(that, i,2);
+                              } else {
+                                wx.hideLoading()
+                              }
+                            })
+
+                          },
+                          fail: function (err) {
+                            console.log(err, "合成失败")
+                            wx.hideLoading();
+                          }
+                        }, that)
+                      })
+                    } else {
+                      wx.showToast({
+                        title: '合成资源图片不存在,请联系客服',
+                        icon: 'error'
+                      })
+                      wx.hideLoading();
+                    }
                   }
                 })
+                
 
+                
               },
-              fail: function (err) {
-                console.log(err, "合成失败")
-                wx.hideLoading();
-              }
-            }, that)
-          })
-        },
+            })
+          } else {
+            wx.showToast({
+              title: '合成资源图片不存在,请联系客服',
+              icon:'error'
+            })
+            wx.hideLoading();
+          }
+        }
       })
+      
+      
     } else {
-      if (i < 4) {
-        i = i + 1
-        that.getCombImg(that, i);
+      console.log("走了这里哈,i值等于",i)
+      if (i < that.data.dataId[1]) {
+        i = i*1 + 1
+        that.getCombImg(that, i,2);
       } else {
         wx.hideLoading()
       }
@@ -346,7 +373,7 @@ Page({
       },
       data: {
         customGoodsImg: that.data.customGoodsImg.substring(0, that.data.customGoodsImg.length - 1),
-        customGoodsName: '拉杆箱-银灰色',
+        customGoodsName: wx.getStorageSync('detail').customgoodsName,
         customGoodsNum: 1,
         userId: app.globalData.user_id,
         customGoodsId:wx.getStorageSync('detail').id,
@@ -357,7 +384,6 @@ Page({
           wx.showModal({
             title: '提示',
             content: '加入购物车成功,是否去购物车结算商品?',
-
             success: function (res) {
               if (res.confirm) {
                 console.log('用户点击确定')

+ 8 - 8
customized/pages/boxMade/boxComb/boxComb.wxml

@@ -1,14 +1,14 @@
 <view style="position:fixed;top:999999999999999999999rpx;">
   <!-- 正面 -->
-  <canvas canvas-id="comb-canvas5" class="comb-content"></canvas>
-  <canvas canvas-id='comb-img5' class='comb-img5'></canvas>
-  <canvas canvas-id='comb-font5' class='comb-font5'></canvas>
-  <canvas canvas-id='comb-font5-2' class='comb-img5'></canvas>
+  <canvas canvas-id="comb-canvas1" class="comb-content"></canvas>
+  <canvas canvas-id='comb-img1' class='comb-img5' style='width:{{dataPositionObj1.width}}rpx;height:{{dataPositionObj1.height}}rpx;'></canvas>
+  <canvas canvas-id='comb-font1' class='comb-font5' style='width:{{dataPositionObj1.width}}rpx;height:{{dataPositionObj1.height}}rpx;'></canvas>
+  <canvas canvas-id='comb-font1-2' class='comb-img5' style='width:{{dataPositionObj1.width}}rpx;height:{{dataPositionObj1.height}}rpx;'></canvas>
   <!-- 背面 -->
-  <canvas canvas-id="comb-canvas6" class="comb-content"></canvas>
-  <canvas canvas-id='comb-img6' class='comb-img6'></canvas>
-  <canvas canvas-id='comb-font6' class='comb-font6'></canvas>
-  <canvas canvas-id='comb-font6-2' class='comb-img6'></canvas>
+  <canvas canvas-id="comb-canvas2" class="comb-content"></canvas>
+  <canvas canvas-id='comb-img2' class='comb-img6' style='width:{{dataPositionObj2.width}}rpx;height:{{dataPositionObj2.height}}rpx;'></canvas>
+  <canvas canvas-id='comb-font2' class='comb-font6' style='width:{{dataPositionObj2.width}}rpx;height:{{dataPositionObj2.height}}rpx;'></canvas>
+  <canvas canvas-id='comb-font2-2' class='comb-img6' style='width:{{dataPositionObj2.width}}rpx;height:{{dataPositionObj2.height}}rpx;'></canvas>
 </view>
 <view class='comb-view-img'>
   <cover-view class="pause" wx:for="{{buildSrcArray}}" bindtap="pause">

+ 13 - 43
customized/pages/boxMade/boxMade.js

@@ -9,12 +9,7 @@ Page({
     dataPositionObj: {},
     propSize: {},
     isActive: '5', // 默认是正面
-    obverseImgObject: {
-      '5': '/customized/images/customized/box_white_big_1.png',
-      /*正面 */
-      '6': '/customized/images/customized/box_white_big_2.png',
-      /*反面 */
-    },
+    obverseImgObject: {},
     imgTouch: {}, // 图片的对象,分为正面,侧面,手柄,底部
     fontTouch: {}, //文字的对象,分为正面,侧面,手柄,底部
     imgAnimationData: {}, // 图片的旋转
@@ -30,11 +25,7 @@ Page({
       height: '',
       width: '',
     },
-    box: { // 盒子默认是白色正面
-      static: true,
-      left: 'box-white-1-left',
-      right: 'box-white-1-right'
-    }
+    dataId:['5','6']
   },
 
   /**
@@ -53,7 +44,8 @@ Page({
     })
     if ('id' in options) {
       this.setData({
-        isActive: options.id
+        isActive: options.id,
+        dataId: options.dataId.split(',')
       })
     }
 
@@ -81,10 +73,11 @@ Page({
     console.log('onshow')
     let that = this;
     let cupNum = util.changeCup(that.data.isActive);
-    console.log(cupNum)
+    console.log(cupNum,"changeCup")
     that.setData({
       dataPositionObj: cupNum.dataPositionObj,
-      propSize: cupNum.propSize
+      propSize: cupNum.propSize,
+      obverseImgObject: util.changeImg
     })
     that.getDataTouch(that)
   },
@@ -132,28 +125,13 @@ Page({
   //   ctx.draw()
   // },
   changeCup(e) {
-    // data-id== 1正面,2背面,3手柄,4杯底
-    // this.changeCupImg(e.currentTarget.dataset.id);
+    console.log(e,"点击了e")
     let that = this;
     let cupNum = util.changeCup(e.currentTarget.dataset.id);
-    let box = {};
-    if (e.currentTarget.dataset.id == 5) {
-      box = {
-        left: 'box-white-1-left',
-        right: 'box-white-1-right'
-      }
-    }
-    if (e.currentTarget.dataset.id == 6) {
-      box = {
-        left: 'box-white-2-left',
-        right: 'box-white-2-right'
-      }
-    }
     that.setData({
       isActive: e.currentTarget.dataset.id,
       dataPositionObj: cupNum.dataPositionObj,
       propSize: cupNum.propSize,
-      box: box
     })
     that.getDataTouch(that)
 
@@ -212,15 +190,12 @@ Page({
   },
   finishDesign() { // 完成设计
     let that = this;
-    let designObj = {
-        '5': '正面',
-        '6': '背面',
-      },
+    let designObj = ['正面','背面'],
       designVal = '',
       madeStatic = false;
-    for (let i = 5; i < 7; i++) {
+    for (let i = that.data.dataId[0] * 1; i <= that.data.dataId[1] * 1; i++) {
       if (!wx.getStorageSync('madeCupImgData' + i) && !wx.getStorageSync('madeCupFontData' + i)) {
-        designVal += designObj[i] + ','
+        designVal += designObj[i - that.data.dataId[0] * 1] + ','
       } else {
         madeStatic = true; // 表示已经有设计过的页面
       }
@@ -229,7 +204,7 @@ Page({
       if (!designVal) {
         console.log('可以完成')
         wx.navigateTo({
-          url: '/customized/pages/boxMade/boxComb/boxComb'
+          url: '/customized/pages/boxMade/boxComb/boxComb?dataId=' + that.data.dataId
         })
       } else {
         wx.showModal({
@@ -238,13 +213,8 @@ Page({
           success: function (res) {
             if (res.confirm) {
               console.log('用户点击确定,不设计了,直接完成')
-              // wx.showToast({
-              //   title: '图片合成中...',
-              //   icon: 'loading'
-              // })
-              // that.getBuildImg(that)
               wx.navigateTo({
-                url: '/customized/pages/boxMade/boxComb/boxComb'
+                url: '/customized/pages/boxMade/boxComb/boxComb?dataId=' + that.data.dataId
               })
             } else {
               console.log('用户点击取消')

+ 4 - 3
customized/pages/boxMade/boxMade.wxml

@@ -2,8 +2,9 @@
 <view class='content'>
 <view class='made-content'>
   <view class='made-img-box'>
+    <image class='made-img-image_1' src='{{obverseImgObject[isActive+"_1"]}}' mode="aspectFill"></image>
     <image class='made-img-image' src='{{obverseImgObject[isActive]}}' mode="aspectFill"></image>
-    <made-solid prop-box="{{box}}" prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
+    <made-solid prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
       <view class='f-box f-align-items-center f-justify-content-center made-prompt ' style='text-align:center' wx:if="{{touchStatic}}">{{fontContent}}</view>
       <view class='made-box'>
       <!-- img -->
@@ -24,8 +25,8 @@
 </view>
 <view class='btn-box'>
   <view class='f-box f-justify-content-between'>
-    <button type="default" hover-class="none" bindtap="changeCup" data-id='5' class='{{isActive === "5" ? "active" : ""}}' size="mini">正面</button>
-    <button type="default" hover-class="none" bindtap="changeCup" data-id='6' class='{{isActive === "6" ? "active" : ""}}' size="mini">背面</button>
+    <button type="default" hover-class="none" bindtap="changeCup" data-id='{{dataId[0]}}' class='{{isActive === dataId[0] ? "active" : ""}}' size="mini">正面</button>
+    <button type="default" hover-class="none" bindtap="changeCup" data-id='{{dataId[1]}}' class='{{isActive === dataId[1] ? "active" : ""}}' size="mini">背面</button>
   </view>
 </view>
 

+ 6 - 0
customized/pages/boxMade/boxMade.wxss

@@ -114,4 +114,10 @@ page{
 #touchFont{
   height:99999999999rpx;
   width:9999999999rpx;
+}
+.made-img-image_1{
+  width:750rpx;
+  height:800rpx;
+  position:absolute;
+  z-index:199;
 }

+ 3 - 7
customized/pages/boxMade/boxMadeFont/boxMadeFont.js

@@ -10,12 +10,7 @@ Page({
     propSize: {},
 
     isActive: '5', // 默认是正面
-    obverseImgObject: {
-      '5': '/customized/images/customized/box_white_big_1.png',
-      /*正面 */
-      '6': '/customized/images/customized/box_white_big_2.png',
-      /*反面 */
-    },
+    obverseImgObject: {},
     // radarImg:null,
     fontColorArray: ['#ffffff', '#000000', '#e70012', '#ff8500', '#fff100', '#22ad38', '#00b7f0', '#920784'],
     fontFamilyArray: ['Nomal', 'Monospace', 'Sans', 'Serif'], // 自带字体样式 
@@ -91,7 +86,8 @@ Page({
    */
   onShow: function () {
     this.setData({
-      box: wx.getStorageSync('box')
+      box: wx.getStorageSync('box'),
+      obverseImgObject: util.changeImg
     })
     this.getDataTouch(this)
   },

+ 2 - 1
customized/pages/boxMade/boxMadeFont/boxMadeFont.wxml

@@ -3,8 +3,9 @@
 <view class='made-content'>
   <!-- <canvas canvas-id='madeContent' class='made-content'></canvas> -->
   <view class='made-img-box'>
+  <image class='made-img-image_1' src='{{obverseImgObject[isActive+"_1"]}}' mode="aspectFill" bindtouchstart="fontTouchstart" bindtouchmove="fontTouchmove" bindtouchend="fontTouchend"></image>
     <image src='{{obverseImgObject[isActive]}}'></image>
-    <made-solid prop-box="{{box}}" prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
+    <made-solid  prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
       <view class='f-box f-align-items-center f-justify-content-center made-prompt' style='text-align:center' wx:if="{{!fontTouch.fontSize && !imgTouch.src}}">{{fontTouch.fontContent}}</view>
       <view class='made-box'>
         <!-- img -->

+ 6 - 0
customized/pages/boxMade/boxMadeFont/boxMadeFont.wxss

@@ -134,4 +134,10 @@ page{
   text-align: center;
   line-height:50rpx;
   border-radius:5rpx;
+}
+.made-img-image_1{
+  width:750rpx;
+  height:800rpx;
+  position:absolute;
+  z-index:199;
 }

+ 3 - 7
customized/pages/boxMade/boxMadeImg/boxMadeImg.js

@@ -11,12 +11,7 @@ Page({
     dataPositionObj: {},
     propSize: {},
     host: null,
-    obverseImgObject: {
-      '5': '/customized/images/customized/box_white_big_1.png',
-      /*正面 */
-      '6': '/customized/images/customized/box_white_big_2.png',
-      /*反面 */
-    },
+    obverseImgObject: {},
     fontContent: '可定制区域',
     madeImg: null, // 定制图 
     madeStatic: false, // 定制状态,表示是否已经定制了,false 表示没有定制
@@ -94,7 +89,8 @@ Page({
   onShow: function () {
     let that = this;
     that.setData({
-      box:wx.getStorageSync('box')
+      box:wx.getStorageSync('box'),
+      obverseImgObject: util.changeImg
     })
     that.getImgList();
     that.getDataTouch(that)

+ 2 - 1
customized/pages/boxMade/boxMadeImg/boxMadeImg.wxml

@@ -1,8 +1,9 @@
 <view class='container'>
   <view class='made-content'>
     <view class='made-img-box'>
+    <image class='made-img-image_1'  src='{{obverseImgObject[imgTouch.isActive+"_1"]}}' mode="aspectFill"></image>
       <image class='made-image' src='{{obverseImgObject[imgTouch.isActive]}}'></image>
-      <made-solid prop-box="{{box}}" prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
+      <made-solid prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
         <view class='f-box f-align-items-center f-justify-content-center made-prompt' wx:if="{{!madeStatic}}">{{fontContent}}</view>
         <view class='made-box'>
           <!-- img -->

+ 6 - 0
customized/pages/boxMade/boxMadeImg/boxMadeImg.wxss

@@ -113,4 +113,10 @@ page{
 .del-box{
   padding:6rpx 16rpx;
   border:2rpx solid #00af66;
+}
+.made-img-image_1{
+  width:750rpx;
+  height:800rpx;
+  position:absolute;
+  z-index:199;
 }

+ 25 - 4
customized/pages/goodsDetail/goodsDetail.js

@@ -71,10 +71,31 @@ Page({
   },
   hrefBtn() {
     let detail = wx.getStorageSync('detail')
-    if (detail.customgoodsNo == '2'){ // 箱子
-      wx.navigateTo({
-        url: "/customized/pages/oneMade/oneMade",
-      })
+    if (detail.customgoodsNo == '2'){ 
+      if (detail.id >= 7 && detail.id <= 10){//7,8,9,10 == 9,10,11,12
+        wx.navigateTo({
+          url: "/customized/pages/oneMade/oneMade?id=" + JSON.stringify(detail.id*1+2),
+        })
+      } else {
+        let id = detail.id, dataId='5,6';
+        switch (detail.id){
+          case 5: //表示是银色箱子
+          id='5';
+          dataId = '5,6';
+          break;
+          case 6: //表示是白色箱子
+          id='7';
+          dataId = '7,8';
+          break;
+          default:
+          break;
+        }
+        console.log(id,"id")
+        wx.navigateTo({// 箱子
+          url: `/customized/pages/boxMade/boxMade?id=${id}&dataId=${dataId}`,
+        })
+      }
+      
     }
     if (detail.customgoodsNo == '1') { // 杯子
       wx.navigateTo({

+ 78 - 49
customized/pages/oneMade/oneComb/oneComb.js

@@ -254,56 +254,85 @@ Page({
    
       let imgTouch = wx.getStorageSync('madeImgData' + i);
     let dataPositionObj = that.data.dataPositionObj;
-      let canvasBg = that.data.obverseImgObject[i+'_2'];//获取背景没有线框的
-      wx.getSystemInfo({
-        success: function (res) {
-          let rpx = res.windowWidth / 750;
-          that.setData({
-            rpx: rpx
-          });
-          const ctx = wx.createCanvasContext('comb-canvas');
-          ctx.drawImage(canvasBg, 0, 0, 750 * rpx, 800 * rpx);
-          // 设置背景
-          ctx.draw(true)
-          imgSrcArray.forEach((res) => {
-            ctx.drawImage(res, dataPositionObj.left * rpx, dataPositionObj.top * rpx, dataPositionObj.width * rpx, dataPositionObj.height * rpx);
-          })
-          console.log('开始执行叠加', that.data.obverseImgObject[i + '_1'])
-          ctx.drawImage(that.data.obverseImgObject[i + '_1'], 0, 0, 750 * rpx, 800 * rpx)
-          
-          ctx.draw(true, function () {
-            console.log("开始合成")
-            wx.canvasToTempFilePath({
-              canvasId: 'comb-canvas',
-              success: function (res) {
-                console.log(res,"合成结果")
-                that.uploadFile(res.tempFilePath, that, function (data) {
-                  console.log(res, "合成成功");
-
-                  let buildSrcArray = that.data.buildSrcArray;
-
-                  buildSrcArray.push({
-                    src: res.tempFilePath,
-                    isActive: i,
-                  });
-                  console.log(buildSrcArray, "buildSrcArray")
-                  that.setData({
-                    buildSrcArray: buildSrcArray,
-                  })
-                  console.log(that.data.buildSrcArray, "buildSrcArray")
-                  wx.hideLoading()
-   
-                })
+    wx.downloadFile({
+      url: that.data.obverseImgObject[i + '_2'],
+      success(res){
+        if (res.statusCode === 200) {
+          let canvasBg = res.tempFilePath;//获取背景没有线框的
+          console.log(canvasBg,"canvasBgcanvasBg")
+          wx.getSystemInfo({
+            success: function (res) {
+              let rpx = res.windowWidth / 750;
+              that.setData({
+                rpx: rpx
+              });
+              const ctx = wx.createCanvasContext('comb-canvas');
+              ctx.drawImage(canvasBg, 0, 0, 750 * rpx, 800 * rpx);
+              // 设置背景
+              ctx.draw(true)
+              imgSrcArray.forEach((res) => {
+                ctx.drawImage(res, dataPositionObj.left * rpx, dataPositionObj.top * rpx, dataPositionObj.width * rpx, dataPositionObj.height * rpx);
+              })
+              wx.downloadFile({
+                url: that.data.obverseImgObject[i + '_1'],
+                success(file){
+                  if (file.statusCode === 200) {
+                    ctx.drawImage(file.tempFilePath, 0, 0, 750 * rpx, 800 * rpx)
 
-              },
-              fail: function (err) {
-                console.log(err, "合成失败")
-                wx.hideLoading();
-              }
-            }, that)
+                    ctx.draw(true, function () {
+                      console.log("开始合成")
+                      wx.canvasToTempFilePath({
+                        canvasId: 'comb-canvas',
+                        success: function (res) {
+                          console.log(res, "合成结果")
+                          that.uploadFile(res.tempFilePath, that, function (data) {
+                            console.log(res, "合成成功");
+
+                            let buildSrcArray = that.data.buildSrcArray;
+
+                            buildSrcArray.push({
+                              src: res.tempFilePath,
+                              isActive: i,
+                            });
+                            console.log(buildSrcArray, "buildSrcArray")
+                            that.setData({
+                              buildSrcArray: buildSrcArray,
+                            })
+                            console.log(that.data.buildSrcArray, "buildSrcArray")
+                            wx.hideLoading()
+
+                          })
+
+                        },
+                        fail: function (err) {
+                          console.log(err, "合成失败")
+                          wx.hideLoading();
+                        }
+                      }, that)
+                    })
+                  }else{
+                    wx.showToast({
+                      title: '合成资源图片不存在,请联系客服',
+                      icon:'error'
+                    })
+                    wx.hideLoading()
+                  }
+                }
+              })
+              
+            },
           })
-        },
-      })
+        } else {
+          wx.showToast({
+            title: '合成图片资源不存在,请联系客服',
+            icon:'error'
+          })
+          wx.hideLoading();
+        }
+      }
+    })
+
+      
 
   },
   addImgRouter() { // add car
@@ -318,7 +347,7 @@ Page({
       },
       data: {
         customGoodsImg: that.data.customGoodsImg.substring(0, that.data.customGoodsImg.length - 1),
-        customGoodsName: '拉杆箱-银灰色',
+        customGoodsName: wx.getStorageSync('detail').customgoodsName,
         customGoodsNum: 1,
         userId: app.globalData.user_id,
         customGoodsId:wx.getStorageSync('detail').id,

+ 1 - 0
customized/pages/oneMade/oneMade.js

@@ -51,6 +51,7 @@ Page({
         isActive: options.id
       })
     }
+    console.log(this.data.isActive)
   },
 
   /**

+ 1 - 1
customized/pages/oneMade/oneMade.wxss

@@ -39,7 +39,7 @@ page{
 .made-img-image_1{
   width:750rpx;
   height:800rpx;
-  position:fixed;
+  position:absolute;
   z-index:199;
 }
 /* .made-font{

+ 2 - 1
customized/pages/oneMade/oneMadeFont/oneMadeFont.wxss

@@ -34,7 +34,7 @@ page{
 .made-img-image_1{
   width:750rpx;
   height:800rpx;
-  position:fixed;
+  position:absolute;
   z-index:9999;
 }
 .font-content{
@@ -49,6 +49,7 @@ page{
   height:99999999999rpx;
   width:9999999999rpx;
 }
+
 /* .font-content .iconfont{
   position:absolute;
   font-size:60rpx;

+ 1 - 1
customized/pages/oneMade/oneMadeImg/oneMadeImg.wxss

@@ -29,7 +29,7 @@ page{
 .made-img-image_1{
   width:750rpx;
   height:800rpx;
-  position:fixed;
+  position:absolute;
   z-index:99999;
 }
 .upload-btn{

+ 1 - 0
pages/buy/buy.wxss

@@ -311,6 +311,7 @@ button.share_wrap .collect_icon{
 .goods_content image{
   display: block;
   width: 100% !important;
+  float:left;
 }
 .margintop{
   margin-top: 20rpx;

+ 2 - 1
readme.md

@@ -16,4 +16,5 @@
       x = - 宽度/2
       y = -高度/2
       fillRect(x,y,宽度,高度)
-### 缺少详情页,字体加粗、字体定制
+### 缺少详情页,字体加粗、字体定制
+v:3.0.3

+ 98 - 15
utils/util.js

@@ -109,6 +109,35 @@ function changeCup(e) {
         left: '',
       };
       break;
+    case '7': //表示是箱子
+      dataPositionObj = { // 正面数据
+        top: 74,
+        left: 104,
+        width: 536,
+        height: 712
+      };
+      propSize = {
+        top: '',
+        right: '',
+        bottom: '',
+        left: '',
+      };
+      // console.log('杯底');
+      break;
+    case '8': //表示是箱子
+      dataPositionObj = { // 正面数据
+        top: 128,
+        left: 109,
+        width: 534,
+        height: 654
+      };
+      propSize = {
+        top: '',
+        right: '',
+        bottom: '',
+        left: '',
+      };
+      break;
     case '9': //黑色T恤
       dataPositionObj = { 
         top: 254,
@@ -122,7 +151,48 @@ function changeCup(e) {
         bottom: '',
         left: '',
       };
-      // console.log('杯底');
+      break;
+    case '10': //红色T恤
+      dataPositionObj = {
+        top: 254,
+        left: 204,
+        width: 368,
+        height: 440
+      };
+      propSize = {
+        top: '',
+        right: '',
+        bottom: '',
+        left: '',
+      };
+      break;
+    case '11': //白色杯子
+      dataPositionObj = {
+        top: 320,
+        left: 264,
+        width: 228,
+        height: 456
+      };
+      propSize = {
+        top: '',
+        right: '',
+        bottom: '',
+        left: '',
+      };
+      break;
+    case '12': //黑色杯子
+      dataPositionObj = {
+        top: 244,
+        left: 260,
+        width: 228,
+        height: 522
+      };
+      propSize = {
+        top: '',
+        right: '',
+        bottom: '',
+        left: '',
+      };
       break;
     default:
       break;
@@ -136,21 +206,34 @@ function changeCup(e) {
   
 
 }
-
+let url = 'https://dlz.info666.com';
 let changeImg={
-    '9': '/customized/images/customized/shirt1.png',//黑色T恤
-    '9_1': '/customized/images/customized/shirt1_1.png', //黑色T恤镂空
-    '9_2': '/customized/images/customized/shirt1_2.png', //黑色T恤
-    '10': '/customized/images/customized/shirt2.png',//红色T恤
-    '10_1': '/customized/images/customized/shirt2_1.png',//红色T恤镂空
-    '10_2': '/customized/images/customized/shirt2_2.png',//红色T恤
-    '11': '/customized/images/customized/cup1.png',//白色杯子
-    '11_1': '/customized/images/customized/cup1_1.png',//白色杯子镂空
-    '11_2': '/customized/images/customized/cup1_2.png',//白色杯子
-    '12': '/customized/images/customized/cup2.png',//黑色杯子
-    '12_1': '/customized/images/customized/cup2_1.png',//白色杯子镂空
-    '12_2': '/customized/images/customized/cup2_2.png',//白色杯子
-    }
+  '5': url+'/temp/box_silvery1.png',//银色箱子正面
+  '5_1': url +'/temp/box_silvery1_1.png', //银色箱子正面镂空
+  '5_2': url +'/temp/box_silvery1_2.png', //银色箱子正面
+  '6': url +'/temp/box_silvery2.png',//银色箱子反面
+  '6_1': url +'/temp/box_silvery2_1.png', //银色箱子镂空
+  '6_2': url +'/temp/box_silvery2_2.png', //银色箱子
+  '7': url +'/temp/box_white1.png',//白色箱子正面
+  '7_1': url +'/temp/box_white1_1.png', //白色箱子正面有颜色镂空
+  '7_2': url +'/temp/box_white1_2.png', //白色箱子正面镂空无颜色
+  '8': url +'/temp/box_white2.png',//白色箱子反面
+  '8_1': url +'/temp/box_white2_1.png', //白色箱子镂空
+  '8_2': url +'/temp/box_white2_2.png', //白色箱子镂空无颜色
+
+  '9': url +'/temp/shirt1.png',//黑色T恤
+  '9_1': url +'/temp/shirt1_1.png', //黑色T恤镂空
+  '9_2': url +'/temp/shirt1_2.png', //黑色T恤
+  '10': url +'/temp/shirt2.png',//红色T恤
+  '10_1': url +'//temp/shirt2_1.png',//红色T恤镂空
+  '10_2': url +'/temp/shirt2_2.png',//红色T恤
+  '11': url +'/temp/cup1.png',//白色杯子
+  '11_1': url +'/temp/cup1_1.png',//白色杯子镂空
+  '11_2': url +'/temp/cup1_2.png',//白色杯子
+  '12': url +'/temp/cup2.png',//黑色杯子
+  '12_1': url +'/temp/cup2_1.png',//黑色杯子镂空
+  '12_2': url +'/temp/cup2_2.png',//黑色杯子
+}
 
 
 

+ 2 - 2
wxParse/wxParse.wxml

@@ -18,8 +18,8 @@
 </template>
 
 <template name="wxParseImg">
-  <image class="{{item.classStr}} wxParse-{{item.tag}}" data-from="{{item.from}}" data-src="{{item.attr.src}}" data-idx="{{item.imgIndex}}" src="{{item.attr.src}}" mode="aspectFit" bindload="wxParseImgLoad" bindtap="wxParseImgTap" mode="widthFix" style="width:{{item.width}}px;"
-  />
+  <image class="{{item.classStr}} wxParse-{{item.tag}}" data-from="{{item.from}}" data-src="{{item.attr.src}}" data-idx="{{item.imgIndex}}" src="{{item.attr.src}}" mode="aspectFit" bindload="wxParseImgLoad" bindtap="wxParseImgTap" mode="widthFix"/>
+  <!-- style="width:{{item.width}}px;" -->
 </template>
 
 <template name="WxEmojiView">