| | |
| | | </template> |
| | | </u-form-item> |
| | | <u-form-item |
| | | label="飞行活动日期" |
| | | labelWidth="200rpx" |
| | | prop="timeRange" |
| | | label="飞行活动开始日期" |
| | | labelWidth="260rpx" |
| | | prop="flightStartTime" |
| | | :borderBottom="true" |
| | | ref="item1" |
| | | @click="isShowTimeRange = true" |
| | | @click="isShowStartTime = true" |
| | | required |
| | | > |
| | | <u-input v-model="formParams.timeRange" border="none" placeholder="请选择日期" suffixIcon="calendar"></u-input> |
| | | <u-input v-model="formParams.flightStartTime" border="none" placeholder="请选择日期" suffixIcon="calendar"></u-input> |
| | | </u-form-item> |
| | | <u-form-item |
| | | label="飞行活动结束日期" |
| | | labelWidth="260rpx" |
| | | prop="flightEndTime" |
| | | :borderBottom="true" |
| | | ref="item1" |
| | | @click="isShowEndTime = true" |
| | | required |
| | | > |
| | | <u-input v-model="formParams.flightEndTime" border="none" placeholder="请选择日期" suffixIcon="calendar"></u-input> |
| | | </u-form-item> |
| | | |
| | | <u-form-item |
| | |
| | | :borderBottom="true" |
| | | ref="item1" |
| | | > |
| | | <u-input v-model="formParams.tempAirspaceApproval" border="none" readonly placeholder="(建议文件大小100M内,仅支持pdf、jpg、jpeg、png等格式)"></u-input> |
| | | <u-input v-model="formParams.tempAirspaceApprovalText" border="none" readonly placeholder="(建议文件大小100M内,仅支持pdf、jpg、jpeg、png等格式)"></u-input> |
| | | <template #right> |
| | | <u-upload |
| | | @afterRead="afterRead" |
| | |
| | | placeholder="请输入" |
| | | ></u-input> |
| | | </u-form-item> |
| | | <view>飞行器/飞手</view> |
| | | <view class="title form-title">飞行器/飞手</view> |
| | | <u-form-item |
| | | label="飞行器" |
| | | labelWidth="230rpx" |
| | |
| | | ></up-icon> |
| | | </template> |
| | | </u-form-item> |
| | | <view>空域/航线/场点</view> |
| | | <view class="title form-title">空域/航线/场点</view> |
| | | <u-form-item |
| | | label="空域" |
| | | labelWidth="230rpx" |
| | |
| | | :borderBottom="true" |
| | | ref="item2" |
| | | required |
| | | @click="isShowRouteInfo = true" |
| | | @click="isShowFlightRouteInfo = true" |
| | | > |
| | | <u-input |
| | | v-model="formParams.routeText" |
| | |
| | | ></up-icon> |
| | | </template> |
| | | </u-form-item> |
| | | <u-button |
| | | <u-button class="submit-button-wrapper" |
| | | type="primary" |
| | | size="small" |
| | | @click="submitForm" |
| | | > |
| | | 提交 |
| | | </u-button> |
| | | </u-form> |
| | | <!-- 飞任务类型 --> |
| | | <!-- 飞任务类型 --> |
| | | <u-picker |
| | | :show="isShowFlightTaskType" |
| | | :columns="[actionsFlightTaskType]" |
| | |
| | | @confirm="onPickerPlanType" |
| | | @cancel="isShowPlanType = false" |
| | | /> |
| | | <u-calendar :show="isShowTimeRange" mode="range" @confirm="onConfirmTimeRange" @close="isShowTimeRange = false" :close-on-click-overlay="true"></u-calendar> |
| | | <up-datetime-picker |
| | | :show="isShowStartTime" |
| | | v-model="startTime" |
| | | mode="datetime" |
| | | @confirm="onConfirmStartTime" |
| | | @cancel="isShowStartTime = false" |
| | | ></up-datetime-picker> |
| | | <up-datetime-picker |
| | | :show="isShowEndTime" |
| | | v-model="endTime" |
| | | mode="datetime" |
| | | @confirm="onConfirmEndTime" |
| | | @cancel="isShowEndTime = false" |
| | | ></up-datetime-picker> |
| | | <!-- <u-calendar :show="isShowTimeRange" mode="date" @confirm="onConfirmTimeRange" @close="isShowTimeRange = false" :close-on-click-overlay="true"></u-calendar> --> |
| | | <!-- <u-calendar :show="isShowTimeRange" mode="range" @confirm="onConfirmTimeRange" @close="isShowTimeRange = false" :close-on-click-overlay="true" :allow-same-day="true" :show-time="true" time-format="HH:mm:ss"></u-calendar> --> |
| | | <!-- 飞行器 --> |
| | | <u-picker |
| | | :show="isShowAircraftInfo" |
| | |
| | | @confirm="onPickerFlightRouteInfo" |
| | | @cancel="isShowFlightRouteInfo = false" |
| | | /> |
| | | </u-form> |
| | | |
| | | </view> |
| | | </template> |
| | | <script setup> |
| | |
| | | flightMode: '', // 飞行方式 |
| | | flightModeText: '', // 飞行方式文本 |
| | | tempAirspaceApproval: '', // 临时空域批件 |
| | | tempAirspaceApprovalText: '', // 临时空域批件文本 |
| | | planType: '', // 计划类型 |
| | | planTypeText: '', // 计划类型文本 |
| | | contactPerson: '', // 联系人 |
| | |
| | | undertakerPhone: [ |
| | | { required: true, message: '请输入承办人联系电话', trigger: 'blur' } |
| | | ], |
| | | timeRange: [ |
| | | { required: true, message: '请选择时间范围', trigger: 'change' } |
| | | startTime: [ |
| | | { required: true, message: '请选择飞行活动开始时间', trigger: 'change' } |
| | | ], |
| | | endTime: [ |
| | | { required: true, message: '请选择飞行活动结束时间', trigger: 'change' } |
| | | ], |
| | | spacecraftId: [ |
| | | { required: true, message: '请选择飞行器', trigger: 'change' } |
| | |
| | | formParams.value.planTypeText = selected.label |
| | | isShowPlanType.value = false |
| | | } |
| | | // 是否显示日期 |
| | | const isShowTimeRange = ref(false) |
| | | // 确认时间范围 |
| | | const onConfirmTimeRange = (e) => { |
| | | // 尝试各种可能的 u-calendar range 模式返回格式 |
| | | let startDate, endDate |
| | | |
| | | // 模式1:uView Plus 1.0+ u-calendar range 模式返回 { startDate, endDate } |
| | | if (e && e.startDate && e.endDate) { |
| | | startDate = e.startDate |
| | | endDate = e.endDate |
| | | console.log('Using format 1: { startDate, endDate }') |
| | | } |
| | | // 模式2:uView 2.x u-calendar range 模式返回 { value: [start, end] } |
| | | else if (e && e.value && Array.isArray(e.value) && e.value.length >= 2) { |
| | | startDate = e.value[0] |
| | | endDate = e.value[1] |
| | | console.log('Using format 2: { value: [start, end] }') |
| | | } |
| | | // 模式3:直接返回数组 [start, end] |
| | | else if (Array.isArray(e) && e.length >= 2) { |
| | | startDate = e[0] |
| | | endDate = e[1] |
| | | console.log('Using format 3: [start, end]') |
| | | } |
| | | // 模式4:其他可能的嵌套格式 |
| | | else if (e && e.start && e.end) { |
| | | startDate = e.start |
| | | endDate = e.end |
| | | console.log('Using format 4: { start, end }') |
| | | } |
| | | // 模式5:检查是否有其他可能的日期字段 |
| | | else if (e) { |
| | | console.log('Trying to find date fields in e:', e) |
| | | // 尝试提取任何可能的日期字段 |
| | | const dateFields = ['start', 'end', 'startTime', 'endTime', 'begin', 'finish'] |
| | | for (const field of dateFields) { |
| | | if (e[field]) { |
| | | console.log(`Found date field ${field}:`, e[field]) |
| | | } |
| | | } |
| | | } |
| | | |
| | | if (startDate && endDate) { |
| | | // 格式化显示时间范围 |
| | | formParams.value.timeRange = `${startDate} 至 ${endDate}` |
| | | formParams.value.flightStartTime = startDate |
| | | formParams.value.flightEndTime = endDate |
| | | } else { |
| | | console.error('Unable to extract valid date range from:', e) |
| | | } |
| | | |
| | | isShowTimeRange.value = false |
| | | // 是否显示开始时间选择器 |
| | | const isShowStartTime = ref(false) |
| | | // 是否显示结束时间选择器 |
| | | const isShowEndTime = ref(false) |
| | | const startTime = ref(Date.now()); // 设置默认值为当前时间戳 |
| | | const endTime = ref(Date.now()); // 设置默认值为当前时间戳 |
| | | |
| | | const onConfirmStartTime = (e) => { |
| | | formParams.value.flightStartTime = dayjs(e.value).format('YYYY-MM-DD HH:mm:ss') |
| | | isShowStartTime.value = false |
| | | } |
| | | const onConfirmEndTime = (e) => { |
| | | formParams.value.flightEndTime = dayjs(e.value).format('YYYY-MM-DD HH:mm:ss') |
| | | isShowEndTime.value = false |
| | | } |
| | | |
| | | |
| | | |
| | | // 获取飞行器信息 |
| | | const isShowAircraftInfo = ref(false) |
| | |
| | | current: 1, |
| | | size: 1000, |
| | | }).then(res => { |
| | | console.log(res.data.data, '0000') |
| | | flightRouteInfoList.value = res.data.data.records.map(item => ({ |
| | | label: item.name, |
| | | value: item.id, |
| | |
| | | } |
| | | const onPickerFlightRouteInfo = (e) => { |
| | | const selected = e.value[0] |
| | | formParams.value.routeIdouteId = selected.value |
| | | formParams.value.routeId = selected.value |
| | | formParams.value.routeText = selected.label |
| | | isShowFlightRouteInfo.value = false |
| | | } |
| | |
| | | title: '上传中...' |
| | | }); |
| | | |
| | | // 调用上传文件接口 |
| | | uploadFileApi({ |
| | | // 准备上传参数 |
| | | const uploadParams = { |
| | | name: 'file', // 服务器端接收文件的字段名 |
| | | file: file, // 传入文件对象 |
| | | // 可以根据接口需要添加其他参数 |
| | | type: 'tempAirspaceApproval' // 示例参数,表示上传的是临时空域批件 |
| | | }).then(res => { |
| | | filePath: file.path || file.url, // 文件路径 |
| | | }; |
| | | |
| | | // 调用上传文件接口 |
| | | uploadFileApi(uploadParams).then(res => { |
| | | uni.hideLoading(); |
| | | |
| | | console.log('上传成功结果:', res); |
| | |
| | | const uploadResult = res.data.data; |
| | | |
| | | // 更新表单数据,将上传结果展示在input内 |
| | | formParams.value.tempAirspaceApproval = uploadResult.fileName || uploadResult.url || '文件上传成功'; |
| | | formParams.value.tempAirspaceApprovalText = uploadResult.fileName || uploadResult.url || '文件上传成功'; |
| | | |
| | | // 可以将完整的上传信息保存到表单中,以便提交时使用 |
| | | formParams.value.tempAirspaceApprovalFile = uploadResult; |
| | | formParams.value.tempAirspaceApproval = uploadResult.fileUrl || '文件上传成功'; |
| | | |
| | | uni.showToast({ |
| | | title: '上传成功', |
| | |
| | | // 提交表单 |
| | | const submitForm = async () => { |
| | | await formRef.value.validate() |
| | | if (!formRef.value.isValid) { |
| | | return |
| | | } |
| | | |
| | | flightPlanSaveApi(formParams.value).then(res => { |
| | | if (res.data.code === 200) { |
| | | uni.showToast({ |
| | |
| | | icon: 'success', |
| | | duration: 2000 |
| | | }) |
| | | uni.navigateBack({ |
| | | delta: 1 |
| | | }) |
| | | // 跳转申请列表页 |
| | | uni.navigateTo({ |
| | | url: '/subPackages/flightApplication/index', |
| | | }) |
| | | } else { |
| | | uni.showToast({ |
| | | title: res.msg || '提交失败', |
| | |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .flightApplication-add { |
| | | padding: 24rpx; |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | .title { |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 400; |
| | | font-size: 17px; |
| | | color: #222324; |
| | | padding-left: 24rpx; |
| | | } |
| | | .form-title { |
| | | margin-bottom: 24rpx; |
| | | padding-left: 0rpx !important; |
| | | } |
| | | .select-wrapper { |
| | | position: relative; |
| | | width: 100%; |
| | |
| | | font-size: 15px; |
| | | color: #1D6FE9; |
| | | } |
| | | |
| | | :deep(.u-form) { |
| | | flex: 1; |
| | | display: flex; |
| | | flex-direction: column; |
| | | overflow-y: auto; |
| | | box-sizing: border-box; |
| | | padding: 24rpx; |
| | | } |
| | | .submit-button-wrapper { |
| | | padding: 28rpx; |
| | | } |
| | | :deep(.u-form-item) { |
| | | margin-bottom: 40rpx; |
| | | padding: 16rpx 24rpx 18rpx 24rpx; |