<template>
|
<view class="page">
|
<u-swiper
|
:list="lbList"
|
:keyName="'image'"
|
:height="200"
|
:indicator="true"
|
mode="round"
|
indicatorMode="dot"
|
indicatorActiveColor="#4C85FF"
|
indicatorInactiveColor="#fff"
|
indicatorPosition="center"
|
></u-swiper>
|
<view class="lb-bottom">
|
<image :src="lbBottomPng" />
|
</view>
|
<u-grid :col="4" :border="false" class="grid" @click="gridClick">
|
<u-grid-item v-for="(baseListItem,baseListIndex) in baseList" :key="baseListIndex">
|
<u-image :src="baseListItem.src" :width="26" :height="26"></u-image>
|
<text class="grid-text">{{baseListItem.title}}</text>
|
</u-grid-item>
|
</u-grid>
|
<view class="content">
|
<view>
|
<view class="title">空域信息</view>
|
<view class="card" v-for="(item,index) in announcementList" :key="index">
|
<view class="left">
|
<u-image :src="docSvg" :width="30" :height="36"></u-image>
|
</view>
|
<view class="right" @click.stop="airspaceClick(item)">
|
<view class="r-top">{{ item.title }}</view>
|
<view class="r-middle">{{ item.description || '暂无' }}</view>
|
<view class="r-bottom">
|
<view>{{ item.time }}</view>
|
<!-- <view>{{ item.num || 0 }}</view>
|
<view>{{ item.like || 0 }}</view> -->
|
</view>
|
</view>
|
</view>
|
</view>
|
<view>
|
<view class="title">法律法规</view>
|
<view class="card" v-for="(item,index) in regulationsList" :key="index">
|
<view class="left">
|
<u-image :src="docSvg" :width="30" :height="36"></u-image>
|
</view>
|
<view class="right" @click.stop="toRegulationsDetail(item)">
|
<view class="r-top">{{ item.title }}</view>
|
<view class="r-middle">{{ item.description || '暂无' }}</view>
|
<view class="r-bottom">
|
<view>{{ item.time }}</view>
|
<!-- <view>{{ item.num || 0 }}</view>
|
<view>{{ item.like || 0 }}</view> -->
|
</view>
|
</view>
|
</view>
|
</view>
|
<view>
|
<view class="title">政策制度</view>
|
<view class="card" v-for="(item,index) in policyList" :key="index">
|
<view class="left">
|
<u-image :src="docSvg" :width="30" :height="36"></u-image>
|
</view>
|
<view class="right" @click.stop="policiesClick(item)">
|
<view class="r-top">{{ item.title }}</view>
|
<view class="r-middle">{{ item.description || '暂无' }}</view>
|
<view class="r-bottom">
|
<view>{{ item.time }}</view>
|
<!-- <view>{{ item.num || 0 }}</view>
|
<view>{{ item.like || 0 }}</view> -->
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script setup>
|
import { onMounted, reactive, ref } from 'vue'
|
import lbPng1 from '@/static/images/lbt1.png'
|
import lbPng2 from '@/static/images/lbt2.png'
|
import lbPng3 from '@/static/images/lbt3.png'
|
import kyxxPng from '@/static/images/kyxx.png'
|
import fxsqPng from '@/static/images/fxsq.png'
|
import flfgPng from '@/static/images/flfg.png'
|
import zczdPng from '@/static/images/zczd.png'
|
import docSvg from '@/static/images/doc.png'
|
import lbBottomPng from '@/static/images/lb_bottom.png'
|
import { sysNoticePageInfoApi, droneFlightTaskApi } from '@/api/index'
|
import { flightTaskApi,flightRulesApi,flightModeApi,flightPlanApi,flyActivityStatusApi,flyActivityTakeoffStatusApi,proTypeApi} from '@/api/index'
|
|
import { useAppStore } from "@/store";
|
const appStore = useAppStore()
|
|
const lbList = reactive([
|
{
|
image: lbPng1,
|
title: '法律政策',
|
link: '/pages/legalPolicy/index',
|
},
|
{
|
image: lbPng2,
|
title: '法律政策',
|
link: '/pages/legalPolicy/index',
|
},
|
{
|
image: lbPng3,
|
title: '法律政策',
|
link: '/pages/legalPolicy/index',
|
},
|
]);
|
// lbPng 轮播图 5次
|
// for (let i = 0; i < 5; i++) {
|
// lbList.push({
|
// image: lbPng,
|
// title: '法律政策',
|
// link: '/pages/legalPolicy/index',
|
// })
|
// }
|
|
// const change = (index) => {
|
// console.log('轮播图切换到第', index + 1, '张');
|
// }
|
|
const baseList = ref([
|
{
|
src: kyxxPng,
|
title: '空域信息'
|
},
|
{
|
src: fxsqPng,
|
title: '飞行申请'
|
},
|
{
|
src: flfgPng,
|
title: '法律法规'
|
},
|
{
|
src: zczdPng,
|
title: '政策制度'
|
},
|
]);
|
|
|
const announcementList = ref([]);
|
function gridClick(index) {
|
if (index === 0) {
|
uni.navigateTo({
|
url: '/subPackages/airspaceInformation/index',
|
})
|
} else if (index === 1) {
|
uni.navigateTo({
|
url: '/subPackages/flightApplication/index',
|
})
|
} else if (index === 2) {
|
uni.switchTab({
|
url: '/pages/legalPolicy/index',
|
})
|
} else if (index === 3) {
|
uni.switchTab({
|
url: '/pages/legalPolicy/index',
|
})
|
}
|
}
|
// 获取空域信息列表
|
async function getFlightAirspaceList() {
|
try {
|
const res = await droneFlightTaskApi({
|
current: 1,
|
size: 3,
|
})
|
announcementList.value = res.data.data.records.map(item => ({
|
...item,
|
title: item.taskName,
|
description: item.noticeDesc,
|
time: item.createTime,
|
num: item.num,
|
like: item.like,
|
}))
|
} catch (error) {
|
uni.showToast({
|
title: error.message,
|
icon: 'none',
|
duration: 2000,
|
})
|
}
|
}
|
|
// 获取通知公告列表
|
const policyList = ref([]); // 政策制度
|
const regulationsList = ref([]); // 法律法规
|
async function getSysNoticeList(val) {
|
try {
|
const res = await sysNoticePageInfoApi({
|
current: 1,
|
size: 3,
|
noticeType: val,
|
isAsc: true
|
})
|
// 只需要取前3条 公告
|
if (val === 1) {
|
regulationsList.value = res.data.data.records.map(item => ({
|
...item,
|
title: item.noticeTitle,
|
description: item.remark,
|
time: item.pubDate,
|
num: item.num,
|
like: item.like,
|
}))
|
} else if (val === 2) {
|
policyList.value = res.data.data.records.map(item => ({
|
...item,
|
title: item.noticeTitle,
|
description: item.remark,
|
time: item.pubDate,
|
num: item.num,
|
like: item.like,
|
}))
|
}
|
} catch (error) {
|
uni.showToast({
|
title: error.message,
|
icon: 'none',
|
duration: 2000,
|
})
|
}
|
}
|
// 跳转到空域信息详情页
|
function airspaceClick(item) {
|
uni.navigateTo({
|
url: '/subPackages/airspaceInformation/index?taskName=' + item.taskName,
|
})
|
}
|
// 跳转到法律政策详情页
|
function toRegulationsDetail(item) {
|
uni.navigateTo({
|
url: '/subPackages/regulationsDetail/details?id=' + item.noticeId,
|
})
|
}
|
// 跳转到政策制度详情页
|
function policiesClick(item) {
|
uni.navigateTo({
|
url: '/subPackages/regulationsDetail/details?id=' + item.noticeId,
|
})
|
}
|
|
// 获取任务类型
|
const actionsFlightTaskType = ref([])
|
function getTaskType() {
|
flightTaskApi().then(res => {
|
actionsFlightTaskType.value = res.data.data.map(item => ({
|
...item,
|
label: item.dictLabel || '暂无',
|
value: item.dictValue || '暂无',
|
}))
|
// 存储到store
|
appStore.setTaskType(actionsFlightTaskType.value)
|
})
|
}
|
// 获取飞行模式
|
const actionsFlightMode = ref([])
|
function getFlightMode() {
|
flightModeApi().then(res => {
|
actionsFlightMode.value = res.data.data.map(item => ({
|
...item,
|
label: item.dictLabel || '暂无',
|
value: item.dictValue || '暂无',
|
}))
|
// 存储到store
|
appStore.setFlightMode(actionsFlightMode.value)
|
})
|
}
|
// 获取飞行规则
|
const actionsFlightRule = ref([])
|
function getFlightRules() {
|
flightRulesApi().then(res => {
|
actionsFlightRule.value = res.data.data.map(item => ({
|
...item,
|
label: item.dictLabel || '暂无',
|
value: item.dictValue || '暂无',
|
}))
|
// 存储到store
|
appStore.setFlightRules(actionsFlightRule.value)
|
})
|
}
|
// 获取飞行计划
|
const actionsPlanType = ref([])
|
function getFlightPlan() {
|
flightPlanApi().then(res => {
|
actionsPlanType.value = res.data.data.map(item => ({
|
...item,
|
label: item.dictLabel || '暂无',
|
value: item.dictValue || '暂无',
|
}))
|
// 存储到store
|
appStore.setFlightPlan(actionsPlanType.value)
|
})
|
}
|
// 获取审批状态
|
const flyActivityStatus = ref([])
|
function getFlyActivityStatus() {
|
flyActivityStatusApi().then(res => {
|
flyActivityStatus.value = res.data.data.map(item => ({
|
...item,
|
label: item.dictLabel || '暂无',
|
value: item.dictValue || '暂无',
|
}))
|
// 存储到store
|
appStore.setFlyActivityStatus(flyActivityStatus.value)
|
})
|
}
|
|
// 获取飞行状态
|
function flyActivityTakeoffStatus() {
|
flyActivityTakeoffStatusApi().then(res => {
|
flyActivityTakeoffStatus.value = res.data.data.map(item => ({
|
...item,
|
label: item.dictLabel || '暂无',
|
value: item.dictValue || '暂无',
|
}))
|
// 存储到store
|
appStore.setFlyActivityTakeoffStatus(flyActivityTakeoffStatus.value)
|
})
|
}
|
|
// 获取飞行器类型
|
const typeList = ref([])
|
function getProTypeApi() {
|
proTypeApi().then(res => {
|
typeList.value = res.data.data.map(item => ({
|
...item,
|
label: item.dictLabel || '暂无',
|
value: item.dictValue || '暂无',
|
}))
|
// 存储到store
|
appStore.setProType(typeList.value)
|
})
|
}
|
|
onMounted(() => {
|
getFlightAirspaceList()
|
getSysNoticeList(2)
|
getSysNoticeList(1)
|
|
// 获取字典
|
getTaskType()
|
getFlightMode()
|
getFlightRules()
|
getFlightPlan()
|
getFlyActivityStatus()
|
flyActivityTakeoffStatus()
|
getProTypeApi()
|
})
|
</script>
|
|
<style scoped lang="scss">
|
.page {
|
width: 100%;
|
height: 100%;
|
display: flex;
|
flex-direction: column;
|
position: relative;
|
|
.lb-bottom {
|
position: absolute;
|
top: 370rpx;
|
left: 0;
|
width: 100%;
|
image {
|
width: 100%;
|
height: 32rpx;
|
}
|
}
|
:deep(.u-grid) {
|
margin-top: 40rpx;
|
.grid-text {
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
font-weight: 500;
|
font-size: 14px;
|
color: #222324;
|
margin-top: 10px;
|
}
|
}
|
.tabs-container {
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
font-weight: 400;
|
font-size: 14px;
|
color: #4E5969;
|
background: #FFFFFF;
|
border-radius: 12px 12px 6px 6px;
|
padding: 0 20rpx;
|
margin-top: 10px;
|
}
|
.content {
|
margin-top: 10px;
|
width: 100%;
|
height: 0;
|
flex-grow: 1;
|
display: flex;
|
flex-direction: column;
|
background: #FFFFFF;
|
padding: 0 40rpx 40rpx 40rpx;
|
border-radius: 12px 12px 6px 6px;
|
overflow-y: auto;
|
box-sizing: border-box;
|
.title {
|
padding: 40rpx 40rpx 0rpx 0rpx;
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
font-weight: bolder;
|
font-size: 32rpx;
|
color: #1D2129;
|
}
|
}
|
.card {
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
display: flex;
|
justify-content: space-between;
|
border-bottom: 1px solid #EBEEF3;
|
padding: 40rpx 0 30rpx 0;
|
width: 100%;
|
box-sizing: border-box;
|
.left {
|
.u-image {
|
width: 60rpx;
|
height: 72rpx;
|
}
|
}
|
.right {
|
width: calc(100% - 80rpx);
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
.r-top {
|
font-weight: 500;
|
font-size: 14px;
|
color: #1D2129;
|
}
|
.r-middle {
|
font-weight: 400;
|
font-size: 13px;
|
color: #86909C;
|
}
|
.r-bottom {
|
display: flex;
|
justify-content: space-between;
|
font-weight: 400;
|
font-size: 13px;
|
color: #86909C;
|
margin-top: 10rpx;
|
}
|
}
|
}
|
}
|
</style>
|
