715 lines
28 KiB
HTML
715 lines
28 KiB
HTML
<!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> 抽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> 抽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>
|
||
 
|
||
{{# 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> 查询</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> |