访客系统
blame | 历史 | 补丁 | 提交 | 提交对比 | 忽略空白
k94314517
2025-06-30 61dbf64da478ed957155a45192ff71e56e28303c 
 screen/src/views/SecurityControl.vue


@@ -4,7 +4,7 @@


      <img src="@/assets/images/SecurityControl/bg@2x.png" class="main_bg" alt="" />


      <div class="main_header">


        <img src="@/assets/images/maintitle.gif" class="main_header_bg" alt="" />


        <div class="title">安泰智慧物流园区-安防智能监测</div>


        <div class="title">安泰智慧物流园区-智能安防监测</div>


        <div class="time_wrap">


          <span class="date">{{ date }}</span>


          <span class="week">{{ week }}</span>


@@ -111,7 +111,8 @@


          <div v-show="showJk" class="jiankong">


            <img class="jk_bg" src="@/assets/images/SecurityControl/jiankong_bg@2x.png" alt="">


            <div class="content">


              <Video v-if="showJk && activeMenu && activeMenu.indexCode" :href="data.videoPluginUrl" :indexCode="activeMenu.indexCode" />


              <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">


@@ -163,7 +164,7 @@


                  <img src="@/assets/images/SecurityControl/title_short@2x.png" class="bg" alt="">


                </div>


                <div class="num_wrap">


                  <div class="num">{{ data.internalCarTotal }}</div>


                  <div class="num">{{ data.inParkCarTotal || 0 }}</div>


                  <img src="@/assets/images/SecurityControl/anfang_ic_data@2x.png" class="bg" alt="">


                </div>


              </div>


@@ -219,8 +220,8 @@


                <div class="content">


                  <div class="name">长期相关方</div>


                  <div class="num today"><span>{{ data.relatedTotal || 0


                      }}</span> | {{ data.inParkTotal ? ((data.relatedTotal / data.inParkTotal) * 100).toFixed(1) : 0


                    }}%</div>


                  }}</span> | {{ data.inParkTotal ? ((data.relatedTotal / data.inParkTotal) * 100).toFixed(1) : 0


                      }}%</div>


                </div>


              </div>


              <div class="item">


@@ -248,7 +249,7 @@


              </div>


              <div class="spacing"></div>


              <div class="item">


                <div class="name">已登记</div>


                <div class="name">已访问</div>


                <div class="num_wrap">


                  <span class="num">{{ data4.registerVisitNum }}</span>


                  <span>人</span>


@@ -311,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="" />


@@ -373,7 +375,6 @@


                </div>


              </div>


            </div>




          </div>




        </div>


@@ -422,7 +423,7 @@


              </div>


              <div class="list two-swiper">


                <div class="swiper-wrapper">


                  <template v-for="item, i in dataList2.filter(i => i.total > 0)">


                  <template v-for="item, i in dataList2.filter(i => i.totalNum > 0)">


                    <div class="item two-swiper-slide swiper-slide">


                      <div class="line">


                        <div class="driver">{{ item.deviceType }}</div>


@@ -452,7 +453,7 @@


            <div class="line header">


              <div>姓名</div>


              <div class="dept">拜访部门</div>


              <div class="dept">超时时长</div>


              <div class="time">超时时长</div>


            </div>


            <div v-if="dataList3.length > 0" class="three-swiper list">


              <div class="swiper-wrapper">


@@ -460,7 +461,7 @@


                  <div class="line">


                    <div>{{ item.name }}</div>


                    <div class="dept">{{ item.companyName }}</div>


                    <div class="dept">{{ item.timeOutMinuteT }}</div>


                    <div class="time">{{ item.timeOutMinuteT }}</div>


                  </div>


                  <div class="separate"></div>


                </div>


@@ -487,6 +488,7 @@


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,


@@ -610,7 +612,7 @@


  })


}




const colors = ['#FEAF01', '#01ABFE', '#51F9E4']


const colors = ['#01ABFE', '#FEAF01', '#51F9E4']


const initEchart2 = () => {


  const myChart = echarts.init(document.getElementById('echart2'))


  const option = {


@@ -673,10 +675,20 @@


    }]),


  ]


  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(3) })


    data.push({ name: '已访问', value: data4.value.registerVisitNum, rate: (data4.value.registerVisitNum / data4.value.total).toFixed(3) })


    data.push({ name: '已离开', value: data4.value.levelNum, rate: (data4.value.levelNum / data4.value.total).toFixed(3) })


    data.push({ name: '滞留', value: data4.value.retentionNum, rate: (data4.value.retentionNum / data4.value.total).toFixed(3) })


  } 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 })


  }


  data.sort((a, b) => (b.value - a.value))


  // console.log('data', data);




  const option = {


    color: colors,


    tooltip: {


@@ -742,7 +754,7 @@


          position: 'outside',


          formatter: (params) => {


            const index = params.dataIndex


            return `{color${index}|${params.data.name} ${params.data.rate}%}`


            return `{color${index}|${params.data.name} ${(params.data.rate * 100).toFixed(1)}%}`


            // return `<div>${params.data.name}</div>`


          },


          rich: {


@@ -816,6 +828,8 @@


        }


        return item


      })


      console.log('dataList2', dataList2.value)




      data2.value = total


      if (online >= outline) {


        temp.push({ name: '在线', value: online, rate: ((online / (online + outline)) * 100).toFixed(1) })


@@ -839,6 +853,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 || []


    dataList3.value = result.map(i => {


      if (i.timeOutMinute) {


@@ -849,7 +864,7 @@


      } else if (i.timeOutMinute > 60) {


        i.timeOutMinuteT = dayjs.duration(i.timeOutMinute * 60 * 1000).format('H时m分')


      } else {


        i.timeOutMinuteT = item.timeOutMinuteT + '分'


        i.timeOutMinuteT = i.timeOutMinute + '分'


      }




      return i


@@ -858,11 +873,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 +903,8 @@


    })


    warningList.value = temp


    // console.log('temp', warningList.value);


  }, () => {


    loading1.value = false


  })


}


const tasClick = (val) => {


@@ -910,7 +930,7 @@


}


const changeMon = () => {


  showJk.value = !showJk.value


  if(!showJk.value){


  if (!showJk.value) {


    activeJkIndex.value = -1


    activeMenu.value = {}


  }


@@ -948,7 +968,7 @@


    initialSlide: 0,


    direction: 'vertical', //竖直方向


    slidesPerView: 3,


    autoplay: autoplayFlag(dataList2.value.filter(i => i.total > 0), 3, 4000),


    autoplay: autoplayFlag(dataList2.value.filter(i => i.totalNum > 0), 3, 4000),


    observer: true, //修改swiper自己或子元素时，自动初始化swiper


  })


}


@@ -1581,6 +1601,7 @@


  .safe_warning {


    width: 786px;


    margin-right: 20px;


    position: relative;




    /* one-swiper */


    .one_swiper_wrap {


@@ -1913,11 +1934,11 @@


    }




    .dept {


      flex: 5;


      flex: 8;


    }




    .time {


      flex: 4;


      flex: 5;


    }


  }




@@ -2010,4 +2031,4 @@


  object-fit: cover;


  z-index: -1;


}


</style>


</style>