代码提交
This commit is contained in:
parent
b7e1f9ce93
commit
89a1cf25f8
|
|
@ -1,4 +1,5 @@
|
|||
let table, layer, form;
|
||||
let myChart = null, myChart2 = null;
|
||||
layui.use(['layer', 'table', 'form'], function () {
|
||||
layer = layui.layer;
|
||||
table = layui.table;
|
||||
|
|
@ -31,8 +32,8 @@ function changeData(that, type) {
|
|||
if (type === 1 || type === 2 || type === 3 || type === 6 || type === 12) {
|
||||
initTable(type, bidCode);
|
||||
$('#right-table-box').removeAttr('style');
|
||||
$('#no-data-box').css({ 'display': 'none' });
|
||||
$('#right-box').css({ 'display': 'none' });
|
||||
$('#no-data-box').css({'display': 'none'});
|
||||
$('#right-box').css({'display': 'none'});
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -64,21 +65,204 @@ function initTable(type, bidCode) {
|
|||
});
|
||||
},
|
||||
done: function (res, curr, count, origin) {
|
||||
// console.log(res);
|
||||
if (res.data && res.data.length > 0) {
|
||||
initEcharts(res.data);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function setCols(type) {
|
||||
if (type === 1) { // 工程质量分析
|
||||
return [
|
||||
{ type: 'numbers', title: '序号', width: '10%' }, // 添加序号列
|
||||
{ field: 'projectName', title: '工程名称', align: 'center', width: '15%' },
|
||||
{ field: 'projectNumber', title: '工程编号', align: 'center', width: '15%' },
|
||||
{ field: 'projectAddress', title: '项目地址', align: 'center', width: '15%' },
|
||||
{ field: 'contractorName', title: '合同编号', align: 'center', width: '15%' },
|
||||
{ field: 'qualityLevel', title: '质量等级', align: 'center', width: '15%' },
|
||||
{ field: 'isContract', title: '是否签订合同', align: 'center', width: '15%' },
|
||||
{type: 'numbers', title: '序号', width: '10%'}, // 添加序号列
|
||||
{field: 'projectName', title: '工程名称', align: 'center'},
|
||||
// { field: 'projectNumber', title: '工程编号', align: 'center'},
|
||||
// { field: 'projectAddress', title: '项目地址', align: 'center'},
|
||||
// { field: 'contractorName', title: '承包商名称', align: 'center',},
|
||||
// { field: 'qualityLevel', title: '质量等级', align: 'center'},
|
||||
{field: 'projectManager', title: '项目经理', align: 'center'},
|
||||
{field: 'team', title: '专业队伍', align: 'center'},
|
||||
{field: 'startTime', title: '开始时间', align: 'center'},
|
||||
{field: 'checkNum', title: '检查数量', align: 'center'},
|
||||
{field: 'passNum', title: '合格数量', align: 'center'},
|
||||
{field: 'passRate', title: '合格率', align: 'center'},
|
||||
{field: 'score', title: '得分', align: 'center'},
|
||||
{field: 'unqualifiedItems', title: '不合格原因', align: 'center'},
|
||||
{
|
||||
title: '操作', align: 'center', templet: function (row) {
|
||||
// 注意:Layui 的 templet 函数参数是 row,即当前行数据
|
||||
return `
|
||||
<button class="layui-btn layui-btn-xs" onclick="handleUpload('${row.projectNumber}')">
|
||||
上传
|
||||
</button>
|
||||
`;
|
||||
}
|
||||
}
|
||||
];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 初始化 echarts
|
||||
function initEcharts(data) {
|
||||
if (myChart && myChart2) {
|
||||
myChart.dispose();
|
||||
myChart2.dispose();
|
||||
}
|
||||
myChart = echarts.init(document.getElementById("oneEcharts"));
|
||||
myChart2 = echarts.init(document.getElementById("twoEcharts"));
|
||||
initEchartsOne(data[0]);
|
||||
initEchartsTwo(data);
|
||||
}
|
||||
|
||||
function initEchartsOne(data) {
|
||||
// 从传入的数据中提取 passRate 和 noPassRate,并转为数字
|
||||
const passRate = parseFloat(data.passRate);
|
||||
const noPassRate = parseFloat(data.noPassRate);
|
||||
|
||||
const option = {
|
||||
grid: {
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
},
|
||||
title: {
|
||||
text: data.team || "合格率对比",
|
||||
x: "center",
|
||||
},
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{b}: {c}%"
|
||||
},
|
||||
legend: {
|
||||
show: true,
|
||||
data: ['合格率', '不合格率'],
|
||||
bottom: 10
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "合格率分析",
|
||||
type: "pie",
|
||||
radius: "65%",
|
||||
center: ["50%", "50%"],
|
||||
label: {
|
||||
show: true,
|
||||
formatter: "{b}: {c}%"
|
||||
},
|
||||
data: [
|
||||
{ value: passRate, name: "合格率" },
|
||||
{ value: noPassRate, name: "不合格率" }
|
||||
],
|
||||
itemStyle: {
|
||||
borderRadius: 5,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
// 设置图表(假设你已定义 myChart2)
|
||||
myChart.setOption(option, true);
|
||||
window.addEventListener("resize", function () {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
|
||||
function initEchartsTwo(data) {
|
||||
const teams = data.map(item => item.team);
|
||||
const scores = data.map(item => item.score);
|
||||
|
||||
const option = {
|
||||
title: {
|
||||
text: '队伍得分柱状图',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'none' // 移除鼠标悬停时的阴影效果
|
||||
},
|
||||
formatter: function(params) {
|
||||
// 自定义tooltip显示内容,移除了百分号
|
||||
return params[0].name + '<br/>' +
|
||||
params[0].seriesName + ': ' +
|
||||
params[0].value;
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '10%',
|
||||
right: '10%',
|
||||
bottom: '20%',
|
||||
top: '20%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: teams,
|
||||
axisLabel: {
|
||||
color: '#fff',
|
||||
interval: 0,
|
||||
formatter: function(value) {
|
||||
// 每4个字符换行
|
||||
return value.match(/.{1,4}/g).join('\n');
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '得分',
|
||||
min: 0,
|
||||
max: 100,
|
||||
interval: 10,
|
||||
axisLabel: {
|
||||
color: '#fff',
|
||||
formatter: function(value) {
|
||||
return value; // 确保y轴标签也不显示百分号
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(255,255,255,0.1)'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: '得分',
|
||||
type: 'bar',
|
||||
data: scores,
|
||||
barWidth: '30%',
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
color: '#fff',
|
||||
formatter: function(params) {
|
||||
return params.value;
|
||||
}
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#409EFF'
|
||||
}
|
||||
}]
|
||||
};
|
||||
|
||||
// 初始化 ECharts 图表(假设你已定义 myChart)
|
||||
myChart2.setOption(option);
|
||||
window.addEventListener('resize', function () {
|
||||
myChart2.resize();
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<script src="../../js/publics/jquery-3.6.0.min.js" type="text/javascript"></script>
|
||||
<script src="../../js/publics/public.js"></script>
|
||||
<script src="../../plugin/scroll/jquery.nicescroll.min.js"></script>
|
||||
<!--<!– <script src="../../js/publics/echarts.js"></script>–>-->
|
||||
<script src="../../js/publics/echarts.js"></script>
|
||||
<script src="../../plugin/layui-v2.9.7/layui/layui.js"></script>
|
||||
<script src="../../js/publics/aescbc.js"></script>
|
||||
<script src="../../js/publics/sm3.js"></script>
|
||||
|
|
@ -28,7 +28,15 @@
|
|||
// watermark.load({ watermark_txt: text });
|
||||
</script>
|
||||
<body>
|
||||
<table id="demo2" lay-filter="test"></table>
|
||||
<div id="proQuality">
|
||||
<table id="demo2" lay-filter="test"></table>
|
||||
</div>
|
||||
|
||||
<div id="oneEcharts">
|
||||
</div>
|
||||
|
||||
<div id="twoEcharts">
|
||||
</div>
|
||||
</body>
|
||||
<style>
|
||||
.layui-table-init {
|
||||
|
|
@ -37,6 +45,17 @@
|
|||
#demo2{
|
||||
margin-top: 26px;
|
||||
}
|
||||
#proQuality{
|
||||
width: 75%;
|
||||
}
|
||||
#oneEcharts{
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
}
|
||||
#twoEcharts{
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
}
|
||||
</style>
|
||||
<script src="../../js/pages/newDataAnalysis/proQualityAnalysis.js" type="text/javascript"></script>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue