| | |
| | | <el-dialog |
| | | class="inspection-rask-details-dialog ztzf-dialog" |
| | | v-model="isShowDetailsDialog" |
| | | :width="pxToRem(1000)" |
| | | :width="pxToRem(1500)" |
| | | :close-on-click-modal="false" |
| | | :destroy-on-close="true" |
| | | > |
| | |
| | | <el-input class="ztzf-input" v-model="searchForm.key_word" placeholder="请输入任务/机巢名称" clearable /> |
| | | </el-form-item> |
| | | <el-form-item label="关联算法"> |
| | | <el-select class="ztzf-select" v-model="searchForm.ai_types" placeholder="请选择"> |
| | | <el-select :teleported="false" class="ztzf-select" v-model="searchForm.ai_types" placeholder="请选择"> |
| | | <el-option v-for="item in taskAlgorithm" :key="item.id" :label="item.dictValue" :value="item.dictKey" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="任务状态"> |
| | | <el-select class="ztzf-select" v-model="searchForm.status" placeholder="请选择" clearable> |
| | | <el-select :teleported="false" class="ztzf-select" v-model="searchForm.status" placeholder="请选择" clearable> |
| | | <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </div> |
| | | <div class="search-row"> |
| | | <el-form-item label="选择机巢"> |
| | | <el-select class="ztzf-select" v-model="searchForm.device_sn" placeholder="请选择"> |
| | | <el-select :teleported="false" class="ztzf-select" v-model="searchForm.device_sn" placeholder="请选择"> |
| | | <el-option |
| | | v-for="item in deviceList" |
| | | :label="item.nickname" |
| | |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-date-picker |
| | | popper-class="custom-date-picker" |
| | | class="ztzf-date-picker" |
| | | v-model="dateRange" |
| | | type="daterange" |
| | |
| | | <el-table |
| | | :data="taskDetailData" |
| | | :row-class-name="tableRowClassName" |
| | | :row-style="{ height: '54px', fontSize: '14px', 'text-align': 'center' }" |
| | | :row-style="{ height: '45px', fontSize: '14px', 'text-align': 'center' }" |
| | | :header-cell-style="{ 'text-align': 'center', height: '36px', fontSize: '14px' }" |
| | | > |
| | | <el-table-column label="序号" type="index" width="60"> |
| | |
| | | ? 'distributed' |
| | | : scope.row.status === 3 |
| | | ? 'finish ' |
| | | |
| | | |
| | | : 'fail ' |
| | | : scope.row.status === 5 |
| | | ? 'fail ' |
| | | : ' ' |
| | | " |
| | | > |
| | | {{ |
| | |
| | | ? '执行中' |
| | | : scope.row.status === 3 |
| | | ? '已执行' |
| | | |
| | | : '执行失败' |
| | | : scope.row.status === 5 |
| | | ? '执行失败' |
| | | : '' |
| | | }} |
| | | </span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column show-overflow-tooltip prop="industry_type_str" label="任务类型" /> |
| | | <el-table-column prop="begin_time" label="任务时间" width="150" /> |
| | | <el-table-column prop="cycle_time_value" label="任务时间" width="150" /> |
| | | <el-table-column prop="event_number" label="关联事件"> |
| | | <template #default="scope"> |
| | | <span>{{ scope.row.event_number ? scope.row.event_number : '/' }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" width="80"><div class="ztzf-view">查看</div></el-table-column> |
| | | <el-table-column label="操作" width="80"> |
| | | <template #default="scope"> |
| | | <div class="ztzf-view" @click="viewDetail(scope.row)">查看</div> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | <!-- 分页 --> |
| | | <div style="display: flex; justify-content: center"> |
| | | <div style="display: flex; justify-content: center; margin: 15px 0"> |
| | | <el-pagination |
| | | class="ztzf-pagination" |
| | | v-model:current-page="pageParams.current" |
| | |
| | | /> |
| | | </div> |
| | | </el-dialog> |
| | | <!-- 当前任务详情 --> |
| | | <CurrentTaskDetails |
| | | v-if="isShowCurrentTaskDetails" |
| | | v-model:show="isShowCurrentTaskDetails" |
| | | :id="rowData.id" |
| | | /> |
| | | <!-- 历史任务详情 --> |
| | | <DeviceJobDetails |
| | | v-if="isShowDeviceJobDetails" |
| | | v-model:show="isShowDeviceJobDetails" |
| | | :wayLineJodInfoId="rowData.id" |
| | | /> |
| | | </template> |
| | | <script setup> |
| | | import { pxToRem } from '@/utils/rem' |
| | |
| | | import { getDictionary } from '@/api/system/dict' |
| | | import { selectDevicePage } from '@/api/home/machineNest' |
| | | import { getMultipleDictionary } from '@/api/system/dictbiz' |
| | | import CurrentTaskDetails from '@/components/CurrentTaskDetails/CurrentTaskDetails.vue' |
| | | import DeviceJobDetails from '@/components/DeviceJobDetails/DeviceJobDetails.vue' |
| | | import { ElMessage } from 'element-plus' |
| | | const isShowDetailsDialog = defineModel('show') |
| | | const dateRange = ref('') |
| | | const searchForm = reactive({ |
| | |
| | | const statusOptions = [ |
| | | { label: '待执行', value: 1 }, |
| | | { label: '执行中', value: 2 }, |
| | | { label: '已完成', value: 3 }, |
| | | |
| | | { label: '执行失败', value: 4 }, |
| | | { label: '已执行', value: 3 }, |
| | | |
| | | { label: '执行失败', value: 5 }, |
| | | ] |
| | | // 设备页面参数 |
| | | const devicePageParams = ref({ |
| | |
| | | } |
| | | // 获取任务列表 |
| | | const getJobList = () => { |
| | | // 事件状态:0 =待处理,1=待分拨,2=待处理,3=处理中,4=已完成 5=已完结 |
| | | jobList(taskDetailParams).then(res => { |
| | | if (res.data.code !== 0) return |
| | | taskDetailData.value = res.data.data.records |
| | |
| | | return 'success-row' |
| | | } |
| | | } |
| | | // 查看 |
| | | const isShowCurrentTaskDetails = ref(false) |
| | | const isShowDeviceJobDetails = ref(false) |
| | | let rowData = ref({}); |
| | | const viewDetail = row => { |
| | | if (!row.device_sns.length) return ElMessage.warning('没有device_sns'); |
| | | if (row.device_sns.length !== 1) return ElMessage.success('即将跳转到集群调度'); |
| | | rowData.value = row? row : {}; |
| | | if (row.status === 2 || row.status === 1){ |
| | | isShowCurrentTaskDetails.value = true; |
| | | } else{ |
| | | isShowDeviceJobDetails.value = true |
| | | } |
| | | } |
| | | onMounted(() => { |
| | | requestDictionary() |
| | | getJobList() |
| | | getDeviceList() |
| | | }) |
| | | </script> |
| | | <style lang="scss"> |
| | | /* 修改日期单元格背景色 */ |
| | | .custom-date-picker .el-picker-panel__body { |
| | | background: #012350 !important; |
| | | color: #fff !important; |
| | | } |
| | | |
| | | </style> |
| | | <style scoped lang="scss"> |
| | | .search-row { |
| | | display: flex; |
| | |
| | | .tabledata { |
| | | padding: 0 16px; |
| | | overflow: hidden; |
| | | height: 640px; |
| | | // height: 640px; |
| | | overflow-y: scroll !important; |
| | | } |
| | | |
| | | // 任务状态颜色 |
| | | // 待执行 |
| | | .pending { |
| | | color: #e36913; |
| | | color: #ffe17e; |
| | | } |
| | | // 执行中 |
| | | .distributed { |
| | | color: #ffc398; |
| | | color: #ffa768; |
| | | } |
| | | // 已执行 |
| | | .finish { |
| | | color: #afd9fb; |
| | | color: #8effac; |
| | | } |
| | | .cancel { |
| | | color: #11c4ff; |
| | | } |
| | | |
| | | // 执行失败 |
| | | .fail { |
| | | color: #8cfea7; |
| | | color: #ff8e8e; |
| | | } |
| | | </style> |
| | | <style lang="scss"> |
| | | .inspection-rask-details-dialog { |
| | | width: 1270px; |
| | | height: 856px; |
| | | } |
| | | </style> |
| | | |