<template>
|
<div class="inspectionTask">
|
<van-search v-model="keyword" placeholder="请输入搜索关键词" />
|
<div @click="executed">已执行</div>
|
<van-tabs v-model:active="currentTab">
|
<van-tab v-for="item in tabList" :key="item.name" :title="item.name" :badge="item.number">
|
<div class="card" v-for="item in list" :key="item.id" @click="taskClick(item)">
|
<div class="c-top">
|
<div class="item">{{ item.area_code }}</div>
|
<div class="item">{{ item.name }}</div>
|
<div class="item">{{ item.cycle_time_value }}</div>
|
</div>
|
<div class="c-bottom">
|
<div class="item">{{ item.device_names }}</div>
|
<div class="item">{{ item.creator_name }}</div>
|
<div class="item" :style="{ color: changeColor(item.status) }">{{ changStatus(item.status) }}</div>
|
</div>
|
</div>
|
</van-tab>
|
</van-tabs>
|
</div>
|
</template>
|
|
<script setup>
|
import { getDeviceJobList } from '@/api/home/task'
|
import { useStore } from 'vuex'
|
|
const store = useStore()
|
|
const keyword = ref('')
|
const currentTab = ref('我的任务')
|
const tabList = ref([
|
{ name: "我的任务", number: 80 },
|
{ name: "计划执行", number: 20 },
|
{ name: "执行中", number: 30 },
|
{ name: "待执行", number: 30 },
|
{ name: "已执行", number: 30 },
|
{ name: "执行失败", number: 30 },
|
{ name: "取消执行", number: 30 },
|
]);
|
|
const params = ref({
|
device_sn: null,
|
order_by_create_time: false,
|
})
|
const sizeParams = ref({
|
current: 1,
|
size: 100,
|
})
|
const list = ref([])
|
function getJobList() {
|
getDeviceJobList(params.value,sizeParams.value).then(res =>{
|
list.value = res.data.data.records
|
})
|
}
|
const listStatus = ref([
|
{ name: '执行中', color: '#FFA768', status: [2] },
|
{ name: '待执行', color: '#FFE17E', status: [1] },
|
{ name: '已执行', color: 'rgb(6, 217, 87)', status: [3] },
|
{ name: '执行失败', color: '#FF4848', status: [5] },
|
{ name: '取消执行', color: '#A6A6A6', status: [7] },
|
])
|
|
function changStatus(status) {
|
return listStatus.value.find(item => item.status.includes(status)).name
|
}
|
function changeColor(status) {
|
return listStatus.value.find(item => item.status.includes(status)).color
|
}
|
function taskClick(item) {
|
uni.navigateTo({
|
url: '/subPackages/taskDetail/execution/index?rowItem=' + JSON.stringify(item)
|
});
|
}
|
|
function executed() {
|
uni.navigateTo({
|
url: '/pages/inspectionTask/TaskDetails/TaskDetails'
|
})
|
}
|
|
onMounted(() => {
|
getJobList()
|
})
|
</script>
|
|
<style scoped lang="scss">
|
.inspectionTask {
|
.card {
|
padding: 10px;
|
.c-top, .c-bottom {
|
height: 32px;
|
display: flex;
|
justify-content: space-between;
|
.item {
|
width: 30%;
|
white-space: nowrap; /* 不换行 */
|
overflow: hidden; /* 超出隐藏 */
|
text-overflow: ellipsis; /* 显示省略号 */
|
}
|
}
|
}
|
}
|
</style>
|
