Skip to content

N
Nei_Meng_An_Jian_4
Commit 1f655da3 authored by liuyuping's avatar liuyuping
Browse files
Options

'2021-12-8'

parent 04c53770
Show whitespace changes
Inline Side-by-side
Showing with 546 additions and 402 deletions
public/index.html
View file @ 1f655da3
......@@ -14,7 +14,7 @@
<script src="https://webapi.amap.com/maps?v=1.4.15&key=bfa930cbec820fc1c16f8f54348f98e3&plugin=Map3D,AMap.DistrictSearch,AMap.Geocoder,AMap.MouseTool,AMap.Autocomplete,AMap.PlaceSearch"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/animate.css/4.1.1/animate.css" />
<script src="https://cdn.bootcss.com/echarts/4.6.0/echarts.min.js"></script>
<script src="https://www.thingjs.com/static/historyVersion/thing.min.js"></script>
<script src="https://www.thingjs.com/static/release/thing.widget.min.js"></script>
......
src/api/operatePortrait.js
View file @ 1f655da3
......@@ -29,3 +29,81 @@ export function analyzeAlarmNum(companycode) {
}
})
}
export function analyzeHDNum(deptId) {
return request5({
url: '/api/hiddenDanger/analyzeNum',
method: 'get',
params: {
deptId
}
})
}
export function sensorAlarmNum(deptId) {
return request5({
url: '/api/sensor/analyzeAlarmNum',
method: 'get',
params: {
deptId
}
})
}
export function createInfoCard(deptId) {
return request5({
url: '/api/alarm/createInfoCard',
method: 'get',
params: {
deptId
}
})
}
// 隐患趋势
export function analyzeOutputTrend() {
return request5({
url: '/api/output/analyzeOutputTrend',
method: 'get'
})
}
// 重大安全隐患统计
export function analyzeEachMonthNum(level) {
return request5({
url: '/api/hiddenDanger/analyzeEachMonthNum',
method: 'get',
params: {
level
}
})
}
// 企业- 分析各等级风险数量
export function analyzeEnterRiskNum(deptId) {
return request5({
url: '/api/dept/analyzeEachRiskLevelNum',
method: 'get',
params: {
deptId
}
})
}
// 行业- 分析各等级风险数量
export function analyzeIndusRiskNum(detailId) {
return request5({
url: '/api/dictDetail/analyzeEachRiskLevelNum',
method: 'get',
params: {
detailId
}
})
}
// 区域- 分析各等级风险数量
export function analyzeRegionRiskNum() {
return request5({
url: '/api/areaRiskLevel/analyzeEachRiskLevelNum',
method: 'get'
})
}
src/components/bigdata/bigdataLeft.vue
View file @ 1f655da3
......@@ -8,7 +8,7 @@
<div class="big-data-chart1">
<div class="alarm-sum-wrapper">
<div>设备总数量</div>
<div>378</div>
<div>{{sensorSum}}</div>
</div>
<div class="big-data-chart1-alarm1"></div>
</div>
......@@ -52,22 +52,24 @@
<script>
import { dictDetail } from '@/api/index.js'
import { sensorAlarmNum, analyzeOutputTrend, analyzeHDNum, analyzeIndusRiskNum } from '@/api/operatePortrait.js'
export default {
data() {
return {
curIndus: [],
curChosenIndus: '煤矿'
curChosenIndus: '煤矿',
sensorSum: 0
}
},
mounted() {
dictDetail({
async mounted() {
await dictDetail({
page: 0,
size: 999,
sort: 'id,desc',
dictName: '所属行业'
}).then(res => {
console.log(res, 'dictDetail dictDetail dictDetail')
this.curIndus = res.content.filter(item => item.createBy==='admin')
console.log(this.curIndus, 'this.curIndus _________ this.curIndus')
})
this.init1()
this.init3()
......@@ -75,7 +77,14 @@ export default {
this.init7()
},
methods: {
init1() {
async init1() {
let alarmNum = 0
let normalNum = 0
await sensorAlarmNum(this.$store.state.compony_info.id).then(res => {
alarmNum = res.alarmNum
normalNum = res.normalNum
this.sensorSum = res.totalNum
})
const targetDom = document.querySelector('.big-data-chart1-alarm1')
const mychart = echarts.init(targetDom)
const option = {
......@@ -107,11 +116,11 @@ export default {
},
data: [
{
value: 178,
value: normalNum,
name: '在线设备'
},
{
value: 200,
value: alarmNum,
name: '离线设备'
}
]
......@@ -120,7 +129,18 @@ export default {
}
mychart.setOption(option)
},
init3() {
async init3() {
await analyzeOutputTrend().then(res => {
let myRenderTime = []
let curMaxSize = 0;
let curIndex = 0;
res.forEach((item, index) => {
if (item.monthOutputDtos.length > curMaxSize) {
curMaxSize = item.monthOutputDtos.length
curIndex = index
}
})
myRenderTime = res[curIndex].monthOutputDtos.map(item => item.ym)
const targetDom = document.querySelector('.big-data-chart3');
const mychart = echarts.init(targetDom)
const option = {
......@@ -143,7 +163,7 @@ export default {
axisLabel: {
color: "#FFF"
},
data: ['2021-1','2021-2','2021-3','2021-4']
data: myRenderTime
},
yAxis: {
type: "value",
......@@ -164,46 +184,28 @@ export default {
color: "#fff"
}
},
series: [
{
type: 'line',
name: '非煤矿山',
smooth: true,
symbol: 'none',
data: [20, 50, 80, 10]
},
{
type: 'line',
name: '煤矿',
smooth: true,
symbol: 'none',
data: [10, 90, 20, 70]
},
{
type: 'line',
name: '危险化学品企业',
smooth: true,
symbol: 'none',
data: [80, 30, 10, 50]
},
{
series: res.map(item => {
return {
type: 'line',
name: '冶金工贸',
name: item.industry,
smooth: true,
symbol: 'none',
data: [0, 0, 0, 0]
data: item.monthOutputDtos.map(item => item.output)
}
]
})
}
mychart.setOption(option)
})
},
init5() {
async init5() {
await analyzeHDNum().then(res => {
console.log(res, 'analyzeHDNum analyzeHDNum analyzeHDNum')
const targetDom = document.querySelector('.big-data-chart5')
const mychart = echarts.init(targetDom)
const option = {
title: {
text: "总数量",
subtext: "" + 0,
subtext: "" + res.totalNum,
left: "center",
top: "40%",
textStyle: {
......@@ -228,14 +230,14 @@ export default {
avoidLabelOverLap: true,
data: [
{
value: 0,
value: res.seriousNotRectifiedNum,
name: "重大隐患未闭环",
itemStyle: {
color: "#E74C3C"
}
},
{
value: 0,
value: res.seriousRectifiedNum,
name: "重大隐患已闭环",
itemStyle: {
color: "#FDFA02"
......@@ -261,13 +263,16 @@ export default {
]
}
mychart.setOption(option)
})
},
init7() {
let lowNum = Math.floor(Math.random() * 7)
let generalNum = Math.floor(Math.random() * 2)
let greaterNum = 0
let majorNum = 0
let totalNum = lowNum + generalNum
async init7() {
await analyzeIndusRiskNum(this.curIndus.filter(item => item.label === this.curChosenIndus)[0].id).then(res => {
let lowNum = res.riskBlueNum
let generalNum = res.riskYellowNum
let greaterNum = res.riskOrangeNum
let majorNum = res.riskRedNum
let totalNum = res.totalNum
const targetDom = document.querySelector('.big-data-chart7')
const mychart = echarts.init(targetDom)
mychart.clear()
......@@ -346,11 +351,12 @@ export default {
]
}
mychart.setOption(option)
})
}
},
watch: {
curChosenIndus(newVal, oldVal) {
console.log(newVal, oldVal, 'curChosenIndus curChosenIndus')
if (newVal !== oldVal) {
this.init7()
}
......
src/components/bigdata/bigdataRight.vue
View file @ 1f655da3
......@@ -9,11 +9,11 @@
<div class="big-data-chart2-alarm-sum2">
<div class="big-data-chart2-sum">
<span>报警数量</span>
<span>324次</span>
<span>{{sensorAlarmSum}}次</span>
</div>
<div class="big-data-chart2-sum">
<span>解除报警数量</span>
<span>156次</span>
<span>{{sensorNoAlarmSum}}次</span>
</div>
</div>
<div class="big-data-chart2-table-wrapper">
......@@ -22,8 +22,16 @@
<span class="big-data-chart2-table-title2">报警状态</span>
<span class="big-data-chart2-table-title3">时间</span>
</div>
<div class="big-data-chart2-table-content-wrapper">
<div class="big-data-chart2-table-content-item">
<div class="big-data-chart2-table-content-wrapper" style="height:20vh">
<div>
<div v-for="item in alarmContent" :key="item.alarmContent" class="big-data-chart2-table-content-item">
<span>{{item.alarmContent}}</span>
<span>{{item.canceled}}</span>
<span>{{item.alarmTime}}</span>
</div>
</div>
<!-- <div class="big-data-chart2-table-content-item">
<span>监视模块</span>
<span>已解除</span>
<span>2021-11-21</span>
......@@ -32,7 +40,7 @@
<span>控制模块</span>
<span style="color: red;">报警</span>
<span>2021-11-11</span>
</div>
</div> -->
</div>
</div>
</div>
......@@ -77,29 +85,53 @@
<script>
import { dept } from '@/api/index.js'
import { createInfoCard, analyzeEachMonthNum, analyzeEnterRiskNum, analyzeRegionRiskNum } from '@/api/operatePortrait.js'
export default {
data() {
return {
curEnterprises: [],
curChosenEnter: '山金白音呼布',
isShowCurSelect: false
isShowCurSelect: false,
sensorAlarmSum: 0,
sensorNoAlarmSum: 0,
alarmContent: []
}
},
mounted() {
dept().then(res => {
console.log(res, 'bigdataRight bigdataRight bigdataRight bigdataRight')
async mounted() {
await dept().then(res => {
const toIndex = res.content.map(item => item.name).indexOf('测试企业')
if (toIndex >= -1) {
res.content.splice(toIndex, 1)
}
this.curEnterprises = [...res.content]
})
createInfoCard(this.$store.state.compony_info.id).then(res => {
this.sensorAlarmSum = res.notCanceledNum
this.sensorNoAlarmSum = res.canceledNum
this.alarmContent = [...res.infoCardDtoAlarmDtos]
})
this.init4()
this.init6()
this.init8()
},
methods: {
init4() {
async init4() {
let normalHD = []
let majorHD = []
let xAxisTime = []
await analyzeEachMonthNum('一般隐患').then(res => {
normalHD = [...res]
})
await analyzeEachMonthNum('重大隐患').then(res => {
majorHD = [...res]
})
if (normalHD.length > majorHD.length) {
xAxisTime = normalHD.map(item => item.ym)
} else if (normalHD.length < majorHD.length) {
xAxisTime = majorHD.map(item => item.ym)
} else {
xAxisTime = [...new Set([...normalHD.map(item => item.ym), ...majorHD.map(item => item.ym)])]
}
const targetDom = document.querySelector('.big-data-chart4');
const mychart = echarts.init(targetDom)
const option = {
......@@ -122,7 +154,7 @@ export default {
axisLabel: {
color: "#FFF"
},
data: ['2021-1','2021-2','2021-3','2021-4']
data: xAxisTime
},
yAxis: {
type: "value",
......@@ -144,22 +176,30 @@ export default {
}
},
series: [
{
name: '一般隐患',
type: 'bar',
stack: 'total',
data: normalHD.map(item => item.num)
},
{
name: '重大隐患',
type: 'bar',
stack: 'total',
data: [0, 0, 0, 0]
data: majorHD.map(item => item.num)
}
]
}
mychart.setOption(option)
},
init6() {
let lowNum = Math.floor(Math.random() * 6)
let generalNum = Math.floor(Math.random() * 1)
let greaterNum = 0
let majorNum = 0
let totalNum = lowNum + generalNum
async init6() {
await analyzeEnterRiskNum(this.curEnterprises.filter(item => item.name === this.curChosenEnter)[0].id).then(res => {
console.log(res, 'ananlyzeEnterRiskNum _____________ analyzeEnterRiskNum')
let lowNum = res.riskBlueNum
let generalNum = res.riskYellowNum
let greaterNum = res.riskOrangeNum
let majorNum = res.riskRedNum
let totalNum = res.totalNum
const targetDom = document.querySelector('.big-data-chart6')
const mychart = echarts.init(targetDom)
......@@ -239,14 +279,25 @@ export default {
]
}
mychart.setOption(option)
})
console.log(this.curChosenEnter, 'this.curChosenEnter this.curChosenEnter')
console.log(this.curEnterprises, 'this.curEnterprises this.curEnterprises')
},
init8() {
async init8() {
await analyzeRegionRiskNum().then(res => {
console.log(res, 'analyzeRegionRiskNum _____ annlyzeRegionRiskNum')
let lowNum = res.riskBlueNum
let generalNum = res.riskYellowNum
let greaterNum = res.riskOrangeNum
let majorNum = res.riskRedNum
let totalNum = res.totalNum
const targetDom = document.querySelector('.big-data-chart8')
const mychart = echarts.init(targetDom)
const option = {
title: {
text: "总数量",
subtext: "" + 44,
subtext: "" + totalNum,
left: "center",
top: "40%",
textStyle: {
......@@ -271,28 +322,28 @@ export default {
avoidLabelOverLap: true,
data: [
{
value: 32,
value: lowNum,
name: "低风险",
itemStyle: {
color: "#057AFD"
}
},
{
value: 12,
value: generalNum,
name: "一般风险",
itemStyle: {
color: "#FEFA03"
}
},
{
value: 0,
value: greaterNum,
name: "较大风险",
itemStyle: {
color: "#F88F12"
}
},
{
value: 0,
value: majorNum,
name: "重大风险",
itemStyle: {
color: "#FF414B"
......@@ -318,11 +369,11 @@ export default {
]
}
mychart.setOption(option)
})
}
},
watch: {
curChosenEnter(newVal, oldVal) {
console.log(newVal, oldVal, 'curChosenEnter curChosenEnter')
if (newVal !== oldVal) {
this.init6()
}
......@@ -347,6 +398,10 @@ export default {
} */
</style>
<style lang="scss">
.big-data2 {
height: 33.33%;
overflow: hidden;
}
.to-right-top-select {
position: absolute;
right: 0;
......
src/components/potrait/potrait.vue
View file @ 1f655da3
......@@ -59,7 +59,7 @@
</template>
<script>
import { monitorDevice, monitorData, analyzeAlarmNum } from '@/api/operatePortrait.js'
import { monitorDevice, monitorData, analyzeAlarmNum, analyzeHDNum } from '@/api/operatePortrait.js'
export default {
data() {
return {
......@@ -99,22 +99,27 @@ export default {
},
async mounted() {
console.log(this.$store.state.compony_info.companycode, 'this.$store.state.compony_info.companycode')
// await monitorDevice(this.$store.state.compony_info.id).then(res => {
// this.offline = res.offlineNum + ''
// this.online = res.onlineNum + ''
// this.deviceSum = res.totalNum + ''
// })
// await monitorData(this.$store.state.compony_info.companycode).then(res => {
// this.monitorSum = (res.monitorStationNum? res.monitorStationNum: '0') + ''
// this.monitorData = (res.monitorDataNum? res.monitorDataNum : '0') + ''
// this.alarmSum = (res.alarmNum? res.alarmNum : '0') + ''
// this.timeSum = (res.monitorDays? res.monitorDays : '0') + ''
// })
// await analyzeAlarmNum(this.$store.state.compony_info.companycode).then(res => {
// this.lowRisk = (res.yellowNum? res.yellowNum : '0') + ''
// this.generalRisk = (res.orangeNum? res.orangeNum : '0') + ''
// this.greaterRisk = (res.redNum? res.redNum : '0') + ''
// })
await monitorDevice(this.$store.state.compony_info.id).then(res => {
this.offline = res.offlineNum + ''
this.online = res.onlineNum + ''
this.deviceSum = res.totalNum + ''
})
await monitorData(this.$store.state.compony_info.companycode).then(res => {
this.monitorSum = (res.monitorStationNum? res.monitorStationNum: '0') + ''
this.monitorData = (res.monitorDataNum? res.monitorDataNum : '0') + ''
this.alarmSum = (res.alarmNum? res.alarmNum : '0') + ''
this.timeSum = (res.monitorDays? res.monitorDays : '0') + ''
})
await analyzeAlarmNum(this.$store.state.compony_info.companycode).then(res => {
this.lowRisk = (res.yellowNum? res.yellowNum : '0') + ''
this.generalRisk = (res.orangeNum? res.orangeNum : '0') + ''
this.greaterRisk = (res.redNum? res.redNum : '0') + ''
})
await analyzeHDNum(this.$store.state.compony_info.id).then(res => {
console.log(res, 'analyzeHDNum analyzeHDNum')
this.noCloseLoop = res.seriousNotRectifiedNum
this.closeLoop = res.seriousRectifiedNum
})
this.mineMethod = this.$store.state.compony_info.mine
this.area = this.$store.state.compony_info.area
this.yields = this.$store.state.compony_info.capacity
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment