From dbd4f448518dda6d322ede933df8d5e5ac6bebaf Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Tue, 23 Sep 2025 15:03:49 +0800
Subject: [PATCH] feat:增加飞行日志
---
src/views/flightLog/flightLog.vue | 397 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 397 insertions(+), 0 deletions(-)
diff --git a/src/views/flightLog/flightLog.vue b/src/views/flightLog/flightLog.vue
new file mode 100644
index 0000000..bad3679
--- /dev/null
+++ b/src/views/flightLog/flightLog.vue
@@ -0,0 +1,397 @@
+<!-- 飞行日志 -->
+<template>
+ <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"
+ type="daterange"
+ range-separator="至"
+ start-placeholder="开始日期"
+ end-placeholder="结束日期"
+ clearable
+ @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-form-item>
+ </div>
+ </div>
+ </el-form>
+ <!-- <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 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 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">
+ <template #default="scope">
+ {{ timeFormatConvert(scope.row.start_time) }}
+ </template>
+ </el-table-column>
+ <el-table-column prop="end_time" label="结束时间" align="center">
+ <template #default="scope">
+ {{ timeFormatConvert(scope.row.end_time) }}
+ </template>
+ </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)" clearable>
+ <el-option
+ v-for="item in tagList"
+ :key="item.id"
+ :label="item.label_name"
+ :value="item.id"
+ ></el-option>
+ </el-select>
+ </template>
+ </el-table-column>
+ <el-table-column label="操作" width="300" 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(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"
+ v-model:page-size="params.page_size" layout="total, sizes, prev, pager, next, jumper" :total="total"
+ @size-change="handleSizeChange" @current-change="handleCurrentChange" />
+ </div>
+ </div>
+ <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>
+</template>
+<script setup>
+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';
+
+const total = ref(0)
+let rangTime = ref([])
+const params = ref({
+ isFavorite: false,
+ page: 1,
+ page_size: 10,
+ startTime: '',
+ endTime: '',
+ jobName: '',
+ jobInfoNum: '',
+});
+
+let tableList = ref([])
+
+let isShowView = ref(false)
+
+let tabType = ref('全部')
+
+function timeFormatConvert(time) {
+ if (!time) return '/'
+ const date = new Date(time);
+ return date.toLocaleString();
+}
+
+function cancelSearch() {
+ rangTime.value = []
+ params.value = {
+ startTime: '',
+ endTime: '',
+ isFavorite: tabType.value === '收藏' ? true : false,
+ page: '1',
+ page_size: '10',
+ jobName: '',
+ jobInfoNum: '',
+ }
+ getList()
+}
+
+function getList() {
+ params.value.startTime = rangTime.value?.length ? rangTime.value[0].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 || []
+ total.value = res.data.data.pagination.total || 0
+ })
+}
+
+function handleAll() {
+ params.value.isFavorite = false
+ params.value.page = 1
+ 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
+ })
+}
+// 分页
+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
+ tabType.value = '收藏'
+ params.value.page = 1
+ getList()
+}
+
+function handleTabClick() {
+ if (tabType.value === '全部') {
+ handleAll()
+ } else if (tabType.value === '收藏') {
+ handleStartList()
+ }
+}
+
+// 收藏
+function handleStar(row) {
+ if (row.is_favorite) {
+ cancelStar(row.id).then(res => {
+ ElMessage.success('取消收藏成功')
+ getList()
+ })
+ } else {
+ addStar({ flight_log_id: row.id }).then(res => {
+ ElMessage.success('收藏成功')
+ getList()
+ })
+ }
+}
+
+// 打标签
+function handleUpdateLabel(row) {
+ updateDroneFlight({ id: row.id, label_id: row.label_id }).then(res => {
+ // getList()
+ 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: '已取消删除'
+ })
+ })
+}
+
+// 导出
+function handleExport(row) {
+ exportBlob(
+ `/drone-device-core/log/droneFlightLogInfo/export/${row.id}`
+ ).then(res => {
+ downloadXls(res.data, `${row.job_name}.xlsx`)
+ })
+}
+
+// 日期选择
+// const changeselect = () => {
+// params.value.startTime = rangTime.value[0] ? rangTime.value[0].getTime() : ''
+// params.value.endTime = rangTime.value[1]? rangTime.value[1].getTime() : ''
+// getList()
+// };
+
+function handleSizeChange(val) {
+ params.value.page_size = val
+ getList()
+}
+function handleCurrentChange(val) {
+ params.value.page = val
+ getList()
+}
+let tagList = ref([])
+function tagManageList() {
+ flightLogPage({ current:1, size: 99 }).then(res => {
+ tagList.value = res.data.data.records || []
+ })
+}
+
+onMounted(() => {
+ tagManageList()
+ getList()
+})
+</script>
+
+<style lang="scss" scoped>
+.flight {
+ height: 0;
+ flex: 1;
+ margin: 0 10px 10px 10px;
+ background-color: #ffffff;
+ padding: 10px 20px;
+ border-radius: 5px;
+ display: flex;
+ flex-direction: column;
+ .search-box {
+ height: 30px;
+ }
+
+ :deep(.el-input) {
+ .el-input__wrapper {
+ width: 200px;
+ }
+ }
+
+ // 表格
+ .mange-table {
+ height: 0;
+ flex: 1;
+ margin-top: 18px;
+ overflow: auto;
+ }
+ :deep(.el-pagination) {
+ display: flex;
+ justify-content: right;
+ }
+
+ :deep(.el-pagination button) {
+ background: center center no-repeat none !important;
+ color: #8eb8ea !important;
+ }
+ :deep(.ztzf-select){
+ .el-select__selection {
+ width: 200px;
+ }
+ }
+}
+
+.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;
+ // color: #909399;
+ // background-color: #F5F7FA;
+ border-right: 1px solid #EBEEF5;
+ }
+
+ &.value {
+ width: 180px;
+ // color: #303133;
+ }
+ }
+ }
+ }
+}
+.content-edit {
+ .el-form {
+ .el-form-item {
+ width: 300px;
+ :deep(.el-form-item__label) {
+ width: 120px;
+ }
+
+ }
+ .btns {
+ display: flex;
+ justify-content: center
+ }
+ }
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3