755 lines
28 KiB
Vue
755 lines
28 KiB
Vue
|
<template>
|
|||
|
|
<div class="dialog_body">
|
|||
|
|
<div class="top">
|
|||
|
|
<div class="top_left">
|
|||
|
|
<div class="title">
|
|||
|
|
<div>{{ pd.MAJORDANGERSOURCE_NUMBER }}{{ pd.MAJORDANGERSOURCE_NAME }}</div>
|
|||
|
|
<div>{{ pd.MAJORDANGERSOURCE_TYPE_NAME }}</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="img">
|
|||
|
|
<img :src="imgUrl">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="top_center">
|
|||
|
|
<table>
|
|||
|
|
<tr>
|
|||
|
|
<td/>
|
|||
|
|
<td>当前值</td>
|
|||
|
|
<td>低预警值</td>
|
|||
|
|
<td>高预警值</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td>液位</td>
|
|||
|
|
<td>{{ pd.STORAGETANK_LIQUIDLEVEL }}</td>
|
|||
|
|
<td>{{ pd.LIQUIDLEVEL_RANGEMIN }}</td>
|
|||
|
|
<td>{{ pd.LIQUIDLEVEL_RANGEMAX }}</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<td>温度</td>
|
|||
|
|
<td>{{ pd.STORAGETANK_TEMPERATURE }}</td>
|
|||
|
|
<td>{{ pd.TEMPERATURE_RANGEMIN }}</td>
|
|||
|
|
<td>{{ pd.TEMPERATURE_RANGEMAX }}</td>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<div class="liquid-btns"/>
|
|||
|
|
</div>
|
|||
|
|
<div class="center">
|
|||
|
|
<line-chart id="main4" ref="CHART_LIQUIDLEVEL" :chart-data="chartData.LIQUIDLEVEL" />
|
|||
|
|
</div>
|
|||
|
|
<div class="center">
|
|||
|
|
<line-chart id="main5" ref="CHART_TEMPERATURE" :chart-data="chartData.TEMPERATURE" />
|
|||
|
|
</div>
|
|||
|
|
<div class="bottom">
|
|||
|
|
<div class="tabs">
|
|||
|
|
<div v-for="item in tabs" :class="['tab',{active:item === tabName}]" :key="item" @click="changeTab(item)">
|
|||
|
|
{{ item }}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<table>
|
|||
|
|
<tr>
|
|||
|
|
<td>油罐编号</td>
|
|||
|
|
<td>数据日期</td>
|
|||
|
|
<td>数据时间</td>
|
|||
|
|
<td>存储介质</td>
|
|||
|
|
<td>数值</td>
|
|||
|
|
</tr>
|
|||
|
|
<template v-if="logList.length !== 0">
|
|||
|
|
<tr v-for="(item,index) in logList" :key="index">
|
|||
|
|
<td>{{ pd.MAJORDANGERSOURCE_NUMBER }}</td>
|
|||
|
|
<td>{{ item['STORAGETANK' + pd.MAJORDANGERSOURCE_STORAGETANK + '_OPERATTIME'].substr(0, 10) }}</td>
|
|||
|
|
<td>{{ item['STORAGETANK' + pd.MAJORDANGERSOURCE_STORAGETANK + '_OPERATTIME'].substr(11) }}</td>
|
|||
|
|
<td v-if="['1#','2#','3#','4#','5#','6#','7#','8#','9#'].indexOf(pd.MAJORDANGERSOURCE_NUMBER)>-1">原油</td>
|
|||
|
|
<td v-if="['51#','52#','53#','54#'].indexOf(pd.MAJORDANGERSOURCE_NUMBER)>-1">成品油</td>
|
|||
|
|
<td v-if="['1#','2#','3#','4#','5#','6#','7#','8#','9#','51#','52#','53#','54#'].indexOf(pd.MAJORDANGERSOURCE_NUMBER)===-1">存储介质</td>
|
|||
|
|
<td v-show="tabName === '液位'">{{ item['STORAGETANK' + pd.MAJORDANGERSOURCE_STORAGETANK + '_LIQUIDLEVEL'] }}</td>
|
|||
|
|
<td v-show="tabName === '温度'">{{ item['STORAGETANK' + pd.MAJORDANGERSOURCE_STORAGETANK + '_TEMPERATURE'] }}</td>
|
|||
|
|
</tr>
|
|||
|
|
</template>
|
|||
|
|
<template v-else>
|
|||
|
|
<tr>
|
|||
|
|
<td colspan="5" style="text-align: center">暂无数据</td>
|
|||
|
|
</tr>
|
|||
|
|
</template>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { requestFN } from '@/utils/request'
|
|||
|
|
import LineChart from '../../echarts/linechartBI'
|
|||
|
|
import { upload } from '@/utils/upload'
|
|||
|
|
|
|||
|
|
const lineChartData = {
|
|||
|
|
LIQUIDLEVEL: {
|
|||
|
|
dataX: ['15:14:00', '15:14:05', '15:14:10', '15:14:15', '15:14:20'],
|
|||
|
|
legend: ['液位'],
|
|||
|
|
color: ['#3888FA'],
|
|||
|
|
dataY: [[13.172, 13.171, 13.173, 13.171, 13.175]]
|
|||
|
|
},
|
|||
|
|
TEMPERATURE: {
|
|||
|
|
dataX: ['15:14:00', '15:14:05', '15:14:10', '15:14:15', '15:14:20'],
|
|||
|
|
legend: ['温度'],
|
|||
|
|
color: ['#3888FA'],
|
|||
|
|
dataY: [[26.6, 26.3, 26.5, 26.6, 26.2]]
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
LineChart
|
|||
|
|
},
|
|||
|
|
props: {
|
|||
|
|
id: {
|
|||
|
|
type: String,
|
|||
|
|
default() {
|
|||
|
|
return ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
type: {
|
|||
|
|
type: String,
|
|||
|
|
default() {
|
|||
|
|
return ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
gangkou: {
|
|||
|
|
type: String,
|
|||
|
|
default: ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
tabs: ['液位', '温度'],
|
|||
|
|
tabName: '液位',
|
|||
|
|
chartData: lineChartData,
|
|||
|
|
listLoading: true,
|
|||
|
|
activeName: 'first',
|
|||
|
|
imgUrl: require('@/assets/images/tanks.png'),
|
|||
|
|
pd: {
|
|||
|
|
MAJORDANGERSOURCE_NAME: '', // 重大危险源名称
|
|||
|
|
MAJORDANGERSOURCE_TYPE_NAME: '', // 重大危险源类型
|
|||
|
|
MAJORDANGERSOURCE_ADDRESS: '', // 重大危险源地址
|
|||
|
|
MAJORDANGERSOURCE_LONGITUDE: '', // 重大危险源位置经度
|
|||
|
|
MAJORDANGERSOURCE_LATITUDE: '', // 重大危险源位置纬度
|
|||
|
|
MAJORDANGERSOURCE_NUMBER: '', // 重大危险源编号
|
|||
|
|
USE_DATE: '', // 投入使用日期
|
|||
|
|
DECLARATION_LEVEL_NAME: '', // 申报等级
|
|||
|
|
STORAGE_ACTUAL: '', // 实际储存量
|
|||
|
|
STORAGE_MAX: '', // 最大储量
|
|||
|
|
CONTROL_MEASURES: '', // 管控措施
|
|||
|
|
BRANCHEMERGENCYPLAN_NAME: '', // 分公司应急预案名称
|
|||
|
|
BRANCHEMERGENCYPLAN_FILEPATH: '', // 分公司应急预案文件
|
|||
|
|
RESPONSIBLE_PERSON_NAME: '', // 责任人姓名
|
|||
|
|
RESPONSIBLE_PERSON_PHONE: ''// 联系方式
|
|||
|
|
},
|
|||
|
|
storageTankData: {}, // 监测数据
|
|||
|
|
hasDisposal: false,
|
|||
|
|
disposalNew: { // 报警信息（待创建）
|
|||
|
|
MAJORDANGERSOURCE_ID: this.id,
|
|||
|
|
ALARM_TYPE: '', // 报警类型
|
|||
|
|
ALARM_VALUE: '', // 报警值
|
|||
|
|
ALARM_LEVEL: '', // 报警级别（1.一级 2.二级 3.三级 4.四级）
|
|||
|
|
ALARM_RANGE_MIN: '', // 报警阈值下限
|
|||
|
|
ALARM_RANGE_MAX: '' // 报警阈值上限
|
|||
|
|
},
|
|||
|
|
ALARM_TYPE_List: [], // 数据字典
|
|||
|
|
ALARM_LEVEL_List: [{ VALUE: '1', NAME: '一级' }, { VALUE: '2', NAME: '二级' }, { VALUE: '3', NAME: '三级' }, { VALUE: '4', NAME: '四级' }],
|
|||
|
|
disposal: { // 报警信息
|
|||
|
|
MAJORDANGERSOURCE_DISPOSAL_ID: '',
|
|||
|
|
MAJORDANGERSOURCE_ID: this.id,
|
|||
|
|
ALARM_TYPE: '', // 报警类型
|
|||
|
|
ALARM_VALUE: '', // 报警值
|
|||
|
|
ALARM_LEVEL: '', // 报警级别（1.一级 2.二级 3.三级 4.四级）
|
|||
|
|
ALARM_RANGE_MIN: '', // 报警阈值下限
|
|||
|
|
ALARM_RANGE_MAX: '', // 报警阈值上限
|
|||
|
|
DISPOSAL_TIME: '', // 处置生成时间
|
|||
|
|
DISPOSAL_PERSON: '', // 处置人
|
|||
|
|
DISPOSAL_METHOD: '', // 处置方式
|
|||
|
|
DISPOSAL_DESC: '', // 处置描述
|
|||
|
|
DISPOSAL_TIME_OVER: '', // 处置完成时间
|
|||
|
|
disposalBeforeFile: [], // 处置前照片
|
|||
|
|
disposalAfterFile: [] // 处置后照片
|
|||
|
|
},
|
|||
|
|
dialogFormEdit: false,
|
|||
|
|
dialogImageUrl: '',
|
|||
|
|
dialogVisible: false,
|
|||
|
|
rules: {
|
|||
|
|
ALARM_TYPE: [{ required: true, message: '请选择报警类型', trigger: 'blur' }],
|
|||
|
|
ALARM_VALUE: [{ required: true, message: '报警值不能为空', trigger: 'blur' }],
|
|||
|
|
ALARM_LEVEL: [{ required: true, message: '报警级别（1.一级 2.二级 3.三级 4.四级）不能为空', trigger: 'blur' }],
|
|||
|
|
ALARM_RANGE_MIN: [{ required: true, message: '报警阈值下限不能为空', trigger: 'blur' }],
|
|||
|
|
ALARM_RANGE_MAX: [{ required: true, message: '报警阈值上限不能为空', trigger: 'blur' }]
|
|||
|
|
},
|
|||
|
|
total: 0,
|
|||
|
|
logList: [],
|
|||
|
|
timer: null,
|
|||
|
|
msg: null
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
created() {
|
|||
|
|
this.getDict()
|
|||
|
|
this.getData()
|
|||
|
|
},
|
|||
|
|
beforeDestroy() {
|
|||
|
|
if (this.timer) {
|
|||
|
|
clearInterval(this.timer)
|
|||
|
|
this.timer = null
|
|||
|
|
}
|
|||
|
|
if (this.msg) {
|
|||
|
|
this.msg.close()
|
|||
|
|
this.msg = null
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
changeTab(tabName) {
|
|||
|
|
this.tabName = tabName
|
|||
|
|
},
|
|||
|
|
getData() {
|
|||
|
|
requestFN(
|
|||
|
|
'/homemajor/getMajordangersourceInfo',
|
|||
|
|
{
|
|||
|
|
MAJORDANGERSOURCE_ID: this.id,
|
|||
|
|
GANGKOU: this.gangkou
|
|||
|
|
}
|
|||
|
|
).then((data) => {
|
|||
|
|
this.pd = Object.assign({}, data.pd) // copy obj
|
|||
|
|
this.getStorageTankData()
|
|||
|
|
this.getStorageTankLogList()
|
|||
|
|
this.listLoading = false
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
handleClick(tab, event) {
|
|||
|
|
console.log(tab, event)
|
|||
|
|
},
|
|||
|
|
cancleDisposal() {
|
|||
|
|
this.dialogFormEdit = false
|
|||
|
|
this.timer = setInterval(this.handleTimerOperation, 5000)
|
|||
|
|
},
|
|||
|
|
handleDisposal() {
|
|||
|
|
// console.info(this.disposal)
|
|||
|
|
this.rules.DISPOSAL_PERSON = [{ required: true, message: '处置人不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_METHOD = [{ required: true, message: '处置方式不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_DESC = [{ required: true, message: '处置描述不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_TIME_OVER = [{ required: true, message: '请选择处置完成时间', trigger: 'blur' }]
|
|||
|
|
this.dialogFormEdit = true
|
|||
|
|
if (this.timer) {
|
|||
|
|
clearInterval(this.timer)
|
|||
|
|
this.timer = null
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
handlePicturePreview(file) {
|
|||
|
|
this.dialogImageUrl = file.url
|
|||
|
|
this.dialogVisible = true
|
|||
|
|
},
|
|||
|
|
handleBeforeUploadDisposalBefore(file) {
|
|||
|
|
const types = ['image/jpeg', 'image/jpg', 'image/png']
|
|||
|
|
const isImage = types.includes(file.type)
|
|||
|
|
if (!isImage) {
|
|||
|
|
this.$message.error('上传图片只能是 JPG、JPEG、PNG 格式!')
|
|||
|
|
return false
|
|||
|
|
} else {
|
|||
|
|
this.disposal.disposalBeforeFile.push(file)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
handleBeforeUploadDisposalAfter(file) {
|
|||
|
|
const types = ['image/jpeg', 'image/jpg', 'image/png']
|
|||
|
|
const isImage = types.includes(file.type)
|
|||
|
|
if (!isImage) {
|
|||
|
|
this.$message.error('上传图片只能是 JPG、JPEG、PNG 格式!')
|
|||
|
|
return false
|
|||
|
|
} else {
|
|||
|
|
this.disposal.disposalAfterFile.push(file)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 保存
|
|||
|
|
confirm(methodName) {
|
|||
|
|
if (methodName == 'add') {
|
|||
|
|
this.rules.DISPOSAL_PERSON = [{ required: false, message: '处置人不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_METHOD = [{ required: false, message: '处置方式不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_DESC = [{ required: false, message: '处置描述不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_TIME_OVER = [{ required: false, message: '请选择处置完成时间', trigger: 'blur' }]
|
|||
|
|
|
|||
|
|
this.listLoading = true
|
|||
|
|
requestFN(
|
|||
|
|
'/majordangersourcedisposal/' + methodName,
|
|||
|
|
this.disposal
|
|||
|
|
).then((data) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID = data.pd.MAJORDANGERSOURCE_DISPOSAL_ID
|
|||
|
|
this.disposal.DISPOSAL_TIME = data.pd.DISPOSAL_TIME
|
|||
|
|
console.info(this.disposal)
|
|||
|
|
// this.dialogFormEdit = false
|
|||
|
|
// this.hasDisposal = false
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
})
|
|||
|
|
} else if (methodName == 'up') {
|
|||
|
|
this.rules.DISPOSAL_PERSON = [{ required: false, message: '处置人不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_METHOD = [{ required: false, message: '处置方式不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_DESC = [{ required: false, message: '处置描述不能为空', trigger: 'blur' }]
|
|||
|
|
this.rules.DISPOSAL_TIME_OVER = [{ required: false, message: '请选择处置完成时间', trigger: 'blur' }]
|
|||
|
|
|
|||
|
|
this.listLoading = true
|
|||
|
|
requestFN(
|
|||
|
|
'/majordangersourcedisposal/' + methodName,
|
|||
|
|
this.disposal
|
|||
|
|
).then((data) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID = data.pd.MAJORDANGERSOURCE_DISPOSAL_ID
|
|||
|
|
this.disposal.DISPOSAL_TIME = data.pd.DISPOSAL_TIME
|
|||
|
|
// this.dialogFormEdit = false
|
|||
|
|
// this.hasDisposal = false
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
this.$refs.form.validate(valid => {
|
|||
|
|
if (valid) {
|
|||
|
|
if (this.$refs.disposalBeforeUpload.uploadFiles.length < 1) {
|
|||
|
|
this.$message({
|
|||
|
|
message: '请上传处置前照片',
|
|||
|
|
type: 'error'
|
|||
|
|
})
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
if (this.$refs.disposalAfterUpload.uploadFiles.length < 1) {
|
|||
|
|
this.$message({
|
|||
|
|
message: '请上传处置后照片',
|
|||
|
|
type: 'error'
|
|||
|
|
})
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
this.uploadDisposalBeforeFile()
|
|||
|
|
this.uploadDisposalAfterFile()
|
|||
|
|
this.listLoading = true
|
|||
|
|
this.disposal.DISPOSAL_STATUS = '1'
|
|||
|
|
console.info(this.disposal)
|
|||
|
|
requestFN(
|
|||
|
|
'/majordangersourcedisposal/' + methodName,
|
|||
|
|
this.disposal
|
|||
|
|
).then((data) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
this.dialogFormEdit = false
|
|||
|
|
this.hasDisposal = false
|
|||
|
|
this.resetDisposal()
|
|||
|
|
console.info(this.disposal)
|
|||
|
|
this.timer = setInterval(this.handleTimerOperation, 5000)
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
uploadDisposalBeforeFile() {
|
|||
|
|
this.$refs.disposalBeforeUpload.submit()
|
|||
|
|
const formData = new FormData()
|
|||
|
|
for (var i = 0; i < this.disposal.disposalBeforeFile.length; i++) {
|
|||
|
|
if (this.disposal.disposalBeforeFile[i]) {
|
|||
|
|
formData.append('FFILE', this.disposal.disposalBeforeFile[i])
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// formData.append('FFILE', this.disposal.disposalBeforeFile)
|
|||
|
|
console.info(this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID)
|
|||
|
|
formData.append('FOREIGN_KEY', this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID)
|
|||
|
|
formData.append('TYPE', 20)
|
|||
|
|
this.uploadFileSubmit(formData, '处置前照片上传完成')
|
|||
|
|
},
|
|||
|
|
uploadDisposalAfterFile() {
|
|||
|
|
this.$refs.disposalAfterUpload.submit()
|
|||
|
|
const formData = new FormData()
|
|||
|
|
for (var i = 0; i < this.disposal.disposalAfterFile.length; i++) {
|
|||
|
|
if (this.disposal.disposalAfterFile[i]) {
|
|||
|
|
formData.append('FFILE', this.disposal.disposalAfterFile[i])
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// formData.append('FFILE', this.disposal.disposalAfterFile)
|
|||
|
|
console.info(this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID)
|
|||
|
|
formData.append('FOREIGN_KEY', this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID)
|
|||
|
|
formData.append('TYPE', 21)
|
|||
|
|
this.uploadFileSubmit(formData, '处置后照片上传完成')
|
|||
|
|
},
|
|||
|
|
uploadFileSubmit(formData, str) {
|
|||
|
|
upload(
|
|||
|
|
'/imgfiles/add',
|
|||
|
|
formData
|
|||
|
|
).then((data) => {
|
|||
|
|
console.info(str)
|
|||
|
|
}).catch((e) => {
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
handleTimerOperation() {
|
|||
|
|
this.getStorageTankData()
|
|||
|
|
this.getStorageTankLogList()
|
|||
|
|
},
|
|||
|
|
// 获取监测数据实时数据
|
|||
|
|
getStorageTankData() {
|
|||
|
|
// var _this = this
|
|||
|
|
// storagetank/goEdit
|
|||
|
|
requestFN(
|
|||
|
|
'/homemajor/getStoragetankInfo',
|
|||
|
|
{
|
|||
|
|
MAJORDANGERSOURCE_STORAGETANK_ID: '1'
|
|||
|
|
}
|
|||
|
|
).then((data) => {
|
|||
|
|
this.storageTankData = Object.assign({}, data.pd) // copy obj
|
|||
|
|
const liquidLevel = this.storageTankData['STORAGETANK' + this.pd.MAJORDANGERSOURCE_STORAGETANK + '_LIQUIDLEVEL']
|
|||
|
|
const temperature = this.storageTankData['STORAGETANK' + this.pd.MAJORDANGERSOURCE_STORAGETANK + '_TEMPERATURE']
|
|||
|
|
this.$set(this.pd, 'STORAGETANK_LIQUIDLEVEL', liquidLevel)
|
|||
|
|
this.$set(this.pd, 'STORAGETANK_TEMPERATURE', temperature)
|
|||
|
|
// eslint-disable-next-line no-unused-vars
|
|||
|
|
var ALARM_LEVEL = 10
|
|||
|
|
this.pd.SENSORLIST.forEach(item => {
|
|||
|
|
// eslint-disable-next-line no-constant-condition,no-cond-assign
|
|||
|
|
if (item.MONITORINGDEVICESENSOR_TYPE == 'MONITORINGEQUIPMENTTYPE001') { // 液位
|
|||
|
|
if (Number(item.RANGE1_MIN) <= Number(liquidLevel) && Number(liquidLevel) <= Number(item.RANGE1_MAX)) {
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVELCLASS', 'red')
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMIN', item.RANGE1_MIN)
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMAX', item.RANGE1_MAX)
|
|||
|
|
if (ALARM_LEVEL > 1) {
|
|||
|
|
ALARM_LEVEL = 1
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '1'
|
|||
|
|
}
|
|||
|
|
} else if (Number(item.RANGE2_MIN) <= Number(liquidLevel) && Number(liquidLevel) <= Number(item.RANGE2_MAX)) {
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVELCLASS', 'orange')
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMIN', item.RANGE2_MIN)
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMAX', item.RANGE2_MAX)
|
|||
|
|
if (ALARM_LEVEL > 2) {
|
|||
|
|
ALARM_LEVEL = 2
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '2'
|
|||
|
|
}
|
|||
|
|
} else if (Number(item.RANGE3_MIN) <= Number(liquidLevel) && Number(liquidLevel) <= Number(item.RANGE3_MAX)) {
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVELCLASS', 'yellow')
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMIN', item.RANGE3_MIN)
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMAX', item.RANGE3_MAX)
|
|||
|
|
if (ALARM_LEVEL > 3) {
|
|||
|
|
ALARM_LEVEL = 3
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '3'
|
|||
|
|
}
|
|||
|
|
} else if (Number(item.RANGE4_MIN) <= Number(liquidLevel) && Number(liquidLevel) <= Number(item.RANGE4_MAX)) {
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVELCLASS', 'blue')
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMIN', item.RANGE4_MIN)
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMAX', item.RANGE4_MAX)
|
|||
|
|
if (ALARM_LEVEL > 4) {
|
|||
|
|
ALARM_LEVEL = 4
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '4'
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVELCLASS', 'green')
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMIN', '-')
|
|||
|
|
this.$set(this.pd, 'LIQUIDLEVEL_RANGEMAX', '-')
|
|||
|
|
}
|
|||
|
|
if (ALARM_LEVEL < 10 && this.disposalNew.ALARM_TYPE == item.MONITORINGDEVICESENSOR_TYPE) {
|
|||
|
|
this.disposalNew.ALARM_VALUE = liquidLevel
|
|||
|
|
this.disposalNew.ALARM_RANGE_MIN = this.pd.LIQUIDLEVEL_RANGEMIN
|
|||
|
|
this.disposalNew.ALARM_RANGE_MAX = this.pd.LIQUIDLEVEL_RANGEMAX
|
|||
|
|
}
|
|||
|
|
// eslint-disable-next-line no-constant-condition,no-cond-assign
|
|||
|
|
} else if (item.MONITORINGDEVICESENSOR_TYPE == 'MONITORINGEQUIPMENTTYPE002') { // 温度
|
|||
|
|
if (Number(item.RANGE1_MIN) <= Number(temperature) && Number(temperature) <= Number(item.RANGE1_MAX)) {
|
|||
|
|
this.$set(this.pd, 'TEMPERATURECLASS', 'red')
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMIN', item.RANGE1_MIN)
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMAX', item.RANGE1_MAX)
|
|||
|
|
if (ALARM_LEVEL > 1) {
|
|||
|
|
ALARM_LEVEL = 1
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '1'
|
|||
|
|
}
|
|||
|
|
} else if (Number(item.RANGE2_MIN) <= Number(temperature) && Number(temperature) <= Number(item.RANGE2_MAX)) {
|
|||
|
|
this.$set(this.pd, 'TEMPERATURECLASS', 'orange')
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMIN', item.RANGE2_MIN)
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMAX', item.RANGE2_MAX)
|
|||
|
|
if (ALARM_LEVEL > 2) {
|
|||
|
|
ALARM_LEVEL = 2
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '2'
|
|||
|
|
}
|
|||
|
|
} else if (Number(item.RANGE3_MIN) <= Number(temperature) && Number(temperature) <= Number(item.RANGE3_MAX)) {
|
|||
|
|
this.$set(this.pd, 'TEMPERATURECLASS', 'yellow')
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMIN', item.RANGE3_MIN)
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMAX', item.RANGE3_MAX)
|
|||
|
|
if (ALARM_LEVEL > 3) {
|
|||
|
|
ALARM_LEVEL = 3
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '3'
|
|||
|
|
}
|
|||
|
|
} else if (Number(item.RANGE4_MIN) <= Number(temperature) && Number(temperature) <= Number(item.RANGE4_MAX)) {
|
|||
|
|
this.$set(this.pd, 'TEMPERATURECLASS', 'blue')
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMIN', item.RANGE4_MIN)
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMAX', item.RANGE4_MAX)
|
|||
|
|
if (ALARM_LEVEL > 4) {
|
|||
|
|
ALARM_LEVEL = 4
|
|||
|
|
this.disposalNew.ALARM_TYPE = item.MONITORINGDEVICESENSOR_TYPE
|
|||
|
|
this.disposalNew.ALARM_LEVEL = '4'
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this.$set(this.pd, 'TEMPERATURECLASS', 'green')
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMIN', '-')
|
|||
|
|
this.$set(this.pd, 'TEMPERATURE_RANGEMAX', '-')
|
|||
|
|
}
|
|||
|
|
if (ALARM_LEVEL < 10 && this.disposalNew.ALARM_TYPE == item.MONITORINGDEVICESENSOR_TYPE) {
|
|||
|
|
this.disposalNew.ALARM_VALUE = temperature
|
|||
|
|
this.disposalNew.ALARM_RANGE_MIN = this.pd.TEMPERATURE_RANGEMIN
|
|||
|
|
this.disposalNew.ALARM_RANGE_MAX = this.pd.TEMPERATURE_RANGEMAX
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
// this.getDisplsal(_this)
|
|||
|
|
this.listLoading = false
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 获取最新的有效报警数据
|
|||
|
|
getDisplsal(_this) {
|
|||
|
|
this.listLoading = true
|
|||
|
|
requestFN(
|
|||
|
|
'/majordangersourcedisposal/findValidateData',
|
|||
|
|
{
|
|||
|
|
MAJORDANGERSOURCE_ID: this.pd.MAJORDANGERSOURCE_ID
|
|||
|
|
}
|
|||
|
|
).then((data) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
_this.disposal = Object.assign(_this.disposal, data.varList.length > 0 ? data.varList[0] : {}) // copy obj
|
|||
|
|
// eslint-disable-next-line one-var
|
|||
|
|
let message = '', type = ''
|
|||
|
|
// 当前监测数据等级 高于 库里linechartBI报警数据等级，升级报警信息
|
|||
|
|
if (_this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID &&
|
|||
|
|
Number(_this.disposal.ALARM_LEVEL) > Number(_this.disposalNew.ALARM_LEVEL == '' ? '10' : _this.disposalNew.ALARM_LEVEL)) {
|
|||
|
|
_this.disposal = Object.assign(_this.disposal, _this.disposalNew)
|
|||
|
|
message = _this.pd.MAJORDANGERSOURCE_NAME + '【' + (_this.disposalNew.ALARM_TYPE == 'MONITORINGEQUIPMENTTYPE001' ? '液位' : '温度') + '】已升级为'
|
|||
|
|
if (_this.disposalNew.ALARM_LEVEL == '1') {
|
|||
|
|
message += '一级'
|
|||
|
|
type = 'error'
|
|||
|
|
} else if (_this.disposalNew.ALARM_LEVEL == '2') {
|
|||
|
|
message += '二级'
|
|||
|
|
type = 'warning'
|
|||
|
|
} else if (_this.disposalNew.ALARM_LEVEL == '3') {
|
|||
|
|
message += '三级'
|
|||
|
|
type = 'warning'
|
|||
|
|
} else if (_this.disposalNew.ALARM_LEVEL == '4') {
|
|||
|
|
message += '四级'
|
|||
|
|
type = 'info'
|
|||
|
|
}
|
|||
|
|
message += '预警，请尽快处理'
|
|||
|
|
// _this.confirm('up')
|
|||
|
|
} else { // 新增报警数据
|
|||
|
|
_this.disposal = Object.assign(_this.disposal, _this.disposalNew)
|
|||
|
|
message = _this.pd.MAJORDANGERSOURCE_NAME + '【' + (_this.disposalNew.ALARM_TYPE == 'MONITORINGEQUIPMENTTYPE001' ? '液位' : '温度') + '】已达'
|
|||
|
|
if (_this.disposalNew.ALARM_LEVEL == '1') {
|
|||
|
|
message += '一级'
|
|||
|
|
type = 'error'
|
|||
|
|
} else if (_this.disposalNew.ALARM_LEVEL == '2') {
|
|||
|
|
message += '二级'
|
|||
|
|
type = 'warning'
|
|||
|
|
} else if (_this.disposalNew.ALARM_LEVEL == '3') {
|
|||
|
|
message += '三级'
|
|||
|
|
type = 'warning'
|
|||
|
|
} else if (_this.disposalNew.ALARM_LEVEL == '4') {
|
|||
|
|
message += '四级'
|
|||
|
|
type = 'info'
|
|||
|
|
}
|
|||
|
|
message += '预警，请尽快处理'
|
|||
|
|
}
|
|||
|
|
if (type) {
|
|||
|
|
if (!_this.disposal.MAJORDANGERSOURCE_DISPOSAL_ID) {
|
|||
|
|
// _this.confirm('add')
|
|||
|
|
}
|
|||
|
|
_this.$set(_this, 'hasDisposal', true)
|
|||
|
|
if (_this.msg) {
|
|||
|
|
_this.msg.close()
|
|||
|
|
_this.msg = null
|
|||
|
|
}
|
|||
|
|
_this.msg = this.$message({
|
|||
|
|
message: message,
|
|||
|
|
type: type,
|
|||
|
|
showClose: false,
|
|||
|
|
duration: 0
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 获取监测数据对接记录（最近30条）
|
|||
|
|
getStorageTankLogList() {
|
|||
|
|
this.listLoading = true
|
|||
|
|
// storagetanklog/list
|
|||
|
|
requestFN(
|
|||
|
|
'/homemajor/listStoragetankLog?showCount=5¤tPage=1',
|
|||
|
|
{
|
|||
|
|
STORAGETANK_OPERATTIME: 'STORAGETANK' + this.pd.MAJORDANGERSOURCE_STORAGETANK + '_OPERATTIME'
|
|||
|
|
}
|
|||
|
|
).then((data) => {
|
|||
|
|
this.logList = data.varList
|
|||
|
|
for (let i = this.logList.length - 1; i >= 0; i--) {
|
|||
|
|
var item = this.logList[i]
|
|||
|
|
var j = this.logList.length - 1 - i
|
|||
|
|
const datatime = item['STORAGETANK' + this.pd.MAJORDANGERSOURCE_STORAGETANK + '_OPERATTIME']
|
|||
|
|
this.chartData.LIQUIDLEVEL.dataX[j] = datatime.length > 11 ? datatime.substr(11) : datatime
|
|||
|
|
this.chartData.TEMPERATURE.dataX[j] = datatime.length > 11 ? datatime.substr(11) : datatime
|
|||
|
|
this.chartData.LIQUIDLEVEL.dataY[0][j] = item['STORAGETANK' + this.pd.MAJORDANGERSOURCE_STORAGETANK + '_LIQUIDLEVEL']
|
|||
|
|
this.chartData.TEMPERATURE.dataY[0][j] = item['STORAGETANK' + this.pd.MAJORDANGERSOURCE_STORAGETANK + '_TEMPERATURE']
|
|||
|
|
}
|
|||
|
|
this.$refs.CHART_LIQUIDLEVEL.renewOption(this.chartData.LIQUIDLEVEL)
|
|||
|
|
this.$refs.CHART_TEMPERATURE.renewOption(this.chartData.TEMPERATURE)
|
|||
|
|
this.listLoading = false
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.listLoading = false
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 查看
|
|||
|
|
goDisposalList() {
|
|||
|
|
this.$parent.activeName = 'DisposalList'
|
|||
|
|
},
|
|||
|
|
// 获取数据字典数据
|
|||
|
|
getDict: function() {
|
|||
|
|
requestFN(
|
|||
|
|
'/dictionariesCorp/getLevels',
|
|||
|
|
{
|
|||
|
|
DICTIONARIES_ID: '6a724d36c3ad416fad22049d932c1987'
|
|||
|
|
}
|
|||
|
|
).then((data) => {
|
|||
|
|
this.ALARM_TYPE_List = data.list
|
|||
|
|
}).catch((e) => {
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
resetDisposal() {
|
|||
|
|
this.disposal = { // 报警信息
|
|||
|
|
MAJORDANGERSOURCE_DISPOSAL_ID: '',
|
|||
|
|
MAJORDANGERSOURCE_ID: this.id,
|
|||
|
|
ALARM_TYPE: '', // 报警类型
|
|||
|
|
ALARM_VALUE: '', // 报警值
|
|||
|
|
ALARM_LEVEL: '', // 报警级别（1.一级 2.二级 3.三级 4.四级）
|
|||
|
|
ALARM_RANGE_MIN: '', // 报警阈值下限
|
|||
|
|
ALARM_RANGE_MAX: '', // 报警阈值上限
|
|||
|
|
DISPOSAL_TIME: '', // 处置生成时间
|
|||
|
|
DISPOSAL_PERSON: '', // 处置人
|
|||
|
|
DISPOSAL_METHOD: '', // 处置方式
|
|||
|
|
DISPOSAL_DESC: '', // 处置描述
|
|||
|
|
DISPOSAL_TIME_OVER: '', // 处置完成时间
|
|||
|
|
disposalBeforeFile: [], // 处置前照片
|
|||
|
|
disposalAfterFile: [] // 处置后照片
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
@mixin table() {
|
|||
|
|
table {
|
|||
|
|
width: 100%;
|
|||
|
|
border-collapse: collapse;
|
|||
|
|
text-align: center;
|
|||
|
|
|
|||
|
|
tr {
|
|||
|
|
td {
|
|||
|
|
width: 20%;
|
|||
|
|
border: 2px solid #b1ccec;
|
|||
|
|
padding: 1.601vh 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.dialog_body {
|
|||
|
|
width: 100%;
|
|||
|
|
|
|||
|
|
.top {
|
|||
|
|
display: flex;
|
|||
|
|
padding-bottom: 1.601vh;
|
|||
|
|
border-bottom: 2px solid #316b8b;
|
|||
|
|
|
|||
|
|
.top_left {
|
|||
|
|
flex-basis: 10%;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
text-align: center;
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
height: 10.672vh;
|
|||
|
|
flex-basis: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.top_center {
|
|||
|
|
flex: 1;
|
|||
|
|
margin-left: 50px;
|
|||
|
|
|
|||
|
|
@include table();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.top_right {
|
|||
|
|
margin-left: 15px;
|
|||
|
|
flex-basis: 15%;
|
|||
|
|
|
|||
|
|
button {
|
|||
|
|
width: 100%;
|
|||
|
|
cursor: pointer;
|
|||
|
|
background-color: rgba(49, 188, 211, 0.7);
|
|||
|
|
color: #fff;
|
|||
|
|
border: none;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
padding: 1.301vh 0;
|
|||
|
|
margin: 0.3vh 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.center {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
padding-top: 1.601vh;
|
|||
|
|
padding-bottom: 1.601vh;
|
|||
|
|
border-bottom: 2px solid #316b8b;
|
|||
|
|
|
|||
|
|
#main4, #main5 {
|
|||
|
|
flex-basis: 80%;
|
|||
|
|
height: 15.97vh;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.bottom {
|
|||
|
|
padding-top: 1.601vh;
|
|||
|
|
padding-bottom: 1.601vh;
|
|||
|
|
border-bottom: 2px solid #316b8b;
|
|||
|
|
|
|||
|
|
.tabs {
|
|||
|
|
display: flex;
|
|||
|
|
font-size: 14px;
|
|||
|
|
margin-bottom: 0.534vh;
|
|||
|
|
|
|||
|
|
.tab {
|
|||
|
|
background-color: rgba(58, 78, 115, 0.6);
|
|||
|
|
padding: 1.5vh 60px;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
margin-right: 0.534vh;
|
|||
|
|
cursor: pointer;
|
|||
|
|
|
|||
|
|
&.active, &:hover {
|
|||
|
|
background-color: rgba(45, 143, 173, 0.6);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@include table();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|