| New file |
| | |
| | | import request from '@/axios'; |
| | | |
| | | export const getWaylineFileByUser = (workspaceId = null, waylineName = null, startTime = null, endTime = null, page = 1, pageSize = 10) => { |
| | | return request({ |
| | | url: '/drone-yw/wayline/api/v1/workspaces/waylineByUser', |
| | | method: 'get', |
| | | params: { |
| | | workspaceId, |
| | | waylineName, |
| | | startTime, |
| | | endTime, |
| | | page, |
| | | pageSize, |
| | | }, |
| | | }); |
| | | }; |
| New file |
| | |
| | | <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> |