From abfe6985b2678445ea8da974b204d9fe2ffdb887 Mon Sep 17 00:00:00 2001 From: liukangdong <898885815@qq.com> Date: 星期二, 24 十二月 2024 15:23:41 +0800 Subject: [PATCH] ll --- screen/src/views/SecurityControl.vue | 65 +++++++++++++++++++++----------- 1 files changed, 43 insertions(+), 22 deletions(-) diff --git a/screen/src/views/SecurityControl.vue b/screen/src/views/SecurityControl.vue index 1ace36c..233548d 100644 --- a/screen/src/views/SecurityControl.vue +++ b/screen/src/views/SecurityControl.vue @@ -108,10 +108,12 @@ </div> </div> <div class="center_box"> - <div v-if="showJk" class="jiankong"> + <div v-show="showJk" class="jiankong"> <img class="jk_bg" src="@/assets/images/SecurityControl/jiankong_bg@2x.png" alt=""> <div class="content"> - <video :src="activeVideo" class="video"></video> + <Video v-if="showJk && activeMenu && activeMenu.indexCode" :href="data.videoPluginUrl" + :indexCode="activeMenu.indexCode" /> + <!-- <div class="player_bg" style="width: 100%;height: 100%;" id="playWnd"> </div> --> </div> <div class="right_wrap"> <div class="menus"> @@ -144,7 +146,7 @@ </div> </div> - <div v-else class="center_box_one"> + <div v-show="!showJk" class="center_box_one"> <div class="list"> <div class="item"> <div class="name_wrap"> @@ -310,6 +312,7 @@ </div> </div> --> <div class="safe_warning"> + <Loading v-if="loading1" /> <div class="com_header"> <div class="title"> <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" /> @@ -372,7 +375,6 @@ </div> </div> </div> - </div> </div> @@ -384,7 +386,7 @@ </div> <img src="@/assets/images/task/title@2x.png" class="bg" alt="" /> </div> - <div class="monitoring" @click="showJk = !showJk"> + <div class="monitoring" @click="changeMon"> <img src="@/assets/images/SecurityControl/ic_jiankong@2x.png" class="icon" alt=""> <div>鐩戞帶鍒楄〃</div> <img v-if="showJk" src="@/assets/images/SecurityControl/jiankong_ic_close@2x.png" class="top" alt=""> @@ -421,7 +423,7 @@ </div> <div class="list two-swiper"> <div class="swiper-wrapper"> - <template v-for="item, i in dataList2"> + <template v-for="item, i in dataList2.filter(i => i.total > 0)"> <div class="item two-swiper-slide swiper-slide"> <div class="line"> <div class="driver">{{ item.deviceType }}</div> @@ -476,7 +478,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' @@ -485,6 +487,8 @@ import * as echarts from 'echarts' import 'swiper/css/swiper.min.css' import Swiper from 'swiper' +import Video from './videoUrl/Video.vue' +import Loading from '@/components/Loading.vue' import { getEnergyCenterData, afgetCarmeraPreviemUrl, @@ -507,8 +511,6 @@ time.value = dayjs().format('HH:mm:ss') }, 1000) - - const arr = ['#68e2e3', '#50afd3', '#377cdb', '#d5ae3a'] const initEnergy = () => { @@ -673,10 +675,18 @@ }]), ] const data = [] - data.push({ name: '寰呰闂�', value: data4.value.waitVisitNum, rate: (data4.value.waitVisitNum / data4.value.total).toFixed(1) }) - data.push({ name: '宸茬櫥璁�', value: data4.value.registerVisitNum, rate: (data4.value.registerVisitNum / data4.value.total).toFixed(1) }) - data.push({ name: '宸茬寮�', value: data4.value.levelNum, rate: (data4.value.levelNum / data4.value.total).toFixed(1) }) - data.push({ name: '婊炵暀', value: data4.value.retentionNum, rate: (data4.value.retentionNum / data4.value.total).toFixed(1) }) + if (data4.value.total) { + data.push({ name: '寰呰闂�', value: data4.value.waitVisitNum, rate: (data4.value.waitVisitNum / data4.value.total).toFixed(1) }) + data.push({ name: '宸茬櫥璁�', value: data4.value.registerVisitNum, rate: (data4.value.registerVisitNum / data4.value.total).toFixed(1) }) + data.push({ name: '宸茬寮�', value: data4.value.levelNum, rate: (data4.value.levelNum / data4.value.total).toFixed(1) }) + data.push({ name: '婊炵暀', value: data4.value.retentionNum, rate: (data4.value.retentionNum / data4.value.total).toFixed(1) }) + } else { + data.push({ name: '寰呰闂�', value: data4.value.waitVisitNum, rate: 0 }) + data.push({ name: '宸茬櫥璁�', value: data4.value.registerVisitNum, rate: 0 }) + data.push({ name: '宸茬寮�', value: data4.value.levelNum, rate: 0 }) + data.push({ name: '婊炵暀', value: data4.value.retentionNum, rate: 0 }) + } + const option = { color: colors, tooltip: { @@ -839,7 +849,7 @@ data4.value = res.data || {} let obj = data4.value data4.value.total = obj.levelNum + obj.retentionNum + obj.registerVisitNum + obj.waitVisitNum - const result = res.data.visitRetentionDataList || [] + const result = res.data?.visitRetentionDataList || [] dataList3.value = result.map(i => { if (i.timeOutMinute) { i.timeOutMinute = Math.abs(i.timeOutMinute) @@ -858,11 +868,14 @@ }) } +const loading1 = ref(false) const warningTab = ref('0') const warningNum = ref(0) const warningList = ref([]) const getWarning = () => { + loading1.value = true afwarningEventData({ type: warningTab.value }).then(res => { + loading1.value = false if (!res.data) return const result = res.data.list || [] warningNum.value = res.data.total @@ -885,6 +898,8 @@ }) warningList.value = temp // console.log('temp', warningList.value); + }, () => { + loading1.value = false }) } const tasClick = (val) => { @@ -908,6 +923,13 @@ data5.value = result.filter(item => item.carmeraList && item.carmeraList.length > 0) }) } +const changeMon = () => { + showJk.value = !showJk.value + if (!showJk.value) { + activeJkIndex.value = -1 + activeMenu.value = {} + } +} const menuClick = (val) => { if (val == activeJkIndex.value) { activeJkIndex.value = -1 @@ -917,11 +939,8 @@ } const menuItemClick = (val) => { activeMenu.value = val - afgetCarmeraPreviemUrl({ indexCode: val.indexCode }).then(res => { - activeVideo.value = res.data - }) -} +} const autoplayFlag = (list = [], leng = 4, time = 2000) => { if (list.length > leng) { return { delay: time, disableOnInteraction: false } @@ -944,7 +963,7 @@ initialSlide: 0, direction: 'vertical', //绔栫洿鏂瑰悜 slidesPerView: 3, - autoplay: autoplayFlag(dataList2.value, 3, 4000), + autoplay: autoplayFlag(dataList2.value.filter(i => i.total > 0), 3, 4000), observer: true, //淇敼swiper鑷繁鎴栧瓙鍏冪礌鏃讹紝鑷姩鍒濆鍖杝wiper }) } @@ -959,6 +978,7 @@ observer: true, //淇敼swiper鑷繁鎴栧瓙鍏冪礌鏃讹紝鑷姩鍒濆鍖杝wiper }) } + @@ -1576,7 +1596,7 @@ .safe_warning { width: 786px; margin-right: 20px; - + position: relative; /* one-swiper */ .one_swiper_wrap { height: 140px; @@ -1683,7 +1703,8 @@ display: flex; justify-content: center; align-items: center; - padding: 16px 24px; + padding-top: 16px; + padding-left: 24px; .echart_wrap { position: relative; @@ -1719,7 +1740,7 @@ } .list { - margin-left: 36px; + margin-left: 32px; flex: 1; display: flex; flex-direction: column; -- Gitblit v1.9.3