feat: 联调运行点分析

yangyin

2024-05-20 d5b197e3b2fa42e3c98eb5913f9267579aadf50d

 src/views/project/ch/efficiencyAnalysis/scheduling/SchedulingAnalysis.vue

@@ -8,31 +8,23 @@
      </el-col>
      <el-col :span="20" :xs="24" class="flex-column h100">
         <el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
            <el-form :inline="true" :model="queryParams" label-width="120px">
            <el-form :inline="true" :model="queryParams" label-width="120px" :rules="queryParamsRules">
               <el-form-item label="进口水位" prop="WaterLevel">
                  <el-input v-model="queryParams.WaterLevel" style="width: 180px" placeholder="名称" clearable></el-input>
                  <el-input v-model="queryParams.WaterLevel" style="width: 180px" clearable></el-input>
               </el-form-item>
               <el-form-item label="目标流量(m³/h)" prop="TargetFlow">
                  <el-input v-model="queryParams.TargetFlow" style="width: 180px" placeholder="编码" clearable />
                  <el-input v-model="queryParams.TargetFlow" style="width: 180px" clearable />
               </el-form-item>
               <el-form-item label="目标压力(MPa)" prop="TargetPressure">
                  <el-input v-model="queryParams.TargetPressure" style="width: 180px" placeholder="编码" clearable />
                  <el-input v-model="queryParams.TargetPressure" style="width: 180px" clearable />
               </el-form-item>
               <el-form-item>
                  <el-button icon="ele-Refresh" @click="resetQuery" type="primary">调度 </el-button>
               </el-form-item>
            </el-form>

            <!-- 收缩图标 -->
            <!-- <div :class="aside_open_close ? 'aside_open' : 'aside_close'" @click="asideChange">
               <el-icon>
                  <ArrowUp v-if="aside_open_close" />
                  <ArrowDown v-else />
               </el-icon>
            </div> -->
         </el-card>
         <el-card class="mt8" shadow="hover">
            <div style="width: 100%; height: 100px" class="aside_main" :class="{ aside_main_show: !asideStatus }">
            <div style="width: 100%; height: 100px" class="aside_main">
               <el-form :inline="true" :model="pumpPanel" label-width="120px">
                  <div class="flex">
                     <el-form-item label="总流量">
@@ -71,22 +63,20 @@
               :row-class-name="isDragStatus ? 'cursor-move' : 'cursor-pointer'"
               :cell-style="{ textAlign: 'center' }"
               :header-cell-style="{ textAlign: 'center' }"
               :data="displayTableData"
               :data="tableData"
               highlight-current-row
               style="width: 100%"
            >
               <el-table-column prop="Name" label="机泵" fixed="left" show-overflow-tooltip />
               <el-table-column prop="Flow" label="流量(m³/h)" show-overflow-tooltip width="140" />
               <el-table-column prop="Head" width="140" label="扬程(m)" show-overflow-tooltip />
               <el-table-column prop="Name" label="机泵" fixed="left" show-overflow-tooltip width="200" />
               <el-table-column prop="Flow" label="流量(m³/h)" show-overflow-tooltip width="200" />
               <el-table-column prop="Head" width="200" label="扬程(m)" show-overflow-tooltip />
               <el-table-column prop="Power" width="140" label="功率(kW/h)" show-overflow-tooltip />
               <el-table-column prop="Efficiency" width="140" label="效率(%)" show-overflow-tooltip />
               <el-table-column prop="Efficiency" label="效率(%)" show-overflow-tooltip />
               <el-table-column prop="Frequency" label="频率(hz)" show-overflow-tooltip width="140" />
               <el-table-column prop="Speed" width="140" label="转速(rpm)" show-overflow-tooltip />
               <el-table-column prop="Status" width="140" label="状态" show-overflow-tooltip> </el-table-column>
               <el-table-column label="操作" width="150" fixed="right" show-overflow-tooltip>
                  <template #default="scope">
                     <!-- <el-button icon="ele-Edit" size="small" text type="primary" @click="openOperateDialog(scope.row)"> 编辑 </el-button>
                     <el-button icon="ele-Delete" size="small" text type="danger" @click="deleteCurrentRow(scope.row)"> 删除 </el-button> -->
               <el-table-column prop="Status" width="140" label="状态" show-overflow-tooltip>
                  <template #default="{ row }">
                     {{ row.Status == 0 ? '关' : row.Status == 1 ? '开' : '/' }}
                  </template>
               </el-table-column>
            </el-table>
@@ -97,27 +87,21 @@

<script setup lang="ts">
import { ElMessage } from 'element-plus';
import { computed, onMounted, ref } from 'vue';
// import {
//    GetAllChObjectByID,
//    GetCatalogObjectListTreeData,
//    GetIsExistChObjectCode,
//    UpdateChObjectSorter,
// } from '/@/api/project\ch\efficiencyAnalysis/scheduling';
import { computed, onMounted, reactive, ref } from 'vue';
import { CalculateScheduling, GetStationList } from '/@/api/dispatch/dispatch';
import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue';
//#region ====================== 左侧树数据，tree init ======================
const treeLoading = ref(false);
const listTreeData = ref([]);
const currentTreeNode = ref(null);
const currentListID = computed(() => currentTreeNode.value?.StationID);
const currentListID = computed(() => currentTreeNode.value?.ID);
const handleClickNode = (data) => {
   currentTreeNode.value = data;
   getTableData();
};
const getListTreeData = async () => {
   return;
   treeLoading.value = true;
   const res = await GetCatalogObjectListTreeData().finally(() => {
   const res = await GetStationList().finally(() => {
      treeLoading.value = false;
   });
   if (res?.Code === 0) {
@@ -135,53 +119,70 @@
//#endregion

//#region ====================== 表格数据，table init ======================
const aside_open_close = ref(false);
const asideStatus = ref(false);
const tableLoading = ref(false);
const tableData = ref([]);
const isDragStatus = ref(false);
const getTableData = async () => {
   return;
   tableLoading.value = true;
   const res = await GetAllChObjectByID({ CatalogObjectID: currentListID.value }).finally(() => {
   const res = await CalculateScheduling({
      StationID: parseInt(currentListID.value),
      ...queryParams.value,
   }).finally(() => {
      tableLoading.value = false;
   });
   if (res?.Code === 0) {
      const resData = (res.Data || []) as [];
      tableData.value = resData;
      tableData.value = resData?.Pumps;
      let obj = resData?.Station;
      pumpPanel.value.TotalEfficiency = obj?.TotalEfficiency || '';
      pumpPanel.value.TotalFlow = obj?.TotalFlow || '';
      pumpPanel.value.TotalPower = obj?.TotalPower || '';
      pumpPanel.value.TotalPressure = obj?.TotalPressure || '';
      pumpPanel.value.WP = obj?.WP || '';
      pumpPanel.value.UWP = obj?.UWP || '';
   } else {
      ElMessage.error('获取失败' + (res?.Message ? `，${JSON.stringify(res.Message)}` : ''));
   }
};
// 侧边栏收缩与展开
const asideChange = () => {
   asideStatus.value = !asideStatus.value;
   if (asideStatus.value) {
      aside_open_close.value = true;
   } else {
      aside_open_close.value = false;
   }
//调度查询
const resetQuery = () => {
   getTableData();
};
const queryParamsRules = reactive({
   WaterLevel: [{ required: true, message: '必填项', trigger: 'blur' }],
   TargetFlow: [
      {
         required: true,
         message: '必填项',
         trigger: 'blur',
      },
   ],
   TargetPressure: [
      {
         required: true,
         message: '必填项',
         trigger: 'blur',
      },
   ],
});
//#endregion

//#region ====================== 表格查询、排序，search form init ======================
const queryParams = ref({
   StationID: 1,
   WaterLevel: 11,
   TargetFlow: 20000,
   TargetPressure: 0.43,
   WaterLevel: 19.2,
   TargetFlow: 23394,
   TargetPressure: 0.3355,
});
//泵站信息面板
const pumpPanel = ref({
   TotalFlow: 124,
   TotalPressure: 12345,
   TotalPower: 123,
   TotalEfficiency: 79,
   WP: 123,
   UWP: 123,
   TotalFlow: '',
   TotalPressure: '',
   TotalPower: '',
   TotalEfficiency: '',
   WP: '',
   UWP: '',
});
// const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(tableData, queryParams, getTableData);

//#endregion

onMounted(() => {
@@ -191,62 +192,9 @@
<style scoped lang="scss">
/* 侧边栏样式 */
.aside_main {
   height: 80px !important;
   height: 75px !important;
   transition: width 0.3s;
   box-sizing: border-box;
   // box-shadow: inset 0px 0px 1px #3d3d3d;
}

/* 侧边栏按钮样式 */
.aside_open {
   position: absolute;
   left: 50%;
   top: 185px;
   width: 60px;
   height: 16px;
   line-height: 60px;
   color: #fff;
   background-color: #2a333a;
   border-radius: 0 6px 6px 0;
   font-size: 20px;
   z-index: 1000;
   cursor: pointer;
   display: flex;
   justify-content: center;
   align-items: center;

   &:hover {
      background-color: #ff8e2b;
      color: #fff;
   }
}
.aside_main_show {
   height: 17px !important;

   .el-form {
      display: none;
   }
}
.aside_close {
   position: absolute;
   left: 50%;
   top: 75px;
   width: 60px;
   height: 16px;
   line-height: 60px;
   color: #fff;
   background-color: #2a333a;
   border-radius: 0 6px 6px 0;
   font-size: 20px;
   z-index: 1000;
   cursor: pointer;
   display: flex;
   justify-content: center;
   align-items: center;

   &:hover {
      background-color: #ff8e2b;
      color: #fff;
   }
}
</style>