<template>
|
<view class="flightApplication">
|
<view class="header-top">
|
<view class="ht-content">
|
<view class="item" @click="gridClick(0)">
|
<image :src="fxsqSvg" class="icon"></image>
|
<view class="txt">飞行申请</view>
|
</view>
|
<view class="item" @click="gridClick(1)">
|
<image :src="mysbSvg" class="icon"></image>
|
<view class="txt">我的设备</view>
|
</view>
|
</view>
|
</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>
|
<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>
|
</template>
|
<script setup>
|
import spSvg from '@/static/images/sp.png'
|
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 { aircraftInfoPageInfoOfMyApi } from '@/api/index'
|
|
// 获取store中的数据 字典
|
import { useAppStore, useUserStore } from "@/store";
|
const appStore = useAppStore()
|
|
|
function gridClick(index) {
|
// 跳转设备管理 /pages/equipmentManagement/index
|
if (index === 1) { // '我的设备'是第二个网格项，索引为1
|
uni.switchTab({
|
url: '/pages/equipmentManagement/index',
|
})
|
} else {
|
uni.navigateTo({
|
url: '/subPackages/flightApplication/add',
|
})
|
}
|
}
|
|
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([])
|
const formParams = ref({
|
current: 1,
|
size: 10,
|
flightPlanName: '',
|
})
|
// 申请审批列表
|
const getApprovalRecords = async () => {
|
try {
|
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 || '无'
|
})
|
// 如果是第一页，直接替换数据；否则追加数据
|
if (formParams.value.current === 1) {
|
approvalRecords.value = newData
|
} else {
|
approvalRecords.value = approvalRecords.value.concat(newData)
|
}
|
} catch (error) {
|
uni.showToast({
|
title: error.message,
|
icon: 'none',
|
duration: 2000,
|
})
|
}
|
}
|
// 搜索处理
|
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 {
|
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;
|
width: 100%;
|
height: 166rpx;
|
padding: 0 40rpx;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
gap: 60rpx;
|
box-sizing: border-box;
|
.item {
|
flex: 1;
|
max-width: 350rpx;
|
height: 166rpx;
|
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;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
box-sizing: border-box;
|
.icon {
|
width: 128rpx;
|
height: 128rpx;
|
}
|
.txt {
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
font-weight: bold;
|
font-size: 16px;
|
color: #222324;
|
}
|
}
|
}
|
}
|
:deep(.u-search) {
|
padding: 10px 20px;
|
height: 68rpx;
|
margin-top: 50rpx !important;
|
}
|
.content {
|
background: white;
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
background: #FFFFFF;
|
padding: 0 40rpx 40rpx 40rpx;
|
overflow-y: auto;
|
box-sizing: border-box;
|
border-radius: 12px 12px 6px 6px;
|
.sp-title {
|
font-weight: bold;
|
font-size: 32rpx;
|
color: #222324;
|
padding: 40rpx 0 0rpx 0;
|
}
|
}
|
.approvalRecord {
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
// display: flex;
|
// justify-content: space-between;
|
border-bottom: 1px solid #EBEEF3;
|
padding: 40rpx 0 20rpx 0;
|
// margin-bottom: 20rpx;
|
width: 100%;
|
box-sizing: border-box;
|
}
|
.name-status {
|
display: flex;
|
// justify-content: space-between;
|
margin-bottom: 20rpx;
|
.name-image {
|
width: calc(100% - 120rpx);
|
display: flex;
|
align-items: center;
|
.u-image {
|
width: 32rpx;
|
height: 32rpx;
|
}
|
.name {
|
font-weight: bold;
|
font-size: 32rpx;
|
color: #1D2129;
|
margin-left: 6rpx;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
}
|
}
|
.status {
|
width: 100rpx;
|
text-align: center;
|
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>
|
