|  |  | 
 |  |  |               <div class="item"> | 
 |  |  |                 <div class="name">待访问</div> | 
 |  |  |                 <div class="num_wrap"> | 
 |  |  |                   <span class="num">22</span> | 
 |  |  |                   <span class="num">{{ data4.waitVisitNum }}</span> | 
 |  |  |                   <span>人</span> | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  |               <div class="spacing"></div> | 
 |  |  |               <div class="item"> | 
 |  |  |                 <div class="name">已登机</div> | 
 |  |  |                 <div class="name">已登记</div> | 
 |  |  |                 <div class="num_wrap"> | 
 |  |  |                   <span class="num">22</span> | 
 |  |  |                   <span class="num">{{ data4.registerVisitNum }}</span> | 
 |  |  |                   <span>人</span> | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  | 
 |  |  |               <div class="item"> | 
 |  |  |                 <div class="name">已离开</div> | 
 |  |  |                 <div class="num_wrap"> | 
 |  |  |                   <span class="num">22</span> | 
 |  |  |                   <span class="num">{{ data4.levelNum }}</span> | 
 |  |  |                   <span>人</span> | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  | 
 |  |  |               <div class="item"> | 
 |  |  |                 <div class="name">滞留</div> | 
 |  |  |                 <div class="num_wrap"> | 
 |  |  |                   <span class="num">22</span> | 
 |  |  |                   <span class="num">{{ data4.retentionNum }}</span> | 
 |  |  |                   <span>人</span> | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  | 
 |  |  | import duration from 'dayjs/plugin/duration' | 
 |  |  | dayjs.extend(duration) | 
 |  |  | import * as echarts from 'echarts' | 
 |  |  | import { getEnergyCenterData, getSecurityDeviceData, getVisitRetentionData } from '@/api' | 
 |  |  | import { getEnergyCenterData, getSecurityDeviceData, getVisitRetentionData, afgetVisitData } from '@/api' | 
 |  |  |  | 
 |  |  |  | 
 |  |  | const weekMap = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六',] | 
 |  |  | 
 |  |  |       offset: 1, | 
 |  |  |       color: '#61d3f9' | 
 |  |  |     }])] | 
 |  |  |   const data = [] | 
 |  |  |   data.push({ name: '待访问', value: data4.value.waitVisitNum,rate: data4.value.waitVisitRata  }) | 
 |  |  |   data.push({ name: '已登记', value: data4.value.registerVisitNum,rate: data4.value.registerVisitRata  }) | 
 |  |  |   data.push({ name: '已离开', value: data4.value.levelNum,rate: data4.value.levelRata  }) | 
 |  |  |   data.push({ name: '滞留', value: data4.value.retentionNum,rate: data4.value.retentionRata  }) | 
 |  |  |   const option = { | 
 |  |  |     color: colors, | 
 |  |  |     tooltip: { | 
 |  |  | 
 |  |  |         color: "#000" | 
 |  |  |       }, | 
 |  |  |       itemHeight: 2, | 
 |  |  |       data: ['待访问', '已登记', '已离开', '滞留'] | 
 |  |  |       data: data.map(i => i.name) | 
 |  |  |     }, | 
 |  |  |     series: [ | 
 |  |  |       { | 
 |  |  | 
 |  |  |           borderWidth: 0, | 
 |  |  |           borderColor: '#fff' | 
 |  |  |         }, | 
 |  |  |         data: [ | 
 |  |  |           { value: 100, name: '待访问', }, | 
 |  |  |           { value: 50, name: '已登记' }, | 
 |  |  |           { value: 20, name: '已离开' }, | 
 |  |  |           { value: 30, name: '滞留' }, | 
 |  |  |  | 
 |  |  |         ] | 
 |  |  |         data | 
 |  |  |       }, | 
 |  |  |       { | 
 |  |  |         type: 'funnel', | 
 |  |  | 
 |  |  |             opacity: 1 | 
 |  |  |           } | 
 |  |  |         }, | 
 |  |  |         data: [ | 
 |  |  |           { value: 100, name: '待访问', }, | 
 |  |  |           { value: 50, name: '已登记' }, | 
 |  |  |           { value: 20, name: '已离开' }, | 
 |  |  |           { value: 30, name: '滞留' }, | 
 |  |  |  | 
 |  |  |         ] | 
 |  |  |         data | 
 |  |  |       }, | 
 |  |  |     ] | 
 |  |  |   } | 
 |  |  | 
 |  |  |     }) | 
 |  |  |   }) | 
 |  |  | } | 
 |  |  | const data4 = ref({}) | 
 |  |  | const getData4 = () => { | 
 |  |  |   afgetVisitData().then(res => { | 
 |  |  |     const result = res.data || {} | 
 |  |  |     dataList4.value = result | 
 |  |  |     initEchart3() | 
 |  |  |   }) | 
 |  |  | } | 
 |  |  |  | 
 |  |  |  | 
 |  |  | onMounted(() => { | 
 |  |  |   getData1() | 
 |  |  |   getData2() | 
 |  |  |   getData3() | 
 |  |  |   initEchart3() | 
 |  |  |   getData4() | 
 |  |  |    | 
 |  |  |   // initEchart1() | 
 |  |  | }) | 
 |  |  |  |