|
|
@ -60,17 +60,45 @@ const Information = (props) => { |
|
|
console.log(xunjiandata,'xunjiandata') |
|
|
console.log(xunjiandata,'xunjiandata') |
|
|
|
|
|
|
|
|
const calcChartData = (data) => { |
|
|
const calcChartData = (data) => { |
|
|
let arr = [] |
|
|
let arr1 = [], arr2 = [], arr4 = [] |
|
|
data.filter(d => d.alarm).forEach(l => { |
|
|
data.filter(d => d.alarm).forEach(l => { |
|
|
let ext = arr.find(a => a.name === l.point.name); |
|
|
let repairOk = l.patrolRecordIssueHandles.length && l.patrolRecordIssueHandles[0]?.state === 6;//验收通过
|
|
|
if (ext) { |
|
|
if(!repairOk){//没修||没修好
|
|
|
ext.value++; |
|
|
let ext1 = arr1.find(a => a.name === l.point.name); |
|
|
|
|
|
if (ext1) { |
|
|
|
|
|
ext1.value++; |
|
|
} else { |
|
|
} else { |
|
|
arr.push({ name: l.point.name, value: 1 }) |
|
|
arr1.push({ name: l.point.name, value: 1 }) |
|
|
|
|
|
} |
|
|
|
|
|
} else {//修好了
|
|
|
|
|
|
let ext4 = arr4.find(a => a.name === l.point.name); |
|
|
|
|
|
if (ext4) { |
|
|
|
|
|
ext4.cost += parseFloat(l.patrolRecordIssueHandles[0]?.cost); |
|
|
|
|
|
} else { |
|
|
|
|
|
arr4.push({ name: l.point.name, cost: parseFloat(l.patrolRecordIssueHandles[0]?.cost) }) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
//右上
|
|
|
|
|
|
let ext2 = arr2.find(a => a.name === l.point.name); |
|
|
|
|
|
if (ext2) { |
|
|
|
|
|
ext2.num++; |
|
|
|
|
|
if(repairOk){ |
|
|
|
|
|
ext2.repairNum += l.patrolRecordIssueHandles[0]?.yanshoucishu; |
|
|
|
|
|
} |
|
|
|
|
|
} else { |
|
|
|
|
|
let repairNum = repairOk ? l.patrolRecordIssueHandles[0]?.yanshoucishu : 0; |
|
|
|
|
|
arr2.push({ name: l.point.name, num: 1, repairNum }) |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
arr.sort((a, b) => b.value - a.value) |
|
|
arr1.sort((a, b) => b.value - a.value); |
|
|
setChartData1(arr.slice(0, 10));//展示前10名
|
|
|
setChartData1(arr1.slice(0, 10));//前10名
|
|
|
|
|
|
|
|
|
|
|
|
arr2.sort((a, b) => (b.num + b.repairNum) - (a.num + a.repairNum)); |
|
|
|
|
|
setChartData2(arr2.slice(0, 10));//前10名
|
|
|
|
|
|
|
|
|
|
|
|
arr4.sort((a, b) => b.cost - a.cost); |
|
|
|
|
|
setChartData4(arr4.slice(0, 10));//前10名
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
@ -120,17 +148,22 @@ const Information = (props) => { |
|
|
<div style={{ width: '45%' }}> |
|
|
<div style={{ width: '45%' }}> |
|
|
<StackColumn |
|
|
<StackColumn |
|
|
domId={'column-chart-2'} |
|
|
domId={'column-chart-2'} |
|
|
height={clientHeight * 0.35} /> |
|
|
height={clientHeight * 0.35} |
|
|
|
|
|
xAxis={chartData2.map(cd => cd.name)} |
|
|
|
|
|
yAxis1={chartData2.map(cd => cd.num)} |
|
|
|
|
|
yAxis2={chartData2.map(cd => cd.repairNum)} /> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}> |
|
|
<div style={{ display: 'flex', justifyContent: 'space-between', marginTop : 12 }}> |
|
|
<div style={{ width: '45%' }}> |
|
|
<div style={{ width: '45%' }}> |
|
|
<AlarmStatistics height={clientHeight * 0.25} /> |
|
|
<AlarmStatistics height={clientHeight * 0.25} /> |
|
|
</div> |
|
|
</div> |
|
|
<div style={{ width: '45%' }}> |
|
|
<div style={{ width: '45%' }}> |
|
|
<Column |
|
|
<Column |
|
|
domId={'column-chart-3'} |
|
|
domId={'column-chart-3'} |
|
|
height={clientHeight * 0.35} /> |
|
|
height={clientHeight * 0.35} |
|
|
|
|
|
xAxis={chartData4.map(cd => cd.name)} |
|
|
|
|
|
yAxis={chartData4.map(cd => cd.cost)} /> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</Card> |
|
|
</Card> |
|
|
|
