| | |
| | | <div class="flight"> |
| | | <div class="search-box"> |
| | | <el-form :model="params" inline> |
| | | <div style="display: flex;justify-content: space-between"> |
| | | <div> |
| | | <el-form-item label="任务名称:"> |
| | | <el-input v-model="params.jobName" placeholder="请输入任务名称" clearable /> |
| | | </el-form-item> |
| | | <el-form-item label="任务编号:"> |
| | | <el-input v-model="params.jobInfoNum" placeholder="请输入任务编号" clearable /> |
| | | </el-form-item> |
| | | <el-form-item label="日期:"> |
| | | <el-date-picker |
| | | v-model="rangTime" |
| | |
| | | @change="changeselect" |
| | | /> |
| | | </el-form-item> |
| | | </div> |
| | | <div> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="getList">搜索</el-button> |
| | | <el-button @click="cancelSearch">取消</el-button> |
| | | <el-button @click="cancelSearch">清空</el-button> |
| | | </el-form-item> |
| | | </div> |
| | | </div> |
| | | </el-form> |
| | | <div> |
| | | <!-- <div> |
| | | <el-button :type="tabType === '全部'?'primary':'default'" @click="handleAll"><el-icon><Folder /></el-icon>全部</el-button> |
| | | <el-button :type="tabType === '收藏'?'primary':'default'" @click="handleStartList"><el-icon><Star /></el-icon>我的收藏</el-button> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <div class="mange-table"> |
| | | <el-tabs v-model="tabType" class="demo-tabs" @tab-click="handleTabClick"> |
| | | <el-tab-pane label="全部" name="全部"></el-tab-pane> |
| | | <el-tab-pane label="我的收藏" name="收藏"></el-tab-pane> |
| | | <el-table border :data="tableList" class="custom-header"> |
| | | <el-table-column label="序号" type="index" width="60"></el-table-column> |
| | | <el-table-column label="序号" type="index" width="60" align="center"></el-table-column> |
| | | <el-table-column prop="job_name" label="任务名称" align="center" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="job_info_num" label="任务编号" align="center" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="title" label="飞行类型" align="center" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="device_name" label="无人机" align="center"></el-table-column> |
| | | <el-table-column prop="start_time" label="开始时间" align="center"> |
| | |
| | | </el-table-column> |
| | | <el-table-column prop="end_time" label="标签" align="center"> |
| | | <template #default="scope"> |
| | | <el-select v-model="scope.row.label_id" @change="handleUpdateLabel(scope.row)"> |
| | | <el-select v-model="scope.row.label_id" @change="handleUpdateLabel(scope.row)" clearable> |
| | | <el-option |
| | | v-for="item in tagList" |
| | | :key="item.id" |
| | |
| | | </el-select> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" width="200" align="center"> |
| | | <el-table-column label="操作" width="340" align="center"> |
| | | <template #default="scope"> |
| | | <!-- <el-button icon="el-icon-view" type="text" @click="handleDetail(scope.row)">查看</el-button> --> |
| | | <!-- <el-button icon="el-icon-delete" type="text" @click="handleDelete">删除</el-button> --> |
| | | <el-button type="text" @click="handleStar(scope.row)"><el-icon><Star /></el-icon>{{ scope.row.is_favorite ? '取消收藏':'收藏' }}</el-button> |
| | | <el-button icon="el-icon-view" type="text" @click="handleDetail(scope.row)">查看</el-button> |
| | | <el-button icon="el-icon-view" type="text" v-if="!scope.row.isHL" @click="handleWarnInfo(scope.row)">警告</el-button> |
| | | <el-button icon="el-icon-delete" type="text" @click="handleDelete(scope.row)">删除</el-button> |
| | | <el-button type="text" @click="handleStar(scope.row)"> |
| | | <el-icon><Star /></el-icon> |
| | | {{ scope.row.is_favorite ? '取消收藏':'收藏' }}</el-button> |
| | | <el-button type="text" @click="handleExport(scope.row)"><el-icon><Download /></el-icon>导出</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-tabs> |
| | | </div> |
| | | |
| | | <div class="pagination"> |
| | | <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="params.page" |
| | |
| | | @size-change="handleSizeChange" @current-change="handleCurrentChange" /> |
| | | </div> |
| | | </div> |
| | | <!-- <el-dialog class="ztzf-dialog" append-to-body v-model="isShowView" title="查看" |
| | | :width="pxToRem(600)" :close-on-click-modal="false" :destroy-on-close="true"> |
| | | <div class="content"> |
| | | <table class="view-table" border> |
| | | <tr> |
| | | <td class="label">空域类型</td> |
| | | <td class="value">{{ rowView.model_name }}</td> |
| | | <td class="label">创建时间</td> |
| | | <td class="value">{{ rowView.alg_type }}</td> |
| | | </tr> |
| | | </table> |
| | | <el-dialog class="ztzf-dialog" append-to-body v-model="isShowView" title="查看" |
| | | :width="pxToRem(1000)" :close-on-click-modal="false" :destroy-on-close="true"> |
| | | <!-- <div class="content"> --> |
| | | <el-table border :data="tableDataDetails" height="466"> |
| | | <el-table-column label="序号" type="index" width="60"></el-table-column> |
| | | <el-table-column prop="flight_type" label="飞行类型" align="center" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="latitude" label="经度" align="center"></el-table-column> |
| | | <el-table-column prop="longitude" label="纬度" align="center"></el-table-column> |
| | | <el-table-column prop="height" label="高度" align="center"></el-table-column> |
| | | <el-table-column prop="elevation" label="海拔高度" align="center"></el-table-column> |
| | | </el-table> |
| | | <div class="pagination" style="display: flex;justify-content: end;margin-top: 10px;"> |
| | | <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="detailParams.current" |
| | | v-model:page-size="detailParams.size" layout="total, sizes, prev, pager, next, jumper" :total="detailTotal" |
| | | @size-change="handleSizeChangeDetails" @current-change="handleCurrentChangeDetails" /> |
| | | <!-- </div> --> |
| | | </div> |
| | | </el-dialog> |
| | | <el-dialog class="ztzf-dialog" append-to-body v-model="isShowEditView" title="新增" |
| | | :width="pxToRem(800)" :close-on-click-modal="false" :destroy-on-close="true"> |
| | | <div class="content-edit"> |
| | | <el-form ref="ruleFormRef" :model="editParams" :rules="rules" inline> |
| | | <el-form-item label="空域名称"> |
| | | <el-input v-model="editParams.model_name" /> |
| | | </el-form-item> |
| | | <div class="btns"> |
| | | <el-button type="primary" @click="submit(ruleFormRef)">确认</el-button> |
| | | <el-button @click="isShowEditView = false">取消</el-button> |
| | | </div> |
| | | </el-form> |
| | | </div> |
| | | </el-dialog> --> |
| | | <el-dialog class="ztzf-dialog" append-to-body v-model="isShowWarnView" title="查看警告信息" :width="pxToRem(1000)" :close-on-click-modal="false" :destroy-on-close="true"> |
| | | <el-table border :data="warningList" height="300"> |
| | | <el-table-column label="序号" type="index" width="60" align="center"></el-table-column> |
| | | <el-table-column prop="warn_info" label="内容" align="center" show-overflow-tooltip></el-table-column> |
| | | </el-table> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowWarnView = false">取 消</el-button> |
| | | <el-button type="primary" @click="hlSubmit">忽略</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </template> |
| | | <script setup> |
| | | import { getHistoryTrack, cancelStar, addStar, updateDroneFlight } from '@/api/logs'; |
| | | import { getHistoryTrack, cancelStar, addStar, updateDroneFlight, droneFlightLogInfoPage } from '@/api/logs'; |
| | | import { flightLogPage } from '@/api/airspace/airspace'; |
| | | import { downloadXls } from '@/utils/util'; |
| | | import { exportBlob } from '@/api/common' |
| | | import { ElMessage, ElMessageBox, ElLoading } from 'element-plus'; |
| | | import { dateNow } from '@/utils/date'; |
| | | |
| | | const total = ref(0) |
| | | let rangTime = ref([]) |
| | |
| | | page_size: 10, |
| | | startTime: '', |
| | | endTime: '', |
| | | jobName: '', |
| | | jobInfoNum: '', |
| | | }); |
| | | |
| | | let tableList = ref([]) |
| | | |
| | | // let isShowView = ref(false) |
| | | |
| | | // let rowView = ref({}) |
| | | |
| | | // let isShowEditView = ref(false) |
| | | let isShowView = ref(false) |
| | | let isShowWarnView = ref(false) |
| | | let warningList = ref([]) |
| | | |
| | | let tabType = ref('全部') |
| | | // const ruleFormRef = ref() |
| | | // let editParams = ref({ |
| | | // model_name: '', |
| | | // alg_type: '', |
| | | // qua_rate: '', |
| | | // pass_rate: '', |
| | | // event_type: '', |
| | | // remark: '' |
| | | // }) |
| | | |
| | | function timeFormatConvert(time) { |
| | | if (!time) return '/' |
| | |
| | | } |
| | | |
| | | function cancelSearch() { |
| | | rangTime.value = [] |
| | | params.value = { |
| | | isFavorite: false, |
| | | startTime: '', |
| | | endTime: '', |
| | | isFavorite: tabType.value === '收藏' ? true : false, |
| | | page: '1', |
| | | page_size: '10', |
| | | jobName: '', |
| | | jobInfoNum: '', |
| | | } |
| | | getList() |
| | | } |
| | | |
| | | function getList() { |
| | | console.log(rangTime.value, '333') |
| | | params.value.startTime = rangTime.value?.length ? rangTime.value[0].getTime() : '' |
| | | params.value.endTime = rangTime.value?.length? rangTime.value[1].getTime() : '' |
| | | params.value.endTime = rangTime.value?.length? new Date( |
| | | rangTime.value[1].getFullYear(), |
| | | rangTime.value[1].getMonth(), |
| | | rangTime.value[1].getDate(), |
| | | 23, 59, 59 |
| | | ).getTime() : '' |
| | | getHistoryTrack(params.value).then(res => { |
| | | tableList.value = res.data.data.list || [] |
| | | tableList.value = res.data.data.list.map(item => { |
| | | return { |
| | | ...item, |
| | | isHL: false, |
| | | children: [{ |
| | | id: item.id, |
| | | time: timeFormatConvert(dateNow()), |
| | | warn_info: '信号受到干扰,请谨慎飞行' |
| | | }, |
| | | { |
| | | id: item.id, |
| | | time: timeFormatConvert(dateNow()), |
| | | warn_info: '风速较大,请谨慎飞行' |
| | | }], |
| | | } |
| | | }) |
| | | total.value = res.data.data.pagination.total || 0 |
| | | |
| | | }) |
| | | } |
| | | |
| | |
| | | tabType.value = '全部' |
| | | getList() |
| | | } |
| | | // 查看 |
| | | let tableDataDetails = ref([]) |
| | | let detailTotal = ref(0) |
| | | let detailParams = ref({ |
| | | current: 1, |
| | | size: 10, |
| | | flightId: '' |
| | | }) |
| | | function handleDetail(row) { |
| | | isShowView.value = true |
| | | detailParams.value.current = 1 |
| | | detailParams.value.flightId = row.id |
| | | detailTotal.value = 0 |
| | | droneFlightLogInfoPage(detailParams.value).then(res => { |
| | | tableDataDetails.value = res.data.data.records |
| | | detailTotal.value = res.data.data.total |
| | | }) |
| | | } |
| | | // 警告信息 |
| | | let saveId = ref('') |
| | | function handleWarnInfo(row) { |
| | | isShowWarnView.value = true |
| | | saveId.value = row.id |
| | | warningList.value = tableList.value.find(item => item.id === row.id).children |
| | | } |
| | | function hlSubmit() { |
| | | // 设置isHL为true |
| | | tableList.value.map(item => { |
| | | if (item.id === saveId.value) { |
| | | item.isHL = true |
| | | isShowWarnView.value = false |
| | | } |
| | | }) |
| | | } |
| | | // 分页 |
| | | function handleSizeChangeDetails(val) { |
| | | detailParams.value.size = val |
| | | detailParams.value.current = 1 |
| | | droneFlightLogInfoPage(detailParams.value).then(res => { |
| | | tableDataDetails.value = res.data.data.records |
| | | detailTotal.value = res.data.data.total |
| | | }) |
| | | } |
| | | function handleCurrentChangeDetails(val) { |
| | | detailParams.value.current = val |
| | | droneFlightLogInfoPage(detailParams.value).then(res => { |
| | | tableDataDetails.value = res.data.data.records |
| | | detailTotal.value = res.data.data.total |
| | | }) |
| | | } |
| | | |
| | | |
| | | function handleStartList() { |
| | | params.value.isFavorite = true |
| | |
| | | getList() |
| | | } |
| | | |
| | | // async function submit(formValidate) { |
| | | // if (!formValidate) return |
| | | // await formValidate.validate((valid, fields) => { |
| | | // if (valid) { |
| | | // algorithmManageEdit(editParams.value).then(res => { |
| | | // isShowEditView.value = false |
| | | // getList() |
| | | // }) |
| | | // } |
| | | // }) |
| | | // } |
| | | function handleTabClick() { |
| | | if (tabType.value === '全部') { |
| | | handleAll() |
| | | } else if (tabType.value === '收藏') { |
| | | handleStartList() |
| | | } |
| | | } |
| | | |
| | | // 收藏 |
| | | function handleStar(row) { |
| | | console.log(row, '5555') |
| | | if (row.is_favorite) { |
| | | cancelStar(row.id).then(res => { |
| | | ElMessage.success('取消收藏成功') |
| | |
| | | function handleUpdateLabel(row) { |
| | | updateDroneFlight({ id: row.id, label_id: row.label_id }).then(res => { |
| | | // getList() |
| | | ElMessage.success('标签成功') |
| | | ElMessage.success('设置标签成功') |
| | | }) |
| | | } |
| | | |
| | | // 删除 |
| | | function handleDelete(row) { |
| | | ElMessageBox.confirm('确定删除该条数据?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }).then(() => { |
| | | updateDroneFlight({ is_deleted: 1, id: row.id }).then(res => { |
| | | ElMessage.success('删除成功') |
| | | getList() |
| | | }) |
| | | }).catch(() => { |
| | | ElMessage({ |
| | | type: 'info', |
| | | message: '已取消删除' |
| | | }) |
| | | }) |
| | | } |
| | | |
| | |
| | | display: flex; |
| | | flex-direction: column; |
| | | .search-box { |
| | | height: 80px; |
| | | height: 30px; |
| | | } |
| | | |
| | | :deep(.el-input) { |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | .content { |
| | | padding: 20px; |
| | | |
| | | |
| | | .view-table { |
| | | width: 100%; |
| | | border-collapse: collapse; |
| | | border: 1px solid #EBEEF5; |
| | | |
| | | |
| | | tr { |
| | | &:not(:last-child) { |
| | | border-bottom: 1px solid #EBEEF5; |
| | | } |
| | | |
| | | |
| | | td { |
| | | padding: 12px 10px; |
| | | |
| | | |
| | | &.label { |
| | | width: 140px; |
| | | text-align: right; |
| | |
| | | // background-color: #F5F7FA; |
| | | border-right: 1px solid #EBEEF5; |
| | | } |
| | | |
| | | |
| | | &.value { |
| | | width: 180px; |
| | | // color: #303133; |
| | |
| | | :deep(.el-form-item__label) { |
| | | width: 120px; |
| | | } |
| | | |
| | | |
| | | } |
| | | .btns { |
| | | display: flex; |
| | |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | | </style> |