Spring Boot + LayUI 批量修改数据 数据包含着对象
页面展示
HTML 代码
<blockquote class="layui-elem-quote demoTable">
<div class="layui-inline">
<div class="layui-input-inline">
<input type="text" value="" placeholder="请输入关键字" class="layui-input search_input">
</div>
<a class="layui-btn search_btn" href="javascript:;">查询</a>
</div>
<div class="layui-inline">
<a class="layui-btn layui-btn-normal newsAdd_btn" href="adminSave.html">添加管理员</a>
</div>
<div class="layui-inline" >
<a class="layui-btn closeBtn" data-type="closeBtn" href="javascript:;" style="background-color: #f81eff6e;">批量禁用</a>
</div>
<div class="layui-inline" >
<a class="layui-btn startBtn" data-type="startBtn" href="javascript:;" style="background-color: rgba(232,154,166,0.43);">批量启用</a>
</div>
</blockquote>
<!-- layui 渲染 数据 -->
<table class="layui-hide" id="adminInfoList" lay-filter="demo"></table>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs" lay-event="edit" title="修改管理员信息"> <i class="layui-icon"></i></a>
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="queryLog" title="查看管理员信息"> <i class="layui-icon"></i></a>
</script>
JS 代码
layui.config({
base: "js/"
}).use(['table', 'layer', 'form', 'jquery'], function () {
var table = layui.table,
form = layui.form,
layer = parent.layer === undefined ? layui.layer : parent.layer,
$ = layui.jquery;
/***
*
* 显示全部管理员信息
*
*/
table.render({
elem: '#adminInfoList'
, url: '/queryAdminAll'
, cols: [[
{type: 'checkbox', fixed: 'left', value: 'adminId'},
{
field: 'adminInfoEntity', title: '头像',
templet: function (data) {
return '<img class="layui-circle adminImage" width="26" height="26" src=../../' + data.adminInfoEntity.adminInfoImage + '>'
}
}
, {field: 'adminAccount', title: '登录名'}
, {
field: 'adminInfoEntity', title: '邮箱', sort: true,
templet: function (data) {
return '<span>' + data.adminInfoEntity.adminInfoEmail + '</span>'
}
}
, {
field: 'adminInfoEntity', title: '权限',
templet: function (data) {
if (data.adminInfoEntity.adminInfoClass == 0) {
return '<span>' + "普通管理员" + '</span>'
}
if (data.adminInfoEntity.adminInfoClass == 1) {
return '<span>' + "超级管理员" + '</span>'
}
}
}
, {
field: 'adminInfoName', title: '实名',
templet: function (data) {
return '<span>' + data.adminInfoEntity.adminInfoName + '</span>'
}
}
, {
field: 'adminInfoEntity', title: '状态', width: 85, templet: function (data) {
if (data.adminInfoEntity.adminInfoCode == 1) {
return '<div> <input type="checkbox" checked="" name="codeSwitch" lay-skin="switch" id="open" lay-filter="switchTest" switchId=' + data.adminInfoEntity.adminInfoId + '' +
' lay-text="启用|禁用" value=' + data.adminInfoEntity.adminInfoCode + '></div>'
} else {
return '<div> <input type="checkbox" lay-skin="switch" name="codeSwitch" switchId=' + data.adminInfoEntity.adminInfoId + ' lay-filter="switchTest"' +
'lay-text="启用|禁用" value=' + data.adminInfoEntity.adminInfoCode + '></div>'
}
}
}
, {
field: 'adminInfoEntity', title: '性别',
templet: function (data) {
if (data.adminInfoEntity.adminInfoSex == 2) {
return '<span>' + '男' + '</span>'
}
if (data.adminInfoEntity.adminInfoSex == 0) {
return '<span>' + '保密' + '</span>'
}
if (data.adminInfoEntity.adminInfoSex == 1) {
return '<span>' + '女' + '</span>'
}
}
}
, {
field: 'adminInfoEntity', title: '手机号码', sort: true,
templet: function (data) {
return '<span>' + data.adminInfoEntity.adminInfoPhone + '</span>'
}
}
, {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 140}
]]
, limit: 15
, limits: [15, 20, 25, 50, 100]
, parseData: function (data) {
/**
* 打印数据
*
*/
console.log(data)
}
/**
* 开启分页
*/
, page: true
, id: 'idTest'
});
/**
* 批量关闭 管理员状态
*
* */
var $ = layui.$, active = {
closeBtn: function () {
var $checkbox = $('table input[type="checkbox"][name="layTableCheckbox"]');
var $checked = $('table input[type="checkbox"][name="layTableCheckbox"]:checked');
if ($checkbox.is(":checked")) {
var checkStatusId = table.checkStatus('idTest'),
data = checkStatusId.data,
adminInfoId = [];
for (var i in data) {
adminInfoId.push(data[i].adminInfoEntity.adminInfoId)
}
layer.confirm('确定禁用？', {icon: 3, title: '提示信息'}, function (index) {
var index = layer.msg('禁用中，请稍候', {icon: 16, time: false, shade: 0.8});
$.ajax({
url: '../admin/updateAdminInfoCodeClose',
data: {
adminInfoCode: 0,
adminInfoId: adminInfoId
},
type: 'post',
success: function (data) {
layer.msg("禁用成功", {offset: 'rb', shift: 6})
setTimeout(function () {
window.location.href = window.location.href;
}, 3000);
}, error: function (data) {
layer.msg("稍等一会..", {offset: 'rb', shift: 6})
}
})
layer.close(index);
})
} else {
layer.msg("请选择需要禁用的管理员", {offset: 'rb', shift: 6});
}
}
/**
* 必须要要加上 通过什么来点击
*/
$('.demoTable .layui-btn').on('click', function () {
var type = $(this).data('type');
active[type] ? active[type].call(this) : '';
});
});
Java 后台代码/**
* 批量禁用管理员
*
* @param adminInfoCode
* @param adminInfoId
* @return
*/
@RequestMapping("admin/updateAdminInfoCodeClose")
public ResultFormat updateAdminInfoCodeDn(Integer adminInfoCode, @RequestParam(value = "adminInfoId[]") Integer[] adminInfoId) {
logger.info("adminInfoCode = {}", adminInfoCode);
logger.info("adminInfoId = {}", adminInfoId);
Integer flag = 0;
for (Integer integer : adminInfoId) {
map.put("adminInfoId", integer.intValue());
map.put("adminInfoCode", adminInfoCode);
flag = adminService.updateAdminInfo(map);
}
logger.info("flag = {}", flag);
if (flag > 0) {
return ResultUtil.success(flag);
}
return ResultUtil.error(104, "更新失败..");
}
源码码云地址 ：
https://gitee.com/pig_farmer_x/springboot/tree/master/
