公文传输系统代码
gw.html
点击查看代码
<!DOCTYPE html>
<html>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<head>
<meta charset="utf-8">
<title></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="/static/layui/css/layui.css" tppabs="/static/layui/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="toolbarDemo">
<div>
搜索：
<div class="layui-inline">
<input class="layui-input" id="demoReload" placeholder="请输所属人" autocomplete="off">
</div>
<button class="layui-btn" data-type="reload" id="search">搜索</button>
</div>
<br>
<!-- <button type="button" class="layui-btn layui-btn-danger" lay-event="batchDels"><i class="layui-icon"></i></button><!–删除–>-->
<!-- <button class="layui-btn" id="add">新增</button>-->
<button class="layui-btn layui-btn-hei" lay-submit lay-filter="export" id="s"> <i class="iconfont icon-export"></i> 导出word</button>
<button class="layui-btn" onclick=" window.location.reload();
">刷新</button>
</script>
<script type="text/html" id="barDemo">
<!-- <a class="layui-btn layui-btn-xs" lay-event="edit" id="edit">编辑</a>-->
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script type="text/html" id="img">
<!-- 这里的 checked 的状态只是演示 -->
<img src="https://www.duoxiangpai.com/wp-content/uploads/tupianbd/2/253/3133036867/2807880355.jpg"/>
<!-- <img src="/static/uploadFile/temps/{{d.img}}"/>-->
<!-- <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}>-->
</script>
<script type="text/html" id="img2">
<!-- 这里的 checked 的状态只是演示 -->
<img src="/static/uploadFile/temps/{{d.uimg}}"/>
<!-- <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}>-->
</script>
<script src="/static/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script>
form.on('submit(export)', function (data) {
// var postData = {
// 其他条件： data.field.其他,
// page:1,
// limit: 20000
// } //默认最多导出20000条，自己定，也可不设置分页数量，这样就需要后台添加一个新的查询方法或者写个动态sql
// $.post('/admin/userList', postData, function(res) {
$.post('/admin/userList', function(res) {
if(res.code==0){
table.exportFile('s', res.data, 'docx'); //表名 数据 格式
}else{
layer.msg(res.msg, {icon: 5});
}
})
});
</script>
<script>
var crewJSONData;
layui.use('table', function(){
var table = layui.table;
//温馨提示：默认由前端自动合计当前行数据。从 layui 2.5.6 开始： 若接口直接返回了合计行数据，则优先读取接口合计行数据。
//详见：https://www.layui.com/doc/modules/table.html#totalRow
table.render({ //相当于加载
elem: '#test'
,url:'/admin/gwList'/*tpa=https://www.layuiweb.com/test/table/demo1.json*/
,toolbar: '#toolbarDemo'
,title: '图片管理'
,totalRow: true
,cols: [
[
{type: 'checkbox', fixed: 'left'}
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true, totalRowText: '合计'}
,{field:'uname', title:'所属人', width:120, edit: 'text'}
,{field:'uid', title:'所属人id', width:120, edit: 'text'}
,{field:'file', title:'文件', width:150, edit: 'text', templet: function(res){
return '<a href="/static/uploadFile/temps/'+res.file+'" download="'+res.file+'">'+ res.file +'</a>'
}}
,{field:'state', title:'状态', width:120, edit: 'text'}
,{field:'type', title:'类型', width:120, edit: 'text'}
,{field:'key', title:'密钥', width:120, edit: 'text'}
,{field:'date', title:'创建日期', width:120, edit: 'text'}
,{field:'uname2', title:'发送人', width:120, edit: 'text'}
,{field:'uid2', title:'发送人id', width:120, edit: 'text'}
// ,{field:'balance', title:'余额', width:120, edit: 'text'}
// ,{field:'dz', title:'收货地', width:120, edit: 'text'}
// ,{field:'img', title:'图片', width:120,templet: '#img', edit: 'text'}//传图片首先把templet里面选中body里的某个id
/* ,{field:'email', title:'邮箱', width:150, edit: 'text', templet: function(res){
return '<em>'+ res.email +'</em>'
}}
,{field:'experience', title:'积分', width:80, sort: true, totalRow: true}
,{field:'sex', title:'性别', width:80, edit: 'text', sort: true}
,{field:'logins', title:'登入次数', width:100, sort: true, totalRow: true}
,{field:'sign', title:'签名'}
,{field:'city', title:'城市', width:100}
,{field:'ip', title:'IP', width:120}
,{field:'joinTime', title:'加入时间', width:120}
,{field:'ss', title:'ss', width:120}*/
,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
]
]
,page: true //是否显示分页
,limits: [4,10,15] //每页条数选项
,limit: 4 //每页默认显示的条数
,parseData:function (res){
crewJSONData=res.rows;
console.log(res+" "+JSON.toString(res)+" 2")
}
});
//以下是搜索框进行监测
$('#search').click(function () {
var Nick = $('#demoReload').val();//获取输入框内容
// var date = $('#time').val();
// if($('#demoReload').val()==""){
// layer.msg('查询内容不能为空');
// return false;
// }
table.reload('test', { //table.reload重载数据表格的语法，在文档中有
url: '/admin/gw_search'
// ,methods:"post"
,request: {
pageName: 'page' //页码的参数名称，默认：page
,limitName: 'limit' //每页数据量的参数名，默认：limit
}
,where: {
// 向search_label传送数据
// start: date,
name:Nick,
}
,page: {
curr: 1
}
});
return false;
})
$('#btn .layui-btn').on('click', function(){
var type = $(this).data('type');
active[type] ? active[type].call(this) : '';
});
//点击添加按钮弹窗
$("#add").click(function () {
layui.use('layer', function () {
layer.open({
title: '添加信息',
type: 2,
content: '/admin/toGwAdd',
area: ['800px', '400px'],
maxmin: true
})
})
})
var exportOptions = {
type: 'png', // 指定导出图片的格式，可选值：png, jpg, bmp, gif
fileName: 'example.png', // 自定义导出的文件名
quality: 0.8, // 指定导出图片的质量，可选值：0~1 之间的小数
bgcolor: '#ffffff', // 指定导出图片的背景色
width: 800, // 指定导出图片的宽度
height: 600 // 指定导出图片的高度
};
$("#s").click(function (){
console.log(crewJSONData)
table.exportFile("test",crewJSONData,"docx",exportOptions)
// $.post('/admin/userList', function(res) {
// console.log(res.data)
// table.exportFile("test",res.data,"docx") //表格id,加载的数据，导出格式,
// })
})
//工具栏事件
table.on('toolbar(test)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
case 'getCheckData':
var data = checkStatus.data;
layer.alert(JSON.stringify(data));
break;
case 'getCheckLength':
var data = checkStatus.data;
layer.msg('选中了：'+ data.length + ' 个');
break;
case 'isAll':
layer.msg(checkStatus.isAll ? '全选': '未全选')
break;
case 'batchDels': //批量删除
var data = checkStatus.data;
if(checkStatus.data.length==0){
parent.layer.alert('请先选择要删除的数据行！');
return ;
}
<!--将选中的拼接成字符串-->
var nums = "";
for(var i=0;i<checkStatus.data.length;i++){
nums += checkStatus.data[i].id+",";
}
$.ajax({
url:'/admin/batchDeleteTask',
data:{'nums':nums},
type:'post',
success:function(data){
if(data=="success"){
layer.alert("批量删除成功");
setTimeout('window.location.reload()',3000);
}else{
layer.alert("批量删除失败");
setTimeout('window.location.reload()',1000);
}
}
});
break;
};
});
//监听工具条
table.on('tool(test)', function(obj){
var data = obj.data;
if(obj.event === 'del'){
layer.confirm('真的删除行么', function(index){
// obj.del();
$.ajax({
type: 'post',
url: '/admin/deleteGw',//删除的路径
async:true,
dataType:"json",
data:{
id:data.id, //传一个id过去
},
success: function (data) {
layer.alert('删除成功', {icon: 6, title: '提示', time: 1500})
setTimeout(function () {
window.location.reload();
// window.location.href="index.html";
}, 1500);
},
error: function () {
window.location.reload();
layer.alert('请求失败，系统错误', {icon: 7, title: '提示', time: 1000})
}
})
layer.close(index);
});
}
else if(obj.event === 'edit'){
json = JSON.stringify(data);
layui.use('layer', function () {
layer.open({
title: '修改信息',
type: 2,
content: '/admin/toGwEdit',
area: ['800px', '400px'],
maxmin: true
})
})
}
});
});
</script>
<script>
</script>
<!--<script>
function req(){
$.get("/list",res=>{
$("#test").text()
console.log(res)
})
}
window.setInterval('req()',1000)
</script>-->
</body>
</html>
index.html
点击查看代码
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">-->
<title>后台管理</title>
<link rel="stylesheet" href="/static/layui/css/layui.css">
</head>
<body class="layui-layout-body">
<!-- 顶部区域 -->
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<div class="layui-logo">管理后台</div>
<ul class="layui-nav layui-layout-right">
<li class="layui-nav-item">
<!-- <a href="javascript:;">-->
<!-- <img src="./images/user3.png" class="layui-nav-img">-->
<!-- 小米-->
<!-- </a>-->
<dl class="layui-nav-child">
<dd>
<!--TODO -->
<!--需要修改为自己项目的部分：-->
<!--1、属性data-url（需要在右边选项卡中打开的页面的路径） -->
<!--2、属性data-title（选项卡标题）-->
<!--3、属性data-id必须唯一，tab选项卡根据这个值进行切换-->
<a href="#" data-url="profile" data-title="个人资料" data-id="44" class="site-demo-active"
data-type="tabAdd">
个人资料
</a>
</dd>
<dd>
<!--TODO -->
<!--需要修改为自己项目的部分：-->
<!--1、属性data-url（需要在右边选项卡中打开的页面的路径） -->
<!--2、属性data-title（选项卡标题）-->
<!--3、属性data-id必须唯一，tab选项卡根据这个值进行切换-->
<a href="#" data-url="password" data-title="修改密码" data-id="55" class="site-demo-active" data-type="tabAdd">
修改密码
</a>
</dd>
</dl>
</li>
<li class="layui-nav-item">
<!--TODO -->
<!--可能需要修改路径-->
<a href="/logout">退出</a>
</li>
</ul>
</div>
<!-- 左侧导航栏 -->
<div class="layui-tab layui-side layui-tab-card site-demo-button" >
<ul class="layui-nav layui-side layui-nav-tree layui-nav-side" >
<li class="layui-nav-item layui-nav-itemed" >
<a href="javascript:;">用户</a>
<dl class="layui-nav-child">
<dd>
<a href="#" data-url="/admin/user" data-title="用户" data-id="1" id="default-tab" class="site-demo-active"
data-type="tabAdd">
用户
</a>
</dd>
</dl>
</li>
<li class="layui-nav-item layui-nav-itemed" >
<a href="javascript:;">公文管理</a>
<dl class="layui-nav-child">
<dd>
<a href="#" data-url="/admin/gw" data-title="公文列表" data-id="7" class="site-demo-active"
data-type="tabAdd">
公文列表
</a>
</dd>
</dl>
</li>
<!-- <li class="layui-nav-item layui-nav-itemed" >-->
<!-- <a href="javascript:;">统计</a>-->
<!-- <dl class="layui-nav-child">-->
<!-- <dd>-->
<!-- <a href="#" data-url="/admin/tj" data-title=" 统计" data-id="8" class="site-demo-active"-->
<!-- data-type="tabAdd">-->
<!-- 统计列表-->
<!-- </a>-->
<!-- </dd>-->
<!-- </dl>-->
<!-- </li>-->
</ul>
</div>
<div class="layui-body">
<!-- 内容主体区域 -->
<div class="layui-tab" lay-filter="demo" lay-allowClose="true">
<!--tab页标题-->
<ul class="layui-tab-title">
</ul>
<!--tab页标题上右键，出现下面的 关闭当前和关闭所有的选项-->
<ul class="rightMenu" style="display: none;position: absolute;">
<li data-type="closeThis" class="layui-bg-cyan">关闭当前</li>
<li data-type="closeAll" class="layui-bg-cyan">关闭所有</li>
</ul>
<!--tab页主体内容区域-->
<div class="layui-tab-content">
</div>
</div>
</div>
<div class="layui-footer">
<!-- 底部固定区域 -->
</div>
</div>
<!--jQuery在线引用地址(全)-->
<!--来源：https://www.bootcdn.cn/jquery/-->
<!--版本：3.3.1-->
<!--https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js-->
<!--BootstrapCDN-->
<!--<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">-->
<!--JS, Popper.js, and jQuery-->
<!--<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>-->
<!--<script src="https://cdn.bootcss.com/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>-->
<!--<script src="http-->
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="/static/layui/layui.js"></script>
<script>
layui.use(['element','layer'], function () {
var $ = layui.jquery;
var element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
//触发事件
var active = {
// 在这里给active绑定几项事件，后面可通过active调用这些事件
tabAdd: function (url, id, name) {
// 新增一个Tab项 传入三个参数，分别对应其标题，tab页面的地址，还有一个规定的id，是标签中data-id的属性值
// 关于tabAdd的方法所传入的参数可看layui的开发文档中基础方法部分
element.tabAdd('demo', {
title: name,
// TODO
// 这里的选项卡页面路径： src="' + url + '.html" ，可能需要根据自己项目实际的后缀名修改
// content: '<iframe data-frameid="' + id + '" scrolling="auto" frameborder="0" src="' + url + '.html" style="width:100%;height:99%;"></iframe>',
content: '<iframe data-frameid="' + id + '" scrolling="auto" frameborder="0" src="' + url + '" style="width:100%;height:99%;"></iframe>',
id: id // 规定好的id
})
CustomRightClick(id); // 自定义函数，给tab绑定右击事件
FrameWH(); // 自定义函数，计算iframe层的大小
},
tabChange: function (id) {
// 切换到指定Tab项
element.tabChange('demo', id); // 根据传入的id传入到指定的tab项
},
tabDelete: function (id) {
element.tabDelete("demo", id);// 删除
}
, tabDeleteAll: function (ids) {// 删除所有
$.each(ids, function (i, item) {
element.tabDelete("demo", item); //ids是一个数组，里面存放了多个id，调用tabDelete方法分别删除
})
}
};
// 当点击有site-demo-active属性的标签时，即左侧菜单栏中内容 ，触发点击事件
$('.site-demo-active').on('click', function () {
var dataid = $(this);
// 这时会判断右侧.layui-tab-title属性下的有lay-id属性的li的数目，即已经打开的tab项数目
if ($(".layui-tab-title li[lay-id]").length <= 0) {
// 如果比零小，则直接打开新的tab项
active.tabAdd(dataid.attr("data-url"), dataid.attr("data-id"), dataid.attr("data-title"));
} else {
// 否则判断该tab项是否已经存在
var isData = false; //初始化一个标志，为false说明未打开该tab项 为true则说明已有
$.each($(".layui-tab-title li[lay-id]"), function () {
//如果点击左侧菜单栏所传入的id 在右侧tab项中的lay-id属性可以找到，则说明该tab项已经打开
if ($(this).attr("lay-id") == dataid.attr("data-id")) {
isData = true;
}
})
if (isData == false) {
//标志为false 新增一个tab项
active.tabAdd(dataid.attr("data-url"), dataid.attr("data-id"), dataid.attr("data-title"));
}
}
// 最后不管是否新增tab，最后都转到要打开的选项页面上
active.tabChange(dataid.attr("data-id"));
});
function CustomRightClick(id) {
//取消右键 rightMenu属性开始是隐藏的 ，当右击的时候显示，左击的时候隐藏
$('.layui-tab-title li').on('contextmenu', function () {
return false;
})
$('.layui-tab-title,.layui-tab-title li').click(function () {
$('.rightMenu').hide();
});
//桌面点击右击
$('.layui-tab-title li').on('contextmenu', function (e) {
var popupmenu = $(".rightMenu");
popupmenu.find("li").attr("data-id", id); //在右键菜单中的标签绑定id属性
//判断右侧菜单的位置
l = ($(document).width() - e.clientX) < popupmenu.width() ? (e.clientX - popupmenu.width()) : e.clientX;
t = ($(document).height() - e.clientY) < popupmenu.height() ? (e.clientY - popupmenu.height()) : e.clientY;
popupmenu.css({left: l, top: t}).show(); //进行绝对定位
//alert("右键菜单")
return false;
});
}
$(".rightMenu li").click(function () {
//右键菜单中的选项被点击之后，判断type的类型，决定关闭所有还是关闭当前。
if ($(this).attr("data-type") == "closeThis") {
//如果关闭当前，即根据显示右键菜单时所绑定的id，执行tabDelete
active.tabDelete($(this).attr("data-id"))
} else if ($(this).attr("data-type") == "closeAll") {
var tabtitle = $(".layui-tab-title li");
var ids = new Array();
$.each(tabtitle, function (i) {
ids[i] = $(this).attr("lay-id");
})
//如果关闭所有 ，即将所有的lay-id放进数组，执行tabDeleteAll
active.tabDeleteAll(ids);
}
$('.rightMenu').hide(); //最后再隐藏右键菜单
})
// 计算frame高度
function FrameWH() {
var h = $(window).height() - 41 - 10 - 60 - 10 - 44 - 10;
$("iframe").css("height", h + "px");
}
$(window).resize(function () {
FrameWH();
})
var layer = layui.layer;
layer.ready(function(){
// layer.msg('您已进入页面了！');
// 触发点击事件，这样就可以设置默认显示的选项卡页面
// TODO
// 可能需要修改的地方，标签id值
$("#default-tab").trigger( "click" );
});
});
</script>
</body>
</html>
user.html
点击查看代码
<!DOCTYPE html>
<html>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<head>
<meta charset="utf-8">
<title></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="/static/layui/css/layui.css" tppabs="/static/layui/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="toolbarDemo">
<div>
搜索：
<div class="layui-inline">
<input class="layui-input" id="demoReload" placeholder="请输入用户名" autocomplete="off">
</div>
<button class="layui-btn" data-type="reload" id="search">搜索</button>
</div>
<!-- <button type="button" class="layui-btn layui-btn-danger" lay-event="batchDels"><i class="layui-icon"></i></button><!–删除–>-->
<button class="layui-btn" id="add">新增</button>
<button class="layui-btn" onclick=" window.location.reload();
">刷新</button>
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs" lay-event="edit" id="edit">编辑</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script type="text/html" id="img">
<!-- 这里的 checked 的状态只是演示 -->
<img src="/static/uploadFile/temps/{{d.img}}"/>
<!-- <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}>-->
</script>
<script type="text/html" id="img2">
<!-- 这里的 checked 的状态只是演示 -->
<img src="/static/uploadFile/temps/{{d.uimg}}"/>
<!-- <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}>-->
</script>
<script src="/static/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script>
layui.use('table', function(){
var table = layui.table;
//温馨提示：默认由前端自动合计当前行数据。从 layui 2.5.6 开始： 若接口直接返回了合计行数据，则优先读取接口合计行数据。
//详见：https://www.layui.com/doc/modules/table.html#totalRow
table.render({ //相当于加载
elem: '#test'
,url:'/admin/userList'/*tpa=https://www.layuiweb.com/test/table/demo1.json*/
,toolbar: '#toolbarDemo'
,title: '图片管理'
,totalRow: true
,cols: [
[
{type: 'checkbox', fixed: 'left'}
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true, totalRowText: '合计'}
,{field:'name', title:'用户', width:120, edit: 'text'}
,{field:'pwd', title:'密码', width:120, edit: 'text'}
,{field:'perms', title:'权限', width:120, edit: 'text'}
// ,{field:'dz', title:'收货地', width:120, edit: 'text'}
// ,{field:'img', title:'图片', width:120,templet: '#img', edit: 'text'}//传图片首先把templet里面选中body里的某个id
/* ,{field:'email', title:'邮箱', width:150, edit: 'text', templet: function(res){
return '<em>'+ res.email +'</em>'
}}
,{field:'experience', title:'积分', width:80, sort: true, totalRow: true}
,{field:'sex', title:'性别', width:80, edit: 'text', sort: true}
,{field:'logins', title:'登入次数', width:100, sort: true, totalRow: true}
,{field:'sign', title:'签名'}
,{field:'city', title:'城市', width:100}
,{field:'ip', title:'IP', width:120}
,{field:'joinTime', title:'加入时间', width:120}
,{field:'ss', title:'ss', width:120}*/
,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
]
]
,page: true //是否显示分页
,limits: [4,10,15] //每页条数选项
,limit: 4 //每页默认显示的条数
});
//以下是搜索框进行监测
$('#search').click(function () {
var Nick = $('#demoReload').val();//获取输入框内容
// var date = $('#time').val();
// if($('#demoReload').val()==""){
// layer.msg('查询内容不能为空');
// return false;
// }
table.reload('test', { //table.reload重载数据表格的语法，在文档中有
url: '/admin/user_search'
// ,methods:"post"
,request: {
pageName: 'page' //页码的参数名称，默认：page
,limitName: 'limit' //每页数据量的参数名，默认：limit
}
,where: {
// 向search_label传送数据
// start: date,
name:Nick,
}
,page: {
curr: 1
}
});
return false;
})
$('#btn .layui-btn').on('click', function(){
var type = $(this).data('type');
active[type] ? active[type].call(this) : '';
});
//点击添加按钮弹窗
$("#add").click(function () {
layui.use('layer', function () {
layer.open({
title: '添加信息',
type: 2,
content: '/admin/toUserAdd',
area: ['800px', '400px'],
maxmin: true
})
})
})
//工具栏事件
table.on('toolbar(test)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
case 'getCheckData':
var data = checkStatus.data;
layer.alert(JSON.stringify(data));
break;
case 'getCheckLength':
var data = checkStatus.data;
layer.msg('选中了：'+ data.length + ' 个');
break;
case 'isAll':
layer.msg(checkStatus.isAll ? '全选': '未全选')
break;
case 'batchDels': //批量删除
var data = checkStatus.data;
if(checkStatus.data.length==0){
parent.layer.alert('请先选择要删除的数据行！');
return ;
}
<!--将选中的拼接成字符串-->
var nums = "";
for(var i=0;i<checkStatus.data.length;i++){
nums += checkStatus.data[i].id+",";
}
$.ajax({
url:'/admin/batchDeleteTask',
data:{'nums':nums},
type:'post',
success:function(data){
if(data=="success"){
layer.alert("批量删除成功");
setTimeout('window.location.reload()',3000);
}else{
layer.alert("批量删除失败");
setTimeout('window.location.reload()',1000);
}
}
});
break;
};
});
//监听工具条
table.on('tool(test)', function(obj){
var data = obj.data;
if(obj.event === 'del'){
layer.confirm('真的删除行么', function(index){
// obj.del();
$.ajax({
type: 'post',
url: '/admin/deleteUser',//删除的路径
async:true,
dataType:"json",
data:{
id:data.id, //传一个id过去
},
success: function (data) {
layer.alert('删除成功', {icon: 6, title: '提示', time: 1500})
setTimeout(function () {
window.location.reload();
// window.location.href="index.html";
}, 1500);
},
error: function () {
window.location.reload();
layer.alert('请求失败，系统错误', {icon: 7, title: '提示', time: 1000})
}
})
layer.close(index);
});
}
else if(obj.event === 'edit'){
json = JSON.stringify(data);
layui.use('layer', function () {
layer.open({
title: '修改信息',
type: 2,
content: '/admin/toUserEdit',
area: ['800px', '400px'],
maxmin: true
})
})
}
});
});
</script>
<script>
</script>
<!--<script>
function req(){
$.get("/list",res=>{
$("#test").text()
console.log(res)
})
}
window.setInterval('req()',1000)
</script>-->
</body>
</html>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· C#/.NET/.NET Core技术前沿周刊 | 第 29 期（2025年3.1-3.9）
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异