zhangnian
LinTiee 9 months ago
parent 9bf35fc671
commit c0b06069ab

@ -240,7 +240,7 @@
<script type="text/javascript">
//提升数据表格的作用域因为底下还有一个reloadTable方法
var tableIns;
var tableIns; // 定义表格实例变量
layui.use(['jquery', 'form', 'layer', 'table', 'laydate'], function () {
var $ = layui.jquery;
@ -249,7 +249,7 @@
var table = layui.table;
var laydate = layui.laydate;
//初始化时间选择器
// 初始化时间选择器
laydate.render({
elem: '#startTime',
type: 'datetime'
@ -257,9 +257,9 @@
laydate.render({
elem: '#endTime',
type: 'datetime'
})
});
//初始化表格 加载数据
// 初始化表格并加载数据
tableIns = table.render({
elem: "#salesTable",
title: "销售数据表格",
@ -267,32 +267,32 @@
toolbar: "#salesToolBar",
page: true,
height: "full-180",
cols: [ [
{field: 'id', title: 'ID', align: 'center',width:'50'},
{field: 'customername', title: '', align: 'center',width:'100'},
{field: 'goodsname', title: '', align: 'center',width:'150'},
{field: 'paytype', title: '', align: 'center',width:'90'},
{field: 'salestime', title: '', align: 'center',width:'170'},
{field: 'operateperson', title: '', align: 'center',width:'130'},
{field: 'number', title: '', align: 'center',width:'100'},
{field: 'size', title: '', align: 'center',width:'100'},
{field: 'saleprice', title: '', align: 'center',width:'120'},
{field: 'remark', title: '', align: 'center',width:'120'},
{fixed: 'right', title: '', toolbar: '#salesRowBar', align: 'center',width:'260'}
] ],
cols: [[
{field: 'id', title: 'ID', align: 'center', width: '50'},
{field: 'customername', title: '', align: 'center', width: '100'},
{field: 'goodsname', title: '', align: 'center', width: '150'},
{field: 'paytype', title: '', align: 'center', width: '90'},
{field: 'salestime', title: '', align: 'center', width: '170'},
{field: 'operateperson', title: '', align: 'center', width: '130'},
{field: 'number', title: '', align: 'center', width: '100'},
{field: 'size', title: '', align: 'center', width: '100'},
{field: 'saleprice', title: '', align: 'center', width: '120'},
{field: 'remark', title: '', align: 'center', width: '120'},
{fixed: 'right', title: '', toolbar: '#salesRowBar', align: 'center', width: '260'}
]],
done: function (data, curr, count) {
//不是第一页时如果当前返回的数据为0那么就返回上一页
// 如果不是第一页且当前返回的数据为空,则返回上一页
if (data.data.length == 0 && curr != 1) {
tableIns.reload({
page: {
curr: curr - 1
}
})
});
}
}
});
//监控模糊查询按钮事件
// 监控模糊查询按钮事件
form.on("submit(doSearch)", function (data) {
tableIns.reload({
where: data.field,
@ -300,240 +300,222 @@
curr: 1
}
});
return false;
return false; // 阻止表单提交
});
//监控工具条事件
// 监控工具条事件
table.on("toolbar(salesTable)", function (obj) {
switch (obj.event) {
case 'add':
openAddLayer();
openAddLayer(); // 打开添加弹出层
break;
};
}
;
});
//监控行工具条事件
// 监控行工具条事件
table.on("tool(salesTable)", function (obj) {
//获取当前行数据
var data = obj.data;
var data = obj.data; // 获取当前行数据
switch (obj.event) {
case 'delete':
deleteSales(data);
deleteSales(data); // 删除销售记录
break;
case 'update':
updateSales(data);
updateSales(data); // 打开修改弹出层
break;
case 'back':
backSales(data);
backSales(data); // 回滚销售记录
break;
};
}
;
});
//初始化客户名称的下拉列表
$.get("/customer/loadAllCustomerForSelect",function (res) {
// 初始化客户名称的下拉列表
$.get("/customer/loadAllCustomerForSelect", function (res) {
var data = res.data;
var dom = $("#select_customerid");
var html = '<option value="0"></option>';
$.each(data,function (index, item) {
html += '<option value="'+item.id+'">'+item.customername+'</option>';
})
$.each(data, function (index, item) {
html += '<option value="' + item.id + '">' + item.customername + '</option>';
});
dom.html(html);
//重新渲染下拉列表
form.render("select");
form.render("select"); // 重新渲染下拉列表
});
//初始化商品名称的下拉列表
$.get("/goods/loadAllGoodsForSelect",function (res) {
// 初始化商品名称的下拉列表
$.get("/goods/loadAllGoodsForSelect", function (res) {
var data = res.data;
var dom = $("#select_goodsid");
var html = '<option value="0"></option>';
$.each(data,function (index, item) {
html += '<option value="'+item.id+'">'+item.goodsname+'-['+item.size+']-'+'['+item.providername+']'+'</option>';
$.each(data, function (index, item) {
html += '<option value="' + item.id + '">' + item.goodsname + '-[' + item.size + ']-' + '[' + item.providername + ']' + '</option>';
});
dom.html(html);
//重新渲染下拉列表
form.render("select");
form.render("select"); // 重新渲染下拉列表
});
var mainIndex;
var url;
var mainIndex; // 主窗口索引
var url; // URL地址变量
//打开添加弹出层
// 打开添加弹出层函数
function openAddLayer() {
mainIndex = layer.open({
type:1,
content:$("#addOrUpdateDiv"),
area:['700px','500px'],
title:'',
success:function () {
$("#dataFrm")[0].reset();
//初始化客户名称的下拉列表
initCustomerSelect();
//使该div隐藏
$(".mydiv").hide();
url="/sales/addSales";
type: 1,
content: $("#addOrUpdateDiv"),
area: ['700px', '500px'],
title: '',
success: function () {
$("#dataFrm")[0].reset(); // 重置表单数据
initCustomerSelect(); // 初始化客户名称下拉列表
$(".mydiv").hide(); // 隐藏特定元素
url = "/sales/addSales"; // 设置URL地址为添加销售接口
}
});
}
//打开修改弹出层
// 打开修改弹出层函数
function updateSales(data) {
mainIndex = layer.open({
type:1,
content:$("#addOrUpdateDiv"),
area:['700px','500px'],
title:'',
success:function () {
//清空原有的数据
$("#dataFrm")[0].reset();
//装载新的数据
form.val("dataFrm",data);
//客户进行反选
initCustomerSelect(data.customerid);
//商品下拉列表的回显
$.get("/goods/loadAllGoodsForSelect",function(res){
var redata=res.data;
var dom=$("#goodsid");
var html='<option value="0"></option>'
$.each(redata,function(index,item){
if (data.goodsid===item.id){
html+='<option value="'+item.id+'" selected>'+item.goodsname+'</option>'
}else {
html+='<option value="'+item.id+'">'+item.goodsname+'</option>'
type: 1,
content: $("#addOrUpdateDiv"),
area: ['700px', '500px'],
title: '',
success: function () {
$("#dataFrm")[0].reset(); // 清空原有数据
form.val("dataFrm", data); // 装载新的数据到表单中
initCustomerSelect(data.customerid); // 初始化客户名称下拉列表并选中当前客户
$.get("/goods/loadAllGoodsForSelect", function (res) {
var redata = res.data;
var dom = $("#goodsid");
var html = '<option value="0"></option>';
$.each(redata, function (index, item) {
if (data.goodsid === item.id) {
html += '<option value="' + item.id + '" selected>' + item.goodsname + '</option>';
} else {
html += '<option value="' + item.id + '">' + item.goodsname + '</option>';
}
});
dom.html(html);
form.render("select");
dom.html(html); // 更新商品下拉列表选项
form.render("select"); // 重新渲染下拉列表
});
//禁用供应商和商品的下拉列表
$(".mydiv").show();
url="/sales/updateSales";
$(".mydiv").show(); // 显示特定元素
url = "/sales/updateSales"; // 设置URL地址为更新销售接口
}
});
}
//初始化添加和修改页面的下拉列表
// 初始化添加和修改页面的下拉列表
function initCustomerSelect(customerid) {
//重置商品的下拉列表
var dom = $("#goodsid");
// 重置客户的下拉列表
var dom = $("#customerid");
dom.html("");
$.get("/customer/loadAllCustomerForSelect",function (res) {
$.get("/customer/loadAllCustomerForSelect", function (res) {
var data = res.data;
var dom = $("#customerid");
var html = '<option value="0"></option>';
$.each(data,function (index, item) {
html += '<option value="'+item.id+'">'+item.customername+'</option>';
$.each(data, function (index, item) {
html += '<option value="' + item.id + '">' + item.customername + '</option>';
});
dom.html(html);
//如果customerid有值就进行反选
if (customerid!=undefined){
// 如果 customerid 有值就进行反选
if (customerid != undefined) {
dom.val(customerid);
}
//重新渲染下拉列表
// 重新渲染下拉列表
form.render("select");
});
};
//监听客户的下拉列表的事件
form.on('select(customerid)',function (data) {
var customerid = data.value;
initGoodsSelect(customerid);
// 监听客户的下拉列表的事件
form.on('select(customerid)', function (data) {
var customerid = data.value;
initGoodsSelect(customerid);
});
//加载商品的下拉列表
// 加载商品的下拉列表
function initGoodsSelect(goodsid) {
$.get("/goods/loadAllGoodsForSelect",function (res) {
$.get("/goods/loadAllGoodsForSelect", function (res) {
var data = res.data;
var dom = $("#goodsid");
var html = '<option value="0"></option>';
$.each(data,function (index, item) {
html += '<option value="'+item.id+'">'+item.goodsname+'-['+item.size+']-'+'['+item.providername+']'+'</option>';
$.each(data, function (index, item) {
html += '<option value="' + item.id + '">' + item.goodsname + '-[' + item.size + ']-' + '[' + item.providername + ']' + '</option>';
});
dom.html(html);
//如果goodsid有值就进行反选
if (goodsid!=undefined){
// 如果 goodsid 有值就进行反选
if (goodsid != undefined) {
dom.val(goodsid);
}
//重新渲染下拉列表
// 重新渲染下拉列表
form.render("select");
});
}
form.on("submit(doSubmit)",function (data) {
$.post(url,data.field,function (res) {
if (res.code==200){
tableIns.reload();
// 提交表单事件
form.on("submit(doSubmit)", function (data) {
$.post(url, data.field, function (res) {
if (res.code == 200) {
tableIns.reload(); // 重新加载表格数据
}
layer.msg(res.msg);
layer.close(mainIndex);
layer.msg(res.msg); // 显示操作结果消息
layer.close(mainIndex); // 关闭当前弹出层
});
return false;
return false; // 阻止表单默认提交行为
});
//删除
// 删除销售信息
function deleteSales(data) {
layer.confirm('', {icon: 3, title: ''}, function (index) {
$.post("/sales/deleteSales", {id: data.id},function (res) {
$.post("/sales/deleteSales", {id: data.id}, function (res) {
if (res.code == 200) {
tableIns.reload({
where:"",
});
tableIns.reload({where: "",}); // 重新加载表格数据
}
layer.msg(res.msg);
layer.msg(res.msg); // 显示操作结果消息
});
layer.close(index);
layer.close(index); // 关闭确认框
});
}
//打开退货的弹出层
// 打开退货的弹出层
function backSales(data) {
mainIndex = layer.open({
type:1,
content:$("#backGoodsDiv"),
area:['600px','400px'],
title:'退',
success:function () {
//清空原有的数据
$("#dataFrmBack")[0].reset();
//装载新的数据 获得销售的ID以及当前销售单的销售数量
form.val("dataFrmBack",{id:data.id,currentNumber:data.number});
type: 1,
content: $("#backGoodsDiv"),
area: ['600px', '400px'],
title: '退',
success: function () {
$("#dataFrmBack")[0].reset(); // 清空原有的数据
// 装载新的数据获得销售的ID以及当前销售单的销售数量
form.val("dataFrmBack", {id: data.id, currentNumber: data.number});
}
});
}
//自定义验证规则
// 自定义验证规则
form.verify({
checkNumber: function (value) {
var currentNumber = $("#currentNumber").val();
//value为退货的数量 currentNumber为当前销售单的数量
if (parseInt(value)>currentNumber||parseInt(value)<1){
return '退0-'+currentNumber+'';
}
}
checkNumber: function (value) {
var currentNumber = $("#currentNumber").val();
// value为退货的数量currentNumber为当前销售单的数量
if (parseInt(value) > currentNumber || parseInt(value) < 1) {
return '退0-' + currentNumber + '';
}
}
});
//退货提交
form.on("submit(doBackSubmit)",function (data) {
$.post("/salesback/addSalesback",data.field,function (res) {
if (res.code==200){
//重新加载表格数据
tableIns.reload();
//关闭退货弹出层
layer.close(mainIndex);
// 退货提交事件
form.on("submit(doBackSubmit)", function (data) {
$.post("/salesback/addSalesback", data.field, function (res) {
if (res.code == 200) {
tableIns.reload(); // 重新加载表格数据
layer.close(mainIndex); // 关闭退货弹出层
}
layer.msg(res.msg);
layer.msg(res.msg); // 显示操作结果消息
});
return false;
return false; // 阻止表单默认提交行为
})
});
</script>
</body>

@ -125,124 +125,119 @@
<script type="text/javascript">
//提升数据表格的作用域因为底下还有一个reloadTable方法
var tableIns;
var tableIns; // 定义表格实例变量
layui.use(['jquery', 'form', 'layer', 'table', 'laydate'], function () {
var $ = layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
var laydate = layui.laydate;
var $ = layui.jquery; // 引入jQuery模块
var form = layui.form; // 引入表单模块
var layer = layui.layer; // 引入弹出层模块
var table = layui.table; // 引入表格模块
var laydate = layui.laydate; // 引入日期选择器模块
//初始化时间选择器
// 初始化时间选择器,用于选择开始时间和结束时间
laydate.render({
elem: '#startTime',
type: 'datetime'
elem: '#startTime', // 绑定元素ID为startTime
type: 'datetime' // 设置类型为日期时间选择
});
laydate.render({
elem: '#endTime',
type: 'datetime'
})
elem: '#endTime', // 绑定元素ID为endTime
type: 'datetime' // 设置类型为日期时间选择
});
//初始化表格 加载数据
// 初始化表格并加载数据
tableIns = table.render({
elem: "#salesbackTable",
title: "进货数据表格",
url: "/salesback/loadAllSalesback",
toolbar: true,
page: true,
height: "full-180",
cols: [ [
elem: "#salesbackTable", // 绑定的HTML容器ID
title: "进货数据表格", // 表格标题
url: "/salesback/loadAllSalesback", // 数据接口地址
toolbar: true, // 开启工具栏
page: true, // 开启分页
height: "full-180", // 设置表格高度
cols: [[ // 定义表头
{field: 'id', title: 'ID', align: 'center'},
{field: 'customername', title: '', align: 'center',width:'130'},
{field: 'goodsname', title: '', align: 'center',width:'150'},
{field: 'paytype', title: '', align: 'center',width:'90'},
{field: 'salesbacktime', title: '退', align: 'center',width:'170'},
{field: 'operateperson', title: '', align: 'center',width:'130'},
{field: 'number', title: '退', align: 'center',width:'100'},
{field: 'salebackprice', title: '退', align: 'center',width:'120'},
{field: 'remark', title: '', align: 'center',width:'130'},
{field: 'size', title: '', align: 'center',width:'100'},
{fixed: 'right', title: '', toolbar: '#salesbackRowBar', align: 'center',width:'130'}
] ],
{field: 'customername', title: '', align: 'center', width: '130'},
{field: 'goodsname', title: '', align: 'center', width: '150'},
{field: 'paytype', title: '', align: 'center', width: '90'},
{field: 'salesbacktime', title: '退', align: 'center', width: '170'},
{field: 'operateperson', title: '', align: 'center', width: '130'},
{field: 'number', title: '退', align: 'center', width: '100'},
{field: 'salebackprice', title: '退', align: 'center', width: '120'},
{field: 'remark', title: '', align: 'center', width: '130'},
{field: 'size', title: '', align: 'center', width: '100'},
{fixed: 'right', title: '', toolbar: '#salesbackRowBar', align: 'center', width: '130'}
]],
done: function (data, curr, count) {
//不是第一页时如果当前返回的数据为0那么就返回上一页
// 如果当前页不是第一页且返回的数据为空,则自动跳转到上一页
if (data.data.length == 0 && curr != 1) {
tableIns.reload({
page: {
curr: curr - 1
curr: curr - 1 // 设置当前页为上一页
}
})
});
}
}
});
//监控模糊查询按钮事件
// 监听模糊查询按钮事件
form.on("submit(doSearch)", function (data) {
tableIns.reload({
where: data.field,
where: data.field, // 将表单数据作为查询条件
page: {
curr: 1
curr: 1 // 重置到第一页
}
});
return false;
return false; // 阻止表单默认提交行为
});
//监控行工具条事件
// 监听行工具条事件
table.on("tool(salesbackTable)", function (obj) {
//获取当前行数据
var data = obj.data;
var data = obj.data; // 获取当前行数据
switch (obj.event) {
case 'delete':
deleteSalesback(data);
case 'delete': // 如果点击的是删除按钮
deleteSalesback(data); // 调用删除函数
break;
};
});
//初始化客户名称的下拉列表
$.get("/customer/loadAllCustomerForSelect",function (res) {
var data = res.data;
var dom = $("#select_customerid");
var html = '<option value="0"></option>';
$.each(data,function (index, item) {
html += '<option value="'+item.id+'">'+item.customername+'</option>';
})
dom.html(html);
//重新渲染下拉列表
form.render("select");
// 初始化客户名称的下拉列表
$.get("/customer/loadAllCustomerForSelect", function (res) {
var data = res.data; // 获取返回的客户数据
var dom = $("#select_customerid"); // 获取下拉列表DOM元素
var html = '<option value="0"></option>'; // 初始化下拉列表选项
$.each(data, function (index, item) {
html += '<option value="' + item.id + '">' + item.customername + '</option>'; // 添加每个客户的选项
});
dom.html(html); // 将生成的HTML添加到下拉列表中
form.render("select"); // 重新渲染下拉列表
});
//初始化商品名称的下拉列表
$.get("/goods/loadAllGoodsForSelect",function (res) {
var data = res.data;
var dom = $("#select_goodsid");
var html = '<option value="0"></option>';
$.each(data,function (index, item) {
html += '<option value="'+item.id+'">'+item.goodsname+'-['+item.size+']-'+'['+item.providername+']'+'</option>';
// 初始化商品名称的下拉列表
$.get("/goods/loadAllGoodsForSelect", function (res) {
var data = res.data; // 获取返回的商品数据
var dom = $("#select_goodsid"); // 获取下拉列表DOM元素
var html = '<option value="0"></option>'; // 初始化下拉列表选项
$.each(data, function (index, item) {
html += '<option value="' + item.id + '">' + item.goodsname + '-[' + item.size + ']-' + '[' + item.providername + ']' + '</option>'; // 添加每个商品的选项
});
dom.html(html);
//重新渲染下拉列表
form.render("select");
dom.html(html); // 将生成的HTML添加到下拉列表中
form.render("select"); // 重新渲染下拉列表
});
//删除退货信息
// 删除退货信息函数
function deleteSalesback(data) {
layer.confirm('退', {icon: 3, title: ''}, function (index) {
$.post("/salesback/deleteSalesback", {id: data.id},function (res) {
$.post("/salesback/deleteSalesback", {id: data.id}, function (res) {
if (res.code == 200) {
tableIns.reload({
where:"",
});
tableIns.reload({where: ""}); // 重新加载表格数据
}
layer.msg(res.msg);
layer.msg(res.msg); // 显示操作结果消息
});
layer.close(index);
layer.close(index); // 关闭确认框
});
}
});
</script>
</body>

@ -45,90 +45,83 @@
<script type="text/javascript">
layui.use(['jquery', 'form', 'layer', 'table'], function () {
var $ = layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
var $ = layui.jquery; // 引入jQuery模块
var form = layui.form; // 引入表单模块
var layer = layui.layer; // 引入弹出层模块
var table = layui.table; // 引入表格模块
//初始化表格 加载数据
// 初始化表格,加载数据
var tableIns = table.render({
elem: "#cacheTable",
title: "缓存数据表格",
url: "/cache/loadAllCache",
toolbar: "#cacheToolBar",
page: true,
cols: [ [
{field: 'key', title: '键', align: 'center',width:'100'},
{field: 'value', title: '值', align: 'center',width:'1100'},
{fixed: 'right', title: '', toolbar: '#cacheRowBar', align: 'center',width:'100'}
elem: "#cacheTable", // 绑定元素ID
title: "缓存数据表格", // 表格标题
url: "/cache/loadAllCache", // 数据接口
toolbar: "#cacheToolBar", // 工具栏模板选择器
page: true, // 开启分页
cols: [ [ // 表头
{field: 'key', title: '键', align: 'center', width:'100'}, // 定义列:字段名、标题、对齐方式、宽度
{field: 'value', title: '值', align: 'center', width:'1100'}, // 定义列:字段名、标题、对齐方式、宽度
{fixed: 'right', title: '', toolbar: '#cacheRowBar', align: 'center', width:'100'} // 定义操作列
] ]
});
//监控工具条事件
// 监听工具条事件
table.on("toolbar(cacheTable)", function (obj) {
switch (obj.event) {
case 'removeAllCache':
removeAllCache();
break;
case 'syncCache':
syncCache();
break;
case 'removeAllCache': // 如果点击了清空所有缓存按钮
removeAllCache(); // 调用清空所有缓存函数
break;
case 'syncCache': // 如果点击了同步缓存按钮
syncCache(); // 调用同步缓存函数
break;
};
});
//监控行工具条事件
// 监听行工具条事件
table.on("tool(cacheTable)",function (obj) {
//获取当前行数据
var data = obj.data;
var data = obj.data; // 获取当前行的数据
switch (obj.event){
case 'delete':
deleteCache(data);
break;
case 'delete': // 如果点击了删除按钮
deleteCache(data); // 调用删除缓存函数,传入当前行数据
break;
};
});
//清除所有缓存
// 清除所有缓存的函数
function removeAllCache() {
layer.confirm('',{icon: 3,title:''},function (index) {
$.post("/cache/removeAllCache",function (res) {
if (res.code==200){
tableIns.reload();
$.post("/cache/removeAllCache",function (res) { // 发送POST请求到服务器端执行清空操作
if (res.code==200){ // 如果返回码为200表示成功
tableIns.reload(); // 重新加载表格数据
}
layer.msg(res.msg);
layer.msg(res.msg); // 显示操作结果消息
});
});
}
//同步缓存
// 同步缓存的函数
function syncCache() {
layer.confirm('',{icon: 3,title:''},function (index) {
$.post("/cache/syncCache",function (res) {
if (res.code==200){
tableIns.reload();
$.post("/cache/syncCache",function (res) { // 发送POST请求到服务器端执行同步操作
if (res.code==200){ // 如果返回码为200表示成功
tableIns.reload(); // 重新加载表格数据
}
layer.msg(res.msg);
layer.msg(res.msg); // 显示操作结果消息
});
});
}
//删除
// 删除指定缓存的函数
function deleteCache(data) {
layer.confirm(''+data.key+'',{icon: 3,title:''},function (index) {
$.post("/cache/deleteCache",{key:data.key},function (res) {
if (res.code==200){
tableIns.reload({
where:"",
});
$.post("/cache/deleteCache",{key:data.key},function (res) { // 发送POST请求到服务器端执行删除操作传递要删除的缓存键值
if (res.code==200){ // 如果返回码为200表示成功
tableIns.reload({where:""}); // 重新加载表格数据,不附加任何条件
}
layer.msg(res.msg);
layer.msg(res.msg); // 显示操作结果消息
});
layer.close(index);
layer.close(index); // 关闭确认框
});
}
});
</script>

@ -24,30 +24,34 @@
<script type="text/javascript" src="/resources/layui/layui.js"></script>
<script type="text/javascript" src="/resources/layui_ext/dtree/dtree.js"></script>
<script type="text/javascript">
// 定义全局变量 deptTree用于存储树的实例
var deptTree;
// 使用 layui.extend 方法扩展模块路径
layui.extend({
dtree: '/resources/layui_ext/dtree/dtree' // {/}的意思即代表采用自有路径,即不跟随 base 路径
}).use(['dtree','layer','jquery'], function(){
dtree: '/resources/layui_ext/dtree/dtree' // {/} 代表采用自有路径,即不跟随 base 路径
}).use(['dtree', 'layer', 'jquery'], function() {
// 引入 dtree、layer 和 jQuery 模块
var dtree = layui.dtree;
var layer = layui.layer;
var $ = layui.jquery;
// 初始化树
// 初始化树结构
deptTree = dtree.render({
elem: "#deptTree",
dataStyle: "layuiStyle", //使用layui风格的数据格式
dataFormat: "list", //配置data的风格为list
response:{message:"msg",statusCode:0}, //修改response中返回数据的定义
url: "/dept/loadDeptManagerLeftTreeJson" // 使用url加载可与data加载同时存在)
elem: "#deptTree", // 绑定树的容器元素
dataStyle: "layuiStyle", // 使用 layui 风格的数据格式
dataFormat: "list", // 配置数据的风格为 list
response: { message: "msg", statusCode: 0 }, // 修改 response 中返回数据的定义
url: "/dept/loadDeptManagerLeftTreeJson" // 使用 URL 加载数据(可与 data 加载同时存在)
});
// 绑定节点点击
dtree.on("node('deptTree')" ,function(obj){
//layer.msg(JSON.stringify(obj.param));
//将树节点的id传到reloadTable方法中
// 绑定节点点击事件
dtree.on("node('deptTree')", function(obj) {
// 将树节点的 id 传到父窗口的 right 对象的 reloadTable 方法中
window.parent.right.reloadTable(obj.param.nodeId);
});
});
</script>
</body>
</html>

@ -156,219 +156,203 @@
<script type="text/javascript">
//提升数据表格的作用域因为底下还有一个reloadTable方法
var tableIns;
var tableIns; // 定义全局变量,用于存储表格实例
layui.extend({
dtree: '/resources/layui_ext/dtree/dtree'
}).use(['jquery', 'form', 'layer', 'laydate', 'table', 'layedit','dtree'], function () {
dtree: '/resources/layui_ext/dtree/dtree' // 扩展模块路径
}).use(['jquery', 'form', 'layer', 'laydate', 'table', 'layedit', 'dtree'], function () {
var $ = layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
var dtree = layui.dtree;
//初始化表格 加载数据
// 初始化表格并加载数据
tableIns = table.render({
elem: "#deptTable",
title: "部门数据表格",
url: "/dept/loadAllDept",
toolbar: "#deptToolBar",
page: true,
height: "full-180",
cols: [ [
{field: 'id', title: 'ID', align: 'center',width:'50'},
{field: 'pid', title: 'ID', align: 'center',width:'100'},
{field: 'name', title: '', align: 'center',width:'150'},
{field: 'remark', title: '', align: 'center',width:'150'},
{field: 'address', title: '', align: 'center',width:'100'},
{field: 'available', title: '', align: 'center',width:'100',templet:function (d) {
return d.available==1?'<font color="blue"></font>':'<font color="red"></font>';
}},
{field: 'open', title: '', align: 'center',width:'100',templet:function (d) {
return d.open==1?'<font color="blue"></font>':'<font color="red"></font>';
}},
{field: 'ordernum', title: '', align: 'center',width:'80'},
{field: 'createtime', title: '', align: 'center',width:'160'},
{fixed: 'right', title: '', toolbar: '#deptRowBar', align: 'center',width:'180'}
] ],
elem: "#deptTable", // 绑定表格容器元素
title: "部门数据表格", // 表格标题
url: "/dept/loadAllDept", // 数据接口地址
toolbar: "#deptToolBar", // 工具栏模板选择器
page: true, // 开启分页
height: "full-180", // 设置表格高度
cols: [[ // 定义表头
{field: 'id', title: 'ID', align: 'center', width: '50'},
{field: 'pid', title: 'ID', align: 'center', width: '100'},
{field: 'name', title: '', align: 'center', width: '150'},
{field: 'remark', title: '', align: 'center', width: '150'},
{field: 'address', title: '', align: 'center', width: '100'},
{field: 'available', title: '', align: 'center', width: '100', templet: function (d) {
return d.available == 1 ? '<font color="blue"></font>' : '<font color="red"></font>';
}},
{field: 'open', title: '', align: 'center', width: '100', templet: function (d) {
return d.open == 1 ? '<font color="blue"></font>' : '<font color="red"></font>';
}},
{field: 'ordernum', title: '', align: 'center', width: '80'},
{field: 'createtime', title: '', align: 'center', width: '160'},
{fixed: 'right', title: '', toolbar: '#deptRowBar', align: 'center', width: '180'}
]],
done: function (data, curr, count) {
//不是第一页时如果当前返回的数据为0那么就返回上一页
// 如果不是第一页且当前页没有数据,则返回上一页
if (data.data.length == 0 && curr != 1) {
tableIns.reload({
page: {
curr: curr - 1
}
})
});
}
}
});
//监控模糊查询按钮事件
// 监听模糊查询按钮事件
form.on("submit(doSearch)", function (data) {
tableIns.reload({
where: data.field,
where: data.field, // 提交的表单数据作为查询条件
page: {
curr: 1
curr: 1 // 重置到第一页
}
});
return false;
return false; // 阻止表单默认提交行为
});
//监控工具条事件
// 监听工具条事件
table.on("toolbar(deptTable)", function (obj) {
switch (obj.event) {
case 'add':
case 'add': // 添加事件
openAddLayer();
break;
};
});
//监控行工具条事件
// 监听行工具条事件
table.on("tool(deptTable)", function (obj) {
//获取当前行数据
var data = obj.data;
var data = obj.data; // 获取当前行数据
switch (obj.event) {
case 'delete':
case 'delete': // 删除事件
deleteDept(data);
break;
case 'update':
case 'update': // 更新事件
updateDept(data);
break;
};
});
var mainIndex;
var url;
var mainIndex; // 弹出层索引
var url; // 请求URL
//打开添加弹出层
// 打开添加弹出层
function openAddLayer() {
mainIndex = layer.open({
type:1,
content:$("#addOrUpdateDiv"),
area:['800px','500px'],
title:'',
success:function () {
$("#dataFrm")[0].reset();
//设置下拉树中父节点的值为空
$("#pid").val("");
url="/dept/addDept";
//初始化排序码
$.get("/dept/loadDeptMaxOrderNum",function (res) {
$("#ordernum").val(res.value);
type: 1, // 页面层类型
content: $("#addOrUpdateDiv"), // 内容区域选择器
area: ['800px', '500px'], // 弹出层尺寸
title: '', // 弹出层标题
success: function () {
$("#dataFrm")[0].reset(); // 重置表单
$("#pid").val(""); // 清空父节点值
url = "/dept/addDept"; // 设置请求URL为添加接口
$.get("/dept/loadDeptMaxOrderNum", function (res) {
$("#ordernum").val(res.value); // 初始化排序码
});
//设置下拉树的value值为空
selectTree.selectVal("");
selectTree.selectVal(""); // 清空下拉树的值
}
});
}
//打开修改弹出层
// 打开修改弹出层
function updateDept(data) {
mainIndex = layer.open({
type:1,
content:$("#addOrUpdateDiv"),
area:['800px','500px'],
title:'',
success:function () {
//清空原有的数据
$("#dataFrm")[0].reset();
$("#parentDept").removeClass("disabled");
//装载新的数据
form.val("dataFrm",data);
//选中之前的父级部门 nodeId=data.pid
if (data.pid!=0){
dtree.dataInit("deptTree",data.pid);
}else {
$("#parentDept").addClass("disabled");
type: 1, // 页面层类型
content: $("#addOrUpdateDiv"), // 内容区域选择器
area: ['800px', '500px'], // 弹出层尺寸
title: '', // 弹出层标题
success: function () {
$("#dataFrm")[0].reset(); // 重置表单
$("#parentDept").removeClass("disabled"); // 启用父节点选择框
form.val("dataFrm", data); // 填充表单数据
if (data.pid != 0) { // 如果存在父节点,初始化下拉树
dtree.dataInit("deptTree", data.pid);
} else {
$("#parentDept").addClass("disabled"); // 禁用父节点选择框
}
dtree.selectVal("deptTree");
url="/dept/updateDept";
dtree.selectVal("deptTree"); // 选中下拉树中的值
url = "/dept/updateDept"; // 设置请求URL为更新接口
}
});
}
form.on("submit(doSubmit)",function (data) {
$.post(url,data.field,function (res) {
if (res.code==200){
tableIns.reload();
//重新加载添加弹出层的下拉树
selectTree.reload();
//重新加载左边的部门树
window.parent.left.deptTree.reload();
// 监听提交按钮事件
form.on("submit(doSubmit)", function (data) {
$.post(url, data.field, function (res) {
if (res.code == 200) { // 如果响应成功
tableIns.reload(); // 重新加载表格数据
selectTree.reload(); // 重新加载下拉树数据
window.parent.left.deptTree.reload(); // 重新加载左侧部门树数据
}
layer.msg(res.msg);
layer.close(mainIndex);
layer.msg(res.msg); // 显示响应消息
layer.close(mainIndex); // 关闭弹出层
});
return false;
return false; // 阻止表单默认提交行为
});
/*$("#doSubmit").click(function () {
var data = $("#dataFrm").serialize();
$.post(url,data,function (res) {
if (res.code==200){
tableIns.reload();
//重新加载添加弹出层的下拉树
selectTree.reload();
//重新加载左边的部门树
window.parent.left.deptTree.reload();
}
layer.msg(res.msg);
layer.close(mainIndex);
});
});*/
//删除
// 删除部门函数
function deleteDept(data) {
$.post("/dept/checkDeptHasChildrenNode", {id: data.id}, function (resoult) {
if (resoult.value){
layer.msg("当前部门节点有子部门,请选择删除子部门!")
}else {
// 发送请求检查当前部门是否有子部门
$.post("/dept/checkDeptHasChildrenNode", {id: data.id}, function (result) {
// 如果存在子部门,则提示用户不能直接删除
if (result.value){
layer.msg("当前部门节点有子部门,请选择删除子部门!");
} else {
// 如果没有子部门,弹出确认框询问用户是否确定删除
layer.confirm('' + data.name + '', {icon: 3, title: ''}, function (index) {
$.post("/dept/deleteDept", {id: data.id},function (res) {
// 发送删除请求
$.post("/dept/deleteDept", {id: data.id}, function (res) {
// 如果删除成功,刷新表格和树形结构
if (res.code == 200) {
tableIns.reload({
where:"",
});
//刷新下拉树
// 刷新下拉树
selectTree.reload();
//刷新左边的部门树
// 刷新左边的部门树
window.parent.left.deptTree.reload();
}
// 显示操作结果消息
layer.msg(res.msg);
});
// 关闭确认框
layer.close(index);
});
}
});
}
//初始化下拉树
// 初始化下拉树
var selectTree = dtree.renderSelect({
elem: "#deptTree",
width: "100%", // 可以在这里指定树的宽度来填满div
dataStyle: "layuiStyle", //使用layui风格的数据格式
dataFormat: "list", //配置data的风格为list
response:{message:"msg",statusCode:0}, //修改response中返回数据的定义
url: "/dept/loadDeptManagerLeftTreeJson" // 使用url加载可与data加载同时存在)
elem: "#deptTree", // 绑定元素
width: "100%", // 设置树的宽度为100%
dataStyle: "layuiStyle", // 使用layui风格的数据格式
dataFormat: "list", // 配置数据的风格为列表形式
response:{message:"msg",statusCode:0}, // 修改响应中返回数据的定义
url: "/dept/loadDeptManagerLeftTreeJson" // 使用URL加载数据可以与data同时存在)
});
//监听点击的方法
dtree.on("node(deptTree)",function (obj) {
$("#pid").val(obj.param.nodeId);
console.log(obj.param.nodeId);
})
// 监听树节点点击事件
dtree.on("node(deptTree)", function (obj) {
$("#pid").val(obj.param.nodeId); // 将选中的节点ID赋值给隐藏域
console.log(obj.param.nodeId); // 打印节点ID到控制台
});
});
//给其它页面刷新当前页面数据表格的方法
// 给其它页面刷新当前页面数据表格的方法
function reloadTable(id) {
tableIns.reload({
where:{
id:id
id:id // 根据ID过滤数据
},
page:{
curr:1
curr:1 // 重置分页到第一页
}
});
}

Loading…
Cancel
Save