<template>
|
<view class="pages-task-log-list">
|
<view class="list-content" v-if="list.length > 0">
|
<view class="header">
|
<view class="item">
|
<view class="title">{{totalDuration}}<text class="text">min</text></view>
|
<view class="text">累计时长</view>
|
</view>
|
|
<view class="item">
|
<view class="title">{{totalCount}}</view>
|
<view class="text">累计次数</view>
|
</view>
|
</view>
|
<view class="list">
|
<!-- <view class="task-header" v-if="fixedList.length > 0">固定任务</view> -->
|
<template v-for="(group) in taskList" :key="group.date">
|
<view class="task-header">{{group.date}}</view>
|
<view class="task-list-view">
|
<TaskLogItemView class="list-item" v-for="(item,index) in group.list" :key="index"
|
:taskData="item">
|
</TaskLogItemView>
|
</view>
|
</template>
|
<!-- <view class="task-header" v-if="tempList.length > 0">临时任务</view>
|
<template v-for="(group) in tempList" :key="group.date">
|
<view class="task-header">{{group.date}}</view>
|
<view class="task-list-view">
|
<TaskLogItemView class="list-item" v-for="(item,index) in group.list" :key="index"
|
:taskData="item">
|
|
</TaskLogItemView>
|
</view>
|
</template> -->
|
</view>
|
</view>
|
<view class="list-no-content" v-else>
|
<!-- <image class="img" src="/images/icon-park-outline_attention.svg" alt=" 图片" mode="aspectFit" />-->
|
<uni-icons color="#ccc" type="info" size="128"></uni-icons>
|
<view class="space">没有找到符合条件的任务记录</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import {
|
showToast,
|
showModal,
|
showError,
|
showInfo
|
} from "@/comm/utils.js"
|
import TaskLogItemView from "./infos/task-log-item.vue"
|
import {
|
getTaskLog
|
} from "@/api/vehicle.js"
|
export default {
|
name: "PagesTaskLogList",
|
components: {
|
TaskLogItemView
|
},
|
data() {
|
return {
|
ip: "",
|
sceneId: "",
|
list: [],
|
}
|
},
|
computed: {
|
taskList() {
|
const listRes = []
|
this.list.forEach((ele) => {
|
const dateStart = new Date(Number(ele.start_time))
|
const date = `${dateStart.getMonth()}-${dateStart.getDay()}`;
|
const curIndex = listRes.findIndex((a) => a.date == date)
|
if (curIndex < 0) {
|
let group = {
|
date,
|
list: [ele]
|
}
|
listRes.push(group)
|
} else {
|
let group = listRes[curIndex]
|
group.list.push(ele)
|
}
|
|
})
|
listRes.sort((a, b) => {
|
return a.date < b.date ? 1 : -1
|
});
|
return listRes
|
},
|
fixedList() {
|
let list = this.list.filter((a) => a.tasktype == 1)
|
let group
|
const listRes = []
|
list.sort((a, b) => {
|
return a.date > b.date
|
});
|
list.forEach((item) => {
|
if (group) {
|
if (item.date != group.date) {
|
group = {
|
date: item.date,
|
list: []
|
}
|
listRes.push(group)
|
}
|
} else {
|
group = {
|
date: item.date,
|
list: []
|
}
|
listRes.push(group)
|
}
|
group.list.push(item)
|
})
|
return listRes
|
},
|
totalDuration() {
|
let d = 0
|
// this.list.forEach((item) => {
|
// d += item.duration || 0
|
// })
|
this.list.forEach((item) => {
|
d +=( item.end_time - item.start_time)
|
})
|
return Math.ceil(d / (60 * 1000))
|
},
|
totalCount() {
|
let cnt =this.list.length
|
// this.list.forEach((item) => {
|
// cnt += item.list.length
|
// })
|
return cnt
|
},
|
},
|
onLoad(option) {
|
this.ip = option.ip || ""
|
this.sceneId = option.sceneId || ""
|
this.loadData()
|
},
|
methods: {
|
setData(obj) {
|
let that = this;
|
let keys = [];
|
let val, data;
|
|
Object.keys(obj).forEach(function(key) {
|
keys = key.split(".");
|
val = obj[key];
|
data = that.$data;
|
keys.forEach(function(key2, index) {
|
if (index + 1 == keys.length) {
|
that.$set(data, key2, val);
|
} else {
|
if (!data[key2]) {
|
that.$set(data, key2, {});
|
}
|
}
|
data = data[key2];
|
});
|
});
|
},
|
async loadData() {
|
try {
|
this.list = await this.loadTaskLog()
|
} catch (ex) {
|
showError(ex)
|
}
|
},
|
async loadTaskLog() {
|
try {
|
|
const now = new Date();
|
const oneWeekAgo = new Date();
|
const endTimeStamp = `${now.getTime()}`
|
oneWeekAgo.setDate(now.getDate() - 7);
|
const startTimeStamp = `${oneWeekAgo.getTime()}`
|
const res = await getTaskLog(this.ip, startTimeStamp, endTimeStamp)
|
|
const list = res?.task_info || []
|
list.sort((a, b) => {
|
return a.end_time < b.end_time ? 1 : -1
|
});
|
|
showToast(`装载了${list.length}记录`)
|
return list
|
} catch (ex) {
|
showError(ex)
|
return []
|
}
|
},
|
|
clickTask(item) {
|
// uni.navigateTo({
|
// url: "/pages/task/index"
|
// })
|
},
|
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.pages-task-log-list {
|
display: flex;
|
width: 750rpx;
|
height: 100vh;
|
flex-direction: column;
|
background-color: #F5F5F5;
|
|
.list-content {
|
display: flex;
|
width: 100%;
|
padding: 0 10px;
|
flex: 1;
|
flex-direction: column;
|
overflow-y: auto;
|
overflow-x: hidden;
|
|
|
.header {
|
width: calc(100% - 40rpx);
|
padding: 20rpx;
|
display: flex;
|
flex-direction: row;
|
|
.item {
|
padding: 0 20rpx;
|
display: flex;
|
width: calc(100% - 40rpx);
|
flex-direction: column;
|
flex: 1;
|
|
.title {
|
font-size: 40rpx;
|
font-weight: 700;
|
}
|
|
.text {
|
font-size: 30rpx;
|
color: #888;
|
}
|
}
|
}
|
|
.list {
|
width: calc(100% - 20rpx);
|
margin: 10rpx;
|
padding: 0 10rpx;
|
display: flex;
|
flex-direction: column;
|
flex: 1;
|
overflow: auto;
|
|
.task-header {
|
width: 100%;
|
padding: 10rpx;
|
font-size: 32rpx;
|
}
|
|
.task-list-view {
|
width: 100%;
|
border-radius: 10rpx;
|
// padding: 0 10rpx;
|
background-color: #fff;
|
|
.list-item {
|
|
border-bottom: 1px solid #ddd;
|
}
|
|
.list-item:last-child {
|
border-bottom: 0;
|
/* 右下角 */
|
}
|
}
|
|
|
}
|
}
|
|
.list-no-content {
|
margin-top: 50px;
|
padding: 20rpx 40rpx;
|
align-items: center;
|
text-align: center;
|
display: flex;
|
flex-direction: column;
|
font-size: 30rpx;
|
font-weight: 400;
|
|
.img {
|
width: 212rpx;
|
height: 212rpx;
|
color: #ddd;
|
}
|
|
.space {
|
margin-top: 20rpx;
|
}
|
|
}
|
|
|
}
|
</style>
|
