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.
402 lines
13 KiB
402 lines
13 KiB
<!DOCTYPE html>
|
|
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
|
|
<head>
|
|
<th:block th:include="include :: header('涉密人员培训列表')" />
|
|
</head>
|
|
<style>
|
|
.count_box{
|
|
width: 100%;
|
|
height: 95%;
|
|
margin: 0 auto;
|
|
}
|
|
.count_top{
|
|
width: 100%;
|
|
height: 50%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
background-color: white;
|
|
border-radius: 10px;
|
|
margin-bottom: 10px;
|
|
}
|
|
.count_top ul{
|
|
width: 36%;
|
|
height: 100%;
|
|
list-style: none;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 0;
|
|
flex-wrap: wrap;
|
|
}
|
|
.count_top ul li{
|
|
width: 231px;
|
|
height: 181px;
|
|
background-color: white;
|
|
border-radius: 10px;
|
|
box-shadow: -4px 4px 4px #d5d5d5;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.yuan{
|
|
width: 300px;
|
|
height: 300px;
|
|
display: inline-block;
|
|
position: absolute;
|
|
bottom: -163px;
|
|
right: -146px;
|
|
border-radius: 50%;
|
|
}
|
|
.count_top ul li:nth-child(1) .yuan{
|
|
background-color: #e2f0ff;
|
|
}
|
|
.count_top ul li:nth-child(2) .yuan{
|
|
background-color: #ffe7e9;
|
|
}
|
|
.count_top ul li:nth-child(3) .yuan{
|
|
background-color: #e3f7ef;
|
|
}
|
|
.count_top ul li:nth-child(4) .yuan{
|
|
background-color: #f3f7e3;
|
|
}
|
|
.count_top ul li i{
|
|
font-size: 33px;
|
|
position: absolute;
|
|
top: 72%;
|
|
left: 74%;
|
|
transform: translate(-50%,-50%);
|
|
}
|
|
.count_top ul li .textList{
|
|
position: absolute;
|
|
width: 80%;
|
|
height: 117px;
|
|
top: 18%;
|
|
left: 13px;
|
|
z-index: 99;
|
|
}
|
|
.textList p{
|
|
color: rgba(85, 90, 105, 0.79);
|
|
}
|
|
.textList p:nth-of-type(1) {
|
|
font-size: 33px;
|
|
}
|
|
|
|
.textList p:nth-of-type(2) {
|
|
font-size: 24px;
|
|
}
|
|
.count_bottom{
|
|
width: 100%;
|
|
height: 55%;
|
|
border-radius: 10px;
|
|
}
|
|
.children_echarts{
|
|
width: 33%;
|
|
height: 100%;
|
|
}
|
|
</style>
|
|
<body class="gray-bg">
|
|
<div class="container-div" id="app" style="padding: 0 12px 0 12px;">
|
|
<div class="count_box">
|
|
<div class="count_top">
|
|
<ul>
|
|
<li>
|
|
<div class="textList">
|
|
<p>
|
|
{{countList.total}}
|
|
</p>
|
|
<p>
|
|
培训次数
|
|
</p>
|
|
</div>
|
|
<span class="yuan"></span>
|
|
<i class="fa fa-clipboard" style="color: #0078ff"></i>
|
|
</li>
|
|
<li>
|
|
<div class="textList">
|
|
<p>
|
|
{{countList.shtg}}
|
|
</p>
|
|
<p>
|
|
审核通过
|
|
</p>
|
|
</div>
|
|
<span class="yuan"></span>
|
|
<i class="fa fa-newspaper-o" style="color: #ff313c"></i>
|
|
</li>
|
|
<li>
|
|
<div class="textList">
|
|
<p>
|
|
{{countList.shwtg}}
|
|
</p>
|
|
<p>
|
|
审核未通过
|
|
</p>
|
|
</div>
|
|
<span class="yuan"></span>
|
|
<i class="fa fa-pie-chart" style="color: #12b975"></i>
|
|
</li>
|
|
<li>
|
|
<div class="textList">
|
|
<p>
|
|
{{countList.dsh}}
|
|
</p>
|
|
<p>
|
|
待审核
|
|
</p>
|
|
</div>
|
|
<span class="yuan"></span>
|
|
<i class="fa fa-hourglass-2" style="color: #12b975"></i>
|
|
</li>
|
|
</ul>
|
|
<div class="children_echarts left_echarts" style="margin-left: 17px;">
|
|
<div id="leftMain" style="width: 430px;height:380px"></div>
|
|
</div>
|
|
<div class="children_echarts center_echarts">
|
|
<div id="centerMain" style="width: 430px;height:380px"></div>
|
|
</div>
|
|
</div>
|
|
<div class="count_bottom">
|
|
<div class="col-sm-12 search-collapse" style="margin-top: 0">
|
|
<form id="formId">
|
|
<div class="select-list">
|
|
<ul>
|
|
<li>
|
|
<label>人员名称：</label>
|
|
<input type="text" name="trainName"/>
|
|
</li>
|
|
<li>
|
|
<label>所属地市：</label>
|
|
<input type="text" name="AREAID"/>
|
|
</li>
|
|
<li>
|
|
<label>培训日期：</label>
|
|
<input type="text" class="time-input" placeholder="请选择培训日期" name="trainDate"/>
|
|
</li>
|
|
|
|
<li>
|
|
<label>培训状态：</label>
|
|
<select name="trainState" th:with="type=${@dict.getType('sys_examine_state')}">
|
|
<option value="">所有</option>
|
|
<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
|
|
</select>
|
|
</li>
|
|
<li>
|
|
<a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i> 搜索</a>
|
|
<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i> 重置</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="btn-group-sm" id="toolbar" role="group">
|
|
<a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="system:trainnum:export">
|
|
<i class="fa fa-download"></i> 导出
|
|
</a>
|
|
</div>
|
|
<div class="col-sm-12 select-table table-striped" style="min-height: 80%;">
|
|
<table id="bootstrap-table"></table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<th:block th:include="include :: footer" />
|
|
<th:block th:include="include :: echarts-js" />
|
|
<script th:inline="javascript">
|
|
var detailFlag = [[${@permission.hasPermi('system:trainnum:detail')}]];
|
|
var listFlag = [[${@permission.hasPermi('system:trainnum:list')}]];
|
|
var trainTypeDatas = [[${@dict.getType('sys_usertrain_typer')}]];
|
|
var trainSubjectDatas = [[${@dict.getType('sys_usertrain_obj')}]];
|
|
var trainStateDatas = [[${@dict.getType('sys_examine_state')}]];
|
|
var prefix = ctx + "system/trainnum";
|
|
|
|
$(function() {
|
|
var options = {
|
|
url: prefix + "/list",
|
|
createUrl: prefix + "/add",
|
|
updateUrl: prefix + "/edit/{id}",
|
|
detailUrl: prefix + "/detail/{id}",
|
|
removeUrl: prefix + "/remove",
|
|
exportUrl: prefix + "/export",
|
|
modalName: "涉密人员培训",
|
|
pageSize:'5',
|
|
columns: [
|
|
{
|
|
field: 'id',
|
|
title: 'ID',
|
|
visible: false
|
|
},
|
|
{
|
|
field: 'AREAID',
|
|
title: '所属地市',
|
|
visible: false
|
|
|
|
},
|
|
{
|
|
field: 'trainName',
|
|
title: '培训人员'
|
|
},
|
|
{
|
|
field: 'FRAMEWORK',
|
|
title: '所属区县',
|
|
visible: false
|
|
},
|
|
{
|
|
field: 'USERNAME',
|
|
title: '人员名称',
|
|
visible: false
|
|
},
|
|
{
|
|
field: 'deptName',
|
|
title: '单位名称',
|
|
visible: false
|
|
},
|
|
{
|
|
field: 'trainType',
|
|
title: '培训类型',
|
|
formatter: function(value, row, index) {
|
|
return $.table.selectDictLabel(trainTypeDatas, value);
|
|
}
|
|
},
|
|
{
|
|
field: 'trainSubject',
|
|
title: '培训对象',
|
|
formatter: function(value, row, index) {
|
|
return $.table.selectDictLabel(trainSubjectDatas, value);
|
|
}
|
|
},
|
|
{
|
|
field: 'trainAddress',
|
|
title: '培训地点'
|
|
},
|
|
{
|
|
field: 'trainDate',
|
|
title: '培训开始日期'
|
|
},
|
|
{
|
|
field: 'trainTimeend',
|
|
title: '培训结束时间'
|
|
},
|
|
{
|
|
field: 'updateDepartid',
|
|
title: '更新单位',
|
|
visible: false
|
|
},
|
|
{
|
|
field: 'trainState',
|
|
title: '培训状态',//
|
|
formatter: function(value, row, index) {
|
|
return $.table.selectDictLabel(trainStateDatas, value);
|
|
}
|
|
},
|
|
{
|
|
field: 'PART',
|
|
title: '部门',
|
|
visible: false
|
|
},
|
|
{
|
|
title: '操作',
|
|
align: 'center',
|
|
formatter: function(value, row, index) {
|
|
var actions = [];
|
|
actions.push('<a class="btn btn-warning btn-xs ' + detailFlag + '" href="javascript:void(0)" onclick="$.operate.detail(\'' + row.id + '\')"><i class="fa fa-search"></i>详细</a> ');
|
|
return actions.join('');
|
|
}
|
|
}]
|
|
};
|
|
$.table.init(options);
|
|
});
|
|
function examine(id) {
|
|
var url = prefix + '/examine/' + id;
|
|
$.modal.open("涉密人员培训审核", url);
|
|
}
|
|
var app = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
countList:[],
|
|
tableData: [],
|
|
},
|
|
created(){
|
|
this.init()
|
|
},
|
|
methods:{
|
|
init(){
|
|
axios.post(prefix + '/countList').then(response => {
|
|
console.log(response)
|
|
this.countList = response.data.data
|
|
})
|
|
},
|
|
handleEdit(index,row){
|
|
var url = prefix + '/examnum/' + row.examId
|
|
$.modal.openNOButton("详情", url);
|
|
}
|
|
}
|
|
})
|
|
var myChart = echarts.init(document.getElementById('leftMain'));
|
|
axios.post(prefix + '/countTrainMonth').then(response => {
|
|
if (response.data.code == web_status.SUCCESS){
|
|
myChart.setOption({
|
|
title: {
|
|
text: '审核通过'
|
|
},
|
|
tooltip: {},
|
|
legend: {
|
|
data:['次数']
|
|
},
|
|
xAxis: {
|
|
data: response.data.data.xAxisData,
|
|
axisLabel: {
|
|
rotate: 45, // 旋转标签的角度
|
|
margin: 10, // 标签与坐标轴的间距
|
|
},
|
|
},
|
|
yAxis: {
|
|
},
|
|
series: [
|
|
{
|
|
name: '次数',
|
|
type: 'bar',
|
|
data: response.data.data.yAxisData,
|
|
itemStyle: {
|
|
color: '#f3bc67'
|
|
}
|
|
}
|
|
]
|
|
});
|
|
}
|
|
})
|
|
var centerMain = echarts.init(document.getElementById('centerMain'));
|
|
axios.post(prefix + '/countTrainNoMonth').then(response => {
|
|
if (response.data.code == web_status.SUCCESS){
|
|
centerMain.setOption({
|
|
title: {
|
|
text: '待审核'
|
|
},
|
|
tooltip: {},
|
|
legend: {
|
|
data:['次数']
|
|
},
|
|
xAxis: {
|
|
data: response.data.data.xAxisData,
|
|
axisLabel: {
|
|
rotate: 45, // 旋转标签的角度
|
|
margin: 10, // 标签与坐标轴的间距
|
|
},
|
|
},
|
|
yAxis: {
|
|
},
|
|
series: [
|
|
{
|
|
name: '次数',
|
|
type: 'bar',
|
|
data: response.data.data.yAxisData,
|
|
itemStyle: {
|
|
color: '#b546ff'
|
|
}
|
|
}
|
|
]
|
|
});
|
|
}
|
|
})
|
|
</script>
|
|
</body>
|
|
</html>
|