|
|
/** 工作汇报查看 */
|
|
|
layui.define(['table', 'form', 'sessions', 'admin', 'common', 'echarts','laydate','element'], function (exports) {
|
|
|
var $ = layui.$;
|
|
|
var form = layui.form;
|
|
|
var table = layui.table;
|
|
|
var admin = layui.admin;
|
|
|
var common = layui.common;
|
|
|
var laydate = layui.laydate;
|
|
|
var element = layui.element;
|
|
|
|
|
|
exports('workReportView', function () {
|
|
|
var sessions = layui.sessions;
|
|
|
var accessToken = sessions.getToken().access_token;
|
|
|
var domainName = common.domainName;
|
|
|
var companyChart = echarts.init(document.getElementById('chart-company-report'));
|
|
|
var noReadChart = echarts.init(document.getElementById('chart-noRead-report'));
|
|
|
var dateLimit = ""
|
|
|
var createTime = ""
|
|
|
var type = ''
|
|
|
var urlRepType = ''
|
|
|
var manufacturerId = ''
|
|
|
var reportDetailTable;
|
|
|
getUrlType()
|
|
|
|
|
|
if (type != '1') {
|
|
|
createTime = 'thisWeek';
|
|
|
} else {
|
|
|
$.each($("button.date"),function (i,e) {
|
|
|
var $dom = $(e);
|
|
|
if($dom.hasClass("active")){
|
|
|
$dom.removeClass("active")
|
|
|
}
|
|
|
})
|
|
|
$.each($("button.isRead"),function (i,e) {
|
|
|
var $dom = $(e);
|
|
|
if($dom.data("type") == '0'){
|
|
|
$dom.addClass("active")
|
|
|
}
|
|
|
})
|
|
|
$.each($('input[name="repType"]'),function (i,e) {
|
|
|
var $dom = $(e);
|
|
|
if($dom.val() == urlRepType){
|
|
|
$dom.attr('checked','checked');
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
//日期范围选择
|
|
|
laydate.render({
|
|
|
elem: '#dateLimit'
|
|
|
,range: '~',
|
|
|
done: function (value) {
|
|
|
dateLimit = value
|
|
|
if (dateLimit == '') {
|
|
|
$('[data-period="thisWeek"]').click()
|
|
|
} else {
|
|
|
$.each($("button.date"),function (i,e) {
|
|
|
var $dom = $(e);
|
|
|
if($dom.hasClass("active")){
|
|
|
$dom.removeClass("active")
|
|
|
}
|
|
|
})
|
|
|
reloadAllChange()
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
|
|
|
form.render();
|
|
|
// loadDailyChart();
|
|
|
// loadReportableChart();
|
|
|
loadCompanyReport();
|
|
|
loadReadReport();
|
|
|
loadWorkReportTable();
|
|
|
loadConditionSelect();
|
|
|
var url = domainName + '/api-web/workreport/chart/noRead';
|
|
|
loadNoReadChart(noReadChart,url,'未读');
|
|
|
|
|
|
// tab页切换事件
|
|
|
element.on('tab(report-tab)', function (data) {
|
|
|
var name = '';
|
|
|
if (data.index == 0) {
|
|
|
url = domainName + '/api-web/workreport/chart/noRead'
|
|
|
name = '未读';
|
|
|
loadNoReadChart(noReadChart,url,name);
|
|
|
} else if (data.index == 1) {
|
|
|
url = domainName + '/api-web/workreport/chart/noReport?createTime=' + createTime + '&dateLimit=' + dateLimit;
|
|
|
name = '未报';
|
|
|
var noReportChat = echarts.init(document.getElementById('chart-noReport-report'));
|
|
|
loadNoReadChart(noReportChat,url,name);
|
|
|
} else if (data.index == 2) {
|
|
|
url = domainName + '/api-web/workreport/chart/noHandlingAlarmsChart'
|
|
|
name = '未处理';
|
|
|
var noAlarmChart = echarts.init(document.getElementById('chart-noAlarm-report'));
|
|
|
loadNoReadChart(noAlarmChart,url,name);
|
|
|
}
|
|
|
});
|
|
|
|
|
|
//监听Esc事件
|
|
|
$(document).keyup(function(event){
|
|
|
if(event.keyCode === 27 || event.keyCode === 96){
|
|
|
layer.closeAll();
|
|
|
}
|
|
|
});
|
|
|
|
|
|
$("button.isRead").unbind().on("click",function () {
|
|
|
var $dom = $(this);
|
|
|
$("button.isRead").removeClass("active")
|
|
|
$dom.addClass("active")
|
|
|
loadWorkReportTable();
|
|
|
});
|
|
|
|
|
|
// 日期方式选择
|
|
|
$('#btns-workreport-time button').click(function () {
|
|
|
$.each($("button.date"),function (i,e) {
|
|
|
var $dom = $(e);
|
|
|
if($dom.hasClass("active")){
|
|
|
$dom.removeClass("active")
|
|
|
}
|
|
|
})
|
|
|
$("#dateLimit").val('')
|
|
|
dateLimit = ''
|
|
|
$("#btns-workreport-time button").removeClass("active");
|
|
|
$(this).addClass("active");
|
|
|
createTime = ($(this).data("period"))
|
|
|
reloadAllChange();
|
|
|
});
|
|
|
|
|
|
// 回车搜索
|
|
|
$('[lay-filter="form-workreport-condition"] input').keydown(function (e) {
|
|
|
if (e.keyCode === 13) {
|
|
|
reloadAllChange();
|
|
|
}
|
|
|
});
|
|
|
// 单选框改变搜索
|
|
|
form.on('radio(workReport-currIsRead)', reloadAllChange);
|
|
|
form.on('radio(workReport-repType)', reloadAllChange);
|
|
|
// 下拉框改变搜索
|
|
|
form.on('select(slt-workreport-group)', reloadAllChange);
|
|
|
form.on('select(slt-workreport-user)', reloadAllChange);
|
|
|
|
|
|
// 勾选标记为已读事件
|
|
|
$('#btn-workreport-set-read').click(function () {
|
|
|
var checks = table.checkStatus('table-workreport-view').data;
|
|
|
checks = $.grep(checks, item => item.currIsRead == '0');
|
|
|
checks = $.map(checks, item => item.id);
|
|
|
setRead(checks);
|
|
|
});
|
|
|
// 标记全部为已读事件
|
|
|
$('#btn-workreport-set-all-read').click(function () {
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/workreport/setRead/all'
|
|
|
}).done(function (response) {
|
|
|
if (response.success) {
|
|
|
layer.msg('执行操作成功!', {icon: 1, time: 3000});
|
|
|
loadReadReport();
|
|
|
loadWorkReportTable();
|
|
|
} else {
|
|
|
layer.msg('执行操作失败!', {icon: 2, time: 3000});
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
|
|
|
// 加载工作汇报表格
|
|
|
function loadWorkReportTable() {
|
|
|
var conditions = form.val('form-workreport-condition');
|
|
|
$.each($("button.isRead"),function (i,e) {
|
|
|
var $dom = $(e);
|
|
|
if($dom.hasClass("active")){
|
|
|
conditions["currIsRead"] = $dom.data("type")
|
|
|
}
|
|
|
})
|
|
|
if(manufacturerId!=''){
|
|
|
conditions.manufacturerName = manufacturerId;
|
|
|
}
|
|
|
Object.assign(conditions, {access_token: accessToken, createTime: createTime, viewMode: 'true',dateLimit:dateLimit});
|
|
|
table.render({
|
|
|
elem: '#table-workreport-view',
|
|
|
url: domainName + '/api-web/workreport/page',
|
|
|
where: conditions,
|
|
|
height: 'full-360',
|
|
|
page: {
|
|
|
layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
|
|
|
theme: '#1E9FFF'
|
|
|
},
|
|
|
end: function (e) {
|
|
|
form.render()
|
|
|
},
|
|
|
limit: common.limit,
|
|
|
limits: common.limits,
|
|
|
even: true,
|
|
|
cols: [[{
|
|
|
type: 'checkbox'
|
|
|
}, {
|
|
|
type: 'numbers', title: '序号'
|
|
|
}, {
|
|
|
field: 'repType', title: '汇报类型', align: 'center',
|
|
|
templet: function (d) {
|
|
|
var typeName = ''
|
|
|
switch (d.repType) {
|
|
|
case 'day':
|
|
|
typeName = '日报'
|
|
|
break;
|
|
|
case 'week':
|
|
|
typeName = '周报'
|
|
|
break;
|
|
|
case 'month':
|
|
|
typeName = '月报'
|
|
|
break;
|
|
|
}
|
|
|
return typeName
|
|
|
}
|
|
|
}, {
|
|
|
field: 'repTitle', title: '标题', align: 'center', minWidth: 200,event: 'serRead',
|
|
|
templet: '<div><span data-id="{{d.id}}" data-rep="{{d.repType}}" class="layui-table-link view-workReport-title" >{{d.repTitle}}</span></div>'
|
|
|
}, {
|
|
|
field: 'attachmentList', title: '附件数量', align: 'center',
|
|
|
templet: '<div><span data-id="{{d.id}}" class="layui-table-link view-workReport-attachment">{{d.attachmentList.length}}</span></div>'
|
|
|
}, {
|
|
|
field: 'currIsRead', title: '状态', align: 'center',
|
|
|
templet: function (d) {
|
|
|
if (d.currIsRead == '1') {
|
|
|
return '<span class="green">已读</span>';
|
|
|
} else {
|
|
|
return '<span class="red">未读</span>';
|
|
|
}
|
|
|
}
|
|
|
}, {
|
|
|
field: 'reportUserList', title: '未读人员', align: 'center',minWidth:'200',
|
|
|
templet: function (d) {
|
|
|
var userName = [];
|
|
|
$.each(d.reportUserList, function (i, v) {
|
|
|
if (v.isRead == 0) {
|
|
|
userName.push(v.nickName)
|
|
|
}
|
|
|
});
|
|
|
if(userName.length === 0){
|
|
|
userName = ['无']
|
|
|
}
|
|
|
return userName.toString();
|
|
|
}
|
|
|
}, {
|
|
|
field: 'reportUserList', title: '已读人员', align: 'center',minWidth:'200',
|
|
|
templet: function (d) {
|
|
|
var userName = [];
|
|
|
$.each(d.reportUserList, function (i, v) {
|
|
|
if (v.isRead == 1) {
|
|
|
userName.push(v.nickName)
|
|
|
}
|
|
|
});
|
|
|
if(userName.length === 0){
|
|
|
userName = ['无']
|
|
|
}
|
|
|
return userName.toString();
|
|
|
}
|
|
|
}, {
|
|
|
field: 'createUserNickName', title: '上报人', align: 'center',
|
|
|
}, {
|
|
|
field: 'manufacturerName', title: '厂商', align: 'center',
|
|
|
}, {
|
|
|
field: 'createTime', title: '上报时间', align: 'center',
|
|
|
}]],
|
|
|
done: function () {
|
|
|
//获取附件列表
|
|
|
$('.view-workReport-attachment').on('click', function () {
|
|
|
common.openWin('workreport/list', '附件', {id: $(this).data('id'), type: 'attachment'}, ['确定', '取消']);
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//监听单元格事件
|
|
|
table.on('tool(table-workreport-view)', function(obj){
|
|
|
var data = obj.data;
|
|
|
if(obj.event === 'serRead'){
|
|
|
|
|
|
var id = data['id'];
|
|
|
var repType = data['repType'];
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/workreport/setRead',
|
|
|
data: {workReportIds: [id]}
|
|
|
}).done(function (response) {
|
|
|
if (response.success) {
|
|
|
obj.update({
|
|
|
currIsRead: "1"
|
|
|
});
|
|
|
loadReadReport();
|
|
|
}
|
|
|
});
|
|
|
common.openWin('workreport/add', '查看', {id: id, repType: repType, viewType: 'view'}, ['关闭'], function f() {
|
|
|
return true;
|
|
|
}, null, null, {
|
|
|
success: function () {
|
|
|
form.render();
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
});
|
|
|
|
|
|
// 加载查询条件下拉框
|
|
|
function loadConditionSelect() {
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/bWorkreportGroup/findManufacturerList'
|
|
|
}).done(function (response) {
|
|
|
var options = "<option value=''>=选择厂商=</option>";
|
|
|
$.each(response.data, function (i, v) {
|
|
|
options += "<option value='" + v.id + "'>" + v.manufacturerName + "</option>"
|
|
|
});
|
|
|
$('#slt-workreport-group').html(options);
|
|
|
if(manufacturerId!=''){
|
|
|
$('#slt-workreport-group').val(manufacturerId)
|
|
|
}
|
|
|
form.render();
|
|
|
|
|
|
});
|
|
|
$.ajax({
|
|
|
url: domainName + '/api-user/users/getAll',
|
|
|
data: {
|
|
|
access_token: accessToken
|
|
|
},
|
|
|
success: function (response) {
|
|
|
var options = "<option value=''>=选择汇报人=</option>";
|
|
|
$.each(response, function (i, v) {
|
|
|
options += "<option value='" + v.username + "'>" + v.nickname + "</option>"
|
|
|
});
|
|
|
$('#slt-workreport-user').html(options);
|
|
|
form.render();
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
// 加载最近日报汇报统计图表
|
|
|
function loadDailyChart() {
|
|
|
var conditions = form.val('form-workreport-condition');
|
|
|
Object.assign(conditions, {access_token: accessToken, createTime: createTime, viewMode: 'true',dateLimit:dateLimit});
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/workreport/chart/daily',
|
|
|
data: conditions
|
|
|
}).done(function (response) {
|
|
|
var chartData = response.map;
|
|
|
var needReportList = chartData.needReportList;
|
|
|
var reportedList = chartData.reportedList;
|
|
|
var xAxisData = chartData.xAxisData;
|
|
|
var option = {
|
|
|
backgroundColor: 'rgba(255, 255, 255, 1)',
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
extraCssText: 'background: #fff; border-radius: 0;box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);color: #333;',
|
|
|
axisPointer: {
|
|
|
type: 'shadow',
|
|
|
shadowStyle: {
|
|
|
color: '#ffffff',
|
|
|
shadowColor: 'rgba(225,225,225,1)',
|
|
|
shadowBlur: 5
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
grid: {
|
|
|
top: 10,
|
|
|
right: 5
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
axisLine: {
|
|
|
show: false
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false
|
|
|
},
|
|
|
axisLabel: {
|
|
|
margin: 20,
|
|
|
},
|
|
|
data: xAxisData
|
|
|
},
|
|
|
yAxis: {
|
|
|
axisLine: {
|
|
|
show: false
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false
|
|
|
}
|
|
|
},
|
|
|
series: [{
|
|
|
name: '应报',
|
|
|
data: needReportList,
|
|
|
type: 'bar',
|
|
|
barWidth: 20,
|
|
|
zlevel: 9,
|
|
|
itemStyle: {
|
|
|
borderWidth: 1,
|
|
|
zlevel: 99,
|
|
|
borderColor: '#a8d4ff', //同背景色一样
|
|
|
color: '#e3f2ff'
|
|
|
|
|
|
},
|
|
|
emphasis: {
|
|
|
itemStyle: {
|
|
|
borderWidth: 1,
|
|
|
zlevel: 99,
|
|
|
borderColor: '#a8d4ff', //同背景色一样
|
|
|
color: '#e3f2ff'
|
|
|
}
|
|
|
}
|
|
|
}, {
|
|
|
name: '已报',
|
|
|
data: reportedList,
|
|
|
type: 'bar',
|
|
|
barWidth: 20,
|
|
|
barGap: '-100%',
|
|
|
zlevel: 9,
|
|
|
color: '#2094ff'
|
|
|
}]
|
|
|
};
|
|
|
var lastWeekChart = echarts.init(document.getElementById('chart-daily-report'));
|
|
|
lastWeekChart.setOption(option);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
// 日报/周报/月报 应报已报统计
|
|
|
function loadReportableChart() {
|
|
|
var conditions = form.val('form-workreport-condition');
|
|
|
Object.assign(conditions, {access_token: accessToken, createTime: createTime, viewMode: 'true',dateLimit:dateLimit});
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/workreport/chart/reptype',
|
|
|
data: conditions
|
|
|
}).done(function (response) {
|
|
|
var chartData = response.map;
|
|
|
var needReportList = chartData.needReportList;
|
|
|
var reportedList = chartData.reportedList;
|
|
|
var xAxisData = ['日报', '周报', '月报'];
|
|
|
var option = {
|
|
|
backgroundColor: 'rgba(255, 255, 255, 1)',
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
extraCssText: 'background: #fff; border-radius: 0;box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);color: #333;',
|
|
|
axisPointer: {
|
|
|
type: 'shadow',
|
|
|
shadowStyle: {
|
|
|
color: '#ffffff',
|
|
|
shadowColor: 'rgba(225,225,225,1)',
|
|
|
shadowBlur: 5
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
grid: {
|
|
|
top: 10,
|
|
|
right: 5
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
axisLine: {
|
|
|
show: false
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false
|
|
|
},
|
|
|
axisLabel: {
|
|
|
margin: 20,
|
|
|
},
|
|
|
data: xAxisData
|
|
|
},
|
|
|
yAxis: {
|
|
|
axisLine: {
|
|
|
show: false
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false
|
|
|
}
|
|
|
},
|
|
|
series: [{
|
|
|
name: '应报',
|
|
|
data: needReportList,
|
|
|
type: 'bar',
|
|
|
barWidth: 20,
|
|
|
zlevel: 9,
|
|
|
itemStyle: {
|
|
|
borderWidth: 1,
|
|
|
zlevel: 99,
|
|
|
borderColor: '#a8d4ff', //同背景色一样
|
|
|
color: '#e3f2ff'
|
|
|
|
|
|
},
|
|
|
emphasis: {
|
|
|
itemStyle: {
|
|
|
borderWidth: 1,
|
|
|
zlevel: 99,
|
|
|
borderColor: '#a8d4ff', //同背景色一样
|
|
|
color: '#e3f2ff'
|
|
|
}
|
|
|
}
|
|
|
}, {
|
|
|
name: '已报',
|
|
|
data: reportedList,
|
|
|
type: 'bar',
|
|
|
barWidth: 20,
|
|
|
barGap: '-100%',
|
|
|
zlevel: 9,
|
|
|
color: '#2094ff'
|
|
|
}]
|
|
|
};
|
|
|
var lastFiveTimesChart = echarts.init(document.getElementById('chart-reportable-report'));
|
|
|
lastFiveTimesChart.setOption(option);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
// 各厂商应报已报情况
|
|
|
function loadCompanyReport() {
|
|
|
var conditions = form.val('form-workreport-condition');
|
|
|
Object.assign(conditions, {access_token: accessToken, createTime: createTime, viewMode: '',dateLimit:dateLimit});
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/workreport/chart/group',
|
|
|
data: conditions
|
|
|
}).done(function (response) {
|
|
|
var chartData = response.map;
|
|
|
var groupList = chartData.groupList;
|
|
|
var needReportList = chartData.needReportList;
|
|
|
var reportedList = chartData.reportedList;
|
|
|
var xData = [];
|
|
|
var groupData = [];
|
|
|
$.each(groupList, function (i, v) {
|
|
|
xData.push(v);
|
|
|
|
|
|
groupData.push({
|
|
|
name: v,
|
|
|
value: 1
|
|
|
});
|
|
|
});
|
|
|
var series = [{
|
|
|
name: '应报',
|
|
|
data: needReportList,
|
|
|
barWidth: 20,
|
|
|
type: 'bar',
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top',
|
|
|
textStyle: {
|
|
|
color: '#555'
|
|
|
},
|
|
|
formatter:function (data) {
|
|
|
return reportedList[data.dataIndex] +'/'+ data.value
|
|
|
}
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: (params) => {
|
|
|
var colors = ['#b6c2ff', '#96edc1', '#fcb75b'];
|
|
|
return colors[params.dataIndex % 3]
|
|
|
}/*,
|
|
|
label: {
|
|
|
show: true, //开启显示
|
|
|
position: 'top', //在上方显示
|
|
|
textStyle: { //数值样式
|
|
|
color: 'black',
|
|
|
fontSize: 16
|
|
|
}
|
|
|
}*/
|
|
|
}
|
|
|
},
|
|
|
xAxisIndex: 0,
|
|
|
yAxisIndex: 0
|
|
|
}, {
|
|
|
name: '已报',
|
|
|
data: reportedList,
|
|
|
barWidth: 20,
|
|
|
type: 'bar',
|
|
|
barGap: '-100%',
|
|
|
label: {
|
|
|
show: false,
|
|
|
position: 'top',
|
|
|
textStyle: {
|
|
|
color: '#555'
|
|
|
}
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: (params) => {
|
|
|
var colors = ['#4150d8', '#28bf7e', '#ed7c2f'];
|
|
|
return colors[params.dataIndex % 3]
|
|
|
},
|
|
|
/*label: {
|
|
|
show: true, //开启显示
|
|
|
position: 'top', //在上方显示
|
|
|
textStyle: { //数值样式
|
|
|
color: 'black',
|
|
|
fontSize: 16
|
|
|
}
|
|
|
}*/
|
|
|
}
|
|
|
},
|
|
|
xAxisIndex: 0,
|
|
|
yAxisIndex: 0
|
|
|
}/*, {
|
|
|
data: groupData,
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'inside',
|
|
|
formatter: '{b}',
|
|
|
textStyle: {
|
|
|
color: '#777'
|
|
|
}
|
|
|
},
|
|
|
type: 'bar',
|
|
|
barGap: 0,
|
|
|
barWidth: 100. / groupList.length + '%',
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxisIndex: 1,
|
|
|
yAxisIndex: 1
|
|
|
}*/];
|
|
|
/**
|
|
|
双X轴标签对应,伪实现思路:
|
|
|
底部的标签也是柱状图,对应包含的区域为上方X轴条数占总数的比例,设为宽度即可
|
|
|
*/
|
|
|
var option = {
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
}
|
|
|
},
|
|
|
grid: [{
|
|
|
top: 20,
|
|
|
bottom: 70,
|
|
|
right: 5
|
|
|
}, {
|
|
|
height: 30,
|
|
|
bottom: 30,
|
|
|
right: 5
|
|
|
}],
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: xData,
|
|
|
gridIndex: 0,
|
|
|
axisLabel: {
|
|
|
color: '#333',
|
|
|
show: true,
|
|
|
interval:0,
|
|
|
rotate:25
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#e7e7e7'
|
|
|
}
|
|
|
},
|
|
|
axisTick: {
|
|
|
lineStyle: {
|
|
|
color: '#e7e7e7'
|
|
|
}
|
|
|
},
|
|
|
zlevel: 2
|
|
|
}, {
|
|
|
type: 'category',
|
|
|
gridIndex: 1,
|
|
|
axisLine: {
|
|
|
show: false
|
|
|
},
|
|
|
zlevel: 1
|
|
|
}],
|
|
|
yAxis: [{
|
|
|
type: 'value',
|
|
|
gridIndex: 0,
|
|
|
axisLabel: {
|
|
|
color: '#333'
|
|
|
},
|
|
|
splitLine: {
|
|
|
lineStyle: {
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#ccc'
|
|
|
}
|
|
|
},
|
|
|
axisTick: {
|
|
|
lineStyle: {
|
|
|
color: '#ccc'
|
|
|
}
|
|
|
}
|
|
|
}, {
|
|
|
type: 'value',
|
|
|
gridIndex: 1,
|
|
|
axisLabel: {
|
|
|
show: false
|
|
|
},
|
|
|
axisLine: {
|
|
|
show: false
|
|
|
},
|
|
|
splitLine: {
|
|
|
show: false
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false
|
|
|
}
|
|
|
}],
|
|
|
series: series
|
|
|
};
|
|
|
companyChart.setOption(option)
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//点击弹出详情
|
|
|
companyChart.on('click',function (params) {
|
|
|
reportDetails(params.name)
|
|
|
})
|
|
|
|
|
|
//未读人员
|
|
|
function loadNoReadChart(echartObject,url,name) {
|
|
|
var xData = ""
|
|
|
var yData = ""
|
|
|
echartObject.showLoading({
|
|
|
text: 'loading',
|
|
|
color: '#cbc6c6',
|
|
|
textColor: '#cbc6c6',
|
|
|
maskColor: 'rgba(255, 255, 255, 0.2)',
|
|
|
zlevel: 0,
|
|
|
});
|
|
|
admin.req({
|
|
|
url: url
|
|
|
}).done(function (response) {
|
|
|
if (response && response.map) {
|
|
|
xData = response.map.userList;
|
|
|
yData = response.map.valueList;
|
|
|
var series = [{
|
|
|
name: name,
|
|
|
data: yData,
|
|
|
barWidth: 20,
|
|
|
type: 'bar',
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top',
|
|
|
textStyle: {
|
|
|
color: '#555'
|
|
|
},
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: (params) => {
|
|
|
var colors = ['#b6c2ff', '#96edc1', '#fcb75b'];
|
|
|
return colors[params.dataIndex % 3]
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
}]
|
|
|
|
|
|
var option = {
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
}
|
|
|
},
|
|
|
grid: [{
|
|
|
top: 20,
|
|
|
bottom: 35,
|
|
|
left: 30,
|
|
|
right: 5
|
|
|
}],
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: xData,
|
|
|
axisLabel: {
|
|
|
color: '#333',
|
|
|
show: true,
|
|
|
interval:0,
|
|
|
rotate:19,
|
|
|
fontSize : 10 //更改坐标轴文字大小
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#e7e7e7'
|
|
|
}
|
|
|
},
|
|
|
axisTick: {
|
|
|
lineStyle: {
|
|
|
color: '#e7e7e7'
|
|
|
}
|
|
|
},
|
|
|
zlevel: 1
|
|
|
}],
|
|
|
yAxis: [{
|
|
|
type: 'value',
|
|
|
gridIndex: 0,
|
|
|
axisLabel: {
|
|
|
color: '#333'
|
|
|
},
|
|
|
splitLine: {
|
|
|
lineStyle: {
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#ccc'
|
|
|
}
|
|
|
},
|
|
|
axisTick: {
|
|
|
lineStyle: {
|
|
|
color: '#ccc'
|
|
|
}
|
|
|
}
|
|
|
}],
|
|
|
series: series
|
|
|
}
|
|
|
echartObject.hideLoading();
|
|
|
echartObject.setOption(option)
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
//弹窗显示汇报详情
|
|
|
function reportDetails(name) {
|
|
|
layer.open({
|
|
|
title: ['汇报详细', 'font-size:18px;'],
|
|
|
type: 1,
|
|
|
area: ['70%', '60%'],
|
|
|
content: '<div class="layui-card" style="margin-top: 30px;box-shadow:none"><div class="layui-card-body"><table id="reportDetails" lay-filter="reportDetails"></table></div></div>',
|
|
|
btn: ['关闭'],
|
|
|
success: function(index, layero) {
|
|
|
reportDetailsTable(name)
|
|
|
},
|
|
|
yes: function (index, layero) {
|
|
|
layer.close(index)
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
$("#notReportCountBtn").unbind().on("click",function () {
|
|
|
layer.open({
|
|
|
title: ['汇报详细', 'font-size:18px;'],
|
|
|
type: 1,
|
|
|
area: ['70%', '60%'],
|
|
|
content: '<div class="layui-card" style="margin-top: 30px;box-shadow:none"><div class="layui-card-body"><table id="reportDetails" lay-filter="reportDetails"></table></div></div>',
|
|
|
btn: ['关闭'],
|
|
|
success: function(index, layero) {
|
|
|
reportDetailsTable();
|
|
|
},
|
|
|
yes: function (index, layero) {
|
|
|
layer.close(index)
|
|
|
}
|
|
|
});
|
|
|
})
|
|
|
function reportDetailsTable(name) {
|
|
|
var conditions = form.val('form-workreport-condition');
|
|
|
if (name) conditions["name"] = name
|
|
|
conditions["access_token"] = accessToken
|
|
|
conditions["createTime"] = createTime
|
|
|
conditions["viewMode"] = 'true'
|
|
|
conditions["dateLimit"] = dateLimit
|
|
|
reportDetailTable = table.render({
|
|
|
elem: '#reportDetails',
|
|
|
url: domainName + '/api-web/workreport/group/reportDetails',
|
|
|
where: conditions,
|
|
|
end: function (e) {
|
|
|
form.render()
|
|
|
},
|
|
|
even: true,
|
|
|
cols: [[{
|
|
|
type: 'checkbox'
|
|
|
}, {
|
|
|
type: 'numbers', title: '序号'
|
|
|
}, {
|
|
|
field: 'createBy', title: '组负责人', align: 'center'
|
|
|
}, {
|
|
|
field: 'needReport', title: '应报数量', align: 'center'
|
|
|
}, {
|
|
|
field: 'readCount', title: '已报数量', align: 'center'
|
|
|
}, {
|
|
|
field: 'needReport', title: '未报数量', align: 'center',style:'color:red',templet:function (d) {
|
|
|
return d.needReport-d.readCount
|
|
|
}
|
|
|
}]],
|
|
|
})
|
|
|
}
|
|
|
|
|
|
//未读统计报表导出
|
|
|
$('#notReportExportBtn').unbind().on('click',function () {
|
|
|
var conditions = form.val('form-workreport-condition');
|
|
|
var url = common.domainName + '/api-web/workreport/group/exportReportDetails?access_token=' + accessToken + '&createTime=' + createTime + '&viewMode=' + 'true' + '&dateLimit=' + dateLimit + '&repType=' + conditions.repType + '&createBy=' + conditions.createBy;
|
|
|
window.open(url)
|
|
|
})
|
|
|
|
|
|
// 已读未读报表
|
|
|
function loadReadReport() {
|
|
|
var conditions = form.val('form-workreport-condition');
|
|
|
Object.assign(conditions, {access_token: accessToken, createTime: createTime, viewMode: 'true',dateLimit:dateLimit});
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/workreport/chart/read',
|
|
|
data: conditions
|
|
|
}).done(function (response) {
|
|
|
var chartData = response.map;
|
|
|
var readCount = chartData.readCount;
|
|
|
var unReadCount = chartData.unReadCount;
|
|
|
var readPercent = (readCount / (readCount + unReadCount) * 100).toFixed(0);
|
|
|
readPercent = isNaN(readPercent) ? '0%' : readPercent + '%';
|
|
|
let echartData = [{
|
|
|
name: "已读",
|
|
|
value: readCount
|
|
|
}, {
|
|
|
name: "未读",
|
|
|
value: unReadCount
|
|
|
}];
|
|
|
|
|
|
var formatNumber = function (num) {
|
|
|
let reg = /(?=(\B)(\d{3})+$)/g;
|
|
|
return num.toString().replace(reg, ',');
|
|
|
};
|
|
|
|
|
|
var option = {
|
|
|
color: ['#367bec', '#00cefc'],
|
|
|
title: [{
|
|
|
text: '{val|' + readPercent + '}',
|
|
|
top: 'center',
|
|
|
left: 'center',
|
|
|
textStyle: {
|
|
|
rich: {
|
|
|
name: {
|
|
|
fontSize: 14,
|
|
|
fontWeight: 'normal',
|
|
|
color: '#666666',
|
|
|
padding: [10, 0]
|
|
|
},
|
|
|
val: {
|
|
|
fontSize: 32,
|
|
|
fontWeight: 'bold',
|
|
|
color: '#333333',
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}],
|
|
|
series: [{
|
|
|
type: 'pie',
|
|
|
radius: ['45%', '60%'],
|
|
|
center: ['50%', '50%'],
|
|
|
data: echartData,
|
|
|
hoverAnimation: false,
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
borderWidth: 2
|
|
|
}
|
|
|
},
|
|
|
labelLine: {
|
|
|
normal: {
|
|
|
length: 20,
|
|
|
length2: 120,
|
|
|
lineStyle: {
|
|
|
color: '#e6e6e6'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
label: {
|
|
|
normal: {
|
|
|
formatter: params => {
|
|
|
return (
|
|
|
'{icon|●}{name|' + params.name + '}{value|' +
|
|
|
formatNumber(params.value) + '}'
|
|
|
);
|
|
|
},
|
|
|
padding: [0, -100, 25, -100],
|
|
|
rich: {
|
|
|
icon: {
|
|
|
fontSize: 16
|
|
|
},
|
|
|
name: {
|
|
|
fontSize: 14,
|
|
|
padding: [0, 10, 0, 4],
|
|
|
color: '#666666'
|
|
|
},
|
|
|
value: {
|
|
|
fontSize: 18,
|
|
|
fontWeight: 'bold',
|
|
|
color: '#333333'
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
}]
|
|
|
};
|
|
|
|
|
|
var readChart = echarts.init(document.getElementById('chart-read-report'));
|
|
|
readChart.setOption(option);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
function setRead(workReportIds) {
|
|
|
if (workReportIds.length == 0) {
|
|
|
layer.msg('请至少选择一项未读的数据。', {icon: 0, time: 3000});
|
|
|
return false;
|
|
|
}
|
|
|
admin.req({
|
|
|
url: domainName + '/api-web/workreport/setRead',
|
|
|
data: {workReportIds: workReportIds}
|
|
|
}).done(function (response) {
|
|
|
if (response.success) {
|
|
|
// layer.msg('执行操作成功!', {icon: 1, time: 3000});
|
|
|
loadReadReport();
|
|
|
} else {
|
|
|
// layer.msg('执行操作失败!', {icon: 2, time: 3000});
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//获取url中的type值
|
|
|
function getUrlType() {
|
|
|
var href = window.location.href;
|
|
|
href = href.substr(href.indexOf("#"),href.length);
|
|
|
var url = href.split("/");
|
|
|
if (url.length <= 1) {
|
|
|
return "";
|
|
|
}
|
|
|
for (var i = 0; i < url.length; i++) {
|
|
|
if (url[i].indexOf("type") > -1) {
|
|
|
type = url[i].split("=")[1]
|
|
|
}
|
|
|
if (url[i].indexOf("repType") > -1) {
|
|
|
urlRepType = url[i].split("=")[1]
|
|
|
}
|
|
|
if (url[i].indexOf("manufacturerId") > -1) {
|
|
|
manufacturerId = url[i].split("=")[1]
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// 图表,表格重新加载
|
|
|
function reloadAllChange() {
|
|
|
loadWorkReportTable();
|
|
|
// loadDailyChart();
|
|
|
loadCompanyReport();
|
|
|
loadReadReport();
|
|
|
var url = domainName + '/api-web/workreport/chart/noReport?createTime=' + createTime + '&dateLimit=' + dateLimit;
|
|
|
var name = '未报';
|
|
|
var noReportChat = echarts.init(document.getElementById('chart-noReport-report'));
|
|
|
loadNoReadChart(noReportChat,url,name);
|
|
|
// loadNoReadChart()
|
|
|
// loadReportableChart();
|
|
|
}
|
|
|
});
|
|
|
}); |
|
|
\ No newline at end of file |
...
|
...
|
|