Merge branch 'master' of http://42.193.1.25:9521/r/zgyw-ui
| | |
| | | data() { |
| | | return { |
| | | faceData: [ |
| | | { name: '人脸识别时钟准确性', icon: 'el-icon-alarm-clock', description: '描述信息', routerUrl: '/face/index' }, |
| | | { name: '人脸抓拍数据监测', icon: 'el-icon-user', description: '描述信息', routerUrl: '/face/faceClock' }, |
| | | { name: '人脸数据趋势分析', icon: 'el-icon-data-line', description: '描述信息', routerUrl: '/face/faceClock' }, |
| | | { name: '人脸抓拍设备活跃性', icon: 'el-icon-timer', description: '描述信息', routerUrl: '/face/faceClock' }, |
| | | { name: '人脸抓拍上传及时性', icon: 'el-icon-money', description: '描述信息', routerUrl: '/face/faceClock' }, |
| | | { name: '人脸抓拍大图可用性', icon: 'el-icon-data-analysis', description: '描述信息', routerUrl: '/face/faceClock' }, |
| | | { name: '人脸识别时钟准确性', icon: 'el-icon-alarm-clock', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' }, |
| | | { name: '人脸抓拍数据监测', icon: 'el-icon-user', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' }, |
| | | { name: '人脸数据趋势分析', icon: 'el-icon-data-line', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' }, |
| | | { name: '人脸抓拍设备活跃性', icon: 'el-icon-timer', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' }, |
| | | { name: '人脸抓拍上传及时性', icon: 'el-icon-money', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' }, |
| | | { name: '人脸抓拍大图可用性', icon: 'el-icon-data-analysis', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' }, |
| | | ], |
| | | carData: [ |
| | | { name: '卡口过车数据一致性', icon: 'el-icon-alarm-clock', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' }, |
| | | |
| | | { name: '卡口过车数据一致性', icon: 'el-icon-truck', description: '描述信息', routerUrl: '/car/vehicle-data-monitor/index' } |
| | | ] |
| | | } |
| | | }, |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <div class="top"> |
| | | <!-- <div class="top"> |
| | | <el-row type="flex" justify="space-between" style="width: 60%;"> |
| | | <el-col :span="6"> |
| | | <el-card class="card"> |
| | |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | </div> --> |
| | | |
| | | |
| | | <el-card class="box-card"> |
| | | <el-row type="flex" align="middle" justify="space-between"> |
| | | <el-col :xl="8" :lg="8" :md="10" :sm="8" :xs="6"> |
| | | <div class="icon-container" style="background-color: #5599F7;font-size: 50px;color: #FFF;"> |
| | | <i class="el-icon-wind-power"></i> |
| | | </div> |
| | | </el-col> |
| | | <el-col :xl="14" :lg="14" :md="12" :sm="14" :xs="16"> |
| | | <div class="dashboard"> |
| | | <div class="dashboard-item"> |
| | | <h3 style="color: #5C9BF8">{{ totalKiosks }}</h3> |
| | | <p>卡口总数</p> |
| | | </div> |
| | | <div class="dashboard-item"> |
| | | <h3>{{ uniqueKiosks }}</h3> |
| | | <p>不唯一卡口数</p> |
| | | </div> |
| | | <div class="dashboard-item"> |
| | | <div style="width: 1px;height: 55px;border: 1px solid #D7EBFA;"></div> |
| | | </div> |
| | | <div class="dashboard-item"> |
| | | <h3 style="color: #5C9BF8">{{ totalCarData }}</h3> |
| | | <p>过车数据总量</p> |
| | | </div> |
| | | <div class="dashboard-item"> |
| | | <h3>{{ uniqueCarData }}</h3> |
| | | <p>不唯一数据量</p> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </el-card> |
| | | |
| | | |
| | | |
| | | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> |
| | | <el-form-item label="卡口编号" prop="bayonetNumber"> |
| | |
| | | }; |
| | | </script> |
| | | <style scoped> |
| | | .top { |
| | | height: 150px; |
| | | .box-card { |
| | | background-color: #F5F9FE; |
| | | width: 100%; |
| | | margin-bottom: 20px; |
| | | background-color: #F2F9FF; |
| | | border: 1px solid #77befd; |
| | | height: 120px |
| | | } |
| | | |
| | | .container { |
| | | max-width: 1000px; |
| | | margin: auto; |
| | | .icon-container { |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | border-radius: 20px; |
| | | width: 20%; |
| | | height: 80px; |
| | | margin-left: 5%; |
| | | } |
| | | |
| | | .number { |
| | | font-size: 36px; |
| | | font-weight: bold; |
| | | color: #00A5FE; |
| | | .el-icon-refresh-left { |
| | | font-size: 50px; |
| | | color: #FFFFFF; |
| | | } |
| | | |
| | | .numberTwo { |
| | | font-size: 36px; |
| | | font-weight: bold; |
| | | color: #505051; |
| | | .dashboard { |
| | | display: flex; |
| | | gap: 10%; |
| | | align-items: center; |
| | | margin-left: -50%; |
| | | } |
| | | |
| | | .card { |
| | | width: 100px; |
| | | height: 100px; |
| | | .dashboard-item { |
| | | text-align: center; |
| | | background-color: #00A5FE; |
| | | color: aliceblue; |
| | | border-radius: 10%; |
| | | margin: 25px; |
| | | } |
| | | |
| | | .mod { |
| | | margin-top: 40px; |
| | | } |
| | | </style> |