forked from drone/command-center-dashboard
src/views/Home/HomeLeft/InspectionRaskDetails/InspectionRaskDetailsDialog.vue
@@ -14,22 +14,26 @@ <el-input v-model="searchForm.key_word" placeholder="请输入任务/机巢名称" clearable /> </el-form-item> <el-form-item label="关联算法"> <el-select v-model="searchForm.ai_type" placeholder="请选择"> </el-select> <el-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 v-model="searchForm.status" placeholder="请选择" clearable> <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" /> <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 v-model="searchForm.ai_type" placeholder="请选择"> </el-select> <el-select v-model="searchForm.device_sn" placeholder="请选择"> <el-option v-for="item in deviceList" :label="item.nickname" :value="item.device_sn" :key="item.device_sn" /> </el-select> </el-form-item> <el-form-item> <el-date-picker @@ -50,22 +54,20 @@ </el-form> <!-- 表格 --> <el-table :data="taskDetailData" style="width: 100%"> <el-table-column label="序号"> <el-table-column label="序号" width="60"> <template #default="scope"> <span style="margin-left: 10px">{{ scope.row.date }}</span> {{ (taskDetailParams.page - 1) * taskDetailParams.limit + scope.$index + 1 }} </template> </el-table-column> <el-table-column prop="name" label="任务编号" /> <el-table-column prop="job_info_num" label="任务编号" /> <el-table-column prop="name" label="任务名称" /> <el-table-column prop="name" label="所属机巢" /> <el-table-column prop="name" label="关联算法" /> <el-table-column prop="name" label="任务状态" /> <el-table-column prop="name" label="任务类型" /> <el-table-column prop="name" label="任务时间" /> <el-table-column prop="device_names" label="所属机巢" /> <el-table-column prop="ai_type_str" label="关联算法" /> <el-table-column prop="status" label="任务状态" /> <el-table-column prop="industry_type_str" label="任务类型" /> <el-table-column prop="begin_time" label="任务时间" /> <el-table-column prop="name" label="关联事件" /> <el-table-column label="操作"> <el-button link type="primary" size="small">查看</el-button></el-table-column > <el-table-column label="操作"> <el-button link type="primary" size="small">查看</el-button></el-table-column> </el-table> <!-- 分页 --> <div class="pagination"> @@ -75,9 +77,8 @@ :page-sizes="[10, 20, 30, 50]" background :disabled="disabled" layout="total, sizes, prev, pager, next, jumper" :total="100" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> @@ -86,18 +87,18 @@ </template> <script setup> import { pxToRem } from '@/utils/rem' import { jobList } from '@/api/home/task' import { getDictionary } from '@/api/system/dict' import { selectDevicePage } from '@/api/home/machineNest' import { getMultipleDictionary } from '@/api/system/dictbiz' const isShowDetailsDialog = defineModel('show') const dateRange = ref('') const searchForm = reactive({ key_word: '', // 模糊搜索关键词（匹配名称/昵称/设备sn） ai_type: '', // 算法类型 area_code: '', // 区域code create_dept: '', // 创建部门 date_enum: '', // 日期枚举,可用值:TODAY,CURRENT_WEEK,CURRENT_MONTH,CURRENT_YEAR ai_types: [], // 算法类型 device_sn: '', // 设备编号 end_date: '', // 结束时间 industry_type: '', // 行业key start_date: '', // 开始时间 end_date: null, // 结束时间 start_date: null, // 开始时间 status: '', // 作业状态 }) const statusOptions = [ @@ -107,35 +108,103 @@ { label: '已取消', value: 4 }, { label: '执行失败', value: 5 }, ] // 设备页面参数 const devicePageParams = ref({ current: 1, size: 10, total: 0, nickname: '', }) const deviceList = ref([]) // 表格 const taskDetailData = ref([]) // 表格参数 const taskDetailParams = reactive({ page: 1, limit: 10, searchParams: {}, }) // 分页 const total = ref(0) // 分页参数 let pageParams = reactive({ page: 1, limit: 10, }) // 日期选择 const changeselect = () => { console.log('changedata', dateRange.value) searchForm.start_date = dateRange.value.length ? `${dateRange.value[0]} 00:00:00` : null searchForm.end_date = dateRange.value.length ? `${dateRange.value[1]} 00:00:00` : null } // 重置 const handleReset = () => { console.log('重置') dateRange.value = null Object.keys(searchForm).forEach(key => { if (key == 'start_date' || key == 'end_date') { searchForm[key] = null } else if (key == 'ai_types') { searchForm[key] = [] } else { searchForm[key] = '' } }) handleSearch() } // 查询 const handleSearch = () => { console.log('查询') taskDetailParams.page = 1 taskDetailParams.limit = 10 taskDetailParams.searchParams = searchForm console.log('taskDetailParams.value', taskDetailParams) getJobList() } // 表格 const taskDetailData = ref([]) // 分页 const total = ref(0); // 分页参数 let pageParams = reactive({ page: 1, limit: 10 }); // 分页大小改变 const handleSizeChange =(val)=>{ pageParams.limit = val; const handleSizeChange = val => { pageParams.limit = val getJobList() } // 页码改变 const handleCurrentChange =(val)=>{ pageParams.page = val; const handleCurrentChange = val => { pageParams.page = val getJobList() } // 获取任务列表 const getJobList = () => { jobList(taskDetailParams).then(res => { if (res.data.code !== 0) return taskDetailData.value = res.data.data.records total.value = res.data.data.total }) } // 机巢列表数据 const getDeviceList = async () => { const res = await selectDevicePage({ current: 1, size: 99999, type: 1 }) deviceList.value = res.data?.data?.records || [] } // 关联算法 let taskBusiness = ref([]) let taskAlgorithm = ref([]) // 请求字典字段 const requestDictionary = () => { getMultipleDictionary('SF,HYLB').then(res => { if (res.code !== 0) { // 处理数据 taskAlgorithm.value = res.data.data['SF'] taskBusiness.value = res.data.data['HYLB'] } }) } const algorithmChange = val => { searchForm.ai_types = val } onMounted(() => { requestDictionary() getJobList() getDeviceList() }) </script> <style scoped lang="scss"> .search-row { @@ -174,7 +243,6 @@ } } .pagination { margin-top: 20px; margin-top: 20px; } </style>
