From cc6ed9d9f2aa4d07e5f900843779a094e7a4dbab Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Mon, 21 Jul 2025 11:16:26 +0800
Subject: [PATCH] feat:优化任务管理搜索操作
---
src/views/job/components/TaskIntermediateContent/TaskIntermediateContent.vue | 147 +++++++++++++++++++++++++++++-------------------
1 files changed, 89 insertions(+), 58 deletions(-)
diff --git a/src/views/job/components/TaskIntermediateContent/TaskIntermediateContent.vue b/src/views/job/components/TaskIntermediateContent/TaskIntermediateContent.vue
index 7dcf2d7..38d6221 100644
--- a/src/views/job/components/TaskIntermediateContent/TaskIntermediateContent.vue
+++ b/src/views/job/components/TaskIntermediateContent/TaskIntermediateContent.vue
@@ -3,16 +3,11 @@
<div class="task-intermediate-content">
<SearchBox @search="searchClick" @addTask="handleAddTask"></SearchBox>
<div class="task-table">
- <el-table
- stripe
- :data="jobListData"
- :row-class-name="tableRowClassName"
- :row-style="{ height: '54px', fontSize: '14px', 'text-align': 'center' }"
- :header-cell-style="{ 'text-align': 'center', height: '36px', fontSize: '14px' }"
- >
+ <el-table border :data="jobListData" class="custom-header">
<el-table-column label="序号" type="index" width="60">
<template #default="{ $index }">
- {{ ($index + 1 + (jobListParams.current - 1) * jobListParams.size).toString().padStart(2, '0') }}
+ {{ ($index + 1 + (jobListParams.current - 1) * jobListParams.size).toString().padStart(2,
+ '0') }}
</template>
</el-table-column>
<el-table-column prop="job_info_num" label="任务编号" show-overflow-tooltip align="center" />
@@ -22,24 +17,33 @@
<el-table-column prop="ai_type_str" label="关联算法" show-overflow-tooltip align="center" />
<el-table-column label="任务状态" align="center">
<template #default="scope">
- <span
- :style="{
- color:
- scope.row.status === 1
- ? '#ffe17e'
- : scope.row.status === 2
- ? '#ffa768'
+ <div class="base_f_c_c">
+ <span :style="{
+ color:
+ scope.row.status === 1
+ ? '#00CDC2'
+ : scope.row.status === 2
+ ? '#FF720F'
: scope.row.status === 3
- ? '#8effac'
- : scope.row.status === 5
- ? '#FF4848'
- : scope.row.status === 7
- ? '#A6A6A6'
- : '',
- }"
- >
+ ? '#00AA2D'
+ : scope.row.status === 5
+ ? '#FF4848'
+ : scope.row.status === 7
+ ? '#A6A6A6'
+ : '',
+ }">
{{ scope.row.status ? getStatusText(scope.row.status) : '' }}
</span>
+ <el-tooltip
+ class="item"
+ effect="dark"
+ :content="scope.row.reason"
+ placement="top"
+ popper-class="reasonNotFly ztzf-tooltip-box1"
+ >
+ <el-icon v-if="scope.row.status === 5 && scope.row.reason" color="#FF4848"><QuestionFilled /></el-icon>
+ </el-tooltip>
+ </div>
</template>
</el-table-column>
<el-table-column prop="is_circle_job" label="任务类型" align="center">
@@ -53,13 +57,13 @@
<span>{{ scope.row.event_number ? scope.row.event_number : '/' }}</span>
</template>
</el-table-column>
- <el-table-column prop="cycle_time_value" label="任务时间" />
- <el-table-column prop="creator_name" label="创建人" align="center" />
+ <el-table-column prop="cycle_time_value" label="任务时间" show-overflow-tooltip />
+ <el-table-column prop="creator_name" label="创建人" align="center" show-overflow-tooltip />
<el-table-column label="操作" width="200" align="center">
<template #default="scope">
<div
v-if="scope.row.status === 2"
- class="btnItem turnBack"
+ class="btnItem"
link
type="primary"
@click="turnBack(scope.row)"
@@ -68,7 +72,7 @@
</div>
<div
v-if="scope.row.status === 1"
- class="btnItem cancelTask"
+ class="btnItem"
link
type="primary"
@click="cancelTask(scope.row)"
@@ -84,10 +88,12 @@
<el-pagination
class="ztzf-pagination"
popper-class="custom-pagination-dropdown"
+ background
+ :page-sizes="[10, 20, 30, 40,50,100]"
+ :size="size"
v-model:current-page="jobListParams.current"
v-model:page-size="jobListParams.size"
- :page-sizes="[10, 20, 30, 40]"
- layout="prev, pager, next, sizes, jumper"
+ layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
@@ -103,29 +109,22 @@
:wayLineJodInfoId="rowData.id"
/> -->
<!-- 历史任务详情 -->
- <DeviceJobDetails
- v-if="isShowDeviceJobDetails"
- v-model:show="isShowDeviceJobDetails"
- :wayLineJodInfoId="rowData.id"
- :batchNo="rowData.batch_no"
- />
- <CancelTaskDialog
- ref="cancelTaskDialogRef"
- v-model:isShowCancelTask="isShowCancelTask"
- :row-data="rowData"
- @refresh="getJobList"
- />
+ <DeviceJobDetails v-if="isShowDeviceJobDetails" v-model:show="isShowDeviceJobDetails" :wayLineJodInfoId="rowData.id"
+ :batchNo="rowData.batch_no" />
+ <CancelTaskDialog ref="cancelTaskDialogRef" v-model:isShowCancelTask="isShowCancelTask" :row-data="rowData"
+ @refresh="getJobList" />
</template>
<script setup>
import SearchBox from '../SearchBox.vue'
import AddTask from './AddTask.vue'
// import CurrentTaskDetails from '@/components/CurrentTaskDetails/CurrentTaskDetails.vue'
-import { jobList, cancelJobs, taskReturnLines } from '@/api/job/task'
+import { jobList, cancelJobs, taskReturnLines, returnHomeCluster } from '@/api/job/task'
import { ElMessage } from 'element-plus'
import DeviceJobDetails from '../DeviceJobDetails.vue'
import CancelTaskDialog from '../CancelTaskDialog.vue'
import { useStore } from 'vuex'
+import { cloneDeep } from 'lodash';
const store = useStore()
const singleUavHome = computed(() => store.state.home.singleUavHome)
const jobListParams = reactive({
@@ -142,7 +141,15 @@
// 获取任务列表
const getJobList = () => {
- jobList(jobListParams).then(res => {
+ const apiParams = {
+ ...cloneDeep(jobListParams),
+ searchParams: {
+ ...cloneDeep(jobListParams.searchParams),
+ status_list: jobListParams.searchParams.status || undefined,
+ status: undefined,
+ },
+ }
+ jobList(apiParams).then(res => {
if (res.data.code !== 0) return
jobListData.value = res.data.data.records
total.value = res.data.data.total
@@ -228,7 +235,12 @@
}
// 返航
const turnBack = row => {
- taskReturnLines(row.device_sns).then(res => {
+ if (row.returnStatus === '待机') return
+
+ if (row.returnStatus === '自动返航') return ElMessage.success('无人机返航中')
+
+ if (row.returnStatus === '自动降落') return ElMessage.success('无人机降落中')
+ returnHomeCluster(row.device_sns).then(res => {
if (res.data.code !== 0) return
ElMessage.success('返航操作成功')
getJobList()
@@ -242,15 +254,23 @@
<style lang="scss" scoped>
.task-intermediate-content {
- margin: 0 30px 16px 40px;
+ height: 0;
+ flex: 1;
+ margin: 0 10px 10px 10px;
background-color: #ffffff;
- padding: 14px 18px;
+ padding: 10px 20px;
+ border-radius: 5px;
+ display: flex;
+ flex-direction: column;
+
// 表格
.task-table {
- height: 520px;
+ height: 0;
+ flex: 1;
margin-top: 18px;
overflow: auto;
}
+
.btnItem {
height: 27px;
line-height: 27px;
@@ -269,24 +289,35 @@
border: 1px solid #ffa500;
color: #ffa500;
}
+
&.cancelTask {
- border: 1px solid #3efe96;
- color: #3efe96;
+ border: 1px solid #00AA2D;
+ color: #00AA2D;
}
}
- :deep(.el-table) {
- --el-table-tr-bg-color: #ffffff;
- --el-table-striped-bg-color: #EFEFEF;
-
- .el-table__body tr.el-table__row--striped td {
- background-color: var(--el-table-striped-bg-color);
- }
- }
+
+ // :deep(.el-table) {
+ // --el-table-tr-bg-color: #ffffff;
+ // --el-table-striped-bg-color: #EFEFEF;
+
+ // .el-table__body tr.el-table__row--striped td {
+ // background-color: var(--el-table-striped-bg-color);
+ // }
+ // }
// 分页
+ :deep(.custom-header th.el-table__cell) {
+ color: rgba(0, 0, 0, 0.85);
+ }
+
+ :deep(.el-table td.el-table__cell) {
+ color: #606266;
+ }
+
:deep(.el-pagination) {
display: flex;
- justify-content: center;
+ justify-content: right;
}
+
:deep(.el-pagination button) {
background: center center no-repeat none !important;
color: #8eb8ea !important;
--
Gitblit v1.9.3