From 8e5cbdc7562b1d75d900b63d53ae1a9006b07577 Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期一, 08 七月 2024 13:43:36 +0800 Subject: [PATCH] Merge branch 'master' of http://47.103.154.90:83/r/IStation/shys/Web.Ch.V1.0 --- src/views/project/ch/efficiencyAnalysis/curveAnalysis/RunPointAnalysis.vue | 961 +------------------------------------------------------- 1 files changed, 24 insertions(+), 937 deletions(-) diff --git a/src/views/project/ch/efficiencyAnalysis/curveAnalysis/RunPointAnalysis.vue b/src/views/project/ch/efficiencyAnalysis/curveAnalysis/RunPointAnalysis.vue index e555f07..1963cf0 100644 --- a/src/views/project/ch/efficiencyAnalysis/curveAnalysis/RunPointAnalysis.vue +++ b/src/views/project/ch/efficiencyAnalysis/curveAnalysis/RunPointAnalysis.vue @@ -1,973 +1,60 @@ -杩愯鐐瑰垎鏋� <template> + <!-- 鎬ц兘鏇茬嚎 --> <el-row :gutter="8" class="h100"> <el-col :span="4" :xs="24" class="h100"> <el-card shadow="hover" class="h100 left-tree-card" v-loading="treeLoading"> - <LeftTreeByMgr - :treedata="listTreeData" - :showTitle="false" - :currentNodeKey="currentListID" - @click="handleClickNode" - :defaultProps="state.defaultProps" - defaultExpandAll - :folderIcon="(_, data) => data.LogicType !== LOGIC_SITE_CODE" - > + <LeftTreeByMgr :treedata="listTreeData" title-name="娉电珯鍒楄〃" :current-node-key="currentListID" @click="handleClickNode"> </LeftTreeByMgr> </el-card> </el-col> <el-col :span="20" :xs="24" class="flex-column h100"> - <el-card class="flex-auto scroll-table-card" shadow="hover"> - <el-tabs v-model="state.activeName" class="w100 h100"> - <el-tab-pane label="鐑姏鍥�" name="heatMapPage" class="w100 h100"> - <div class="box_right_title form_m1"> - <span class="mr15">杩愯鍒嗘瀽</span> - <el-form ref="queryQHFormRef" :inline="true" :model="state.queryQHForm"> - <el-form-item label="鏃ユ湡"> - <el-date-picker - v-model="state.queryQHForm.themetime" - range-separator="~" - start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" - :disabled-date="disablesDate" - type="daterange" - :default-time="defaultTime" - clearable - value-format="YYYY-MM-DD" - @change="getDateTime" - size="small" - /> - </el-form-item> - <el-form-item> - <el-button class="ml10" @click="timeQuery()" size="small" type="primary">鏌ヨ</el-button> - </el-form-item> - </el-form> - </div> - <div class="setQHForm"> - <el-form ref="queryQHFormRef" :inline="true" :model="state.queryQHForm" :rules="queryQHRules"> - <el-form-item label="娴侀噺闂撮殧鍊�" prop="Qspace"> - <el-input-number - v-model="state.queryQHForm.Qspace" - placeholder="娴侀噺闂撮殧鍊�" - autocomplete="off" - :controls="false" - style="width: 100px" - :min="1" - @input="flowIntervalValue" - ></el-input-number> - </el-form-item> - <el-form-item label="鎵▼闂撮殧鍊�" prop="Hspace"> - <el-input-number - v-model="state.queryQHForm.Hspace" - placeholder="鎵▼闂撮殧鍊�" - :controls="false" - style="width: 100px" - autocomplete="off" - @input="headIntervalValue" - ></el-input-number> - </el-form-item> - </el-form> - - <el-form :model="state.QHForm" :inline="true"> - <el-form-item label="鏄剧ず鍊�" label-width="65px"> - <el-switch v-model="state.QHForm.showValue" @change="isShowQHValue" /> - </el-form-item> - <!-- @change="isShowTOrP" --> - <el-form-item label="鏃堕棿鎴栧姛鐜�" label-width="95px"> - <el-switch v-model="state.QHForm.tOrP" @change="tOrPChange" /> - </el-form-item> - </el-form> - </div> - <div style="display: flex; height: calc(100% - 120px)"> - <div id="chartHeatmapBox" class="chart" style="width: calc(100% - 0px); height: calc(100% - 0px)"></div> - </div> - </el-tab-pane> - <el-tab-pane label="绮剧‘鏌ヨ" name="cacurateQueryPage"> - <el-row :gutter="8" class="h100"> - <el-col :span="20" :xs="24" class="flex-column h100"> - <div> - <div class="box_right_title form_m1"> - <span class="mr15">杩愯鍒嗘瀽</span> - <el-form ref="queryQHFormRef" :inline="true" :model="state.queryQHForm"> - <el-form-item label="鏃ユ湡"> - <el-date-picker - v-model="state.queryQHForm.themetime" - range-separator="~" - start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" - :disabled-date="disablesDate" - type="daterange" - :default-time="defaultTime" - clearable - value-format="YYYY-MM-DD" - @change="getDateTime" - size="small" - /> - </el-form-item> - </el-form> - </div> - <el-table - class="mt10" - ref="draggableTableRef" - border - row-key="ID" - :cell-style="{ textAlign: 'center' }" - :header-cell-style="{ textAlign: 'center' }" - :data="state.displayTableData" - style="width: 100%" - highlight-current-row - height="670" - > - <el-table-column type="index" label="搴忓彿" fixed="left" show-overflow-tooltip width="150" /> - <el-table-column prop="Name" label="娉电粍鍚�" show-overflow-tooltip width="150"> </el-table-column> - <el-table-column prop="Qavg" label="娴侀噺" show-overflow-tooltip width="150" /> - <el-table-column prop="Havg" width="150" label="鎵▼" show-overflow-tooltip /> - <el-table-column prop="Pavg" width="150" label="鍔熺巼(kW)" show-overflow-tooltip /> - <el-table-column label="杩愯鏃堕棿(h)" show-overflow-tooltip prop="Tsum" fixed="right"> </el-table-column> - </el-table> - </div> - </el-col> - <el-col :span="4" :xs="24" class="flex-column h100"> - <div class="box_right_title">鍒嗘瀽鍙傛暟</div> - <div class="mt10"> - <el-form label-width="45px" :model="state.analyzeForm" class="formLabel_size"> - <div class="flex flex-space-between"> - <el-form-item label="娴侀噺"> - <el-input v-model="state.analyzeForm.Q" @input="verifiyInstant($event, 1)" class="analyseInput_left" /> - </el-form-item> - <el-form-item label="鍋忓樊鍊�" label-width="56px"> - <el-input - v-model="state.analyzeForm.deviationQValue" - @input="verifiyInstant($event, 2)" - class="analyseInput_right" - /> - </el-form-item> - </div> - <div class="flex flex-space-between"> - <el-form-item label="鎵▼"> - <el-input v-model="state.analyzeForm.H" @input="verifiyInstant($event, 3)" class="analyseInput_left" /> - </el-form-item> - <el-form-item label="鍋忓樊鍊�" label-width="56px"> - <el-input - v-model="state.analyzeForm.deviationHValue" - @input="verifiyInstant($event, 4)" - class="analyseInput_right" - /> - </el-form-item> - </div> - </el-form> - </div> - <div class="box_right_title mt10">鍋忓樊鑼冨洿</div> - <div class="mt10"> - <el-form label-width="45px" :model="state.deviationForm"> - <div class="flex flex-space-between"> - <el-form-item label="娴侀噺"> - <el-input v-model="state.deviationForm.QdStart" @input="verifiyInstant($event, 5)" class="deviationInput" /> - <span style="color: #ccc; padding: 0px 4px"> 锝� </span> - <el-input v-model="state.deviationForm.QdEnd" @input="verifiyInstant($event, 6)" class="deviationInput" /> - </el-form-item> - </div> - <div class="flex flex-space-between mt10"> - <el-form-item label="鎵▼"> - <el-input v-model="state.deviationForm.HdStart" @input="verifiyInstant($event, 7)" class="deviationInput" /> - <span style="color: #ccc; padding: 0px 4px"> 锝� </span> - <el-input v-model="state.deviationForm.HdEnd" @input="verifiyInstant($event, 8)" class="deviationInput" /> - </el-form-item> - </div> - <el-form-item> - <el-button class="ml10 mt10" type="primary" @click="getTableDetail()">鏌ヨ</el-button> - </el-form-item> - </el-form> - </div> - </el-col> - </el-row> - </el-tab-pane> - </el-tabs> - </el-card> + <RunPointAnalysisCom ref="runPointAnalysisRef" :currentListID="currentListID" :pumpTitle="state.echartTitle" /> </el-col> - <el-dialog - :destroy-on-close="true" - v-model="state.heatmapDetailShow" - width="700px" - :close-on-click-modal="false" - @closed="closeDialog" - :title="state.dialogTitle" - > - <div style="display: flex; height: 400px; width: 100%"> - <div id="chartPie" class="chart" style="width: calc(100% - 0px); height: calc(100% - 0px)"></div> - </div> - - <el-table - ref="draggableTableRef" - border - :cell-style="{ textAlign: 'center' }" - :header-cell-style="{ textAlign: 'center' }" - :data="state.pieData" - style="width: 100%" - highlight-current-row - > - <el-table-column type="index" label="搴忓彿" show-overflow-tooltip width="70" /> - <el-table-column prop="Name" label="娉电粍鍚�" show-overflow-tooltip width="130"> </el-table-column> - <el-table-column prop="Qavg" label="娴侀噺" show-overflow-tooltip width="110" /> - <el-table-column prop="Havg" width="90" label="鎵▼" show-overflow-tooltip /> - <el-table-column prop="Pavg" width="130" label="鍔熺巼(kW)" show-overflow-tooltip /> - <el-table-column label="杩愯鏃堕棿(h)" show-overflow-tooltip prop="Tsum"> </el-table-column> - </el-table> - </el-dialog> </el-row> </template> <script setup lang="ts"> -import * as echarts from 'echarts'; -import { ElMessage } from 'element-plus'; +import { computed, nextTick, onMounted, reactive, ref } from 'vue'; +import { GetStationList } from '/@/api/dispatch/dispatch'; import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue'; -import type { FormRules } from 'vue'; -import { ref, onMounted, computed, reactive, shallowRef, onActivated } from 'vue'; -import { getDefaultLogicPolicyStd } from '/@/api/phm/logicPolicyStd'; -import { GetLogicTreeListByPolicyIDStd } from '/@/api/phm/logicTreeStd'; -import { getSite } from '/@/projectCom/components/manage/utils'; -import { uniqueInArray } from '/@/utils/istation/common.js'; -import { LOGIC_SITE_CODE } from '/@/constants'; -import { GetRectListOfDayRange, GetRectDetailListOfDayRange } from '/@/api/eta/runHeat'; -import moment from 'moment'; -import { verifyNumberComma } from '/@/utils/toolsValidate'; -const defaultTime = ref<[Date, Date]>([new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)]); +import RunPointAnalysisCom from '/@/projectCom/curve/runPoint/RunPointAnalysisCom.vue'; // 瀹氫箟鍙橀噺鍐呭 const state = reactive({ - chartData: [], echartTitle: '', - queryQHForm: { - Qspace: 100, - Hspace: 1, - themetime: '', - } as any, - QHForm: { - showValue: false, - tOrP: true, - }, - heatmapDetailShow: false, //鎵撳紑鐑姏鍥剧殑璇︾粏 锛堥粯璁ゅ叧闂級 - dialogTitle: '娉电粍鍚堜俊鎭�', //璇︾粏鐨勫悕瀛� - pieData: [], //楗煎浘鏁版嵁婧� - defaultProps: { - id: 'LogicID', - label: 'Name', - children: 'Children', - }, //鏍戣妭鐐� - activeName: 'heatMapPage', //榛樿閫変腑鐑姏鍥� - displayTableData: [], //绮剧‘鏌ヨ鏁版嵁 - analyzeForm: { - deviationQValue: 50, - deviationHValue: 0.5, - } as any, //鍒嗘瀽鍙傛暟 - deviationForm: {} as any, //鍋忓樊鑼冨洿 - min: '', - max: '', - runTimeData: [], - minE: '', - maxE: '', - eData: [], }); -const m_chartHeatmapBox = shallowRef(); -const m_chartPie = shallowRef(); -const queryQHFormRef = ref(); +const runPointAnalysisRef = ref(); //#region ====================== 宸︿晶鏍戞暟鎹紝tree init ====================== + const treeLoading = ref(false); const listTreeData = ref([]); const currentTreeNode = ref(null); -const currentListID = computed(() => currentTreeNode.value?.LogicID); -const defaultSelectID = window.moduleConfig.comprehensive.logicSite.defaultSelectID; //榛樿閫変腑闀垮叴...娉电珯鐨処D +const currentListID = computed(() => currentTreeNode.value?.ID); const handleClickNode = (data) => { currentTreeNode.value = data; - if (data.LogicType !== LOGIC_SITE_CODE) { - m_chartHeatmapBox.value && m_chartHeatmapBox.value.clear(); - return ElMessage.warning('鏀嚎涓嶅彲閫�!'); - } - window.moduleConfig.comprehensive.logicSite.defaultSelectID = data.LogicID; - state.echartTitle = data.Name; - timeQuery(); + nextTick(() => { + runPointAnalysisRef.value.getChartList(); + }); }; const getListTreeData = async () => { treeLoading.value = true; - getDefaultLogicPolicyStd().then(async (data) => { - if (typeof data !== 'undefined') { - const res = await GetLogicTreeListByPolicyIDStd({ - PolicyID: data.ID, - }).finally(() => { - treeLoading.value = false; - }); - - if (res?.Code === 0) { - const resData = (res.Data || []) as []; - listTreeData.value = resData; - const firstSelectTreeNode = getSite( - resData, - { key: 'LogicType', value: LOGIC_SITE_CODE }, - { - key: 'LogicID', - value: defaultSelectID, - } - ); - if (firstSelectTreeNode) { - handleClickNode(firstSelectTreeNode); - state.echartTitle = firstSelectTreeNode.Name; - } else { - listTreeData.value = []; - } - } else { - ElMessage.error('鑾峰彇娉电珯鍒楄〃澶辫触' + (res?.Message ? `锛�${JSON.stringify(res.Message)}` : '')); - } + const res = await GetStationList().finally(() => { + treeLoading.value = false; + }); + if (res?.Code === 0) { + const resData = (res.Data || []) as []; + listTreeData.value = resData; + const firstListTreeNode = listTreeData.value[0]; + if (firstListTreeNode) { + handleClickNode(firstListTreeNode); } else { - listTreeData.value = []; - } - }); -}; -//#endregion -//#region ====================== 璁剧疆鏃堕棿浜嬩欢 ====================== -//榛樿鏃堕棿閫夋嫨鍓�7澶�/榛樿閫夋嫨褰撳ぉ -const getdatatime = () => { - let sevenAgo = moment(new Date()).subtract(7, 'days').startOf('day').format('YYYY-MM-DD HH:mm:ss'); - let today = moment().endOf('day').format('YYYY-MM-DD HH:mm:ss'); - return [sevenAgo, today]; -}; -//鑾峰彇鏃ユ湡鐨勬椂闂� -const getDateTime = (val) => { - if (val == null) { - return ElMessage.warning('璇烽�夋嫨鏃堕棿'); - } - state.queryQHForm.themetime[0] = val[0]; - state.queryQHForm.themetime[1] = val[1]; -}; -// 鏃堕棿闄愬埗 -const disablesDate = (time) => { - return time.getTime() > new Date().getTime(); -}; -//鏌ヨ鏃堕棿 -const timeQuery = async () => { - if (!queryQHFormRef.value) return; - await queryQHFormRef.value.validate(async (valid, fields) => { - if (valid) { - getChartList(); - } else { - return ElMessage.error('蹇呭~椤�!'); - } - }); -}; -//#endregion -//#region ====================== 琛ㄥ崟楠岃瘉 ====================== -const queryQHRules = reactive<FormRules>({ - Qspace: [{ required: true, message: '鍙兘杈撳叆鏁板瓧', trigger: 'blur' }], - Hspace: [{ required: true, message: '鍙兘杈撳叆鏁板瓧', trigger: 'blur' }], -}); -//#endregion -//#region ====================== 鍥捐〃 鎵▼/鏁堢巼/init====================== -//閫氳繃 鏃ユ湡鏇茬嚎鑾峰彇鐑姏鍥惧浘琛ㄦ暟鎹� -const getChartList = async () => { - await GetRectListOfDayRange({ - ObjectType: LOGIC_SITE_CODE, - ObjectID: currentListID.value, - Qspace: state.queryQHForm.Qspace, - Hspace: state.queryQHForm.Hspace, - StartDay: state.queryQHForm.themetime[0], - EndDay: state.queryQHForm.themetime[1], - }) - .then((res) => { - let result = res.Data; - if (res.Code != 0) { - state.chartData = []; - m_chartHeatmapBox.value && m_chartHeatmapBox.value.clear(); - return; - } - if (res.Data == null || res.Data.length == 0) { - state.chartData = []; - m_chartHeatmapBox.value && m_chartHeatmapBox.value.clear(); - return ElMessage.warning('鏆傛棤鏁版嵁'); - } - state.chartData = result || []; - - setTimeout(() => { - //鍒濆鍖栧浘琛� - BuildchartHeatmapBox(); - }, 100); - }) - .catch((err) => { - ElMessage.error('鑾峰彇鍥捐〃鏁版嵁澶辫触' + (err?.Message ? `锛�${JSON.stringify(err.Message)}` : '')); - }); -}; -// 鍒濆鍖栨祦閲忔壃绋嬪浘琛� -const BuildchartHeatmapBox = () => { - m_chartHeatmapBox.value && m_chartHeatmapBox.value.clear(); - if (state.chartData.length == 0) return; - //鍏堣幏鍙朌om涓婄殑瀹炰緥 - let chartDom = echarts.getInstanceByDom(document.getElementById('chartHeatmapBox') as HTMLDivElement); - //鐒跺悗鍒ゆ柇瀹炰緥鏄惁瀛樺湪锛屽鏋滀笉瀛樺湪锛屽氨鍒涘缓鏂板疄渚� - if (chartDom == null) { - chartDom = echarts.init(document.getElementById('chartHeatmapBox') as HTMLDivElement); - } - m_chartHeatmapBox.value = chartDom; - var xData = []; - var yData = []; - var runTimeData = []; - var eData = []; - for (var i = 0; i < state.chartData.length; i++) { - var node = state.chartData[i]; - if (node.Tsum != 0) { - var x = parseFloat(((node.Qmax + node.Qmin) / 2).toFixed(4)); - var y = parseFloat(((node.Hmax + node.Hmin) / 2).toFixed(4)); - var time = parseFloat((node.Tsum / 60 / 60).toFixed(3)); - x = node.Qmax; - y = node.Hmax; - - xData.push(x); - yData.push(y); - node.Tsum = time; - runTimeData.push({ rect_data: node, value: [x.toString(), y.toString(), node.Tsum, node] }); - eData.push({ rect_data: node, value: [x.toString(), y.toString(), node.Eavg, node] }); //Eavg 鏁堢巼 + currentTreeNode.value = null; } } - xData = uniqueInArray(xData); //鍘婚噸 - yData = uniqueInArray(yData); //鍘婚噸 - yData.sort(compareNumbers); - var max = 1; - var min = 0; - var maxE = 100; - var minE = 0; - if (state.chartData.length != 0) { - max = Math.max.apply( - Math, - state.chartData.map((item) => { - return item.Tsum; - }) - ); //鏁版嵁鐨勬渶澶у�� - min = Math.min.apply( - Math, - state.chartData.map((item) => { - return item.Tsum; - }) - ); //鏁版嵁鐨勬渶灏忓�� - maxE = Math.max.apply( - Math, - state.chartData.map((item) => { - return item.Eavg; - }) - ); //鏁堢巼鏁版嵁鐨勬渶澶у�� - var minValE = []; - state.chartData.forEach((item) => { - if (item.Eavg != 0) { - minValE.push(item.Eavg); - } - }); - minE = Math.min.apply(Math, minValE); //鏁堢巼鏁版嵁鐨勬渶灏忓�� - } - // console.log(xData, yData, runTimeData); - //console.log(max,min) - runTimeData = runTimeData.map(function (item) { - return { rect_data: item.rect_data, value: [item.value[0], item.value[1], item.value[2] || '-'] }; - //return { rect_data: item.rect_data, value: [item.value[0], item.value[1], item.value[2]] }; - }); - - eData = eData.map(function (item) { - return { rect_data: item.rect_data, value: [item.value[0], item.value[1], item.value[2] || '-'] }; - }); - var option = { - tooltip: { - //position: 'top' - formatter: function (p) { - //console.log(p.data) - if (!p.data) { - return ''; - } - return ( - p.data.rect_data.Qmin + - '-' + - p.data.rect_data.Qmax + - '</br>' + - p.marker + - '鏃堕棿: ' + - p.data.rect_data.Tsum + - '灏忔椂 鏁堢巼: ' + - p.data.rect_data.Eavg + - '%' - ); - }, - }, - animation: false, - grid: { - containLabel: true, - left: '80', - right: '80', - top: '70', - bottom: '15', - }, - legend: { - data: ['鏁堢巼', '杩愯鏃堕棿'], - }, - xAxis: { - name: '娴侀噺(m鲁)', - type: 'category', //category log - data: xData, - //boundaryGap:false, - splitArea: { - show: true, - interval: 0, - }, - axisLabel: { - //formatter: function (value, index) { - // console.log(value, index) - // return value - //} - }, - axisTick: { - alignWithLabel: true, - }, - axisPointer: { - show: true, - type: 'shadow', - }, - }, - yAxis: { - name: '鎵▼(m)', - type: 'category', - data: yData, - splitArea: { - show: true, - interval: 0, - }, - axisTick: { - alignWithLabel: true, - }, - axisPointer: { - show: true, - type: 'shadow', - }, - }, - visualMap: [ - { - min: min, - max: max, - calculable: true, - text: ['鏃堕棿:(灏忔椂)', ''], - textGap: 20, - realtime: false, - //orient:'horizontal', - top: 'middle', - inRange: { - color: ['#2ba2ee', '#f32cb7'], //['#2ba2ee', '#f32cb7'] //['#313695', '#a50026'] - }, - ////color: ['#313695', '#4575b4', '#74add1', '#abd9e9', '#e0f3f8', '#ffffbf', '#fee090', '#fdae61', '#f46d43', '#d73027', '#a50026'] - }, - ], - series: [ - { - name: '杩愯鏃堕棿', - type: 'heatmap', - data: runTimeData, - label: { - show: false, - }, - emphasis: { - itemStyle: { - shadowBlur: 10, - shadowColor: 'rgba(0, 0, 0, 0.5)', - }, - }, - }, - ], - }; - // 浣跨敤鍒氭寚瀹氱殑閰嶇疆椤瑰拰鏁版嵁鏄剧ず鍥捐〃銆� - m_chartHeatmapBox.value.setOption(option, true); - m_chartHeatmapBox.value.setOption({ - visualMap: [ - { - min: min, - max: max, - range: [min, max], - }, - ], - }); - m_chartHeatmapBox.value.on('click', function (obj) { - let node = obj.data.rect_data; - setChartTableDialog(node.Qmin, node.Qmax, node.Hmin, node.Hmax); - }); - state.min = min; - state.max = max; - state.runTimeData = runTimeData; - state.minE = minE; - state.maxE = maxE; - state.eData = eData; - window.addEventListener('resize', selfAdaption); -}; -const compareNumbers = (a, b) => { - return a - b; // 浠庡皬鍒板ぇ鎺掑簭 -}; -//鎵撳紑寮圭獥 -const setChartTableDialog = async (qLower, qUpper, hLower, hUpper) => { - state.heatmapDetailShow = true; - await GetRectDetailListOfDayRange({ - ObjectType: LOGIC_SITE_CODE, - ObjectID: currentListID.value, - Qmin: qLower, - Qmax: qUpper, - Hmin: hLower, - Hmax: hUpper, - StartDay: state.queryQHForm.themetime[0], - EndDay: state.queryQHForm.themetime[1], - }).then((res) => { - let result = res.Data; - if (res.Code != 0) { - state.pieData = []; - m_chartPie.value && m_chartPie.value.clear(); - return; - } - if (res.Data == null || res.Data.length == 0) { - state.pieData = []; - m_chartPie.value && m_chartPie.value.clear(); - return ElMessage.warning('楗煎浘鏆傛棤鏁版嵁'); - } - result.forEach((item) => (item.Tsum = (item.Tsum / 60 / 60).toFixed(2))); - state.pieData = result || []; - setTimeout(() => { - //鍒濆鍖栭ゼ鍥� - buildPieChartBox(); - }, 100); - }); -}; -// 鍒濆鍖栭ゼ鍥� -const buildPieChartBox = () => { - m_chartPie.value && m_chartPie.value.clear(); - if (state.pieData.length == 0) return; - //鍏堣幏鍙朌om涓婄殑瀹炰緥 - let chartDom = echarts.getInstanceByDom(document.getElementById('chartPie') as HTMLDivElement); - //鐒跺悗鍒ゆ柇瀹炰緥鏄惁瀛樺湪锛屽鏋滀笉瀛樺湪锛屽氨鍒涘缓鏂板疄渚� - if (chartDom == null) { - chartDom = echarts.init(document.getElementById('chartPie') as HTMLDivElement); - } - m_chartPie.value = chartDom; - var seriesData = []; - for (var i = 0; i < state.pieData.length; i++) { - var item = state.pieData[i]; - seriesData.push({ value: parseFloat(item.Tsum), name: item.Name }); - } - let option = { - title: { - text: '', - subtext: '', - left: 'center', - }, - tooltip: { - trigger: 'item', - }, - legend: { - orient: 'vertical', - left: 'left', - }, - series: [ - { - name: '杩愯鏃堕棿', - type: 'pie', - radius: '50%', - data: seriesData, - label: { - show: true, - formatter: '{b}{a}锛歿c}灏忔椂', - }, - emphasis: { - itemStyle: { - shadowBlur: 10, - shadowOffsetX: 0, - shadowColor: 'rgba(0, 0, 0, 0.5)', - }, - }, - }, - ], - }; - m_chartPie.value.setOption(option, true); - m_chartPie.value && m_chartPie.value.resize(); -}; -//鍏抽棴寮圭獥 -const closeDialog = () => { - state.heatmapDetailShow = false; -}; -// 鐑姏鍥捐嚜閫傚簲 -const selfAdaption = () => { - if (!m_chartHeatmapBox.value) return; - m_chartHeatmapBox.value.resize(); -}; -// 楗煎浘鑷�傚簲 -const selfPipeAdaption = () => { - if (!m_chartPie.value) return; - m_chartPie.value.resize(); -}; -//#endregion -//#region ====================== 鏄惁鏄剧ず鍊�/鏃堕棿/鍔熺巼 ====================== -const isShowQHValue = () => { - if (state.QHForm.showValue) { - m_chartHeatmapBox.value && - m_chartHeatmapBox.value.setOption({ - series: [ - { - label: { - show: true, - color: 'white', - }, - }, - ], - }); - } else { - m_chartHeatmapBox.value && - m_chartHeatmapBox.value.setOption({ - series: [ - { - label: { - show: false, - }, - }, - ], - }); - } -}; -const tOrPChange = (val) => { - state.QHForm.tOrP = val; - isShowTOrP(); -}; -const isShowTOrP = () => { - var isRunTime = true; - if (state.QHForm.tOrP) { - m_chartHeatmapBox.value.setOption({ - visualMap: [ - { - min: state.min, - max: state.max, - text: ['鏃堕棿:(灏忔椂)', ''], - range: [state.min, state.max], - inRange: { - color: ['#2ba2ee', '#f32cb7'], - }, - }, - ], - series: [ - { - name: '杩愯鏃堕棿', - data: state.runTimeData, - }, - ], - }); - isRunTime = true; - } else { - m_chartHeatmapBox.value.setOption({ - visualMap: [ - { - min: state.minE, - max: state.maxE, - text: ['鏁堢巼:(%)', ''], - range: [state.minE, state.maxE], - inRange: { - color: ['#ccc', '#332cb7'], - }, - }, - ], - - series: [ - { - name: '鏁堢巼', - data: state.eData, - }, - ], - }); - isRunTime = false; - } }; -//#endregion -//#region ====================== 鍒囨崲鎴愮簿纭煡璇� ====================== -//楠岃瘉鐨勬椂鍊欏彧鑳借緭鍏ユ暟瀛� -const verifiyInstant = (val, type) => { - switch (type) { - case 1: - if (state.analyzeForm.Q == '') return; - state.analyzeForm.Q = verifyNumberComma(val); - var qLowerValue = parseFloat(state.analyzeForm.Q) - parseFloat(state.analyzeForm.deviationQValue); - var qUpperValue = parseFloat(state.analyzeForm.Q) + parseFloat(state.analyzeForm.deviationQValue); - state.deviationForm.QdStart = qLowerValue; //娴侀噺鍋忓樊鏈�灏忓�� - state.deviationForm.QdEnd = qUpperValue; //娴侀噺鍋忓樊鏈�澶у�� - - break; - case 2: - if (state.analyzeForm.deviationQValue == '') return; - state.analyzeForm.deviationQValue = verifyNumberComma(val); - var qLowerValue = parseFloat(state.analyzeForm.Q) - parseFloat(state.analyzeForm.deviationQValue); - var qUpperValue = parseFloat(state.analyzeForm.Q) + parseFloat(state.analyzeForm.deviationQValue); - state.deviationForm.QdStart = qLowerValue; //娴侀噺鍋忓樊鏈�灏忓�� - state.deviationForm.QdEnd = qUpperValue; //娴侀噺鍋忓樊鏈�澶у�� - - break; - case 3: - if (state.analyzeForm.H == '') return; - state.analyzeForm.H = verifyNumberComma(val); - var hLowerValue = parseFloat(state.analyzeForm.H) - parseFloat(state.analyzeForm.deviationHValue); - var hUpperValue = parseFloat(state.analyzeForm.H) + parseFloat(state.analyzeForm.deviationHValue); - state.deviationForm.HdStart = hLowerValue; //鎵▼鍋忓樊鏈�灏忓�� - state.deviationForm.HdEnd = hUpperValue; //鎵▼鍋忓樊鏈�澶у�� - break; - case 4: - if (state.analyzeForm.deviationHValue == '') return; - state.analyzeForm.deviationHValue = verifyNumberComma(val); - var hLowerValue = parseFloat(state.analyzeForm.H) - parseFloat(state.analyzeForm.deviationHValue); - var hUpperValue = parseFloat(state.analyzeForm.H) + parseFloat(state.analyzeForm.deviationHValue); - state.deviationForm.HdStart = hLowerValue; //鎵▼鍋忓樊鏈�灏忓�� - state.deviationForm.HdEnd = hUpperValue; //鎵▼鍋忓樊鏈�澶у�� - break; - case 5: - state.deviationForm.QdStart = verifyNumberComma(val); - - break; - case 6: - state.deviationForm.QdEnd = verifyNumberComma(val); - break; - case 7: - state.deviationForm.HdStart = verifyNumberComma(val); - - break; - case 8: - state.deviationForm.HdEnd = verifyNumberComma(val); - break; - } -}; -//鐩戝惉娴侀噺闂撮殧鍊� -const flowIntervalValue = (val) => { - // state.analyzeForm.Q = val; - var intervalValueFlow = state.queryQHForm.Qspace / 2; //娴侀噺闂撮殧鍊� - //灏嗘祦閲忛棿闅斿�煎疄鏃惰祴缁欐祦閲忓亸宸�� - state.analyzeForm.deviationQValue = intervalValueFlow; - var qLowerValue = parseFloat(state.analyzeForm.Q) - parseFloat(state.analyzeForm.deviationQValue); - var qUpperValue = parseFloat(state.analyzeForm.Q) + parseFloat(state.analyzeForm.deviationQValue); - state.deviationForm.QdStart = qLowerValue; //娴侀噺鍋忓樊鏈�灏忓�� - state.deviationForm.QdEnd = qUpperValue; //娴侀噺鍋忓樊鏈�澶у�� -}; -//鐩戝惉鎵▼闂撮殧鍊� -const headIntervalValue = (val) => { - // state.analyzeForm.Q = val; - var intervalValueFlow = state.queryQHForm.Hspace / 2; //鎵▼闂撮殧鍊� - //灏嗘壃绋嬮棿闅斿�煎疄鏃惰祴缁欐壃绋嬪亸宸�� - state.analyzeForm.deviationHValue = intervalValueFlow; - var hLowerValue = parseFloat(state.analyzeForm.H) - parseFloat(state.analyzeForm.deviationHValue); - var hUpperValue = parseFloat(state.analyzeForm.H) + parseFloat(state.analyzeForm.deviationHValue); - state.deviationForm.HdStart = hLowerValue; //鎵▼鍋忓樊鏈�灏忓�� - state.deviationForm.HdEnd = hUpperValue; //鎵▼鍋忓樊鏈�澶у�� -}; -const getTableDetail = async () => { - var qLowerValue = state.deviationForm.QdStart; //娴侀噺鍋忓樊鏈�灏忓�� - var qUpperValue = state.deviationForm.QdEnd; //娴侀噺鍋忓樊鏈�澶у�� - var hLowerValue = state.deviationForm.HdStart; //鎵▼鍋忓樊鏈�灏忓�� - var hUpperValue = state.deviationForm.HdEnd; //鎵▼鍋忓樊鏈�澶у�� - if (qLowerValue > qUpperValue && hLowerValue > hUpperValue) { - return ElMessage.warning('娴侀噺銆佹壃绋嬪亸宸渶灏忓�间笉鑳藉ぇ浜庢渶澶у��'); - } else if (qLowerValue > qUpperValue) { - return ElMessage.warning('娴侀噺鍋忓樊鏈�灏忓�间笉鑳藉ぇ浜庢渶澶у��'); - } else if (hLowerValue > hUpperValue) { - return ElMessage.warning('鎵▼鍋忓樊鏈�灏忓�间笉鑳藉ぇ浜庢渶澶у��'); - } else { - if (qLowerValue == null || qLowerValue == '') return ElMessage.warning('璇疯緭鍏ユ祦閲�'); - if (qUpperValue == null || qUpperValue == '') return ElMessage.warning('璇疯緭鍏ユ祦閲�'); - if (hLowerValue == null || hLowerValue == '') return ElMessage.warning('璇疯緭鍏ユ壃绋�'); - if (hUpperValue == null || hUpperValue == '') return ElMessage.warning('璇疯緭鍏ユ壃绋�'); - await GetRectDetailListOfDayRange({ - ObjectType: LOGIC_SITE_CODE, - ObjectID: currentListID.value, - Qmin: qLowerValue, - Qmax: qUpperValue, - Hmin: hLowerValue, - Hmax: hUpperValue, - StartDay: state.queryQHForm.themetime[0], - EndDay: state.queryQHForm.themetime[1], - }) - .then((res) => { - let result = res.Data; - if (res.Code != 0) { - state.displayTableData = []; - return; - } - if (res.Data == null || res.Data.length == 0) { - state.displayTableData = []; - return ElMessage.warning('琛ㄦ牸鏆傛棤鏁版嵁'); - } - result.forEach((item) => (item.Tsum = (item.Tsum / 60 / 60).toFixed(2))); - state.displayTableData = result || []; - }) - .catch((err) => { - return ElMessage.error('鑾峰彇琛ㄦ牸鍒楄〃澶辫触' + (err?.Message ? `锛�${JSON.stringify(err.Message)}` : '')); - }); - } -}; //#endregion onMounted(() => { - let getSevenDate = getdatatime(); - state.queryQHForm.themetime = getSevenDate; - setTimeout(() => { - getListTreeData(); - }, 100); - window.addEventListener('resize', selfPipeAdaption); -}); -onActivated(() => { - window.addEventListener('resize', selfPipeAdaption); + getListTreeData(); }); </script> -<style scoped lang="scss"> -:deep(.el-tabs__content) { - width: 100%; - height: calc(100% - 50px); -} -.box_right_title { - background: linear-gradient(90deg, #2d81d9, #0655b4); - color: #fff; - height: 30px; - line-height: 30px; - text-align: left; - border-radius: 7px; - padding-left: 10px; - display: flex; -} -.form_m1 { - :deep(.el-form-item__label) { - color: #ffffff !important; - } -} -.setQHForm { - width: 100%; - display: flex; - justify-content: flex-start; - align-items: center; - padding-top: 10px; -} -.analyseInput_left { - width: 68px; - height: 32px; - line-height: 32px; - // border: 1px solid #cccccc; - text-align: center; - color: #666; -} -.analyseInput_right { - width: 45px; - height: 32px; - line-height: 32px; - // border: 1px solid #cccccc; - text-align: center; - color: #666; -} -.deviationInput { - width: 68px; - height: 32px; - line-height: 32px; - // border: 1px solid #cccccc; - text-align: center; - color: #666; -} -.formLabel_size { - :deep(.el-form-item__label) { - font-size: 1rem !important; - } - :deep(.el-form-item--default) { - margin-bottom: 10px !important; - line-height: 36px; - } -} -</style> +import { GetStationList } from '/@/api/dispatch/dispatch'; -- Gitblit v1.9.3