策略导入执行过程、结果

psdc-ui/src/views/analyse/nhdb/index.vue

@@ -1,20 +1,23 @@
 <template>
   <div class="app-container home">
-    <el-card class="box-card" v-for="item in data.celueInfoList">
+    <div class="overflow">
-      <template #header>
+      <el-card class="box-card" v-for="item in data.celueInfoList">
-        <div class="card-header">
+        <template #header>
-          <img :src="imgSrc" alt="">
+          <div class="card-header">
-          <span>{{item.sceneName}}</span>
+            <img :src="imgSrc" alt="">
+            <span>{{item.sceneName}}</span>
+          </div>
+        </template>
+        <div class="text item">
+          <el-form :inline="true" :model="item.data" label-width="110px">
+            <el-form-item v-for="items in item.data" :key="items.key" :label="items.label">
+              <el-input v-model="items.startTime" readonly/>
+            </el-form-item>
+          </el-form>
+<!--          <div class="echart"></div>-->
         </div>
-      </template>
+      </el-card>
-      <div class="text item">
+    </div>
-        <el-form :inline="true" :model="item.data" label-width="110px">
-          <el-form-item v-for="items in item.data" :key="items.key" :label="items.label">
-            <el-input v-model="items.startTime" readonly/>
-          </el-form-item>
-        </el-form>
-      </div>
-    </el-card>
   </div>
 </template>
 
@@ -39,34 +42,36 @@ const data = reactive({
         },
         {
           key: 3,
-          label:'执行时长',
+          label:'执行前室内温度',
-          startTime:'3h'
+          startTime:'20℃'
         },
         {
           key: 4,
-          label:'单位时间用电',
+          label:'执行前室外温度',
-          startTime:'5kWh'
+          startTime:'14℃'
         },
         {
           key: 5,
-          label:'执行前室内温度',
+          label:'执行后室内温度',
-          startTime:'20℃'
+          startTime:'29℃'
         },
         {
           key: 6,
-          label:'执行前室外温度',
+          label:'执行后室外温度',
-          startTime:'14℃'
+          startTime:'15℃'
         },
         {
           key: 7,
-          label:'执行后室内温度',
+          label:'执行时长',
-          startTime:'29℃'
+          startTime:'3h'
         },
+        {},
         {
           key: 8,
-          label:'执行后室外温度',
+          label:'单位时间用电',
-          startTime:'15℃'
+          startTime:'5kWh'
         },
+        {},
         {
           key: 9,
           label:'总用电量',
@@ -89,34 +94,36 @@ const data = reactive({
         },
         {
           key: 3,
-          label:'执行时长',
+          label:'执行前室内温度',
-          startTime:'2h'
+          startTime:'22℃'
         },
         {
           key: 4,
-          label:'单位时间用电',
+          label:'执行前室外温度',
-          startTime:'6kWh'
+          startTime:'15℃'
         },
         {
           key: 5,
-          label:'执行前室内温度',
+          label:'执行后室内温度',
-          startTime:'22℃'
+          startTime:'30℃'
         },
         {
           key: 6,
-          label:'执行前室外温度',
+          label:'执行后室外温度',
           startTime:'15℃'
         },
         {
           key: 7,
-          label:'执行后室内温度',
+          label:'执行时长',
-          startTime:'30℃'
+          startTime:'2h'
         },
+        {},
         {
           key: 8,
-          label:'执行后室外温度',
+          label:'单位时间用电',
-          startTime:'15℃'
+          startTime:'6kWh'
         },
+        {},
         {
           key: 9,
           label:'总用电量',
@@ -125,52 +132,54 @@ const data = reactive({
       ]
     },
     {
-      sceneName:'电磁锅炉水蓄热策略',
+      sceneName:'空气源热泵供暖策略',
       data:[
         {
           key: 1,
           label:'开始执行时间',
-          startTime:'2023-06-05 08:00:00'
+          startTime:'2023-06-05 11:00:00'
         },
         {
           key: 2,
           label:'结束执行时间',
-          startTime:'2023-06-05 12:00:00'
+          startTime:'2023-06-05 13:00:00'
         },
         {
           key: 3,
-          label:'执行时长',
+          label:'执行前室内温度',
-          startTime:'4h'
+          startTime:'22℃'
         },
         {
           key: 4,
-          label:'单位时间用电',
+          label:'执行前室外温度',
-          startTime:'5kWh'
+          startTime:'15℃'
         },
         {
           key: 5,
-          label:'执行前室内温度',
+          label:'执行后室内温度',
-          startTime:'16℃'
+          startTime:'30℃'
         },
         {
           key: 6,
-          label:'执行前室外温度',
+          label:'执行后室外温度',
-          startTime:'13℃'
+          startTime:'15℃'
         },
         {
           key: 7,
-          label:'执行后室内温度',
+          label:'执行时长',
-          startTime:'26℃'
+          startTime:'2h'
         },
+        {},
         {
           key: 8,
-          label:'执行后室外温度',
+          label:'单位时间用电',
-          startTime:'16℃'
+          startTime:'6kWh'
         },
+        {},
         {
           key: 9,
           label:'总用电量',
-          startTime:'20kWh'
+          startTime:'12kWh'
         }
       ]
     },
@@ -180,10 +189,13 @@ const data = reactive({
 </script>
 
 <style scoped lang="scss">
-.home{
+.overflow{
   display: flex;
   justify-content: flex-start;
   flex-wrap: wrap;
+  width: 100%;
+  max-height: 835px;
+  overflow-y: auto;
 }
 .box-card {
   width: 720px;
@@ -204,9 +216,15 @@ const data = reactive({
     font-size: 14px;
   }
   .item {
-    margin-bottom: 18px;
+    //margin-bottom: 18px;
   }
 }
+.echart{
+  width: 50px;
+  height: 100px;
+  display: inline-flex;
+  vertical-align: middle;
+}
 ::v-deep .el-card__header{
   padding: 0px 0px 0px 10px !important;
   background-color: #374590;
@@ -227,5 +245,12 @@ const data = reactive({
 ::v-deep .el-form .el-form-item__label{
   color: #d3d3d3 !important;
 }
+::v-deep .el-form-item--default{
+  margin-bottom: 0px;
+}
+::v-deep .el-card{
+  background-color: #2F3D8A;
+  height: 260px;
+}
 </style>
 

psdc-ui/src/views/control/manual/index.vue

@@ -355,10 +355,6 @@ const SenceControlArr = ref([])
 let celueItem;
 function selectCeLue(item){
   celueItem = item
-  // for(let i = 0;i < item.flow.length;i++){
-  //   item.flow[i].type = 'primary'
-  // }
-
   // //拼数组对象
   // //1、
   // let dataArr = [];
@@ -388,6 +384,24 @@ function selectCeLue(item){
   // // console.log(JSON.stringify(dataArr, null, 4));
   // SenceControlArr.value = JSON.stringify(dataArr, null, 4)
 }
+
+//执行另一个策略将所有策略的icon和type清空
+function clearLastCelue(){
+  celueList.value.forEach((celue) => {
+    celue.flow.forEach((flow) => {
+      flow.icon = ''
+      flow.type = ''
+    })
+  })
+  celueItem.flow.forEach((flow) => {
+    flow.icon = flow.icon || ''
+    flow.type = flow.type || ''
+  })
+  console.log('qqqqqq',celueItem)
+}
+// const getIcon = (item) => { return item.icon || '' }
+// const getType = (item) => { return item.type || '' }
+
 //执行
 function confirmClick() {
   if(SenceControlArr.value.length != 0){
@@ -408,6 +422,7 @@ function confirmClick() {
 
       getSenceControl(SenceControlArr.value).then((res)=>{
         if(res.code == 200){
+          clearLastCelue()
           //执行过程
           function setFlowItem(i) {
             if (i >= celueItem.flow.length) {
@@ -702,6 +717,11 @@ function getSetTemperatureFun(item){
 }
 ::v-deep .el-radio{
   display: inline-block;
+  transition: all .1s;
+  &:hover{
+    box-shadow: 1px 1px 10px rgba(0,0,0,.3);
+    transform: scale(1.005);
+  }
 }
 ::v-deep .el-drawer__body{
   overflow-x: hidden;