-
-
- 
+ 
+ 
'
+ (conType && config.type != 2 ? '' : titleHTML)
- + '
'
- + (config.type == 0 && config.icon !== -1 ? '' : '')
+
+ // 内容区
+ + ''
+ // 表情或图标
+ + function(){
+ var face = [
+ 'layui-icon-tips',
+ 'layui-icon-ok',
+ 'layui-icon-close-fill',
+ 'layui-icon-help',
+ 'layui-icon-password',
+ 'layui-icon-face-cry',
+ 'layui-icon-face-smile'
+ ];
+
+ var additFaceClass;
+
+ // 动画类
+ var animClass = 'layui-anim layui-anim-rotate layui-anim-loop';
+
+ // 信息框表情
+ if(config.type == 0 && config.icon !== -1){
+ // 加载（加载图标）
+ if(config.icon == 16){
+ additFaceClass = 'layui-icon layui-icon-loading '+ animClass;
+ }
+ return '';
+ }
+
+ // 加载层图标
+ if(config.type == 3){
+ var type = [
+ 'layui-icon-loading',
+ 'layui-icon-loading-1'
+ ];
+ // 风格 2
+ if(config.icon == 2){
+ return '';
+ }
+ return ''
+ }
+
+ return '';
+ }()
+ (config.type == 1 && conType ? '' : (config.content||''))
+ '
'
- + ''+ function(){
- var closebtn = ismax ? '' : '';
- config.closeBtn && (closebtn += '');
- return closebtn;
- }() + ''
+
+ // 右上角按钮
+ + ''+ function(){
+ var arr = [];
+
+ // 最小化、最大化
+ if(ismax){
+ arr.push('');
+ arr.push('');
+ }
+
+ // 关闭按钮
+ if(config.closeBtn){
+ arr.push('')
+ }
+
+ return arr.join('');
+ }() + '
'
+
+ // 底部按钮
+ (config.btn ? function(){
var button = '';
typeof config.btn === 'string' && (config.btn = [config.btn]);
@@ -294,7 +363,7 @@ Class.pt.creat = function(){
,conType = typeof content === 'object'
,body = $('body');
- if(config.id && $('#'+config.id)[0]) return;
+ if(config.id && $('.'+ doms[0]).find('#'+ config.id)[0]) return;
if(typeof config.area === 'string'){
config.area = config.area === 'auto' ? ['', ''] : [config.area, ''];
@@ -575,41 +644,66 @@ Class.pt.move = function(){
,config = that.config
,_DOC = $(document)
,layero = that.layero
+ ,DATA_NAME = ['LAY_MOVE_DICT', 'LAY_RESIZE_DICT']
,moveElem = layero.find(config.move)
- ,resizeElem = layero.find('.layui-layer-resize')
- ,dict = {};
+ ,resizeElem = layero.find('.layui-layer-resize');
- if(config.move){
- moveElem.css('cursor', 'move');
- }
-
+ //给指定元素添加拖动光标
+ if(config.move) moveElem.css('cursor', 'move');
+
+ //按下拖动元素
moveElem.on('mousedown', function(e){
- e.preventDefault();
+ var othis = $(this)
+ ,dict = {};
+
if(config.move){
- dict.moveStart = true;
+ dict.layero = layero;
+ dict.config = config;
dict.offset = [
e.clientX - parseFloat(layero.css('left'))
,e.clientY - parseFloat(layero.css('top'))
];
+
+ othis.data(DATA_NAME[0], dict);
+ ready.eventMoveElem = othis;
ready.moveElem.css('cursor', 'move').show();
}
- });
-
- resizeElem.on('mousedown', function(e){
+
e.preventDefault();
- dict.resizeStart = true;
- dict.offset = [e.clientX, e.clientY];
- dict.area = [
- layero.outerWidth()
- ,layero.outerHeight()
- ];
- ready.moveElem.css('cursor', 'se-resize').show();
});
+ //按下右下角拉伸
+ resizeElem.on('mousedown', function(e){
+ var othis = $(this)
+ ,dict = {};
+
+ if(config.resize){
+ dict.layero = layero;
+ dict.config = config;
+ dict.offset = [e.clientX, e.clientY];
+ dict.index = that.index;
+ dict.area = [
+ layero.outerWidth()
+ ,layero.outerHeight()
+ ];
+
+ othis.data(DATA_NAME[1], dict);
+ ready.eventResizeElem = othis;
+ ready.moveElem.css('cursor', 'se-resize').show();
+ }
+
+ e.preventDefault();
+ });
+
+ //拖动元素，避免多次调用实例造成事件叠加
+ if(ready.docEvent) return that;
_DOC.on('mousemove', function(e){
-
//拖拽移动
- if(dict.moveStart){
+ if(ready.eventMoveElem){
+ var dict = ready.eventMoveElem.data(DATA_NAME[0]) || {}
+ ,layero = dict.layero
+ ,config = dict.config;
+
var X = e.clientX - dict.offset[0]
,Y = e.clientY - dict.offset[1]
,fixed = layero.css('position') === 'fixed';
@@ -629,6 +723,7 @@ Class.pt.move = function(){
Y > setBot && (Y = setBot);
}
+ //拖动时跟随鼠标位置
layero.css({
left: X
,top: Y
@@ -636,31 +731,41 @@ Class.pt.move = function(){
}
//Resize
- if(config.resize && dict.resizeStart){
+ if(ready.eventResizeElem){
+ var dict = ready.eventResizeElem.data(DATA_NAME[1]) || {}
+ ,config = dict.config;
+
var X = e.clientX - dict.offset[0]
,Y = e.clientY - dict.offset[1];
e.preventDefault();
- layer.style(that.index, {
+ //拉伸宽高
+ layer.style(dict.index, {
width: dict.area[0] + X
,height: dict.area[1] + Y
- })
- dict.isResize = true;
- config.resizing && config.resizing(layero);
+ });
+
+ config.resizing && config.resizing(dict.layero);
}
}).on('mouseup', function(e){
- if(dict.moveStart){
- delete dict.moveStart;
+ if(ready.eventMoveElem){
+ var dict = ready.eventMoveElem.data(DATA_NAME[0]) || {}
+ ,config = dict.config;
+
+ ready.eventMoveElem.removeData(DATA_NAME[0]);
+ delete ready.eventMoveElem;
ready.moveElem.hide();
- config.moveEnd && config.moveEnd(layero);
+ config.moveEnd && config.moveEnd(dict.layero);
}
- if(dict.resizeStart){
- delete dict.resizeStart;
+ if(ready.eventResizeElem){
+ ready.eventResizeElem.removeData(DATA_NAME[1]);
+ delete ready.eventResizeElem;
ready.moveElem.hide();
}
});
+ ready.docEvent = true; //已给 document 执行全局事件
return that;
};
@@ -683,21 +788,21 @@ Class.pt.callback = function(){
var index = $(this).index();
if(index === 0){
if(config.yes){
- config.yes(that.index, layero)
+ config.yes(that.index, layero, that);
} else if(config['btn1']){
- config['btn1'](that.index, layero)
+ config['btn1'](that.index, layero, that);
} else {
layer.close(that.index);
}
} else {
- var close = config['btn'+(index+1)] && config['btn'+(index+1)](that.index, layero);
+ var close = config['btn'+(index+1)] && config['btn'+(index+1)](that.index, layero, that);
close === false || layer.close(that.index);
}
});
//取消
function cancel(){
- var close = config.cancel && config.cancel(that.index, layero);
+ var close = config.cancel && config.cancel(that.index, layero, that);
close === false || layer.close(that.index);
}
@@ -713,7 +818,7 @@ Class.pt.callback = function(){
//最小化
layero.find('.layui-layer-min').on('click', function(){
- var min = config.min && config.min(layero, that.index);
+ var min = config.min && config.min(layero, that.index, that);
min === false || layer.min(that.index, config);
});
@@ -721,11 +826,11 @@ Class.pt.callback = function(){
layero.find('.layui-layer-max').on('click', function(){
if($(this).hasClass('layui-layer-maxmin')){
layer.restore(that.index);
- config.restore && config.restore(layero, that.index);
+ config.restore && config.restore(layero, that.index, that);
} else {
layer.full(that.index, config);
setTimeout(function(){
- config.full && config.full(layero, that.index);
+ config.full && config.full(layero, that.index, that);
}, 100);
}
});
@@ -955,14 +1060,24 @@ layer.full = function(index){
//改变title
layer.title = function(name, index){
- var title = $('#'+ doms[0] + (index||layer.index)).find(doms[1]);
+ var title = $('#'+ doms[0] + (index || layer.index)).find(doms[1]);
title.html(name);
};
-//关闭layer总方法
+//关闭 layer 总方法
layer.close = function(index, callback){
- var layero = $('#'+ doms[0] + index), type = layero.attr('type'), closeAnim = 'layer-anim-close';
+ var layero = function(){
+ var closest = $('.'+ doms[0]).find('#'+ index).closest('.'+ doms[0]);
+ return closest[0] ? (
+ index = closest.attr('times')
+ ,closest
+ ) : $('#'+ doms[0] + index)
+ }()
+ ,type = layero.attr('type')
+ ,closeAnim = 'layer-anim-close';
+
if(!layero[0]) return;
+
var WRAP = 'layui-layer-wrap', remove = function(){
if(type === ready.type[1] && layero.attr('conType') === 'object'){
layero.children(':not(.'+ doms[5] +')').remove();
@@ -975,7 +1090,7 @@ layer.close = function(index, callback){
//低版本IE 回收 iframe
if(type === ready.type[2]){
try {
- var iframe = $('#'+doms[4]+index)[0];
+ var iframe = $('#'+ doms[4] + index)[0];
iframe.contentWindow.document.write('');
iframe.contentWindow.close();
layero.find('.'+doms[5])[0].removeChild(iframe);
@@ -996,6 +1111,7 @@ layer.close = function(index, callback){
$('#layui-layer-moves, #'+ doms.SHADE + index).remove();
layer.ie == 6 && ready.reselect();
ready.rescollbar(index);
+
if(layero.attr('minLeft')){
ready.minIndex--;
ready.minLeft.push(layero.attr('minLeft'));
@@ -1227,9 +1343,6 @@ layer.photos = function(options, loop, key){
photos.start = dict.imgIndex - 1;
layer.close(dict.index);
return layer.photos(options, true, key);
- setTimeout(function(){
- layer.photos(options, true, key);
- }, 200);
}
//一些动作
@@ -1321,7 +1434,7 @@ layer.photos = function(options, loop, key){
+function(){
if(data.length > 1){
return ''
}
@@ -1383,7 +1496,4 @@ window.layui && layui.define ? (
}()
);
-}(window);
-
-
-
+}(window);
\ No newline at end of file
From 2b3c5ebf2b820708486176aa39b4c2a2d22296ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B4=A4=E5=BF=83?=
<3277200+sentsim@users.noreply.github.com>
Date: Sat, 13 Aug 2022 00:43:10 +0800
Subject: [PATCH 7/7] =?UTF-8?q?=E4=BC=98=E5=8C=96=20layer=20=E6=89=80?=
=?UTF-8?q?=E5=9C=A8=E7=9A=84=20window=20resize=20=E4=BA=8B=E4=BB=B6?=
=?UTF-8?q?=E6=9C=BA=E5=88=B6=EF=BC=8C=E9=81=BF=E5=85=8D=E4=BA=8B=E4=BB=B6?=
=?UTF-8?q?=E4=B8=8D=E6=96=AD=E5=8F=A0=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/modules/layer.js | 33 ++++++++++++++++++++++++++-------
1 file changed, 26 insertions(+), 7 deletions(-)
diff --git a/src/modules/layer.js b/src/modules/layer.js
index 00a6f90d..95619737 100644
--- a/src/modules/layer.js
+++ b/src/modules/layer.js
@@ -24,7 +24,7 @@ var isLayui = window.layui && layui.define, $, win, ready = {
return GLOBAL.layer_dir || jsPath.substring(0, jsPath.lastIndexOf('/') + 1);
}(),
- config: {}, end: {}, minIndex: 0, minLeft: [],
+ config: {}, end: {}, events: {resize: {}}, minIndex: 0, minLeft: [],
btn: ['确定', '取消'],
//五种原始层模式
@@ -445,13 +445,15 @@ Class.pt.creat = function(){
}();
}();
- //如果是固定定位
+ // 若是固定定位，则跟随 resize 事件来自适应坐标
if(config.fixed){
- win.on('resize', function(){
- that.offset();
- (/^\d+%$/.test(config.area[0]) || /^\d+%$/.test(config.area[1])) && that.auto(times);
- config.type == 4 && that.tips();
- });
+ if(!ready.events.resize[that.index]){
+ ready.events.resize[that.index] = function(){
+ that.resize();
+ };
+ // 此处 resize 事件不会一直叠加，当关闭弹层时会移除该事件
+ win.on('resize', ready.events.resize[that.index]);
+ }
}
config.time <= 0 || setTimeout(function(){
@@ -473,6 +475,16 @@ Class.pt.creat = function(){
}
};
+// 当前实例的 resize 事件
+Class.pt.resize = function(){
+ var that = this;
+ var config = that.config;
+
+ that.offset();
+ (/^\d+%$/.test(config.area[0]) || /^\d+%$/.test(config.area[1])) && that.auto(times);
+ config.type == 4 && that.tips();
+};
+
//自适应
Class.pt.auto = function(index){
var that = this, config = that.config, layero = $('#'+ doms[0] + index);
@@ -1099,9 +1111,16 @@ layer.close = function(index, callback){
layero[0].innerHTML = '';
layero.remove();
}
+
typeof ready.end[index] === 'function' && ready.end[index]();
delete ready.end[index];
typeof callback === 'function' && callback();
+
+ // 移除 reisze 事件
+ if(ready.events.resize[index]){
+ win.off('resize', ready.events.resize[index]);
+ delete ready.events.resize[index];
+ }
};
if(layero.data('isOutAnim')){