zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 通知详情的页面调整

Browse Source
This commit is contained in:
zoujing
2026-05-08 12:52:03 +08:00
parent 42e0e4920f
commit a3c82382c2
1 changed files with 9 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/pages/ChatMain/NoticeMessage/detail.vue
View File

@@ -8,7 +8,7 @@
<!-- ✅ 滚动区域 --> <!-- ✅ 滚动区域 -->
<scroll-view class="flex-full overflow-hidden" scroll-y > <scroll-view class="flex-full overflow-hidden" scroll-y >
<view class="pb-24 border-box overflow-hidden"> <view class="pb-24 border-box overflow-hidden">
<image class="w-full block" :src="coverImage" mode="aspectFill" /> <image v-if="coverImage" class="w-full block" :src="coverImage" mode="aspectFill" />
<view class="pt-16 px-12 pb-24 border-box"> <view class="pt-16 px-12 pb-24 border-box">
<view class="color-171717 font-size-16 font-weight-600">{{ detailTitle }}</view> <view class="color-171717 font-size-16 font-weight-600">{{ detailTitle }}</view>
@@ -20,7 +20,7 @@
<view class="mt-16 mx-12 bg-gray w-full height-1"></view> <view class="mt-16 mx-12 bg-gray w-full height-1"></view>
<view class="mt-16 color-171717 font-size-14">{{ noticeContent }}</view> <view class="mt-16 color-666 font-size-14 line-height-20">{{ noticeContent }}</view>
</view> </view>
</view> </view>
</scroll-view> </scroll-view>
@@ -29,36 +29,25 @@
<script setup> <script setup>
import TopNavBar from "@/components/TopNavBar/index.vue"; import TopNavBar from "@/components/TopNavBar/index.vue";
import defaultCover from "@/components/ImageSwiper/images/2025-07-12_180248.jpg";
import { computed, ref } from "vue"; import { computed, ref } from "vue";
import { onLoad } from "@dcloudio/uni-app"; import { onLoad } from "@dcloudio/uni-app";
const noticeData = ref({}); const noticeData = ref({});
const fallbackContent = [
"因近日持续降雨导致景区内水位明显上升，为保障游客人身安全，景区管理部门决定自即日起临时封闭卧龙潭至鸳鸯湖沿溪步道，封闭时间视水位情况另行通知。",
"受影响游客可改走景区主干道绕行，全程增加约15分钟。观光车服务正常运营，建议优先乘车前往鸳鸯湖区域。",
"因近日持续降雨导致景区内水位明显上升，为保障游客人身安全，景区管理部门决定自即日起临时封闭卧龙潭至鸳鸯湖沿溪步道，封闭时间视水位情况另行通知。",
"因近日持续降雨导致景区内水位明显上升，为保障游客人身安全，景区管理部门决定自即日起临时封闭卧龙潭至鸳鸯湖沿溪步道，封闭时间视水位情况另行通知。",
"因近日持续降雨导致景区内水位明显上升，为保障游客人身安全，景区管理部门决定自即日起临时封闭卧龙潭至鸳鸯湖沿溪步道，封闭时间视水位情况另行通知。",
"因近日持续降雨导致景区内水位明显上升，为保障游客人身安全，景区管理部门决定自即日起临时封闭卧龙潭至鸳鸯湖沿溪步道，封闭时间视水位情况另行通知。",
"因近日持续降雨导致景区内水位明显上升，为保障游客人身安全，景区管理部门决定自即日起临时封闭卧龙潭至鸳鸯湖沿溪步道，封闭时间视水位情况另行通知。",
"如水位下降恢复安全标准，景区将第一时间通过广播及公告重新开放步道，请游客留意景区实时公告。"
];
const detailTitle = computed(() => { const detailTitle = computed(() => {
return noticeData.value.entityName?.trim() || "消息详情"; return noticeData.value.entityName?.trim() || "消息详情";
}); });
const publishTime = computed(() => { const publishTime = computed(() => {
return noticeData.value.effectiveStartTime?.trim() || ""; return noticeData.value.effectiveStartTime?.trim();
}); });
const coverImage = computed(() => { const coverImage = computed(() => {
return noticeData.value.eventImage?.trim() || defaultCover; return noticeData.value.eventImage?.trim();
}); });
const noticeContent = computed(() => { const noticeContent = computed(() => {
return noticeData.value.eventDescription?.trim() || fallbackContent.join("\n"); return noticeData.value.eventDescription?.trim();
}); });
onLoad((query = {}) => { onLoad((query = {}) => {
@@ -75,22 +64,14 @@ onLoad((query = {}) => {
<style lang="scss" scoped> <style lang="scss" scoped>
.notice-title {
font-size: 48rpx;
font-weight: 700;
line-height: 68rpx;
color: #2d3a57;
}
.notice-time-tag { .notice-time-tag {
display: inline-flex; display: inline-flex;
min-height: 76rpx; height: 28px;
padding: 0 28rpx; padding: 6px 12px;
background: linear-gradient(180deg, #f4f7fb 0%, #e9eef6 100%); background: linear-gradient(180deg, #f4f7fb 0%, #e9eef6 100%);
border: 2rpx solid #d6dde8; border: 1px solid #d6dde8;
border-radius: 999rpx; border-radius: 14px;
box-sizing: border-box; box-sizing: border-box;
} }
</style> </style>