From a6d047e106c00a32603ed9c037a1e27b7f75ee6b Mon Sep 17 00:00:00 2001 From: jiangping <jp@doumee.com> Date: 星期一, 17 三月 2025 18:24:09 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- screen/src/views/TaskEfficiency.vue | 124 ++++++++++++++++++++++++++++++++++++++++- 1 files changed, 120 insertions(+), 4 deletions(-) diff --git a/screen/src/views/TaskEfficiency.vue b/screen/src/views/TaskEfficiency.vue index f71d802..a44debc 100644 --- a/screen/src/views/TaskEfficiency.vue +++ b/screen/src/views/TaskEfficiency.vue @@ -150,7 +150,7 @@ <div class="line"> <div class="dian"></div> <div class="la">浣滀笟绫诲瀷锛�</div> - <div class="val">{{ workModalParam.workType == 0 ? '鍗歌揣' : '瑁呰揣' }}</div> + <div class="val">{{ workModalParam.workType == 0 ? '鍗歌揣' : workModalParam.workType == 1 ? '瑁呰揣' : ''}}</div> </div> <div class="line"> <div class="dian"></div> @@ -162,8 +162,29 @@ <div class="la">棰勮瀹屾垚锛�</div> <div class="val">{{ workModalParam.finishTimeStr }}</div> </div> + <div class="priview" @click="videoPri">鏌ョ湅瀹炴椂鐢婚潰</div> </div> <div class="modal_bg" v-if="showWorkModal" @click="closeModal"></div> + <div v-show="showJk" class="camera_wrap"> + <img class="bg" src="@/assets/images/task/jiankong_bg2@2x.png" alt=""> + <div class="head"> + <div class="left"> + <img class="icon" src="@/assets/images/task/ic_yuetai@2x.png" alt=""> + <div class="name">{{ workModalParam.platformName }}</div> + <span v-if="workModalParam.carNo">{{ workModalParam.carNo }} | {{ workModalParam.workType == 0 ? '鍗歌揣' + : workModalParam.workType == 1 ? '瑁呰揣' : '' }}</span> + </div> + <div class="right"> + <span>{{ workModalParam.statusTemp }} <span v-if="workModalParam.status == 0"> | 棰勮瀹屾垚鏃堕棿锛歿{ + workModalParam.finishTimeStr }}</span></span> + <img @click="closeVideo" class="icon" src="@/assets/images/task/ic_close@2x.png" alt=""> + </div> + </div> + <div class="content"> + <Video v-if="showJk && videoParam && videoParam.deviceId" :href="videoParam.videoPluginUrl" + :indexCode="videoParam.deviceId" /> + </div> + </div> </div> <div class="center_box_two"> <!-- <div v-if="data4.videoIndexCodes && data4.videoIndexCodes.length > 0" class="videos"> @@ -297,7 +318,7 @@ </template> <script setup> -import { ref, onMounted } from 'vue' +import { ref, onMounted, nextTick } from 'vue' import VScaleScreen from 'v-scale-screen' import Percent from '@/components/percent.vue' import dayjs from 'dayjs' @@ -309,6 +330,7 @@ import 'swiper/css/swiper.min.css' import Swiper from 'swiper' import Videos from './videoUrl/Videos.vue' +import Video from './videoUrl/Video.vue' import { cnplatformGroupFinish, cnplatformDuration, @@ -791,7 +813,9 @@ } const showWorkModal = ref(false) +const showJk = ref(false) const workModalParam = ref({}) +const videoParam = ref({}) // point_icon const pointList = [ { left: 230, top: 190, left2: 290, top2: 190, name: '鍑哄簱鏈堝彴3' }, @@ -806,8 +830,22 @@ { left: 590, top: 75, left2: 650, top2: 190, name: '1095鏁存墭鐩樺叆搴�' }, { left: 600, top: 80, left2: 660, top2: 190, name: '1099鏁存墭鐩樺叆搴�' }, { left: 850, top: 60, left2: 520, top2: 190, name: '甯傚叕鍙告湀鍙�' }, + { left: 540, top: 136, left2: 600, top2: 136, name: '鑰佸簱鍏ュ簱' }, + { left: 560, top: 132, left2: 620, top2: 132, name: '鑰佸簱鍑哄簱' }, ] +const videoPri = () => { + showJk.value = true + nextTick(() => { + videoParam.value = { ...workModalParam.value } + // console.log('workModalParam', videoParam.value) + }) +} +const closeVideo = () => { + workModalParam.value = {} + videoParam.value = {} + showJk.value = false +} const platformClick = (val) => { const index = pointList.findIndex(i => i.name == val.platformName) @@ -1130,6 +1168,75 @@ align-items: center; position: relative; + .camera_wrap { + position: absolute; + top: 0; + left: 50%; + transform: translate(-50%, 0); + width: 672px; + height: 568px; + z-index: 999; + font-size: 14px; + color: #D2E0FF; + display: flex; + flex-direction: column; + + .content { + flex: 1; + /* height: calc( 100% - 30px ); */ + padding: 16px 20px 32px 20px; + + .video { + width: 100%; + height: 100%; + } + } + + .head { + height: 56px; + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 30px; + + .right { + display: flex; + align-items: center; + + .icon { + width: 24px; + margin-left: 20px; + cursor: pointer; + } + } + + .left { + display: flex; + align-items: center; + + .name { + font-weight: bold; + font-size: 16px; + color: #01D9FE; + margin-right: 20px; + } + + .icon { + width: 16px; + margin-right: 8px; + } + } + } + + .bg { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + } + } + .point_icon { position: absolute; left: 850px; @@ -1158,6 +1265,15 @@ left: 850px; top: 60px; z-index: 99999999; + + .priview { + position: absolute; + bottom: 24px; + right: 40px; + font-size: 12px; + color: #01D9FE; + cursor: pointer; + } .head { display: flex; @@ -1221,8 +1337,8 @@ position: fixed; left: 0; top: 0; - width: 100vw; - height: 100vh; + width: 100%; + height: 100%; /* background-color: rgba(0,0,0,.1); */ } } -- Gitblit v1.9.3