136 lines
5.2 KiB
Plaintext
136 lines
5.2 KiB
Plaintext
let form, layer, table, tableIns, myChart, paramObj = {};
|
||
let dataobj = {};
|
||
function setParams(obj) {
|
||
paramObj = JSON.parse(obj);
|
||
layui.use(['form', 'layer', 'table'], function () {
|
||
form = layui.form;
|
||
layer = layui.layer;
|
||
table = layui.table;
|
||
form.on('radio(demo-radio-filter)', function (data) {
|
||
var elem = data.elem; // 获得 radio 原始 DOM 对象
|
||
var value = elem.value; // 获得 radio 值
|
||
myChart.dispose();
|
||
myChart = echarts.init(document.getElementById('voi-echarts'));
|
||
console.log(dataobj);
|
||
if (value === 'level') {
|
||
initEchartsOne(dataobj.level, '违章等级');
|
||
} else if (value === 'type') {
|
||
initEchartsOne(dataobj.type, '违章类型');
|
||
} else if (value === '装置违章') {
|
||
initEchartsOne(dataobj.device_voi, '装置违章');
|
||
} else if (value === '管理违章') {
|
||
initEchartsOne(dataobj.manage_voi, '管理违章');
|
||
} else if (value === '行为违章') {
|
||
initEchartsOne(dataobj.active_voi, '行为违章');
|
||
}
|
||
});
|
||
myChart = echarts.init(document.getElementById('voi-echarts'));
|
||
teamVoiNumAjax();
|
||
})
|
||
}
|
||
|
||
|
||
// 班组违章类型、违章等级数量
|
||
function teamVoiNumAjax() {
|
||
let url = dataUrl + 'proteam/pot/superStatistics/getChildTypeList';
|
||
ajaxRequest(url, "POST", paramObj, true, function () {
|
||
}, function (result) {
|
||
console.log(result);
|
||
setVoiData(result.data);
|
||
if (parseInt(result.code) == 200) {
|
||
} else if (parseInt(result.code) === 500) {
|
||
layer.alert('服务异常', { icon: 2 })
|
||
} else if (parseInt(result.code) === 401) {
|
||
logout(1);
|
||
}
|
||
}, function (xhr) {
|
||
|
||
});
|
||
|
||
function setVoiData(result) {
|
||
let cent = '<input type="radio" name="voi" value="level" title="违章等级" checked lay-filter="demo-radio-filter">';
|
||
let html = '<input type="radio" name="voi" value="type" title="违章类型" lay-filter="demo-radio-filter">';
|
||
let levelNumList = result.levelNumList;
|
||
let typeNumList = result.typeNumList;
|
||
let manage_voi = result.manage_voi;
|
||
let active_voi = result.active_voi;
|
||
let device_voi = result.device_voi;
|
||
if (levelNumList && levelNumList.length > 0) {
|
||
$.each(levelNumList, function (index, item) {
|
||
cent += '<p>' + item.name + '数量：' + item.value + '</p>';
|
||
})
|
||
}
|
||
if (typeNumList && typeNumList.length > 0) {
|
||
$.each(typeNumList, function (index, item) {
|
||
html += '<input type="radio" name="voi" value="' + item.name + '" title="' + item.name + '（' + item.value + '）" lay-filter="demo-radio-filter">'
|
||
})
|
||
}
|
||
dataobj.level = levelNumList;
|
||
dataobj.type = typeNumList;
|
||
dataobj.manage_voi = manage_voi;
|
||
dataobj.active_voi = active_voi;
|
||
dataobj.device_voi = device_voi;
|
||
$('.layui-form .layui-form-item').eq(0).empty().append(cent);
|
||
$('.layui-form .layui-form-item').eq(1).empty().append(html);
|
||
layui.form.render();
|
||
myChart.dispose();
|
||
myChart = echarts.init(document.getElementById('voi-echarts'));
|
||
initEchartsOne(levelNumList, '违章等级');
|
||
}
|
||
}
|
||
|
||
function initEchartsOne(valueList, title) {
|
||
let fontSize = '14', fontFamily = 'Alibaba PuHuiTi R', fontColor = '#000';
|
||
let option = {
|
||
color: ['#37a2da', '#32c5e9', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293', '#e7bcf3', '#8378ea'],
|
||
tooltip: {
|
||
trigger: 'item',
|
||
formatter: '{a} <br/>{b} : {c} ({d}%)',
|
||
textStyle: {
|
||
color: fontColor,
|
||
fontFamily: fontFamily
|
||
},
|
||
},
|
||
toolbox: {
|
||
show: true,
|
||
},
|
||
legend: {
|
||
x: '10%', //水平位置，【left\center\right\数字】
|
||
y: '380', //垂直位置，【top\center\bottom\数字】
|
||
align: 'left', //字在图例的左边或右边【left/right】
|
||
orient: 'horizontal', //图例方向【horizontal/vertical】
|
||
icon: 'circle', //图例形状【circle\rect\roundRect\triangle\diamond\pin\arrow\none】
|
||
textStyle: {
|
||
color: '#000',
|
||
fontFamily: fontFamily,
|
||
fontSize: fontSize
|
||
},
|
||
formatter: function (name) {
|
||
let res = valueList.filter((v) => v.name === name);
|
||
res = res[0] || {};
|
||
const p = res.value;
|
||
return name + '（' + p + '）';
|
||
},
|
||
},
|
||
series: [
|
||
{
|
||
name: title,
|
||
type: 'pie',
|
||
radius: [0, 130],
|
||
center: ["50%", "40%"],
|
||
label: {
|
||
textStyle: {
|
||
color: '#000',
|
||
fontFamily: fontFamily,
|
||
fontSize: fontSize
|
||
},
|
||
},
|
||
data: valueList,
|
||
},
|
||
],
|
||
};
|
||
myChart.setOption(option, true);
|
||
window.addEventListener("resize", function () {
|
||
myChart.resize();
|
||
});
|
||
} |