| | |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <u-search :bgColor="'white'" :show-action="true" actionText="搜索" :animation="true"></u-search> |
| | | <view class="content"> |
| | | <view class="sp-title"> |
| | | 审批记录 |
| | | </view> |
| | | <view class="approvalRecord" v-for="(approvalRecord,approvalRecordIndex) in approvalRecords" :key="approvalRecordIndex"> |
| | | <view class="name-status"> |
| | | <view class="name-image"> |
| | | <u-image :src="spSvg" class="icon" width="16" height="16"></u-image> |
| | | <view class="name">{{approvalRecord.flightPlanName}}</view> |
| | | </view> |
| | | <view class="status">{{approvalRecord.planStatus || '无状态'}}</view> |
| | | <!-- <view class="search-content"> --> |
| | | <u-search v-model="formParams.flightPlanName" :bgColor="'white'" :show-action="true" actionText="搜索" :animation="true" @custom="handleSearch"></u-search> |
| | | <view class="content"> |
| | | <view class="sp-title"> |
| | | 审批记录 |
| | | </view> |
| | | <view class="txt">飞行设备:{{approvalRecord.device || '无设备'}}</view> |
| | | <view class="txt">行政区划:{{approvalRecord.area || '无行政区划'}}</view> |
| | | <view class="txt">飞行时间:{{approvalRecord.time || '无飞行时间'}}</view> |
| | | <u-list :style="{ height: 'calc(100vh - 240rpx)' }" @scrolltolower="scrolltolower" :lower-threshold="50"> |
| | | <view class="approvalRecord" v-for="(approvalRecord,approvalRecordIndex) in approvalRecords" :key="approvalRecordIndex" @click="handleClick(approvalRecord)"> |
| | | <view class="name-status"> |
| | | <view class="name-image"> |
| | | <u-image :src="spSvg" class="icon" width="16" height="16"></u-image> |
| | | <view class="name">{{approvalRecord.flightPlanName}}</view> |
| | | </view> |
| | | </view> |
| | | <view class="txt">审批状态: <span :class="getStatusClass(approvalRecord.planApprovalStatus)">{{approvalRecord.planApprovalStatusLabel || ''}}</span></view> |
| | | <view class="txt">计划起飞状态:<span :class="getPlanStatusClass(approvalRecord.planStatus)">{{approvalRecord.flyActivityTakeoffStatusLabel || ''}}</span></view> |
| | | <view class="txt">飞行器:{{approvalRecord.spacecraftLabel || '无'}}</view> |
| | | <view class="txt">飞行任务:{{approvalRecord.flightTaskTypeLabel || ''}}</view> |
| | | <view class="txt">飞行起飞时间:{{approvalRecord.flightStartTime || ''}}</view> |
| | | <view class="txt">飞行降落时间:{{approvalRecord.flightEndTime || ''}}</view> |
| | | </view> |
| | | </u-list> |
| | | </view> |
| | | </view> |
| | | <!-- </view> --> |
| | | </view> |
| | | </template> |
| | | <script setup> |
| | |
| | | import { flightPlanPageInfoApi } from '@/api/index.js' |
| | | import fxsqSvg from '@/static/images/fly-apply.png' |
| | | import mysbSvg from '@/static/images/my-sb.png' |
| | | import { ref } from 'vue' |
| | | import { ref } from 'vue' |
| | | import { aircraftInfoPageInfoOfMyApi } from '@/api/index' |
| | | |
| | | // 获取store中的数据 字典 |
| | | import { useAppStore, useUserStore } from "@/store"; |
| | | const appStore = useAppStore() |
| | | |
| | | |
| | | function gridClick(index) { |
| | |
| | | } |
| | | } |
| | | |
| | | const getStatusClass = (status) => { |
| | | switch (status) { |
| | | case '0': |
| | | return 'Sorange' |
| | | case '99': |
| | | return 'Sgreen' |
| | | case '-1': |
| | | return 'Sred' |
| | | case '1': |
| | | return 'Sblue' |
| | | default: |
| | | return '' |
| | | } |
| | | } |
| | | |
| | | const getPlanStatusClass = (status) => { |
| | | switch (status) { |
| | | case '0': |
| | | return 'Sred' |
| | | case '1': |
| | | return 'Ssqz' |
| | | case '2': |
| | | return 'Sjz' |
| | | case '3': |
| | | return 'SOrange' |
| | | case '99': |
| | | return 'Syzz' |
| | | case '-1': |
| | | return 'Ssqbh' |
| | | case '-2': |
| | | return 'Sysx' |
| | | default: |
| | | return '' |
| | | } |
| | | } |
| | | |
| | | // 获取飞行器信息 |
| | | const aircraftInfoList = ref([]) |
| | | async function getAircraftInfo() { |
| | | try { |
| | | const res = await aircraftInfoPageInfoOfMyApi({ |
| | | current: 1, |
| | | size: 1000, |
| | | }) |
| | | aircraftInfoList.value = res.data.data.records.map(item => ({ |
| | | label: item.name, |
| | | value: item.id, |
| | | })) |
| | | } catch (error) { |
| | | console.error('获取飞行器信息失败:', error) |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | // 审批记录是很多条 |
| | | const approvalRecords = ref([ |
| | | { |
| | | flightPlanName: '飞行需求名称', |
| | | planStatus: '申请中', |
| | | device: '大疆无人机', |
| | | area: '吉州区', |
| | | time: '2026/01/07至2026/01/08', |
| | | }, |
| | | { |
| | | flightPlanName: '飞行需求名称', |
| | | planStatus: '申请中', |
| | | device: '大疆无人机', |
| | | area: '吉州区', |
| | | time: '2026/01/07至2026/01/08', |
| | | }, |
| | | { |
| | | flightPlanName: '飞行需求名称', |
| | | planStatus: '申请中', |
| | | device: '大疆无人机', |
| | | area: '吉州区', |
| | | time: '2026/01/07至2026/01/08', |
| | | }, |
| | | { |
| | | flightPlanName: '飞行需求名称', |
| | | planStatus: '申请中', |
| | | device: '大疆无人机', |
| | | area: '吉州区', |
| | | time: '2026/01/07至2026/01/08', |
| | | }, |
| | | { |
| | | flightPlanName: '飞行需求名称', |
| | | planStatus: '申请中', |
| | | device: '大疆无人机', |
| | | area: '吉州区', |
| | | time: '2026/01/07至2026/01/08', |
| | | }, |
| | | { |
| | | flightPlanName: '飞行需求名称', |
| | | planStatus: '申请中', |
| | | device: '大疆无人机', |
| | | area: '吉州区', |
| | | time: '2026/01/07至2026/01/08', |
| | | }, |
| | | { |
| | | flightPlanName: '飞行需求名称', |
| | | planStatus: '申请中', |
| | | device: '大疆无人机', |
| | | area: '吉州区', |
| | | time: '2026/01/07至2026/01/08', |
| | | }, |
| | | ]) |
| | | const approvalRecords = ref([]) |
| | | const formParams = ref({ |
| | | current: 1, |
| | | size: 10, |
| | | flightPlanName: '', |
| | | }) |
| | | // 申请审批列表 |
| | | const getApprovalRecords = async () => { |
| | | try { |
| | | const res = await flightPlanPageInfoApi({ |
| | | current: 1, |
| | | size: 10, |
| | | const res = await flightPlanPageInfoApi(formParams.value) |
| | | const newData = res.data.data.records || [] |
| | | // 处理字典数据 |
| | | newData.forEach(item => { |
| | | item.spacecraftLabel = aircraftInfoList?.value.filter(info => item.spacecraftId?.split(',').includes(info.value)).map(info => info.label).join('、') || '无' |
| | | // 审批状态 |
| | | item.planApprovalStatusLabel = appStore.flyActivityStatus.find(status => status.dictValue === item.planApprovalStatus)?.dictLabel || '无' |
| | | // 计划起飞状态 |
| | | item.flyActivityTakeoffStatusLabel = appStore.flyActivityTakeoffStatus.find(status => status.dictValue === item.planStatus)?.dictLabel || '无' |
| | | // 飞行任务 |
| | | item.flightTaskTypeLabel = appStore.taskType.find(type => type.dictValue === item.flightTaskType)?.dictLabel || '无' |
| | | }) |
| | | approvalRecords.value = res.data.data.records || [] |
| | | // 如果是第一页,直接替换数据;否则追加数据 |
| | | if (formParams.value.current === 1) { |
| | | approvalRecords.value = newData |
| | | } else { |
| | | approvalRecords.value = approvalRecords.value.concat(newData) |
| | | } |
| | | } catch (error) { |
| | | uni.showToast({ |
| | | title: error.message, |
| | |
| | | }) |
| | | } |
| | | } |
| | | onMounted(() => { |
| | | // 搜索处理 |
| | | const handleSearch = () => { |
| | | // 搜索时重置为第一页 |
| | | formParams.value.current = 1 |
| | | formParams.value.flightPlanName = formParams.value.flightPlanName.trim() |
| | | getApprovalRecords() |
| | | } |
| | | // 触底加载 |
| | | function scrolltolower() { |
| | | formParams.value.current++ |
| | | // 停止不刷新 |
| | | if (approvalRecords.value.length < formParams.value.size) { |
| | | return |
| | | } |
| | | getApprovalRecords() |
| | | } |
| | | // 点击审批记录跳转详情页 |
| | | function handleClick(item) { |
| | | uni.navigateTo({ |
| | | url: '/subPackages/flightApplication/details?id=' + item.id, |
| | | }) |
| | | } |
| | | |
| | | |
| | | onMounted(async () => { |
| | | await getAircraftInfo() |
| | | getApprovalRecords() |
| | | }) |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .flightApplication { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | overflow-y: hidden; |
| | | .header-top { |
| | | width: 100%; |
| | | height: 350rpx; |
| | | background: url('@/static/images/fxsq-bg.png') no-repeat center; |
| | | background-size: 100% 100%; |
| | | position: fixed; |
| | | top: 0; |
| | | height: 480rpx; |
| | | background: url("https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ja-app-wx/images/fxsq-bg.png") no-repeat ; |
| | | background-size: 100%; |
| | | position: relative; |
| | | .ht-content { |
| | | position: absolute; |
| | | bottom: -40rpx; |
| | |
| | | flex: 1; |
| | | max-width: 350rpx; |
| | | height: 166rpx; |
| | | background: rgba(251,253,255,0.39); |
| | | background: rgba(251,253,255,0.8); |
| | | box-shadow: inset 0px 0px 7px 0px rgba(64,156,230,0.14), 0px 1px 3px 0px rgba(35,49,96,0.11); |
| | | border-radius: 8px 8px 8px 8px; |
| | | border: 1px solid #fff; |
| | |
| | | } |
| | | } |
| | | :deep(.u-search) { |
| | | position: absolute; |
| | | width: 90%; |
| | | left: 50%; |
| | | transform: translateX(-50%); |
| | | top: 340rpx !important; |
| | | padding: 10px 20px; |
| | | height: 68rpx; |
| | | flex: 0; |
| | | margin-top: 50rpx !important; |
| | | } |
| | | .content { |
| | | position: absolute; |
| | | top: 450rpx !important; |
| | | bottom: 0; |
| | | background: white; |
| | | width: 100%; |
| | | display: flex; |
| | |
| | | } |
| | | .name-status { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | // justify-content: space-between; |
| | | margin-bottom: 20rpx; |
| | | .name-image { |
| | | width: calc(100% - 120rpx); |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | .u-image { |
| | | width: 32rpx; |
| | |
| | | font-size: 32rpx; |
| | | color: #1D2129; |
| | | margin-left: 6rpx; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | } |
| | | } |
| | | .status { |
| | | width: 100rpx; |
| | | text-align: center; |
| | | line-height: 40rpx; |
| | | background: #FF9604; |
| | | line-height: 44rpx; |
| | | height: 44rpx; |
| | | border-radius: 2px 2px 2px 2px; |
| | | font-weight: 500; |
| | | font-size: 24rpx; |
| | | color: #FFFFFF; |
| | | padding: 0 6rpx; |
| | | |
| | | |
| | | } |
| | | |
| | | } |
| | | .txt { |
| | | font-weight: 400; |
| | | font-size: 12px; |
| | | color: #86909C; |
| | | margin-bottom: 14rpx; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .Sorange { |
| | | color: #FF9604; |
| | | } |
| | | .Sred { |
| | | color: #F8422A; |
| | | } |
| | | .Sgreen { |
| | | color: #17A836; |
| | | } |
| | | .Sblue { |
| | | color: #1D6FE9; |
| | | } |
| | | .Sjz { |
| | | color: #0088FF; |
| | | } |
| | | .Syzz { |
| | | color: #002BFF; |
| | | } |
| | | .Ssqbh { |
| | | color: #FF383C; |
| | | } |
| | | .Sysx { |
| | | color:#414141; |
| | | } |
| | | .Ssqz { |
| | | color: #FF9500; |
| | | } |
| | | |
| | | } |
| | | </style> |