<template>
|
<basic-container>
|
<avue-crud
|
:option="option"
|
:table-loading="loading"
|
:data="data"
|
:page.sync="page"
|
v-model="form"
|
ref="crud"
|
@search-change="searchChange"
|
@search-reset="searchReset"
|
@current-change="currentChange"
|
@size-change="sizeChange"
|
@refresh-change="refreshChange"
|
>
|
</avue-crud>
|
</basic-container>
|
</template>
|
|
<script>
|
import { getWaylineFileByUser } from '@/api/resource/waylineFile';
|
import { getAirportList } from '@/api/device/device';
|
|
export default {
|
name: 'WaylineFile',
|
data() {
|
const { defaultStartDate, defaultEndDate } = this.getDefaultDates();
|
return {
|
form: {},
|
query: { name: '', dock_name: '', daterange: [defaultStartDate, defaultEndDate] },
|
loading: false,
|
page: { pageSize: 10, currentPage: 1, total: 0 },
|
selectedWorkspaceId: null,
|
data: [],
|
option: {
|
height: 'auto',
|
calcHeight: 30,
|
tip: false,
|
searchShow: true,
|
searchMenuSpan: 6,
|
border: true,
|
index: true,
|
menu: false,
|
page: true,
|
column: [
|
{
|
label: '机场选择',
|
prop: 'dock_name',
|
type: 'select',
|
search: true,
|
searchSpan: 5,
|
dicData: [],
|
props: { label: 'nickname', value: 'nickname' },
|
hide: true,
|
},
|
{
|
label: '航线名称',
|
prop: 'name',
|
search: true,
|
searchSpan: 6,
|
},
|
{
|
label: '时间范围',
|
prop: 'daterange',
|
type: 'daterange',
|
search: true,
|
searchRange: true,
|
searchSpan: 6,
|
format: 'YYYY-MM-DD',
|
valueFormat: 'YYYY-MM-DD',
|
startPlaceholder: '开始时间',
|
endPlaceholder: '结束时间',
|
searchValue: [defaultStartDate, defaultEndDate],
|
hide: true,
|
},
|
{ label: '航线名称', prop: 'name' },
|
{
|
label: '航线类型',
|
prop: 'wayline_type',
|
formatter: (row) => this.formatWaylineType(row.wayline_type),
|
},
|
{ label: '用户名', prop: 'user_name' },
|
{ label: '航线ID', prop: 'id' },
|
{
|
label: '更新时间',
|
prop: 'update_time',
|
formatter: (row) => this.formatTime(row.update_time),
|
},
|
],
|
},
|
};
|
},
|
mounted() {
|
this.fetchAirports();
|
this.fetchData(this.page, this.query); // 初次加载包含默认时间范围
|
},
|
methods: {
|
getDefaultDates() {
|
const endDate = new Date();
|
const startDate = new Date();
|
startDate.setMonth(startDate.getMonth() - 1);
|
// 结束时间设定为当天 23:59:59
|
endDate.setHours(23, 59, 59, 999);
|
|
return {
|
defaultStartDate: `${startDate.getFullYear()}-${String(startDate.getMonth() + 1).padStart(2, '0')}-${String(startDate.getDate()).padStart(2, '0')}`,
|
defaultEndDate: `${endDate.getFullYear()}-${String(endDate.getMonth() + 1).padStart(2, '0')}-${String(endDate.getDate()).padStart(2, '0')}`,
|
};
|
},
|
async fetchAirports() {
|
try {
|
const res = await getAirportList();
|
const airportData = res.data.data || [];
|
const airportColumn = this.option.column.find((col) => col.prop === 'dock_name');
|
if (airportColumn) {
|
airportColumn.dicData = airportData.map((item) => ({
|
nickname: item.nickname,
|
workspace_id: item.workspace_id,
|
}));
|
}
|
} catch (error) {
|
console.error('加载机场列表失败:', error);
|
}
|
},
|
async fetchData(page, params = {}) {
|
this.loading = true;
|
const { name, dock_name, daterange } = params;
|
const workspaceId = this.selectedWorkspaceId || null;
|
|
// 时间范围处理
|
const startDate = new Date(daterange[0]);
|
let endDate = new Date(daterange[1]);
|
// 结束时间始终设定为当天 23:59:59
|
endDate.setHours(23, 59, 59, 999);
|
|
const startTime = isNaN(startDate.getTime()) ? null : startDate.getTime();
|
const endTime = isNaN(endDate.getTime()) ? null : endDate.getTime();
|
|
const requestParams = {
|
workspaceId,
|
waylineName: name || null,
|
startTime,
|
endTime,
|
page: page.currentPage,
|
pageSize: page.pageSize,
|
};
|
|
console.log('请求参数:', requestParams);
|
|
try {
|
const res = await getWaylineFileByUser(
|
requestParams.workspaceId,
|
requestParams.waylineName,
|
requestParams.startTime,
|
requestParams.endTime,
|
requestParams.page,
|
requestParams.pageSize
|
);
|
const responseData = res.data;
|
|
if (responseData?.code === 0 && Array.isArray(responseData.data?.list)) {
|
this.data = responseData.data.list.map((item) => ({
|
id: item.id,
|
name: item.name,
|
wayline_type: item.wayline_type,
|
user_name: item.user_name,
|
update_time: item.update_time,
|
}));
|
this.page.total = responseData.data.pagination?.total || responseData.data.list.length;
|
this.page.currentPage = page.currentPage;
|
console.log('返回数据条数:', this.data.length);
|
console.log('当前页码:', this.page.currentPage);
|
console.log('总条数:', this.page.total);
|
} else {
|
this.data = [];
|
this.page.total = 0;
|
}
|
} catch (error) {
|
console.error('加载数据失败:', error);
|
this.data = [];
|
this.page.total = 0;
|
} finally {
|
this.loading = false;
|
}
|
},
|
searchChange(params, done) {
|
this.query = { ...params };
|
const airportColumn = this.option.column.find((col) => col.prop === 'dock_name');
|
const selectedAirport = airportColumn.dicData.find((item) => item.nickname === params.dock_name);
|
this.selectedWorkspaceId = selectedAirport ? selectedAirport.workspace_id : null;
|
this.page.currentPage = 1;
|
this.fetchData(this.page, this.query);
|
done();
|
},
|
searchReset() {
|
const { defaultStartDate, defaultEndDate } = this.getDefaultDates();
|
this.query = { name: '', dock_name: '', daterange: [defaultStartDate, defaultEndDate] };
|
this.selectedWorkspaceId = null;
|
const daterangeColumn = this.option.column.find((col) => col.prop === 'daterange');
|
daterangeColumn.searchValue = [defaultStartDate, defaultEndDate];
|
this.page.currentPage = 1;
|
this.fetchData(this.page, this.query);
|
},
|
currentChange(currentPage) {
|
console.log('切换页码至:', currentPage);
|
this.page.currentPage = currentPage;
|
this.fetchData(this.page, this.query);
|
},
|
sizeChange(pageSize) {
|
console.log('每页条数改为:', pageSize);
|
this.page.pageSize = pageSize;
|
this.page.currentPage = 1;
|
this.fetchData(this.page, this.query);
|
},
|
refreshChange() {
|
this.fetchData(this.page, this.query);
|
},
|
formatTime(time) {
|
if (!time) return '';
|
const date = new Date(time < 10000000000 ? time * 1000 : time);
|
if (isNaN(date.getTime())) return '无效时间';
|
return date.toLocaleString('zh-CN', { hour12: false }).replace(/\//g, '-');
|
},
|
formatWaylineType(type) {
|
const typeMap = { '0': '普通航线', '1': '图斑举证航线', '2': '航测航线', '3': '航点航线', '4': '正射举证航线' };
|
return typeMap[type] || '未知';
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.avue-crud .el-table {
|
max-height: none !important;
|
}
|
</style>
|