feat； 消息与天气接口对接

src/pages/ChatMain/NoticeMessage/detail.vue

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