<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"
|
:defaultProps="state.defaultProps"
|
:currentNodeKey="currentListID"
|
@click="handleClickNode"
|
defaultExpandAll
|
:folderIcon="(_, data) => data.LogicType !== LOGIC_SITE_CODE"
|
>
|
</LeftTreeByMgr>
|
</el-card>
|
</el-col>
|
<el-col :span="20" :xs="24" class="flex-column h100">
|
<RunPointAnalysisCom ref="runPointAnalysisRef" :currentListID="currentListID" :pumpTitle="state.echartTitle" />
|
</el-col>
|
</el-row>
|
</template>
|
|
<script setup lang="ts">
|
import { ElMessage } from 'element-plus';
|
import { computed, nextTick, onMounted, reactive, ref } from 'vue';
|
import { getDefaultLogicPolicyStd } from '/@/api/phm/logicPolicyStd';
|
import { GetLogicTreeListByPolicyIDStd } from '/@/api/phm/logicTreeStd';
|
import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue';
|
import { LOGIC_SITE_CODE } from '/@/constants';
|
import { getSite } from '/@/projectCom/components/manage/utils';
|
import RunPointAnalysisCom from '/@/projectCom/curve/runPoint/RunPointAnalysisCom.vue';
|
// 定义变量内容
|
const state = reactive({
|
echartTitle: '',
|
defaultProps: {
|
id: 'LogicID',
|
label: 'Name',
|
children: 'Children',
|
},
|
});
|
const runPointAnalysisRef = ref();
|
//#region ====================== 左侧树数据，tree init ======================
|
const treeLoading = ref(false);
|
const listTreeData = ref([]);
|
const currentTreeNode = ref(null);
|
const defaultSelectID = window.moduleConfig.comprehensive.logicSite.defaultSelectID; //默认选中长兴...泵站的ID
|
const currentListID = computed(() => currentTreeNode.value?.LogicID);
|
const handleClickNode = (data) => {
|
currentTreeNode.value = data;
|
if (data.LogicType !== LOGIC_SITE_CODE) {
|
return ElMessage.warning('支线不可选!');
|
}
|
window.moduleConfig.comprehensive.logicSite.defaultSelectID = data.LogicID;
|
state.echartTitle = data.Name;
|
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)}` : ''));
|
}
|
} else {
|
listTreeData.value = [];
|
}
|
});
|
};
|
//#endregion
|
onMounted(() => {
|
getListTreeData();
|
});
|
</script>
|
