Compare commits

..

23 Commits

Author SHA1 Message Date
8ea9d9e4da 文档 2024-10-09 08:38:07 +08:00
b6c6d19d96 文档 2024-10-09 08:36:17 +08:00
f4fe3db2b8 table增加排序后回调 2024-10-09 08:33:54 +08:00
c3ac588bdb 修复table重新渲染的内存泄漏 2024-10-08 16:10:23 +08:00
526d1cbec1 穿梭框增加禁用选择所有,table增加只刷新数据不刷新dom 2024-04-24 14:23:04 +08:00
5e10d720e6 1 2023-10-18 14:41:20 +08:00
4f40e560bb add 修改文档 2023-08-01 11:33:56 +08:00
bc8d400b01 add table onColumnsWidth 修改宽度之后回调返回cols 2023-08-01 11:20:58 +08:00
6a0e0fd6b1 fix table 排序后多选不能使用 2023-05-09 18:33:32 +08:00
096ee2fc96 layer 弹出层 确定按钮节流 2023-02-20 11:48:16 +08:00
2458e523ba 筛选 2022-11-15 15:49:19 +08:00
cae4bc1af0 合计全部页 2022-11-11 09:45:21 +08:00
2ae835ecfe 未修复高度 2022-11-11 09:25:45 +08:00
ee757f7f07 Merge branch 'bagdata' into bagdata-script 2022-10-19 16:09:44 +08:00
12eabbf7d5 add londing 2022-10-19 14:04:35 +08:00
贤心
f1140fa78f release v2.7.1 2022-06-27 01:34:38 +08:00
贤心
ab940e5df3 update 2022-06-27 01:33:11 +08:00
贤心
9dc31fa032 release v2.7.1 2022-06-27 01:01:51 +08:00
贤心
5822042a80 Merge branch 'main' of github.com:layui/layui 2022-06-27 00:29:33 +08:00
贤心
8cf6798137 update 2022-06-27 00:29:24 +08:00
贤心
42738cebf2 Merge pull request #1054 from sunxiaobin89/main 2022-06-26 17:59:49 +08:00
sunxiaobin89
16e02f99ea Merge branch 'layui:main' into main 2022-06-26 14:33:06 +08:00
sunxiaobin89
146adba3fe table 修复reloadData之后出现分页栏丢失的问题 2022-06-26 14:32:25 +08:00
22 changed files with 25242 additions and 137 deletions

3
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,3 @@
{
"svn.ignoreMissingSvnWarning": true
}

View File

@@ -73,3 +73,34 @@ layui 原官网已于2021年10月13日下线。详见
鉴于 Layui 相对庞大的受众群体,从此 Github 和 Gitee 平台将支撑起 Layui 的后续。<br> 鉴于 Layui 相对庞大的受众群体,从此 Github 和 Gitee 平台将支撑起 Layui 的后续。<br>
**Layui 将继续陪伴着所有为之热爱的人们共同去探索和论证「Layui 开发模式的可行性」** **Layui 将继续陪伴着所有为之热爱的人们共同去探索和论证「Layui 开发模式的可行性」**
## 维护修改问题
1. table排序后多选无法选中
2. table合计将统计所有数据而不是当前页
3. longing修改动画效果
4. 修改结合soultable重载后高度问题
5. 修正table窗口变更大小可能出现内存泄漏问题
## 维护增加功能
1. table 增加`getData()`函数方便获取当前table所有数据包括行内输入之后的值
2. table 增加`onColumnsWidth()`函数可以让table列宽手动调整后返回调整后的cols方便保存手动调整后的状态
3. table 增加`sortCallback`属性,用于排序后回调函数,方便获取排序后处理下拉等
## 使用示例
```javascript
// getData()
layui.table.getData('tableId')
// onColumnsWidth
let tab = table.render(config)
tab.onColumnsWidth(callback)
// 视情况添加layui.table.onColumnsWidth 暂时没有用到
table.render({
...,
sortCallback: function (res, curr, count) {
}
})
```

2
dist/css/layui.css vendored

File diff suppressed because one or more lines are too long

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

24723
dist/layui.js vendored

File diff suppressed because one or more lines are too long

View File

@@ -3,7 +3,7 @@
,"msg": "" ,"msg": ""
,"count": 3000000 ,"count": 3000000
,"totalRow": { ,"totalRow": {
"experience": "777" "checkin": "777"
} }
,"data": [{ ,"data": [{
"id": "10001" "id": "10001"
@@ -11,11 +11,12 @@
,"email": "test1@email.com" ,"email": "test1@email.com"
,"sex": "<strong>男</strong>" ,"sex": "<strong>男</strong>"
,"city": "浙江杭州" ,"city": "浙江杭州"
,"sign": "鼠标移动到此处,可以通过点击单元格右侧的下拉图标,查看到被隐藏的全部内容。" ,"sign": "舍南舍北皆春水,但见群鸥日日来。花径不曾缘客扫,蓬门今始为君开。盘飧市远无兼味,樽酒家贫只旧醅。肯与邻翁相对饮,隔篱呼取尽余杯。"
,"experience": 7 ,"experience": 7
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": 0 ,"checkin": 0
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
,"LAY_DISABLED": true
}, { }, {
"id": "10002" "id": "10002"
,"username": "李白" ,"username": "李白"
@@ -25,7 +26,7 @@
,"sign": "君不见,黄河之水天上来,奔流到海不复回。 君不见,高堂明镜悲白发,朝如青丝暮成雪。 人生得意须尽欢,莫使金樽空对月。 天生我材必有用,千金散尽还复来。 烹羊宰牛且为乐,会须一饮三百杯。 岑夫子,丹丘生,将进酒,杯莫停。 与君歌一曲,请君为我倾耳听。(倾耳听 一作:侧耳听) 钟鼓馔玉不足贵,但愿长醉不复醒。(不足贵 一作:何足贵;不复醒 一作:不愿醒/不用醒) 古来圣贤皆寂寞,惟有饮者留其名。(古来 一作:自古;惟 通:唯) 陈王昔时宴平乐,斗酒十千恣欢谑。 主人何为言少钱,径须沽取对君酌。 五花马,千金裘,呼儿将出换美酒,与尔同销万古愁。" ,"sign": "君不见,黄河之水天上来,奔流到海不复回。 君不见,高堂明镜悲白发,朝如青丝暮成雪。 人生得意须尽欢,莫使金樽空对月。 天生我材必有用,千金散尽还复来。 烹羊宰牛且为乐,会须一饮三百杯。 岑夫子,丹丘生,将进酒,杯莫停。 与君歌一曲,请君为我倾耳听。(倾耳听 一作:侧耳听) 钟鼓馔玉不足贵,但愿长醉不复醒。(不足贵 一作:何足贵;不复醒 一作:不愿醒/不用醒) 古来圣贤皆寂寞,惟有饮者留其名。(古来 一作:自古;惟 通:唯) 陈王昔时宴平乐,斗酒十千恣欢谑。 主人何为言少钱,径须沽取对君酌。 五花马,千金裘,呼儿将出换美酒,与尔同销万古愁。"
,"experience": 9 ,"experience": 9
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": "106" ,"checkin": "106"
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
,"LAY_CHECKED": true ,"LAY_CHECKED": true
}, { }, {
@@ -34,10 +35,10 @@
,"email": "test3@email.com" ,"email": "test3@email.com"
,"sex": "男" ,"sex": "男"
,"city": "浙江杭州" ,"city": "浙江杭州"
,"sign": "人生恰似一场修行" ,"sign": "大江东去,浪淘尽,千古风流人物。故垒西边,人道是,三国周郎赤壁。乱石穿空,惊涛拍岸,卷起千堆雪。江山如画,一时多少豪杰。遥想公瑾当年,小乔初嫁了,雄姿英发。羽扇纶巾,谈笑间,樯橹灰飞烟灭。故国神游,多情应笑我,早生华发。人生如梦,一尊还酹江月。"
,"experience": 8 ,"experience": 8
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": null ,"checkin": null
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
}, { }, {
"id": "10004" "id": "10004"
@@ -48,7 +49,7 @@
,"sign": "人生恰似一场修行" ,"sign": "人生恰似一场修行"
,"experience": 6 ,"experience": 6
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": "106" ,"checkin": "106"
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
}, { }, {
"id": "10005" "id": "10005"
@@ -59,7 +60,7 @@
,"sign": "人生恰似一场修行" ,"sign": "人生恰似一场修行"
,"experience": 64 ,"experience": 64
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": "106" ,"checkin": "106"
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
}, { }, {
"id": "10006" "id": "10006"
@@ -70,7 +71,7 @@
,"sign": "人生恰似一场修行" ,"sign": "人生恰似一场修行"
,"experience": 65 ,"experience": 65
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": "106" ,"checkin": "106"
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
}, { }, {
"id": "10007" "id": "10007"
@@ -81,7 +82,7 @@
,"sign": "人生恰似一场修行" ,"sign": "人生恰似一场修行"
,"experience": 49 ,"experience": 49
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": "106" ,"checkin": "106"
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
}, { }, {
"id": "10008" "id": "10008"
@@ -92,7 +93,7 @@
,"sign": "人生恰似一场修行" ,"sign": "人生恰似一场修行"
,"experience": 5 ,"experience": 5
,"ip": "192.168.0.8" ,"ip": "192.168.0.8"
,"logins": "106" ,"checkin": "106"
,"joinTime": "2016-10-14" ,"joinTime": "2016-10-14"
}] }]
} }

View File

@@ -21,7 +21,6 @@
<script type="text/html" id="toolbarDemo"> <script type="text/html" id="toolbarDemo">
<div class="layui-btn-container"> <div class="layui-btn-container">
<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button> <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
<button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
<button class="layui-btn layui-btn-sm" lay-event="getData">获取当前页数据</button> <button class="layui-btn layui-btn-sm" lay-event="getData">获取当前页数据</button>
<button class="layui-btn layui-btn-sm" lay-event="isAll">是否全选</button> <button class="layui-btn layui-btn-sm" lay-event="isAll">是否全选</button>
@@ -86,6 +85,20 @@ layui.use(['table', 'dropdown'], function(){
var dropdown = layui.dropdown; var dropdown = layui.dropdown;
var form = layui.form; var form = layui.form;
// 仅用于各类测试的表头
var test_cols = [[
{type: 'checkbox', fixed: 'left'}
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true, totalRowText: '合计:'}
,{field:'username', title:'用户名', width:120, edit: 'text'}
,{field:'email', title:'邮箱 <i class="layui-icon layui-icon-email"></i>', hide: 0, width:150, edit: 'text'}
,{field:'sex', title:'性别', width:80, edit: 'text', sort: true}
,{field:'city', title:'城市', width: 120}
,{field:'sign', title:'签名'}
,{field: 'experience', title: '积分', width:80, sort: true, align:'center', totalRow: '{{ d.TOTAL_NUMS }} 😊'}
,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
]];
// 全局设定某参数 // 全局设定某参数
table.set({ table.set({
where: { where: {
@@ -97,9 +110,6 @@ layui.use(['table', 'dropdown'], function(){
//,height: 300 //,height: 300
}); });
$('#appendtest').append($('#TPL_appendtest').html())
table.init('appendtest');
//渲染 //渲染
window.ins1 = table.render({ window.ins1 = table.render({
elem: '#test' elem: '#test'
@@ -109,7 +119,7 @@ layui.use(['table', 'dropdown'], function(){
,url: 'json/table/demo1.json' ,url: 'json/table/demo1.json'
,pagebar: '#pagebarDemo' // 分页栏模板 ,pagebar: '#pagebarDemo' // 分页栏模板
,lineStyle: 'height: 100px;' // 行样式 ,lineStyle: 'height: 95px;' // 行样式
,css: [ // 自定义样式 ,css: [ // 自定义样式
'.layui-table-page{text-align: right;}' '.layui-table-page{text-align: right;}'
,'.layui-table-pagebar{float: left;}' ,'.layui-table-pagebar{float: left;}'
@@ -120,7 +130,9 @@ layui.use(['table', 'dropdown'], function(){
//,autoSort: false //是否自动排序。如果否,则由服务端排序 //,autoSort: false //是否自动排序。如果否,则由服务端排序
//,loading: false //,loading: false
,totalRow: true ,totalRow: true
,page: true ,page: {
// curr: layui.data('tableCache').curr || 1 // 读取记录中的页码,赋值给起始页
}
,limit: 30 ,limit: 30
,toolbar: '#toolbarDemo' ,toolbar: '#toolbarDemo'
,defaultToolbar: ['filter', 'exports', 'print', { ,defaultToolbar: ['filter', 'exports', 'print', {
@@ -129,17 +141,7 @@ layui.use(['table', 'dropdown'], function(){
,icon: 'layui-icon-tips' ,icon: 'layui-icon-tips'
}] }]
//,escape: false //,escape: false
,cols: !1 ? [[ //仅用于测试 ,cols: !1 ? test_cols : [[
{type: 'checkbox', fixed: 'left'}
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true, totalRowText: '合计:'}
,{field:'username', title:'用户名', width:120, edit: 'text'}
,{field:'email', title:'邮箱 <i class="layui-icon layui-icon-email"></i>', hide: 0, width:150, edit: 'text'}
,{field:'sex', title:'性别', width:80, edit: 'text', sort: true}
,{field:'city', title:'城市', width:120}
,{field:'sign', title:'签名'}
,{field: 'experience', title: '积分', width:80, sort: true, align:'center', totalRow: '{{ d.TOTAL_NUMS }} 😊'}
,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
]] : [[
{type: 'checkbox', fixed: 'left'} {type: 'checkbox', fixed: 'left'}
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true, totalRowText: '合计:'} ,{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: 'text', templet: '#usernameTpl'}
@@ -152,15 +154,16 @@ layui.use(['table', 'dropdown'], function(){
var td = obj.td(this.field); //获取当前 td var td = obj.td(this.field); //获取当前 td
return td.find('select').val(); return td.find('select').val();
}} }}
,{field:'sign', title:'签名', edit: 'textarea'} ,{field:'sign', title:'签名', minWidth: 200, style:'color: #5FB878', edit: 'textarea'}
,{field: 'experience', title: '积分', width:80, sort: true, align:'center', totalRow: '{{ d.TOTAL_NUMS }} 😊', templet: '<div>{{ d.experience }} 分</div>'} ,{field: 'experience', title: '积分', width: 100, sort: true, align:'center', totalRow: !1 || '{{= d.TOTAL_NUMS }} 😊', templet: '<div><a href="" class="layui-table-link">{{ d.experience }}</a> 分</div>'}
,{field:'ip', title:'IP', width: 120} ,{field:'ip', title:'IP', width: 120, align: 'right'}
,{field:'logins', title:'登入次数', width: 100, sort: true, totalRow: '{{ parseInt(d.TOTAL_NUMS) }} 次'} ,{field:'checkin', title:'打卡', width: 100, sort: true, totalRow: '{{= parseInt(d.TOTAL_NUMS) }} 次'}
,{field:'joinTime', title:'加入时间', width: 120} ,{field:'joinTime', title:'加入时间', width: 120}
,{fixed: 'right', title:'操作', toolbar: '#barDemo', width: 180} ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width: 180}
]] ]]
,initSort1: { //,autoSort: false // 禁用前端自动排序
,initSort11111: { // 初始排序状态
field: 'experience' //排序字段,对应 cols 设定的各字段名 field: 'experience' //排序字段,对应 cols 设定的各字段名
,type: 'desc' //排序方式 asc: 升序、desc: 降序、null: 默认排序 ,type: 'desc' //排序方式 asc: 升序、desc: 降序、null: 默认排序
} }
@@ -172,9 +175,17 @@ layui.use(['table', 'dropdown'], function(){
,key: 'experience' ,key: 'experience'
,order: 'asc' ,order: 'asc'
} }
,done: function(){ ,done: function(res, curr, count){
var id = this.id; var id = this.id;
// 记录当前页码
/*
layui.data('tableCache', {
key: 'curr',
value: curr
});
*/
// 重载测试 // 重载测试
dropdown.render({ dropdown.render({
elem: '#reloadTest' //可绑定在任意元素中,此处以上述按钮为例 elem: '#reloadTest' //可绑定在任意元素中,此处以上述按钮为例
@@ -326,19 +337,20 @@ layui.use(['table', 'dropdown'], function(){
//排序事件 //排序事件
table.on('sort(test)', function(obj){ table.on('sort(test)', function(obj){
console.log(obj); //console.log(obj);
return; //return;
layer.msg('服务端排序。order by '+ obj.field + ' ' + obj.type); layer.msg('服务端排序。order by '+ obj.field + ' ' + obj.type);
//服务端排序 //服务端排序
table.reload('test', { table.reloadData('test', {
initSort: obj //initSort: obj,
//,page: {curr: 1} //重新从第一页开始 //page: {curr: 1}, //重新从第一页开始
,where: { //重新请求服务端 where: { // 向服务端传入排序参数
key: obj.field //排序字段 key: obj.field, //排序字段
,order: obj.type //排序方式 order: obj.type //排序方式
} }
}, true); });
}); });
// 工具栏事件 // 工具栏事件
@@ -351,10 +363,6 @@ layui.use(['table', 'dropdown'], function(){
var data = checkStatus.data; var data = checkStatus.data;
layer.alert(layui.util.escape(JSON.stringify(data))); layer.alert(layui.util.escape(JSON.stringify(data)));
break; break;
case 'getCheckLength':
var data = checkStatus.data;
layer.msg('选中了:'+ data.length + ' 个');
break;
case 'getData': case 'getData':
var getData = table.getData(id); var getData = table.getData(id);
console.log(getData); console.log(getData);

View File

@@ -201,6 +201,7 @@ layui.use('table', function(){
//,height: 300 //,height: 300
,cellMinWidth: 80 ,cellMinWidth: 80
//,skin: 'line' //,skin: 'line'
//,size: 'lg'
,toolbar: true ,toolbar: true
,cols: [[ ,cols: [[
{field: 'id', hide: true} {field: 'id', hide: true}
@@ -236,7 +237,7 @@ layui.use('table', function(){
,{field: 'sex', title: '性别', width: 80} ,{field: 'sex', title: '性别', width: 80}
,{field: 'city', title: '城市', width: 100} ,{field: 'city', title: '城市', width: 100}
// ,{field: 'experience', title: '积分', width: 80, sort: true} // ,{field: 'experience', title: '积分', width: 80, sort: true}
,{field: 'experience', title: '积分', width: 80, sort: true, totalRow: true, totalRowDecimals: 3} ,{field: 'experience', title: '积分', width: 80, sort: true, totalRow: '{{= parseInt(d.TOTAL_NUMS) }}'}
]] ]]
,data: [{ ,data: [{
"id": "10001" "id": "10001"

View File

@@ -49,12 +49,7 @@ const js = () => {
let src = [ let src = [
'./src/**/{layui,layui.all,'+ config.modules +'}.js' './src/**/{layui,layui.all,'+ config.modules +'}.js'
]; ];
return gulp.src(src).pipe(uglify({ return gulp.src(src).pipe(concat('layui.js', {newLine: ''}))
output: {
ascii_only: true //escape Unicode characters in strings and regexps
},
ie: true
})).pipe(concat('layui.js', {newLine: ''}))
.pipe(header.apply(null, config.comment)) .pipe(header.apply(null, config.comment))
.pipe(gulp.dest(dest)); .pipe(gulp.dest(dest));
}; };

View File

@@ -1,7 +1,7 @@
{ {
"name": "layui", "name": "layui",
"realname": "layui", "realname": "layui",
"version": "2.7.0", "version": "2.7.1",
"description": "Classic modular Front-End UI library", "description": "Classic modular Front-End UI library",
"main": "dist/layui.js", "main": "dist/layui.js",
"license": "MIT", "license": "MIT",
@@ -12,21 +12,23 @@
}, },
"homepage": "https://github.com/layui/layui/", "homepage": "https://github.com/layui/layui/",
"devDependencies": { "devDependencies": {
"del": "^2.2.2",
"gulp": "^4.0.2", "gulp": "^4.0.2",
"gulp-uglify": "^3.0.2",
"gulp-clean-css": "^4.3.0", "gulp-clean-css": "^4.3.0",
"gulp-concat": "^2.6.1", "gulp-concat": "^2.6.1",
"gulp-replace": "^1.1.3",
"gulp-rename": "^2.0.0",
"gulp-header": "^2.0.9",
"gulp-footer": "^2.1.0", "gulp-footer": "^2.1.0",
"del": "^2.2.2", "gulp-header": "^2.0.9",
"gulp-rename": "^2.0.0",
"gulp-replace": "^1.1.3",
"gulp-uglify": "^3.0.2",
"minimist": "^1.2.5" "minimist": "^1.2.5"
}, },
"bugs": { "bugs": {
"url": "https://gitee.com/sentsin/layui/issues" "url": "https://gitee.com/sentsin/layui/issues"
}, },
"dependencies": {}, "dependencies": {
"layui": "file:"
},
"keywords": [ "keywords": [
"layui", "layui",
"ui", "ui",

View File

@@ -723,6 +723,7 @@ a cite{font-style: normal; *cursor:pointer;}
.layui-form-checkbox[lay-skin="primary"]:hover i{border-color: #5FB878; color: #fff;} .layui-form-checkbox[lay-skin="primary"]:hover i{border-color: #5FB878; color: #fff;}
.layui-form-checked[lay-skin="primary"] i{border-color: #5FB878 !important; background-color: #5FB878; color: #fff;} .layui-form-checked[lay-skin="primary"] i{border-color: #5FB878 !important; background-color: #5FB878; color: #fff;}
.layui-checkbox-disabled[lay-skin="primary"] span{background: none!important; color: #c2c2c2!important;} .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-checkbox-disabled[lay-skin="primary"]:hover i{border-color: #d2d2d2;}
.layui-form-item .layui-form-checkbox[lay-skin="primary"]{margin-top: 10px;} .layui-form-item .layui-form-checkbox[lay-skin="primary"]{margin-top: 10px;}
@@ -950,6 +951,8 @@ a cite{font-style: normal; *cursor:pointer;}
.layui-table-cell{height: 38px; line-height: 28px; padding: 6px 15px; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box;} .layui-table-cell{height: 38px; line-height: 28px; padding: 6px 15px; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box;}
.layui-table-cell .layui-form-checkbox[lay-skin="primary"]{top: -1px; padding: 0;} .layui-table-cell .layui-form-checkbox[lay-skin="primary"]{top: -1px; padding: 0;}
.layui-table-cell .layui-table-link{color: #01AAED;} .layui-table-cell .layui-table-link{color: #01AAED;}
.layui-table-cell[align="center"]{-webkit-box-pack: center;}
.layui-table-cell[align="right"]{-webkit-box-pack: end;}
.laytable-cell-checkbox, .laytable-cell-checkbox,
.laytable-cell-radio, .laytable-cell-radio,
@@ -991,7 +994,7 @@ a cite{font-style: normal; *cursor:pointer;}
.layui-table-view select[lay-ignore]{display: inline-block;} .layui-table-view select[lay-ignore]{display: inline-block;}
.layui-table-patch .layui-table-cell{padding: 0; width: 30px;} .layui-table-patch .layui-table-cell{padding: 0; width: 30px;}
.layui-table-edit{position: absolute; left: 0; top: 0; z-index: 900; min-width: 100%; min-height: 100%; padding: 0 14px 1px; border-radius: 0; box-shadow: 1px 1px 20px rgba(0,0,0,.15); background-color: #fff;} .layui-table-edit{position: absolute; left: 0; top: 0; z-index: 900; min-width: 100%; min-height: 100%; padding: 5px 14px; border-radius: 0; box-shadow: 1px 1px 20px rgba(0,0,0,.15); background-color: #fff;}
.layui-table-edit:focus{border-color: #5FB878!important;} .layui-table-edit:focus{border-color: #5FB878!important;}
select.layui-table-edit{padding: 0 0 0 10px; border-color: #d2d2d2;} select.layui-table-edit{padding: 0 0 0 10px; border-color: #d2d2d2;}
.layui-table-view .layui-form-switch, .layui-table-view .layui-form-switch,

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 12 KiB

View File

@@ -177,3 +177,49 @@ html #layuicss-layer{display: none; position: absolute; width: 1989px;}
} }
/* 下面是添加的新的加载动画 */
.loading {
width: 83px;
height: 83px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-filter: url("#goo");
filter: url("#goo");
}
.loading span {
width: 100%;
text-align: center;
color: linear-gradient(to right, #92fe9d 0%, #00c9ff 100%);
font-weight: bold;
text-transform: uppercase;
font-size: 15px;
letter-spacing: 1px;
position: absolute;
left: 1px;
top: 46%;
}
.loading:before, .loading:after {
content: '';
border-radius: 50%;
background-color: rgb(22, 120, 160);
width: 26px;
height: 26px;
position: absolute;
left: 72px;
top: 8px;
animation: rotate 6s linear;
animation-iteration-count: infinite;
transform-origin: 12px 76px;
}
.loading:before {
box-shadow: 45px 19px 0px 0px rgb(22, 120, 160), 62px 63px 0px 0px rgb(22, 120, 160), 45px 107px 0px 0px rgb(22, 120, 160), 0px 126px 0px 0px rgb(22, 120, 160), -46px 107px 0px 0px rgb(22, 120, 160), -63px 63px 0px 0px rgb(22, 120, 160), -46px 19px 0px 0px rgb(22, 120, 160);
}
.loading:after {
animation-direction: reverse;
}
@keyframes rotate {
0% { transform: rotate(0deg); }
100% { transform: rotate(-360deg); }
}

View File

@@ -15,7 +15,7 @@
} }
,Layui = function(){ ,Layui = function(){
this.v = '2.7.0'; // layui 版本号 this.v = '2.7.1'; // layui 版本号
} }
//识别预先可能定义的指定全局对象 //识别预先可能定义的指定全局对象
@@ -701,6 +701,93 @@
desc && clone.reverse(); // 倒序 desc && clone.reverse(); // 倒序
return clone; return clone;
}; };
// 不复制 将数组中的成员对象按照某个 key 的 value 值进行排序
Layui.prototype.thissort = function(arr, key, desc){
var that = this
,clone = (arr || []);
// 若未传入 key则直接返回原对象
if(that.type(arr) === 'object' && !key){
return clone;
} else if(typeof arr !== 'object'){ //若 arr 非对象
return [clone];
}
// 开始排序
clone.sort(function(o1, o2){
var v1 = o1[key]
,v2 = o2[key];
/*
* 特殊数据
* 若比较的成员均非对象
*/
// 若比较的成员均为数字
if(!isNaN(o1) && !isNaN(o2)) return o1 - o2;
// 若比较的成员只存在某一个非对象
if(!isNaN(o1) && isNaN(o2)){
if(key && typeof o2 === 'object'){
v1 = o1;
} else {
return -1;
}
} else if (isNaN(o1) && !isNaN(o2)){
if(key && typeof o1 === 'object'){
v2 = o2;
} else {
return 1;
}
}
/*
* 正常数据
* 即成员均为对象,也传入了对比依据: key
* 若 value 为数字,按「大小」排序;若 value 非数字,则按「字典序」排序
*/
// value 是否为数字
var isNum = [!isNaN(v1), !isNaN(v2)];
// 若为数字比较
if(isNum[0] && isNum[1]){
if(v1 && (!v2 && v2 !== 0)){ //数字 vs 空
return 1;
} else if((!v1 && v1 !== 0) && v2){ //空 vs 数字
return -1;
} else { //数字 vs 数字
return v1 - v2;
}
};
/**
* 字典序排序
*/
// 若为非数字比较
if(!isNum[0] && !isNum[1]){
// 字典序比较
if(v1 > v2){
return 1;
} else if (v1 < v2) {
return -1;
} else {
return 0;
}
}
// 若为混合比较
if(isNum[0] || !isNum[1]){ //数字 vs 非数字
return -1;
} else if(!isNum[0] || isNum[1]) { //非数字 vs 数字
return 1;
}
});
desc && clone.reverse(); // 倒序
return clone;
};
//阻止事件冒泡 //阻止事件冒泡
Layui.prototype.stope = function(thisEvent){ Layui.prototype.stope = function(thisEvent){

View File

@@ -450,7 +450,12 @@ layui.define('layer', function(exports){
hideDown(true); hideDown(true);
return false; return false;
}); });
dds.on('mousedown',(events)=>{
events.stopPropagation()
});
dds.on('mouseup',(events)=>{
events.stopPropagation()
});
reElem.find('dl>dt').on('click', function(e){ reElem.find('dl>dt').on('click', function(e){
return false; return false;
}); });

View File

@@ -205,6 +205,7 @@ var Class = function(setings){
var that = this, creat = function(){ var that = this, creat = function(){
that.creat(); that.creat();
}; };
that.yesStatus = true
that.index = ++layer.index; that.index = ++layer.index;
that.config.maxWidth = $(win).width() - 15*2; //初始最大宽度:当前屏幕宽,左右留 15px 边距 that.config.maxWidth = $(win).width() - 15*2; //初始最大宽度:当前屏幕宽,左右留 15px 边距
that.config = $.extend({}, that.config, ready.config, setings); that.config = $.extend({}, that.config, ready.config, setings);
@@ -253,7 +254,13 @@ Class.pt.vessel = function(conType, callback){
var titleHTML = (config.title ? '<div class="layui-layer-title" style="'+ (titype ? config.title[1] : '') +'">' var titleHTML = (config.title ? '<div class="layui-layer-title" style="'+ (titype ? config.title[1] : '') +'">'
+ (titype ? config.title[0] : config.title) + (titype ? config.title[0] : config.title)
+ '</div>' : ''); + '</div>' : '');
var lodingf = function (){
if(config.type != 3){
return '<div id="'+ (config.id||'') +'" class="layui-layer-content'+ ((config.type == 0 && config.icon !== -1) ? ' layui-layer-padding' :'') + (config.type == 3 ? ' layui-layer-loading'+config.icon : '') +'">'
}else{
return `<div id="${config.id||''}" style="scale: 0.5"><div class="loading"> </div> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <defs> <filter id="goo"> <feGaussianBlur in="SourceGraphic" stdDeviation="6.3" result="blur" /> <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 14 -4" result="goo" /> <feBlend in="SourceGraphic" in2="goo" /> </filter> </defs> </svg>`
}
}
config.zIndex = zIndex; config.zIndex = zIndex;
callback([ callback([
//遮罩 //遮罩
@@ -262,7 +269,7 @@ Class.pt.vessel = function(conType, callback){
//主体 //主体
'<div class="'+ doms[0] + (' layui-layer-'+ready.type[config.type]) + (((config.type == 0 || config.type == 2) && !config.shade) ? ' layui-layer-border' : '') + ' ' + (config.skin||'') +'" id="'+ doms[0] + times +'" type="'+ ready.type[config.type] +'" times="'+ times +'" showtime="'+ config.time +'" conType="'+ (conType ? 'object' : 'string') +'" style="z-index: '+ zIndex +'; width:'+ config.area[0] + ';height:' + config.area[1] + ';position:'+ (config.fixed ? 'fixed;' : 'absolute;') +'">' '<div class="'+ doms[0] + (' layui-layer-'+ready.type[config.type]) + (((config.type == 0 || config.type == 2) && !config.shade) ? ' layui-layer-border' : '') + ' ' + (config.skin||'') +'" id="'+ doms[0] + times +'" type="'+ ready.type[config.type] +'" times="'+ times +'" showtime="'+ config.time +'" conType="'+ (conType ? 'object' : 'string') +'" style="z-index: '+ zIndex +'; width:'+ config.area[0] + ';height:' + config.area[1] + ';position:'+ (config.fixed ? 'fixed;' : 'absolute;') +'">'
+ (conType && config.type != 2 ? '' : titleHTML) + (conType && config.type != 2 ? '' : titleHTML)
+ '<div id="'+ (config.id||'') +'" class="layui-layer-content'+ ((config.type == 0 && config.icon !== -1) ? ' layui-layer-padding' :'') + (config.type == 3 ? ' layui-layer-loading'+config.icon : '') +'">' + lodingf() // 这行是中间加载
+ (config.type == 0 && config.icon !== -1 ? '<i class="layui-layer-ico layui-layer-ico'+ config.icon +'"></i>' : '') + (config.type == 0 && config.icon !== -1 ? '<i class="layui-layer-ico layui-layer-ico'+ config.icon +'"></i>' : '')
+ (config.type == 1 && conType ? '' : (config.content||'')) + (config.type == 1 && conType ? '' : (config.content||''))
+ '</div>' + '</div>'
@@ -677,11 +684,21 @@ Class.pt.callback = function(){
} }
} }
layer.ie == 6 && that.IE6(layero); layer.ie == 6 && that.IE6(layero);
// 节流函数
//按钮 //按钮
// 按钮的事件在这里
layero.find('.'+ doms[6]).children('a').on('click', function(){ layero.find('.'+ doms[6]).children('a').on('click', function(){
var index = $(this).index(); var index = $(this).index();
if(index === 0){ if(index === 0){
if(that.yesStatus){
that.yesStatus = false
setTimeout(()=>{
that.yesStatus = true
},1000)
}else{
return
}
if(config.yes){ if(config.yes){
config.yes(that.index, layero) config.yes(that.index, layero)
} else if(config['btn1']){ } else if(config['btn1']){

View File

@@ -30,9 +30,9 @@ layui.define('jquery', function(exports){
,options = that.config; ,options = that.config;
return { return {
setValue: function(value, index){ //设置值 setValue: function(value, index,s){ //设置值
options.value = value; options.value = value;
return that.slide('set', value, index || 0); return that.slide('set', value, index || 0,s);
} }
,config: options ,config: options
} }
@@ -47,6 +47,7 @@ layui.define('jquery', function(exports){
that.index = ++slider.index; that.index = ++slider.index;
that.config = $.extend({}, that.config, slider.config, options); that.config = $.extend({}, that.config, slider.config, options);
that.render(); that.render();
that.anxia = false;
}; };
//默认配置 //默认配置
@@ -206,7 +207,7 @@ layui.define('jquery', function(exports){
}; };
//滑块滑动 //滑块滑动
Class.prototype.slide = function(setValue, value, i){ Class.prototype.slide = function(setValue, value, i,s){
var that = this var that = this
,options = that.config ,options = that.config
,sliderAct = that.elemTemp ,sliderAct = that.elemTemp
@@ -217,7 +218,7 @@ layui.define('jquery', function(exports){
,sliderTxt = sliderAct.next('.' + SLIDER_INPUT) ,sliderTxt = sliderAct.next('.' + SLIDER_INPUT)
,inputValue = sliderTxt.children('.' + SLIDER_INPUT_TXT).children('input').val() ,inputValue = sliderTxt.children('.' + SLIDER_INPUT_TXT).children('input').val()
,step = 100 / ((options.max - options.min) / Math.ceil(options.step)) ,step = 100 / ((options.max - options.min) / Math.ceil(options.step))
,change = function(offsetValue, index){ ,change = function(offsetValue, index,s){
if(Math.ceil(offsetValue) * step > 100){ if(Math.ceil(offsetValue) * step > 100){
offsetValue = Math.ceil(offsetValue) * step offsetValue = Math.ceil(offsetValue) * step
}else{ }else{
@@ -259,7 +260,7 @@ layui.define('jquery', function(exports){
} }
//回调 //回调
options.change && options.change(options.range ? arrValue : selfValue); options.change && options.change(options.range ? arrValue : selfValue,selfValue,s);
} }
,valueTo = function(value){ ,valueTo = function(value){
var oldLeft = value / sliderWidth() * 100 / step var oldLeft = value / sliderWidth() * 100 / step
@@ -283,7 +284,7 @@ layui.define('jquery', function(exports){
}; };
//动态赋值 //动态赋值
if(setValue === 'set') return change(value, i); if(setValue === 'set') return change(value, i,s);
//滑块滑动 //滑块滑动
sliderAct.find('.' + SLIDER_WRAP_BTN).each(function(index){ sliderAct.find('.' + SLIDER_WRAP_BTN).each(function(index){
@@ -304,7 +305,7 @@ layui.define('jquery', function(exports){
if(left < 0)left = 0; if(left < 0)left = 0;
if(left > sliderWidth())left = sliderWidth(); if(left > sliderWidth())left = sliderWidth();
var reaLeft = left / sliderWidth() * 100 / step; var reaLeft = left / sliderWidth() * 100 / step;
change(reaLeft, index); change(reaLeft, index,2);
othis.addClass(ELEM_HOVER); othis.addClass(ELEM_HOVER);
sliderAct.find('.' + SLIDER_TIPS).show(); sliderAct.find('.' + SLIDER_TIPS).show();
e.preventDefault(); e.preventDefault();
@@ -336,11 +337,46 @@ layui.define('jquery', function(exports){
}else{ }else{
index = 0; index = 0;
}; };
change(reaLeft, index); // console.log(reaLeft,left,step)
change(reaLeft, index,true);
e.preventDefault(); e.preventDefault();
} }
}); });
// 拖动滑块
sliderAct.find('.' + SLIDER_BAR).on("mousemove",function (e){
if(!that.anxia){
return
}
return
var main = $('.' + SLIDER_WRAP_BTN);
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;
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;
}
}else{
index = 0;
};
console.log(reaLeft,left,step)
change(reaLeft, index);
e.preventDefault();
}
})
sliderAct.find('.' + SLIDER_BAR).on("mousedown",function (){
that.anxia = true
})
sliderAct.find('.' + SLIDER_BAR).on("mouseup",function (){
that.anxia = false
})
sliderAct.find('.' + SLIDER_BAR).on("click",function (e){
e.preventDefault();
})
//点击加减输入框 //点击加减输入框
sliderTxt.children('.' + SLIDER_INPUT_BTN).children('i').each(function(index){ sliderTxt.children('.' + SLIDER_INPUT_BTN).children('i').each(function(index){
$(this).on('click', function(){ $(this).on('click', function(){

View File

@@ -20,10 +20,12 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
config: { config: {
checkName: 'LAY_CHECKED' //是否选中状态的字段名 checkName: 'LAY_CHECKED' //是否选中状态的字段名
,indexName: 'LAY_TABLE_INDEX' //初始下标索引名,用于恢复排序 ,indexName: 'LAY_TABLE_INDEX' //初始下标索引名,用于恢复排序
,disabledName: 'LAY_DISABLED'
} //全局配置项 } //全局配置项
,cache: {} //数据缓存 ,cache: {} //数据缓存
,allData:[] // 全部数据
,index: layui.table ? (layui.table.index + 10000) : 0 ,index: layui.table ? (layui.table.index + 10000) : 0
,winResiz:[]
//设置全局项 //设置全局项
,set: function(options){ ,set: function(options){
var that = this; var that = this;
@@ -42,7 +44,6 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
var that = this var that = this
,options = that.config ,options = that.config
,id = options.id || options.index; ,id = options.id || options.index;
if(id){ if(id){
thisTable.that[id] = that; //记录当前实例对象 thisTable.that[id] = that; //记录当前实例对象
thisTable.config[id] = options; //记录当前实例配置项 thisTable.config[id] = options; //记录当前实例配置项
@@ -61,6 +62,17 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
} }
,resize: function(){ //重置表格尺寸/结构 ,resize: function(){ //重置表格尺寸/结构
that.resize.call(that); that.resize.call(that);
},
getData: function(){
// return JSON.parse(JSON.stringify(that.config.data))
return that.config.data
},
mergeData:function(id,data,index){
table.mergeData(id,data,index)
},
// 设置列宽调整后的回调
onColumnsWidth: function(fun){
that.config.onColumnsWidth = fun;
} }
} }
} }
@@ -233,11 +245,13 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
,' }' ,' }'
,'{{# });' ,'{{# });'
,'}); }}' ,'}); }}'
,'{{# if(d.data.lineStyle){ }}' ,'{{# if(d.data.lineStyle){'
,'.layui-table-view-{{= d.index }} .layui-table-body .layui-table .layui-table-cell{' ,'var cellClassName = ".layui-table-view-"+ d.index +" .layui-table-body .layui-table .layui-table-cell";'
,' display: -webkit-box; -webkit-box-align: center; display: -moz-box; -moz-box-align: center; white-space: normal; {{- d.data.lineStyle }} ' ,'}}'
,'{{= cellClassName }}{'
,'display: -webkit-box; -webkit-box-align: center; white-space: normal; {{- d.data.lineStyle }} '
,'}' ,'}'
,'.layui-table-view-{{= d.index }} .layui-table-body .layui-table .layui-table-cell:hover{overflow: auto;}' ,'{{= cellClassName }}:hover{overflow: auto;}'
,'{{# } }}' ,'{{# } }}'
,'{{# if(d.data.css){ }}' ,'{{# if(d.data.css){ }}'
,'{{- d.data.css }}' ,'{{- d.data.css }}'
@@ -250,7 +264,9 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
//构造器 //构造器
,Class = function(options){ ,Class = function(options){
var that = this; var that = this;
that.reanderTime = new Date().getTime()
that.index = ++table.index; that.index = ++table.index;
that.config = $.extend({}, that.config, table.config, options); that.config = $.extend({}, that.config, table.config, options);
that.render(); that.render();
@@ -265,6 +281,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
,editTrigger: 'click' //单元格编辑的事件触发方式 ,editTrigger: 'click' //单元格编辑的事件触发方式
,defaultToolbar: ['filter', 'exports', 'print'] //工具栏右侧图标 ,defaultToolbar: ['filter', 'exports', 'print'] //工具栏右侧图标
,autoSort: true //是否前端自动排序。如果否,则需自主排序(通常为服务端处理好排序) ,autoSort: true //是否前端自动排序。如果否,则需自主排序(通常为服务端处理好排序)
,sortCallback:function(){}
,text: { ,text: {
none: '无数据' none: '无数据'
} }
@@ -347,13 +364,18 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
options.index = that.index; options.index = that.index;
that.key = options.id || options.index; that.key = options.id || options.index;
table.allData[that.key] = options.data
// 添加到全局渲染中为了全局resize防止内存泄漏
table.winResiz[that.key] = that
//生成替代元素 //生成替代元素
hasRender[0] && hasRender.remove(); //如果已经渲染则Rerender hasRender[0] && hasRender.remove(); //如果已经渲染则Rerender
othis.after(reElem); othis.after(reElem);
//各级容器 //各级容器
that.layTool = reElem.find(ELEM_TOOL); that.layTool = reElem.find(ELEM_TOOL);
that.layBorderBox = reElem;
that.layBox = reElem.find(ELEM_BOX); that.layBox = reElem.find(ELEM_BOX);
that.layHeader = reElem.find(ELEM_HEADER); that.layHeader = reElem.find(ELEM_HEADER);
that.layMain = reElem.find(ELEM_MAIN); that.layMain = reElem.find(ELEM_MAIN);
@@ -429,7 +451,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
if(type === 'width') return options.clientWidth; if(type === 'width') return options.clientWidth;
// 初始化 css 参数 // 初始化 css 参数
if(options.css){ if(options.css && options.css.indexOf(ELEM_VIEW) === -1){
var css = options.css.split('}'); var css = options.css.split('}');
layui.each(css, function(index, value){ layui.each(css, function(index, value){
if(value){ if(value){
@@ -734,7 +756,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
//对参数进行深度或浅扩展 //对参数进行深度或浅扩展
that.config = $.extend(deep, {}, that.config, options); that.config = $.extend(deep, {}, that.config, options);
table.allData[that.key] = that.config.data
//执行渲染 //执行渲染
that.render(type); that.render(type);
}; };
@@ -756,13 +778,13 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
that.layMain.append(that.layNone = layNone); that.layMain.append(that.layNone = layNone);
// 异常情况下对page和total的内容处理 // 异常情况下对page和total的内容处理
that.layPage && that.layPage.addClass(HIDE).find('>div').html(''); that.layPage && that.layPage.addClass(HIDE_V).find('>div').html('');
that.layTotal && that.layTotal.addClass(HIDE).find('tbody').html(''); that.layTotal && that.layTotal.addClass(HIDE_V).find('tbody').html('');
table.cache[that.key] = []; //格式化缓存数据 table.cache[that.key] = []; //格式化缓存数据
}; };
//页码 // 初始页码
Class.prototype.page = 1; Class.prototype.page = 1;
//获得数据 //获得数据
@@ -896,7 +918,6 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
if(item3.templet) attr.push('data-content="'+ content +'"'); //自定义模板 if(item3.templet) attr.push('data-content="'+ content +'"'); //自定义模板
if(item3.toolbar) attr.push('data-off="true"'); //行工具列关闭单元格事件 if(item3.toolbar) attr.push('data-off="true"'); //行工具列关闭单元格事件
if(item3.event) attr.push('lay-event="'+ item3.event +'"'); //自定义事件 if(item3.event) attr.push('lay-event="'+ item3.event +'"'); //自定义事件
if(item3.style) attr.push('style="'+ item3.style +'"'); //自定义样式
if(item3.minWidth) attr.push('data-minwidth="'+ item3.minWidth +'"'); //单元格最小宽度 if(item3.minWidth) attr.push('data-minwidth="'+ item3.minWidth +'"'); //单元格最小宽度
return attr.join(' '); return attr.join(' ');
}() +' class="'+ function(){ //追加样式 }() +' class="'+ function(){ //追加样式
@@ -908,31 +929,52 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
,'<div class="layui-table-cell laytable-cell-'+ function(){ //返回对应的CSS类标识 ,'<div class="layui-table-cell laytable-cell-'+ function(){ //返回对应的CSS类标识
return item3.type === 'normal' ? key return item3.type === 'normal' ? key
: (key + ' laytable-cell-' + item3.type); : (key + ' laytable-cell-' + item3.type);
}() +'"'+ (item3.align ? ' align="'+ item3.align +'"' : '') +'>' + function(){ }() +'"'
+ (item3.align ? ' align="'+ item3.align +'"' : '')
+ function(){
var attr = [];
if(item3.style) attr.push('style="'+ item3.style +'"'); //自定义单元格样式
return attr.join(' ');
}() +'>'
+ function(){
var tplData = $.extend(true, { var tplData = $.extend(true, {
LAY_INDEX: numbers LAY_INDEX: numbers
,LAY_COL: item3 ,LAY_COL: item3
}, item1) }, item1)
,checkName = table.config.checkName; ,checkName = table.config.checkName
,disabledName = table.config.disabledName;
//渲染不同风格的列 //渲染不同风格的列
switch(item3.type){ switch(item3.type){
case 'checkbox': case 'checkbox': // 复选
return '<input type="checkbox" name="layTableCheckbox" lay-skin="primary" '+ function(){ return '<input type="checkbox" name="layTableCheckbox" lay-skin="primary" '+ function(){
// 其他属性
var arr = [];
//如果是全选 //如果是全选
if(item3[checkName]){ if(item3[checkName]){
item1[checkName] = item3[checkName]; item1[checkName] = item3[checkName];
return item3[checkName] ? 'checked' : ''; if(item3[checkName]) arr[0] = 'checked';
} }
return tplData[checkName] ? 'checked' : ''; if(tplData[checkName]) arr[0] = 'checked';
// 禁选
if(tplData[disabledName]) arr.push('disabled');
return arr.join(' ');
}() +'>'; }() +'>';
break; break;
case 'radio': case 'radio': // 单选
if(tplData[checkName]){ if(tplData[checkName]){
thisCheckedRowIndex = i1; thisCheckedRowIndex = i1;
} }
return '<input type="radio" name="layTableRadio_'+ options.index +'" ' return '<input type="radio" name="layTableRadio_'+ options.index +'" '
+ (tplData[checkName] ? 'checked' : '') +' lay-type="layTableRadio">'; + function(){
var arr = [];
if(tplData[checkName]) arr[0] = 'checked';
if(tplData[disabledName]) arr.push('disabled');
return arr.join(' ');
}() +' lay-type="layTableRadio">';
break; break;
case 'numbers': case 'numbers':
return numbers; return numbers;
@@ -961,7 +1003,12 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
trs_fixed_r.push('<tr data-index="'+ i1 +'">'+ tds_fixed_r.join('') + '</tr>'); trs_fixed_r.push('<tr data-index="'+ i1 +'">'+ tds_fixed_r.join('') + '</tr>');
}); });
// 容器的滚动条位置复位
that.layBody.scrollTop(0); that.layBody.scrollTop(0);
if(options.resetScrollbar){
that.layBody.scrollLeft(0);
}
that.layMain.find('.'+ NONE).remove(); that.layMain.find('.'+ NONE).remove();
that.layMain.find('tbody').html(trs.join('')); that.layMain.find('tbody').html(trs.join(''));
that.layFixLeft.find('tbody').html(trs_fixed.join('')); that.layFixLeft.find('tbody').html(trs_fixed.join(''));
@@ -982,6 +1029,14 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
//同步表头父列的相关值 //同步表头父列的相关值
options.HAS_SET_COLS_PATCH || that.setColsPatch(); options.HAS_SET_COLS_PATCH || that.setColsPatch();
options.HAS_SET_COLS_PATCH = true; options.HAS_SET_COLS_PATCH = true;
// 判断是否需要执行排序回调
if(sort){
try{
that.config.sortCallback.call(that.config,res, curr, count, sort)
}catch (e) {
console.error(e)
}
}
}; };
table.cache[that.key] = data; //记录数据 table.cache[that.key] = data; //记录数据
@@ -990,7 +1045,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
//that.layPage[(count == 0 || (data.length === 0 && curr == 1)) ? 'addClass' : 'removeClass'](HIDE); //that.layPage[(count == 0 || (data.length === 0 && curr == 1)) ? 'addClass' : 'removeClass'](HIDE);
//显示隐藏合计栏 //显示隐藏合计栏
that.layTotal[data.length == 0 ? 'addClass' : 'removeClass'](HIDE_V);; that.layTotal[data.length == 0 ? 'addClass' : 'removeClass'](HIDE_V);
//显示隐藏分页栏 //显示隐藏分页栏
if(!options.pagebar){ if(!options.pagebar){
@@ -1011,12 +1066,14 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
//如果执行初始排序 //如果执行初始排序
if(sort){ if(sort){
return render(); return render();
} }
//正常初始化数据渲染 //正常初始化数据渲染
render(); //渲染数据 render(); //渲染数据
that.renderTotal(data, totalRowData); //数据合计 // 传data 合计当前页 传 全部data 合计全部页
that.renderTotal(that.config.data, totalRowData); //数据合计
that.layTotal && that.layTotal.removeClass(HIDE); that.layTotal && that.layTotal.removeClass(HIDE);
//同步分页状态 //同步分页状态
@@ -1077,7 +1134,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
//td 内容 //td 内容
var content = function(){ var content = function(){
var text = item3.totalRowText || '' var text = item3.totalRowText || ''
,decimals = item3.totalRowDecimals || 2 ,decimals = 'totalRowDecimals' in item3 ? item3.totalRowDecimals : 2
,thisTotalNum = parseFloat(totalNums[field]).toFixed(decimals) ,thisTotalNum = parseFloat(totalNums[field]).toFixed(decimals)
,tplData = {} ,tplData = {}
,getContent; ,getContent;
@@ -1097,7 +1154,6 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
,td = ['<td data-field="'+ field +'" data-key="'+ options.index + '-'+ item3.key +'" '+ function(){ ,td = ['<td data-field="'+ field +'" data-key="'+ options.index + '-'+ item3.key +'" '+ function(){
var attr = []; var attr = [];
if(item3.align) attr.push('align="'+ item3.align +'"'); //对齐方式 if(item3.align) attr.push('align="'+ item3.align +'"'); //对齐方式
if(item3.style) attr.push('style="'+ item3.style +'"'); //自定义样式
if(item3.minWidth) attr.push('data-minwidth="'+ item3.minWidth +'"'); //单元格最小宽度 if(item3.minWidth) attr.push('data-minwidth="'+ item3.minWidth +'"'); //单元格最小宽度
return attr.join(' '); return attr.join(' ');
}() +' class="'+ function(){ //追加样式 }() +' class="'+ function(){ //追加样式
@@ -1110,13 +1166,18 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
var str = (options.index + '-' + item3.key); var str = (options.index + '-' + item3.key);
return item3.type === 'normal' ? str return item3.type === 'normal' ? str
: (str + ' laytable-cell-' + item3.type); : (str + ' laytable-cell-' + item3.type);
}() +'">' + function(){ }() +'"'+ function(){
var attr = [];
if(item3.style) attr.push('style="'+ item3.style +'"'); //自定义单元格样式
return attr.join(' ');
}() +'>' + function(){
var totalRow = item3.totalRow || options.totalRow; var totalRow = item3.totalRow || options.totalRow;
//如果 totalRow 参数为字符类型,则解析为自定义模版 //如果 totalRow 参数为字符类型,则解析为自定义模版
if(typeof totalRow === 'string'){ if(typeof totalRow === 'string'){
return laytpl(totalRow).render($.extend({ return laytpl(totalRow).render($.extend({
TOTAL_NUMS: content TOTAL_NUMS: totalNums[field]
}, item3)) }, item3));
} }
return content; return content;
}() }()
@@ -1205,24 +1266,27 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
//默认为前端自动排序。如果否,则需自主排序(通常为服务端处理好排序) //默认为前端自动排序。如果否,则需自主排序(通常为服务端处理好排序)
if(options.autoSort){ if(options.autoSort){
if(type === 'asc'){ //升序 if(type === 'asc'){ //升序
thisData = layui.sort(data, field); thisData = layui.thissort(data, field);
} else if(type === 'desc'){ //降序 } else if(type === 'desc'){ //降序
thisData = layui.sort(data, field, true); thisData = layui.thissort(data, field, true);
} else { //清除排序 } else { //清除排序
thisData = layui.sort(data, table.config.indexName); thisData = layui.thissort(data, table.config.indexName);
delete that.sortKey; delete that.sortKey;
} }
} }
res[options.response.dataName] = thisData || data; res[options.response.dataName] = thisData || data;
that.renderData(res, that.page, that.count, true); that.renderData(res, that.page, that.count, true);
// table.cache[that.key] = thisData
if(formEvent){ if(formEvent){
layui.event.call(th, MOD_NAME, 'sort('+ filter +')', { options.initSort = {
field: field field: field
,type: type ,type: type
}); };
layui.event.call(th, MOD_NAME, 'sort('+ filter +')', options.initSort);
} }
// if(this)
this.config.afterSort && this.config.afterSort()
}; };
//请求loading //请求loading
@@ -1253,7 +1317,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
thisData[index][options.checkName] = checked; thisData[index][options.checkName] = checked;
}; };
//同步全选按钮状态 // 同步全选按钮状态
Class.prototype.syncCheckAll = function(){ Class.prototype.syncCheckAll = function(){
var that = this var that = this
,options = that.config ,options = that.config
@@ -1303,7 +1367,6 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
,options = that.config ,options = that.config
,height = options.height ,height = options.height
,bodyHeight; ,bodyHeight;
if(that.fullHeightGap){ if(that.fullHeightGap){
height = _WIN.height() - that.fullHeightGap; height = _WIN.height() - that.fullHeightGap;
if(height < 135) height = 135; if(height < 135) height = 135;
@@ -1329,6 +1392,13 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
if(options.page){ if(options.page){
bodyHeight -= (that.layPage.outerHeight() || 41); bodyHeight -= (that.layPage.outerHeight() || 41);
} }
// 减去筛选插件高度
if(this.layBorderBox.find(".soul-bottom-contion")[0]){
bodyHeight -= (this.layBorderBox.find(".soul-bottom-contion")[0].offsetHeight || 31);
}
let h = bodyHeight - 2 - parseFloat(that.layMain.css('height'));
// that.layBody.css("height", parseFloat(that.layBody.css("height")) + h);
// that.layBorderBox.css("height", parseFloat(that.layBorderBox.css("height")) + h);
that.layMain.css('height', bodyHeight - 2); that.layMain.css('height', bodyHeight - 2);
}; };
@@ -1559,12 +1629,12 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
e.preventDefault(); e.preventDefault();
dict.resizeStart = true; //开始拖拽 dict.resizeStart = true; //开始拖拽
dict.offset = [e.clientX, e.clientY]; //记录初始坐标 dict.offset = [e.clientX, e.clientY]; //记录初始坐标
that.getCssRule(key, function(item){ that.getCssRule(key, function(item){
var width = item.style.width || othis.outerWidth(); var width = item.style.width || othis.outerWidth();
dict.rule = item; dict.rule = item;
dict.ruleWidth = parseFloat(width); dict.ruleWidth = parseFloat(width);
dict.minWidth = othis.data('minwidth') || options.cellMinWidth; dict.minWidth = othis.data('minwidth') || options.cellMinWidth;
dict.target = othis[0]
}); });
} }
}); });
@@ -1583,6 +1653,16 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
} }
}).on('mouseup', function(e){ }).on('mouseup', function(e){
if(dict.resizeStart){ if(dict.resizeStart){
// 处理宽度
for(let j of that.config.cols){
for(let i of j){
if(i.field == dict.target.dataset.field){
i.width = dict.target.clientWidth
}
}
}
that.config.onColumnsWidth && that.config.onColumnsWidth(that.config.cols)
if (layui.soulTable) { layui.soulTable.fixTableRemember(that.config, dict) } //拖动列宽 记忆开启
dict = {}; dict = {};
_BODY.css('cursor', ''); _BODY.css('cursor', '');
that.scrollPatch(); that.scrollPatch();
@@ -1683,6 +1763,8 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
,checked = checkbox[0].checked ,checked = checkbox[0].checked
,isAll = checkbox.attr('lay-filter') === 'layTableAllChoose'; ,isAll = checkbox.attr('lay-filter') === 'layTableAllChoose';
if(checkbox[0].disabled) return;
//全选 //全选
if(isAll){ if(isAll){
childs.each(function(i, item){ childs.each(function(i, item){
@@ -1696,10 +1778,15 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
that.syncCheckAll(); that.syncCheckAll();
} }
layui.event.call(checkbox[0], MOD_NAME, 'checkbox('+ filter +')', commonMember.call(checkbox[0], { // 事件
checked: checked layui.event.call(
,type: isAll ? 'all' : 'one' checkbox[0],
})); MOD_NAME, 'checkbox('+ filter +')',
commonMember.call(checkbox[0], {
checked: checked,
type: isAll ? 'all' : 'one'
})
);
}); });
//单选框选择 //单选框选择
@@ -1912,10 +1999,10 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
layer.close(that.tipsIndex); layer.close(that.tipsIndex);
}); });
//自适应 // //自适应
_WIN.on('resize', function(){ // _WIN.on('resize', function(){
that.resize(); // that.resize();
}); // });
}; };
//一次性事件 //一次性事件
@@ -2067,6 +2154,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
,invalidNum = 0 ,invalidNum = 0
,arr = [] ,arr = []
,data = table.cache[id] || []; ,data = table.cache[id] || [];
//计算全选个数 //计算全选个数
layui.each(data, function(i, item){ layui.each(data, function(i, item){
if(layui.type(item) === 'array'){ if(layui.type(item) === 'array'){
@@ -2075,8 +2163,10 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
} }
if(item[table.config.checkName]){ if(item[table.config.checkName]){
nums++; nums++;
if(!item[table.config.disabledName]){
arr.push(table.clearCacheKey(item)); arr.push(table.clearCacheKey(item));
} }
}
}); });
return { return {
data: arr //选中的数据 data: arr //选中的数据
@@ -2212,12 +2302,13 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
args[3] = 'reloadData'; args[3] = 'reloadData';
// 过滤与数据无关的参数 // 过滤与数据无关的参数
var dataParams = [ var dataParams = new RegExp('^('+ [
'data', 'url', 'where', 'page', 'limit', 'data', 'url', 'where', 'page', 'limit',
'request', 'response', 'parseData' 'request', 'response', 'parseData'
]; ].join('|') + ')$');
layui.each(args[1], function (key, value) { layui.each(args[1], function (key, value) {
if(dataParams.indexOf(key) === -1){ if(!dataParams.test(key)){
delete args[1][key]; delete args[1][key];
} }
}); });
@@ -2225,6 +2316,50 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
return table.reload.apply(null, args); return table.reload.apply(null, args);
}; };
// 仅仅合并数据
table.mergeData = function(id,data,index){
var config = getThisTableConfig(id); //获取当前实例配置项
if(!config) return;
var that = thisTable.that[id];
let arr = []
for(let i in data){
if(table.cache[that.key][i]){
arr.push({...table.cache[that.key][i],...data[i]})
}
}
let tr = $(that.layMain).find(`tr[data-index=${index}]`)
layui.each(data[index], function(key, value){
var td = tr.children('td[data-field="'+ key +'"]')
,cell = td.children('.layui-table-cell'); //获取当前修改的列
let d = data[index]
//更新缓存中的数据
that.eachCols(function(i, item3){
//更新相应列视图
if(item3.field == key){
cell.html(parseTempData.call(that, {
item3: item3
,content: value
,tplData: d
}));
td.data('content', value);
} else if(item3.templet || item3.toolbar){ //更新所有其他列的模板
var thisTd = tr.children('td[data-field="'+ (item3.field || i) +'"]')
,content = d[item3.field];
thisTd.children('.layui-table-cell').html(parseTempData.call(that, {
item3: item3
,content: content
,tplData: d
}));
thisTd.data('content', content);
}
});
});
table.cache[that.key] = arr
config.data = arr
}
// 核心入口 // 核心入口
table.render = function(options){ table.render = function(options){
var inst = new Class(options); var inst = new Class(options);
@@ -2236,6 +2371,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
data = $.extend({}, data); data = $.extend({}, data);
delete data[table.config.checkName]; delete data[table.config.checkName];
delete data[table.config.indexName]; delete data[table.config.indexName];
delete data[table.config.disabledName];
return data; return data;
}; };
@@ -2244,6 +2380,17 @@ layui.define(['laytpl', 'laypage', 'layer', 'form', 'util'], function(exports){
table.init(); table.init();
}); });
$(function (){
//自适应
_WIN.on('resize', function(){
// that.resize();
for(let i in table.winResiz){
table.winResiz[i].resize()
}
})
})
exports(MOD_NAME, table); exports(MOD_NAME, table);
}); });

View File

@@ -68,7 +68,7 @@ layui.define(['laytpl', 'form'], function(exports){
obj = obj || {}; obj = obj || {};
return ['<div class="layui-transfer-box" data-index="'+ obj.index +'">' return ['<div class="layui-transfer-box" data-index="'+ obj.index +'">'
,'<div class="layui-transfer-header">' ,'<div class="layui-transfer-header">'
,'<input type="checkbox" name="'+ obj.checkAllName +'" lay-filter="layTransferCheckbox" lay-type="all" lay-skin="primary" title="{{ d.data.title['+ obj.index +'] || \'list'+ (obj.index + 1) +'\' }}">' ,'<input type="checkbox"' + (obj.disAll && obj.disAll.includes(obj.index) ? ' disabled' : '') + ' name="'+ obj.checkAllName +'" lay-filter="layTransferCheckbox" lay-type="all" lay-skin="primary" title="{{ d.data.title['+ obj.index +'] || \'list'+ (obj.index + 1) +'\' }}">'
,'</div>' ,'</div>'
,'{{# if(d.data.showSearch){ }}' ,'{{# if(d.data.showSearch){ }}'
,'<div class="layui-transfer-search">' ,'<div class="layui-transfer-search">'
@@ -81,10 +81,11 @@ layui.define(['laytpl', 'form'], function(exports){
} }
//主模板 //主模板
,TPL_MAIN = ['<div class="layui-transfer layui-form layui-border-box" lay-filter="LAY-transfer-{{ d.index }}">' ,TPL_MAIN = function(option){ return ['<div class="layui-transfer layui-form layui-border-box" lay-filter="LAY-transfer-{{ d.index }}">'
,TPL_BOX({ ,TPL_BOX({
index: 0 index: 0
,checkAllName: 'layTransferLeftCheckAll' ,checkAllName: 'layTransferLeftCheckAll',
disAll: option.disAll
}) })
,'<div class="layui-transfer-active">' ,'<div class="layui-transfer-active">'
,'<button type="button" class="layui-btn layui-btn-sm layui-btn-primary layui-btn-disabled" data-index="0">' ,'<button type="button" class="layui-btn layui-btn-sm layui-btn-primary layui-btn-disabled" data-index="0">'
@@ -98,7 +99,7 @@ layui.define(['laytpl', 'form'], function(exports){
index: 1 index: 1
,checkAllName: 'layTransferRightCheckAll' ,checkAllName: 'layTransferRightCheckAll'
}) })
,'</div>'].join('') ,'</div>'].join('')}
//构造器 //构造器
,Class = function(options){ ,Class = function(options){
@@ -136,7 +137,7 @@ layui.define(['laytpl', 'form'], function(exports){
,options = that.config; ,options = that.config;
//解析模板 //解析模板
var thisElem = that.elem = $(laytpl(TPL_MAIN).render({ var thisElem = that.elem = $(laytpl(TPL_MAIN(options)).render({
data: options data: options
,index: that.index //索引 ,index: that.index //索引
})); }));

View File

@@ -195,9 +195,9 @@ layui.define('form', function(exports){
//节点 //节点
,function(){ ,function(){
if(options.isJump && item.href){ if(options.isJump && item.href){
return '<a href="'+ item.href +'" target="_blank" class="'+ ELEM_TEXT +'">'+ (item.title || item.label || options.text.defaultNodeName) +'</a>'; return '<a href="'+ item.href +'" target="_blank" class="'+ ELEM_TEXT +'"' +` style="${item.fontColor && 'color: ' + item.fontColor}"` + '>'+ (item.title || item.label || options.text.defaultNodeName) +'</a>';
}else{ }else{
return '<span class="'+ ELEM_TEXT + (item.disabled ? ' '+ DISABLED : '') +'">'+ (item.title || item.label || options.text.defaultNodeName) +'</span>'; return '<span class="'+ ELEM_TEXT + (item.disabled ? ' '+ DISABLED : '') + '"' +` style="${item.fontColor && 'color: ' + item.fontColor}"` + '>'+ (item.title || item.label || options.text.defaultNodeName) +'</span>';
} }
}() }()
,'</div>' ,'</div>'

View File

@@ -210,6 +210,7 @@ layui.define('layer' , function(exports){
,contentType: false ,contentType: false
,processData: false ,processData: false
,dataType: 'json' ,dataType: 'json'
,async: false
,headers: options.headers || {} ,headers: options.headers || {}
//成功回调 //成功回调
,success: function(res){ ,success: function(res){