github
/
layui
mirror of https://github.com/layui/layui
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge branch 'layui:main' into main

pull/1088/head
sunxiaobin89 2022-07-17 12:08:36 +08:00 committed by GitHub
parent f955a75d65 72d74de4a5
commit 7cadcb9448
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 86 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/json/table/demo1.json
View File

@ -9,7 +9,7 @@
"id": "10001"
,"username": "杜甫123"
,"email": "test1@email.com"
,"sex": "<strong>男</strong>"
,"sex": "<strong style=\"color: red\">男</strong>"
,"city": "浙江杭州"
,"sign": "舍南舍北皆春水，但见群鸥日日来。花径不曾缘客扫，蓬门今始为君开。盘飧市远无兼味，樽酒家贫只旧醅。肯与邻翁相对饮，隔篱呼取尽余杯。"
,"experience": 7

6
examples/table-test.html
View File

@ -152,11 +152,13 @@ layui.use(['table', 'dropdown'], function(){
{type: 'checkbox', fixed: 'left'}
//,{type: 'numbers', fixed: 'left'}
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true, totalRowText: '合计：'}
,{field:'username', title:'用户名', width:120, edit: 'text', templet: '#usernameTpl'}
,{field:'username', title:'用户名', width:120, edit: function(d){
return !d.LAY_DISABLED;
}, templet: '#usernameTpl'}
,{field:'email', minWidth: 160, title:'邮箱 <i class="layui-icon layui-icon-email"></i>', hide: 0, edit: 'text', templet: function(d){
return '<em>'+ layui.util.escape(d.email) +'</em>'
}}
,{field:'sex', title:'性别', width:80, edit: 'text', sort: true}
,{field:'sex', title:'性别', width:80, edit: 'text', sort: true, escape: false}
,{field:'city', title:'城市', width:120, templet: '#cityTpl', exportTemplet: function(d, obj){
//console.log(obj)
var td = obj.td(this.field); //获取当前 td

21
examples/table.html
View File

@ -228,16 +228,17 @@ layui.use('table', function(){
//,width: 900
//,height: 274
,cols: [[ //标题栏
{type: 'checkbox', LAY_CHECKED: true}
,{field: 'id', title: 'ID', width: 80, sort: true}
,{type: 'space', width: 100} //空列
,{field: 'username', title: '用户名', width: 120}
,{field: 'email', title: '邮箱', width: 150}
,{field: 'sign', title: '签名', width: 150}
,{field: 'sex', title: '性别', width: 80}
,{field: 'city', title: '城市', width: 100}
// ,{field: 'experience', title: '积分', width: 80, sort: true}
,{field: 'experience', title: '积分', width: 80, sort: true, totalRow: '{{= parseInt(d.TOTAL_NUMS) }}'}
//{type: 'space'},
{type: 'checkbox', LAY_CHECKED: true},
{field: 'id', title: 'ID', width: 80, sort: true},
{type: 'space', width: 100}, //空列
{field: 'username', title: '用户名', width: 120},
{field: 'email', title: '邮箱', width: 150},
{field: 'sign', title: '签名', minWidth: 150},
{field: 'sex', title: '性别', width: 80},
{field: 'city', title: '城市', width: 100},
//{field: 'experience', title: '积分', width: 80, sort: true},
{field: 'experience', title: '积分', width: 80, sort: true, totalRow: '{{= parseInt(d.TOTAL_NUMS) }}'}
]]
,data: [{
"id": "10001"

23
src/modules/slider.js
View File

@ -319,21 +319,26 @@ layui.define('jquery', function(exports){
});
});
//点击滑块
// 点击滑块
sliderAct.on('click', function(e){
var main = $('.' + SLIDER_WRAP_BTN);
var othis = $(this);
if(!main.is(event.target) && main.has(event.target).length === 0 && main.length){
var left = options.type === 'vertical' ? (sliderWidth() - e.clientY + $(this).offset().top):(e.clientX - $(this).offset().left), index;
if(left < 0)left = 0;
if(left > sliderWidth())left = sliderWidth();
var reaLeft = left / sliderWidth() * 100 / step;
var index;
var offset = options.type === 'vertical'
? (sliderWidth() - e.clientY + othis.offset().top - $(window).scrollTop())
:(e.clientX - othis.offset().left - $(window).scrollLeft());
if(offset < 0)offset = 0;
if(offset > sliderWidth()) offset = sliderWidth();
var reaLeft = offset / sliderWidth() * 100 / step;
if(options.range){
if(options.type === 'vertical'){
index = Math.abs(left - parseInt($(sliderWrap[0]).css('bottom'))) > Math.abs(left - parseInt($(sliderWrap[1]).css('bottom'))) ? 1 : 0;
}else{
index = Math.abs(left - sliderWrap[0].offsetLeft) > Math.abs(left - sliderWrap[1].offsetLeft) ? 1 : 0;
index = Math.abs(offset - parseInt($(sliderWrap[0]).css('bottom'))) > Math.abs(offset - parseInt($(sliderWrap[1]).css('bottom'))) ? 1 : 0;
} else {
index = Math.abs(offset - sliderWrap[0].offsetLeft) > Math.abs(offset - sliderWrap[1].offsetLeft) ? 1 : 0;
}
}else{
} else {
index = 0;
};
change(reaLeft, index);

93
src/modules/table.js
View File

@ -77,12 +77,13 @@ layui.define(['laytpl', 'laypage', 'form', 'util'], function(exports){
,parseTempData = function(obj){
obj = obj || {};
var options = this.config || {}
,item3 = obj.item3 // 表头数据
,content = obj.content; // 原始内容
var options = this.config || {};
var item3 = obj.item3; // 表头数据
var content = obj.content; // 原始内容
// 是否编码 HTML
if(options.escape) content = util.escape(content);
var escaped = 'escape' in item3 ? item3.escape : options.escape;
if(escaped) content = util.escape(content);
// 获取模板
var templet = obj.text && item3.exportTemplet || (item3.templet || item3.toolbar);
@ -91,7 +92,9 @@ layui.define(['laytpl', 'laypage', 'form', 'util'], function(exports){
if(templet){
content = typeof templet === 'function'
? templet.call(item3, obj.tplData, obj.obj)
: laytpl($(templet).html() || String(content)).render(obj.tplData);
: laytpl($(templet).html() || String(content)).render($.extend({
LAY_COL: item3
}, obj.tplData));
}
// 是否只返回文本
@ -430,7 +433,7 @@ layui.define(['laytpl', 'laypage', 'form', 'util'], function(exports){
,initWidth = {
checkbox: 50
,radio: 50
,space: 15
,space: 30
,numbers: 60
};
@ -918,6 +921,18 @@ layui.define(['laytpl', 'laypage', 'form', 'util'], function(exports){
return that;
};
// 获取表头参数项
Class.prototype.col = function(key){
try {
key = key.split('-');
return this.config.cols[key[1]][key[2]];
} catch(e){
hint.error(e);
return {};
}
};
// 数据渲染
Class.prototype.renderData = function(opts){
var that = this;
@ -965,11 +980,10 @@ layui.define(['laytpl', 'laypage', 'form', 'util'], function(exports){
if(content === undefined || content === null) content = '';
if(item3.colGroup) return;
//td内容
// td 内容
var td = ['<td data-field="'+ field +'" data-key="'+ key +'" '+ function(){ //追加各种属性
var attr = [];
if(item3.edit) attr.push('data-edit="'+ item3.edit +'"'); //是否允许单元格编辑
if(item3.templet) attr.push('data-content="'+ content +'"'); //自定义模板
if(item3.templet) attr.push('data-content="'+ util.escape(content) +'"'); //自定义模板
if(item3.toolbar) attr.push('data-off="true"'); //行工具列关闭单元格事件
if(item3.event) attr.push('lay-event="'+ item3.event +'"'); //自定义事件
if(item3.minWidth) attr.push('data-minwidth="'+ item3.minWidth +'"'); //单元格最小宽度
@ -1901,50 +1915,55 @@ layui.define(['laytpl', 'laypage', 'form', 'util'], function(exports){
// 单元格编辑
that.layBody.on('change', '.'+ELEM_EDIT, function(){
var othis = $(this)
,value = this.value
,field = othis.parent().data('field')
,index = othis.parents('tr').eq(0).data('index')
,data = table.cache[that.key][index];
var othis = $(this);
var value = this.value;
var field = othis.parent().data('field');
var index = othis.parents('tr').eq(0).data('index');
var data = table.cache[that.key][index];
data[field] = value; //更新缓存中的值
data[field] = value; // 更新缓存中的值
layui.event.call(this, MOD_NAME, 'edit('+ filter +')', commonMember.call(this, {
value: value
,field: field
}));
}).on('blur', '.'+ELEM_EDIT, function(){
var item3
,othis = $(this)
,thisElem = this
,field = othis.parent().data('field')
,index = othis.parents('tr').eq(0).data('index')
,data = table.cache[that.key][index];
that.eachCols(function(i, item){
if(item.field == field && item.templet){
item3 = item;
}
});
var othis = $(this);
var td = othis.parent();
var key = td.data('key');
var index = othis.closest('tr').data('index');
var data = table.cache[that.key][index];
othis.siblings(ELEM_CELL).html(function(value){
return parseTempData.call(that, {
item3: item3 || {}
item3: that.col(key)
,content: value
,tplData: data
});
}(thisElem.value));
othis.parent().data('content', thisElem.value);
}(othis[0].value));
td.data('content', othis[0].value);
othis.remove();
});
// 单元格事件
that.layBody.on(options.editTrigger, 'td', function(e){
var othis = $(this)
,field = othis.data('field')
,editType = othis.data('edit')
,elemCell = othis.children(ELEM_CELL);
var othis = $(this);
if(othis.data('off')) return; // 不触发事件
var field = othis.data('field');
var key = othis.data('key');
var col = that.col(key);
var index = othis.closest('tr').data('index');
var data = table.cache[that.key][index];
var elemCell = othis.children(ELEM_CELL);
// 是否开启编辑
// 若 edit 传入函数，则根据函数的发挥结果判断是否开启编辑
var editType = typeof col.edit === 'function'
? col.edit(data)
: col.edit;
if(othis.data('off')) return; //不触发事件
//显示编辑表单
// 显示编辑表单
if(editType){
var input = $(function(){
var inputElem = '<input class="layui-input '+ ELEM_EDIT +'">';
@ -1954,7 +1973,7 @@ layui.define(['laytpl', 'laypage', 'form', 'util'], function(exports){
return inputElem;
}());
input[0].value = othis.data('content') || elemCell.text();
input[0].value = othis.data('content') || data[field] || elemCell.text();
othis.find('.'+ELEM_EDIT)[0] || othis.append(input);
input.focus();
layui.stope(e);