提前点餐菜单图片预览功能和高度自适应

@@ -37,11 +37,32 @@ Page({
     themeColor: '',
     textColor: '',
     navColor: '',
-    height:wx.getSystemInfoSync().windowWidth*1*2,
-    height2:wx.getSystemInfoSync().windowWidth,
+    height:wx.getSystemInfoSync().windowWidth*1,
+    height2:wx.getSystemInfoSync().windowWidth*1/2,
   },
   checkModal: '',
   classifyModal: '',
+  imageLoad(e) {
+    const index = e.currentTarget.dataset['index'];
+    const indexs = e.currentTarget.dataset['indexs'];
+    //获取图片的原始宽度和高度 
+    let originalWidth = e.detail.width; 
+    let originalHeight = e.detail.height; 
+    let imageSize = util.imageZoomHeightUtil(originalWidth,originalHeight); 
+    let imageHeight = `cookbooklist[${indexs}].cookbooklist[0][${index}].imageHeight`;
+    let height=(imageSize && imageSize.imageHeight)?imageSize.imageHeight.toFixed(0):'';
+    this.setData({
+      [imageHeight]:height,
+    }) 
+  },
+  preview(event){
+    const item = event.currentTarget.dataset['item'];
+    let currentUrl = item.image
+    wx.previewImage({
+      current: currentUrl, // 当前显示图片的http链接
+      urls: [currentUrl] // 需要预览的图片http链接列表
+    })
+  },
   /**
    * 生命周期函数--监听页面加载
    */
@@ -103,21 +124,6 @@ Page({
       checkItem,
     })
   },
-  // 获取点菜列表
-  getCheckCookList() {
-    let param = {
-      sellerid: this.data.options.sid,
-      identity: this.data.options.identity,
-      orderid: this.data.options.oid,
-      status: '0,1',
-    };
-    App.Cookbook.GetCookbookByClass(param).then(json => {
-      let cookbooklist = this.formatCookList(json.data[0].list)
-      this.setData({
-        cookbooklist
-      })
-    })
-  },
   // 选择菜品分类
   checkItem(e) {
     const item = e.currentTarget.dataset['item'];
@@ -145,7 +151,7 @@ Page({
     }
     App.Advance.AddCart(params).then(res => {
       this.closeModal()
-      this.getCheckCookList();
+      this.getCookList();
       let orderItemCount = this.data.orderItemCount * 1 + 1
       this.setData({
         orderItemCount
@@ -196,7 +202,7 @@ Page({
       identity: this.data.options.identity
     }
     App.Advance.AddCart(params).then(res => {
-      this.getCheckCookList();
+      this.getCookList();
       let orderItemCount = this.data.orderItemCount * 1 + 1
       this.setData({
         orderItemCount
@@ -218,7 +224,7 @@ Page({
       identity: this.data.options.identity
     }
     App.Advance.ReduceOrder(params).then(res => {
-      this.getCheckCookList();
+      this.getCookList();
       let orderItemCount = this.data.orderItemCount * 1 - 1
       this.setData({
         orderItemCount
@@ -257,7 +263,6 @@ Page({
         orderItemCount: orderItemCount,
         checkCookbooklist: res.data.cookbooklist,
       })
-      this.getCheckCookList();
     })
   },
   // 过滤数据
@@ -352,6 +357,7 @@ Page({
                 cook.item_clear_num = item_clear_num;
                 cook.index = n; //分类下菜品的下标
                 cook.type = '1';
+                cook.imageHeight='';
                 let cook_style = cook.cook_style ? util.determine(cook.cook_style) : {
                   image_type: '1',
                   name_type: ''
@@ -467,7 +473,6 @@ Page({
         isloading: false,
         showSkeleton: false,
       })
-      this.getCheckCookList()
     }).catch(res => {
       console.log(res);
     });

@@ -63,7 +63,7 @@
 						</view>
 					</view>
 					<view class="imgOneBox">
-						<image wx:if="{{item.image}}" style="height:{{height}}rpx;" src="{{item.image}}" class="dishImg" mode="aspectFit" />
+						<image wx:if="{{item.image}}" catch:tap="preview" style="height: {{item.imageHeight>height?height+'px':item.imageHeight+'px'}};width: {{item.imageHeight>height?'':item.imageHeight==height?'100%':'100%'}}" mode="{{(item.imageHeight>375 || item.imageHeight==375)?'aspectFit':''}}"  src="{{item.image}}" bindload="imageLoad" data-item="{{item}}" data-index="{{index}}" data-indexs="{{indexs}}" />
 					</view>
 					<view class="greens" wx:if="{{item.desc}}">
 						<view class="news" style="color:rgba({{textColor}})">{{item.desc}}</view>
@@ -99,7 +99,7 @@
 							{{item.price?'￥'+item.price+'/'+item.unit:''}}
 							{{item.member_price?'会员 ￥'+item.member_price+'/'+item.unit:''}}
 						</view>
-						<image wx:if="{{item.image}}" src="{{item.image}}" style="height:{{height2}}rpx;"  mode="aspectFit" />
+						<image wx:if="{{item.image}}" catch:tap="preview" style="height: {{item.imageHeight>height2?height2+'px':item.imageHeight+'px'}};width: {{item.imageHeight>height2?height2+'px':item.imageHeight==height2?'100%':'100%'}}" mode="{{(item.imageHeight>375 || item.imageHeight==375)?'aspectFit':'aspectFill'}}"  src="{{item.image}}" bindload="imageLoad" data-item="{{item}}" data-index="{{index}}" data-indexs="{{indexs}}" />
 						<view class="greens" wx:if="{{item.desc}}">
 							<view class="news" style="color:rgba({{textColor}})">{{item.desc}}</view>
 						</view>

@@ -82,9 +82,6 @@ page {
 	padding: 0 40rpx 30rpx 10rpx;
 }
 
-.dishImg {
-	width: 100%;
-}
 .imgOneBox{
 	width: 100%;
 	display: flex;
@@ -215,7 +212,7 @@ page {
 }
 
 .reduceImg {
-	width: 70rpx;
+	width: 70rpx !important;
 	height: 8rpx !important;
 	padding: 10rpx;
 }

@@ -21,6 +21,22 @@ function formatTime(date, type, connect) {
   }
 
 }
+function imageZoomHeightUtil(originalWidth,originalHeight,imageWidth){ 
+  let imageSize = {}; 
+  if(imageWidth){ 
+    imageSize.imageWidth = imageWidth; 
+    imageSize.imageHeight = (imageWidth * originalHeight) / originalWidth; 
+  }else{//如果没有传imageWidth,使用屏幕的宽 
+    wx.getSystemInfo({  
+      success: function (res) {  
+        imageWidth = res.windowWidth;  
+        imageSize.imageWidth = imageWidth; 
+        imageSize.imageHeight = (imageWidth * originalHeight) / originalWidth; 
+      }  
+    }); 
+  } 
+  return imageSize; 
+} 
 
 function formatNumber(n) {
   n = n.toString()
@@ -170,6 +186,7 @@ module.exports = {
   parseDataValue,
   determine,
   objCompare,
+  imageZoomHeightUtil,
   cgi: function (act) {
     return uri.HOST__LINE + act   //正式
     //return uri.HOST__TEST+act     //测试