Browse Source

Merge branch 'web-v2' of http://192.168.1.43:3000/git/sass-lab-web into web-v2

dedsudiyu 2 years ago
parent
commit
b8a71686bd
1 changed files with 56 additions and 11 deletions
  1. 56 11
      src/views/oneKeyOutfire/planExecuteRecord/planExecuteRecordDetail.vue

+ 56 - 11
src/views/oneKeyOutfire/planExecuteRecord/planExecuteRecordDetail.vue

@@ -12,10 +12,10 @@
           <div class="small_title">风险概况</div>
           <div class="addPage_b_t_l_b" v-if="form">
             <li><i>事故原因:</i><i>{{form.riskReason?form.riskReason:''}}</i></li>
-            <li v-if="form.riskReason==1"><i>风险级别:</i><i>低风险</i></li>
-            <li v-if="form.riskReason==2"><i>风险级别:</i><i>中风险</i></li>
-            <li v-if="form.riskReason==3"><i>风险级别:</i><i>较高风险</i></li>
-            <li v-if="form.riskReason==4"><i>风险级别:</i><i>高风险</i></li>
+            <li v-if="form.riskLevel==1"><i>风险级别:</i><i>低风险</i></li>
+            <li v-if="form.riskLevel==2"><i>风险级别:</i><i>中风险</i></li>
+            <li v-if="form.riskLevel==3"><i>风险级别:</i><i>较高风险</i></li>
+            <li v-if="form.riskLevel==4"><i>风险级别:</i><i>高风险</i></li>
             <li><i>发生时间:</i><i>{{form.startDate?form.startDate:''}} - {{form.endDate?form.endDate:''}}</i></li>
             <li><i>持续时间:</i><i>{{form.riskDuration?form.riskDuration:''}}秒</i></li>
             <li><i>风险响应人员:</i><i>{{form.handledPerson?form.handledPerson:'-'}}</i></li>
@@ -43,8 +43,8 @@
         <div class="small_title">风险轨迹</div>
         <div class="addPage_b_b_b">
           <div class="time-box">
-            <ul  >
-              <li class="active" v-for="(item,index2) in planAxis" :key="index2">
+            <ul>
+              <li :class="item.riskStatus==1||item.riskStatus==2?'risk_trend':'hardware'" v-for="(item,index2) in planAxis" :key="index2">
                 <p>发生风险:{{item.riskPlanName}}</p>
                 <p>{{item.sensorJsonName}}:<i>{{item.sensorJsonValue}}</i></p>
                 <p>时间:<i>{{item.createTime}}</i></p>
@@ -309,27 +309,72 @@ export default {
               }
             }
           }
-          >li:after{
+          >li:nth-child(2n){
+            margin-top:160px;
+          }
+          >li:before{
             content: "";
             width: 56px;
             height: 56px;
             border-radius: 28px;
             background: #0183FA;
             position: absolute;
-            left:50%;margin-left:-64px;
+            left:20%;
+            margin-left:-64px;
             bottom: 0;
             bottom:-60px;
             z-index: 1;
             border: 20px solid #fff;
           }
-          >li:nth-child(2n):after{
+          >li:nth-child(2n):before{
             bottom: auto;top:-60px;
           }
-          >li:nth-child(2n){
+          /*风险趋势*/
+          .risk_trend{
+
+          }
+          /*硬件执行动作*/
+          .hardware{
             margin-top:160px;
           }
+          >li:after{
+            content: "";  display: block; background: #d2d2d2;height: 1px;width: 100%;position: absolute;left:0;bottom:-32%;;
+          }
+          >li:nth-child(2n):after{
+            top:-32%;
+          }
+          >li:last-child:after{
+            content: "";  display: block; background: none;height: 1px;width: 100%;position: absolute;left:0;bottom:-32%;;
+          }
+          >li:first-child:before{
+            content: "";
+            width: 26px;
+            height: 26px;
+            border: 2px solid #0183FA;
+            border-radius: 28px;
+            background: #fff;
+            position: absolute;
+            left:20%;
+            margin-left:-64px;
+            bottom:-44px;
+            z-index: 1;
+          }
+          >li:last-child:before{
+            content: "";
+            width: 26px;
+            height: 26px;
+            border: 2px solid #0183FA;
+            border-radius: 28px;
+            background: #fff;
+            position: absolute;
+            left:20%;
+            margin-left:-64px;
+            top:-44px;
+            z-index: 1;
+          }
+
         }
-        >ul:after{content: "";  display: block;background: #d2d2d2;height: 1px;width: 100%;position: absolute;left:0;top:50%;}
+
 
 
       }