| | |
| | | <text class="grid-text">{{baseListItem.title}}</text> |
| | | </u-grid-item> |
| | | </u-grid> |
| | | <u-tabs :list="tabs" class="tabs"> |
| | | <template #right> |
| | | <view |
| | | style="padding-left: 4px;" |
| | | @tap="$u.toast('插槽被点击')" |
| | | > |
| | | 更多 |
| | | </view> |
| | | </template> |
| | | </u-tabs> |
| | | <view class="card" v-for="(item,index) in announcementList" :key="index"> |
| | | <view class="left"> |
| | | <u-image :src="lbPng" :width="20" :height="20"></u-image> |
| | | </view> |
| | | <view class="right"> |
| | | <view class="c-top">{{ item.airspaceName }}</view> |
| | | <view class="c-middle">{{ item.remarks || '暂无' }}</view> |
| | | <view class="c-bottom"> |
| | | <view>{{ item.createTime }}</view> |
| | | <view>{{ item.num || 0 }}</view> |
| | | <view>{{ item.like || 0 }}</view> |
| | | <view class="tabs-container"> |
| | | <u-tabs :list="tabs" @click="tabClick"> |
| | | <template #right> |
| | | <view |
| | | style="padding-left: 4px;" |
| | | @tap="$u.toast('插槽被点击')" |
| | | > |
| | | 更多 |
| | | </view> |
| | | </template> |
| | | </u-tabs> |
| | | </view> |
| | | <view class="content"> |
| | | <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"> |
| | | <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> |
| | |
| | | import fxsqPng from '@/static/images/fxsq.svg' |
| | | import flfgPng from '@/static/images/flfg.svg' |
| | | import zczdPng from '@/static/images/zczd.svg' |
| | | import docSvg from '@/static/images/doc.png' |
| | | import { sysNoticePageInfoApi, flightAirspacePageInfoApi } from '@/api/index' |
| | | const lbList = reactive([]); |
| | | // lbPng 轮播图 5次 |
| | |
| | | current: 1, |
| | | size: 10, |
| | | }) |
| | | announcementList.value = res.data.data.records |
| | | announcementList.value = res.data.data.records.map(item => ({ |
| | | ...item, |
| | | title: item.airspaceName, |
| | | description: item.remark, |
| | | time: item.createTime, |
| | | num: item.num, |
| | | like: item.like, |
| | | })) |
| | | } catch (error) { |
| | | uni.showToast({ |
| | | title: error.message, |
| | |
| | | } |
| | | } |
| | | |
| | | // 获取通知公告列表 |
| | | async function getSysNoticeList() { |
| | | try { |
| | | const res = await sysNoticePageInfoApi({ |
| | | current: 1, |
| | | size: 10, |
| | | noticeType: 2, |
| | | }) |
| | | if (res.code === 200) { |
| | | announcementList.value = res.data.records |
| | | // 获取通知公告列表 |
| | | async function getSysNoticeList(val) { |
| | | try { |
| | | const res = await sysNoticePageInfoApi({ |
| | | current: 1, |
| | | size: 10, |
| | | noticeType: val, |
| | | }) |
| | | announcementList.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, |
| | | }) |
| | | } |
| | | } catch (error) { |
| | | uni.showToast({ |
| | | title: error.message, |
| | | icon: 'none', |
| | | duration: 2000, |
| | | }) |
| | | } |
| | | |
| | | function tabClick(value) { |
| | | announcementList.value = [] |
| | | if (value.index === 0) { |
| | | getFlightAirspaceList() |
| | | } else if (value.index === 1) { |
| | | getSysNoticeList(2) |
| | | } else if (value.index === 2) { |
| | | getSysNoticeList(1) |
| | | } |
| | | } |
| | | |
| | |
| | | .page { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | .u-grid { |
| | | margin-top: 20px; |
| | | .grid-text { |
| | |
| | | font-weight: 500; |
| | | font-size: 14px; |
| | | color: #222324; |
| | | margin-top: 10px; |
| | | } |
| | | } |
| | | .tabs { |
| | | background-color: white; |
| | | border-radius: 10px; |
| | | padding: 0 10px; |
| | | margin-top: 20px; |
| | | .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 { |
| | | width: 100%; |
| | | height: 0; |
| | | flex-grow: 1; |
| | | display: flex; |
| | | flex-direction: column; |
| | | background: #FFFFFF; |
| | | padding: 0 40rpx 40rpx 40rpx; |
| | | overflow-y: auto; |
| | | box-sizing: border-box; |
| | | } |
| | | .card { |
| | | background-color: white; |
| | | padding: 0 10px; |
| | | padding-top: 10px; |
| | | 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 { |
| | | width: 20px; |
| | | height: 20px; |
| | | .u-image { |
| | | width: 60rpx; |
| | | height: 72rpx; |
| | | } |
| | | } |
| | | .right { |
| | | flex: 1; |
| | | margin-left: 10px; |
| | | .c-bottom { |
| | | 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; |
| | | } |
| | | } |
| | | } |