zhulizhen 5 vuotta sitten
vanhempi
commit
8c2cdf0a91

BIN
src/assets/close.png


BIN
src/assets/open.png


+ 1 - 0
src/views/audit/index.vue

@@ -373,6 +373,7 @@ export default {
       }
     }
     .opinion {
+      box-sizing: border-box;
       width: 100%;
       background: rgba(247, 249, 250, 1);
       box-shadow: 0px -1px 8px 0px rgba(0, 0, 0, 0.08);

+ 173 - 53
src/views/strategy/animationBox.vue

@@ -1,29 +1,45 @@
 <template>
 <div class="an-content">
-      <div class="an-box">
-            <div class="an-box-1">
-                <span class="span2">数据传输情况</span>
-                 <el-tag
-                    v-for="item in items"
-                    :key="item.label"
-                    :type="item.type"
-                    closable
-                    effect="dark">
-                    {{ item.label }}
-                </el-tag>
-            </div>
-            <div class="an-box-1">
-                <span class="span2">实际冷量</span> {{data.nowPlantLoad || 0}} kw <span class="span1"><span class="span2">未来1小时预测冷量 </span>{{data.predictedLoad1h || 0}} kw</span>
-            </div>
-      </div>
-      <div class="an-center">
-          <bom-box></bom-box>
-      </div>
+       <div class="snapshotss-center2">
+        <div class="snapshotss-cont2-box1 MicrYaHei">
+            <span>数据传输情况</span>
+             <span :class="data.isExecuted==1?'span1':'span2'" >
+                能耗
+                <img v-if="data.energyErrorFlag==1" src="../../assets/finish.png" alt />
+                <img v-else src="../../assets/wrong.png" alt />
+                </span>
+                <span :class="data.isExecuted==1?'span1':'span2'" >
+                环境
+                <img v-if="data.environmentErrorFlag==1" src="../../assets/finish.png" alt />
+                <img v-else src="../../assets/wrong.png" alt />
+                </span>
+                <span :class="data.isExecuted==1?'span1':'span2'">
+                BA
+                <img v-if="data.baErrorFalg==1" src="../../assets/finish.png" alt />
+                <img v-else src="../../assets/wrong.png" alt />
+                </span>
+        </div>
+        <div class="snapshotss-cont2-box2 MicrYaHei">
+            <span>实际冷量</span>
+            <span>{{data.nowPlantLoad || 0}} KW</span>
+            <span>未来1小时预测冷量</span>
+            <span>{{data.predictedLoad1h || 0}} KW</span>
+        </div>
+        </div>
       <div class="an-bottom">
           <div id="leftLine" style="width:574px;height:350px;margin-right:;24px;">
           </div>
           <div id="rightLine" style="width:573px;height:350px;"></div>
       </div>
+
+      <div class="side-r" v-if="data.isExecuted!=0">
+          <div v-if="!showDraw" class="float-r" @click="showDraw = true">
+              <img src="../../assets/open.png" alt="">
+              <p>当前策略</p>
+          </div>
+      </div>
+
+      <bom-box :class="['draw', {'open': showDraw}]" :data='data' @close="showDraw = false"></bom-box>
 </div>
   
 </template>
@@ -34,17 +50,36 @@ import bomBox from './bomBox'
 export default {
     data(){
         return{
-            items: [
-                { type: 'success', label: '能耗' },
-                { type: 'success', label: '环境' },
-                { type: 'danger', label: 'BA' },
-               
-            ]
+            showDraw: false,
+            dataX:[],
+            dataY1:[],
+            dataY2:[],
+            dataY3:[],
+            loadX:[],
+            loadY1:[],
+            loadY2:[],
+            loadY3:[]
         }
     },
     components:{bomBox},
     props:['data'],
     methods:{
+        getData(){
+            let chillerList = this.data.chillerHourList ? this.data.chillerHourList:[]
+            chillerList.forEach(el=>{
+                el.value = el.time.slice('0,2')+':'+el.time.slice('2,4')
+                this.dataX .push(el.value)
+                this.loadX.push(el.value)
+                this.dataY1.push(el.tout)
+                this.dataY2.push(el.meanTindoor)
+                this.dataY3.push(el.maxTindoor)
+                this.loadY1.push(el.nowPlantLoad)
+                this.loadY2.push(el.predictedLoadUpLimit)
+                this.loadY3.push(el.redictedLoadDownLimit)
+            })
+            this.drawLeft()
+            this.drawRight()
+        },
         drawLeft(){
              var leftLine = echarts.init(document.getElementById('leftLine'))
              let option = {  
@@ -64,7 +99,7 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: ['00:00','03:00','06:00','09:00','12:00','15:00','18:00','21:00','24:00'],
+                    data: this.dataX,
                 },
                 yAxis: {
                     type: 'value'
@@ -74,19 +109,19 @@ export default {
                         name: '室外温度',
                         type: 'line',
                         stack: '总量',
-                        data: [120, 132, 101, 134, 90, 230, 210,112,150,]
+                        data: thus.dataY1
                     },
                     {
                         name: '室内平均温度',
                         type: 'line',
                         stack: '总量',
-                        data: [220, 182, 191, 234, 290, 330, 310,220,280]
+                        data: this.dataY2
                     },
                     {
                         name: '室内最高温度',
                         type: 'line',
                         stack: '总量',
-                        data: [150, 232, 201, 154, 190, 330, 410,300,340]
+                        data: this.dataY3
                     },
                 
                 ]
@@ -123,12 +158,10 @@ export default {
                 },
                 xAxis: {
                     type: 'category',
-                    data: ['00:00','03:00','06:00','09:00','12:00','15:00','18:00','21:00','24:00'],
+                    data: this.loadX,
                     
                 },
                 yAxis: {
-                    
-                   
                     splitNumber: 3,
                     splitLine: {
                         show: false
@@ -137,7 +170,7 @@ export default {
                 series: [{
                     name: 'L',
                     type: 'line',
-                    data: [20,30,40,50,60,50,40,30,20],
+                    data: this.loadY1,
                     lineStyle: {
                         opacity: 0
                     },
@@ -146,7 +179,7 @@ export default {
                 }, {
                     name: 'U',
                     type: 'line',
-                    data: [20,30,50,60,50,40,30,20,40],
+                    data: this.loadY2,
                     lineStyle: {
                         opacity: 0
                     },
@@ -157,7 +190,7 @@ export default {
                     symbol: 'none'
                 }, {
                     type: 'line',
-                    data: [20,30,40,50,60,40,30,20,50],
+                    data: thus.loadY3,
                     hoverAnimation: false,
                     symbolSize: 6,
                     itemStyle: {
@@ -169,37 +202,124 @@ export default {
             },
     },
     mounted(){
-        this.drawLeft()
-        this.drawRight()
+        if(this.data.chillerHourList ){
+            this.getData()
+        }
     }
 }
 </script>
 
 <style lang='scss' scoped>
 .an-content{
-    .an-box{
-        display:flex;
-        justify-content:space-between;
-        margin-top: 20px;
-        .an-box-1{
+   .snapshotss-center2 {
+        padding: 20px 0;
+        margin-bottom: 44px;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        .snapshotss-cont2-box1,
+        .snapshotss-cont2-box2 {
             flex:1;
-            border:1px dashed #ccc;
-            padding-top: 30px;
+            height: 80px;
+            background: url("../../assets/copy.png");
+            background-size: 100% 100%;
+            display: flex;
+            align-items: center;
             padding-left: 24px;
-            padding-bottom:30px;
-            background: #F8F9FA;
+        }
+        .snapshotss-cont2-box1 {
+            
             margin-right: 12px;
-            .span2{
-                color: #646C73;
+        span:nth-of-type(1) {
+            height: 22px;
+            font-size: 14px;
+            color: rgba(100, 108, 115, 1);
+            line-height: 19px;
+            margin-right: 20px;
+        }
+        span:not(:first-child) {
+            height: 28px;
+            background: rgba(255, 255, 255, 1);
+            border-radius: 16px;
+            font-size: 14px;
+            color: rgba(31, 36, 41, 1);
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding: 0 6px 0 12px;
+            margin-right: 20px;
+            img {
+            width: 20px;
+            height: 20px;
+            margin-left: 8px;
+            }
+        }
+        .span1 {
+            border: 1px solid rgba(52, 199, 36, 1);
+        }
+        .span2 {
+            border: 1px solid rgba(245, 78, 69, 1);
+        }
+        }
+        .snapshotss-cont2-box2 {
+        span:nth-of-type(1),
+        span:nth-of-type(3) {
+            height: 22px;
+            font-size: 14px;
+            color: rgba(100, 108, 115, 1);
+            line-height: 19px;
+            margin-right: 16px;
+        }
+        span:nth-of-type(2),
+        span:nth-of-type(4) {
+            height: 32px;
+            font-size: 24px;
+            font-family: Persagy;
+            color: rgba(31, 36, 41, 1);
+            line-height: 29px;
+            margin-right: 64px;
+        }
+        span:nth-of-type(3) {
+            margin-right: 16px;
+        }
+        }
+    }
+    .side-r {
+        position: fixed;
+        right: 0;
+        top: 50%;
+        transform: translateY(-50%);
+        box-shadow:0px 0px 8px 0px rgba(0,0,0,0.1);
+        background: #ffffff;
+        display: flex;
+        .float-r {
+            display: flex;
+            align-items: center;
+            padding: 60px 40px 60px 10px;
+            cursor: pointer;
+            img {
+                height: 10px;
                 margin-right: 10px;
             }
-            .span1{
-                margin-left:64px;
+            p {
+                width: 0;
             }
-        }  
+            &:hover {
+                background: #efefef;
+            }
+        }
     }
-    .an-center{
-        display: none;
+    .draw {
+        position: fixed;
+        left: 100%;
+        top: 50%;
+        transform: translateY(-50%);
+        box-shadow:0px 0px 8px 0px rgba(0,0,0,0.1);
+        background: #ffffff;
+        transition: transform 0.3s ease-in-out;
+        &.open {
+            transform: translate(-100%,-50%);
+        }
     }
     .an-bottom{
         margin-top: 45px;

+ 107 - 34
src/views/strategy/bomBox.vue

@@ -1,5 +1,8 @@
 <template>
   <div class="bomb">
+    <div  class="close" @click="$emit('close')">
+        <img src="../../assets/close.png" alt="">
+    </div>
     <div class="bomb-left">
         <div class="bomb-left1">当前策略</div>
         <div class="bomb-left2">应执行时间 {{data.executeTime || '--'}}-{{data.pushTime || '--'}}</div>
@@ -7,20 +10,33 @@
         <div id='circleEcharts' style="width:104px;height:104px"></div>
     </div>
     <div class="bomb-right">
-       <water-unit></water-unit>
-        <div class="bomb-right-center">
-           <span>数据传输情况</span>
-            <el-tag
-                    v-for="item in items"
-                    :key="item.label"
-                    :type="item.type"
-                    closable
-                    effect="dark">
-                    {{ item.label }}
-                </el-tag>
-            <span class="bomb-span1">实际冷量 <span class="bomb-span3">{{data.nowPlantLoad|| 0}}</span>KW</span>
-            <span class="bomb-span2">未来一小时预测冷量 <span class="bomb-span3">{{data.predictedLoad1h || 0}}</span> KW</span>
-        </div>
+       <water-unit :data='data'></water-unit>
+         <div class="snapshotss-center2">
+            <div class="snapshotss-cont2-box1 MicrYaHei">
+                <span>数据传输情况</span>
+                <span :class="data.isExecuted==1?'span1':'span2'" >
+                能耗
+                <img v-if="data.energyErrorFlag==1" src="../../assets/finish.png" alt />
+                <img v-else src="../../assets/wrong.png" alt />
+                </span>
+                <span :class="data.isExecuted==1?'span1':'span2'" >
+                环境
+                <img v-if="data.environmentErrorFlag==1" src="../../assets/finish.png" alt />
+                <img v-else src="../../assets/wrong.png" alt />
+                </span>
+                <span :class="data.isExecuted==1?'span1':'span2'">
+                BA
+                <img v-if="data.baErrorFalg==1" src="../../assets/finish.png" alt />
+                <img v-else src="../../assets/wrong.png" alt />
+                </span>
+            </div>
+            <div class="snapshotss-cont2-box2 MicrYaHei">
+                <span>实际冷量</span>
+                <span>{{data.nowPlantLoad || 0}} KW</span>
+                <span>未来1小时预测冷量</span>
+                <span>{{data.predictedLoad1h || 0}} KW</span>
+            </div>
+            </div>
         <div class="bomb-right-bottom">
             <el-input placeholder="你可以在此处填写备注信息" v-model='data.remarks'> </el-input>
         </div>
@@ -35,12 +51,6 @@ import waterUnit from './waterUnit'
 export default {
     data(){
         return{
-            items: [
-                { type: 'success', label: '能耗' },
-                { type: 'success', label: '环境' },
-                { type: 'danger', label: 'BA' },
-               
-            ],
             circle1:0,
             circle2:0
         }
@@ -104,10 +114,15 @@ export default {
 
 <style lang='scss' scoped>
 .bomb{
-    width:100%;
-    height:300px;
-    margin-top: 10px;
+    background: #cccccc;
+    width:98%;
     display: flex;
+    align-items: center;
+    padding:20px 0;
+    .close {
+        cursor: pointer;
+        margin-left: 10px;
+    }
     .bomb-left{
         width:240px;
         padding-left:30px;
@@ -127,19 +142,77 @@ export default {
         }
     }
     .bomb-right{
-        .bomb-right-center{
-            color:#646C73;
-            font-size:14px;
-            margin:20px 0;
-            .bomb-span1{
-                margin-left:88px;
+        flex:1;
+        .snapshotss-center2 {
+            padding: 20px 0;
+            margin-bottom: 44px;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            .snapshotss-cont2-box1,
+            .snapshotss-cont2-box2 {
+                flex:1;
+                height: 80px;
+                background: url("../../assets/copy.png");
+                background-size: 100% 100%;
+                display: flex;
+                align-items: center;
+                padding-left: 24px;
+            }
+            .snapshotss-cont2-box1 {
+            margin-right: 12px;
+            span:nth-of-type(1) {
+                height: 22px;
+                font-size: 14px;
+                color: rgba(100, 108, 115, 1);
+                line-height: 19px;
+                margin-right: 20px;
+            }
+            span:not(:first-child) {
+                height: 28px;
+                background: rgba(255, 255, 255, 1);
+                border-radius: 16px;
+                font-size: 14px;
+                color: rgba(31, 36, 41, 1);
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+                padding: 0 6px 0 12px;
+                margin-right: 20px;
+                img {
+                width: 20px;
+                height: 20px;
+                margin-left: 8px;
+                }
+            }
+            .span1 {
+                border: 1px solid rgba(52, 199, 36, 1);
+            }
+            .span2 {
+                border: 1px solid rgba(245, 78, 69, 1);
+            }
+            }
+            .snapshotss-cont2-box2 {
+            span:nth-of-type(1),
+            span:nth-of-type(3) {
+                height: 22px;
+                font-size: 14px;
+                color: rgba(100, 108, 115, 1);
+                line-height: 19px;
+                margin-right: 16px;
+            }
+            span:nth-of-type(2),
+            span:nth-of-type(4) {
+                height: 32px;
+                font-size: 24px;
+                font-family: Persagy;
+                color: rgba(31, 36, 41, 1);
+                line-height: 29px;
+                margin-right: 64px;
             }
-            .bomb-span2{
-                margin-left:44px;
+            span:nth-of-type(3) {
+                margin-right: 16px;
             }
-            .bomb-span3{
-                font-size: 18px;
-                color: #1F2429;
             }
         }
         .bomb-right-bottom{

+ 24 - 11
src/views/strategy/index.vue

@@ -46,7 +46,8 @@ export default {
       navText: true,
       showTodayStrategy: false,
       data:{},
-      quickData:{}
+      quickData:{},
+      today:''
     };
   },
   components: {
@@ -56,22 +57,31 @@ export default {
     TodayStrategy
   },
   methods:{
+    formatTime(){
+      let year = new Date().getFullYear()
+      let month = new Date().getMonth()+1>10?(new Date().getMonth()+1): ('0'+(new Date().getMonth()+1))
+      let date = new Date().getDate()>10?new Date().getDate():('0'+new Date.getDate())
+      console.log(year,month,date)
+      return this.today = year + ''+ month+''+date
+    },
     getQuickData(){
       let params = {
         postParams:{
            criteria:{
               projectId:"Pj4419000005",
-              date:"20200219", //日期 yyyyMMdd
+              date: this.today, //日期 yyyyMMdd
               time:"0015", //时间 H24mi (最近的一个15分钟时间点,例如现在是23点35分,应传2330)
           },
           withColumns: [
-              chillerOrg,"chillerHourList"
+              "chillerOrg","chillerHourList"
           ]
         }
       }
       queryCommand(params).then(res=>{
         console.log(res)
-        this.quickData = res.data.content?res.data.content[0]:{}
+        if(res.data){
+           this.quickData = res.data.content?res.data.content[0]:{}
+        }
       })
     },
     getData(){
@@ -79,23 +89,26 @@ export default {
         postParams:{
           criteria:{
             projectId:"Pj4419000005",
-            date:"202200219"
+            date:this.today
           }
         }
       }
       getCommand(params).then(res=>{
         console.log(res)
-        this.data = res.data.content?res.data.content:{}
-
+        if(res.data){
+          this.data = res.data.content?res.data.content:{}
+        }
       })
     }
   },
   mounted(){
-    let vm = this
-    setInterval(function(){
-       vm.getData()
-    },1500)
+    this.formatTime()
+    // let vm = this
+    // setInterval(function(){
+    //    vm.getData()
+    // },1500)
     this.getQuickData()
+    this.getData()
   }
 };
 </script>

+ 3 - 0
src/views/strategy/waterUnit.vue

@@ -74,6 +74,9 @@ props:['data']
         border-radius:6px;
         border:1px solid rgba(238,238,238,1);
         margin-right:18px;
+        &:last-of-type{
+          margin-right: 0;
+        }
         .starte-right-box-1-title{
           padding-left: 28px;
           height: 56px;