<template>
|
<div class="executeNestDetails">
|
<img src="/src/assets/images/task/sign.svg" alt="">
|
<div class="title">
|
任务执行详情
|
</div>
|
</div>
|
<div class="ztzf-table">
|
<el-table
|
v-loading="loading"
|
element-loading-background="rgba(22, 43, 74, 0.79)"
|
:row-class-name="tableRowClassName"
|
:data="taskData"
|
style="width: 100%"
|
:row-style="{ height: pxToRem(48), fontSize: pxToRem(14), 'text-align': 'center' }"
|
:header-cell-style="{ 'text-align': 'center', height: pxToRem(36), fontSize: pxToRem(14) }"
|
>
|
<el-table-column type="index" label="序号" :width="pxToRemNum(100)" align="center">
|
<template #default="{ $index }">
|
{{ ($index + 1).toString().padStart(2, '0') }}
|
</template>
|
</el-table-column>
|
<el-table-column show-overflow-tooltip prop="nick_name" label="机巢名称" align="center">
|
<template #default="scope">
|
<el-tooltip-copy :content="scope.row.nick_name" :showCopyText="true">
|
{{ scope.row.nick_name }}
|
</el-tooltip-copy>
|
</template>
|
</el-table-column>
|
|
<el-table-column prop="status" label="执行状态" align="center">
|
<template #default="scope">
|
<div class="base_f_c_c">
|
<span
|
:style="{
|
color:
|
scope.row.status === 1
|
? '#ffe17e'
|
: scope.row.status === 2
|
? '#ffa768'
|
: scope.row.status === 3
|
? 'rgb(6, 217, 87)'
|
: 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>
|
</div>
|
</template>
|
<script setup>
|
import { NestDetailApi } from '@/api/home'
|
import { dayjs, ElMessage, ElMessageBox } from 'element-plus'
|
import { pxToRem, pxToRemNum } from '@/utils/rem'
|
import { QuestionFilled } from '@element-plus/icons-vue'
|
import { ContinuingToFly } from '@/const/device'
|
const props = defineProps(['wayLineJobInfoId', 'batchNo'])
|
const taskData = ref('')
|
// 是否展示再次执行弹框
|
let isShowDetails = ref(false)
|
const singledevice_sns = ref([])
|
const deviseName = ref(null)
|
const devisejobInfoId = ref('')
|
const devisebatchNo = ref(null)
|
const loading = ref(false)
|
const isShowContinuingToFly = code => {
|
return ContinuingToFly.find(i => i.code === code)
|
}
|
// 状态文字
|
const getStatusText = status => {
|
const statusMap = {
|
1: '待执行',
|
2: '执行中',
|
3: '已执行',
|
4: '已取消',
|
5: '执行失败',
|
7: '取消执行',
|
}
|
return statusMap[status] || '-'
|
}
|
// 表格隔行变色
|
const tableRowClassName = ({ row, rowIndex }) => {
|
if (rowIndex % 2 === 1) {
|
return 'warning-row'
|
} else {
|
return 'success-row'
|
}
|
}
|
|
const handleSearch = () => {}
|
// 执行机巢详情
|
const getNestDetailApi = () => {
|
const params = {
|
jobInfoId: props.wayLineJobInfoId,
|
batchNo: props.batchNo,
|
}
|
NestDetailApi(params).then(res => {
|
taskData.value = res.data.data
|
})
|
}
|
onMounted(() => {
|
getNestDetailApi()
|
})
|
</script>
|
|
<style scoped lang="scss">
|
.executeNestDetails {
|
display: flex;
|
align-items: center;
|
border-bottom: 2px solid #e4e7ed;
|
img {
|
width: 15px;
|
height: 15px;
|
}
|
margin-bottom: 8px;
|
|
.title {
|
margin-left: 10px;
|
font-size: 16px;
|
color: #303133;
|
}
|
}
|
|
.ztzf-table {
|
margin-bottom: 16px;
|
}
|
|
// 待处理
|
.pending {
|
color: #ff7411;
|
}
|
// 待审核
|
.reviewed {
|
color: #ff472f;
|
}
|
// 处理中
|
.processing {
|
color: #ffff61;
|
}
|
// 已完成
|
.done {
|
color: #06d957;
|
}
|
// 已完结
|
.ended {
|
color: #06d957;
|
}
|
|
.searchBox {
|
display: flex;
|
}
|
.search-btn {
|
display: flex;
|
img {
|
cursor: pointer;
|
margin-right: 8px;
|
width: 82px;
|
height: 32px;
|
}
|
}
|
.btnGroups {
|
display: flex;
|
align-items: center;
|
justify-content: space-around;
|
div {
|
height: 27px;
|
line-height: 27px;
|
background: #001f4e !important;
|
border-radius: 0px 0px 0px 0px;
|
border: 1px solid #51a8ff !important;
|
font-size: 14px;
|
color: #ffffff;
|
text-align: center;
|
cursor: pointer;
|
padding: 0 8px;
|
}
|
}
|
</style>
|
<style lang="scss">
|
.machineTableDetailsTitle {
|
display: flex;
|
border-bottom: 2px solid #e4e7ed;
|
background-size: 100% 100%;
|
|
img {
|
width: 15px;
|
height: 15px;
|
margin-top: 6px;
|
}
|
|
.title {
|
display: inline-block;
|
margin-left: 10px;
|
font-size: 16px;
|
// color: #0282ff;
|
color: #303133;
|
line-height: 20px;
|
text-align: left;
|
margin-bottom: 8px;
|
}
|
|
.btn {
|
margin-left: 16px;
|
margin-bottom: 8px;
|
line-height: 20px;
|
}
|
}
|
</style>
|
