/**
|
|
@Name:layui.form 表单组件
|
@Author:贤心
|
@License:MIT
|
|
*/
|
|
layui.define(['layer','vciWebComboxStore','vciWebRefer','laydate','upload'], function(exports){
|
"use strict";
|
|
var $ = layui.$
|
,layer = layui.layer
|
,hint = layui.hint()
|
,device = layui.device()
|
|
,MOD_NAME = 'form', ELEM = '.layui-form', THIS = 'layui-this', SHOW = 'layui-show', HIDE = 'layui-hide', DISABLED = 'layui-disabled'
|
|
,Form = function(){
|
this.config = {
|
verify: {
|
required: [
|
/[\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(!value || isNaN(value)) return '只能填写数字'
|
// }
|
,number: function(value){
|
if(isNaN(value)) return '只能填写数字'
|
}
|
,positiveNumber: function(value){
|
if(!/^[+]{0,1}(\d+)$/.test(value)) return '只能填写正整数'
|
}
|
//不包含0
|
,numbernotzero: function(value){
|
if(!/^[1-9]\d*$/.test(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)$)/
|
,'请输入正确的身份证号'
|
]
|
,letter: [
|
/^[A-Za-z]+$/
|
,'只能输入字母'
|
]
|
|
}
|
};
|
this.layout = {//布局-weidy@2018-03-05添加,增加列布局的方式
|
form:'form',
|
column:'column'
|
};
|
this.elementConfig = {//字段的配置,weidy@2018-03-05 用于添加字段的相关配置
|
defaultConfig:{
|
defaultColumnOneRow:1,
|
defaultLabelWidth:100,
|
defaultInputWidth:190,
|
defaultLabelAlign:'right'
|
}
|
};
|
this.fieldsMap = {//所有的字段
|
|
};
|
this.callbackOfAddItem = '';//存储addItems 的callback changeItems需要重新渲染
|
this.sourceDataOfAddItem = '';////存储addItems sourceData changeItems需要重新渲染
|
this.isAppendOfAddItem = '';//存储addItems ipAppend changeItems需要重新渲染
|
this.referFieldsMap = {
|
//参照的字段
|
}
|
};
|
|
//全局设置
|
Form.prototype.set = function(options){
|
var that = this;
|
$.extend(true, that.config, options);
|
return that;
|
};
|
|
//验证规则设定
|
Form.prototype.verify = function(settings){
|
var that = this;
|
$.extend(true, that.config.verify, settings);
|
return that;
|
};
|
|
//表单事件监听
|
Form.prototype.on = function(events, callback){
|
return layui.onevent.call(this, MOD_NAME, events, callback);
|
};
|
|
//表单控件渲染
|
Form.prototype.render = function(type, filter){
|
var that = this
|
,elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}())
|
,items = {
|
|
//下拉选择框
|
select: function(){
|
var TIPS = '请选择', CLASS = 'layui-form-select', TITLE = 'layui-select-title'
|
,NONE = 'layui-select-none', initValue = '', thatInput
|
|
,selects = elemForm.find('select'), hide = function(e, clear){
|
if(!$(e.target).parent().hasClass(TITLE) || clear){
|
$('.'+CLASS).removeClass(CLASS+'ed ' + CLASS+'up');
|
thatInput && initValue && thatInput.val(initValue);
|
}
|
thatInput = null;
|
}
|
|
,events = function(reElem, disabled, isSearch){
|
var select = $(this)
|
,title = reElem.find('.' + TITLE)
|
,input = title.find('input')
|
,dl = reElem.find('dl')
|
,dds = dl.children('dd')
|
,showRefer = title.find(".layui-search")
|
,clearRefer = title.find(".layui-clear");
|
|
if(disabled) return;
|
|
//展开下拉
|
var showDown = function(){
|
var top = reElem.offset().top + reElem.outerHeight() + 5 - win.scrollTop()
|
,dlHeight = dl.outerHeight();
|
reElem.addClass(CLASS+'ed');
|
dds.removeClass(HIDE);
|
|
//上下定位识别
|
if(top + dlHeight > win.height() && top >= dlHeight){
|
reElem.addClass(CLASS + 'up');
|
}
|
}, hideDown = function(choose){
|
reElem.removeClass(CLASS+'ed ' + CLASS+'up');
|
input.blur();
|
|
if(choose) return;
|
|
notOption(input.val(), function(none){
|
if(none){
|
initValue = dl.find('.'+THIS).html();
|
input && input.val(initValue);
|
}
|
});
|
};
|
var refer = select.attr("lay-refer");
|
var referEditable = ("true" == select.attr("lay-refer-editable")) ;
|
if(showRefer && referEditable){
|
showRefer.on('click',function (e) {
|
var readOnly = select.attr("readOnly");
|
readOnly == "readonly"?readOnly=true:{};
|
if($webUtil.isNotNull(refer) &&!readOnly) {
|
//说明是refer
|
var vciRefer = layui.vciWebRefer;
|
var thisReferName = select.attr("name");
|
var showFieldName = select.attr("lay-refer-showfield");
|
if (!filter) {
|
filter = select.parents('form').attr("lay-filter");
|
}
|
var referItem = that.referFieldsMap[filter + "${refer}" + thisReferName];
|
var options = referItem.referConfig;
|
options.showField = showFieldName;
|
vciRefer.newRefer(filter, thisReferName, select, options);
|
|
var formValues = that.getValues(filter, true);
|
that.setValues(formValues, filter);
|
vciRefer.showRefer(filter, thisReferName, formValues);
|
vciRefer.addChangeValueListener(filter, thisReferName, showFieldName, function (tfilter, tempRefer, tempShowRefer, value, rawValue, selectData) {
|
var tempValues = {};
|
tempValues[tempRefer] = value;
|
tempValues[tempShowRefer] = rawValue;
|
that.setValues(tempValues, tfilter, true);
|
layui.event.call(this, MOD_NAME, 'select(' + filter + ')', {
|
elem: select[0]
|
, value: value
|
, othis: reElem,
|
rowData: selectData,
|
name: thisReferName
|
});
|
});
|
return;
|
}
|
});
|
}
|
//点击标题区域
|
title.on('click', function (e) {
|
if (referEditable) {
|
e.preventDefault();
|
input.focus();
|
//把这个下拉框的值清空.这样就只能获取到手动输入的值
|
select.val("");
|
return;
|
}
|
//weidy在这里添加如果是参照的时候
|
var readOnly = select.attr("readOnly");
|
readOnly == "readonly" ? readOnly = true : {};
|
if(readOnly) return;
|
if ($webUtil.isNotNull(refer) && !readOnly) {
|
//说明是refer
|
var vciRefer = layui.vciWebRefer;
|
var thisReferName = select.attr("name");
|
var showFieldName = select.attr("lay-refer-showfield");
|
if (!filter) {
|
filter = select.parents('form').attr("lay-filter");
|
}
|
var referItem = that.referFieldsMap[filter + "${refer}" + thisReferName];
|
var options = referItem.referConfig;
|
options.showField = showFieldName;
|
vciRefer.newRefer(filter, thisReferName, select, options);
|
vciRefer.showRefer(filter, thisReferName, that.getValues(filter, true));
|
vciRefer.addChangeValueListener(filter, thisReferName, showFieldName, function (tfilter, tempRefer, tempShowRefer, value, rawValue, selectData) {
|
var tempValues = {};
|
tempValues[tempRefer] = value;
|
tempValues[tempShowRefer] = rawValue;
|
that.setValues(tempValues, tfilter, true);
|
layui.event.call(this, MOD_NAME, 'select(' + filter + ')', {
|
elem: select[0]
|
, value: value
|
, othis: reElem,
|
rowData: selectData,
|
name: thisReferName
|
});
|
});
|
return;
|
} else if ($webUtil.isNotNull(refer) && readOnly) {
|
return;
|
}
|
reElem.hasClass(CLASS + 'ed') ? (
|
hideDown()
|
) : (
|
hide(e, true),
|
showDown()
|
);
|
dl.find('.' + NONE).remove();
|
});
|
|
//点击箭头获取焦点
|
title.find('.layui-edge').on('click', function(){
|
input.focus();
|
});
|
|
if(clearRefer){
|
clearRefer.on('click',function(e){
|
var showFieldName = select.attr("lay-refer-showfield");
|
var thisRefer = select.attr("name");
|
var tempValues = {};
|
tempValues[thisRefer] = "";
|
tempValues[showFieldName] = "";
|
that.setValues(tempValues, filter,true);
|
var vciRefer = layui.vciWebRefer;
|
vciRefer.clearValue(filter,thisRefer);
|
layui.stope(e);
|
return false;
|
});
|
}
|
|
//键盘事件
|
input.on('keyup', function(e){
|
var keyCode = e.keyCode;
|
//Tab键
|
if(keyCode === 9){
|
showDown();
|
}
|
}).on('keydown', function(e){
|
var keyCode = e.keyCode;
|
//Tab键
|
if(keyCode === 9){
|
hideDown();
|
} else if(keyCode === 13){ //回车键
|
e.preventDefault();
|
}
|
});
|
|
//检测值是否不属于select项
|
var notOption = function(value, callback, origin){
|
var num = 0;
|
layui.each(dds, function(){
|
var othis = $(this)
|
,text = othis.text()
|
,not = text.indexOf(value) === -1;
|
if(value === '' || (origin === 'blur') ? value !== text : not) num++;
|
origin === 'keyup' && othis[not ? 'addClass' : 'removeClass'](HIDE);
|
});
|
var none = num === dds.length;
|
return callback(none), none;
|
};
|
|
//搜索匹配
|
var search = function(e){
|
var value = this.value, keyCode = e.keyCode;
|
|
if(keyCode === 9 || keyCode === 13
|
|| keyCode === 37 || keyCode === 38
|
|| keyCode === 39 || keyCode === 40
|
){
|
return false;
|
}
|
|
notOption(value, function(none){
|
if(none){
|
dl.find('.'+NONE)[0] || dl.append('<p class="'+ NONE +'">无匹配项</p>');
|
} else {
|
dl.find('.'+NONE).remove();
|
}
|
}, 'keyup');
|
|
if(value === ''){
|
dl.find('.'+NONE).remove();
|
}
|
};
|
|
if(isSearch) {
|
input.on('keyup', search).on('blur', function (e) {
|
var iseditable = select.attr('lay-combox-editable');
|
if (iseditable != 'true') {
|
thatInput = input;
|
initValue = dl.find('.' + THIS).html();
|
setTimeout(function () {
|
notOption(input.val(), function (none) {
|
initValue || input.val(''); //none && !initValue
|
}, 'blur');
|
}, 200);
|
}
|
|
});
|
}
|
|
//选择
|
dds.on('click', function(){
|
var othis = $(this), value = othis.attr('lay-value');var name = othis.text()
|
var selectFilter = select.attr('lay-filter'); //获取过滤器
|
|
if(othis.hasClass(DISABLED)) return false;
|
|
if(othis.hasClass('layui-select-tips')){
|
input.val('');
|
} else {
|
input.val(othis.text());
|
othis.addClass(THIS);
|
}
|
|
othis.siblings().removeClass(THIS);
|
select.val(value).removeClass('layui-form-danger')
|
layui.event.call(this, MOD_NAME, 'select('+ selectFilter +')', {
|
elem: select[0]
|
,value: value
|
,othis: reElem
|
,name:name
|
});
|
|
hideDown(true);
|
return false;
|
});
|
|
reElem.find('dl>dt').on('click', function(e){
|
return false;
|
});
|
|
//关闭下拉
|
$(document).off('click', hide).on('click', hide);
|
}
|
|
selects.each(function(index, select){
|
var othis = $(this)
|
,hasRender = othis.next('.'+CLASS)
|
,disabled = this.disabled
|
,value = select.value
|
,selected = select.selectedIndex>-1?$(select.options[select.selectedIndex]) :{html:function (){return ''}} //获取当前选中项
|
,optionsFirst = select.options[0];
|
|
if(typeof othis.attr('lay-ignore') === 'string') return othis.show();
|
|
var tooltips = typeof othis.attr('lay-tooltips') === 'string' ?othis.attr('lay-tooltips'):false
|
|
var isSearch = typeof othis.attr('lay-search') === 'string'
|
,placeholder = optionsFirst ? (
|
optionsFirst.value ? TIPS : (optionsFirst.innerHTML || TIPS)
|
) : TIPS;
|
|
var isNeedAddWidth = false;
|
var selectWidth = othis.css('width');
|
if($webUtil.isNotNull(selectWidth) || selectWidth>1){
|
isNeedAddWidth = true;
|
}
|
var isNeedAddHeight = false;
|
var selectHeight = othis.css('height');
|
if(othis.attr('style') ==null || othis.attr('style').indexOf('height') > -1 && ($webUtil.isNotNull(selectHeight) || selectHeight>1)){
|
if (othis.attr('style') ==null) {
|
isNeedAddHeight = false;
|
}else{
|
isNeedAddHeight = true;
|
}
|
|
}
|
//weidy在这里添加如果是参照的时候
|
var refer = othis.attr("lay-refer");
|
var isRefer = false;
|
var isReferEditable = ("true" == othis.attr("lay-refer-editable"));
|
var isComboxEditable = ("true" == othis.attr("lay-combox-editable"));
|
var readOnly = othis.attr("readOnly");
|
if(readOnly == "readonly"){
|
readOnly = true;
|
}
|
if($webUtil.isNotNull(refer)){
|
isRefer = true;
|
}
|
var inDialog = false;
|
if(othis.attr("name") == 'conditionField' || othis.attr("name") == 'conditionOption' || othis.parent().attr("name") == 'conditionValue'){
|
inDialog = true;
|
isNeedAddWidth = false;
|
}
|
if("true" == othis.attr("inDialog")){
|
inDialog = true;
|
}
|
//替代元素
|
var selectNameText = othis.attr("selectTextName");
|
selectNameText= selectNameText?selectNameText:"";
|
var reElem = $(['<div class="'+ (isSearch ? '' : 'layui-unselect ') + CLASS + (readOnly ? ' layui-field-readonly ' : '')+ (disabled ? ' layui-select-disabled' : '')+ '"'
|
+ 'style="' + (isNeedAddWidth?('width:' + selectWidth + ';'):'')
|
//+ ((!inDialog) ? 'margin-left:30px;':'') wangting 非弹窗是显示不对,去掉
|
+ (isNeedAddHeight?('height:' + selectHeight + ';'):'')
|
+ '" >'
|
,'<div class="'+ TITLE +'"><input type="text" name="' + selectNameText + '" placeholder="'+ placeholder +'" value=\''+ (value ? selected.html() : '') +'\' '+(tooltips?'lay-tooltips="'+tooltips+'" ':'')+ ((isSearch || isReferEditable || isComboxEditable) ? '' : 'readonly') +' class="layui-input'+ (isSearch ? '' : ' layui-unselect') + (disabled ? (' ' + DISABLED) : '') + (readOnly? ' layui-field-readonly ':'') + '" ' + (isNeedAddHeight?('style="height:' + selectHeight + ';"'):'') + '>'
|
//,((isRefer) ?(readOnly?'':'<i class="layui-search"></i><i class="layui-clear"></i></div>'):'<i class="layui-edge"></i></div>')
|
,(readOnly ?'':(isRefer?'<i class="layui-search"></i><i class="layui-clear"></i></div>':'<i class="layui-edge"></i></div>'))
|
,'<dl class="layui-anim layui-anim-upbit'+ (othis.find('optgroup')[0] ? ' layui-select-group' : '') +'">'+ function(options){
|
var arr = [];
|
layui.each(options, function(index, item){
|
if(index === 0 && !item.value){
|
arr.push('<dd lay-value="" class="layui-select-tips">'+ (item.innerHTML || TIPS) +'</dd>');
|
} else if(item.tagName.toLowerCase() === 'optgroup'){
|
arr.push('<dt>'+ item.label +'</dt>');
|
} else {
|
if($(item).attr('data-type')){
|
var dataType = $(item).attr('data-type')
|
arr.push('<dd lay-value="'+ item.value +'" data-type="'+dataType+'" class="'+ (value === item.value ? THIS : '') + (item.disabled ? (' '+DISABLED) : '') +'">'+ item.innerHTML +'</dd>');
|
}else{
|
arr.push('<dd lay-value="'+ item.value +'" class="'+ (value === item.value ? THIS : '') + (item.disabled ? (' '+DISABLED) : '') +'">'+ item.innerHTML +'</dd>');
|
}
|
|
}
|
});
|
arr.length === 0 && arr.push('<dd lay-value="" class="'+ DISABLED +'">没有选项</dd>');
|
return arr.join('');
|
}(othis.find('*')) +'</dl>'
|
,'</div>'].join(''));
|
|
hasRender[0] && hasRender.remove(); //如果已经渲染,则Rerender
|
othis.after(reElem);
|
events.call(this, reElem, disabled, isSearch);
|
});
|
}
|
//复选框/开关
|
,checkbox: function(){
|
var CLASS = {
|
checkbox: ['layui-form-checkbox', 'layui-form-checked', 'checkbox']
|
,_switch: ['layui-form-switch', 'layui-form-onswitch', 'switch']
|
}
|
,checks = elemForm.find('input[type=checkbox]')
|
|
,events = function(reElem, RE_CLASS){
|
var check = $(this);
|
|
//勾选
|
reElem.on('click', function(){
|
var checkFilter = check.attr('lay-filter') //获取过滤器
|
,text = (check.attr('lay-text')||'').split('|');
|
var skin = check.attr('lay-skin');
|
var isSwitch = false;
|
if(skin === 'switch'){
|
isSwitch = true;
|
}
|
|
if(check[0].disabled) return;
|
|
check[0].checked ? (
|
check[0].checked = false,
|
check.removeAttr('checked')
|
,reElem.removeClass(RE_CLASS[1]).find('em').text(text[1]),
|
(isSwitch?check[0].value='false':'')
|
) : (
|
check[0].checked = true,
|
check.attr('checked','checked')
|
,reElem.addClass(RE_CLASS[1]).find('em').text(text[0]),
|
(isSwitch?check[0].value='true':'')
|
);
|
|
layui.event.call(check[0], MOD_NAME, RE_CLASS[2]+'('+ checkFilter +')', {
|
elem: check[0]
|
,value: check[0].value
|
,othis: reElem
|
});
|
});
|
}
|
|
checks.each(function(index, check){
|
var othis = $(this), skin = othis.attr('lay-skin')
|
,text = (othis.attr('lay-text')||'').split('|'), disabled = this.disabled;
|
if(skin === 'switch') skin = '_'+skin;
|
var RE_CLASS = CLASS[skin] || CLASS.checkbox;
|
|
if(typeof othis.attr('lay-ignore') === 'string') return othis.show();
|
|
//替代元素
|
var hasRender = othis.next('.' + RE_CLASS[0]);
|
var reElem = $(['<div class="layui-unselect '+ RE_CLASS[0] + (
|
check.checked ? (' '+RE_CLASS[1]) : '') + (disabled ? ' layui-checkbox-disbaled '+DISABLED : '') +'" lay-skin="'+ (skin||'') +'">'
|
,{
|
_switch: '<em>'+ ((check.checked ? text[0] : text[1])||'') +'</em><i></i>'
|
}[skin] || ((check.title.replace(/\s/g, '') ? ('<span>'+ check.title +'</span>') : '') +'<i class="layui-icon">'+ (skin ? '' : '') +'</i>')
|
,'</div>'].join(''));
|
|
hasRender[0] && hasRender.remove(); //如果已经渲染,则Rerender
|
othis.after(reElem);
|
events.call(this, reElem, RE_CLASS);
|
});
|
}
|
//单选框
|
,radio: function(){
|
var CLASS = 'layui-form-radio', ICON = ['', '']
|
,radios = elemForm.find('input[type=radio]')
|
|
,events = function(reElem){
|
var radio = $(this), ANIM = 'layui-anim-scaleSpring';
|
|
reElem.on('click', function(){
|
var name = radio[0].name, forms = radio.parents(ELEM);
|
var radioFilter = radio.attr('lay-filter'); //获取过滤器
|
var sameRadio = forms.find('input[name='+ name.replace(/(\.|#|\[|\])/g, '\\$1') +']'); //找到相同name的兄弟
|
|
if(radio[0].disabled) return;
|
|
layui.each(sameRadio, function(){
|
var next = $(this).next('.'+CLASS);
|
this.checked = false;
|
$(this).removeAttr('checked')
|
next.removeClass(CLASS+'ed');
|
next.find('.layui-icon').removeClass(ANIM).html(ICON[1]);
|
});
|
|
radio[0].checked = true;
|
radio.attr('checked','checked')
|
reElem.addClass(CLASS+'ed');
|
reElem.find('.layui-icon').addClass(ANIM).html(ICON[0]);
|
|
layui.event.call(radio[0], MOD_NAME, 'radio('+ radioFilter +')', {
|
elem: radio[0]
|
,value: radio[0].value
|
,othis: reElem
|
});
|
});
|
};
|
|
radios.each(function(index, radio){
|
var othis = $(this), hasRender = othis.next('.' + CLASS), 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-disbaled '+DISABLED : '') +'">'
|
,'<i class="layui-anim layui-icon">'+ ICON[radio.checked ? 0 : 1] +'</i>'
|
,'<div>'+ function(){
|
var title = radio.title || '';
|
if(typeof othis.next().attr('lay-radio') === 'string'){
|
title = othis.next().html();
|
othis.next().remove();
|
}
|
return title
|
}() +'</div>'
|
,'</div>'].join(''));
|
|
othis.after(reElem);
|
events.call(this, reElem);
|
});
|
}
|
//文本输入框
|
,input:function () {
|
var inputs = elemForm.find('.layui-input[lay-tooltips],.layui-textarea[lay-tooltips]');
|
var events = function (reElem, tipsStr) {
|
var input = $(this);
|
//键盘事件
|
input.on('mouseenter', function (e) {
|
that.tooltips = layer.tips(tipsStr, this, {tips: [2,"#FF5722"], time: 0})
|
}).on('mouseleave', function (e) {
|
layer.close(that.tooltips)
|
});
|
}
|
|
inputs.each(function (index, input) {
|
var othis = $(this)
|
if (typeof othis.attr('lay-tooltips') === 'string') {
|
events.call(this, input, othis.attr('lay-tooltips'));
|
}
|
;
|
});
|
}
|
};
|
type ? (
|
items[type] ? items[type]() : hint.error('不支持的'+ type + '表单渲染')
|
) : layui.each(items, function(index, item){
|
item();
|
});
|
return that;
|
};
|
|
//weidy@2018-03-05 增加表单从后台加载或定义、设置值、获取值和验证的等方法
|
Form.prototype.showCheckboxCss = function(checkes,checkboxEl,checked){
|
if(checkes && checkboxEl){
|
var RE_CLASS = 'layui-form-checked';
|
if(checkes.disabled) return;
|
checked ? (
|
checkes.attr("checked",true)
|
,checkboxEl.addClass(RE_CLASS)
|
) : (
|
checkes.attr("checked",false)
|
,checkboxEl.removeClass(RE_CLASS)
|
);
|
}
|
};
|
//wangting@2021-10-31 增加表单从后台加载或定义、设置值、获取值和验证的等方法
|
Form.prototype.showRadioCss = function(checkes,checkboxEl,checked){
|
if(checkes && checkboxEl){
|
var RE_CLASS = 'layui-form-radioed';
|
var s_CLASS = "layui-anim-scaleSpring",i = ["", ""];
|
if(checkes.disabled) return;
|
checked ? (
|
checkes.attr("checked",true)
|
,checkboxEl.addClass(RE_CLASS).find(".layui-icon").addClass(s_CLASS).html(i[0])
|
) : (
|
checkes.attr("checked",false)
|
,checkboxEl.removeClass(RE_CLASS).find(".layui-icon").removeClass(s_CLASS).html(i[1])
|
);
|
}
|
};
|
//设置值的方法
|
Form.prototype.setValues = function(values,filter,onlyReplace){
|
var that = this;
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
var fieldElem = elemForm.find('input,select,textarea');
|
if(!that.formValues){
|
that.formValues = {};
|
}
|
//modify by weidy,不能设置values的值,否则参照的时候就会把以前缓存的值都清除
|
//在页面总是显示表单的时候,应该先clear后再添加
|
if(!onlyReplace){
|
that.formValues[filter] = values;
|
}
|
layui.each(fieldElem, function(_, item){
|
item.name = (item.name || '').replace(/^\s*|\s*&/, '');
|
|
if(!item.name) return;
|
|
//用于支持数组 name
|
if(/^.*\[\]$/.test(item.name)){
|
var key = item.name.match(/^(.*)\[\]$/g)[0];
|
nameIndex[key] = nameIndex[key] | 0;
|
item.name = item.name.replace(/^(.*)\[\]$/, '$1['+ (nameIndex[key]++) +']');
|
}
|
//weidy@2018-12-3 复选框也设置
|
// if(/^checkbox|radio$/.test(item.type) && !item.checked) return;
|
var name = item.name;
|
if(values && (name in values)){
|
if(values[name] == null){
|
values[name] = "";
|
}
|
if(item.type.indexOf("select")>-1){
|
//说明是下拉框
|
|
var showField = $(item).attr("lay-refer-showField");
|
if($webUtil.isNotNull(showField)){
|
var showValue = values[showField];
|
if($webUtil.isNull(showValue)){
|
showValue = '';
|
}
|
$(item).html('<option value=\'' + values[name] +'\' selected="selected">' + showValue + '</option>');
|
$(item).parent().find('input').val(showValue);
|
}else{
|
//显示下拉菜单的值
|
$(item).parent().find('input').val($(item).find("option[value='" + values[name] + "']").text());
|
}
|
$(item).val(values[name]);
|
//清除选择
|
$(item).find("option").prop("selected", false);
|
$(item).find("option[value='" + values[name] + "']").prop("selected", true);
|
}else if(item.type.indexOf("textarea")>-1){
|
$(item).val(values[name]);
|
$(item).text($(item).val());
|
}else if(item.type.indexOf("checkbox")> -1) {
|
//看看是不是switch\
|
if ("_switch" == $(item).next().attr("lay-skin")) {
|
//看看里面的值是什么
|
var checkedValue = $(item).attr("valueOnSelect");
|
var showText = $(item).attr("lay-text");
|
if ($webUtil.isNull(showText)) {
|
showText = "ON|OFF";
|
}
|
var switchShowTexts = showText.split('|');
|
if ((values[name] + '') == checkedValue) {
|
$(item).attr("checked", "checked");
|
$(item).next().addClass("layui-form-onswitch");
|
$(item).next().find("em").html(switchShowTexts[0]);
|
item.value = 'true'
|
} else {
|
$(item).next().removeClass("layui-form-onswitch");
|
$(item).next().find("em").html(switchShowTexts[1]);
|
$(item).attr("checked", "");
|
item.value = 'false'
|
}
|
} else {
|
//复选框
|
if ($(item).val() == values[name]) {
|
$(item).attr("checked", values[name]);
|
$(item).next().addClass("layui-form-checked");
|
} else {
|
$(item).removeAttr("checked");
|
$(item).next().removeClass("layui-form-checked");
|
}
|
}
|
}else if(item.type.indexOf("radio")> -1) {
|
if ($(item).val() == values[name]) {
|
$(item).attr("checked", values[name]);
|
$(item).next().find('.layui-icon').html('');
|
$(item).next().addClass("layui-form-radioed");
|
} else {
|
$(item).removeAttr("checked");
|
$(item).next().find('.layui-icon').html('');
|
$(item).next().removeClass("layui-form-radioed");
|
}
|
}else{
|
$(item).val(values[name]);
|
}
|
}
|
if(name.indexOf("[")>-1){
|
//说明是复选框
|
//需要获取其值是否被选中
|
var itemName = name.substring(0,name.indexOf("["));
|
var needValue = name.substring(name.indexOf("[") + 1,name.indexOf("]"));
|
if(values[itemName]){
|
var valueArray = values[itemName].split(',');
|
if($webUtil.inArray(valueArray,needValue)){
|
$(item).attr("checked", "checked");
|
$(item).next().addClass("layui-form-checked");
|
}
|
}
|
}
|
});
|
};
|
|
//获取值的方法
|
Form.prototype.getValues = function(filter,hasCacheValue){
|
var that = this;
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
var fieldElem = elemForm.find('input,select,textarea');
|
var values = '';
|
if(that.formValues){
|
values = that.formValues[filter]
|
}else{
|
values = '';
|
}
|
if(!values || !hasCacheValue){
|
values = {};
|
}
|
var hasCheckNames = [];
|
layui.each(fieldElem, function(_, item){
|
/*item.name = (item.name || '').replace(/^\s*|\s*&/, '');
|
|
if(!item.name) return;
|
|
//用于支持数组 name
|
if(/^.*\[\]$/.test(item.name)){
|
var key = item.name.match(/^(.*)\[\]$/g)[0];
|
nameIndex[key] = nameIndex[key] | 0;
|
item.name = item.name.replace(/^(.*)\[\]$/, '$1['+ (nameIndex[key]++) +']');
|
}item.name.indexOf
|
|
if(/^checkbox|radio$/.test(item.type) && !item.checked) return;
|
values[item.name] = item.value;*/
|
if(item.name.indexOf("[")>-1){
|
hasCheckNames.push(item.name);
|
}
|
if(item.type=='radio'){
|
values[item.name]=$(":radio[name='"+item.name+"']:checked",elemForm).val()
|
}else{
|
that.getValueByItem(item,values);
|
}
|
|
});
|
//执行完成后了,去查询复选框
|
//复选框可能一个都没有选择。那需要判断这个
|
if(hasCheckNames.length>0){
|
for(var index=0 ; index< hasCheckNames.length;index++){
|
var itemName = hasCheckNames[index].substring(0, hasCheckNames[index].indexOf("["));
|
if(itemName in values) {
|
delete values[itemName];
|
}
|
}
|
}
|
var checkboxKey = [];
|
for(var key in values) {
|
if (key.indexOf("[") > -1) {
|
//说明可能是复选框
|
var valueOld = values[key];
|
var itemName = key.substring(0, key.indexOf("["));
|
if (!$webUtil.inArray(checkboxKey, itemName)) {
|
checkboxKey.push(itemName);
|
}
|
var value = key.substring(key.indexOf("[") + 1, key.indexOf("]"));
|
if (valueOld == "on") {
|
if (itemName in values && values[itemName] != null) {
|
values[itemName] = values[itemName] + "," + value;
|
} else {
|
values[itemName] = value;
|
}
|
} else {
|
if (itemName in values && values[itemName] != null) {
|
values[itemName] = values[itemName] + (valueOld?("," + valueOld):'');
|
} else {
|
values[itemName] = valueOld;
|
}
|
}
|
delete values[key];
|
}
|
if(key=='data' && $webUtil.isNull(values[key])){
|
delete values[key];
|
}
|
}
|
return values;
|
};
|
Form.prototype.btmDefaultKeys = ['oid', 'id', 'name', 'description', 'revisionoid', 'nameoid', 'btmname', 'lastr', 'firstr', 'lastv', 'firstv', 'creator', 'createtime', 'lastModifier', 'lastmodifytime', 'revisionrule', 'revisionseq', 'revisionvalue', 'versionrule', 'versionseq', 'versionvalue', 'lcstatus', 'ts', 'owner', 'checkinby', 'checkintime', 'checkoutby', 'checkouttime', 'copyfromversion', 'secretgrade'];
|
Form.prototype.linkDefaultKeys = ['oid','creator','createtime','lastmodifier','lastmodifytime','f_oid','foid','f_revisionoid','frevisionoid','f_nameoid','fnameoid','f_btmname','fbtmname','t_oid','toid','t_revisionoid','trevisionoid','t_nameoid','tnameoid','t_btmname','tbtmname','ts'];
|
|
//wangting 2021-3-17
|
//将值拆分成默认属性和非默认属性两部分
|
Form.prototype.getDefaultValues = function (filter,hasCacheValue,keys) {
|
var that = this;
|
var values = that.getValues(filter, hasCacheValue);
|
var defaultKeys = keys;
|
if (!defaultKeys) {
|
defaultKeys = that.btmDefaultKeys;
|
}
|
var defaultValues = {}, otherValue = {};
|
var indexofkey='';
|
if(device.ie && device.ie < 10){
|
defaultKeys.push('--');
|
defaultKeys=defaultKeys.join('--');
|
indexofkey='--';
|
}
|
for (var key in values) {
|
if (defaultKeys.indexOf(key.toLowerCase()+indexofkey) > -1) {
|
defaultValues[key] = values[key];
|
} else {
|
otherValue[key] = values[key];
|
}
|
}
|
return {
|
defaultValues:defaultValues,
|
otherValue:otherValue
|
}
|
}
|
|
Form.prototype.getValueByItem = function(item,values) {
|
var that = this;
|
var thisItemValue = that.getValueByEl(item);
|
if (typeof (thisItemValue) != "string" && thisItemValue == false) {
|
return false;
|
}
|
values[item.name] = thisItemValue;
|
//如果是参照的
|
var showField = $(item).attr("lay-refer-showField");
|
if ($webUtil.isNotNull(showField)) {
|
if ($webUtil.isNull(thisItemValue)) {
|
var referConfig = eval("(" + $(item).attr("lay-refer") + ")");
|
if (referConfig.editable) {
|
//说明可编辑的,在空的时候获取输入的值
|
values[item.name] = $(item).next().find('input').val();
|
values[showField] = values[item.name];
|
} else {
|
values[showField] = $(item).find('option:selected').text();
|
}
|
} else {
|
values[showField] = $(item).find('option:selected').text();
|
}
|
}
|
};
|
Form.prototype.getValueByEl = function(item) {
|
item.name = (item.name || '').replace(/^\s*|\s*&/, '');
|
|
if (!item.name) return false;
|
|
//用于支持数组 name
|
if (/^.*\[\]$/.test(item.name)) {
|
var key = item.name.match(/^(.*)\[\]$/g)[0];
|
nameIndex[key] = nameIndex[key] | 0;
|
item.name = item.name.replace(/^(.*)\[\]$/, '$1[' + (nameIndex[key]++) + ']');
|
}
|
|
if (/^checkbox|radio$/.test(item.type)) {
|
//看看是不是开关
|
var skin = $(item).attr("lay-skin");
|
if (skin === 'switch') {
|
return item.value;
|
} else {
|
if (item.checked) {
|
return item.value;
|
} else {
|
return '';
|
}
|
}
|
}
|
return item.value;
|
};
|
|
//验证是否通过
|
Form.prototype.validata = function(filter,verify) {
|
var that = this;
|
var elemForm = $(ELEM + function () {
|
return filter ? ('[lay-filter="' + filter + '"]') : '';
|
}());
|
//var fieldElem = elemForm.find('input,select,textarea');
|
if (!verify) {
|
verify = form.config.verify;
|
}
|
var stop = null;
|
var DANGER = 'layui-form-danger';
|
//获取所有含有lay-verify标记的字段
|
var verifyElem =$('*[lay-verify][type!="radio"][type!="checkbox"],*[lay-verify-div][lay-combox-type="radio"],*[lay-verify-div][lay-combox-type="checkbox"]',elemForm)
|
|
layui.each(verifyElem, function (_, item) {
|
var othis = $(this);
|
var vers,verText,verType,values={},value
|
if(othis.attr('lay-combox-type')=='radio'){
|
vers = othis.attr('lay-verify-div').split('|')
|
verText = othis.attr("lay-vertext-div")
|
values[othis.attr('lay-combox-name')]=$("input[name='"+othis.attr('lay-combox-name')+"']:checked",othis).val();
|
value = values[othis.attr('lay-combox-name')];
|
}else if(othis.attr('lay-combox-type')=='checkbox'){
|
vers = othis.attr('lay-verify-div').split('|')
|
verText = othis.attr("lay-vertext-div");
|
values[othis.attr('lay-combox-name')]=$("input[type='checkbox']:checked",othis).val();
|
value = values[othis.attr('lay-combox-name')];
|
}else {
|
vers = othis.attr('lay-verify').split('|')
|
verType = othis.attr('lay-verType') //提示方式,
|
verText = othis.attr("lay-vertext")
|
that.getValueByItem(item, values);
|
value = values[item.name];
|
}
|
|
|
if (value == undefined) {
|
value = "";
|
}
|
othis.removeClass(DANGER);
|
layui.each(vers, function (_, thisVer) {
|
var isTrue //是否命中校验
|
, errorText = '' //错误提示文本
|
, isFn = typeof verify[thisVer] === 'function';
|
|
//匹配验证规则
|
if (verify[thisVer]) {
|
var isTrue = isFn ? errorText = verify[thisVer](value, item) : !verify[thisVer][0].test(value);
|
errorText = errorText || verify[thisVer][1];
|
if (layui.util.isNotNull(verText) && 'undefined' != verText) errorText = verText; //从定义的内容上获取
|
//weidy@2018-03-05.把字段的名称也加上
|
else if (othis.parent() && othis.parent().parent() && othis.parent().parent().children('label')) {
|
var fieldText=''
|
if(othis.attr('lay-verify-div')){
|
fieldText = othis.prev().html();
|
}else{
|
fieldText = othis.parent().prev().html();
|
}
|
|
if (fieldText != undefined) {
|
// if(fieldText != ''){
|
fieldText = fieldText.replace(":", "");
|
errorText = "(" + fieldText + ")" + errorText;
|
}
|
}
|
//如果是必填项或者非空命中校验,则阻止提交,弹出提示
|
if (isTrue) {
|
//提示层风格
|
if (verType === 'tips') {
|
layer.tips(errorText, function () {
|
if (typeof othis.attr('lay-ignore') !== 'string') {
|
if (item.tagName.toLowerCase() === 'select' || /^checkbox|radio$/.test(item.type)) {
|
return othis.next();
|
}
|
}
|
return othis;
|
}(), {tips: 1});
|
} else if (verType === 'alert') {
|
layer.alert(errorText, {title: '提示', shadeClose: true});
|
} else {
|
layer.msg(errorText, {icon: 5, shift: 6});
|
}
|
if (!device.android && !device.ios) item.focus(); //非移动设备自动定位焦点
|
othis.addClass(DANGER);
|
return stop = true;
|
}
|
}
|
});
|
if (stop) return stop;
|
});
|
|
if (stop) {
|
return false;
|
} else {
|
return true;
|
}
|
};
|
|
//加载数据
|
Form.prototype.load = function(filter,options){
|
var that = this;
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
if(options){
|
if(options.url){
|
//说明是通过后台的url来加载值
|
$webUtil.ajax(options.method?options.method:'post',options.url,options.params?options.params:{},function(result){
|
if(options.successParam?result[options.successParam]: result.success){
|
if(options.setValueListener){
|
options.setValueListener(result.obj,filter);
|
}else {
|
that.setValues(options.dataParam ? result[options.dataParam] : result.obj, filter);
|
}
|
if(options.callback){
|
options.callback(result.obj,filter);
|
}
|
}
|
},function (xhr,error) {
|
$webUtil.showErrorMsg("加载表单的数据的时候出现了错误,可能是连不上服务器");
|
},options.backPath?options.backPath:null,options.noProgress);
|
}else if(options.data){
|
that.setValues(options.data, filter);
|
if(options.callback){
|
options.callback();
|
}
|
}
|
}
|
};
|
//清除所有的值
|
Form.prototype.clear = function(filter,isUseDefaultValue){
|
var that = this;
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
var fieldElem = elemForm.find('input,select,textarea');
|
layui.each(fieldElem, function(_, item){
|
item.name = (item.name || '').replace(/^\s*|\s*&/, '');
|
|
if(!item.name) return;
|
|
//用于支持数组 name
|
if(/^.*\[\]$/.test(item.name)){
|
var key = item.name.match(/^(.*)\[\]$/g)[0];
|
nameIndex[key] = nameIndex[key] | 0;
|
item.name = item.name.replace(/^(.*)\[\]$/, '$1['+ (nameIndex[key]++) +']');
|
}
|
|
if(/^checkbox|radio$/.test(item.type) && !item.checked) return;
|
if(isUseDefaultValue || $webUtil.inArray(isUseDefaultValue,item.name)){
|
item.value = that.getDefaultValue(filter,item.name);
|
}else{
|
item.value = "";
|
}
|
var refer = $(item).attr("lay-refer");
|
if($webUtil.isNotNull(refer)) {
|
//说明是refer
|
var vciRefer = layui.vciWebRefer;
|
var thisReferName = $(item).attr("name");
|
var values ={};
|
values[thisReferName] = '';
|
that.setValues(values,filter);
|
vciRefer.clearValue(filter, thisReferName);
|
}
|
});
|
};
|
|
|
|
//设置默认值,
|
Form.prototype.setDefaultValue=function(filter,defaultValueObject){
|
var that = this;
|
//如果defaultValueObject 不是一个数组,则添加为数组
|
if(!defaultValueObject){
|
return;
|
}
|
if(!$webUtil.isArray(defaultValueObject)){
|
defaultValueObject = [defaultValueObject];
|
}
|
if(!that.formDefaultValueMap){
|
that.formDefaultValueMap = {};
|
layui.each(defaultValueObject,function(_index,item){
|
that.formDefaultValueMap[filter + "_" + item.name] = item.value;
|
});
|
}
|
};
|
|
//获取默认值
|
Form.prototype.getDefaultValue = function(filter,name){
|
var that = this;
|
if(!that.formDefaultValueMap){
|
return '';
|
}else{
|
return that.formDefaultValueMap[filter + "_" + name];
|
}
|
};
|
|
//表单提交
|
Form.prototype.submit=function(filter,options){
|
var that = this;
|
if(!options){
|
options = {};
|
}
|
if(options.onSubmit){
|
if(!options.onSubmit()){
|
return;
|
}
|
}else{
|
if(!that.validata(filter, options.verify?options.verify:{})){
|
return;
|
}
|
}
|
if(options.url){
|
var values = that.getValues(filter);
|
var submitValues = {};
|
for(var key in values){
|
var paramPrefix = "";
|
if(options.paramPrefix){
|
paramPrefix = options.paramPrefix;
|
}
|
var param = paramPrefix;
|
if(options.paramMap && key in options.paramMap){
|
param += options.paramMap[key];
|
}else{
|
param += key;
|
}
|
submitValues[param] = values[key];
|
}
|
if(options.extraParams){
|
for(var key in options.extraParams){
|
submitValues[key] = options.extraParams[key];
|
}
|
}
|
$webUtil.post(url,submitValues,function(result){
|
if(options.successParam?result[options.successParam]: result.success){
|
if(options.clearOnSuccess){
|
that.clear(filter, options.clearUseDefault?options.clearUseDefault:false);
|
}
|
if(options.callback){
|
options.callback();
|
}
|
}
|
});
|
}
|
};
|
//设置字段只读/取消只读
|
Form.prototype.setReadOnly=function(filter,readOnly,fileds){
|
var that = this;
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
var fieldElem = elemForm.find('input,select,textarea');
|
layui.each(fieldElem, function(_, item){
|
item.name = (item.name || '').replace(/^\s*|\s*&/, '');
|
|
if(!item.name) return;
|
|
//用于支持数组 name
|
if(/^.*\[\]$/.test(item.name)){
|
var key = item.name.match(/^(.*)\[\]$/g)[0];
|
nameIndex[key] = nameIndex[key] | 0;
|
item.name = item.name.replace(/^(.*)\[\]$/, '$1['+ (nameIndex[key]++) +']');
|
}
|
|
if(/^checkbox|radio$/.test(item.type) && !item.checked) return;
|
if(!fileds || (fields && $webUtil.inArray(fields,item.name))){
|
if(readOnly){
|
$(item).addClass('layui-field-readonly');
|
$(item).attr('readOnly','readOnly');
|
//设置readOnly
|
}else{
|
//所有的去除readOnly
|
$(item).removeClass("layui-field-readonly");
|
$(item).attr('readOnly',null);
|
}
|
}
|
});
|
};
|
|
//设置字段的配置
|
Form.prototype.setElementConfig = function(filter,config){
|
//defaultColumnOneRow:1, 默认每行有多少个字段
|
//defaultLabelWidth:120,//字段的标签的宽度
|
//defaultInputWidth:170,//字段的文本框宽度
|
//defaultLabelAlign:'right'//字段的对齐方式
|
var that = this;
|
config = $.extend({},that.elementConfig['defaultConfig'],config);
|
that.elementConfig[filter] = config;
|
};
|
|
Form.prototype.getElementConfig = function(filter){
|
var that = this;
|
if(filter in that.elementConfig){
|
return that.elementConfig[filter];
|
}else{
|
return that.elementConfig['defaultConfig'];
|
}
|
};
|
|
|
//添加字段
|
Form.prototype.addItems = function(filter,items,callback,sourceData,config,isAppend){
|
var that = this;
|
that.sourceDataOfAddItem = sourceData;
|
that.isAppendOfAddItem = isAppend;
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
if(!config){
|
config = {
|
defaultColumnOneRow:1,
|
inDialog:true
|
};
|
}
|
if(!("inDialog" in config)){
|
config['inDialog'] =true;
|
}
|
if(config){//设置布局
|
that.setElementConfig(filter,config);
|
}
|
config = that.getElementConfig(filter);
|
if(!items){
|
return ;
|
}
|
if(!$webUtil.isArray(items)){
|
items = [items];
|
}
|
//defaultColumnOneRow:1, 默认每行有多少个字段
|
//defaultLabelWidth:120,//字段的标签的宽度
|
//defaultInputWidth:170,//字段的文本框宽度
|
//defaultLabelAlign:'right'//字段的对齐方式
|
//添加字段
|
var colsCount =config.defaultColumnOneRow*1;
|
if(colsCount<1){
|
colsCount = 1;
|
}
|
var currentCol = 0;
|
var itemsHtml ="";
|
var allDefaultValue = {};
|
var allAjaxItems =[];
|
var allFinishAjaxCount = 0;
|
var allDateItems = [];
|
var allRateItems = [];
|
layui.each(items,function(_index,item) {
|
if(!("readOnly" in item) && config.readOnly){
|
//设置的全部都是只读
|
item.readOnly = true;
|
}
|
var isUseAllWidth = false;
|
var isNewRow = item.isNewRow;
|
//类型
|
if (!item.type) {
|
item.type = "text";
|
}
|
item.type = item.type.toLocaleLowerCase();
|
if (item.field && !item.name) item.name = item.field;
|
if (item.key && !item.name) item.name = item.key;
|
if ($webUtil.inArray(['textarea', 'note', '5'], item.type) || item.useAllWidth) {
|
isUseAllWidth = true;
|
}
|
if($webUtil.inArray(['line'],item.type)){
|
isNewRow = true;
|
isUseAllWidth = true;
|
}
|
if (currentCol == 0 || isUseAllWidth || isNewRow ) {
|
if ((isNewRow || isUseAllWidth) && itemsHtml!='') {
|
itemsHtml += '</div>';
|
currentCol = 0;
|
}
|
itemsHtml += '<div class="layui-form-item">';
|
}
|
|
var name = $webUtil.getValueFromObj(item, ['name', 'field', 'key']);//name
|
item.name = name;
|
itemsHtml += that.getElementHtml(filter,item, config, sourceData);
|
if ($webUtil.inArray(['combox', 'select', 'combobox', '3'], item.type)) {
|
item.type = "combox";
|
var enumKey = $webUtil.getValueFromObj(item, ['comboxKey', 'comboxField', 'enumKey', 'enumField'], name);
|
item.comboxKey = enumKey;
|
allAjaxItems.push(item);
|
} else if ($webUtil.inArray(['date', 'datetime', 'time'], item.type)) {
|
//日期时间
|
if (!item.name) {
|
item.name = item.field || item.key;
|
}
|
allDateItems.push(item);
|
} else if ($webUtil.inArray(['rate'], item.type)) {
|
//日期时间
|
if (!item.name) {
|
item.name = item.field || item.key;
|
}
|
allRateItems.push(item);
|
}else if($webUtil.inArray(['refer','combotree'],item.type)){
|
that.referFieldsMap[filter + "${refer}" + name] = item;
|
}else if ($webUtil.inArray(['radio', 'checkbox'], item.type)) {
|
if (!item.name) {
|
item.name = item.field || item.key;
|
}
|
allAjaxItems.push(item);
|
}
|
|
//默认值
|
if (item.defaultValue) {
|
var tv = $webUtil.getDefaultValue(item.defaultValue, sourceData);
|
if (!tv) {
|
tv = '';
|
}
|
allDefaultValue[name] = tv;
|
}
|
var hidden = $webUtil.getBoolean($webUtil.getValueFromObj(item,['hidden','ishidden']));//是否隐藏
|
// wangting 隐藏列不计数
|
if(hidden){
|
currentCol--;
|
}
|
//if (!hidden) {
|
if (currentCol == colsCount - 1 || isUseAllWidth || isNewRow) {
|
itemsHtml += '</div>';
|
currentCol = 0;
|
} else {
|
currentCol++;
|
}
|
//}
|
});
|
if(isAppend){
|
elemForm.append(itemsHtml);
|
var hasedItems = that.fieldsMap[filter];
|
if(!hasedItems){
|
hasedItems = [];
|
}
|
for(var i = 0 ;i < items.length ;i ++){
|
hasedItems.push(items[i]);
|
}
|
that.fieldsMap[filter] = hasedItems;
|
}else{
|
that.fieldsMap[filter] = items;
|
elemForm.html(itemsHtml);
|
}
|
//weidy@2018-10-20 当只有一个input的时候,点击回车键就会出现刷新页面的情况,因此添加一个隐藏的input
|
elemForm.prepend('<input id="hiddenText" type="text" style="display:none" />');
|
if(allDateItems.length > 0){
|
//处理时间和日期的字段
|
var laydate = layui.laydate;
|
for(var i = 0 ; i < allDateItems.length ; i ++){
|
var item = allDateItems[i];
|
var format=item.format||item.dateFormate||'yyyy-MM-dd'
|
laydate.render({
|
elem:'[lay-filter="' + filter +'"] input[name="' + item.name + '"]',
|
type:item.type,
|
value:$webUtil.formateDateByFormate(item.value,format),
|
ready:item.ready,
|
name:item.name,
|
// format:item.format?item.format:'yyyy-MM-dd HH:mm:ss',
|
format:format,
|
done:function(value){
|
layui.event.call(this, MOD_NAME, 'select('+ filter +')', {
|
elem: this
|
,type: 'date'
|
,name:this.name
|
,value: value
|
});
|
}
|
});
|
}
|
}
|
if(allRateItems.length > 0){
|
//处理时间和日期的字段
|
var layrate = layui.rate;
|
for(var i = 0 ; i < allRateItems.length ; i ++){
|
var item = allRateItems[i];
|
var className = item.name;
|
layrate.render({
|
elem: '[lay-filter="' + filter +'"] div[name="' + item.name + '"]',
|
length: 5, //星星个数
|
value: 3, //初始化值
|
theme: '#000099', //颜色
|
half: false, //支持半颗星
|
text: false, //显示文本,默认显示 '3.5星'
|
readOnly: false, //只读
|
setText: function (value) {
|
$("."+className).attr("data-value",value)
|
}
|
});
|
}
|
}
|
if(allAjaxItems.length > 0 ){
|
var combox = layui.vciWebComboxStore;
|
for(var i = 0 ; i < allAjaxItems.length; i ++){
|
var item = allAjaxItems[i];
|
if(item.type == 'combox'||item.type == 'checkbox'||item.type == 'radio'){
|
var options = {
|
callback:function(comboxKey,data,allData) {
|
//给下拉菜单设置内容
|
var selectElem = elemForm.find("[lay-combox='" + comboxKey + "']");
|
selectElem.data(comboxKey,allData)
|
var optionsHtml =[];
|
var secretgrade = null;
|
if (sourceData) {
|
secretgrade = sourceData.secretgrade;
|
}
|
var i = 0;
|
if (selectElem.attr("lay-combox-type") == 'checkbox') {
|
selectElem.html(optionsHtml);
|
var name = selectElem.attr("lay-combox-name");
|
var readOnly = selectElem.attr("readOnly");
|
for(var key in data){
|
optionsHtml.push($( '<input type="checkbox" name="' + name +'[' + key + ']" value="' + key + '" title="' +data[key] +'" '
|
+ (readOnly="readOnly"?(' readOnly="readOnly" class="layui-field-readonly" '):'') + ' />').data('attributes',allData && allData[i]&&allData[i].attributes||{}));
|
i++;
|
}
|
selectElem.empty().append(optionsHtml);
|
} else if (selectElem.attr("lay-combox-type") == 'radio') {
|
var name = selectElem.attr("lay-combox-name");
|
var readOnly = selectElem.attr("readOnly");
|
var selectedOption = '';
|
for(var key in data){
|
if (key == secretgrade) {
|
selectedOption = "checked"
|
} else if (key == item.defaultKey) {
|
selectedOption = "checked"
|
} else if (key == item.defaultValue) {
|
selectedOption = "checked"
|
} else if (i === 0) {
|
selectedOption = "checked"
|
} else {
|
selectedOption = ""
|
}
|
optionsHtml.push($( '<input type="radio" name="' + name +'" value="' + key + '" title="' +data[key] +'" '+ selectedOption
|
+ ' lay-filter="' + selectElem.attr("lay-filter-div") + '" '
|
+ ' lay-verify="' + selectElem.attr("lay-verify-div") + '" '
|
+ ($webUtil.isNotNull(selectElem.attr("lay-vertext-div"))?' lay-vertext="' + selectElem.attr("lay-vertext-div") + '" ':'')
|
+ (readOnly="readOnly"?(' readOnly="readOnly" class="layui-field-readonly" '):'') + ' />').data('attributes',allData && allData[i]&&allData[i].attributes||{}));
|
i++;
|
selectedOption = "";
|
}
|
selectElem.empty().append(optionsHtml);
|
} else {
|
//combox
|
optionsHtml =[$('<option value=""></option>')];
|
var selectedOption = '';
|
for (var key in data) {
|
if (key == secretgrade) {
|
selectedOption = "selected"
|
} else if (key == item.defaultKey) {
|
selectedOption = "selected"
|
} else if (key == item.defaultValue) {
|
selectedOption = "selected"
|
} else if (i === 0) {
|
selectedOption = "selected"
|
} else {
|
selectedOption = ""
|
}
|
if (item.unneedselect) {
|
selectedOption = ""
|
}
|
optionsHtml.push($('<option value="' + key + '" '+selectedOption+'>' + data[key] + '</option>').data('attributes',allData && allData[i]&&allData[i].attributes||{}));
|
i++;
|
selectedOption = "";
|
}
|
selectElem.empty().append(optionsHtml);
|
}
|
allFinishAjaxCount++;
|
if (allFinishAjaxCount == allAjaxItems.length) {
|
that.render(null, filter);
|
that.setValues(allDefaultValue, filter);
|
if (callback) {
|
callback(elemForm);
|
}
|
}
|
},
|
failCallback:function(comboxKey,msg){
|
var selectElem = elemForm.find("[lay-combox='" + comboxKey +"']");
|
selectElem.html(msg);
|
allFinishAjaxCount++;
|
if(allFinishAjaxCount == allAjaxItems.length){
|
if(callback){
|
callback(elemForm);
|
}
|
}
|
},
|
extraParams:item.extraParams
|
};
|
if("data" in item && $webUtil.isNotNull(item.data)){
|
options['data'] = item['data'];
|
}else{
|
if("url" in item){
|
options['url'] = item['url'];
|
}else{
|
options['url'] = "default";
|
}
|
}
|
if("backPath" in item){
|
options['backPath'] = item['backPath'];
|
}
|
if($webUtil.getBoolean($webUtil.getValueFromObj(item,['reloadCombox','reloadEnum'],false))){
|
combox.newCombox(item.comboxKey,options,true);
|
}else{
|
combox.newCombox(item.comboxKey,options,false);
|
}
|
}else {
|
|
}
|
}
|
}
|
else{
|
that.render(null,filter);
|
that.setValues(allDefaultValue,filter);
|
if(callback){
|
that.callbackOfAddItem = callback;
|
callback(elemForm);
|
}
|
}
|
};
|
Form.prototype.getFormItems = function(filter){
|
//获取原本
|
var that = this;
|
if(that.fieldsMap && filter in that.fieldsMap){
|
return that.fieldsMap[filter];
|
}
|
return null;
|
};
|
Form.prototype.changeItems = function(filter,items,beforeItems){
|
//需要多传一个原始的字段 beforeItems 修改的items需要将参数写全
|
//调整字段的配置等内容
|
var that = this;
|
var formValues = that.getValues(filter,true);
|
if(!beforeItems){
|
beforeItems = that.getFormItems(filter);
|
}
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
var config = that.getElementConfig(filter);
|
if(!items){
|
return ;
|
}
|
if(!$webUtil.isArray(items)){
|
items = [items];
|
}
|
var combox = layui.vciWebComboxStore;
|
//defaultColumnOneRow:1, 默认每行有多少个字段
|
//defaultLabelWidth:120,//字段的标签的宽度
|
//defaultInputWidth:170,//字段的文本框宽度
|
//defaultLabelAlign:'right'//字段的对齐方式
|
|
//修改字段----注意只能修改字段的配置项,包括下拉菜单,和参照;
|
layui.each(items,function(_index,item){
|
//类型
|
if(!item.type){
|
item.type = "text";
|
}
|
//item.name = item.name.trim();
|
item.type = item.type.toLocaleLowerCase();
|
var el = elemForm.find('[lay-filter="' + (item.name || item.field) + '"]');
|
if($webUtil.inArray(['combox','select','combobox','3'], item.type)){
|
//下拉菜单,可以修改enumKey和选择内容
|
var enumKey = $webUtil.getValueFromObj(item,['comboxKey','comboxField','enumKey','enumField'],name);//下拉菜单的编号
|
if(el && enumKey ){
|
el.attr("lay-combox",enumKey);
|
}
|
if(item.data || item.url || item.reloadCombox){
|
combox.reload(enumKey,item);
|
}
|
}else if($webUtil.inArray(['refer','combotree'],item.type)){
|
if(el && item.showField){
|
el.attr("lay-refer-showField",item.showField);
|
}else if(el &&item.referConfig){
|
var name = $webUtil.getValueFromObj(item, ['name', 'field', 'key']);//name
|
var referConfig = item.referConfig;
|
var vciRefer = layui.vciWebRefer;
|
var oldReferConfig = vciRefer.getReferConfig(filter,name);
|
oldReferConfig = $.extend(oldReferConfig,referConfig);
|
vciRefer.newRefer(filter, name, el, oldReferConfig);
|
}
|
}
|
});
|
layui.each(beforeItems,function(bindex,bitem){
|
layui.each(items,function(_index,item){
|
if((bitem.name || bitem.field) == (item.name || item.field)){
|
bitem = $.extend(bitem,item);
|
//beforeItems.splice(bindex,1,bitem);//将字段变为最新的
|
}
|
})
|
});
|
that.addItems(filter,beforeItems,that.callbackOfAddItem,that.sourceDataOfAddItem,config,that.isAppendOfAddItem);
|
that.setValues(formValues,filter);
|
//that.render(null,filter);
|
};
|
|
Form.prototype.removeItems = function(filter,items,isAll){
|
var that = this;
|
var elemForm = $(ELEM + function(){
|
return filter ? ('[lay-filter="' + filter +'"]') : '';
|
}());
|
var config = that.getElementConfig(filter);
|
if(!items && !isAll){
|
return ;
|
}
|
if(items && !$webUtil.isArray(items)){
|
items = [items];
|
}
|
if(isAll){
|
items = that.fieldsMap[filter];
|
}
|
var combox = layui.vciWebComboxStore;
|
var refer = layui.vciWebRefer;
|
layui.each(items,function(_index,item){
|
//类型
|
if(!item.type){
|
item.type = "text";
|
}
|
item.name = item.name.trim();
|
item.type = item.type.toLocaleLowerCase();
|
var el = elemForm.find('[lay-filter="' + item.name + '"]');
|
var enumKey = el.attr("lay-combox");
|
if($webUtil.isNotNull(enumKey)){
|
//说明是枚举
|
combox.destory(enumKey);
|
}
|
var referConfig = el.attr("lay-refer");
|
if($webUtil.isNotNull(referConfig)){
|
//说明是参照
|
refer.destory(filter,item.name);
|
}
|
if(!isAll){
|
$webUtil.removeFormArray(that.fieldsMap[filter],item,"name");
|
}
|
el.remove();
|
});
|
if(isAll){
|
delete that.fieldsMap[filter];
|
elemForm.html("");
|
}
|
};
|
|
Form.prototype.getElementHtml = function(filter,item,config,sourceData){
|
var that = this;
|
//字段名称
|
var name = $webUtil.getValueFromObj(item,['name','field','key']).trim();//name
|
var title = $webUtil.getValueFromObj(item,['text','title']);//字段名称
|
var titleColor = $webUtil.getValueFromObj(item,['titleColor','labelColor']);//字段颜色
|
var titleWidth = $webUtil.getValueFromObj(item,['titleWidth','labelWidth'],config.labelWidth?config.labelWidth:config.defaultLabelWidth);//字段宽度
|
var titleAlign = $webUtil.getValueFromObj(item,['titleAlign','labelAlign'],config.labelAlign?config.labelAlign:config.defaultLabelAlign);//字段对齐方式
|
var titleHidden = $webUtil.getBoolean($webUtil.getValueFromObj(item,['hideTitle','hideLabel','hideFieldLabel'],false));//字段对齐方式
|
var fieldIsNotNull = $webUtil.getBoolean($webUtil.getValueFromObj(item,['required','notNull','fieldNotNull'],false));//字段是否可以为空
|
var keyField = $webUtil.getBoolean($webUtil.getValueFromObj(item,['keyAttr'],false));
|
var emptyText = $webUtil.getValueFromObj(item,['emptyTitle','emptyText','fieldEmptyText','fieldEmptyAlertText']);//字段为空时的提示语句
|
|
var textWidth = $webUtil.getValueFromObj(item,['textWidth','inputWidth'],config.textWidth?config.textWidth:config.defaultInputWidth);//文本宽度
|
var textStyle = $webUtil.getValueFromObj(item,['textStyle','inputStyle'],config.textStyle?config.textStyle:'');//文本样式
|
var readOnly = $webUtil.getBoolean($webUtil.getValueFromObj(item,['readOnly','readonly','isDisable','disabled'],false));
|
var placeholder = $webUtil.getValueFromObj(item,['placeholder','tiptext']);//字段提示信息
|
var customLabelCss = $webUtil.getValueFromObj(item,['customLabelCss','customTitleCss']);//自定义字段名称的css
|
var customTextCss = $webUtil.getValueFromObj(item,['customTextCss']);//自定义字段的css
|
var validateRule = $webUtil.getValueFromObj(item,['verify','validateRule']);//自定义校验规则
|
var hidden = $webUtil.getBoolean($webUtil.getValueFromObj(item,['hidden','ishidden'],false));//是否隐藏
|
var search = $webUtil.getBoolean($webUtil.getValueFromObj(item,['search','laysearch'],false));//下拉框是否可搜索
|
var tooltips = $webUtil.getValueFromObj(item,['tooltips']);//提示信息
|
|
|
var titleStyle = $webUtil.getValueFromObj(item,['titleStyle','labelStyle'],"");
|
var baseStyle='margin-left: 130px;margin-right:5px;';
|
if($webUtil.isNotNull(titleStyle) && !$webUtil.endWith(titleStyle,";")){
|
titleStyle = titleStyle + ";";
|
}
|
if($webUtil.isNotNull(titleColor)){
|
titleStyle = 'color:' + titleColor + ';';
|
}
|
if($webUtil.isNotNull(titleWidth) || titleWidth >0){
|
titleStyle += 'width:' + titleWidth*1 +'px;';
|
baseStyle='margin-left:' + (titleWidth*1+30) +'px;';
|
}
|
if($webUtil.isNotNull(titleAlign) && $webUtil.inArray(['left','right','center'],titleAlign)){//只支持左对齐和右对齐
|
if($webUtil.inArray(['word','label'],item.type)){
|
titleAlign = "left";
|
}
|
titleStyle += "text-align:" + titleAlign + ";" ;
|
}
|
if($webUtil.isNull(title) || titleHidden || hidden ){
|
titleStyle += "display:none;";
|
}
|
if(validateRule!=''&& !form.config.verify[validateRule]) {
|
form.config.verify[validateRule] = [
|
new RegExp(validateRule),
|
'输入内容不符合验证规则'
|
]
|
}
|
if(fieldIsNotNull ){
|
validateRule = 'required|' + validateRule;
|
customLabelCss = "layui-field-required " + customLabelCss;
|
}
|
if(keyField){
|
customLabelCss = "layui-field-key-field " + customLabelCss;
|
}
|
if($webUtil.isNotNull(validateRule) && $webUtil.endWith(validateRule,",")){
|
validateRule = validateRule.substring(0,validateRule.length -1);
|
}
|
|
|
if($webUtil.isNotNull(textWidth) || textWidth>0){
|
textStyle += ";width:" + textWidth*1 + "px;";
|
}
|
var labelFlag = config.useLabelFlag?(" label-name-" + filter + "-" +name + " "):"";
|
var labelHtml = '<label class="layui-form-label ' + labelFlag + ($webUtil.isNotNull(customLabelCss)?customLabelCss:'') + '" '
|
+ ($webUtil.isNotNull(titleStyle)?('style="' + titleStyle +'" >'):'>') + title + ':</label>';
|
if(readOnly){
|
customTextCss = 'layui-field-readonly ' + customTextCss;
|
}
|
|
var baseCss = "layui-input-block";
|
if(!config.inDialog){
|
config.inDialog = false;
|
}
|
|
if(config.defaultColumnOneRow*1 >1 || config.inDialog){//在弹出窗口里面,得需要inline
|
baseCss = "layui-input-inline";
|
baseStyle='margin-right:5px;';
|
if($webUtil.isNotNull(textWidth) || textWidth>0){
|
baseStyle += "width:" + textWidth*1 + "px;";
|
}
|
}
|
//前缀
|
var prefix = $webUtil.getValueFromObj(item,['prefix']);
|
var prefixHtml = "";
|
if($webUtil.isNotNull(prefix)){
|
prefixHtml = "<div class='layui-form-mid layui-word-aux' " + (hidden?"style='display:none;'":"") + ">" + prefix + "</div>";
|
}
|
//后缀
|
var suffix =$webUtil.getValueFromObj(item,['suffix']);
|
var suffixHtml = "";
|
if($webUtil.isNotNull(suffix)){
|
suffixHtml = "<div class='layui-form-mid layui-word-aux' " + (hidden?"style='display:none;'":"") + ">" + suffix + "</div>";
|
}
|
if($webUtil.inArray(['text','password','1','2','textfield','input','date','datetime','time'], item.type)){//文本和密码框---日期时间也是在这里面
|
var inputHtml = '<div class="' + baseCss + '" ' + 'style="'+(hidden?"display:none;":"")+baseStyle+'">';
|
var inputType = "text";
|
if($webUtil.inArray(['password','2'],item.type) ){
|
inputType = 'password';
|
}
|
inputHtml+= ' <input type="' + inputType + '" name="' + name + '" ' + (fieldIsNotNull?'required ':'')
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ ($webUtil.isNotNull(placeholder)?('placeholder="' + placeholder + '" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class="layui-input ' + customTextCss + '" '):'class="layui-input"')
|
+ ' autocomplete="off" />';
|
return labelHtml + prefixHtml+ inputHtml + '</div>' + suffixHtml;
|
}
|
else if($webUtil.inArray(['combox','select','combobox','3','radio','checkbox'], item.type)){//下拉框,注意参照不使用这个
|
var selectHtml = "<div ";//'<div class="layui-input-block" ' + hidden?'style="display:none;"':'';
|
var enumKey = $webUtil.getValueFromObj(item,['comboxKey','comboxField','enumKey','enumField'],name);//下拉菜单的编号
|
var isCheckbox = $webUtil.getBoolean($webUtil.getValueFromObj(item,['isCheckbox','isMutiSelect'])) || 'checkbox' == item.type;
|
var isRadio = $webUtil.getBoolean($webUtil.getValueFromObj(item,['isRadio'])) || 'radio' == item.type;
|
if(isCheckbox || isRadio){
|
//多选是使用复选框的方式来展示
|
if(hidden){
|
textStyle += "display:none;";
|
}
|
selectHtml += ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ 'class="' + baseCss + ' ' + ($webUtil.isNotNull(customTextCss)?(customTextCss + ' '):'') + '"'
|
+ ' lay-filter-div="' + name + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify-div="' +validateRule +'" '):'')
|
+ (search?('lay-search="" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext-div="' + emptyText +'" '):'')
|
+ ' lay-combox="' + enumKey +'" lay-combox-type="' + (isCheckbox? 'checkbox':'radio') +'" lay-combox-name="' + name +'" '
|
+ (readOnly?('readOnly="readOnly"'):'')
|
+ '>';
|
}else{
|
selectHtml += 'class="' + baseCss +'" ' + 'style="'+(hidden?"display:none;":"")+baseStyle+'"';
|
selectHtml += '><select name="' + name + '" ' + (fieldIsNotNull?'required ':'' )
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ (search?('lay-search="" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class="' + customTextCss + '" '):'')
|
+ 'lay-combox="' + enumKey + '" inDialog="' + config.inDialog + '" '
|
+ (item.comboxTextField?(' selectTextName="' + item.comboxTextField + '" '):'')
|
+ ' lay-combox-editable="' + item.editable + '"></select>';
|
}
|
return labelHtml + prefixHtml + selectHtml + "</div>" + suffixHtml;
|
}else if($webUtil.inArray(['switch','boolean','truefalse','4'],item.type)){//开关
|
var switchHtml = '<div class="' + baseCss + '" ' + 'style="'+(hidden?"display:none;":"")+baseStyle+'">';
|
var valueOnSelect = $webUtil.getValueFromObj(item,['switchCheckedValue'],"true");
|
switchHtml+= ' <input type="checkbox" name="' + name + '" ' + (fieldIsNotNull?'required ':'')
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ ($webUtil.isNotNull(placeholder)?('placeholder="' + placeholder + '" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class=" ' + customTextCss + '" '):'')
|
+ ' lay-skin="switch" lay-text="' + $webUtil.getValueFromObj(item,['switchText'],"是|否")
|
+ '" valueOnSelect="' + valueOnSelect + '"/>';
|
return labelHtml + prefixHtml + switchHtml +'</div>' + suffixHtml;
|
}else if($webUtil.inArray(['textarea','note','5'],item.type)){//文本域
|
var inputHtml = '<div class="layui-input-block" ' + 'style="'+(($webUtil.isNotNull(titleWidth) || titleWidth>0)?'margin-left:'+titleWidth+'px;':'')+(hidden?"display:none;":"")+baseStyle+'">';
|
inputHtml+= ' <textarea name="' + name + '" ' + (fieldIsNotNull?'required ':'')
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ ($webUtil.isNotNull(placeholder)?('placeholder="' + placeholder + '" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(textStyle)?('style="' + textStyle +'"'):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class="layui-textarea ' + customTextCss + '" '):'class="layui-textarea"')
|
+ ' ></textarea>';
|
return labelHtml + prefixHtml + inputHtml + '</div>' + suffixHtml;
|
}else if($webUtil.inArray(['rate'],item.type)){
|
var rateHtml = '<div class="' + baseCss + '" ' + 'style="'+(hidden?"display:none;":"")+baseStyle+'">';
|
rateHtml += '<div name="' + name + '" class="' + name + '" data-value="' + name + '">' +
|
'</div>';
|
return labelHtml + prefixHtml + rateHtml +'</div>' + suffixHtml;
|
}else if($webUtil.inArray(['cycledate'],item.type)){
|
var inputHtml = '<div class="' + baseCss +'" ' + 'style="'+(hidden?"display:none;":"")+baseStyle+'">';
|
inputHtml+= ' <input type="text" name="' + name + '" ' + (fieldIsNotNull?'required ':'')
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ ($webUtil.isNotNull(placeholder)?('placeholder="' + placeholder + '" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class="layui-input ' + customTextCss + '" '):'class="layui-input"')
|
+ ' autocomplete="off" id="'+name+'"/>';
|
return labelHtml + prefixHtml + inputHtml + '</div>' + suffixHtml;
|
}else if($webUtil.inArray(['areadata'],item.type)){
|
//说明是区间值
|
baseCss = "layui-inline";
|
var baseStyle= (hidden?'display:none;':'');
|
if(!textWidth ){
|
textWidth = 190;
|
}
|
baseStyle += "float:left;";
|
var childWidth = item.halfWidth;
|
if(!childWidth){
|
childWidth = (textWidth-30)/2;
|
}
|
textStyle = "";
|
var inputHtml = '<div class="' + baseCss + '" style="margin-right: 15px;' + baseStyle + '">';
|
var inputType = "text";
|
inputHtml += ' <div class="layui-input-inline" style="width: ' + childWidth + 'px;">';
|
inputHtml += ' <input type="' + inputType + '" name="' + name + '" ' + (fieldIsNotNull?'required ':'')
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ ($webUtil.isNotNull(placeholder)?('placeholder="' + placeholder + '" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class="layui-input ' + customTextCss + '" '):'class="layui-input"')
|
+ ' autocomplete="off" />';
|
inputHtml += '</div>';
|
inputHtml += '<div class="layui-form-mid">-</div>';
|
inputHtml += ' <div class="layui-input-inline" style="width: ' + childWidth + 'px;">';
|
var maxValueName = $webUtil.getValueFromObj(item,['maxValueName']).trim();
|
if(item.maxValueNull){
|
fieldIsNotNull = false;
|
if(validateRule.indexOf("required,")>-1){
|
validateRule = validateRule.replace("required,","");
|
}
|
}
|
inputHtml += ' <input type="' + inputType + '" name="' + maxValueName + '" ' + (fieldIsNotNull?'required ':'')
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + maxValueName + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ ($webUtil.isNotNull(placeholder)?('placeholder="' + placeholder + '" '):'')
|
+ ($webUtil.isNotNull(tooltips)?('lay-tooltips="' + tooltips + '" '):'')
|
+ ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class="layui-input ' + customTextCss + '" '):'class="layui-input"')
|
+ ' autocomplete="off" />';
|
return labelHtml + prefixHtml + inputHtml +'</div></div>' + suffixHtml;
|
}else if($webUtil.inArray(['refer','combotree'],item.type)){//参照
|
var selectHtml = '<div class="' + baseCss +'" ' + 'style="'+(hidden?"display:none;":"")+baseStyle+'">';
|
selectHtml += '<select name="' + name + '" ' + (fieldIsNotNull?'required ':'')
|
+ (readOnly?'readOnly="readOnly" ':'')
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(validateRule)?('lay-verify="' +validateRule +'" '):'')
|
+ ($webUtil.isNotNull(emptyText)?('lay-vertext="' + emptyText +'" '):'')
|
+ ($webUtil.isNotNull(textStyle)?(' style="' + textStyle +'" '):'')
|
+ ($webUtil.isNotNull(customTextCss)?('class=" ' + customTextCss + '" '):'')
|
+ ' lay-refer="true" lay-refer-showField="' + item.showField + '" inDialog="' + config.inDialog + '" lay-refer-editable="' + item.editable + '">';
|
selectHtml += '<option value=""></option></select>';
|
// selectHtml += '<i class="layui-refer-clear"/>';
|
return labelHtml + prefixHtml + selectHtml + '</div>' + suffixHtml;
|
}else if($webUtil.inArray(['line'],item.type)){
|
//横线,可以用来做分组
|
var inputHtml = '<div class="' + baseCss + '" ' + (hidden?'style="display:none;width:100%;">':'style="width:100%">');
|
if(item.lineText || item.text){
|
//如果有文字的时候,我们使用fieldset来处理
|
inputHtml += '<fieldset><legend><a href="javascript:void(0);">' + (item.lineText || item.text) + '</a></legend></fieldset>';
|
}else {
|
var color = 'gray';
|
if ($webUtil.isNotNull(item.lineColor)) {
|
color = item.lineColor;
|
}
|
inputHtml += '<hr class="layui-bg-' + color + '">';
|
}
|
return prefixHtml + inputHtml + '</div>' + suffixHtml;
|
}else if($webUtil.inArray(['label','word'],item.type)){
|
if(hidden){
|
titleStyle = "display:none;" + titleStyle;
|
}
|
titleStyle += "padding-top:9px;padding-bottom:9px;";
|
return prefixHtml + '<div class="' + baseCss +'" ' + 'style="'+(hidden?"display:none;":"")+baseStyle+'">'
|
+ '<div class="layui-word-aux '
|
+ ($webUtil.isNotNull(customLabelCss)?customLabelCss:'') +'"'
|
+ ' lay-filter="' + name + '" '
|
+ ($webUtil.isNotNull(titleStyle)?('style="' + titleStyle +'" >'):'>')
|
+ title + '</div> </div>' + suffixHtml;
|
}else if($webUtil.inArray(['file'],item.type)){
|
//文件
|
var fileHtml = '<div class="' + baseCss +'" ' + (hidden?'style="display:none;">':'>');
|
fileHtml += '<div class="layui-upload-drag ' + name + '" data-value="' + name + '" id="upload-drag-' + name + '" '+
|
' lay-filter="' + name + '" '+
|
' extendAttrMap=\''+ JSON.stringify(item.extendAttrMap)+'\''+
|
($webUtil.isNotNull(textStyle)?(' style="' + textStyle +';width: '+(textWidth*1-20)+'px" '):'')+
|
'>' +
|
' <i class="layui-icon" style="font-size: 36px;"></i>' +
|
' <p style="font-size: 12px;">点击上传,或将文件拖拽到此处</p>' +
|
' <div class="layui-hide uploadDemoView">' +
|
' <hr>' +
|
'<input class="uploadFileOid" type="hidden" name="' + name + '">'+
|
' <img src="" alt="已上传图片" style="max-width: '+(textWidth*1-20)+'px">' +
|
' </div>' +
|
'</div>';
|
return labelHtml + prefixHtml + fileHtml + '</div>' + suffixHtml;
|
}else if($webUtil.inArray(['webeditor'],item.type)){
|
//编辑器
|
var editorHtml = '<div class="layui-input-block" style="'+(hidden?"display:none;":"")+'margin-left: 30px;">';
|
editorHtml += '<textarea class="webeditor" id="editor_' + name + '" name="' + name + '" lay-filter="' + name + '" data-value="' + name + '"'+
|
' style="height:200px;'+($webUtil.isNotNull(textStyle)?textStyle:'width:' +(textWidth*1)+'px;')+'" ></textarea>';
|
return labelHtml + prefixHtml + editorHtml +'</div>' + suffixHtml;
|
}
|
return "";
|
};
|
|
//销毁方法
|
Form.prototype.destory =function(filter){
|
var that = this;
|
//清除跟这个filter相关的所有配置
|
var allDefaultValueInThisFilter = [];
|
for(var key in that.formDefaultValueMap){
|
if($webUtil.startWith(key,filter+"_")){
|
allDefaultValueInThisFilter.push(key);
|
}
|
}
|
layui.each(allDefaultValueInThisFilter,function(_index,item){
|
delete that.formDefaultValueMap[item];
|
});
|
allDefaultValueInThisFilter= null;
|
//清除跟这个filter相关的config
|
if(filter in that.elementConfig){
|
delete that.elementConfig[filter];
|
}
|
//删除所有的字段
|
if(filter in that.fieldsMap){
|
delete that.fieldsMap[filter];
|
}
|
for(var key in that.referFieldsMap){
|
if(key.indexOf(filter + "${refer}") == 0){
|
delete that.referFieldsMap[key];
|
}
|
}
|
};
|
//end weidy
|
|
//表单提交校验
|
var submit = function(){
|
var button = $(this), verify = form.config.verify, stop = null
|
,DANGER = 'layui-form-danger', field = {} ,elem = button.parents(ELEM)
|
|
,verifyElem = elem.find('*[lay-verify]') //获取需要校验的元素
|
,formElem = button.parents('form')[0] //获取当前所在的form元素,如果存在的话
|
,fieldElem = elem.find('input,select,textarea') //获取所有表单域
|
,filter = button.attr('lay-filter'); //获取过滤器
|
|
|
//开始校验
|
layui.each(verifyElem, function(_, item){
|
var othis = $(this)
|
,vers = othis.attr('lay-verify').split('|')
|
,verType = othis.attr('lay-verType') //提示方式
|
,value = othis.val();
|
|
othis.removeClass(DANGER);
|
layui.each(vers, function(_, thisVer){
|
var isTrue //是否命中校验
|
,errorText = '' //错误提示文本
|
,isFn = typeof verify[thisVer] === 'function';
|
|
//匹配验证规则
|
if(verify[thisVer]){
|
var isTrue = isFn ? errorText = verify[thisVer](value, item) : !verify[thisVer][0].test(value);
|
errorText = errorText || verify[thisVer][1];
|
|
//如果是必填项或者非空命中校验,则阻止提交,弹出提示
|
if(isTrue){
|
//提示层风格
|
if(verType === 'tips'){
|
layer.tips(errorText, function(){
|
if(typeof othis.attr('lay-ignore') !== 'string'){
|
if(item.tagName.toLowerCase() === 'select' || /^checkbox|radio$/.test(item.type)){
|
return othis.next();
|
}
|
}
|
return othis;
|
}(), {tips: 1});
|
} else if(verType === 'alert') {
|
layer.alert(errorText, {title: '提示', shadeClose: true});
|
} else {
|
layer.msg(errorText, {icon: 5, shift: 6});
|
}
|
if(!device.android && !device.ios) item.focus(); //非移动设备自动定位焦点
|
othis.addClass(DANGER);
|
return stop = true;
|
}
|
}
|
});
|
if(stop) return stop;
|
});
|
|
if(stop) return false;
|
|
var nameIndex = {}; //数组 name 索引
|
layui.each(fieldElem, function(_, item){
|
item.name = (item.name || '').replace(/^\s*|\s*&/, '');
|
|
if(!item.name) return;
|
|
//用于支持数组 name
|
if(/^.*\[\]$/.test(item.name)){
|
var key = item.name.match(/^(.*)\[\]$/g)[0];
|
nameIndex[key] = nameIndex[key] | 0;
|
item.name = item.name.replace(/^(.*)\[\]$/, '$1['+ (nameIndex[key]++) +']');
|
}
|
|
if(/^checkbox|radio$/.test(item.type) && !item.checked) return;
|
field[item.name] = item.value;
|
});
|
|
//获取字段
|
return layui.event.call(this, MOD_NAME, 'submit('+ filter +')', {
|
elem: this
|
,form: formElem
|
,field: field
|
});
|
};
|
|
//自动完成渲染
|
var form = new Form()
|
,dom = $(document), win = $(window);
|
|
form.render();
|
|
//表单reset重置渲染
|
dom.on('reset', ELEM, function(){
|
var filter = $(this).attr('lay-filter');
|
setTimeout(function(){
|
form.render(null, filter);
|
}, 50);
|
});
|
|
//表单提交事件
|
dom.on('submit', ELEM, submit)
|
.on('click', '*[lay-submit]', submit);
|
|
exports(MOD_NAME, form);
|
});
|