内容提交

longyvfengyun

2023-11-17 3bb931d4eb57fec4a857c9dd0b11f9643c3506e5

 src/views/user/drivingAnalysis.vue

@@ -28,6 +28,11 @@
   alarmLine.value.setOption(alarmLineOption);
}

const photo = ref(videoContent);
const dangerBoxClick = (data)=>{
   photo.value = data.photo;
}

onMounted(()=>{
   setAlarmLine();
   setLastAlarm();
@@ -47,6 +52,7 @@
                        <div class="danger-act-container-absolute">
                           <danger-act-box
                              v-for="(item, key) in dangerList" :key="'key'+key"
                              @click="dangerBoxClick(item)"
                              :name="item.name" :time="item.time"
                              :icon="item.icon" :type="item.type"></danger-act-box>
                        </div>
@@ -59,7 +65,11 @@
      <div class="content-wrapper middle">
         <div class="video-wrapper">
            <flex-box>
               <img class="video-img" :src="videoContent" alt="">
               <div class="position-relative">
                  <div class="position-absolute">
                     <img class="video-img" :src="photo" alt="">
                  </div>
               </div>
            </flex-box>
         </div>
         <div class="alarm-line-wrapper">
@@ -199,10 +209,6 @@
      overflow-y: auto;
   }
}
.video-img {
   width: auto;
   height: 100%;
}

.risk-act-wrapper {
   display: flex;
@@ -246,4 +252,22 @@
      }
   }
}

.position-relative {
   position: relative;
   height: 100%;
   .position-absolute {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      .video-img {
         width: 100%;
         height: 100%;
      }
   }
}
</style>