From 95dfe3fe172f6d5ff9c761b0545c4811c2fea3d1 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Tue, 08 Jun 2021 15:02:53 +0800
Subject: [PATCH] 表格点击弹窗事件
---
widgets/searchL/Widget.js | 102 +++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 95 insertions(+), 7 deletions(-)
diff --git a/widgets/searchL/Widget.js b/widgets/searchL/Widget.js
index a2093b9..cbd48e4 100644
--- a/widgets/searchL/Widget.js
+++ b/widgets/searchL/Widget.js
@@ -63,7 +63,9 @@
$('.searchLMain').hide();
})
-
+ $('.cloce').click(() => {
+ $('.popup').css({'display': 'none'})
+ })
},
closeToolBox: function (item) {
@@ -89,11 +91,11 @@
headers: {
'token': token
}
- }).then((res)=>{
- if(res.status == 200){
+ }).then((res) => {
+ if (res.status == 200) {
var data = res.data.data;
that.createData(data);
- }else{
+ } else {
console.log('请求访问失败')
}
})
@@ -101,10 +103,10 @@
}
},
- createData:function(d){
+ createData: function (d) {
var i = 1;
- for(var k in d){
- d[k].tableId = i ++;
+ for (var k in d) {
+ d[k].tableId = i++;
}
var data = d;
this.beginLayUi(data);
@@ -163,6 +165,92 @@
});
+ table.on('tool(test)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
+ var data = obj.data //获得当前行数据
+ ,layEvent = obj.event; //获得 lay-event 对应的值
+ if(layEvent === 'detail'){
+ // layer.msg('查看操作');
+ }
+ window.open("https://www.baidu.com");
+ console.log(obj)
+ });
+
+ table.render({
+ elem: '#test1'
+ // , url: './data'
+ , height: 474
+ , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
+ // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ //,curr: 5 //设定初始在第 5 页
+ , groups: 3 //只显示 1 个连续页码
+ , first: false //不显示首页
+ , last: false //不显示尾页
+ }
+ , cols: [[
+ { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
+ , { field: 'geoName', width: 90, align: 'center', unresize: true, title: '图层名称' }
+ , { field: 'databaseName', width: 95, align: 'center', unresize: true, title: '图层属性1' }
+ , { field: 'serviceUrl', width: 95, align: 'center', unresize: true, title: '图层属性2' }
+ , { fixed: 'right', width: 115, align: 'center', unresize: true, title: '操作', toolbar: '#demoTable1' }
+ ]],
+ data: data,
+ //,skin: 'line' //表格风格
+ even: true
+ // , page: true //是否显示分页
+ , limits: false
+ , limit: 10 //每页默认显示的数量
+
+ });
+ table.on('tool(test1)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
+ var data = obj.data //获得当前行数据
+ ,layEvent = obj.event; //获得 lay-event 对应的值
+ if(layEvent === 'detail'){
+ // layer.msg('查看操作');
+ }
+ $('.popup').css({'display': 'block'});
+ $('.p-main').eq(0).css({'display': 'block'}).siblings().css({'display': 'none'});
+ console.log(obj)
+ });
+
+ table.render({
+ elem: '#test2'
+ // , url: './data'
+ , height: 474
+ , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
+ // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ //,curr: 5 //设定初始在第 5 页
+ , groups: 3 //只显示 1 个连续页码
+ , first: false //不显示首页
+ , last: false //不显示尾页
+ }
+ , cols: [[
+ { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
+ , { field: 'geoName', width: 90, align: 'center', unresize: true, title: '图层名称' }
+ , { field: 'databaseName', width: 95, align: 'center', unresize: true, title: '图层属性1' }
+ , { field: 'serviceUrl', width: 95, align: 'center', unresize: true, title: '图层属性2' }
+ , { fixed: 'right', width: 115, align: 'center', unresize: true, title: '操作', toolbar: '#demoTable2' }
+ ]],
+ data: data,
+ //,skin: 'line' //表格风格
+ even: true
+ // , page: true //是否显示分页
+ , limits: false
+ , limit: 10 //每页默认显示的数量
+
+ });
+ table.on('tool(test2)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
+ var data = obj.data //获得当前行数据
+ ,layEvent = obj.event; //获得 lay-event 对应的值
+ if(layEvent === 'detail'){
+ // layer.msg('查看操作');
+ }
+ $('.popup').css({'display': 'block'});
+ $('.p-main').eq(1).css({'display': 'block'}).siblings().css({'display': 'none'});
+ console.log(obj)
+ });
+
//…
});
},
--
Gitblit v1.9.3