2025-11-27 16:55:35 +08:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en" xmlns="http://www.w3.org/1999/html">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<title>团队工程绑定页面</title>
|
|
|
|
|
<link rel="stylesheet" href="../../layui-v2.8.18/layui/css/layui.css" media="all"/>
|
|
|
|
|
</head>
|
|
|
|
|
<style>
|
|
|
|
|
html, body {
|
|
|
|
|
height: 100%
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.layui-table th {
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
text-align: center
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.layui-table td {
|
|
|
|
|
text-align: center
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.layui-btn-sm {
|
|
|
|
|
height: 35px;
|
|
|
|
|
line-height: 35px;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
}
|
|
|
|
|
.selected-node {
|
|
|
|
|
background-color: #e5ede7;
|
|
|
|
|
height: 32px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
<body style="margin-left: 15px">
|
|
|
|
|
<form class="layui-form" action="" onsubmit="return false">
|
|
|
|
|
<div class="layuimini-container" style="height: 100%">
|
|
|
|
|
<div class="layuimini-main" style="display: flex;height: 100%">
|
|
|
|
|
<div style="width: 30%;flex: none;height: 100%" >
|
|
|
|
|
<div class="layui-form-item" style="height: 100%">
|
|
|
|
|
<div class="layui-input-block"
|
|
|
|
|
style="margin-left: 0;display: flex;flex-direction: column;height: 100%">
|
|
|
|
|
<div class="layui-form-item">
|
|
|
|
|
<div class="layui-input-inline">
|
|
|
|
|
<input type="text" id="keyWordPro" placeholder="请输入工程名称" autocomplete="off"
|
|
|
|
|
class="layui-input">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
|
|
|
|
|
<button id="searchProBt" class="layui-btn layui-btn-sm">查询</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="test1" style="max-height: 670px;overflow: auto;height: 95%"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="flex: auto;width: 69%;">
|
|
|
|
|
<div class="layui-form-item">
|
|
|
|
|
<div class="layui-input-inline">
|
|
|
|
|
<input type="text" id="keyWord" placeholder="请输入团队名称" autocomplete="off"
|
|
|
|
|
class="layui-input">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
|
|
|
|
|
<button id="searchBt" class="layui-btn layui-btn-sm">查询</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<table id="teamTable" lay-filter="teamTable"></table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
|
|
|
|
<script src="../../js/jquery/jquery-3.6.0.js"></script>
|
|
|
|
|
<script src="../../layui-v2.8.18/layui/layui.js"></script>
|
|
|
|
|
<script type="text/javascript" src="../../js/jq.js"></script>
|
|
|
|
|
<script src="../../js/common_methon.js"></script>
|
2025-12-09 18:44:29 +08:00
|
|
|
<script type="text/javascript" src="../../../public/public.js"></script>
|
2025-11-27 16:55:35 +08:00
|
|
|
<script type="text/javascript" src="../../js/publicJs.js"></script>
|
|
|
|
|
<script type="text/javascript" src="../../js/select.js"></script>
|
|
|
|
|
<script type="text/javascript" src="../../js/my/permission.js"></script>
|
|
|
|
|
<script>
|
|
|
|
|
layui.config({
|
|
|
|
|
base: '../../js/layuiModules/', // 第三方模块所在目录
|
|
|
|
|
version: 'v1.6.4' // 插件版本号
|
|
|
|
|
}).extend({
|
|
|
|
|
soulTable: 'notice,layNotify', // 模块
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
var form;
|
|
|
|
|
var tree;
|
|
|
|
|
var table;
|
|
|
|
|
var notice;
|
|
|
|
|
var layNotify;
|
|
|
|
|
var proId = "";
|
|
|
|
|
var subId = "";
|
|
|
|
|
var proName = "";
|
|
|
|
|
layui.use(['form', 'table', 'tree', 'notice', 'layNotify'], function () {
|
|
|
|
|
form = layui.form;
|
|
|
|
|
tree = layui.tree;
|
|
|
|
|
table = layui.table;
|
|
|
|
|
notice = layui.notice;
|
|
|
|
|
layNotify = layui.layNotify;
|
|
|
|
|
|
|
|
|
|
redenTree();
|
|
|
|
|
showTable("1");
|
|
|
|
|
|
|
|
|
|
$("#searchProBt").click(function () {
|
|
|
|
|
redenTree();
|
|
|
|
|
})
|
|
|
|
|
$("#searchBt").click(function () {
|
|
|
|
|
if (isEmpty(proId)){
|
|
|
|
|
showTable("1");
|
|
|
|
|
}else {
|
|
|
|
|
showTable("2");
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
table.on('checkbox(teamTable)', function (obj) {
|
|
|
|
|
|
|
|
|
|
var checkType = obj.type;
|
|
|
|
|
if (checkType == "all"){
|
|
|
|
|
showTable(isEmpty(proId) ? "1" : "2");
|
|
|
|
|
// layer.msg("请单独选择每一项进行绑定或者解绑，谢谢！",{icon:0,timeout:2000})
|
|
|
|
|
reloadTip("绑定","请单独选择每一项进行绑定或者解绑，谢谢！",'error');
|
|
|
|
|
return ;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// true选择 false取消
|
|
|
|
|
var isCheck = obj.checked;
|
|
|
|
|
var thisCheckData = [obj.data];
|
|
|
|
|
if (isEmpty(proId)) {
|
|
|
|
|
reloadTip("绑定","未选中工程,请先选择工程!",'error')
|
|
|
|
|
// layer.msg("未选中项目部,请先选择项目部!",{icon:2,timeout:2000})
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
var data = {
|
|
|
|
|
"id":thisCheckData[0].id,
|
|
|
|
|
"proId":proId,
|
|
|
|
|
type : isCheck ? "1" : "0"
|
|
|
|
|
}
|
|
|
|
|
if (isCheck){
|
|
|
|
|
ajaxCommonMethod('/proManage/bindOrUnBindProTeam',data,"绑定成功","绑定失败")
|
|
|
|
|
}else {
|
|
|
|
|
ajaxCommonMethod('/proManage/bindOrUnBindProTeam',data,"解绑成功","解绑失败")
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* layui树结构
|
|
|
|
|
*/
|
|
|
|
|
function redenTree() {
|
|
|
|
|
$.ajax({
|
|
|
|
|
type: 'post',
|
2025-12-09 18:44:29 +08:00
|
|
|
url: czl_ht_url + '/proManage/tree',//数据接口
|
2025-11-27 16:55:35 +08:00
|
|
|
dataType: 'json', // 服务器返回数据类型
|
|
|
|
|
async: false,
|
|
|
|
|
data: {
|
|
|
|
|
keyWord: $("#keyWordPro").val()
|
|
|
|
|
},
|
|
|
|
|
success: function (data) {
|
|
|
|
|
var result = [];
|
|
|
|
|
for (let i = 0; i < data.length; i++) {
|
|
|
|
|
if (data[i].level == '1') {
|
|
|
|
|
data[i].spread = true
|
|
|
|
|
result.push(data[i])
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
for (let i = 0; i < result.length; i++) {
|
|
|
|
|
result[i].children = []
|
|
|
|
|
for (let j = 0; j < data.length; j++) {
|
|
|
|
|
if (result[i].id == data[j].parentId) {
|
|
|
|
|
data[i].spread = true
|
|
|
|
|
result[i].children.push(data[j])
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
tree.render({
|
|
|
|
|
elem: '#test1'
|
|
|
|
|
, id: 'test1'
|
|
|
|
|
, data: result
|
|
|
|
|
, spread: true
|
|
|
|
|
, showLine: false // 是否开启连接线
|
|
|
|
|
, onlyIconControl: false
|
|
|
|
|
, click: function (obj) {
|
|
|
|
|
var level = obj.data.level;
|
|
|
|
|
if (level == '2' && obj.state == 'open') {
|
|
|
|
|
$("#keyWord").val("");
|
|
|
|
|
proName = obj.data.title;
|
|
|
|
|
subId = obj.data.id.split("-")[0];
|
|
|
|
|
proId = obj.data.id.split("-")[1];
|
|
|
|
|
showTable("2");
|
|
|
|
|
markSelectedNode(obj.data.id);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
// 绑定提示信息
|
|
|
|
|
$('#test1').on('mouseover', '.layui-tree-txt', function(){
|
|
|
|
|
var title = $(this).text();
|
|
|
|
|
layer.tips(title, this, {
|
|
|
|
|
tips: [1, '#000'], // 提示框风格和背景色
|
|
|
|
|
time: 0 // 鼠标悬停时间
|
|
|
|
|
});
|
|
|
|
|
}).on('mouseout', '.layui-tree-txt', function(){
|
|
|
|
|
layer.closeAll();
|
|
|
|
|
});
|
|
|
|
|
markSelectedNode(subId+"-"+proId);
|
|
|
|
|
},
|
|
|
|
|
error: function (err) {
|
|
|
|
|
console.log("获取工程下拉列表出错：", err);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 团队列表
|
|
|
|
|
*/
|
|
|
|
|
function showTable(type) {
|
|
|
|
|
$.ajax({
|
|
|
|
|
type: 'post',
|
2025-12-09 18:44:29 +08:00
|
|
|
url: czl_ht_url + '/proManage/getTeamsList',//数据接口
|
2025-11-27 16:55:35 +08:00
|
|
|
dataType: 'json', // 服务器返回数据类型
|
|
|
|
|
async: false,
|
|
|
|
|
data: {
|
|
|
|
|
proName: proName,
|
|
|
|
|
proId: proId,
|
|
|
|
|
keyWord: $("#keyWord").val(),
|
|
|
|
|
type: type
|
|
|
|
|
},
|
|
|
|
|
success: function (data) {
|
|
|
|
|
table.render({
|
|
|
|
|
elem: '#teamTable'
|
|
|
|
|
, cellMinWidth: 80
|
|
|
|
|
, cols: [[ //表头
|
|
|
|
|
{type: 'checkbox', title: '复选框', field: 'allCheck', align: 'center'},
|
|
|
|
|
{field: 'teamName', title: '团队名称', align: 'center'},
|
|
|
|
|
{field: 'voltageLevel', title: '电压等级', align: 'center'},
|
|
|
|
|
{field: 'teamNum', title: '团队人数', align: 'center'},
|
|
|
|
|
{field: 'remark', title: '备注', align: 'center'},
|
|
|
|
|
]],
|
|
|
|
|
data: data,
|
|
|
|
|
page: true //开启分页
|
|
|
|
|
, limits: [15, 50,100] //一页选择显示3,5或10条数据
|
|
|
|
|
, limit: 15 , //一页显示5条数据
|
|
|
|
|
done: function (res) {
|
|
|
|
|
var state = "";
|
|
|
|
|
for (var i in res.data) {
|
|
|
|
|
var item = res.data[i];
|
|
|
|
|
/**
|
|
|
|
|
* 初始化数据表格赋值
|
|
|
|
|
*/
|
|
|
|
|
if (item.status == '1') {
|
|
|
|
|
res.data[i]["LAY_CHECKED"] = true;
|
|
|
|
|
$('tr[data-index=' + i + '] input[type="checkbox"]').prop('checked', true);
|
|
|
|
|
$('tr[data-index=' + i + '] input[type="checkbox"]').next().addClass('layui-form-checked');
|
|
|
|
|
state = "1";
|
|
|
|
|
form.render();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
form.render('checkbox');
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
error: function (err) {
|
|
|
|
|
console.log("获取工程下拉列表出错：", err);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 标注选中节点
|
|
|
|
|
function markSelectedNode(id) {
|
|
|
|
|
// 先移除之前的标记样式
|
|
|
|
|
var prevSelectedNode = document.querySelector('.selected-node');
|
|
|
|
|
if (prevSelectedNode) {
|
|
|
|
|
prevSelectedNode.classList.remove('selected-node');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 根据id找到对应的节点元素
|
|
|
|
|
var selectedNode = document.querySelector('[data-id="' + id + '"]');
|
|
|
|
|
if (selectedNode) {
|
|
|
|
|
// 给选中的节点添加标记样式
|
|
|
|
|
selectedNode.classList.add('selected-node');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
function ajaxCommonMethod(url,data,success,error){
|
|
|
|
|
$.ajax({
|
|
|
|
|
type: 'POST',
|
|
|
|
|
async: false, // 默认异步true,false表示同步
|
2025-12-09 18:44:29 +08:00
|
|
|
url: czl_ht_url + url,// 请求地址
|
2025-11-27 16:55:35 +08:00
|
|
|
contentType: "application/x-www-form-urlencoded",
|
|
|
|
|
dataType: 'json', // 服务器返回数据类型
|
|
|
|
|
data: data, //获取提交的表单字段
|
|
|
|
|
success: function (data) {
|
|
|
|
|
var resMsg = data.resMsg;
|
|
|
|
|
if ("数据获取成功" == resMsg) {
|
|
|
|
|
reloadTip(success.substring(0,2),success,'success');
|
|
|
|
|
redenTree();
|
|
|
|
|
}else {
|
|
|
|
|
reloadTip(success.substring(0,2),error,"error");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function reloadTip(tip,message,type){
|
|
|
|
|
layNotify.notice({
|
|
|
|
|
title: tip+"提示",
|
|
|
|
|
type: type,
|
|
|
|
|
message: message
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</script>
|
