| | |
| | | <el-col :span="6"> |
| | | <el-form-item label="精准度偏差" prop="IN_DEVIATION"> |
| | | <el-input-number size="small" v-model="calRateForm.IN_DEVIATION" |
| | | controls-position="right" :min="1" |
| | | :max="10"/> |
| | | controls-position="right" :min="0"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="不可信率偏差" prop="OUT_DEVIATION"> |
| | | <el-input-number size="small" v-model="calRateForm.OUT_DEVIATION" |
| | | controls-position="right" |
| | | :min="1" |
| | | :max="20"/> |
| | | :min="1"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | |
| | | </el-row> |
| | | </el-form> |
| | | <div ref="dataAnalysisChart" style="height: 500px;"></div> |
| | | <div class="chart-foot"> |
| | | <div class="chart-foot-content"> |
| | | <h3 class="chart-foot-title">预警信息</h3> |
| | | <div class="chart-foot-table"> |
| | | <el-table :data="alarmList" style="width: 100%" v-loading="loadingAlarm" height="100px"> |
| | | <el-table-column prop="content" header-align="center" align="left" label="消息内容" min-width="200" /> |
| | | <el-table-column prop="alarmType" label="预警类型" header-align="center" align="left" min-width="150"/> |
| | | <el-table-column prop="alarmTime" label="预警时间" header-align="center" align="left" min-width="150"/> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | <div class="chart-foot-content"> |
| | | <h3 class="chart-foot-title">调度建议</h3> |
| | | <div class="chart-foot-table"> |
| | | <el-table :data="suggestList" style="width: 100%" v-loading="loadingAdjust" height="100px"> |
| | | <el-table-column |
| | | prop="scheduleTime" |
| | | label="调度时间" |
| | | header-align="center" |
| | | align="left" |
| | | min-width="160" |
| | | /> |
| | | <el-table-column |
| | | prop="content" |
| | | label="内容" |
| | | min-width="300" |
| | | header-align="center" align="left" |
| | | /> |
| | | <el-table-column |
| | | prop="adjustValue" |
| | | label="调整值" |
| | | header-align="center" |
| | | align="center" |
| | | min-width="100" |
| | | /> |
| | | </el-table> |
| | | </div> |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <script lang="ts" setup> |
| | | import {getYMDHMS} from "@/utils/dateUtil" |
| | | import * as McsApi from '@/api/model/mcs' |
| | | import * as AlarmMessageApi from '@/api/model/pre/alarm/message' |
| | | import * as ScheSuggestApi from '@/api/model/sche/suggest' |
| | | import * as echarts from "echarts"; |
| | | import {Search, DArrowLeft, DArrowRight, VideoPlay, VideoPause, CaretLeft, CaretRight} from '@element-plus/icons-vue' |
| | | |
| | |
| | | const timer = ref() |
| | | let myChart = null; |
| | | const isPlay = ref(false) |
| | | const alarmList = ref([]) |
| | | const suggestList = ref([]) |
| | | const loadingAlarm = ref(false) |
| | | const loadingAdjust = ref(false) |
| | | |
| | | const formRules = reactive({ |
| | | calItem: [{required: true, message: '预测项不能为空', trigger: 'blur'}], |
| | |
| | | startTime: formData.value.startTime, |
| | | endTime: formData.value.endTime |
| | | }) |
| | | |
| | | const data = await McsApi.getPreDataCharts(params) |
| | | formData.value.predictTime = data.predictTime; |
| | | formData.value.startTime = data.startTime |
| | | formData.value.endTime = data.endTime |
| | | |
| | | const paramsAlarm = reactive({ |
| | | outIds: outIds, |
| | | predictTime: formData.value.predictTime |
| | | }) |
| | | |
| | | loadingAlarm.value = true |
| | | alarmList.value = await AlarmMessageApi.getListByOut(paramsAlarm) |
| | | loadingAlarm.value = false |
| | | |
| | | loadingAdjust.value = true |
| | | suggestList.value = await ScheSuggestApi.getListByOut(paramsAlarm) |
| | | loadingAdjust.value = false |
| | | |
| | | let xAxisData = data.categories; |
| | | let defaultYAxis = [ |
| | |
| | | }, |
| | | tooltip: { |
| | | trigger: 'axis' |
| | | }, |
| | | toolbox: { |
| | | show: true, |
| | | feature: { |
| | | saveAsImage: {} |
| | | } |
| | | }, |
| | | legend: { |
| | | show: true, |
| | |
| | | } |
| | | </script> |
| | | <style scoped> |
| | | .chart-foot-table { |
| | | border: 1px solid #bababa; |
| | | } |
| | | .chart-foot-title { |
| | | font-size: 14px; |
| | | } |
| | | .chart-foot-content { |
| | | height: 100%; |
| | | width: 50%; |
| | | padding: 5px; |
| | | } |
| | | .chart-foot { |
| | | height: 120px; |
| | | width: 100%; |
| | | display: flex; |
| | | flex-direction: row; |
| | | } |
| | | .el-form-item { |
| | | margin-bottom: 0 !important; |
| | | } |
| | |
| | | .his-body-tree { |
| | | height: 100%; |
| | | border: 1px solid lightgray; |
| | | padding: 10px; |
| | | padding: 10px 10px 20px 10px; |
| | | overflow-y: auto; |
| | | } |
| | | |
| | | .his-body-right { |
| | |
| | | |
| | | .his-body { |
| | | width: 100%; |
| | | height: calc(calc(100vh - 68px - 38px - 160px)); |
| | | height: calc(calc(100vh - 68px - 38px - 60px)); |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: flex-start; |