<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>