mirror of
https://gitee.com/layui/layui.git
synced 2025-04-05 17:38:02 +08:00
Merge remote-tracking branch 'origin/2.x' into 2.x
# Conflicts: # src/modules/table.js
This commit is contained in:
commit
777923718e
@ -24,7 +24,7 @@ toc: true
|
||||
</div>
|
||||
<div class="layui-col-sm4">
|
||||
<div class="layui-bg-blue">
|
||||
<p>#1e9fff<p>
|
||||
<p>#1e9fff</p>
|
||||
<p>经典蓝</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -38,7 +38,7 @@ Layui 选取以象征清新与包容的「蓝绿色」作为主色调,它介
|
||||
<div class="layui-row layui-col-space15 ws-docs-color">
|
||||
<div class="layui-col-sm3">
|
||||
<div class="layui-bg-red">
|
||||
<p>#ff5722<p>
|
||||
<p>#ff5722</p>
|
||||
<p>错误 - Danger</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -70,7 +70,7 @@ Layui 选取以象征清新与包容的「蓝绿色」作为主色调,它介
|
||||
<div class="layui-row ws-docs-color ws-docs-necolor">
|
||||
<div class="layui-col-md6">
|
||||
<div style="background-color: #FAFAFA;">
|
||||
<p>#fafafa<p>
|
||||
<p>#fafafa</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-col-md6">
|
||||
@ -136,4 +136,4 @@ Layui 的色调基础,除了前面提到的主辅中色之外,还建立在
|
||||
|
||||
## 标语
|
||||
|
||||
> 不热衷于视觉设计的开发者不是一个好作家。 —— 贤心
|
||||
> 不热衷于视觉设计的开发者不是一个好作家。 —— 贤心
|
||||
|
@ -145,8 +145,8 @@ layui.use(['layer', 'util'], function(layer, util){
|
||||
content: $('#test11111'),
|
||||
maxmin: true,
|
||||
shade: false,
|
||||
minStack: false, //最小化不堆叠在左下角
|
||||
id: 'page1', //定义 ID,防止重复弹出
|
||||
minStack: false, // 最小化不堆叠在左下角
|
||||
id: 'page-1', // 定义 ID,防止重复弹出
|
||||
min: function(layero, index){
|
||||
layer.msg('阻止了默认的最小化');
|
||||
layer.style(index, {top: 'auto', bottom: 0});
|
||||
@ -156,10 +156,12 @@ layui.use(['layer', 'util'], function(layer, util){
|
||||
}
|
||||
,test6: function(){
|
||||
layer.open({
|
||||
type: 2
|
||||
,content: 'https://www.aliyun.com/activity?userCode=ap0255is'
|
||||
,area: ['375px', '500px']
|
||||
,maxmin: true
|
||||
type: 2,
|
||||
content: 'https://www.aliyun.com/activity?userCode=ap0255is',
|
||||
area: ['375px', '500px'],
|
||||
id: 'iframe-1',
|
||||
hideOnClose: true, // 关闭时是否隐藏弹层容器,下次打开时直接显示原来的弹层
|
||||
maxmin: true
|
||||
});
|
||||
}
|
||||
,testLoading: function(){
|
||||
|
@ -817,55 +817,63 @@ a cite{font-style: normal; *cursor:pointer;}
|
||||
.layui-select-disabled .layui-disabled{border-color: #eee !important;}
|
||||
.layui-select-disabled .layui-edge{border-top-color: #d2d2d2}
|
||||
|
||||
/* 复选框 */.layui-form-checkbox{position: relative; display: inline-block; vertical-align: middle; height: 30px; line-height: 30px; margin-right: 10px; padding-right: 30px; background-color: #fff; cursor: pointer; font-size: 0; -webkit-transition: .1s linear; transition: .1s linear; box-sizing: border-box;}
|
||||
/* 复选框 */
|
||||
.layui-form-checkbox{position: relative; display: inline-block; vertical-align: middle; height: 30px; line-height: 30px; margin-right: 10px; padding-right: 30px; background-color: #fff; cursor: pointer; font-size: 0; -webkit-transition: .1s linear; transition: .1s linear; box-sizing: border-box;}
|
||||
.layui-form-checkbox:hover{}
|
||||
.layui-form-checkbox *{display: inline-block; vertical-align: middle;}
|
||||
.layui-form-checkbox span{padding: 0 10px; height: 100%; font-size: 14px; border-radius: 2px 0 0 2px; background-color: #d2d2d2; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
|
||||
.layui-form-checkbox:hover span{background-color: #c2c2c2;}
|
||||
.layui-form-checkbox i{position: absolute; right: 0; top: 0; width: 30px; height: 100%; border: 1px solid #d2d2d2; border-left: none; border-radius: 0 2px 2px 0; color: #fff; color: rgba(255,255,255,0); font-size: 20px; text-align: center; box-sizing: border-box;}
|
||||
.layui-form-checkbox:hover i{border-color: #c2c2c2; color: #c2c2c2;}
|
||||
.layui-form-checked, .layui-form-checked:hover{border-color: #16b777;}
|
||||
.layui-form-checked span, .layui-form-checked:hover span{background-color: #16b777;}
|
||||
.layui-form-checked i, .layui-form-checked:hover i{color: #16b777;}
|
||||
.layui-form-checkbox > *{display: inline-block; vertical-align: middle;}
|
||||
.layui-form-checkbox > div{padding: 0 11px; height: 100%; font-size: 14px; border-radius: 2px 0 0 2px; background-color: #d2d2d2; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
|
||||
.layui-form-checkbox:hover > div{background-color: #c2c2c2;}
|
||||
.layui-form-checkbox > i{position: absolute; right: 0; top: 0; width: 30px; height: 100%; border: 1px solid #d2d2d2; border-left: none; border-radius: 0 2px 2px 0; color: #fff; color: rgba(255,255,255,0); font-size: 20px; text-align: center; box-sizing: border-box;}
|
||||
.layui-form-checkbox:hover > i{border-color: #c2c2c2; color: #c2c2c2;}
|
||||
.layui-form-checked,
|
||||
.layui-form-checked:hover{border-color: #16b777;}
|
||||
.layui-form-checked > div,
|
||||
.layui-form-checked:hover > div{background-color: #16b777;}
|
||||
.layui-form-checked > i,
|
||||
.layui-form-checked:hover > i{color: #16b777;}
|
||||
.layui-form-item .layui-form-checkbox{margin-top: 4px;}
|
||||
.layui-form-checkbox.layui-checkbox-disabled > div{background-color: #eee !important;}
|
||||
.layui-form *[lay-checkbox]{display: none;}
|
||||
|
||||
/* 复选框-默认风格 */.layui-form-checkbox[lay-skin="primary"]{height: auto!important; line-height: normal!important; min-width: 18px; min-height: 18px; border: none!important; margin-right: 0; padding-left: 28px; padding-right: 0; background: none;}
|
||||
.layui-form-checkbox[lay-skin="primary"] span{padding-left: 0; padding-right: 15px; line-height: 18px; background: none; color: #5F5F5F;}
|
||||
.layui-form-checkbox[lay-skin="primary"] i{right: auto; left: 0; width: 16px; height: 16px; line-height: 16px; border: 1px solid #d2d2d2; font-size: 12px; border-radius: 2px; background-color: #fff; -webkit-transition: .1s linear; transition: .1s linear;}
|
||||
.layui-form-checkbox[lay-skin="primary"]:hover i{border-color: #16b777; color: #fff;}
|
||||
.layui-form-checked[lay-skin="primary"] i{border-color: #16b777 !important; background-color: #16b777; color: #fff;}
|
||||
.layui-checkbox-disabled[lay-skin="primary"] span{background: none!important; color: #c2c2c2!important;}
|
||||
.layui-form-checked.layui-checkbox-disabled[lay-skin="primary"] i{background: #eee!important; border-color: #eee!important;}
|
||||
.layui-checkbox-disabled[lay-skin="primary"]:hover i{border-color: #d2d2d2;}
|
||||
/* 复选框-默认风格 */
|
||||
.layui-form-checkbox[lay-skin="primary"]{height: auto!important; line-height: normal!important; min-width: 18px; min-height: 18px; border: none!important; margin-right: 0; padding-left: 24px; padding-right: 0; background: none;}
|
||||
.layui-form-checkbox[lay-skin="primary"] > div{margin-top: -1px; padding-left: 0; padding-right: 15px; line-height: 18px; background: none; color: #5F5F5F;}
|
||||
.layui-form-checkbox[lay-skin="primary"] > i{right: auto; left: 0; width: 16px; height: 16px; line-height: 16px; border: 1px solid #d2d2d2; font-size: 12px; border-radius: 2px; background-color: #fff; -webkit-transition: .1s linear; transition: .1s linear;}
|
||||
.layui-form-checkbox[lay-skin="primary"]:hover > i{border-color: #16b777; color: #fff;}
|
||||
.layui-form-checked[lay-skin="primary"] > i{border-color: #16b777 !important; background-color: #16b777; color: #fff;}
|
||||
.layui-checkbox-disabled[lay-skin="primary"] > div{background: none!important;}
|
||||
.layui-form-checked.layui-checkbox-disabled[lay-skin="primary"] > i{background: #eee!important; border-color: #eee!important;}
|
||||
.layui-checkbox-disabled[lay-skin="primary"]:hover > i{border-color: #d2d2d2;}
|
||||
.layui-form-item .layui-form-checkbox[lay-skin="primary"]{margin-top: 10px;}
|
||||
.layui-form-checkbox[lay-skin="primary"] .layui-icon-indeterminate{border-color: #16b777;}
|
||||
.layui-form-checkbox[lay-skin="primary"] .layui-icon-indeterminate:before{content: ''; display: inline-block; vertical-align: middle; position: relative; width: 50%; height: 1px; margin: -1px auto 0; background-color: #16b777;}
|
||||
.layui-form-checkbox[lay-skin="primary"] > .layui-icon-indeterminate{border-color: #16b777;}
|
||||
.layui-form-checkbox[lay-skin="primary"] > .layui-icon-indeterminate:before{content: ''; display: inline-block; vertical-align: middle; position: relative; width: 50%; height: 1px; margin: -1px auto 0; background-color: #16b777;}
|
||||
|
||||
/* 复选框-开关风格 */.layui-form-switch{position: relative; display: inline-block; vertical-align: middle; height: 22px; line-height: 22px; min-width: 35px; padding: 0 5px; margin-top: 8px; border: 1px solid #d2d2d2; border-radius: 20px; cursor: pointer; background-color: #fff; -webkit-transition: .1s linear; transition: .1s linear;}
|
||||
.layui-form-switch i{position: absolute; left: 5px; top: 3px; width: 16px; height: 16px; border-radius: 20px; background-color: #d2d2d2; -webkit-transition: .1s linear; transition: .1s linear;}
|
||||
.layui-form-switch em{position: relative; top: 0; width: 25px; margin-left: 21px; padding: 0!important; text-align: center!important; color: #999!important; font-style: normal!important; font-size: 12px;}
|
||||
/* 复选框-开关风格 */
|
||||
.layui-form-switch{position: relative; display: inline-block; vertical-align: middle; height: 22px; line-height: 22px; min-width: 35px; padding: 0 5px; margin-top: 8px; border: 1px solid #d2d2d2; border-radius: 20px; cursor: pointer; background-color: #fff; -webkit-transition: .1s linear; transition: .1s linear;}
|
||||
.layui-form-switch > i{position: absolute; left: 5px; top: 3px; width: 16px; height: 16px; border-radius: 20px; background-color: #d2d2d2; -webkit-transition: .1s linear; transition: .1s linear;}
|
||||
.layui-form-switch > div{position: relative; top: 0; margin-left: 21px; padding: 0!important; text-align: center!important; color: #999!important; font-style: normal!important; font-size: 12px;}
|
||||
.layui-form-onswitch{border-color: #16b777; background-color: #16b777;}
|
||||
.layui-form-onswitch i{left: 100%; margin-left: -21px; background-color: #fff;}
|
||||
.layui-form-onswitch em{margin-left: 0; margin-right: 21px; color: #fff!important;}
|
||||
.layui-form-onswitch > i{left: 100%; margin-left: -21px; background-color: #fff;}
|
||||
.layui-form-onswitch > div{margin-left: 0; margin-right: 21px; color: #fff!important;}
|
||||
|
||||
.layui-checkbox-disabled{border-color: #eee !important;}
|
||||
.layui-checkbox-disabled span{background-color: #eee !important;}
|
||||
.layui-checkbox-disabled i{border-color: #eee !important;}
|
||||
.layui-checkbox-disabled em{color: #d2d2d2 !important;}
|
||||
.layui-checkbox-disabled:hover i{color: #fff !important;}
|
||||
.layui-checkbox-disabled > div{color: #c2c2c2!important;}
|
||||
.layui-checkbox-disabled > i{border-color: #eee !important;}
|
||||
.layui-checkbox-disabled:hover > i{color: #fff !important;}
|
||||
|
||||
/* 单选框 */
|
||||
*[lay-radio]{display: none;}
|
||||
.layui-form-radio{display: inline-block; vertical-align: middle; line-height: 28px; margin: 6px 10px 0 0; padding-right: 10px; cursor: pointer; font-size: 0;}
|
||||
.layui-form-radio *{display: inline-block; vertical-align: middle; font-size: 14px;}
|
||||
.layui-form-radio>i{margin-right: 8px; font-size: 22px; color: #c2c2c2;}
|
||||
.layui-form-radio > *{display: inline-block; vertical-align: middle; font-size: 14px;}
|
||||
.layui-form-radio > i{margin-right: 8px; font-size: 22px; color: #c2c2c2;}
|
||||
.layui-form-radioed,
|
||||
.layui-form-radioed>i,
|
||||
.layui-form-radio:hover *{color: #16b777;}
|
||||
.layui-radio-disabled>i{color: #eee !important;}
|
||||
.layui-radio-disabled *{color: #c2c2c2!important;}
|
||||
.layui-form-radioed > i,
|
||||
.layui-form-radio:hover > *{color: #16b777;}
|
||||
.layui-radio-disabled > i{color: #eee !important;}
|
||||
.layui-radio-disabled > *{color: #c2c2c2!important;}
|
||||
.layui-form *[lay-radio]{display: none;}
|
||||
|
||||
/* 表单方框风格 */.layui-form-pane .layui-form-label{width: 110px; padding: 8px 15px; height: 38px; line-height: 20px; border-width: 1px; border-style: solid; border-radius: 2px 0 0 2px; text-align: center; background-color: #fafafa; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box;}
|
||||
/* 表单方框风格 */
|
||||
.layui-form-pane .layui-form-label{width: 110px; padding: 8px 15px; height: 38px; line-height: 20px; border-width: 1px; border-style: solid; border-radius: 2px 0 0 2px; text-align: center; background-color: #fafafa; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box;}
|
||||
.layui-form-pane .layui-input-inline{margin-left: -1px;}
|
||||
.layui-form-pane .layui-input-block{margin-left: 110px; left: -1px;}
|
||||
.layui-form-pane .layui-input{border-radius: 0 2px 2px 0;}
|
||||
|
@ -16,36 +16,37 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
|
||||
var Form = function(){
|
||||
this.config = {
|
||||
// 内置的验证规则
|
||||
verify: {
|
||||
required: [
|
||||
/[\S]+/
|
||||
,'必填项不能为空'
|
||||
/[\S]+/,
|
||||
'必填项不能为空'
|
||||
],
|
||||
phone: [
|
||||
/^1\d{10}$/,
|
||||
'请输入正确的手机号'
|
||||
],
|
||||
email: [
|
||||
/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/,
|
||||
'邮箱格式不正确'
|
||||
],
|
||||
url: [
|
||||
/^(#|(http(s?)):\/\/|\/\/)[^\s]+\.[^\s]+$/,
|
||||
'链接格式不正确'
|
||||
],
|
||||
number: function(value){
|
||||
if(isNaN(value)) return '只能填写数字';
|
||||
},
|
||||
date: [
|
||||
/^(\d{4})[-\/](\d{1}|0\d{1}|1[0-2])([-\/](\d{1}|0\d{1}|[1-2][0-9]|3[0-1]))*$/,
|
||||
'日期格式不正确'
|
||||
],
|
||||
identity: [
|
||||
/(^\d{15}$)|(^\d{17}(x|X|\d)$)/,
|
||||
'请输入正确的身份证号'
|
||||
]
|
||||
,phone: [
|
||||
/^1\d{10}$/
|
||||
,'请输入正确的手机号'
|
||||
]
|
||||
,email: [
|
||||
/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/
|
||||
,'邮箱格式不正确'
|
||||
]
|
||||
,url: [
|
||||
/^(#|(http(s?)):\/\/|\/\/)[^\s]+\.[^\s]+$/
|
||||
,'链接格式不正确'
|
||||
]
|
||||
,number: function(value){
|
||||
if(!value || isNaN(value)) return '只能填写数字'
|
||||
}
|
||||
,date: [
|
||||
/^(\d{4})[-\/](\d{1}|0\d{1}|1[0-2])([-\/](\d{1}|0\d{1}|[1-2][0-9]|3[0-1]))*$/
|
||||
,'日期格式不正确'
|
||||
]
|
||||
,identity: [
|
||||
/(^\d{15}$)|(^\d{17}(x|X|\d)$)/
|
||||
,'请输入正确的身份证号'
|
||||
]
|
||||
}
|
||||
,autocomplete: null // 全局 autocomplete 状态。null 表示不干预
|
||||
},
|
||||
autocomplete: null // 全局 autocomplete 状态。 null 表示不干预
|
||||
};
|
||||
};
|
||||
|
||||
@ -639,29 +640,43 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
|
||||
// 勾选
|
||||
reElem.on('click', function(){
|
||||
var othis = $(this);
|
||||
var filter = check.attr('lay-filter') // 获取过滤器
|
||||
var title = (check.attr('title')||'').split('|');
|
||||
var title = (
|
||||
othis.next('*[lay-checkbox]')[0]
|
||||
? othis.next().html()
|
||||
: check.attr('title') || ''
|
||||
);
|
||||
var skin = check.attr('lay-skin') || 'primary';
|
||||
|
||||
// 开关
|
||||
title = skin === 'switch' ? title.split('|') : [title];
|
||||
|
||||
// 禁用
|
||||
if(check[0].disabled) return;
|
||||
|
||||
// 半选
|
||||
if (check[0].indeterminate) {
|
||||
check[0].indeterminate = false;
|
||||
reElem.find(CLASS.SUBTRA).removeClass(CLASS.SUBTRA).addClass('layui-icon-ok')
|
||||
}
|
||||
|
||||
|
||||
// 开关
|
||||
check[0].checked ? (
|
||||
check[0].checked = false
|
||||
,reElem.removeClass(RE_CLASS[1]).find('em').text(title[1])
|
||||
check[0].checked = false,
|
||||
reElem.removeClass(RE_CLASS[1]),
|
||||
skin === 'switch' && reElem.children('div').html(title[1])
|
||||
) : (
|
||||
check[0].checked = true
|
||||
,reElem.addClass(RE_CLASS[1]).find('em').text(title[0])
|
||||
check[0].checked = true,
|
||||
reElem.addClass(RE_CLASS[1]),
|
||||
skin === 'switch' && reElem.children('div').html(title[0])
|
||||
);
|
||||
|
||||
// 事件
|
||||
layui.event.call(check[0], MOD_NAME, RE_CLASS[2]+'('+ filter +')', {
|
||||
elem: check[0]
|
||||
,value: check[0].value
|
||||
,othis: reElem
|
||||
elem: check[0],
|
||||
value: check[0].value,
|
||||
othis: reElem
|
||||
});
|
||||
});
|
||||
};
|
||||
@ -670,11 +685,16 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
checks.each(function(index, check){
|
||||
var othis = $(this);
|
||||
var skin = othis.attr('lay-skin') || 'primary';
|
||||
var title = $.trim(check.title || function(){ // 向下兼容 lay-text 属性
|
||||
var title = util.escape($.trim(check.title || function(){ // 向下兼容 lay-text 属性
|
||||
return check.title = othis.attr('lay-text') || '';
|
||||
}());
|
||||
}()));
|
||||
var disabled = this.disabled;
|
||||
|
||||
// 若存在标题模板,则优先读取标题模板
|
||||
if(othis.next('[lay-checkbox]')[0]){
|
||||
title = othis.next().html() || '';
|
||||
}
|
||||
|
||||
// 若为开关,则对 title 进行分隔解析
|
||||
title = skin === 'switch' ? title.split('|') : [title];
|
||||
|
||||
@ -684,27 +704,26 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
if(typeof othis.attr('lay-ignore') === 'string') return othis.show();
|
||||
|
||||
// 替代元素
|
||||
var hasRender = othis.next('.' + RE_CLASS[0])
|
||||
,reElem = $(['<div class="layui-unselect '+ RE_CLASS[0]
|
||||
,(check.checked ? (' '+ RE_CLASS[1]) : '') // 选中状态
|
||||
,(disabled ? ' layui-checkbox-disabled '+ DISABLED : '') // 禁用状态
|
||||
,'"'
|
||||
,(skin ? ' lay-skin="'+ skin +'"' : '') // 风格
|
||||
,'>'
|
||||
,function(){ // 不同风格的内容
|
||||
var hasRender = othis.next('.' + RE_CLASS[0]);
|
||||
var reElem = $(['<div class="layui-unselect '+ RE_CLASS[0],
|
||||
(check.checked ? (' '+ RE_CLASS[1]) : ''), // 选中状态
|
||||
(disabled ? ' layui-checkbox-disabled '+ DISABLED : ''), // 禁用状态
|
||||
'"',
|
||||
(skin ? ' lay-skin="'+ skin +'"' : ''), // 风格
|
||||
'>',
|
||||
function(){ // 不同风格的内容
|
||||
var type = {
|
||||
// 复选框
|
||||
"checkbox": [
|
||||
(title[0] ? ('<span>'+ util.escape(title[0]) +'</span>') : '')
|
||||
,'<i class="layui-icon '+(skin === 'primary' && !check.checked && othis.get(0).indeterminate ? CLASS.SUBTRA : 'layui-icon-ok')+'"></i>'
|
||||
(title[0] ? ('<div>'+ title[0] +'</div>') : (skin === 'primary' ? '' : '<div></div>')),
|
||||
'<i class="layui-icon '+(skin === 'primary' && !check.checked && othis.get(0).indeterminate ? CLASS.SUBTRA : 'layui-icon-ok')+'"></i>'
|
||||
].join(''),
|
||||
|
||||
// 开关
|
||||
"switch": '<em>'+ ((check.checked ? title[0] : title[1]) || '') +'</em><i></i>'
|
||||
"switch": '<div>'+ ((check.checked ? title[0] : title[1]) || '') +'</div><i></i>'
|
||||
};
|
||||
return type[skin] || type['checkbox'];
|
||||
}()
|
||||
,'</div>'].join(''));
|
||||
}(),
|
||||
'</div>'].join(''));
|
||||
|
||||
hasRender[0] && hasRender.remove(); // 如果已经渲染,则Rerender
|
||||
othis.after(reElem);
|
||||
@ -714,11 +733,14 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
|
||||
// 单选框
|
||||
,radio: function(elem){
|
||||
var CLASS = 'layui-form-radio', ICON = ['', '']
|
||||
,radios = elem || elemForm.find('input[type=radio]')
|
||||
var CLASS = 'layui-form-radio';
|
||||
var ICON = ['layui-icon-radio', 'layui-icon-circle'];
|
||||
var radios = elem || elemForm.find('input[type=radio]');
|
||||
|
||||
,events = function(reElem){
|
||||
var radio = $(this), ANIM = 'layui-anim-scaleSpring';
|
||||
// 事件
|
||||
var events = function(reElem){
|
||||
var radio = $(this);
|
||||
var ANIM = 'layui-anim-scaleSpring';
|
||||
|
||||
reElem.on('click', function(){
|
||||
var name = radio[0].name, forms = radio.parents(ELEM);
|
||||
@ -728,44 +750,45 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
if(radio[0].disabled) return;
|
||||
|
||||
layui.each(sameRadio, function(){
|
||||
var next = $(this).next('.'+CLASS);
|
||||
var next = $(this).next('.' + CLASS);
|
||||
this.checked = false;
|
||||
next.removeClass(CLASS+'ed');
|
||||
next.find('.layui-icon').removeClass(ANIM).html(ICON[1]);
|
||||
next.removeClass(CLASS + 'ed');
|
||||
next.find('.layui-icon').removeClass(ANIM + ' ' + ICON[0]).addClass(ICON[1]);
|
||||
});
|
||||
|
||||
radio[0].checked = true;
|
||||
reElem.addClass(CLASS+'ed');
|
||||
reElem.find('.layui-icon').addClass(ANIM).html(ICON[0]);
|
||||
reElem.addClass(CLASS + 'ed');
|
||||
reElem.find('.layui-icon').addClass(ANIM + ' ' + ICON[0]);
|
||||
|
||||
layui.event.call(radio[0], MOD_NAME, 'radio('+ filter +')', {
|
||||
elem: radio[0]
|
||||
,value: radio[0].value
|
||||
,othis: reElem
|
||||
elem: radio[0],
|
||||
value: radio[0].value,
|
||||
othis: reElem
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 初始渲染
|
||||
radios.each(function(index, radio){
|
||||
var othis = $(this), hasRender = othis.next('.' + CLASS), disabled = this.disabled;
|
||||
var othis = $(this), hasRender = othis.next('.' + CLASS);
|
||||
var disabled = this.disabled;
|
||||
|
||||
if(typeof othis.attr('lay-ignore') === 'string') return othis.show();
|
||||
hasRender[0] && hasRender.remove(); // 如果已经渲染,则Rerender
|
||||
|
||||
// 替代元素
|
||||
var reElem = $(['<div class="layui-unselect '+ CLASS
|
||||
,(radio.checked ? (' '+CLASS+'ed') : '') // 选中状态
|
||||
,(disabled ? ' layui-radio-disabled '+DISABLED : '') +'">' // 禁用状态
|
||||
,'<i class="layui-anim layui-icon">'+ ICON[radio.checked ? 0 : 1] +'</i>'
|
||||
,'<div>'+ function(){
|
||||
var reElem = $(['<div class="layui-unselect '+ CLASS,
|
||||
(radio.checked ? (' '+ CLASS +'ed') : ''), // 选中状态
|
||||
(disabled ? ' layui-radio-disabled '+DISABLED : '') +'">', // 禁用状态
|
||||
'<i class="layui-anim layui-icon '+ ICON[radio.checked ? 0 : 1] +'"></i>',
|
||||
'<div>'+ function(){
|
||||
var title = util.escape(radio.title || '');
|
||||
if(typeof othis.next().attr('lay-radio') === 'string'){
|
||||
if(othis.next('[lay-radio]')[0]){
|
||||
title = othis.next().html();
|
||||
// othis.next().remove();
|
||||
}
|
||||
return title
|
||||
}() +'</div>'
|
||||
,'</div>'].join(''));
|
||||
return title;
|
||||
}() +'</div>',
|
||||
'</div>'].join(''));
|
||||
|
||||
othis.after(reElem);
|
||||
events.call(this, reElem);
|
||||
@ -838,7 +861,7 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
var verifyStr = othis.attr('lay-verify') || '';
|
||||
var vers = verifyStr.split('|');
|
||||
var verType = othis.attr('lay-vertype'); // 提示方式
|
||||
var value = othis.val();
|
||||
var value = $.trim(othis.val());
|
||||
|
||||
othis.removeClass(DANGER); // 移除警示样式
|
||||
|
||||
@ -861,12 +884,13 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
|
||||
errorText = errorText || rule[1];
|
||||
|
||||
// 获取自定义必填项提示文本
|
||||
if(thisVer === 'required'){
|
||||
errorText = othis.attr('lay-reqtext') || errorText;
|
||||
}
|
||||
|
||||
// 若为必填项或者非空命中校验,则阻止提交,弹出提示
|
||||
if(isTrue){
|
||||
if(isTrue && (thisVer === 'required' || (value && thisVer !== 'required'))){
|
||||
// 提示层风格
|
||||
if(verType === 'tips'){
|
||||
layer.tips(errorText, function(){
|
||||
@ -881,7 +905,7 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||
layer.alert(errorText, {title: '提示', shadeClose: true});
|
||||
}
|
||||
// 若返回的为字符或数字,则自动弹出默认提示框;否则由 verify 方法中处理提示
|
||||
else if(/\bstring|number\b/.test(typeof errorText)){
|
||||
else if(/\b(string|number)\b/.test(typeof errorText)){
|
||||
layer.msg(errorText, {icon: 5, shift: 6});
|
||||
}
|
||||
|
||||
|
@ -255,7 +255,7 @@ doms.anim = {
|
||||
doms.SHADE = 'layui-layer-shade';
|
||||
doms.MOVE = 'layui-layer-move';
|
||||
|
||||
//默认配置
|
||||
// 默认配置
|
||||
Class.pt.config = {
|
||||
type: 0,
|
||||
shade: 0.3,
|
||||
@ -265,16 +265,16 @@ Class.pt.config = {
|
||||
offset: 'auto',
|
||||
area: 'auto',
|
||||
closeBtn: 1,
|
||||
time: 0, //0表示不自动关闭
|
||||
icon: -1,
|
||||
time: 0, // 0 表示不自动关闭
|
||||
zIndex: 19891014,
|
||||
maxWidth: 360,
|
||||
anim: 0,
|
||||
isOutAnim: true, //退出动画
|
||||
minStack: true, //最小化堆叠
|
||||
icon: -1,
|
||||
isOutAnim: true, // 退出动画
|
||||
minStack: true, // 最小化堆叠
|
||||
moveType: 1,
|
||||
resize: true,
|
||||
scrollbar: true, //是否允许浏览器滚动条
|
||||
scrollbar: true, // 是否允许浏览器滚动条
|
||||
tips: 2
|
||||
};
|
||||
|
||||
@ -382,25 +382,45 @@ Class.pt.vessel = function(conType, callback){
|
||||
return that;
|
||||
};
|
||||
|
||||
//创建骨架
|
||||
// 创建骨架
|
||||
Class.pt.creat = function(){
|
||||
var that = this
|
||||
,config = that.config
|
||||
,times = that.index, nodeIndex
|
||||
,content = config.content
|
||||
,conType = typeof content === 'object'
|
||||
,body = $('body');
|
||||
var that = this;
|
||||
var config = that.config;
|
||||
var times = that.index, nodeIndex;
|
||||
var content = config.content;
|
||||
var conType = typeof content === 'object';
|
||||
var body = $('body');
|
||||
|
||||
if(config.id && $('.'+ doms[0]).find('#'+ config.id)[0]) return;
|
||||
// 若 id 对应的弹层已经存在,则不重新创建
|
||||
if(config.id && $('.'+ doms[0]).find('#'+ config.id)[0]){
|
||||
return (function(){
|
||||
var layero = $('#'+ config.id).closest('.'+ doms[0]);
|
||||
var index = layero.attr('times');
|
||||
var options = layero.data('config');
|
||||
var elemShade = $('#'+ doms.SHADE + index);
|
||||
|
||||
var maxminStatus = layero.data('maxminStatus') || {};
|
||||
// 若弹层为最小化状态,则点击目标元素时,自动还原
|
||||
if(maxminStatus === 'min'){
|
||||
layer.restore(index);
|
||||
} else if(options.hideOnClose){
|
||||
elemShade.show();
|
||||
layero.show();
|
||||
};
|
||||
})();
|
||||
};
|
||||
|
||||
// 是否移除活动元素的焦点
|
||||
if(config.removeFocus) {
|
||||
document.activeElement.blur(); // 将原始的聚焦节点失焦
|
||||
}
|
||||
|
||||
// 初始化 area 属性
|
||||
if(typeof config.area === 'string'){
|
||||
config.area = config.area === 'auto' ? ['', ''] : [config.area, ''];
|
||||
}
|
||||
|
||||
//anim兼容旧版shift
|
||||
// anim 兼容旧版 shift
|
||||
if(config.shift){
|
||||
config.anim = config.shift;
|
||||
}
|
||||
@ -500,13 +520,8 @@ Class.pt.creat = function(){
|
||||
});
|
||||
};
|
||||
|
||||
// 记录关闭动画
|
||||
if(config.isOutAnim){
|
||||
that.layero.data({
|
||||
isOutAnim: true,
|
||||
anim: config.anim
|
||||
});
|
||||
}
|
||||
// 记录配置信息
|
||||
that.layero.data('config', config);
|
||||
};
|
||||
|
||||
// 当前实例的 resize 事件
|
||||
@ -1025,8 +1040,6 @@ layer.style = function(index, options, limit){
|
||||
|
||||
// 最小化
|
||||
layer.min = function(index, options){
|
||||
options = options || {};
|
||||
|
||||
var layero = $('#'+ doms[0] + index);
|
||||
var maxminStatus = layero.data('maxminStatus');
|
||||
|
||||
@ -1034,8 +1047,10 @@ layer.min = function(index, options){
|
||||
if(maxminStatus === 'max') layer.restore(index); // 若当前为最大化,则先还原后再最小化
|
||||
|
||||
layero.data('maxminStatus', 'min');
|
||||
options = options || layero.data('config') || {};
|
||||
|
||||
var shadeo = $('#'+ doms.SHADE + index);
|
||||
var elemMin = layero.find('.layui-layer-min');
|
||||
var titHeight = layero.find(doms[1]).outerHeight() || 0;
|
||||
var minLeft = layero.attr('minLeft'); // 最小化时的横坐标
|
||||
var hasMinLeft = typeof minLeft === 'string'; // 是否已经赋值过最小化坐标
|
||||
@ -1077,7 +1092,7 @@ layer.min = function(index, options){
|
||||
layero.attr('position', position);
|
||||
layer.style(index, settings, true);
|
||||
|
||||
layero.find('.layui-layer-min').hide();
|
||||
elemMin.hide();
|
||||
layero.attr('type') === 'page' && layero.find(doms[4]).hide();
|
||||
ready.rescollbar(index);
|
||||
|
||||
@ -1157,7 +1172,10 @@ layer.close = function(index, callback){
|
||||
) : $('#'+ doms[0] + index)
|
||||
}();
|
||||
var type = layero.attr('type');
|
||||
var data = layero.data() || {};
|
||||
var options = layero.data('config') || {};
|
||||
var hideOnClose = options.id && options.hideOnClose; // 是否关闭时移除弹层容器
|
||||
|
||||
if(!layero[0]) return;
|
||||
|
||||
// 关闭动画
|
||||
var closeAnim = ({
|
||||
@ -1165,11 +1183,19 @@ layer.close = function(index, callback){
|
||||
slideLeft: 'layer-anim-slide-left-out',
|
||||
slideUp: 'layer-anim-slide-up-out',
|
||||
slideRight: 'layer-anim-slide-right-out'
|
||||
})[data.anim] || 'layer-anim-close';
|
||||
|
||||
if(!layero[0]) return;
|
||||
|
||||
var WRAP = 'layui-layer-wrap', remove = function(){
|
||||
})[options.anim] || 'layer-anim-close';
|
||||
|
||||
// 移除主容器
|
||||
var remove = function(){
|
||||
var WRAP = 'layui-layer-wrap';
|
||||
|
||||
// 是否关闭时隐藏弹层容器
|
||||
if(hideOnClose){
|
||||
layero.removeClass('layer-anim '+ closeAnim);
|
||||
return layero.hide();
|
||||
}
|
||||
|
||||
// 是否为页面捕获层
|
||||
if(type === ready.type[1] && layero.attr('conType') === 'object'){
|
||||
layero.children(':not(.'+ doms[5] +')').remove();
|
||||
var wrap = layero.find('.'+WRAP);
|
||||
@ -1178,7 +1204,7 @@ layer.close = function(index, callback){
|
||||
}
|
||||
wrap.css('display', wrap.data('display')).removeClass(WRAP);
|
||||
} else {
|
||||
//低版本IE 回收 iframe
|
||||
// 低版本 IE 回收 iframe
|
||||
if(type === ready.type[2]){
|
||||
try {
|
||||
var iframe = $('#'+ doms[4] + index)[0];
|
||||
@ -1201,13 +1227,18 @@ layer.close = function(index, callback){
|
||||
delete ready.events.resize[index];
|
||||
}
|
||||
};
|
||||
// 移除遮罩
|
||||
var removeShade = (function fn(){
|
||||
$('#'+ doms.SHADE + index)[
|
||||
hideOnClose ? 'hide' : 'remove'
|
||||
]();
|
||||
})();
|
||||
|
||||
// 是否允许关闭动画
|
||||
if(data.isOutAnim){
|
||||
if(options.isOutAnim){
|
||||
layero.addClass('layer-anim '+ closeAnim);
|
||||
}
|
||||
|
||||
$('#layui-layer-moves, #'+ doms.SHADE + index).remove();
|
||||
layer.ie == 6 && ready.reselect();
|
||||
ready.rescollbar(index);
|
||||
|
||||
@ -1217,7 +1248,7 @@ layer.close = function(index, callback){
|
||||
ready.minStackArr.push(layero.attr('minLeft'));
|
||||
}
|
||||
|
||||
if((layer.ie && layer.ie < 10) || !layero.data('isOutAnim')){
|
||||
if((layer.ie && layer.ie < 10) || !options.isOutAnim){
|
||||
remove()
|
||||
} else {
|
||||
setTimeout(function(){
|
||||
|
@ -1674,20 +1674,20 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||
|
||||
if(!height) return;
|
||||
|
||||
//减去列头区域的高度
|
||||
// 减去列头区域的高度
|
||||
bodyHeight = parseFloat(height) - (that.layHeader.outerHeight() || 39) - 1; //此处的数字常量是为了防止容器处在隐藏区域无法获得高度的问题,暂时只对默认尺寸的表格做支持。
|
||||
|
||||
//减去工具栏的高度
|
||||
// 减去工具栏的高度
|
||||
if(options.toolbar){
|
||||
bodyHeight -= (that.layTool.outerHeight() || 50);
|
||||
}
|
||||
|
||||
//减去统计栏的高度
|
||||
// 减去统计栏的高度
|
||||
if(options.totalRow){
|
||||
bodyHeight -= (that.layTotal.outerHeight() || 40) - 1; // 减掉一个共用的 border width
|
||||
}
|
||||
|
||||
//减去分页栏的高度
|
||||
// 减去分页栏的高度
|
||||
if(options.page || options.pagebar){
|
||||
bodyHeight -= (that.layPage.outerHeight() || 43) - 1;
|
||||
}
|
||||
@ -2140,11 +2140,13 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||
|
||||
// 复选框选择(替代元素的 click 事件)
|
||||
that.elem.on('click', 'input[name="layTableCheckbox"]+', function(){
|
||||
var checkbox = $(this).prev()
|
||||
,children = that.layBody.find('input[name="layTableCheckbox"]')
|
||||
,index = checkbox.parents('tr').eq(0).data('index')
|
||||
,checked = checkbox[0].checked
|
||||
,isAll = checkbox.attr('lay-filter') === 'layTableAllChoose';
|
||||
var othis = $(this);
|
||||
var td = othis.closest('td');
|
||||
var checkbox = othis.prev();
|
||||
var children = that.layBody.find('input[name="layTableCheckbox"]');
|
||||
var index = checkbox.parents('tr').eq(0).data('index');
|
||||
var checked = checkbox[0].checked;
|
||||
var isAll = checkbox.attr('lay-filter') === 'layTableAllChoose';
|
||||
|
||||
if(checkbox[0].disabled) return;
|
||||
|
||||
@ -2167,14 +2169,19 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||
MOD_NAME, 'checkbox('+ filter +')',
|
||||
commonMember.call(checkbox[0], {
|
||||
checked: checked,
|
||||
type: isAll ? 'all' : 'one'
|
||||
type: isAll ? 'all' : 'one',
|
||||
getCol: function(){ // 获取当前列的表头配置信息
|
||||
return that.col(td.data('key'));
|
||||
}
|
||||
})
|
||||
);
|
||||
});
|
||||
|
||||
// 单选框选择
|
||||
that.elem.on('click', 'input[lay-type="layTableRadio"]+', function(){
|
||||
var radio = $(this).prev();
|
||||
var othis = $(this);
|
||||
var td = othis.closest('td');
|
||||
var radio = othis.prev();
|
||||
var checked = radio[0].checked;
|
||||
var index = radio.parents('tr').eq(0).data('index');
|
||||
|
||||
@ -2191,7 +2198,10 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||
radio[0],
|
||||
MOD_NAME, 'radio('+ filter +')',
|
||||
commonMember.call(radio[0], {
|
||||
checked: checked
|
||||
checked: checked,
|
||||
getCol: function(){ // 获取当前列的表头配置信息
|
||||
return that.col(td.data('key'));
|
||||
}
|
||||
})
|
||||
);
|
||||
});
|
||||
@ -2371,6 +2381,7 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||
// 行工具条操作事件
|
||||
var toolFn = function(type){
|
||||
var othis = $(this);
|
||||
var td = othis.closest('td');
|
||||
var index = othis.parents('tr').eq(0).data('index');
|
||||
|
||||
layui.event.call(
|
||||
@ -2378,7 +2389,10 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||
MOD_NAME,
|
||||
(type || 'tool') + '('+ filter +')',
|
||||
commonMember.call(this, {
|
||||
event: othis.attr('lay-event')
|
||||
event: othis.attr('lay-event'),
|
||||
getCol: function(){ // 获取当前列的表头配置信息
|
||||
return that.col(td.data('key'));
|
||||
}
|
||||
})
|
||||
);
|
||||
// 设置当前行选中样式
|
||||
|
Loading…
Reference in New Issue
Block a user