mirror of https://github.com/layui/layui
commit
3f481d762f
|
@ -294,7 +294,7 @@ layui.define(['lay', 'util', 'element', 'form'], function(exports){
|
||||||
// header
|
// header
|
||||||
var headerElem = $('<div class="'+ CONST.ELEM_TITLE +'">');
|
var headerElem = $('<div class="'+ CONST.ELEM_TITLE +'">');
|
||||||
|
|
||||||
// 添加组件 clasName
|
// 添加组件 className
|
||||||
othis.addClass('layui-code-view layui-box');
|
othis.addClass('layui-code-view layui-box');
|
||||||
|
|
||||||
// 自定义风格
|
// 自定义风格
|
||||||
|
|
|
@ -214,7 +214,7 @@ layui.define(['jquery', 'lay'], function(exports){
|
||||||
,'</div>'].join(''))
|
,'</div>'].join(''))
|
||||||
|
|
||||||
//初始化颜色选择框
|
//初始化颜色选择框
|
||||||
var elem = options.elem = $(options.elem);
|
elem = options.elem = $(options.elem);
|
||||||
options.size && elemColorBox.addClass('layui-colorpicker-'+ options.size); //初始化颜色选择框尺寸
|
options.size && elemColorBox.addClass('layui-colorpicker-'+ options.size); //初始化颜色选择框尺寸
|
||||||
|
|
||||||
// 插入颜色选择框
|
// 插入颜色选择框
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
/**
|
/**
|
||||||
* flow 流加载组件
|
* flow 流加载组件
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
|
||||||
layui.define('jquery', function(exports){
|
layui.define('jquery', function(exports){
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
var $ = layui.$, Flow = function(options){}
|
var $ = layui.$, Flow = function(options){}
|
||||||
,ELEM_MORE = 'layui-flow-more'
|
,ELEM_MORE = 'layui-flow-more'
|
||||||
,ELEM_LOAD = '<i class="layui-anim layui-anim-rotate layui-anim-loop layui-icon "></i>';
|
,ELEM_LOAD = '<i class="layui-anim layui-anim-rotate layui-anim-loop layui-icon "></i>';
|
||||||
|
@ -14,26 +14,26 @@ layui.define('jquery', function(exports){
|
||||||
Flow.prototype.load = function(options){
|
Flow.prototype.load = function(options){
|
||||||
var that = this, page = 0, lock, isOver, lazyimg, timer;
|
var that = this, page = 0, lock, isOver, lazyimg, timer;
|
||||||
options = options || {};
|
options = options || {};
|
||||||
|
|
||||||
var elem = $(options.elem); if(!elem[0]) return;
|
var elem = $(options.elem); if(!elem[0]) return;
|
||||||
var scrollElem = $(options.scrollElem || document); //滚动条所在元素
|
var scrollElem = $(options.scrollElem || document); //滚动条所在元素
|
||||||
var mb = options.mb || 50; //与底部的临界距离
|
var mb = options.mb || 50; //与底部的临界距离
|
||||||
var isAuto = 'isAuto' in options ? options.isAuto : true; //是否自动滚动加载
|
var isAuto = 'isAuto' in options ? options.isAuto : true; //是否自动滚动加载
|
||||||
var end = options.end || '没有更多了'; //“末页”显示文案
|
var end = options.end || '没有更多了'; //“末页”显示文案
|
||||||
|
|
||||||
//滚动条所在元素是否为document
|
//滚动条所在元素是否为document
|
||||||
var notDocument = options.scrollElem && options.scrollElem !== document;
|
var notDocument = options.scrollElem && options.scrollElem !== document;
|
||||||
|
|
||||||
//加载更多
|
//加载更多
|
||||||
var ELEM_TEXT = '<cite>加载更多</cite>'
|
var ELEM_TEXT = '<cite>加载更多</cite>'
|
||||||
,more = $('<div class="layui-flow-more"><a href="javascript:;">'+ ELEM_TEXT +'</a></div>');
|
,more = $('<div class="layui-flow-more"><a href="javascript:;">'+ ELEM_TEXT +'</a></div>');
|
||||||
|
|
||||||
if(!elem.find('.layui-flow-more')[0]){
|
if(!elem.find('.layui-flow-more')[0]){
|
||||||
elem.append(more);
|
elem.append(more);
|
||||||
}
|
}
|
||||||
|
|
||||||
//加载下一个元素
|
//加载下一个元素
|
||||||
var next = function(html, over){
|
var next = function(html, over){
|
||||||
html = $(html);
|
html = $(html);
|
||||||
more.before(html);
|
more.before(html);
|
||||||
over = over == 0 ? true : null;
|
over = over == 0 ? true : null;
|
||||||
|
@ -42,43 +42,43 @@ layui.define('jquery', function(exports){
|
||||||
lock = null;
|
lock = null;
|
||||||
lazyimg && lazyimg();
|
lazyimg && lazyimg();
|
||||||
};
|
};
|
||||||
|
|
||||||
//触发请求
|
//触发请求
|
||||||
var done = function(){
|
var done = function(){
|
||||||
lock = true;
|
lock = true;
|
||||||
more.find('a').html(ELEM_LOAD);
|
more.find('a').html(ELEM_LOAD);
|
||||||
typeof options.done === 'function' && options.done(++page, next);
|
typeof options.done === 'function' && options.done(++page, next);
|
||||||
};
|
};
|
||||||
|
|
||||||
done();
|
done();
|
||||||
|
|
||||||
//不自动滚动加载
|
//不自动滚动加载
|
||||||
more.find('a').on('click', function(){
|
more.find('a').on('click', function(){
|
||||||
var othis = $(this);
|
var othis = $(this);
|
||||||
if(isOver) return;
|
if(isOver) return;
|
||||||
lock || done();
|
lock || done();
|
||||||
});
|
});
|
||||||
|
|
||||||
//如果允许图片懒加载
|
//如果允许图片懒加载
|
||||||
if(options.isLazyimg){
|
if(options.isLazyimg){
|
||||||
var lazyimg = that.lazyimg({
|
lazyimg = that.lazyimg({
|
||||||
elem: options.elem + ' img'
|
elem: options.elem + ' img'
|
||||||
,scrollElem: options.scrollElem
|
,scrollElem: options.scrollElem
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if(!isAuto) return that;
|
if(!isAuto) return that;
|
||||||
|
|
||||||
scrollElem.on('scroll', function(){
|
scrollElem.on('scroll', function(){
|
||||||
var othis = $(this), top = othis.scrollTop();
|
var othis = $(this), top = othis.scrollTop();
|
||||||
|
|
||||||
if(timer) clearTimeout(timer);
|
if(timer) clearTimeout(timer);
|
||||||
if(isOver || !elem.width()) return; //如果已经结束,或者元素处于隐藏状态,则不执行滚动加载
|
if(isOver || !elem.width()) return; //如果已经结束,或者元素处于隐藏状态,则不执行滚动加载
|
||||||
|
|
||||||
timer = setTimeout(function(){
|
timer = setTimeout(function(){
|
||||||
//计算滚动所在容器的可视高度
|
//计算滚动所在容器的可视高度
|
||||||
var height = notDocument ? othis.height() : $(window).height();
|
var height = notDocument ? othis.height() : $(window).height();
|
||||||
|
|
||||||
//计算滚动所在容器的实际高度
|
//计算滚动所在容器的实际高度
|
||||||
var scrollHeight = notDocument
|
var scrollHeight = notDocument
|
||||||
? othis.prop('scrollHeight')
|
? othis.prop('scrollHeight')
|
||||||
|
@ -90,21 +90,21 @@ layui.define('jquery', function(exports){
|
||||||
}
|
}
|
||||||
}, 100);
|
}, 100);
|
||||||
});
|
});
|
||||||
|
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
//图片懒加载
|
//图片懒加载
|
||||||
Flow.prototype.lazyimg = function(options){
|
Flow.prototype.lazyimg = function(options){
|
||||||
var that = this, index = 0, haveScroll;
|
var that = this, index = 0, haveScroll;
|
||||||
options = options || {};
|
options = options || {};
|
||||||
|
|
||||||
var scrollElem = $(options.scrollElem || document); //滚动条所在元素
|
var scrollElem = $(options.scrollElem || document); //滚动条所在元素
|
||||||
var elem = options.elem || 'img';
|
var elem = options.elem || 'img';
|
||||||
|
|
||||||
//滚动条所在元素是否为document
|
//滚动条所在元素是否为document
|
||||||
var notDocument = options.scrollElem && options.scrollElem !== document;
|
var notDocument = options.scrollElem && options.scrollElem !== document;
|
||||||
|
|
||||||
//显示图片
|
//显示图片
|
||||||
var show = function(item, height){
|
var show = function(item, height){
|
||||||
var start = scrollElem.scrollTop(), end = start + height;
|
var start = scrollElem.scrollTop(), end = start + height;
|
||||||
|
@ -119,7 +119,7 @@ layui.define('jquery', function(exports){
|
||||||
layui.img(src, function(){
|
layui.img(src, function(){
|
||||||
var next = that.lazyimg.elem.eq(index);
|
var next = that.lazyimg.elem.eq(index);
|
||||||
item.attr('src', src).removeAttr('lay-src');
|
item.attr('src', src).removeAttr('lay-src');
|
||||||
|
|
||||||
/* 当前图片加载就绪后,检测下一个图片是否在当前屏 */
|
/* 当前图片加载就绪后,检测下一个图片是否在当前屏 */
|
||||||
next[0] && render(next);
|
next[0] && render(next);
|
||||||
index++;
|
index++;
|
||||||
|
@ -130,7 +130,7 @@ layui.define('jquery', function(exports){
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, render = function(othis, scroll){
|
}, render = function(othis, scroll){
|
||||||
|
|
||||||
//计算滚动所在容器的可视高度
|
//计算滚动所在容器的可视高度
|
||||||
var height = notDocument ? (scroll||scrollElem).height() : $(window).height();
|
var height = notDocument ? (scroll||scrollElem).height() : $(window).height();
|
||||||
var start = scrollElem.scrollTop(), end = start + height;
|
var start = scrollElem.scrollTop(), end = start + height;
|
||||||
|
@ -145,18 +145,18 @@ layui.define('jquery', function(exports){
|
||||||
var item = that.lazyimg.elem.eq(i), elemTop = notDocument ? function(){
|
var item = that.lazyimg.elem.eq(i), elemTop = notDocument ? function(){
|
||||||
return item.offset().top - scrollElem.offset().top + start;
|
return item.offset().top - scrollElem.offset().top + start;
|
||||||
}() : item.offset().top;
|
}() : item.offset().top;
|
||||||
|
|
||||||
show(item, height);
|
show(item, height);
|
||||||
index = i;
|
index = i;
|
||||||
|
|
||||||
//如果图片的top坐标,超出了当前屏,则终止后续图片的遍历
|
//如果图片的top坐标,超出了当前屏,则终止后续图片的遍历
|
||||||
if(elemTop > end) break;
|
if(elemTop > end) break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
render();
|
render();
|
||||||
|
|
||||||
if(!haveScroll){
|
if(!haveScroll){
|
||||||
var timer;
|
var timer;
|
||||||
scrollElem.on('scroll', function(){
|
scrollElem.on('scroll', function(){
|
||||||
|
@ -165,12 +165,12 @@ layui.define('jquery', function(exports){
|
||||||
timer = setTimeout(function(){
|
timer = setTimeout(function(){
|
||||||
render(null, othis);
|
render(null, othis);
|
||||||
}, 50);
|
}, 50);
|
||||||
});
|
});
|
||||||
haveScroll = true;
|
haveScroll = true;
|
||||||
}
|
}
|
||||||
return render;
|
return render;
|
||||||
};
|
};
|
||||||
|
|
||||||
//暴露接口
|
//暴露接口
|
||||||
exports('flow', new Flow());
|
exports('flow', new Flow());
|
||||||
});
|
});
|
||||||
|
|
|
@ -1128,9 +1128,9 @@
|
||||||
|
|
||||||
//日历表
|
//日历表
|
||||||
Class.prototype.calendar = function(value, index, type){
|
Class.prototype.calendar = function(value, index, type){
|
||||||
|
index = index ? 1 : 0;
|
||||||
var that = this
|
var that = this
|
||||||
,options = that.config
|
,options = that.config
|
||||||
,index = index ? 1 : 0
|
|
||||||
,dateTime = value || that.thisDateTime(index)
|
,dateTime = value || that.thisDateTime(index)
|
||||||
,thisDate = new Date(), startWeek, prevMaxDate, thisMaxDate
|
,thisDate = new Date(), startWeek, prevMaxDate, thisMaxDate
|
||||||
,lang = that.lang()
|
,lang = that.lang()
|
||||||
|
@ -1156,7 +1156,7 @@
|
||||||
|
|
||||||
//赋值日
|
//赋值日
|
||||||
lay.each(tds, function(index_, item){
|
lay.each(tds, function(index_, item){
|
||||||
var YMD = [dateTime.year, dateTime.month], st = 0;
|
var YMD = [dateTime.year, dateTime.month], st;
|
||||||
item = lay(item);
|
item = lay(item);
|
||||||
item.removeAttr("class");
|
item.removeAttr("class");
|
||||||
if(index_ < startWeek){
|
if(index_ < startWeek){
|
||||||
|
@ -1971,7 +1971,7 @@
|
||||||
|
|
||||||
,elemCont = that.elemCont[index || 0]
|
,elemCont = that.elemCont[index || 0]
|
||||||
,listYM = that.listYM[index]
|
,listYM = that.listYM[index]
|
||||||
,addSubYeay = function(type){
|
,addSubYear = function(type){
|
||||||
var isYear = lay(elemCont).find('.laydate-year-list')[0]
|
var isYear = lay(elemCont).find('.laydate-year-list')[0]
|
||||||
,isMonth = lay(elemCont).find('.laydate-month-list')[0];
|
,isMonth = lay(elemCont).find('.laydate-month-list')[0];
|
||||||
|
|
||||||
|
@ -2006,7 +2006,7 @@
|
||||||
|
|
||||||
return {
|
return {
|
||||||
prevYear: function(){
|
prevYear: function(){
|
||||||
if(addSubYeay('sub')) return;
|
if(addSubYear('sub')) return;
|
||||||
if (that.rangeLinked) {
|
if (that.rangeLinked) {
|
||||||
options.dateTime.year--;
|
options.dateTime.year--;
|
||||||
that.checkDate('limit').calendar(null, null, 'init');
|
that.checkDate('limit').calendar(null, null, 'init');
|
||||||
|
@ -2048,7 +2048,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
,nextYear: function(){
|
,nextYear: function(){
|
||||||
if(addSubYeay()) return;
|
if(addSubYear()) return;
|
||||||
if (that.rangeLinked) {
|
if (that.rangeLinked) {
|
||||||
options.dateTime.year++;
|
options.dateTime.year++;
|
||||||
that.checkDate('limit').calendar(null, 0, 'init');
|
that.checkDate('limit').calendar(null, 0, 'init');
|
||||||
|
|
Loading…
Reference in New Issue