You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

715 lines
28 KiB

3 months ago
<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../../../lib/layui/css/layui.css">
<link rel="stylesheet" href="./icon/iconfont.css">
<style>
.box {
padding: 0 20px 0 20px;
}
.out-title {
margin-bottom: 5px;
}
.project-info {
height: 115px;
background: #E6EBF7;
padding: 2px 20px 0 20px;
margin-bottom: 10px;
}
.project-title {
display: flex;
justify-content: space-between;
margin: 10px 0 15px 0;
}
.title-left {
display: flex;
align-items: center;
}
.title-right {
color: #b4b8b0;
}
.project-source {
padding: 2px 6px;
color: #fff;
margin-right: 10px;
border-radius: 20px;
font-size: 12px;
}
.project-source-xj {
background: #47DE99;
}
.project-source-xb {
background: #F59A23;
}
.project-name {
font-weight: bolder;
}
.project-content {
display: flex;
flex-wrap: wrap;
}
.content-item {
width: 270px;
margin-bottom: 15px;
}
.zhuanjia-info {
display: flex;
/* height: 535px; */
}
.zhuanjia-left {
width: 75%;
}
.zhuanjia-right {
margin-left: 10px;
width: 25%;
/* height: 358px; */
height: 320px;
border: 1px solid #e2e3e5;
}
.select-title {
height: 35px;
border-bottom: 1px solid #e2e3e5;
font-size: 14px;
color: #b4b8b0;
display: flex;
align-items: center;
padding-left: 5px;
}
.serach {
display: flex;
align-items: center;
}
.zhuanjia-table {
height: 150px;
}
.select-content {}
.select-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 5px;
border-bottom: 1px solid #e2e3e5;
}
.item-person {
margin-bottom: 3px;
}
.item-org {
font-size: 12px;
color: #b4b8b0;
}
.item-right {
display: flex;
justify-content: space-between;
align-items: center;
}
.bottom {
width: 100%;
position: absolute;
bottom: 0px;
left: 0px;
height: 50px;
line-height: 50px;
background-color: #F8F8F8;
border-top: 1px solid #eee;
}
.button-container {
position: absolute;
right: 15px;
}
.extend-icon-lock {
font-size: 16px;
color: #FF1522;
cursor: pointer;
}
.extend-icon-unlock {
font-size: 16px;
color: #16B777;
cursor: pointer;
}
</style>
</head>
<body>
<div style="padding-left: 10px;">
<div class="layui-tab layui-tab-brief" lay-filter="tabFilter">
<ul class="layui-tab-title">
<li class="layui-this" lay-id="random">随机抽取</li>
<li lay-id="manual">手动选择</li>
</ul>
<div class="layui-tab-content" style="height: 100px;">
<!-- 随机抽取 -->
<div class="layui-tab-item layui-show">
<div class="box">
<div class="serach">
<label style="width: 80px;">研究专长:</label>
<div class="layui-form" style="width: 145px;margin-right: 10px;" id="zcSelectView1">
<script type="text/html" id="zcSelectScript1">
<select id="zcSelect1">
{{# layui.each(d.data, function(index, item){ }}
<option value="{{item.zc_id}}">{{item.zc_name}}</option>
{{# }); }}
</select>
</script>
</div>
<button type="button" class="layui-btn layui-btn-radius layui-btn-sm"
style="margin-left: 10px;" id="san"><i class="layui-icon layui-icon-senior "
style="font-size: 20px;color: #fff;"></i>&nbsp抽3名</button>
<button type="button" class="layui-btn layui-btn-radius layui-btn-sm"
style="margin-left: 10px;" id="wu"><i class="layui-icon layui-icon-senior "
style="font-size: 20px;color: #fff;"></i>&nbsp抽5名</button>
</div>
<div class="zhuanjia-info">
<table id="sjzjListTableView" lay-filter="tableSjFilter"></table>
</div>
<script type="text/html" id="sjToolBar">
<i class="layui-icon layui-icon-user" style="font-size: 16px; color: #1E9FFF;cursor: pointer;" lay-event="setFz"></i>
&nbsp
{{# if(d.is_lock){ }}
<i class="iconfont layui-extend-24gl-lock2 extend-icon-lock" onclick="lock('{{d.person_id}}')" id="lock_{{d.person_id}}"></i>
{{# } else { }}
<i class="iconfont layui-extend-24gl-unlock4 extend-icon-unlock" onclick="lock('{{d.person_id}}')" id="lock_{{d.person_id}}"></i>
{{# } }}
</script>
</div>
</div>
<!-- 手动选择 -->
<div class="layui-tab-item">
<div class="box">
<div class="zhuanjia-info">
<div class="zhuanjia-left">
<div class="serach">
<label style="width: 80px;">研究专长:</label>
<div class="layui-form" style="width: 145px;margin-right: 10px;" id="zcSelectView">
<script type="text/html" id="zcSelectScript">
<select id="zcSelect">
<option value="-1">全部</option>
{{# layui.each(d.data, function(index, item){ }}
<option value="{{item.zc_id}}">{{item.zc_name}}</option>
{{# }); }}
</select>
</script>
</div>
<label style="width: 60px;">关键字:</label>
<input style="width: 200px;" class="layui-input" placeholder="姓名/所属单位"
id="keyWord" />
<button type="button" class="layui-btn layui-btn-radius layui-btn-sm"
style="margin-left: 10px;" id="search"><i class="layui-icon layui-icon-search "
style="font-size: 20px;color: #fff;"></i>&nbsp查询</button>
</div>
<div class="zhuanjia-table">
<table id="zhuanjiaListTableView" lay-filter="tableFilter"></table>
</div>
</div>
<div class="zhuanjia-right">
<div class="select-title">
已选评审专家
</div>
<div class="select-content" id="selectView"></div>
<script id="selectScript" type="text/html">
{{# layui.each(d, function(index, item){ }}
<div class="select-item">
<div class="item-left">
<div class="item-person">
{{# if(item.is_fuzeren==0){ }}
{{item.person_name}}
{{# } else { }}
{{item.person_name}}(负责人)
{{# } }}
</div>
{{# if(item.bureau_name.length>11){ }}
<div class="item-org" title="{{item.bureau_name}}">
{{item.bureau_name.substring(0,11)}}...
</div>
{{# } else { }}
<div class="item-org">
{{item.bureau_name}}
</div>
{{# } }}
</div>
<div class="item-right">
<i onclick="setFuzeren('{{item.person_id}}')" class="layui-icon layui-icon-user" style="font-size: 16px; color: #1E9FFF;margin-right: 5px;cursor: pointer;" title="设置为负责人"></i>
<i onclick="removeZhuanJia('{{item.person_id}}')" class="layui-icon layui-icon-close-fill" style="font-size: 18px; color: #EC808D;margin-right: 1px;cursor: pointer;" title="移除专家"></i>
</div>
</div>
{{# }); }}
</script>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="bottom">
<div class="button-container">
<button type="button" class="layui-btn layui-btn-sm" id="save">
<i class="layui-icon layui-icon-ok"></i>
提交
</button>
</div>
</div>
<script src="../../../lib/layui/layui.js"></script>
<script src="../../../lib/jquery.min.js"></script>
<script src="../../../lib/layer/layer.js"></script>
<script>
var arr = [];
var lockarr = [];
var tempindex = -1;
var tempName = "";
var tabId;
var fzPersonId = "";
layui.use(['table', 'laytpl', 'form', 'element'], function () {
var table = layui.table
, laytpl = layui.laytpl
, element = layui.element
, form = layui.form;
var currentTableData;
// 获取父页传来的项目ID
var ys_id = GetQueryString("ys_id");
var tplZcSelectView1 = zcSelectScript1.innerHTML,
viewZcSelectView1 = document.getElementById('zcSelectView1');
var tplZcSelectView = zcSelectScript.innerHTML,
viewZcSelectView = document.getElementById('zcSelectView');
tabId = 1;
getZc1();
// 获取研究专长
function getZc() {
$.ajax({
type: "GET",
dataType: "json",
url: "/QingLong/expert/getExpertZc",
success: function (data) {
laytpl(tplZcSelectView).render(data, function (html) {
viewZcSelectView.innerHTML = html;
});
form.render('select');
}
});
}
// 获取研究专长
function getZc1() {
$.ajax({
type: "GET",
dataType: "json",
url: "/QingLong/expert/getExpertZc",
success: function (data) {
laytpl(tplZcSelectView1).render(data, function (html) {
viewZcSelectView1.innerHTML = html;
});
form.render('select');
}
});
}
// 点击TAB标签
element.on('tab(tabFilter)', function () {
var layid = this.getAttribute('lay-id');
if (layid == "manual") {
tabId = 2;
getZc();
getExpert();
} else {
tabId = 1;
getZc1();
}
});
//获取专家
function getExpert() {
$.ajax({
type: "GET",
dataType: "json",
url: "/QingLong/gtzz/getYsInfo",
data: {
ys_id: ys_id
},
success: function (res) {
arr = [];
for (var i in res.listExpert) {
var _data = { person_id: res.listExpert[i].person_id, person_name: res.listExpert[i].person_name, bureau_name: res.listExpert[i].bureau_name, is_fuzeren: res.listExpert[i].is_master };
arr.push(_data);
}
renderTable();
reloadZhuanJiaView();
}
});
}
//获取随机专家
function getSjExpert(_num) {
var lockStr = lockarr.join(",");
table.render({
elem: '#sjzjListTableView'
, url: '/QingLong/gtzz/getYsExportRandom'
, where: {
lockExpertIds: lockStr,
master_id: fzPersonId,
num: _num,
zc_id: $("#zcSelect1").val()
}
, cols: [[
{ align: 'center', field: 'person_name', title: '姓名', width: '20%' }
, { align: 'center', field: 'bureau_name', title: '所属单位', width: '40%' }
, { align: 'center', field: 'zc_name', title: '研究专长', width: '20%' }
, { align: 'center', field: 'age', title: '年龄', width: '10%' }
, { align: 'center', toolbar: '#sjToolBar', title: '操作', width: '10%' }
]]
, height: "275"
, parseData: function (res) { //res 即为原始返回的数据
tempindex = -1;
fzPersonId = "";
var d = new Date();
var nowYear = d.getFullYear();
for (var i in res.listExpert) {
res.listExpert[i]["age"] = nowYear - res.listExpert[i]["birthday"].split("-")[0];
if (res.listExpert[i]["is_lock"]) {
lockarr.push(res.listExpert[i]["person_id"]);
}
if (res.listExpert[i]["is_master"]) {
var fzPersonName = res.listExpert[i]["person_name"];
res.listExpert[i]["person_name"] = fzPersonName + "(负责人)";
tempindex = i;
fzPersonId = res.listExpert[i]["person_id"];
}
}
return {
"code": 0,
"msg": "",
"count": 100,
"data": res.listExpert
}
}, done: function () {
currentTableData = table.cache.sjzjListTableView;
}
});
}
function renderTable() {
table.render({
elem: '#zhuanjiaListTableView'
, url: '/QingLong/expert/getExpertList'
, where: {
zc_id: "-1"
}
, cols: [[
{ align: 'center', field: 'person_name', title: '姓名', width: '15%' }
, { align: 'center', field: 'bureau_name', title: '所属单位', width: '42%' }
, { align: 'center', field: 'zc_name', title: '研究专长', width: '25%' }
, { align: 'center', field: 'age', title: '年龄', width: '10%' }
, { align: 'center', type: 'checkbox', width: '8%' }
]]
, height: "275"
, parseData: function (res) { //res 即为原始返回的数据
var d = new Date();
var nowYear = d.getFullYear();
for (var i in res.data) {
if (arr.some(item => item.person_id === res.data[i].person_id)) {
res.data[i]["LAY_CHECKED"] = true;
}
res.data[i]["age"] = nowYear - res.data[i]["birthday"].split("-")[0];
}
return {
"code": res.code,
"msg": res.msg,
"count": res.count,
"data": res.data
};
}
, done: function (res) {
// 禁用表头中的全选
$('th[data-field="4"] input[type="checkbox"]').prop('disabled', true);
for (let i in res.data) {
// 给checkbox增加一个ID为取消选中准备
$('td[data-field="4"] input[type="checkbox"]').eq(i).attr('id', 'chk_' + res.data[i]["person_id"]);
}
form.render('checkbox');
}
});
}
var tpl = selectScript.innerHTML,
view = document.getElementById('selectView');
// 重新加载已选专家的列表
function reloadZhuanJiaView() {
laytpl(tpl).render(arr, function (html) {
view.innerHTML = html;
});
}
table.on('checkbox(tableFilter)', function (obj) {
var data = obj.data;
var sel = obj.checked;
var _data = { person_id: data.person_id, person_name: data.person_name, bureau_name: data.bureau_name, is_fuzeren: 0 };
if (sel) {
arr.push(_data);
reloadZhuanJiaView();
} else {
removeAarry(data.person_id);
reloadZhuanJiaView();
}
});
table.on('tool(tableSjFilter)', function (obj) {
if (tempindex > -1) {
$(".layui-table tbody tr[data-index='" + tempindex + "']").find("td:eq(0)").find("div:eq(0)").html(tempName);
}
tempindex = $(obj.tr[0]).attr('data-index');
tempName = obj.data.person_name.replace("(负责人)", "");
fzPersonId = obj.data.person_id;
$(".layui-table tbody tr[data-index='" + tempindex + "']").find("td:eq(0)").find("div:eq(0)").html(tempName + "(负责人)");
});
// 表格重载
window.reloadtable = function () {
table.reload('zhuanjiaListTableView', {
where: {
zc_id: $("#zcSelect").val()
, keyword: $("#keyWord").val()
}
});
};
$("#san").click(function () {
getSjExpert(3);
});
$("#wu").click(function () {
getSjExpert(5);
});
// 点击查询
$("#search").click(function () {
reloadtable();
});
// 确定(保存)
$("#save").click(function () {
if (tabId == 1) {
if (fzPersonId != "") {
currentTableData = currentTableData.filter(item => item.person_id != fzPersonId);
var personIdsArr = currentTableData.map(item => item.person_id);
var personIds = personIdsArr.join(",");
$.ajax({
type: "POST",
dataType: "json",
url: "/QingLong/gtzz/saveYsExpert",
data: {
ys_id: ys_id,
person_ids: personIds,
master_id: fzPersonId
},
success: function (data) {
if (data.success) {
layer.msg("设置成功", { icon: 1, time: 1300, shade: [0.1, '#000', true] }, function () {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
parent.layui.table.reload("schoolListTableView");
});
} else {
alert(data.message);
}
}
});
} else {
layer.msg("请设置负责人!", { icon: 2, time: 1500, shade: [0.1, '#000', true] });
}
} else {
if (arr.length < 2) {
layer.msg("专家人数不能少于2人", { icon: 2, time: 1500, shade: [0.1, '#000', true] });
return;
}
if (arr.some(item => item.is_fuzeren === 1)) {
var personIds = "";
var masterId = "";
for (var i = 0; i < arr.length; i++) {
if (arr[i].is_fuzeren === 1) {
masterId = arr[i].person_id;
}
else {
personIds = personIds + arr[i].person_id + ",";
}
}
personIds = personIds.substring(0, personIds.length - 1);
$.ajax({
type: "POST",
dataType: "json",
url: "/QingLong/gtzz/saveYsExpert",
data: {
ys_id: ys_id,
person_ids: personIds,
master_id: masterId
},
success: function (data) {
if (data.success) {
layer.msg("设置成功", { icon: 1, time: 1300, shade: [0.1, '#000', true] }, function () {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
parent.layui.table.reload("schoolListTableView");
});
} else {
alert(data.message);
}
}
});
} else {
layer.msg("请设置负责人!", { icon: 2, time: 1500, shade: [0.1, '#000', true] });
}
}
});
// 取消(关闭)
$("#close").click(function () {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
});
window.lock = function (person_id) {
var className = $("#lock_" + person_id).attr('class');
$("#lock_" + person_id).removeClass(className);
if (className == "iconfont layui-extend-24gl-unlock4 extend-icon-unlock") {
$("#lock_" + person_id).addClass("iconfont layui-extend-24gl-lock2 extend-icon-lock");
lockarr.push(person_id);
} else {
$("#lock_" + person_id).addClass("iconfont layui-extend-24gl-unlock4 extend-icon-unlock");
lockarr = lockarr.filter(item => item != person_id);
}
}
// 设置负责人
window.setFuzeren = function (person_id) {
arr.some(item => {
if (item.is_fuzeren === 1) {
item.is_fuzeren = 0;
}
});
arr.some(item => {
if (item.person_id === person_id) {
item.is_fuzeren = 1;
}
});
reloadZhuanJiaView();
};
// 移除专家
window.removeZhuanJia = function (person_id) {
removeAarry(person_id);
reloadZhuanJiaView();
// 设置表格中的checkbox为取消选中设置属性要用prop
$("#chk_" + person_id).prop("checked", false);
// 重新加载
form.render('checkbox');
}
// 根据人员ID移除专家数组中的元素
function removeAarry(person_id) {
for (var i = 0; i < arr.length; i++) {
if (arr[i].person_id === person_id) {
index = i;
}
}
arr.splice(index, 1);
}
// 获取参数值
function GetQueryString(name, istop) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (typeof (istop) != "undefined") r = top.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]);
return null;
}
form.render();
});
</script>
</body>
</html>