content_left

README.md

@@ -6,4 +6,19 @@ This template should help get you started developing with Vue 3 and TypeScript i
 
 - [VS Code](https://code.visualstudio.com/) + [Vue - Official](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (previously Volar) and disable Vetur
 
-- Use [vue-tsc](https://github.com/vuejs/language-tools/tree/master/packages/tsc) for performing the same type checking from the command line, or for generating d.ts files for SFCs.
+- Use [vue-tsc](https://github.com/vuejs/language-tools/tree/master/packages/tsc) for performing the same type checking 
+from the command line, or for generating d.ts files for SFCs.
+
+
+##分辨率
+3840*2160 天津城南分辨率
+1920*1080 普通电脑分辨率
+3840*1080 上海院的分辨率
+/* 针对3840x1080分辨率的样式 */
+@media screen and (min-width: 3840px) and (max-height: 2150px) {
+  .main {
+  /* margin-top: 7.8125rem; */
+  flex: 1;
+  margin-top: 3%;
+}
+}

src/api/ajust/tree.ts

@@ -3,13 +3,13 @@ import request from "@/utils/http/request";
 
 interface idInfo {
     orgID?: string,
-
+    mrid?:string,
 }
 
 // 设备树  0 一级服务
 export function treeT(data: idInfo) {
     return request({
-        url: '/api/wwpm/biz/v1/device_0',
+        url: '/api/wwpm/biz/v1/er_tree',
         method: 'POST',
         data
     })
@@ -21,9 +21,9 @@ interface treeInfo {
     transformId: string;
 }
 // 设备树  1 二级服务
-export function treeSecond(data: treeInfo) {
+export function treeSecond(data: idInfo) {
     return request({
-        url: '/api/wwpm/biz/v1/device_1',
+        url: '/api/wwpm/biz/v1/er_tree/node',
         method: 'POST',
         data
     })
@@ -32,12 +32,22 @@ export function treeSecond(data: treeInfo) {
 // 设备树  充电站
 export function carTree_api(data: idInfo) {
     return request({
-        url: '/api/wwpm/biz/v1/car_tree',
+        url: '/api/wwpm/biz/v1/cn_tree',
         method: 'POST',
         data
     })
 }
-// 设备树  充电站
+
+export function carTree_api2(data: idInfo) {
+    return request({
+        url: '/api/wwpm/biz/v1/cn_tree/node',
+        method: 'POST',
+        data
+    })
+}
+
+
+// 设备树  光伏
 export function pvTree_api(data: idInfo) {
     return request({
         url: '/api/wwpm/biz/v1/pv_tree',

src/api/pvPage/pvApi.ts

@@ -10,4 +10,13 @@ interface idInfo {
       method: "POST",
       data,
     });
-  }
+  }
+  // 光伏实时信息
+  export function pvCurInfo_api(data: idInfo) {
+    return request({
+      url: "/api/wwpm/biz/v1/photo_voltaic/real_time/info",
+      method: "POST",
+      data,
+    });
+  }
+  

src/hooks/transFormSize.ts

@@ -4,21 +4,27 @@ const transformFontSize = (fontsize: number) => {
 
   const width = window.screen.width;
   const height = window.screen.height;
-  let ratio: any = 0
+  let ratio: any = 0;
-  if (width > 3000) {
+  //高度大于1080
-    ratio = width / 4240;
+  if (height > 1080) {
-  } else if(width>2100){
+    // 3840*2160 天津城南分辨率
-    ratio = width / 2220;
+    if (width > 3000) {
-    // 宁波分辨率
+      ratio = width / 4240;
-    // ratio = width / 3220;
+    }
-  }else if(width>1900){
+  } else {
-    ratio = width / 4240;
+      //高度小于1080
-
+    if (width > 3000) {
-  }else{
+      // 3840*1080 上海院的分辨率
-    ratio = width / 2620;
+      ratio = width / 11940;
+    } else if (width > 1900) {
+      // 1920*1080 普通电脑分辨率
+      ratio = width / 5960;
+    } else {
+      ratio = width / 3620;
+    }
   }
 
   // 取下整
   return parseInt(fontsize * ratio);
 };
-export default transformFontSize
+export default transformFontSize;

src/views/LoadManagementPage/loadlayout.vue

@@ -165,6 +165,7 @@
   }
   
   .header_layout {
+    height: changeHeight(166);
     /* height: 186px; */
     width: 100%;
     position: absolute;
@@ -215,10 +216,6 @@
     flex: 1;
     margin-top: 3%;
   }
-  // @media screen and (max-width:1920px) {
+
-  //     .main {
-  //       margin-top: 6%;
-  //     }
-  // }
   </style>
   

src/views/commonPage/carTree.vue

@@ -15,11 +15,15 @@
           :expand-on-click-node="false"
           empty-text="数据读取中..."
           :props="targetProps"
-          :default-expanded-keys="['tongxiang']"
           lazy
           :load="loadNode"
           @node-click="handleTargetInfo"
-        ></el-tree>
+        >
+        <template v-slot:default="{ node }">
+          <div style=" text-overflow: ellipsis;text-align: left; white-space: nowrap;width: 82%; overflow: hidden;"
+            :title="node.label">{{ node.label }}</div>
+        </template>
+      </el-tree>
       </div>
     </div>
   </div>
@@ -28,7 +32,7 @@
 import { onMounted, ref, watch } from "vue";
 import { ElTree } from "element-plus";
 import treeDatas from "@/assets/json/tree-right2.json";
-import { treeT, treeSecond, carTree_api } from "@/api/ajust/tree";
+import { carTree_api, carTree_api2 } from "@/api/ajust/tree";
 
 // defineProps<{
 //   elec_list: EList[]
@@ -108,80 +112,82 @@ const loadNode = async (node: any, resolve: any) => {
     });
     treeData = result.data;
     resolve(treeData);
-  } else if (node.level > 0 && node.level < 4) {
+  } else if (node.level > 0 && node.level < 3) {
     //默认展开的层级,需要默认几层就判断一下.
     resolve(node.data.children);
-  } else if (node.level === 4) {
+  }
-    // 利用设备中的信息调用接口
+  // else if (node.level === 4) {
-    // ---------
+  // 利用设备中的信息调用接口
+  // ---------
 
-    // ---------
+  // ---------
-    //懒加载
+  //懒加载
-    let res = await treeSecond({
+  // let res = await treeSecond({
+  //   orgID: "8af8470a47aad8e20147aad92e400335",
+  //   transformId: node.key,
+  // });
+  // if (res.data.energySupplyStation.length || res.data.dwellerPile.length) {
+  //   let datanames = [];
+
+  //   if (res.data.energySupplyStation.length) {
+  //     datanames.push({
+  //       name: `充电站(${res.data.energySupplyStation.length})`,
+  //       id: "chongdianzhan",
+  //     });
+  //   }
+
+  //   if (res.data.dwellerPile.length) {
+  //     datanames.push({
+  //       name: `居民充电桩(${res.data.dwellerPile.length})`,
+  //       id: "chongdianzhuang",
+  //     });
+  //   }
+  //   resolve(datanames);
+  // } else {
+  //   resolve([{ name: "暂无数据", leaf: true }]);
+  //   console.log(res); //需要将上一级的加号去掉
+  // }
+  // }
+  // else if (node.level === 5) {
+  // if (node.key === "chongdianzhan") {
+  //   if (res.data.energySupplyStation.length) {
+  //     resolve(
+  //       res.data.energySupplyStation.map((item) => ({
+  //         id: item.mrid,
+  //         name: item.name,
+  //         type: item.type,
+  //       }))
+  //     );
+  //   }
+  // }
+  // if (node.key === "chongdianzhuang") {
+  //   if (res.data.dwellerPile.length) {
+  //     resolve(
+  //       res.data.dwellerPile.map((item) => ({
+  //         id: item.mrid,
+  //         name: item.name,
+  //         type: item.type,
+  //       }))
+  //     );
+  //   }
+  // }
+
+  // resolve();
+  // resolve([
+  //   {
+  //     name: `懒加载第${node.level + 1}级` + +new Date(),
+  //     id: `${+new Date()}`,
+  //   },
+  // ]);
+  // }
+  else if (node.level === 3) {
+    let result = await carTree_api2({
       orgID: "8af8470a47aad8e20147aad92e400335",
-      transformId: node.key,
+      mrid: node.key,
     });
-    if (res.data.energySupplyStation.length || res.data.dwellerPile.length) {
+    resolve(result.data);
-      let datanames = [];
+  } else if (node.level > 3) {
-
+    resolve(node.data.children);
-      if (res.data.energySupplyStation.length) {
-        datanames.push({
-          name: `充电站(${res.data.energySupplyStation.length})`,
-          id: "chongdianzhan",
-        });
-      }
-
-      if (res.data.dwellerPile.length) {
-        datanames.push({
-          name: `居民充电桩(${res.data.dwellerPile.length})`,
-          id: "chongdianzhuang",
-        });
-      }
-      resolve(datanames);
-    } else {
-      resolve([{ name: "暂无数据", leaf: true }]);
-      console.log(res); //需要将上一级的加号去掉
-    }
-  } else if (node.level === 5) {
-    //懒加载
-    let res = await treeSecond({
-      orgID: "8af8470a47aad8e20147aad92e400335",
-      transformId: node.parent.key,
-      // transformId: "ed7d892d4f8af8514b6dc01fde016ded55e58",
-    });
-
-    if (node.key === "chongdianzhan") {
-      if (res.data.energySupplyStation.length) {
-        resolve(
-          res.data.energySupplyStation.map((item) => ({
-            id: item.mrid,
-            name: item.name,
-            type: item.type,
-          }))
-        );
-      }
-    }
-    if (node.key === "chongdianzhuang") {
-      if (res.data.dwellerPile.length) {
-        resolve(
-          res.data.dwellerPile.map((item) => ({
-            id: item.mrid,
-            name: item.name,
-            type: item.type,
-          }))
-        );
-      }
-    }
-
-    // resolve();
-    // resolve([
-    //   {
-    //     name: `懒加载第${node.level + 1}级` + +new Date(),
-    //     id: `${+new Date()}`,
-    //   },
-    // ]);
-  } else {
-    resolve([{ name: "暂无数据", leaf: true }]);
   }
 };
 
@@ -255,8 +261,8 @@ const handleTarget = (node: any) => {
 
 .tree {
   // height: 1300px;
-  height: changeHeight(980);
+  // height: changeHeight(980);
-  width: changeWidth(901.19);
+  // width: changeWidth(901.19);
   margin-left: changeHeight(56);
 }
 
@@ -392,7 +398,12 @@ const handleTarget = (node: any) => {
 
 // 修改鼠标点击时的颜色以及节点失去焦点时的背景色
 :deep(.el-tree-node:focus > .el-tree-node__content) {
-  background-color: transparent !important;
+  // background-color: transparent !important;
+  background: linear-gradient(
+    90deg,
+    rgba(82, 127, 243, 0.8) 0%,
+    rgba(59, 38, 148, 0) 100%
+  );
 }
 
 :deep(.el-tree-node__content:hover) {
@@ -610,4 +621,5 @@ const handleTarget = (node: any) => {
 //     }
 //   }
 // }
+
 </style>

src/views/commonPage/pvTree.vue

@@ -13,13 +13,19 @@
           :data="treeData"
           node-key="id"
           :props="targetProps"
-          :default-expanded-keys="['tongxiang']"
           lazy
           :load="loadNode"
           @node-click="handleTargetInfo"
           :expand-on-click-node="false"
           empty-text="数据读取中..."
-        ></el-tree>
+          :highlight-current="true"
+          :current-node-key="'id'"
+        >
+        <template v-slot:default="{ node }">
+          <div style=" text-overflow: ellipsis;text-align: left; white-space: nowrap;width: 82%; overflow: hidden;"
+            :title="node.label">{{ node.label }}</div>
+        </template>
+      </el-tree>
       </div>
     </div>
   </div>
@@ -28,7 +34,7 @@
 import { onMounted, ref, watch } from "vue";
 import { ElTree } from "element-plus";
 import treeDatas from "@/assets/json/tree-right2.json";
-import { treeT, treeSecond,pvTree_api } from "@/api/ajust/tree";
+import { treeT, treeSecond, pvTree_api } from "@/api/ajust/tree";
 
 // defineProps<{
 //   elec_list: EList[]
@@ -110,65 +116,65 @@ const loadNode = async (node: any, resolve: any) => {
     }).then((res) => {
       resolve(res.data); //默认加载第1层
     });
-  } else if (node.level > 0 && node.level < 4) {
+  // } else if (node.level > 0 && node.level < 4) {
+  } else if (node.level > 0) {
+
     //默认展开的层级,需要默认几层就判断一下.
     resolve(node.data.children);
-  } else if (node.level === 4) {
+  } 
-    console.log(node, node.level, "4------");
+  //设备树中插入 光伏类型
+  // else if (node.level === 4) {
+  //   console.log(node, node.level, "4------");
 
-    //懒加载
+  //   //懒加载
-    let res = await treeSecond({
+  //   let res = await treeSecond({
-      orgID: "8af8470a47aad8e20147aad92e400335",
+  //     orgID: "8af8470a47aad8e20147aad92e400335",
-      transformId: node.key,
+  //     transformId: node.key,
-    });
+  //   });
-    if (
+  //   if (
-      res.data.photoVoltaicUnit.length ||
+  //     res.data.photoVoltaicUnit.length ||
-      res.data.energySupplyStation.length ||
+  //     res.data.energySupplyStation.length ||
-      res.data.batteryUnit.length
+  //     res.data.batteryUnit.length
-    ) {
+  //   ) {
-      let datanames = [];
+  //     let datanames = [];
 
-      if (res.data.photoVoltaicUnit.length) {
+  //     if (res.data.photoVoltaicUnit.length) {
-        datanames.push({
+  //       datanames.push({
-          name: `光伏(${res.data.photoVoltaicUnit.length})`,
+  //         name: `光伏(${res.data.photoVoltaicUnit.length})`,
-          id: "guangfu",
+  //         id: "guangfu",
-        });
+  //       });
-      }
+  //     }
 
-      resolve(datanames);
+  //     resolve(datanames);
-    } else {
+  //   } else {
-      resolve([{ name: "加载数据", leaf: true }]);
+  //     resolve([{ name: "加载数据", leaf: true }]);
-      console.log(res); //需要将上一级的加号去掉
+  //     console.log(res); //需要将上一级的加号去掉
-    }
+  //   }
-  } else if (node.level === 5) {
+  // }
-    console.log(node.parent, node.level);
+  //  else if (node.level === 5) {
-    //懒加载
+  //  else if (node.level === 4||node.level===5) {
-    let res = await treeSecond({
+  //   console.log(node.parent, node.level);
-      orgID: "8af8470a47aad8e20147aad92e400335",
+  //   //懒加载
-      transformId: node.parent.key,
+  //   let res = await treeSecond({
-      // transformId: "ed7d892d4f8af8514b6dc01fde016ded55e58",
+  //     orgID: "8af8470a47aad8e20147aad92e400335",
-    });
+  //     transformId: node.parent.key,
-    // 二级服务只挂光伏
+  //     // transformId: "ed7d892d4f8af8514b6dc01fde016ded55e58",
+    
+  //   });
+  //   // 二级服务只挂光伏
 
-    if (res.data.photoVoltaicUnit.length) {
+  //   if (res.data.photoVoltaicUnit.length) {
-      resolve(
+  //     resolve(    
-        res.data.photoVoltaicUnit.map((item) => ({
+  //       res.data.photoVoltaicUnit.map((item) => ({
-          id: item.mrid,
+  //         id: item.mrid,
-          name: item.name,
+  //         name: item.name,
-        }))
+  //         type:item.type,  
-      );
+  //       }))
-    }
+  //     );
-
+  //   }
-    // resolve();
+  // } else {
-    // resolve([
+  //   // resolve([{ name: "加载数据", leaf: true }]);
-    //   {
+  // }
-    //     name: `懒加载第${node.level + 1}级` + +new Date(),
-    //     id: `${+new Date()}`,
-    //   },
-    // ]);
-  } else {
-    resolve([{ name: "加载数据", leaf: true }]);
-  }
 };
 
 const emits = defineEmits(["update-node-key"]); ////接收父组件的事件，子组件中触发父组件使用
@@ -177,18 +183,13 @@ const emits = defineEmits(["update-node-key"]); ////接收父组件的事件，
 // 处理选中target数据，最终得到由高层到底层的数组
 const handleTargetInfo = (data: TreeData, node: any) => {
   // console.log(1111111,node);
-  
+
   // targetInfo.resultArr = [];
   // handleTarget(e);
   // 利用设备中的信息调用接口
   // ---------
-  // emits("update-node-key", node); //获取id,用于二级接口服务返回接口给可调资源列表
+  //点中每一层设备树  去返回id到父组件 并让父组件获取可调资源的相关信息和表格
-
+   emits("update-node-key", node); //获取id,用于二级接口服务返回接口给可调资源列表
-  if (node.level === 6) {
-    //点中第4层 为单个光伏时 去返回id到父组件 并让父组件获取可调资源的相关信息和表格
-    emits("update-node-key", node); //获取id,用于二级接口服务返回接口给可调资源列表
-  }
-
   // ---------
 };
 const handleTarget = (node: any) => {
@@ -252,8 +253,8 @@ const handleTarget = (node: any) => {
 
 .tree {
   // height: 1300px;
-  height: changeHeight(980);
+  // height: changeHeight(980);
-  width: changeWidth(901.19);
+  // width: changeWidth(901.19);
   margin-left: changeHeight(56);
 }
 
@@ -389,7 +390,12 @@ const handleTarget = (node: any) => {
 
 // 修改鼠标点击时的颜色以及节点失去焦点时的背景色
 :deep(.el-tree-node:focus > .el-tree-node__content) {
-  background-color: transparent !important;
+  // background-color: transparent !important;
+  background: linear-gradient(
+    90deg,
+    rgba(82, 127, 243, 0.8) 0%,
+    rgba(59, 38, 148, 0) 100%
+  );
 }
 
 :deep(.el-tree-node__content:hover) {
@@ -607,4 +613,5 @@ const handleTarget = (node: any) => {
 //     }
 //   }
 // }
+
 </style>

src/views/commonPage/tree.vue

@@ -1,26 +1,33 @@
 <template>
-  <div class="soureTree">
+  <div class="tree">
-    <!-- <div class="source_label">
+    <el-tree
-          <div class="elec_box_list" v-for="(item, index) in elec_list" :key="index" @click="labelFlag(item.id)"
+      ref="targetTreeRef"
-              :class="[item.id === label_falg ? 'active' : '']">
+      :data="treeData"
-              {{ item.label }}
+      node-key="id"
-          </div>
+      :props="targetProps"
-      </div> -->
+      :default-expanded-keys="['tongxiang']"
-    <div class="source_tree">
+      lazy
-      <div class="tree">
+      :load="loadNode"
-        <el-tree
+      @node-click="handleTargetInfo"
-          ref="targetTreeRef"
+      :expand-on-click-node="false"
-          :data="treeData"
+      empty-text="数据读取中..."
-          node-key="id"
+    >
-          :props="targetProps"
+      <template v-slot:default="{ node }">
-          :default-expanded-keys="['tongxiang']"
+        <div
-          lazy
+          style="
-          :load="loadNode"
+            text-overflow: ellipsis;
-          @node-click="handleTargetInfo"
+            text-align: left;
-          :expand-on-click-node="false"
+            white-space: nowrap;
-          empty-text="数据读取中..." 
+            width: 82%;
-        ></el-tree>
+            overflow: hidden;
-        <!-- <el-tree ref="targetTreeRef" :data="treeData" :highlight-keywords="keyword" :props="props" :load="loadNode" lazy
+          "
+          :title="node.label"
+        >
+          {{ node.label }}
+        </div>
+      </template>
+    </el-tree>
+    <!-- <el-tree ref="targetTreeRef" :data="treeData" :highlight-keywords="keyword" :props="props" :load="loadNode" lazy
         node-key="ID" @node-click="handleNodeClick" :expand-on-click-node="false" empty-text="数据读取中..." v-else>
         <template v-slot:default="{ node }">
           <div :class="`${renderContentColor(node)} cusIcon`"></div>
@@ -28,8 +35,6 @@
             :title="node.label">{{ node.label }}</div>
         </template>
       </el-tree> -->
-      </div>
-    </div>
   </div>
 </template>
 <script setup lang="ts">
@@ -113,139 +118,153 @@ const loadNode = async (node: any, resolve: any) => {
     //   let res= await treeT({
     //   orgID: "8af8470a47aad8e20147aad92e400335",
     // });
-    treeT({
+    let treeData = [];
+    let result = await treeT({
       orgID: "8af8470a47aad8e20147aad92e400335",
-    }).then((res) => {
-      resolve(res.data); //默认加载第1层
     });
-    
+    treeData = result.data;
-  } else if (node.level > 0 && node.level < 4) {
+    resolve(treeData);
+    // treeT({
+    //   orgID: "8af8470a47aad8e20147aad92e400335",
+    // }).then((res) => {
+    //   resolve(res.data); //默认加载第1层
+    // });
+  } else if (node.level > 0 && node.level < 3) {
     //默认展开的层级,需要默认几层就判断一下.
     resolve(node.data.children);
-  } else if (node.level === 4) {
+  } else if (node.level === 3) {
-
+    let result = await treeSecond({
-
-    //懒加载
-    let res = await treeSecond({
       orgID: "8af8470a47aad8e20147aad92e400335",
-      transformId: node.key,
+      mrid: node.key,
     });
-    if (
+    resolve(result.data);
-      res.data.photoVoltaicUnit.length ||
+  } else if (node.level > 3) {
-      res.data.energySupplyStation.length ||
+    resolve(node.data.children);
-      res.data.batteryUnit.length ||
-      res.data.dwellerPile.length
-    ) {
-      let datanames = [];
-      if (res.data.photoVoltaicUnit.length) {
-        datanames.push({
-          name: `光伏(${res.data.photoVoltaicUnit.length})`,
-          id: "guanafu",
-        });
-      }
-      if (res.data.energySupplyStation.length) {
-        datanames.push({
-          name: `充电站(${res.data.energySupplyStation.length})`,
-          id: "chongdianzhan",
-        });
-      }
-      if (res.data.batteryUnit.length) {
-        datanames.push({
-          name: `储能(${res.data.batteryUnit.length})`,
-          id: "chuneng",
-        });
-      }
-      if (res.data.dwellerPile.length) {
-        datanames.push({
-          name: `居民充电桩(${res.data.dwellerPile.length})`,
-          id: "chongdianzhuang",
-        });
-      }
-      resolve(datanames);
-    } else {
-      resolve([{ name: "加载数据", leaf: true }]);
-    }
-  } else if (node.level === 5) {
-    console.log(node.parent, node.level);
-    //懒加载
-    let res = await treeSecond({
-      orgID: "8af8470a47aad8e20147aad92e400335",
-      transformId: node.parent.key,
-      // transformId: "ed7d892d4f8af8514b6dc01fde016ded55e58",
-    });
-    console.log(node, node.parent, "父节点");
-    // 如果父节点为光伏 则返回数据
-    if (node.key === "guanafu") {
-      if (res.data.photoVoltaicUnit.length) {
-        // map转化数组
-        resolve(
-          res.data.photoVoltaicUnit.map((item) => ({
-            id: item.mrid,
-            name: item.name,
-          }))
-        );
-      }
-    }
-    if (node.key === "chongdianzhan") {
-      if (res.data.energySupplyStation.length) {
-        resolve(
-          res.data.energySupplyStation.map((item) => ({
-            id: item.mrid,
-            name: item.name,
-          }))
-        );
-      }
-    }
-    if (node.key === "chongdianzhuang") {
-      if (res.data.dwellerPile.length) {
-        resolve(
-          res.data.dwellerPile.map((item) => ({
-            id: item.mrid,
-            name: item.name,
-          }))
-        );
-      }
-    }
-    if (node.key === "chuneng") {
-      if (res.data.batteryUnit.length) {
-        resolve(
-          res.data.batteryUnit.map((item) => ({
-            id: item.mrid,
-            name: item.name,
-          }))
-        );
-      }
-    }
-
-    // resolve();
-    // resolve([
-    //   {
-    //     name: `懒加载第${node.level + 1}级` + +new Date(),
-    //     id: `${+new Date()}`,
-    //   },
-    // ]);
-  } else {
-    resolve([{ name: "加载数据", leaf: true }]);
   }
+  // else if (node.level > 0 && node.level < 4) {
+  //   //默认展开的层级,需要默认几层就判断一下.
+  //   resolve(node.data.children);
+  // } else if (node.level === 4) {
+  //   //懒加载
+  //   let res = await treeSecond({
+  //     orgID: "8af8470a47aad8e20147aad92e400335",
+  //     transformId: node.key,
+  //   });
+  //   if (
+  //     res.data.photoVoltaicUnit.length ||
+  //     res.data.energySupplyStation.length ||
+  //     res.data.batteryUnit.length ||
+  //     res.data.dwellerPile.length
+  //   ) {
+  //     let datanames = [];
+  //     if (res.data.photoVoltaicUnit.length) {
+  //       datanames.push({
+  //         name: `光伏(${res.data.photoVoltaicUnit.length})`,
+  //         id: "guanafu",
+  //       });
+  //     }
+  //     if (res.data.energySupplyStation.length) {
+  //       datanames.push({
+  //         name: `充电站(${res.data.energySupplyStation.length})`,
+  //         id: "chongdianzhan",
+  //       });
+  //     }
+  //     if (res.data.batteryUnit.length) {
+  //       datanames.push({
+  //         name: `储能(${res.data.batteryUnit.length})`,
+  //         id: "chuneng",
+  //       });
+  //     }
+  //     if (res.data.dwellerPile.length) {
+  //       datanames.push({
+  //         name: `居民充电桩(${res.data.dwellerPile.length})`,
+  //         id: "chongdianzhuang",
+  //       });
+  //     }
+  //     resolve(datanames);
+  //   } else {
+  //     resolve([{ name: "加载数据", leaf: true }]);
+  //   }
+  // } else if (node.level === 5) {
+  //   console.log(node.parent, node.level);
+  //   //懒加载
+  //   let res = await treeSecond({
+  //     orgID: "8af8470a47aad8e20147aad92e400335",
+  //     transformId: node.parent.key,
+  //     // transformId: "ed7d892d4f8af8514b6dc01fde016ded55e58",
+  //   });
+  //   console.log(node, node.parent, "父节点");
+  //   // 如果父节点为光伏 则返回数据
+  //   if (node.key === "guanafu") {
+  //     if (res.data.photoVoltaicUnit.length) {
+  //       // map转化数组
+  //       resolve(
+  //         res.data.photoVoltaicUnit.map((item) => ({
+  //           id: item.mrid,
+  //           name: item.name,
+  //         }))
+  //       );
+  //     }
+  //   }
+  //   if (node.key === "chongdianzhan") {
+  //     if (res.data.energySupplyStation.length) {
+  //       resolve(
+  //         res.data.energySupplyStation.map((item) => ({
+  //           id: item.mrid,
+  //           name: item.name,
+  //         }))
+  //       );
+  //     }
+  //   }
+  //   if (node.key === "chongdianzhuang") {
+  //     if (res.data.dwellerPile.length) {
+  //       resolve(
+  //         res.data.dwellerPile.map((item) => ({
+  //           id: item.mrid,
+  //           name: item.name,
+  //         }))
+  //       );
+  //     }
+  //   }
+  //   if (node.key === "chuneng") {
+  //     if (res.data.batteryUnit.length) {
+  //       resolve(
+  //         res.data.batteryUnit.map((item) => ({
+  //           id: item.mrid,
+  //           name: item.name,
+  //         }))
+  //       );
+  //     }
+  //   }
+
+  //   // resolve();
+  //   // resolve([
+  //   //   {
+  //   //     name: `懒加载第${node.level + 1}级` + +new Date(),
+  //   //     id: `${+new Date()}`,
+  //   //   },
+  //   // ]);
+  // } else {
+  //   resolve([{ name: "加载数据", leaf: true }]);
+  // }
 };
 
 const emits = defineEmits(["update-node-key"]); ////接收父组件的事件，子组件中触发父组件使用
 
 // 点击树节点
 // 处理选中target数据，最终得到由高层到底层的数组
-const handleTargetInfo = (data: TreeData,  node: any) => {
+const handleTargetInfo = (data: TreeData, node: any) => {
   // targetInfo.resultArr = [];
 
-  console.log("点击的节点",node);
+  console.log("点击的节点", node);
+
+  if (node.level === 4 || node.level === 3) {
+    console.log(node.level, "0000", node.key);
 
-  if (node.level === 4||node.level===3) {
-    console.log(node.level,'0000',node.key);
-    
     console.log("zheshishaya");
     //点中第4层 为台区时 去返回id到父组件 并让父组件获取可调资源的相关信息和表格
     // emits("update-node-key", node.key); //获取id,用于二级接口服务返回接口给可调资源列表
     emits("update-node-key", node); //获取id,用于二级接口服务返回接口给可调资源列表
-
   }
 };
 const handleTarget = (node: any) => {
@@ -309,8 +328,8 @@ const handleTarget = (node: any) => {
 
 .tree {
   // height: 1300px;
-  height: changeHeight(980);
+  // height: changeHeight(980);
-  width: changeWidth(901.19);
+  // width: changeWidth(901.19);
   margin-left: changeHeight(56);
 }
 

src/views/layout/header.vue

@@ -202,6 +202,7 @@ const styleVar = computed(() => {
 @function changeHeight($height) {
   @return calc(var(--box-height) * ($height / 2160));
 }
+// 上海院分辨率 3840*1080
 
 p {
   margin-bottom: 0;
@@ -445,4 +446,20 @@ p {
 .nav_content .nav_list .nav_right .activeNav {
   color: #ffe560;
 }
+/* 针对3840x1080分辨率的样式 */
+@media screen and (min-width: 3840px) and (max-height: 2150px) {
+  .header {
+    height: changeHeight(246);
+  }
+  .pdding_box {
+    height: changeHeight(186);
+  }
+  .header-logo{
+    .img1 {
+    width: changeWidth(400.84);
+    // height: changeHeight(64.32);
+    margin-left: changeWidth(72);
+  }
+  }
+}
 </style>

src/views/layout/index.vue

@@ -181,6 +181,7 @@ const styleVar = computed(() => {
   @return calc(var(--box-height) * ($height / 1440));
 }
 
+
 .bigscreen {
   width: 100%;
   height: 100vh;
@@ -207,6 +208,7 @@ const styleVar = computed(() => {
 
 .header_layout {
   /* height: 186px; */
+  height: changeHeight(186);
   width: 100%;
   position: absolute;
   top: 0;
@@ -256,9 +258,13 @@ const styleVar = computed(() => {
   flex: 1;
   margin-top: 4.5%;
 }
-// @media screen and (max-width:1920px) {
+/* 针对3840x1080分辨率的样式 */
-//     .main {
+@media screen and (min-width: 3840px) and (max-height: 2150px) {
-//       margin-top: 6%;
+  .main {
-//     }
+  /* margin-top: 7.8125rem; */
-// }
+  flex: 1;
+  margin-top: 3%;
+}
+}
+
 </style>

src/views/pages/carPage/index.vue

@@ -79,10 +79,7 @@
 
                 <div class="info2_m">
                   <div class="top1_box">
-                    <img
+                    <img src="@/assets/images/v2-1/store_taiqu.png" alt="" />
-                      src="@/assets/images/v2-1/store_taiqu.png"
-                      alt=""
-                    />
                     <div class="left1_box">
                       <div class="name">
                         <div class="cen">
@@ -442,7 +439,7 @@
                 >下发指令</el-button
               >
               <div class="send_box" v-else>
-                <span class="fs45">发送中</span> 
+                <span class="fs45">发送中</span>
                 <div class="loading-dots">
                   <span>.</span>
                   <span>.</span>
@@ -792,11 +789,11 @@ const submitForm = () => {
     startTime: datat_start,
     endTime: datat_end,
   };
-  const randomDelay=getRandomInt(2000,5000)//取2000-5000ms之间的随机数
+  const randomDelay = getRandomInt(2000, 5000); //取2000-5000ms之间的随机数
   setTimeout(() => {
-    send_Status.value=false
+    send_Status.value = false;
-   
+
-    ajustCarPageFlag.value=false
+    ajustCarPageFlag.value = false;
 
     ElMessage({
       showClose: true,
@@ -804,9 +801,9 @@ const submitForm = () => {
       type: "success",
     });
   }, randomDelay);
-  
+
   // setTimeout(() => {
-    
+
   // }, 3000);
   // send_Status.value=false
   ajustInfo_api(datainput).then((res: any) => {
@@ -1132,8 +1129,9 @@ const styleVar = computed(() => {
       .car_left_box {
         margin-top: changeHeight(30);
         width: 100%;
+       // width: changeHeight(961.19);
         height: changeHeight(1679.23); //内容高度
-        display: flex;
+        // display: flex;
         // align-items: center;
         // flex-direction: column;
       }

src/views/pages/pvPage/index.vue

@@ -1,6 +1,6 @@
-<!-- 光伏页面 -->
 
 <template>
+  <!-- 光伏页面 -->
   <div class="pvPage_container" :style="styleVar">
     <div class="content_left">
       <div
@@ -29,7 +29,7 @@
           <div class="tree_box content_bg">
             <tree
               @update:nodeValue="updatePvechart"
-              v-mode="tree_node"
+              v-model="tree_node"
               @update-node-key="getTreeNode"
             ></tree>
           </div>
@@ -142,23 +142,38 @@
                 </div>
               </div>
             </div>
-            <div class="infotitle"><span>实时发电量曲线</span></div>
+            <div class="infotitle">
+              <span>实时发电量曲线</span>
+              <div class="timeBox">
+                <el-date-picker
+                  class="customPicker"
+                  popper-class="customDatePicker"
+                  type="date"
+                  v-model="selectDataCurves"
+                  @change="selectDateCurvesChange"
+                  format="YYYY-MM-DD"
+                  value-format="YYYY-MM-DD"
+                />
+              </div>
+            </div>
             <div class="info2">
               <powerLine
                 :cur_pvArr="cur_pvArr"
                 v-if="cur_pvArrFlag"
-                :key="refreshkey"
+                :key="refreshkey_Curves"
               ></powerLine>
             </div>
             <div class="infotitle">
               <span>实时功率曲线</span>
               <div class="timeBox">
                 <el-date-picker
-                
+                  class="customPicker"
-                  v-model="value1"
+                  popper-class="customDatePicker"
                   type="date"
-                  placeholder="Pick a date"
+                  v-model="selectDataPv"
-                  :default-value="new Date(2010, 9, 1)"
+                  @change="selectDatePvChange"
+                  format="YYYY-MM-DD"
+                  value-format="YYYY-MM-DD"
                 />
               </div>
             </div>
@@ -175,7 +190,7 @@
               </div> -->
               <rateLine
                 :pvArr="pvArr"
-                v-if="pvArrFlag"
+                v-if="refreshkey_pv"
                 :key="refreshkey"
               ></rateLine>
             </div>
@@ -231,6 +246,7 @@ import {
   getCurrentInstance,
   inject,
 } from "vue";
+
 import { ElMessage } from "element-plus";
 import { getColorFun } from "@/hooks/getColorFun/index";
 import { app_load, api_send, api_register } from "@/ue4Player/app";
@@ -238,84 +254,120 @@ import tree from "@/views/commonPage/pvTree.vue";
 import powerLine from "./powerLine.vue";
 import rateLine from "./rateLine.vue";
 import timePvLine from "./timePvLine.vue";
+import { getNowDate } from "@/hooks/getDate";
 import { useNow, useDateFormat } from "@vueuse/core";
 import { id } from "element-plus/es/locale/index.mjs";
-import { curpower_api } from "@/api/pvPage/pvApi";
+import { curpower_api, pvCurInfo_api } from "@/api/pvPage/pvApi";
 import { pvApi } from "@/api/Osp/svgApi";
-
+import { log } from "echarts/types/src/util/log.js";
+let citySourceId = "8af8470a47aad8e20147aad92e400335";
 onMounted(() => {
-  let Objinput = { orgID: "8af8470a47aad8e20147aad92e400335" }; //全部 获取光伏实时发电量
+  getpvCurInfo({ orgID: citySourceId }) //获取光伏信息 有城南id可得
-  getCurves(Objinput); //获取城南的接口{orgID}
+  getCurves({ orgID: citySourceId }); //获取光伏的接口发电量 有城南id可得
-  let inputdata = { mrid: "03DKX-24289" };
+  getpv({ orgID: citySourceId }); //光伏功率曲线 有城南id可得
-  getpv(inputdata); //光伏功率曲线
 });
 
-const getTreeNode = (treeNode: any) => {
-  let Objinput = {
-    orgID: "8af8470a47aad8e20147aad92e400335",
-    mrid: treeNode.key,
-  }; //全部 获取光伏实时发电量
 
-  getCurves(Objinput); //获取光伏的接口发电量
+let treeNodeId:any=ref(null) //节点id
-  let inputdata = { mrid: treeNode.key };
+//设备树节点操作模块
-  getpv(inputdata);
+const getTreeNode = (treeNode: any) => {
+  // console.log('设备树的节点',treeNode)
+  treeNodeId.value=treeNode.data //将设备树节点保存起来
+  
 };
-// 当日累计发电量
+watch(() => treeNodeId.value,()=>{
+  refreshkey_pv.value+=1
+  refreshkey_Curves.value += 1;
+  console.log('设备树节点修改后监听事件',treeNodeId.value);
+  //通过设备树节点id获取数据 
+  let apipv={ orgID: citySourceId,type:treeNodeId.value.type,mrid:treeNodeId.value.id }
+  getpvCurInfo(apipv) //获取光伏信息  入参orgID、type和id
+  getCurves(apipv); //获取光伏的接口发电量 
+  getpv(apipv);//光伏功率曲线
+})
+
+// 模块1 光伏实时信息
+const getpvCurInfo = (datares: any) => {
+  console.log(datares,'pv');
+  
+  pvCurInfo_api(datares)
+    .then((res) => {
+      //实时量测信息
+      if (res.data) {
+        if (res.data.total) {
+          total_cur.value = Number(res.data.total).toFixed(2);
+        }
+        if (res.data["380V"]) {
+          power380V.value = Number(res.data["380V"]).toFixed(2);
+        }
+        if (res.data["35kV"]) {
+          power35kv.value = Number(res.data["35kV"]).toFixed(2);
+        }
+        if (res.data["10kV"]) {
+          power10kv.value = Number(res.data["10kV"]).toFixed(2);
+        }
+      }
+    })
+    .catch();
+};
+
+//模块2 当日累计发电量
 let total_cur = ref("0");
 let power35kv = ref("0");
 let power10kv = ref("0");
 let power380V = ref("0");
 let cur_pvArrFlag = ref(false);
 let cur_pvArr = reactive([]);
+let selectDataCurves = ref(getNowDate()); //发电量曲线日期框绑定值
+let  refreshkey_Curves=ref(0)
 // 获取光伏实时发电量
 const getCurves = (datares: any) => {
   curpower_api(datares)
     .then((res) => {
-      console.log("res", res);
+      refreshkey_Curves.value += 1;
-      //实时量测信息
-      if (res.data) {
-        if (res.data.total) {
-          total_cur.value = res.data.total;
-        }
-        if (res.data["380V"]) {
-          power380V.value = res.data["380V"];
-        }
-        if (res.data["35kV"]) {
-          power35kv.value = res.data["35kV"];
-        }
-        if (res.data["10kV"]) {
-          power10kv.value = res.data["10kV"];
-        }
-      }
       // 发电量曲线
-      if (res.data.data) {
+      if (res.data) {
         cur_pvArrFlag.value = true;
-        cur_pvArr = res.data.data;
+        cur_pvArr = res.data;
       }
     })
     .catch((error) => {
       console.log(error);
     });
 };
+//发电量按日期历史查询功能
+const selectDateCurvesChange = (val: any) => {
+  // selectDataCurves.value = val;
+  getCurves({ orgID: citySourceId,date:val }); //获取光伏的接口发电量
+};
+
 let pvArr = reactive([]); //光伏
 let pvArrFlag = ref<boolean>(false);
-// 获取光伏功率曲线
+let selectDataPv = ref(getNowDate()); //功率曲线日期框绑定值
-// let refreshkey=ref(1)
+
+//模块3 获取光伏功率曲线
+let refreshkey_pv=ref(1)
 const getpv = (inputdata: any) => {
   pvApi(inputdata).then((res) => {
-    console.log(res, "respv");
     pvArr = res.data;
-    console.log(pvArr, "pvArr");
     refreshkey.value += 1;
     if (pvArr.length > 0) {
       pvArrFlag.value = true;
     }
   });
 };
+//光伏按日期历史查询功能
+const selectDatePvChange = (val: any) => {
+  console.log(val, "日期框修改值");
+  refreshkey_pv.value+=1
+  getpv({ orgID: citySourceId,data: val })
+};
 
 const HMS = useDateFormat(useNow(), "HH:mm:ss"); //当前时间
 const YMD = useDateFormat(useNow(), "YYYY-MM-DD"); //当前日期
 
+
+
 // 左侧------------------------------------------------
 
 // 设备树标识
@@ -706,7 +758,7 @@ const styleVar = computed(() => {
         box-sizing: border-box;
         .infotitle {
           position: relative;
-       
+
           width: 90%;
           height: changeHeight(50);
           line-height: changeHeight(50);
@@ -719,11 +771,10 @@ const styleVar = computed(() => {
           span {
             margin-left: 7%;
           }
-          .timeBox{
+          .timeBox {
             position: absolute;
-            right: 2%;
+            right: 3%;
           }
-
         }
         .info1 {
           height: changeHeight(359);
@@ -828,6 +879,7 @@ const styleVar = computed(() => {
         .info3 {
           width: 90%;
           height: changeHeight(600);
+         
           position: relative;
           .btnList {
             z-index: 6;
@@ -988,5 +1040,9 @@ const styleVar = computed(() => {
       }
     }
   }
+  :deep(.el-input__wrapper) {
+    background-color: transparent !important;
+    border-radius: 0 0 0 0 !important;
+  }
 }
 </style>

src/views/pages/pvPage/powerLine.vue

@@ -13,6 +13,7 @@ import {
 } from "vue";
 import transformFontSize from "@/hooks/transFormSize.ts";
 import "echarts/lib/component/dataZoom";
+import { pa } from "element-plus/es/locales.mjs";
 onMounted(() => {
   drawOneLine(props.cur_pvArr);
 });
@@ -46,7 +47,7 @@ const drawOneLine = (arr: any) => {
         let str = `
           <div style="width:100%:height:100%">
             <div style="display:flex;justify-content:space-between;"> ${
-              param[0].name.split(" ")[0]
+              param[0].name
             }</div>
             ${getDom(param)}
           </div>`;
@@ -80,7 +81,7 @@ const drawOneLine = (arr: any) => {
       },
     },
     grid: {
-      top: "25%",
+      top: "15%",
       left: "8%",
       right: "8%",
       bottom: "13%",
@@ -96,9 +97,10 @@ const drawOneLine = (arr: any) => {
         color: "#fff",
         fontSize: transformFontSize(35),
         padding: [0, 0, 0, 30],
-        // formatter: function (param: any) {
+        formatter: function (param: any) {
-        //   return param.split(' ')[1].split(':')[0] + ':' + param.split(' ')[1].split(':')[1]
+           let paramspit=param.split(' ')
-        // },
+            return paramspit[0] + "\n" + paramspit[1]; // 双行显示，\n 换行
+          },
       },
       // data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
       data: arr.map((rtime) => rtime?.timeStamp),

src/views/pages/pvPage/rateLine.vue

@@ -65,7 +65,7 @@ const drawOneLine = (arr:any) => {
       },
     },
     legend: {
-      top: "0%",
+      top: "5%",
       right: "5%",
       orient: "vertical",
       // data: ["实时功率", "短期预测功率", "超短期预测功率"],
@@ -80,7 +80,7 @@ const drawOneLine = (arr:any) => {
       },
     },
     grid: {
-      top: "25%",
+      top: "15%",
       left: "8%",
       right: "8%",
       bottom: "13%",

vite.config.ts

@@ -90,8 +90,9 @@ export default defineConfig({
       "/api": {
         // target: "http://192.168.43.48:8080",
         // 测试地址 gu
-        target: "http://192.168.18.109:8080",
+        // target: "http://192.168.18.105:8080",
-
+        // target: "http://127.0.0.1:5173",
+        target: "http://localhost:18082",
         // 天津地址
         // target:"http://192.168.5.102:18801",
         changeOrigin: true,
@@ -101,9 +102,10 @@ export default defineConfig({
         secure: false,
       },
       "/api-svg": {
-        // target: "http://127.0.0.1:19081",
+        // target: "http://127.0.0.1:5173",
+        target: "http://localhost:18082",
         // 测试地址 gu
-        target: "http://192.168.18.109:8080",
+        // target: "http://192.168.18.105:8080",
         // 天津地址
         // target:"http://192.168.5.102:18801",
         changeOrigin: true,
@@ -113,9 +115,10 @@ export default defineConfig({
         secure: false,
       },
       "/api_car": {
-        // target: "http://127.0.0.1:16091",
+        // target: "http://127.0.0.1:5173",
+        target: "http://localhost:18082",
         // 测试地址 gu
-        target: "http://192.168.18.109:8080",
+        // target: "http://192.168.18.105:8080",
         // 天津地址
         // target:"http://192.168.5.102:18801",
         changeOrigin: true,
@@ -125,7 +128,7 @@ export default defineConfig({
         secure: false,
       },
       // "/ba-api": {
-      //   // target: "http://localhost:8080",
+       // target: "http://localhost:8080",
       //    // 桐乡地址
       //   // target:"http://localhost:8999",
       //   // 局域网工作站地址