You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
64 lines
1.4 KiB
64 lines
1.4 KiB
|
3 years ago
|
<template>
|
||
|
|
<div class="mile_warp">
|
||
|
|
<div>车辆行驶里程</div>
|
||
|
|
<table>
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th>排名</th>
|
||
|
|
<th>车牌号</th>
|
||
|
|
<th>昨日里程(km/h)</th>
|
||
|
|
<th>轨迹查询</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr v-for="(item,index) in carMile" :key="'car'+index">
|
||
|
|
<td>{{index+1}}</td>
|
||
|
|
<td>{{item.cardNo}}</td>
|
||
|
|
<td>{{item.mile}}</td>
|
||
|
|
<td><a :href="`https://lcrm3.lunz.cn/#/Equipment/LocatMonitor/Path/${item.key}`" target="_blank">查询</a></td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { lunzApi, key, carList } from "@/api/data";
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
carList: carList,//车辆设备
|
||
|
|
carMile:[],
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.queryYesterdayMile();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
//昨日里程
|
||
|
|
queryYesterdayMile() {
|
||
|
|
lunzApi.getYesterdayMile(key).then(res => {
|
||
|
|
let resData = res.Data;
|
||
|
|
console.log(resData)
|
||
|
|
this.carList.map(item => {
|
||
|
|
let idx = resData.findIndex(item2 => item2.Imei == item.deviceId);
|
||
|
|
item.mile = idx > -1 ? res.Data[idx].Mile : 0;
|
||
|
|
this.carMile.push(item);
|
||
|
|
})
|
||
|
|
this.carMile.sort((a,b) => {
|
||
|
|
return b.mile - a.mile;
|
||
|
|
})
|
||
|
|
})
|
||
|
|
},
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.mile_warp {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
overflow: hidden;
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
</style>
|