|
|
@@ -0,0 +1,1884 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-card shadow="always" style="height:280px">
|
|
|
+ <div ref="rtuInfoCountPieChart" style="width: 100%;height: 280px;">
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-card shadow="always" style="height:280px">
|
|
|
+ <div ref="rtuDataUpCountChart" style="width: 100%;height: 280px;">
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-card shadow="always" style="height:280px">
|
|
|
+ <div ref="checkOrderChart" style="width: 100%;height: 280px;">
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-card shadow="always" style="height:280px">
|
|
|
+ <div ref="equipmentInspectionCountChart" style="width: 100%;height: 280px;">
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ </el-row>
|
|
|
+ <el-row v-if="adminPageStyle" :gutter="10">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-card shadow="always" style="height: 500px;">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>测站异常分布统计信息</span>
|
|
|
+ </div>
|
|
|
+ <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form"
|
|
|
+ @on-load="onLoad" @cell-click="cellClick">
|
|
|
+ </avue-crud>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-card class="box-small-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>今日维修任务动态</span>
|
|
|
+ <el-button style="float: right; padding: 3px 0" type="text"
|
|
|
+ @click="openMoreTodayOrderProcess">更多</el-button>
|
|
|
+ </div>
|
|
|
+ <div v-for="(item, index) in todayOrderList" :key="index" class="list-item">
|
|
|
+ <el-row type="flex">
|
|
|
+ <el-col :span="19">
|
|
|
+ <div style="padding-right: 5px;">
|
|
|
+
|
|
|
+ <div style="display: flex; flex-direction: row;align-items: center;">
|
|
|
+ <label>{{ item.rtuName }}</label>
|
|
|
+ <label style="margin-left: 5px;color: gray;"> / {{ item.rtuCode }}</label>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;">
|
|
|
+ <label>维修状态:<span style="color:gray">{{
|
|
|
+ item.orderStatusName }}</span></label>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;">
|
|
|
+ <label>更新时间:<span style="color:gray">{{ item.updateTime }}</span></label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;margin-bottom: 5px;">
|
|
|
+ <label>备注:<span style="color:gray">{{ item.processDesc }}</span></label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" style="display: flex;flex-direction: column;justify-content: center;">
|
|
|
+ <el-button style="font-size: 0.7rem;" size="mini" type="info" round
|
|
|
+ @click="openCheckOrderReportDetail(item)">查看详情</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-card class="box-card-news">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>通知公告</span>
|
|
|
+ <el-button style="float: right; padding: 3px 0" type="text"
|
|
|
+ @click="openMoreNotice">更多</el-button>
|
|
|
+ </div>
|
|
|
+ <div v-for="(item, index) in noticeList" :key="index" class="notice-item">
|
|
|
+ <div>
|
|
|
+ <label>{{ item.title }}</label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;">
|
|
|
+ <label class="notice-time">发布时间: {{ item.releaseTime }}</label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;margin-bottom: 2px;">
|
|
|
+ <label>{{
|
|
|
+ item.content
|
|
|
+ }}</label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-card class="box-small-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>今日巡检动态</span>
|
|
|
+ <el-button style="float: right; padding: 3px 0" type="text"
|
|
|
+ @click="openMoreTodayInspectionReport">更多</el-button>
|
|
|
+ </div>
|
|
|
+ <div v-for="(item, index) in todayInspectionReportList" :key="index" class="list-item">
|
|
|
+ <el-row type="flex">
|
|
|
+ <el-col :span="19">
|
|
|
+ <div style="display: flex; flex-direction: row;align-items: center;">
|
|
|
+ <label>{{ item.rtuName }}</label>
|
|
|
+ <label style="margin-left: 5px;color: gray;"> / {{ item.rtuCode }}</label>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;">
|
|
|
+ <label>填报人:<span style="color:gray">{{
|
|
|
+ item.servicePersonName
|
|
|
+ }}</span></label>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;margin-bottom: 5px;">
|
|
|
+ <label>填报时间:<span style="color:gray">{{ item.updateTime }}</span></label>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" style="display: flex;flex-direction: column;justify-content: center;">
|
|
|
+ <el-button style="font-size: 0.7rem;" size="mini" type="info" round
|
|
|
+ @click="openInspectionReportDetail(item)">查看详情</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-card class="box-card-apk">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>手机客户端下载</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <img style="width: 100px;height: 100px;" :src="appinfo.apkQrUrl" />
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;">
|
|
|
+ <label style="padding-left: 5px;font-size: 0.8rem;">版本号 {{ appinfo.version }}</label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;">
|
|
|
+ <el-button type="text" @click="downloadApk">下载安卓客户端</el-button>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row v-else :gutter="10">
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-card shadow="always" style="height: 500px;">
|
|
|
+ <div ref="rtuWarnCountChart" style="width: 100%;height: 500px;">
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-card class="box-high-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>今日维修任务动态</span>
|
|
|
+ <el-button style="float: right; padding: 3px 0" type="text"
|
|
|
+ @click="openMoreTodayOrderProcess">更多</el-button>
|
|
|
+ </div>
|
|
|
+ <div v-for="(item, index) in todayOrderList" :key="index" class="list-item">
|
|
|
+ <el-row type="flex">
|
|
|
+ <el-col :span="19">
|
|
|
+ <div style="padding-right: 5px;">
|
|
|
+
|
|
|
+ <div style="display: flex; flex-direction: row;align-items: center;">
|
|
|
+ <label>{{ item.rtuName }}</label>
|
|
|
+ <label style="margin-left: 5px;color: gray;"> / {{ item.rtuCode }}</label>
|
|
|
+ </div>
|
|
|
+ <div style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;">
|
|
|
+ <label>维修状态:<span style="color:gray">{{
|
|
|
+ item.orderStatusName }}</span></label>
|
|
|
+ </div>
|
|
|
+ <div style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;">
|
|
|
+ <label>更新时间:<span style="color:gray">{{ item.updateTime }}</span></label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;margin-bottom: 5px;">
|
|
|
+ <label>备注:<span style="color:gray">{{ item.processDesc }}</span></label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" style="display: flex;flex-direction: column;justify-content: center;">
|
|
|
+ <el-button style="font-size: 0.7rem;" size="mini" type="info" round
|
|
|
+ @click="openCheckOrderReportDetail(item)">查看详情</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-card class="box-high-card">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>今日巡检动态</span>
|
|
|
+ <el-button style="float: right; padding: 3px 0" type="text"
|
|
|
+ @click="openMoreTodayInspectionReport">更多</el-button>
|
|
|
+ </div>
|
|
|
+ <div v-for="(item, index) in todayInspectionReportList" :key="index" class="list-item">
|
|
|
+ <el-row type="flex">
|
|
|
+ <el-col :span="19">
|
|
|
+ <div style="padding-right: 5px;">
|
|
|
+ <div style="display: flex; flex-direction: row;align-items: center;">
|
|
|
+ <label>{{ item.rtuName }}</label>
|
|
|
+ <label style="margin-left: 5px;color: gray;"> / {{ item.rtuCode }}</label>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;">
|
|
|
+ <label>填报人:<span style="color:gray">{{
|
|
|
+ item.servicePersonName
|
|
|
+ }}</span></label>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="display: flex; flex-direction: row;align-items: center;margin-top: 4px;margin-bottom: 5px;">
|
|
|
+ <label>填报时间:<span style="color:gray">{{ item.updateTime }}</span></label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" style="display: flex;flex-direction: column;justify-content: center;">
|
|
|
+ <el-button style="font-size: 0.7rem;" size="mini" type="info" round
|
|
|
+ @click="openInspectionReportDetail(item)">查看详情</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-card class="box-card-news">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>通知公告</span>
|
|
|
+ <el-button style="float: right; padding: 3px 0" type="text"
|
|
|
+ @click="openMoreNotice">更多</el-button>
|
|
|
+ </div>
|
|
|
+ <div v-for="(item, index) in noticeList" :key="index" class="notice-item">
|
|
|
+ <div>
|
|
|
+ <label>{{ item.title }}</label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;">
|
|
|
+ <label class="notice-time">发布时间: {{ item.releaseTime }}</label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;margin-bottom: 2px;">
|
|
|
+ <label>{{
|
|
|
+ item.content
|
|
|
+ }}</label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-card class="box-card-apk">
|
|
|
+ <div slot="header" class="clearfix">
|
|
|
+ <span>手机客户端下载</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <img style="width: 100px;height: 100px;" :src="appinfo.apkQrUrl" />
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;">
|
|
|
+ <label style="padding-left: 5px;font-size: 0.8rem;">版本号 {{ appinfo.version }}</label>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4px;">
|
|
|
+ <el-button type="text" @click="downloadApk">下载安卓客户端</el-button>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-drawer title="今日维修任务动态信息" :visible.sync="moreTodayOrderProcessDig" v-if="moreTodayOrderProcessDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <todaycheckorderprocesslist ref="todaycheckorderprocesslist">
|
|
|
+ </todaycheckorderprocesslist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="今日巡检动态信息" :visible.sync="moreTodayInspectionReportDig" v-if="moreTodayInspectionReportDig"
|
|
|
+ size="50%" :close-on-click-modal="false" append-to-body>
|
|
|
+ <todaynspectionrportlist ref="todaynspectionrportlist"></todaynspectionrportlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="通知公告信息" :visible.sync="moreNoticeDig" v-if="moreNoticeDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <todaynoticelist ref="todaynoticelist"></todaynoticelist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="异常测站信息" :visible.sync="warninglistDig" v-if="warninglistDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <warninglist ref="warninglist" :deptId="deptId"></warninglist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="离线测站信息" :visible.sync="offlineWarnListDig" v-if="offlineWarnListDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <offlinewarnlist ref="offlinewarnlist" :deptId="deptId"></offlinewarnlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="时钟异常测站信息" :visible.sync="clockWarnListDig" v-if="clockWarnListDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <clockwarnlist ref="clockwarnlist" :deptId="deptId"></clockwarnlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="小时报漏报测站信息" :visible.sync="hourmissoutWarnListDig" v-if="hourmissoutWarnListDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <hourmissoutwarnlist ref="hourmissoutwarnlist" :deptId="deptId"></hourmissoutwarnlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="雨量站小时报漏报测站信息" :visible.sync="rainHourmissoutWarnListDig" v-if="rainHourmissoutWarnListDig"
|
|
|
+ size="50%" :close-on-click-modal="false" append-to-body>
|
|
|
+ <rainHourmissoutWarnListVue ref="rainHourmissoutWarnList" :deptId="deptId"></rainHourmissoutWarnListVue>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="水位站小时报漏报测站信息" :visible.sync="riverHourmissoutWarnListDig" v-if="riverHourmissoutWarnListDig"
|
|
|
+ size="50%" :close-on-click-modal="false" append-to-body>
|
|
|
+ <riverHourmissoutWarnListVue ref="riverHourmissoutWarnList" :deptId="deptId"></riverHourmissoutWarnListVue>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="5分钟报延时测站信息" :visible.sync="minupdelayWarnListDig" v-if="minupdelayWarnListDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <minupdelaywarnlist ref="minupdelaywarnlist" :deptId="deptId"></minupdelaywarnlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="小时报延时测站信息" :visible.sync="hourupdelayWarnListDig" v-if="hourupdelayWarnListDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <hourupdelaywarnlist ref="hourupdelaywarnlist" :deptId="deptId"></hourupdelaywarnlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="雨量站小时报延时测站信息" :visible.sync="rainHourupdelayWarnListDig" v-if="rainHourupdelayWarnListDig"
|
|
|
+ size="50%" :close-on-click-modal="false" append-to-body>
|
|
|
+ <rainhourupdelaywarnlistVue ref="rainhourupdelaywarnlist" :deptId="deptId"></rainhourupdelaywarnlistVue>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="水位站小时报延时测站信息" :visible.sync="riverHourupdelayWarnListDig" v-if="riverHourupdelayWarnListDig"
|
|
|
+ size="50%" :close-on-click-modal="false" append-to-body>
|
|
|
+ <riverhourupdelaywarnlistVue ref="riverhourupdelaywarnlist" :deptId="deptId"></riverhourupdelaywarnlistVue>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="疑似异常值测站信息" :visible.sync="outlterValueWarnListDig" v-if="outlterValueWarnListDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <outlitervaluewarnlist ref="outlitervaluewarnlist" :deptId="deptId"></outlitervaluewarnlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="维修中任务信息" :visible.sync="processingcheckorderlistDig" v-if="processingcheckorderlistDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <processingcheckorderlist ref="processingcheckorderlist"></processingcheckorderlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="未确认维修任务信息" :visible.sync="uncomfireCheckOrderDig" v-if="uncomfireCheckOrderDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <uncomfirecheckorderlist ref="uncomfirecheckorderlist"></uncomfirecheckorderlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="确认超时维修任务信息" :visible.sync="comfireDelayCheckOrderDig" v-if="comfireDelayCheckOrderDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <comfiredelaycheckorderlist ref="comfiredelaycheckorderlist"></comfiredelaycheckorderlist>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="维修任务详情" :visible.sync="checkorderprocessdetailDig" v-if="checkorderprocessdetailDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <checkorderprocessdetail ref="checkorderprocessdetail" :orderId="checkOrderReportId"></checkorderprocessdetail>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer title="设备巡检详情" :visible.sync="inspectionreportdetailDig" v-if="inspectionreportdetailDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <inspectionreportdetail ref="inspectionreportdetail" :id="inspectionReportId"></inspectionreportdetail>
|
|
|
+ </el-drawer>
|
|
|
+ <el-drawer :visible.sync="inspectionreportlistDig" v-if="inspectionreportlistDig" size="50%"
|
|
|
+ :close-on-click-modal="false" append-to-body>
|
|
|
+ <div slot="title" class="header-title">
|
|
|
+ <span class="name">{{ dialogTitle }}</span>
|
|
|
+ </div>
|
|
|
+ <inspectionreportlistVue ref="inspectionreportlist" :rainSeasonKind="rainSeasonKind"></inspectionreportlistVue>
|
|
|
+ </el-drawer>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { getRtuStatusCountData, getRtuUpCountData, getCheckOrderCountData, getInspectionReportCountData, getWarnKindCountData, getWarnCountList } from "@/api/home/home.js";
|
|
|
+import { todayOrderProcessList } from "@/api/business/order/process.js";
|
|
|
+import { todayInspectionReportList } from "@/api/business/inspection/inspectionreport.js";
|
|
|
+import { getLastList } from "@/api/notice/notice.js";
|
|
|
+import { getStore } from '@/util/store.js';
|
|
|
+import { getAppInfo } from "@/api/versionmanage/version.js";
|
|
|
+import todaycheckorderprocesslist from "../business/order/todaycheckorderprocesslist.vue";
|
|
|
+import uncomfirecheckorderlist from "../business/order/uncomfirecheckorderlist.vue";
|
|
|
+import comfiredelaycheckorderlist from "../business/order/comfiredelaycheckorderlist.vue";
|
|
|
+import processingcheckorderlist from "../business/order/processingcheckorderlist.vue";
|
|
|
+import todaynspectionrportlist from "../business/inspection/todaynspectionrportlist.vue";
|
|
|
+import todaynoticelist from "../notice/todaynoticelist.vue";
|
|
|
+import warninglist from "../business/warning/warninglist.vue";
|
|
|
+import offlinewarnlist from "../business/warning/offlinewarnlist.vue";
|
|
|
+import clockwarnlist from "../business/warning/clockwarnlist.vue";
|
|
|
+import hourmissoutwarnlist from "../business/warning/hourmissoutwarnlist.vue";
|
|
|
+import rainHourmissoutWarnListVue from "../business/warning/rainhourmissoutwarnlist.vue";
|
|
|
+import riverHourmissoutWarnListVue from "../business/warning/riverhourmissoutwarnlist.vue";
|
|
|
+import minupdelaywarnlist from "../business/warning/minupdelaywarnlist.vue";
|
|
|
+import hourupdelaywarnlist from "../business/warning/hourupdelaywarnlist.vue";
|
|
|
+import rainhourupdelaywarnlistVue from "../business/warning/rainhourupdelaywarnlist.vue";
|
|
|
+import riverhourupdelaywarnlistVue from "../business/warning/riverhourupdelaywarnlist.vue";
|
|
|
+import outlitervaluewarnlist from "../business/warning/outlitervaluewarnlist.vue";
|
|
|
+import checkorderprocessdetail from "../business/order/checkorderprocessdetail.vue";
|
|
|
+import inspectionreportdetail from "../business/inspection/inspectionreportdetail.vue";
|
|
|
+import inspectionreportlistVue from "../business/inspection/inspectionreportlist.vue";
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+export default {
|
|
|
+ name: "home",
|
|
|
+ components: {
|
|
|
+ todaycheckorderprocesslist,
|
|
|
+ todaynspectionrportlist,
|
|
|
+ todaynoticelist,
|
|
|
+ warninglist,
|
|
|
+ offlinewarnlist,
|
|
|
+ hourmissoutwarnlist,
|
|
|
+ minupdelaywarnlist,
|
|
|
+ hourupdelaywarnlist,
|
|
|
+ uncomfirecheckorderlist,
|
|
|
+ comfiredelaycheckorderlist,
|
|
|
+ checkorderprocessdetail,
|
|
|
+ inspectionreportdetail,
|
|
|
+ inspectionreportlistVue,
|
|
|
+ clockwarnlist,
|
|
|
+ rainHourmissoutWarnListVue,
|
|
|
+ riverHourmissoutWarnListVue,
|
|
|
+ rainhourupdelaywarnlistVue,
|
|
|
+ riverhourupdelaywarnlistVue,
|
|
|
+ outlitervaluewarnlist,
|
|
|
+ processingcheckorderlist
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ adminPageStyle: false,
|
|
|
+ warninglistDig: false,
|
|
|
+ offlineWarnListDig: false,
|
|
|
+ clockWarnListDig: false,
|
|
|
+ hourmissoutWarnListDig: false,
|
|
|
+ rainHourmissoutWarnListDig: false,
|
|
|
+ riverHourmissoutWarnListDig: false,
|
|
|
+ minupdelayWarnListDig: false,
|
|
|
+ hourupdelayWarnListDig: false,
|
|
|
+ rainHourupdelayWarnListDig: false,
|
|
|
+ riverHourupdelayWarnListDig: false,
|
|
|
+ outlterValueWarnListDig: false,
|
|
|
+ uncomfireCheckOrderDig: false,
|
|
|
+ comfireDelayCheckOrderDig: false,
|
|
|
+ processingcheckorderlistDig: false,
|
|
|
+ moreTodayOrderProcessDig: false,
|
|
|
+ moreTodayInspectionReportDig: false,
|
|
|
+ moreNoticeDig: false,
|
|
|
+ checkorderprocessdetailDig: false,
|
|
|
+ inspectionreportdetailDig: false,
|
|
|
+ inspectionreportlistDig: false,
|
|
|
+ dialogTitle: '',
|
|
|
+ deptId: 0,
|
|
|
+ form: {},
|
|
|
+ selectionList: [],
|
|
|
+ query: {},
|
|
|
+ loading: true,
|
|
|
+ data: [],
|
|
|
+ option: {
|
|
|
+ height: "420",
|
|
|
+ align: "center",
|
|
|
+ headerAlign: "center",
|
|
|
+ tip: false,
|
|
|
+ simplePage: true,
|
|
|
+ searchShow: false,
|
|
|
+ searchMenuSpan: 6,
|
|
|
+ addBtn: false,
|
|
|
+ tree: true,
|
|
|
+ border: true,
|
|
|
+ index: true,
|
|
|
+ editBtn: false,
|
|
|
+ delBtn: false,
|
|
|
+ menu: false,
|
|
|
+ dialogType: "drawer",
|
|
|
+ dialogClickModal: false,
|
|
|
+ columnBtn: false,
|
|
|
+ refreshBtn: false,
|
|
|
+ header: false,
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ label: "盟市",
|
|
|
+ prop: "adCity",
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "测站数量",
|
|
|
+ prop: "rtus",
|
|
|
+ span: 12,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "测站离线",
|
|
|
+ prop: "warnOffline",
|
|
|
+ span: 12,
|
|
|
+ html: true,
|
|
|
+ formatter: (val) => {
|
|
|
+ if (val.warnOffline && val.warnOffline > 0) {
|
|
|
+ let n = val.warnOffline / val.rtus * 100;
|
|
|
+ let num = new Number(n);
|
|
|
+ // if (val.deptId == 0) {
|
|
|
+ // return '<span><b style="color:rgb(238,112,112)">' + val.warnOffline + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // } else {
|
|
|
+ return '<span style="cursor:pointer;text-decoration-line: underline;"><b style="color:rgb(238,112,112)">' + val.warnOffline + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // }
|
|
|
+ } else {
|
|
|
+ return '<b></b>'
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ label: "小时报漏报",
|
|
|
+ prop: "warnMissOut",
|
|
|
+ span: 12,
|
|
|
+ html: true,
|
|
|
+ formatter: (val) => {
|
|
|
+ if (val.warnMissOut && val.warnMissOut > 0) {
|
|
|
+ let n = val.warnMissOut / val.rtus * 100;
|
|
|
+ let num = new Number(n);
|
|
|
+ // if (val.deptId == 0) {
|
|
|
+ // return '<span><b style="color:rgb(238,112,112)">' + val.warnMissOut + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // } else {
|
|
|
+ return '<span style="cursor:pointer;text-decoration-line: underline;"><b style="color:rgb(238,112,112)">' + val.warnMissOut + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // }
|
|
|
+ } else {
|
|
|
+ return '<b></b>'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ label: "5分钟上报延时",
|
|
|
+ prop: "warnUpMinDelay",
|
|
|
+ span: 12,
|
|
|
+ html: true,
|
|
|
+ formatter: (val) => {
|
|
|
+ if (val.warnUpMinDelay && val.warnUpMinDelay > 0) {
|
|
|
+ let n = val.warnUpMinDelay / val.rtus * 100;
|
|
|
+ let num = new Number(n);
|
|
|
+ // if (val.deptId == 0) {
|
|
|
+ // return '<span><b style="color:rgb(238,112,112)">' + val.warnUpMinDelay + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // } else {
|
|
|
+ return '<span style="cursor:pointer;text-decoration-line: underline;"><b style="color:rgb(238,112,112)">' + val.warnUpMinDelay + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // }
|
|
|
+
|
|
|
+ } else {
|
|
|
+ return '<b></b>'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ label: "小时上报延时",
|
|
|
+ prop: "warnUpHourDelay",
|
|
|
+ span: 12,
|
|
|
+ html: true,
|
|
|
+ formatter: (val) => {
|
|
|
+ if (val.warnUpHourDelay && val.warnUpHourDelay > 0) {
|
|
|
+ let n = val.warnUpHourDelay / val.rtus * 100;
|
|
|
+ let num = new Number(n);
|
|
|
+ // if (val.deptId == 0) {
|
|
|
+ // return '<span><b style="color:rgb(238,112,112)">' + val.warnUpHourDelay + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // } else {
|
|
|
+ return '<span style="cursor:pointer;text-decoration-line: underline;"><b style="color:rgb(238,112,112)">' + val.warnUpHourDelay + '</b> / ' + '<b style="color:rgb(84,123,201)">' + num.toFixed(2) + '%</b></span>'
|
|
|
+ // }
|
|
|
+
|
|
|
+ } else {
|
|
|
+ return '<b></b>'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ appinfo: {
|
|
|
+ apkUrl: '',
|
|
|
+ apkQrUrl: '',
|
|
|
+ version: ''
|
|
|
+ },
|
|
|
+ checkOrderReportId: '',
|
|
|
+ inspectionReportId: '',
|
|
|
+ realData: {
|
|
|
+ },
|
|
|
+ stompClient: null,
|
|
|
+ layout: [],
|
|
|
+ cache: [],
|
|
|
+ editSw: false,
|
|
|
+ dialog: false,
|
|
|
+ id: "",
|
|
|
+ guideForm: {},
|
|
|
+ second: 0,
|
|
|
+ timer: null,
|
|
|
+ state: 5,
|
|
|
+ todayOrderList: [],
|
|
|
+ todayInspectionReportList: [],
|
|
|
+ noticeList: [],
|
|
|
+ userInfo: getStore({ name: 'userInfo' }) || [],
|
|
|
+ rtuInfoCountPieMap: null,
|
|
|
+ rtuInfoCountPieOption: {
|
|
|
+ title: {
|
|
|
+ text: '测站状态统计信息',
|
|
|
+ subtext: '测站总数量',
|
|
|
+ left: 'center'
|
|
|
+ },
|
|
|
+ tooltip: {
|
|
|
+ trigger: 'item',
|
|
|
+ formatter: '{a} <br/>{b} : {c} ({d}%)',
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 12
|
|
|
+ }
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ bottom: 20,
|
|
|
+ left: 'center',
|
|
|
+ data: ['运行正常', '测站离线', '其他异常']
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: '状态信息',
|
|
|
+ type: 'pie',
|
|
|
+ radius: '40%',
|
|
|
+ center: ['50%', '50%'],
|
|
|
+ selectedMode: 'single',
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ name: '运行正常',
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ formatter(param) {
|
|
|
+ // correct the percentage
|
|
|
+ return ' (' + param.value + ' / ' + param.percent + '%)';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#547bc9'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ name: '测站离线',
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ formatter(param) {
|
|
|
+ // correct the percentage
|
|
|
+ return ' (' + param.value + ' / ' + param.percent + '%)';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#ff0000'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ name: '其他异常',
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ formatter(param) {
|
|
|
+ // correct the percentage
|
|
|
+ return ' (' + param.value + ' / ' + param.percent + '%)';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#ee7070'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ emphasis: {
|
|
|
+ itemStyle: {
|
|
|
+ shadowBlur: 10,
|
|
|
+ shadowOffsetX: 0,
|
|
|
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ rtuDataUpCountMap: null,
|
|
|
+ rtuDataUpCountOption: {
|
|
|
+ title: {
|
|
|
+ text: '测站上报率统计信息',
|
|
|
+ subtext: '统计口径为上一个自然天',
|
|
|
+ left: 'center'
|
|
|
+ },
|
|
|
+ tooltip: {
|
|
|
+ trigger: 'axis',
|
|
|
+ axisPointer: {
|
|
|
+ type: 'shadow'
|
|
|
+ },
|
|
|
+ showContent: true,
|
|
|
+ formatter: function (params) {
|
|
|
+ console.log(JSON.stringify(params))
|
|
|
+ return '<b>' + params[0].name + '数量:' + params[0].data.value + '</b><br/><b>上报数量:' + params[1].data.value + '/' + params[1].data.percent + '</b><br/><b>点击打开列表页</b>';
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 10,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ show: true,
|
|
|
+ bottom: 20,
|
|
|
+
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: '3%',
|
|
|
+ right: '4%',
|
|
|
+ bottom: '18%',
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: 'value',
|
|
|
+ boundaryGap: [0, 0.01]
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ type: 'category',
|
|
|
+ data: ['墒情站', '水位站', '雨量站']
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: '测站数量',
|
|
|
+ type: 'bar',
|
|
|
+ data: [{
|
|
|
+ value: 0,
|
|
|
+ showpercent: false,
|
|
|
+ percent: 0
|
|
|
+ }, {
|
|
|
+ value: 0,
|
|
|
+ showpercent: false,
|
|
|
+ percent: 0
|
|
|
+ }, {
|
|
|
+ value: 0,
|
|
|
+ showpercent: false,
|
|
|
+ percent: 0
|
|
|
+ }],
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(84, 112, 198,1.0)'
|
|
|
+ },
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ position: 'insideLeft',
|
|
|
+ formatter(params) {
|
|
|
+ if (params.data.showpercent) {
|
|
|
+ return ' ' + params.data.value + ' / ' + params.data.percent + '%';
|
|
|
+ } else {
|
|
|
+ return ' ' + params.data.value;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '上报数量',
|
|
|
+ type: 'bar',
|
|
|
+ data: [{
|
|
|
+ value: 0,
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ }, {
|
|
|
+ value: 0,
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ }, {
|
|
|
+ value: 0,
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ }],
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(145, 204, 122,1.0)'
|
|
|
+ },
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ position: 'insideLeft',
|
|
|
+ formatter(params) {
|
|
|
+
|
|
|
+ if (params.data.showpercent) {
|
|
|
+ return ' ' + params.data.value + ' / ' + params.data.percent + '%';
|
|
|
+ } else {
|
|
|
+ return ' ' + params.data.value;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ checkOrderMap: null,
|
|
|
+ checkOrderCountOption: {
|
|
|
+ tooltip: {
|
|
|
+ trigger: 'axis',
|
|
|
+ axisPointer: {
|
|
|
+ type: 'shadow',
|
|
|
+ },
|
|
|
+ showContent: true,
|
|
|
+ formatter: function (params) {
|
|
|
+ //console.log(JSON.stringify(params))
|
|
|
+ if (params[0].data.showpercent) {
|
|
|
+
|
|
|
+ return '<b>' + params[0].name + ':' + params[0].data.value + '</b><br/><b>百分比:' + params[0].data.percent + '</b><br/><b>点击打开列表页</b>';
|
|
|
+ } else {
|
|
|
+ return "点击跳转到维修任务管理页面";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 10
|
|
|
+ }
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ text: '维修任务统计信息',
|
|
|
+ left: 'center',
|
|
|
+ subtext: '实时统计'
|
|
|
+ // textStyle: {
|
|
|
+ // fontSize: 16,
|
|
|
+ // fontWeight: "bold",
|
|
|
+ // color: "#464646",
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ color: ['#5470c6'],
|
|
|
+ yAxis: {
|
|
|
+ type: 'category',
|
|
|
+ data: ['超时未确认任务', '未确认任务', '维修中', '维修任务总量']
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: 'value',
|
|
|
+
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: '3%',
|
|
|
+ right: '4%',
|
|
|
+ bottom: '18%',
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(250, 200, 88,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(145, 204, 122,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+
|
|
|
+ color: 'rgba(84, 112, 198,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: false,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ type: 'bar',
|
|
|
+ barWidth: 20,
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ position: 'insideLeft',
|
|
|
+ formatter(params) {
|
|
|
+ if (params.data.showpercent) {
|
|
|
+ return ' ' + params.data.value + ' / ' + params.data.percent + '%';
|
|
|
+ } else {
|
|
|
+ return ' ' + params.data.value;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ equipmentInspectionChartMap: null,
|
|
|
+ equipmentInspectionCountOption: {
|
|
|
+ tooltip: {
|
|
|
+ trigger: 'axis',
|
|
|
+ axisPointer: {
|
|
|
+ type: 'shadow',
|
|
|
+ },
|
|
|
+ showContent: true,
|
|
|
+ formatter: function (params) {
|
|
|
+ // console.log(JSON.stringify(params))
|
|
|
+ if (params[0].data.showpercent) {
|
|
|
+ // return "点击柱状图可查看详情";
|
|
|
+ return '<b>已巡检:' + params[0].data.value + '</b><br/><b>百分比:' + params[0].data.percent + '</b><br/><b>点击打开列表页</b>';
|
|
|
+ } else {
|
|
|
+ return "点击跳转到设备巡检管理页面";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 10
|
|
|
+ }
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ text: '本年度设备巡检统计信息',
|
|
|
+ left: 'center',
|
|
|
+ subtext: '实时统计'
|
|
|
+ // textStyle: {
|
|
|
+ // fontSize: 16,
|
|
|
+ // fontWeight: "bold",
|
|
|
+ // color: "#464646",
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ color: ['#5470c6'],
|
|
|
+ yAxis: {
|
|
|
+ type: 'category',
|
|
|
+ data: ['汛中(二)已巡检', '汛中(一)已巡检', '汛前已巡检', '需巡检站点数量']
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: 'value',
|
|
|
+
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: '3%',
|
|
|
+ right: '4%',
|
|
|
+ bottom: '18%',
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(145, 204, 122,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(145, 204, 122,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(145, 204, 122,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 4
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(84, 112, 198,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: false,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ type: 'bar',
|
|
|
+ barWidth: 20,
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ position: 'insideLeft',
|
|
|
+ formatter(params) {
|
|
|
+ if (params.data.showpercent) {
|
|
|
+ return ' ' + params.data.value + ' / ' + params.data.percent + '%';
|
|
|
+ } else {
|
|
|
+ return ' ' + params.data.value;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ rtuWarnCountMap: null,
|
|
|
+ rtuWarnCountOption: {
|
|
|
+ tooltip: {
|
|
|
+ trigger: 'axis',
|
|
|
+ axisPointer: {
|
|
|
+ type: 'shadow',
|
|
|
+ },
|
|
|
+ showContent: true,
|
|
|
+ formatter: function (params) {
|
|
|
+ // console.log(JSON.stringify(params))
|
|
|
+ if (params[0].data.showpercent) {
|
|
|
+ //return "点击柱状图可查看详情";
|
|
|
+ return '<b>' + params[0].name + ':' + params[0].data.value + '</b><br/><b>百分比:' + params[0].data.percent + '</b><br/><b>点击打开列表页</b>';
|
|
|
+ } else {
|
|
|
+ return '<b>' + params[0].name + ':' + params[0].data.value + '</b><br/><b>点击打开列表页</b>';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 10
|
|
|
+ }
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+
|
|
|
+ text: '测站异常分类统计信息',
|
|
|
+ left: 'center',
|
|
|
+ subtext: '实时统计'
|
|
|
+ // textStyle: {
|
|
|
+ // fontSize: 16,
|
|
|
+ // fontWeight: "bold",
|
|
|
+ // color: "#464646",
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ color: ['#5470c6'],
|
|
|
+ yAxis: {
|
|
|
+ type: 'category',
|
|
|
+ data: ['疑似异常值', '水位站小时报上报延时', '雨量站小时报上报延时', '5分钟上报延时', '水位站小时报漏报', '雨量站小时报漏报', '时钟异常', '离线', '异常测站总数']
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: 'value',
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: '3%',
|
|
|
+ right: '4%',
|
|
|
+ bottom: '10%',
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgba(238, 122, 122,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: true,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ itemStyle: {
|
|
|
+
|
|
|
+ color: 'rgba(84, 112, 198,1.0)'
|
|
|
+ },
|
|
|
+ showpercent: false,
|
|
|
+ percent: 0
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ type: 'bar',
|
|
|
+ barWidth: 20,
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ position: 'insideLeft',
|
|
|
+ formatter(params) {
|
|
|
+ if (params.data.showpercent) {
|
|
|
+ return ' ' + params.data.value + ' / ' + params.data.percent + '%';
|
|
|
+ } else {
|
|
|
+ return ' ' + params.data.value;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ // let u = getStore({ name: 'userInfo' });
|
|
|
+ console.log(JSON.stringify(this.userInfo));
|
|
|
+ // this.getData();
|
|
|
+ if (this.userInfo.role_name === "sys_admin") {
|
|
|
+ this.adminPageStyle = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["userInfo"]),
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ console.log("mounted ++++++++++++++++++++");
|
|
|
+ // this.initWebsocket();
|
|
|
+ var that = this;
|
|
|
+ let chart = this.$refs.rtuInfoCountPieChart;
|
|
|
+ if (chart) {
|
|
|
+ this.rtuInfoCountPieMap = this.$echarts.init(chart);
|
|
|
+ this.rtuInfoCountPieMap.setOption(this.rtuInfoCountPieOption);
|
|
|
+ // this.rtuInfoCountPieMap.off('click');
|
|
|
+ // this.rtuInfoCountPieMap.on('click', function (p) {
|
|
|
+ // console.log(p)
|
|
|
+ // if (p.name === '设备异常') {
|
|
|
+ // that.warninglistDig = true;
|
|
|
+ // that.$nextTick(() => {
|
|
|
+ // that.$refs['warninglist'].init();
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ }
|
|
|
+
|
|
|
+ chart = this.$refs.rtuDataUpCountChart;
|
|
|
+ if (chart) {
|
|
|
+ this.rtuDataUpCountMap = this.$echarts.init(chart);
|
|
|
+ this.rtuDataUpCountMap.setOption(this.rtuDataUpCountOption);
|
|
|
+ // this.rtuDataUpCountMap.off('click');
|
|
|
+ // this.rtuDataUpCountMap.on('click', function (p) {
|
|
|
+ // console.log(p)
|
|
|
+
|
|
|
+ // })
|
|
|
+ this.rtuDataUpCountMap.getZr().off('click');
|
|
|
+ this.rtuDataUpCountMap.getZr().on('click', function (p) {
|
|
|
+ let pointInPixel = [p.offsetX, p.offsetY];
|
|
|
+ if (that.rtuDataUpCountMap.containPixel('grid', pointInPixel)) {
|
|
|
+ let yIndex = that.rtuDataUpCountMap.convertFromPixel({ seriesIndex: 0 }, [p.offsetX, p.offsetY])[1];
|
|
|
+ //let yData=that.checkOrderCountOption.yAxis.data[yIndex];//当前点击柱子的数据
|
|
|
+ // let value = that.rtuDataUpCountOption.series[0].data[yIndex].value;
|
|
|
+ if (yIndex == 2) {
|
|
|
+ that.$router.push({ path: '/business/data/rainDataCache' });
|
|
|
+ } else if (yIndex == 1) {
|
|
|
+ that.$router.push({ path: '/business/data/riverDataCache' });
|
|
|
+ } else if (yIndex == 0) {
|
|
|
+ that.$router.push({ path: '/business/data/groundDataCache' });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ chart = this.$refs.checkOrderChart;
|
|
|
+ if (chart) {
|
|
|
+ this.checkOrderMap = this.$echarts.init(chart);
|
|
|
+ this.checkOrderMap.setOption(this.checkOrderCountOption);
|
|
|
+ this.checkOrderMap.getZr().off('click');
|
|
|
+ this.checkOrderMap.getZr().on('click', function (p) {
|
|
|
+ console.log("checkOrderChart zr ++++++++++++++++++++++++++++++++++++")
|
|
|
+ let pointInPixel = [p.offsetX, p.offsetY];
|
|
|
+ if (that.checkOrderMap.containPixel('grid', pointInPixel)) {
|
|
|
+ let yIndex = that.checkOrderMap.convertFromPixel({ seriesIndex: 0 }, [p.offsetX, p.offsetY])[1];
|
|
|
+ //let yData=that.checkOrderCountOption.yAxis.data[yIndex];//当前点击柱子的数据
|
|
|
+ let value = that.checkOrderCountOption.series[0].data[yIndex].value;
|
|
|
+ if (yIndex == 3) {
|
|
|
+ console.log("维修数量 index " + yIndex)
|
|
|
+ that.$router.push({ path: '/business/order/checkorderlist' });
|
|
|
+ } else if (yIndex == 2) {
|
|
|
+ if (value > 0) {
|
|
|
+ console.log("维修中 index " + yIndex)
|
|
|
+ that.processingcheckorderlistDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["processingcheckorderlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("维修中暂无数据");
|
|
|
+ }
|
|
|
+ } else if (yIndex == 1) {
|
|
|
+ if (value > 0) {
|
|
|
+ console.log("未确认 index " + yIndex)
|
|
|
+ that.uncomfireCheckOrderDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["uncomfirecheckorderlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("未确认维修任务暂无数据");
|
|
|
+ }
|
|
|
+ } else if (yIndex == 0) {
|
|
|
+ if (value > 0) {
|
|
|
+ console.log("超时未确认 index " + yIndex)
|
|
|
+ that.comfireDelayCheckOrderDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["comfiredelaycheckorderlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("超时未确认维修任务暂无数据");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // this.checkOrderMap.off('click');
|
|
|
+ // this.checkOrderMap.on('click', function (p) {
|
|
|
+ // console.log("checkOrderChart++++++++++++++++++++++++++++++++++++")
|
|
|
+ // if (p.name === '维修任务数量') {
|
|
|
+ // that.$router.push({ name: 'checkordermanagepage' });
|
|
|
+ // } else if (p.name === '维修中') {
|
|
|
+ // } else if (p.name === '未确认任务') {
|
|
|
+ // that.uncomfireCheckOrderDig = true;
|
|
|
+ // that.$nextTick(() => {
|
|
|
+ // that.$refs["uncomfirecheckorderlist"].init();
|
|
|
+ // });
|
|
|
+ // } else if (p.name === '超时未确认任务') {
|
|
|
+ // that.comfireDelayCheckOrderDig = true;
|
|
|
+ // that.$nextTick(() => {
|
|
|
+ // that.$refs["comfiredelaycheckorderlist"].init();
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ }
|
|
|
+ chart = this.$refs.equipmentInspectionCountChart;
|
|
|
+ if (chart) {
|
|
|
+ this.equipmentInspectionChartMap = this.$echarts.init(chart);
|
|
|
+ this.equipmentInspectionChartMap.setOption(this.equipmentInspectionCountOption);
|
|
|
+ this.equipmentInspectionChartMap.getZr().off('click');
|
|
|
+ this.equipmentInspectionChartMap.getZr().on('click', function (p) {
|
|
|
+ console.log("checkOrderChart zr ++++++++++++++++++++++++++++++++++++")
|
|
|
+ let pointInPixel = [p.offsetX, p.offsetY];
|
|
|
+ if (that.equipmentInspectionChartMap.containPixel('grid', pointInPixel)) {
|
|
|
+ let yIndex = that.equipmentInspectionChartMap.convertFromPixel({ seriesIndex: 0 }, [p.offsetX, p.offsetY])[1];
|
|
|
+ //let yData = that.equipmentInspectionCountOption.yAxis.data[yIndex];//当前点击柱子的数据
|
|
|
+ let value = that.equipmentInspectionCountOption.series[0].data[yIndex].value;
|
|
|
+ console.log(" yData " + value)
|
|
|
+ if (yIndex == 3) {
|
|
|
+ console.log("巡检数量 index " + yIndex)
|
|
|
+ that.$router.push({ path: '/business/inspection/index' });
|
|
|
+ } else if (yIndex == 2) {
|
|
|
+
|
|
|
+ if (value > 0) {
|
|
|
+ console.log("汛前 index " + yIndex)
|
|
|
+ that.rainSeasonKind = 1;
|
|
|
+ that.inspectionreportlistDig = true;
|
|
|
+ that.dialogTitle = '汛前已巡检信息';
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["inspectionreportlist"].init();
|
|
|
+ });
|
|
|
+
|
|
|
+ } else {
|
|
|
+ that.$message.warning("汛前巡检暂无上报数据");
|
|
|
+ }
|
|
|
+ } else if (yIndex == 1) {
|
|
|
+ if (value > 0) {
|
|
|
+ console.log("汛中一 index " + yIndex)
|
|
|
+ that.rainSeasonKind = 2;
|
|
|
+ that.inspectionreportlistDig = true;
|
|
|
+ that.dialogTitle = '汛中(一)已巡检信息';
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["inspectionreportlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("汛中第一次巡检暂无上报数据");
|
|
|
+ }
|
|
|
+ } else if (yIndex == 0) {
|
|
|
+ if (value > 0) {
|
|
|
+ console.log("汛中二 index " + yIndex)
|
|
|
+ that.rainSeasonKind = 3;
|
|
|
+ that.inspectionreportlistDig = true;
|
|
|
+ that.dialogTitle = '汛中(二)已巡检信息';
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["inspectionreportlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("汛中第二次巡检暂无上报数据");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // this.equipmentInspectionChartMap.off('click')
|
|
|
+ // this.equipmentInspectionChartMap.on('click', function (p) {
|
|
|
+ // console.log(p)
|
|
|
+ // })
|
|
|
+ }
|
|
|
+
|
|
|
+ chart = this.$refs.rtuWarnCountChart;
|
|
|
+ if (chart) {
|
|
|
+ this.rtuWarnCountMap = this.$echarts.init(chart);
|
|
|
+ this.rtuWarnCountMap.setOption(this.rtuWarnCountOption);
|
|
|
+ this.rtuWarnCountMap.getZr().off('click');
|
|
|
+ this.rtuWarnCountMap.getZr().on('click', function (p) {
|
|
|
+ console.log(p)
|
|
|
+ let pointInPixel = [p.offsetX, p.offsetY];
|
|
|
+ if (that.rtuWarnCountMap.containPixel('grid', pointInPixel)) {
|
|
|
+ let yIndex = that.rtuWarnCountMap.convertFromPixel({ seriesIndex: 0 }, [p.offsetX, p.offsetY])[1];
|
|
|
+ let name = that.rtuWarnCountOption.yAxis.data[yIndex];
|
|
|
+ let value = that.rtuWarnCountOption.series[0].data[yIndex].value;
|
|
|
+ if (name === '异常测站总数') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.warninglistDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["warninglist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '离线') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.offlineWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["offlinewarnlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '时钟异常') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.clockWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["clockwarnlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '雨量站小时报漏报') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.rainHourmissoutWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["rainHourmissoutWarnList"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '水位站小时报漏报') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.riverHourmissoutWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["riverHourmissoutWarnList"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '5分钟上报延时') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.minupdelayWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["minupdelaywarnlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '雨量站小时报上报延时') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.rainHourupdelayWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["rainhourupdelaywarnlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '水位站小时报上报延时') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.riverHourupdelayWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["riverhourupdelaywarnlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ } else if (name === '疑似异常值') {
|
|
|
+ if (value > 0) {
|
|
|
+ that.outlterValueWarnListDig = true;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$refs["outlitervaluewarnlist"].init();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.$message.warning("暂无异常数据");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.loadData();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ beforeDestroy() {
|
|
|
+ console.log("beforeDestroy ++++++++++++++++++++");
|
|
|
+ // this.closeSocket();
|
|
|
+ if (this.timer != null) {
|
|
|
+ console.log("clear timer ++++++++++++++ ")
|
|
|
+ clearInterval(this.timer);
|
|
|
+ this.timer = null;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ loadData() {
|
|
|
+ this.getCountData();
|
|
|
+ if (this.timer == null) {
|
|
|
+ this.timer = setInterval(this.timeCall, 10000);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.loading = true;
|
|
|
+ getWarnCountList().then((res) => {
|
|
|
+ this.data = res.data.data;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ timeCall() {
|
|
|
+ console.log("time ++++++++++++++++++++");
|
|
|
+ this.getCountData();
|
|
|
+ this.getWarnCountList().then((res) => {
|
|
|
+ this.data = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.dialog = false;
|
|
|
+ },
|
|
|
+ cellClick(row, column, cell, event) {
|
|
|
+ if (event.isTrusted) {
|
|
|
+ if (column.label === '测站离线') {
|
|
|
+ if (row.warnOffline) {
|
|
|
+ this.deptId = row.deptId;
|
|
|
+ this.offlineWarnListDig = true;
|
|
|
+ console.log("warn offline " + this.deptId)
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["offlinewarnlist"].init();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else if (column.label === '小时报漏报') {
|
|
|
+ if (row.warnMissOut) {
|
|
|
+ this.deptId = row.deptId;
|
|
|
+ this.hourmissoutWarnListDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["hourmissoutwarnlist"].init();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else if (column.label === '5分钟上报延时') {
|
|
|
+ if (row.warnUpMinDelay) {
|
|
|
+ this.deptId = row.deptId;
|
|
|
+ this.minupdelayWarnListDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["minupdelaywarnlist"].init();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else if (column.label === '小时上报延时') {
|
|
|
+ if (row.warnUpHourDelay) {
|
|
|
+ this.deptId = row.deptId;
|
|
|
+ this.hourupdelayWarnListDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["hourupdelaywarnlist"].init();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ openMoreTodayOrderProcess() {
|
|
|
+ this.moreTodayOrderProcessDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["todaycheckorderprocesslist"].init();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ openMoreTodayInspectionReport() {
|
|
|
+ this.moreTodayInspectionReportDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["todaynspectionrportlist"].init();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ openMoreNotice() {
|
|
|
+ this.moreNoticeDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["todaynoticelist"].init();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ openCheckOrderReportDetail(item) {
|
|
|
+ this.checkOrderReportId = item.orderId;
|
|
|
+ this.checkorderprocessdetailDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["checkorderprocessdetail"].init();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ openInspectionReportDetail(item) {
|
|
|
+ this.inspectionReportId = item.id;
|
|
|
+ this.inspectionreportdetailDig = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs["inspectionreportdetail"].init();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ downloadApk() {
|
|
|
+ if (this.appinfo.apkUrl !== '') {
|
|
|
+ window.open(this.appinfo.apkUrl);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getCountData() {
|
|
|
+ getRtuStatusCountData().then((res) => {
|
|
|
+ console.log("status count " + JSON.stringify(res.data))
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ let data = res.data.data;
|
|
|
+ let num = new Number((data.rtus - data.warningRtus) / data.rtus * 100);
|
|
|
+ this.rtuInfoCountPieOption.series[0].data[0].value = data.rtus - data.warningRtus;
|
|
|
+ this.rtuInfoCountPieOption.series[0].data[0].percent = num.toFixed(2);
|
|
|
+ num = new Number(data.offlineRtus / data.rtus * 100);
|
|
|
+ this.rtuInfoCountPieOption.series[0].data[1].value = data.offlineRtus;
|
|
|
+ this.rtuInfoCountPieOption.series[0].data[1].percent = num.toFixed(2);
|
|
|
+ num = new Number((data.warningRtus - data.offlineRtus) / data.rtus * 100);
|
|
|
+ this.rtuInfoCountPieOption.series[0].data[0].value = data.warningRtus - data.offlineRtus;
|
|
|
+ this.rtuInfoCountPieOption.series[0].data[0].percent = num.toFixed(2);
|
|
|
+ this.rtuInfoCountPieMap.setOption(this.rtuInfoCountPieOption);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ getRtuUpCountData().then((res) => {
|
|
|
+ console.log("up count " + JSON.stringify(res.data))
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ let data = res.data.data;
|
|
|
+ this.rtuDataUpCountOption.series[0].data[2].value = data.rainRtuCount;
|
|
|
+ this.rtuDataUpCountOption.series[0].data[1].value = data.riverRtuCount;
|
|
|
+ this.rtuDataUpCountOption.series[0].data[0].value = data.groundRtuCount;
|
|
|
+ let num = new Number(data.rainUpDataCount / data.rainRtuCount * 100);
|
|
|
+ this.rtuDataUpCountOption.series[1].data[2].value = data.rainUpDataCount;
|
|
|
+ this.rtuDataUpCountOption.series[1].data[2].percent = num.toFixed(2);
|
|
|
+ num = new Number(data.riverUpDataCount / data.riverRtuCount * 100);
|
|
|
+ this.rtuDataUpCountOption.series[1].data[1].value = data.riverUpDataCount;
|
|
|
+ this.rtuDataUpCountOption.series[1].data[1].percent = num.toFixed(2);
|
|
|
+ num = new Number(data.groundUpDataCount / data.groundRtuCount * 100);
|
|
|
+ this.rtuDataUpCountOption.series[1].data[0].value = data.groundUpDataCount;
|
|
|
+ this.rtuDataUpCountOption.series[1].data[0].percent = num.toFixed(2);
|
|
|
+ this.rtuDataUpCountMap.setOption(this.rtuDataUpCountOption);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ getCheckOrderCountData().then((res) => {
|
|
|
+ console.log("CheckOrder count " + JSON.stringify(res.data))
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ let data = res.data.data;
|
|
|
+ this.checkOrderCountOption.series[0].data[3].value = data.orderCount;
|
|
|
+ let num = new Number((data.orderCount - data.unconfirmOrderCount) / data.orderCount * 100);
|
|
|
+ this.checkOrderCountOption.series[0].data[2].value = data.orderCount - data.unconfirmOrderCount;
|
|
|
+ this.checkOrderCountOption.series[0].data[2].percent = num.toFixed(2);
|
|
|
+ num = new Number(data.unconfirmOrderCount / data.orderCount * 100);
|
|
|
+ this.checkOrderCountOption.series[0].data[1].value = data.unconfirmOrderCount;
|
|
|
+ this.checkOrderCountOption.series[0].data[1].percent = num.toFixed(2);
|
|
|
+ num = new Number(data.delayComfireOrders / data.orderCount * 100);
|
|
|
+ this.checkOrderCountOption.series[0].data[0].value = data.delayComfireOrders;
|
|
|
+ this.checkOrderCountOption.series[0].data[0].percent = num.toFixed(2);
|
|
|
+ this.checkOrderMap.setOption(this.checkOrderCountOption);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ getInspectionReportCountData().then((res) => {
|
|
|
+ console.log("InspectionReport count " + JSON.stringify(res.data))
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ let data = res.data.data;
|
|
|
+ this.equipmentInspectionCountOption.series[0].data[3].value = data.equipmentInspectionCount;
|
|
|
+ let num = new Number(data.equipmentInspectionBeforeRainReports / data.equipmentInspectionCount * 100);
|
|
|
+ this.equipmentInspectionCountOption.series[0].data[2].value = data.equipmentInspectionBeforeRainReports;
|
|
|
+ this.equipmentInspectionCountOption.series[0].data[2].percent = num.toFixed(2);
|
|
|
+ num = new Number(data.equipmentInspectionRainFirstReports / data.equipmentInspectionCount * 100);
|
|
|
+ this.equipmentInspectionCountOption.series[0].data[1].value = data.equipmentInspectionRainFirstReports;
|
|
|
+ this.equipmentInspectionCountOption.series[0].data[1].percent = num.toFixed(2);
|
|
|
+ num = new Number(data.equipmentInspectionRainSecondReports / data.equipmentInspectionCount * 100);
|
|
|
+ this.equipmentInspectionCountOption.series[0].data[0].value = data.equipmentInspectionRainSecondReports;
|
|
|
+ this.equipmentInspectionCountOption.series[0].data[0].percent = num.toFixed(2);
|
|
|
+ this.equipmentInspectionChartMap.setOption(this.equipmentInspectionCountOption);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ getWarnKindCountData().then((res) => {
|
|
|
+ console.log("warn kind count " + JSON.stringify(res.data))
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ let data = res.data.data;
|
|
|
+ this.rtuWarnCountOption.series[0].data[8].value = data.warnRtus;
|
|
|
+
|
|
|
+ let num = new Number(data.offlineRtus / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[7].value = data.offlineRtus;
|
|
|
+ this.rtuWarnCountOption.series[0].data[7].percent = num.toFixed(2);
|
|
|
+
|
|
|
+ num = new Number(data.clockWarn / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[6].value = data.clockWarn;
|
|
|
+ this.rtuWarnCountOption.series[0].data[6].percent = num.toFixed(2);
|
|
|
+
|
|
|
+ num = new Number(data.rainUpMissOut / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[5].value = data.rainUpMissOut;
|
|
|
+ this.rtuWarnCountOption.series[0].data[5].percent = num.toFixed(2);
|
|
|
+
|
|
|
+ num = new Number(data.riverUpMissOut / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[4].value = data.riverUpMissOut;
|
|
|
+ this.rtuWarnCountOption.series[0].data[4].percent = num.toFixed(2);
|
|
|
+
|
|
|
+
|
|
|
+ num = new Number(data.minUpDelay / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[3].value = data.minUpDelay;
|
|
|
+ this.rtuWarnCountOption.series[0].data[3].percent = num.toFixed(2);
|
|
|
+
|
|
|
+
|
|
|
+ num = new Number(data.rainHourUpDelay / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[2].value = data.rainHourUpDelay;
|
|
|
+ this.rtuWarnCountOption.series[0].data[2].percent = num.toFixed(2);
|
|
|
+
|
|
|
+ num = new Number(data.riverHourUpDelay / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[1].value = data.riverHourUpDelay;
|
|
|
+ this.rtuWarnCountOption.series[0].data[1].percent = num.toFixed(2);
|
|
|
+
|
|
|
+ num = new Number(data.outlierValue / data.warnRtus * 100);
|
|
|
+ this.rtuWarnCountOption.series[0].data[0].value = data.outlierValue;
|
|
|
+ this.rtuWarnCountOption.series[0].data[0].percent = num.toFixed(2);
|
|
|
+
|
|
|
+ this.rtuWarnCountMap.setOption(this.rtuWarnCountOption);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ todayOrderProcessList().then((res) => {
|
|
|
+ this.todayOrderList = [];
|
|
|
+ let showCount = 3;
|
|
|
+ if (this.adminPageStyle) {
|
|
|
+ showCount = 1;
|
|
|
+ }
|
|
|
+ for (let i = 0; i < showCount && i < res.data.data.length; i++) {
|
|
|
+ this.todayOrderList.push(res.data.data[i]);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ todayInspectionReportList().then((res) => {
|
|
|
+ this.todayInspectionReportList = [];
|
|
|
+ let showCount = 3;
|
|
|
+ if (this.adminPageStyle) {
|
|
|
+ showCount = 1;
|
|
|
+ }
|
|
|
+ for (let i = 0; i < showCount && i < res.data.data.length; i++) {
|
|
|
+ this.todayInspectionReportList.push(res.data.data[i]);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ getLastList(1).then((res) => {
|
|
|
+ this.noticeList = [];
|
|
|
+ this.noticeList = res.data.data;
|
|
|
+ });
|
|
|
+ getAppInfo().then((res) => {
|
|
|
+ console.log(JSON.stringify(res.data.data))
|
|
|
+ this.appinfo = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ changeState(state) {
|
|
|
+ this.state = state;
|
|
|
+ if (state != 5) {
|
|
|
+ if (this.timer) clearInterval(this.timer);
|
|
|
+ this.timer = setInterval(() => {
|
|
|
+ this.second++;
|
|
|
+ }, 1000);
|
|
|
+ } else {
|
|
|
+ if (this.timer) {
|
|
|
+ clearInterval(this.timer);
|
|
|
+ }
|
|
|
+ this.second = 0;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ confirm() {
|
|
|
+ // let arr = this.layout.map((e) => {
|
|
|
+ // return {
|
|
|
+ // x: e.x,
|
|
|
+ // y: e.y,
|
|
|
+ // width: e.w,
|
|
|
+ // height: e.h,
|
|
|
+ // isShow: e.isShow,
|
|
|
+ // moduleName: e.i,
|
|
|
+ // moduleCode: e.i,
|
|
|
+ // };
|
|
|
+ // });
|
|
|
+ // let params = {
|
|
|
+ // layoutId: "",
|
|
|
+ // homeLayoutDetailEntityList: arr,
|
|
|
+ // };
|
|
|
+ // insertCustom(params).then((res) => {});
|
|
|
+ // this.cache = [...this.layout];
|
|
|
+ // this.editSw = false;
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 建立websocket连接
|
|
|
+ */
|
|
|
+ // initWebsocket: function () {
|
|
|
+ // console.log("WebSocket 准备建立连接");
|
|
|
+ // const socket = new SockJS("/api/galaxy-yjjcpt/ws");
|
|
|
+ // this.stompClient = Stomp.over(socket);
|
|
|
+ // this.stompClient.connect({}, this.onConnected, this.onError);
|
|
|
+ // },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 连接成功: 订阅服务器的地址。为了浏览器可以接收到消息,必须先订阅服务器的地址
|
|
|
+ */
|
|
|
+ // onConnected: function () {
|
|
|
+ // console.log("WebSocket 连接成功");
|
|
|
+
|
|
|
+ // // 设置心跳发送接受频率(ms)默认为10000ms。 heart-beating是利用window.setInterval()去规律地发送heart-beats或者检查服务端的heart-beats。
|
|
|
+ // this.stompClient.heartbeat.outgoing = 10000;
|
|
|
+ // this.stompClient.heartbeat.incoming = 0;
|
|
|
+
|
|
|
+ // // 订阅
|
|
|
+ // this.stompClient.subscribe("/topic/event", this.onMessageReceived);
|
|
|
+ // },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 连接失败
|
|
|
+ */
|
|
|
+ // onError: function (error) {
|
|
|
+ // console.log("WebSocket 连接失败", error);
|
|
|
+ // },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 接收消息
|
|
|
+ */
|
|
|
+ // onMessageReceived: function (res) {
|
|
|
+ // console.log(res.body);
|
|
|
+
|
|
|
+ // console.log("WebSocket 接收消息-----------------------------------");
|
|
|
+ // },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 发送消息
|
|
|
+ */
|
|
|
+ // sendMessage: function () {
|
|
|
+ // const chatMessage = {
|
|
|
+ // sender: "",
|
|
|
+ // content: "",
|
|
|
+ // type: "CHAT",
|
|
|
+ // };
|
|
|
+ // this.stompClient.send(
|
|
|
+ // "/app/chat.sendMessage",
|
|
|
+ // {},
|
|
|
+ // JSON.stringify(chatMessage)
|
|
|
+ // );
|
|
|
+ // },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 关闭websocket连接
|
|
|
+ */
|
|
|
+ // closeSocket: function () {
|
|
|
+ // if (this.stompClient != null) {
|
|
|
+ // // this.stompClient.disconnect();
|
|
|
+ // this.stompClient.disconnect(() => {
|
|
|
+ // console.log("连接关闭");
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+.box-card {
|
|
|
+ width: 100%;
|
|
|
+ height: 220px;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.box-high-card {
|
|
|
+ width: 100%;
|
|
|
+ height: 500px;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.box-small-card {
|
|
|
+ width: 100%;
|
|
|
+ height: 235px;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.box-card-news {
|
|
|
+ width: 100%;
|
|
|
+ height: 235px;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.box-card-apk {
|
|
|
+ width: 100%;
|
|
|
+ height: 235px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-row {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-col {
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
+
|
|
|
+.bg-purple-dark {
|
|
|
+ background: #99a9bf;
|
|
|
+}
|
|
|
+
|
|
|
+.bg-purple {
|
|
|
+ background: #d3dce6;
|
|
|
+}
|
|
|
+
|
|
|
+.bg-purple-light {
|
|
|
+ background: #e5e9f2;
|
|
|
+}
|
|
|
+
|
|
|
+.grid-content {
|
|
|
+ border-radius: 4px;
|
|
|
+ min-height: 36px;
|
|
|
+}
|
|
|
+
|
|
|
+.row-bg {
|
|
|
+ padding: 10px 0;
|
|
|
+ background-color: #f9fafc;
|
|
|
+}
|
|
|
+
|
|
|
+.list-item {
|
|
|
+ padding-top: 5px;
|
|
|
+ padding-left: 2px;
|
|
|
+ border-width: thin;
|
|
|
+ border-bottom-style: solid;
|
|
|
+ border-bottom-color: lightgray;
|
|
|
+}
|
|
|
+
|
|
|
+.notice-item {
|
|
|
+ padding-top: 5px;
|
|
|
+ padding-left: 2px;
|
|
|
+ border-width: thin;
|
|
|
+ border-bottom-style: solid;
|
|
|
+ border-bottom-color: lightgray;
|
|
|
+}
|
|
|
+
|
|
|
+.notice-time {
|
|
|
+ font-size: 0.8rem;
|
|
|
+ color: gray;
|
|
|
+}
|
|
|
+
|
|
|
+.notice-content {
|
|
|
+ font-size: 0.9rem;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+}
|
|
|
+</style>
|