| | |
| | | <template> |
| | | <v-scale-screen width="1920" height="960"> |
| | | <div class="main_app"> |
| | | <img src="@/assets/images/FireFighting/bg@2x.png" class="main_bg" alt="" /> |
| | | <img src="@/assets/images/task/bg@2x.png" class="main_bg" alt="" /> |
| | | <div class="main_header"> |
| | | <img src="@/assets/images/maintitle@2x.png" class="main_header_bg" alt="" /> |
| | | <img src="@/assets/images/maintitle.gif" class="main_header_bg" alt="" /> |
| | | <div class="title">安泰智慧物流园区-作业效能统筹</div> |
| | | <div class="time_wrap"> |
| | | <span class="date">{{ date }}</span> |
| | |
| | | <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" /> |
| | | <div>今日月台完成订单统计</div> |
| | | </div> |
| | | <img src="@/assets/images/title@2x.png" class="bg" alt="" /> |
| | | <img src="@/assets/images/task/title@2x.png" class="bg" alt="" /> |
| | | </div> |
| | | <div class="car_static"> |
| | | <div class="echart_wrap"> |
| | |
| | | <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" /> |
| | | <div>今日月台工作时长趋势</div> |
| | | </div> |
| | | <img src="@/assets/images/title@2x.png" class="bg" alt="" /> |
| | | <img src="@/assets/images/task/title@2x.png" class="bg" alt="" /> |
| | | </div> |
| | | <div class="list one-swiper"> |
| | | <div class="swiper-wrapper"> |
| | |
| | | <div class="separate"></div> |
| | | <div class="tab" :class="{ active: activeTab3 == 0 }" @click="tabClick3(0)">入库</div> |
| | | </div> |
| | | <img src="@/assets/images/title@2x.png" class="bg" alt="" /> |
| | | <img src="@/assets/images/task/title@2x.png" class="bg" alt="" /> |
| | | </div> |
| | | <div class="echart_wrap"> |
| | | <div class="echart2" id="echart2"></div> |
| | |
| | | <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" /> |
| | | <div>今日车辆作业情况</div> |
| | | </div> |
| | | <img src="@/assets/images/title@2x.png" class="bg" alt="" /> |
| | | <img src="@/assets/images/task/title@2x.png" class="bg" alt="" /> |
| | | </div> |
| | | <div class="static_wrap"> |
| | | <div class="item"> |
| | |
| | | <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" /> |
| | | <div>实时告警</div> |
| | | </div> |
| | | <img src="@/assets/images/title@2x.png" class="bg" alt="" /> |
| | | <img src="@/assets/images/task/title@2x.png" class="bg" alt="" /> |
| | | </div> |
| | | <div class="list three-swiper"> |
| | | <div class="swiper-wrapper"> |
| | |
| | | <!-- <div class="status">处理中</div> --> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div v-if="data7.length == 0" class="empty_wrap" style="margin-top: 50px;"> |
| | | <img src="@/assets/images/default_empty.png" alt=""> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | }]), |
| | | new echarts.graphic.LinearGradient(0, 1, 0, 0, [{ |
| | | offset: 0, |
| | | color: '#4370f2' |
| | | }, { |
| | | offset: 1, |
| | | color: '#61d3f9' |
| | | }]), |
| | | new echarts.graphic.LinearGradient(0, 1, 0, 0, [{ |
| | | offset: 0, |
| | | color: '#4679f6' |
| | | }, { |
| | | offset: 1, |
| | | color: '#4674f6' |
| | | }]), |
| | | new echarts.graphic.LinearGradient(0, 1, 0, 0, [{ |
| | | offset: 0, |
| | | color: '#4370f2' |
| | | }, { |
| | | offset: 1, |
| | | color: '#61d3f9' |
| | | }])] |
| | | ] |
| | | const temp = [] |
| | | temp.push({ name: '签到数', value: data4.value?.signedNum || 0, rate: data4.value?.signedNum ? '100.0' : 0 }) |
| | | temp.push({ name: '已叫号', value: data4.value?.calledNum || 0, rate: data4.value?.signedNum ? (data4.value.calledNum / data4.value?.signedNum * 100).toFixed(1) : 0 }) |
| | |
| | | show: true, |
| | | position: 'outside', |
| | | formatter: (params) => { |
| | | return `{a|${params.data.name} ${params.data.rate}%}` |
| | | const index = params.dataIndex; |
| | | return `{color${index}|${params.data.name} ${params.data.rate}%}` |
| | | // return `<div>${params.data.name}</div>` |
| | | }, |
| | | rich: { |
| | | a: { |
| | | color: '#869CC9', |
| | | fontSize: 13 |
| | | }, |
| | | color0: { color: 'orange', fontSize: 14 }, |
| | | color1: { color: '#869CC9', fontSize: 13 }, |
| | | color2: { color: '#869CC9', fontSize: 13 }, |
| | | color3: { color: '#869CC9', fontSize: 13 } |
| | | } |
| | | }, |
| | | labelLine: { |
| | |
| | | item.rate = ((item.workTotalTime / count) * 30).toFixed(0) |
| | | return item |
| | | }) |
| | | loopFn2() |
| | | }) |
| | | } |
| | | |
| | |
| | | i.finishTime = dayjs(i.finishTime).format('HH:mm') |
| | | return i |
| | | }) |
| | | loopFn5() |
| | | }) |
| | | } |
| | | |
| | |
| | | item.haveTime = dayjs.duration(new Date().getTime() - new Date(item.createDate).getTime()).format('HH小时mm分钟') |
| | | return item |
| | | }) |
| | | loopFn7() |
| | | }) |
| | | } |
| | | |
| | |
| | | getData6() |
| | | getData7() |
| | | |
| | | // initEchart1() |
| | | // initEchart2() |
| | | // initEchart3() |
| | | setInterval(() => { |
| | | getData1() |
| | | getData2() |
| | | getData3() |
| | | getData4() |
| | | getData5() |
| | | getData6() |
| | | getData7() |
| | | }, 1000 * 60) |
| | | |
| | | setTimeout(() => { |
| | | loopFn2() |
| | | loopFn5() |
| | | loopFn7() |
| | | }, 12000) |
| | | }) |
| | | |
| | | |