From aa80260844fa2a7956580c4a28ac804c106778d7 Mon Sep 17 00:00:00 2001
From: Diyar-IT <136627746+Diyar-IT@users.noreply.github.com>
Date: Tue, 22 Aug 2023 19:24:56 +0800
Subject: [PATCH] =?UTF-8?q?photos=E5=A2=9E=E5=8A=A0=E6=97=8B=E8=BD=AC?=
 =?UTF-8?q?=EF=BC=8C=E7=BF=BB=E8=BD=AC=EF=BC=8C=E6=94=BE=E5=A4=A7=EF=BC=8C?=
 =?UTF-8?q?=E7=BC=A9=E5=B0=8F=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/layer.js | 113 +++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 110 insertions(+), 3 deletions(-)

diff --git a/src/modules/layer.js b/src/modules/layer.js
index b3d774ac..6c211917 100644
--- a/src/modules/layer.js
+++ b/src/modules/layer.js
@@ -1497,9 +1497,29 @@ layer.photos = function(options, loop, key){
     layer.close(dict.index);
     return layer.photos(options, true, key);
   }
+
+  dict.isNumber = function (n) {
+		return typeof n === 'number' && !isNaN(n);
+	}
+	
+	dict.getTransform = function(options){
+		var transforms = [];
+		var rotate = options.rotate;
+		var scaleX = options.scaleX;
+	
+		if (dict.isNumber(rotate) && rotate !== 0) {
+			transforms.push('rotate(' + rotate + 'deg)');
+		}
+	
+		if (dict.isNumber(scaleX) && scaleX !== 1) {
+			transforms.push('scaleX(' + scaleX + ')');
+		}
+	
+		return transforms.length ? transforms.join(' ') : 'none';
+	}
   
   // 一些动作
-  dict.event = function(){
+  dict.event = function(layero, index){
     /*
     dict.bigimg.hover(function(){
       dict.imgsee.show();
@@ -1519,6 +1539,64 @@ layer.photos = function(options, loop, key){
     });
     
     $(document).on('keyup', dict.keyup);
+
+    var scalexFlag = true;
+		//工具栏事件
+		layero.off('click').on('click','*[toolbar-event]', function () {
+			var othis = $(this), event = othis.attr('toolbar-event');
+			switch (event) {
+				case 'rotate':
+					dict.image.rotate = ((dict.image.rotate || 0) + Number(othis.attr('data-option'))) % 360;
+					dict.imgElem.css({
+						transform: dict.getTransform(dict.image)
+					});
+					break;
+				case 'scalex':
+					if (scalexFlag){
+						dict.image.scaleX = -1;
+						scalexFlag = false;
+					}else {
+						dict.image.scaleX = 1;
+						scalexFlag = true;
+					}
+					scalexFlag !== scalexFlag;
+					dict.imgElem.css({
+						transform: dict.getTransform(dict.image)
+					});
+					break;
+				case 'zoom':
+					var ratio = Number(othis.attr('data-option'));
+					if (ratio < 0) {
+						ratio = 1 / (1 - ratio);
+					} else {
+						ratio = 1 + ratio;
+					}
+					dict.image.width = dict.image.width * ratio;
+					dict.image.height = dict.image.height * ratio;
+					dict.imgElem.css({
+						width: dict.image.width,
+						height: dict.image.height,
+						transform: dict.getTransform(dict.image)
+					});
+					break;
+				case 'reset':
+					scalexFlag = true;
+					dict.image.scaleX = 1;
+					dict.image.rotate = 0;
+					dict.image.width = dict.image.oldWidth;
+					dict.image.height = dict.image.oldHeight;
+					dict.imgElem.css({
+						width: dict.image.oldWidth,
+						height: dict.image.oldHeight,
+						transform: 'none'
+					});
+					break;
+				case 'close':
+					layer.close(index);
+					break;
+			}
+		});
+    
   };
   
   // 图片预加载
@@ -1570,7 +1648,12 @@ layer.photos = function(options, loop, key){
             imgarea[1] = imgarea[1]/wh[1];
           }
         }
-        
+        dict.image = {
+          oldWidth : imgarea[0],
+          oldHeight : imgarea[1],
+          width : imgarea[0],
+          height : imgarea[1],
+        };
         return [imgarea[0]+'px', imgarea[1]+'px']; 
       }(),
       title: false,
@@ -1607,6 +1690,22 @@ layer.photos = function(options, loop, key){
               ,'</div>'
             ,'</div>'].join(''));
           }
+          //工具栏
+          if (options.toolbar){
+            arr.push([
+              '<div class="layui-layer-images-toolbar">',
+                '<div class="layer-images-tool-item">',
+                  '<span toolbar-event="rotate" data-option="-15" title="向左旋转15°" style="transform: scaleX(-1);"><i class="layui-icon layui-icon-refresh rotate"></i></span>',
+                  '<span toolbar-event="rotate" data-option="15" title="向右旋转15°"><i class="layui-icon layui-icon-refresh"></i></span>',
+                  '<span toolbar-event="scalex" title="翻转"><i class="layui-icon layui-icon-slider"></i></span>',
+                  '<span toolbar-event="zoom" data-option="0.1" title="放大图片"><i class="layui-icon layui-icon-add-circle"></i></span>',
+                  '<span toolbar-event="zoom" data-option="-0.1" title="缩小图片"><i class="layui-icon layui-icon-reduce-circle"></i></span>',
+                  '<span toolbar-event="reset" title="重置图片"><i class="layui-icon layui-icon-refresh-1"></i></span>',
+                  '<span toolbar-event="close" title="关闭"><i class="layui-icon layui-icon-close"></i></span>',
+                '</div>',
+              '</div>'
+              ].join(''));
+          }
 
           arr.push('</div>');
           return arr.join('');
@@ -1615,7 +1714,15 @@ layer.photos = function(options, loop, key){
       success: function(layero, index){
         dict.bigimg = layero.find('.layui-layer-phimg');
         dict.imgsee = layero.find('.layui-layer-imgbar');
-        dict.event(layero);
+        if (options.toolbar){
+          layero.find('.layui-layer-content').addClass('layui-layer-images-toolbar-mode');
+          dict.imgElem = dict.bigimg.find('img');
+          dict.imgElem.css({
+            width : dict.image.width,
+            height : dict.image.height
+          });
+        }
+        dict.event(layero, index);
         options.tab && options.tab(data[start], layero);
         typeof success === 'function' && success(layero);
       }, end: function(){