feat(maritime): 重构海事公告页面并添加新功能

- 重新设计海事公告列表布局和样式，增加下拉刷新和上拉加载更多功能
- 添加法律援助机构信息展示
- 实现公告详情查看功能
- 优化页面加载和数据请求逻辑
- 调整页面样式，提升用户体验

miniprogram/custom-tab-bar/index.js

@@ -19,7 +19,7 @@ Component({
 
       {
         pagePath: "/pages/maritime/maritime",
-        text: "海事",
+        text: "海事/法务",
         selectedIconPath: "../images/tabs/ship-.png",
         iconPath: "../images/tabs/ship.png",
       },

miniprogram/pages/maritime/maritime.js

@@ -1,29 +1,105 @@
 Page({
   data: {
-    notices: [
-      {
-        title: "关于加强长江干线船舶污染防治的通知",
-        date: "2024-01-15",
-        unit: "江苏海事局",
-      },
-      {
-        title: "2024年春运期间船舶安全管理要求",
-        date: "2024-01-10",
-        unit: "交通运输部海事局",
-      },
-      {
-        title: "关于开展内河船舶安全专项检查的通知",
-        date: "2024-01-05",
-        unit: "南京海事局",
-      },
-    ],
+    notices: [],
     legalOrg: {
-      name: "江苏海事法律援助中心",
-      photoUrl: "../../images/new-version/pic.png",
-      introduction:
-        "江苏海事法律援助中心成立于2010年，是专门为船东、船员提供法律服务的专业机构。中心配备了多名具有海事海商法专业背景的律师，长期从事海事纠纷处理、海事诉讼代理等业务。我们致力于为内河航运企业和个人提供优质、高效的法律服务，包括船舶买卖、租赁合同纠纷、海事事故处理、保险理赔等方面的法律咨询和援助。中心秉持公正、专业、高效的服务理念，为促进航运业健康发展贡献力量。",
+      name: "",
+      photoUrl: "",
+      introduction: "",
     },
     aidRequest: "",
+    currentPage: 1,
+    pageSize: 10,
+    totalPages: 0,
+    isLoading: false,
+    hasMore: true,
+    isRefreshing: false,
+  },
+
+  // 获取海事公告列表
+  getNoticeList(isRefresh = false) {
+    if (this.data.isLoading || (!isRefresh && !this.data.hasMore)) return;
+
+    this.setData({ isLoading: true });
+
+    const currentPage = isRefresh ? 1 : this.data.currentPage;
+
+    // 导入API配置
+    const { api } = require("../../apis/apiConfig.js");
+
+    api(
+      "/maritime/safety/notice/list",
+      {
+        currentPage: currentPage,
+        size: this.data.pageSize,
+      },
+      "POST"
+    )
+      .then((res) => {
+        if (res.data.status === 0) {
+          const newNotices = res.data.result.map((item) => ({
+            id: item.id,
+            title: item.fileName,
+            date: item.createTime.split(" ")[0],
+            unit: "",
+            fileKey: item.fileKey,
+            downloadUrl: item.downloadUrl,
+          }));
+
+          this.setData({
+            notices: isRefresh
+              ? newNotices
+              : [...this.data.notices, ...newNotices],
+            currentPage: currentPage + 1,
+            totalPages: Math.ceil(res.data.total / this.data.pageSize),
+            hasMore:
+              currentPage < Math.ceil(res.data.total / this.data.pageSize),
+          });
+        } else {
+          wx.showToast({
+            title: res.data.msg || "获取公告列表失败",
+            icon: "none",
+          });
+        }
+      })
+      .catch(() => {
+        wx.showToast({
+          title: "网络异常，请稍后重试",
+          icon: "none",
+        });
+      })
+      .finally(() => {
+        this.setData({ isLoading: false });
+        wx.stopPullDownRefresh();
+      });
+  },
+
+  // 获取法律援助机构信息
+  getLegalAidInfo() {
+    const { api } = require("../../apis/apiConfig.js");
+
+    api("/maritime/safety/legal/aid/introduce", {}, "GET")
+      .then((res) => {
+        if (res.data.status === 0 && res.data.result) {
+          const { legalAidIntroduce, lawyerIntroduce } = res.data.result;
+          this.setData({
+            legalOrg: {
+              name: legalAidIntroduce.title || "法律援助机构",
+              photoUrl:
+                lawyerIntroduce.imageUrl || "../../images/new-version/pic.png",
+              introduction:
+                legalAidIntroduce.imageUrl ||
+                legalAidIntroduce.textContent ||
+                "",
+            },
+          });
+        }
+      })
+      .catch(() => {
+        wx.showToast({
+          title: "获取法律援助信息失败",
+          icon: "none",
+        });
+      });
   },
 
   handleInputChange(e) {
@@ -41,19 +117,42 @@ Page({
       return;
     }
 
-    // TODO: 实现提交援助请求的接口调用
-    wx.showToast({
-      title: "申请提交成功",
-      icon: "success",
-    });
+    const { api } = require("../../apis/apiConfig.js");
 
-    this.setData({
-      aidRequest: "",
-    });
+    api(
+      "/maritime/safety/legal/aid/request",
+      {
+        requestContent: this.data.aidRequest,
+      },
+      "POST"
+    )
+      .then((res) => {
+        if (res.data && res.data.status === 0) {
+          wx.showToast({
+            title: "申请提交成功",
+            icon: "success",
+          });
+          this.setData({
+            aidRequest: "",
+          });
+        } else {
+          wx.showToast({
+            title: res.data.msg || "申请提交失败",
+            icon: "none",
+          });
+        }
+      })
+      .catch(() => {
+        wx.showToast({
+          title: "网络异常，请稍后重试",
+          icon: "none",
+        });
+      });
   },
 
   onLoad() {
-    // TODO: 从服务器获取海事公告列表和法律援助机构信息
+    this.getNoticeList(true);
+    this.getLegalAidInfo();
   },
 
   onShow() {
@@ -63,4 +162,80 @@ Page({
       });
     }
   },
+
+  // 下拉刷新
+  onPullDownRefresh() {
+    this.setData({
+      currentPage: 1,
+      hasMore: true,
+      isRefreshing: true,
+    });
+    this.getNoticeList(true);
+  },
+
+  // 处理scroll-view的滚动到底部事件
+  onScrollToLower() {
+    if (this.data.hasMore && !this.data.isLoading) {
+      this.getNoticeList();
+    }
+  },
+
+  // 页面上拉触底事件（保留但不再使用，改为使用scroll-view的bindscrolltolower）
+  onReachBottom() {
+    // 页面的上拉触底事件已被scroll-view的bindscrolltolower替代
+  },
+
+  // 查看公告详情
+  viewNoticeDetail(e) {
+    const id = e.currentTarget.dataset.id;
+    const notice = this.data.notices.find((item) => item.id === id);
+
+    if (notice && notice.downloadUrl) {
+      wx.showLoading({
+        title: "加载中",
+      });
+
+      // 获取API配置
+      const { apiUrl } = require("../../apis/apiConfig.js");
+
+      // 检查downloadUrl是否已包含完整URL
+
+      // 打开文件预览
+      wx.downloadFile({
+        url: notice.downloadUrl,
+        success: function (res) {
+          const filePath = res.tempFilePath;
+          console.log("文件路径：", res);
+          wx.openDocument({
+            filePath: filePath,
+            fileType: "pdf",
+            success: function () {
+              console.log("打开文档成功");
+            },
+            fail: function () {
+              wx.showToast({
+                title: "无法打开文件",
+                icon: "none",
+              });
+            },
+            complete: function () {
+              wx.hideLoading();
+            },
+          });
+        },
+        fail: function () {
+          wx.hideLoading();
+          wx.showToast({
+            title: "文件下载失败",
+            icon: "none",
+          });
+        },
+      });
+    } else {
+      wx.showToast({
+        title: "无法获取公告详情",
+        icon: "none",
+      });
+    }
+  },
 });

miniprogram/pages/maritime/maritime.wxml

@@ -1,21 +1,25 @@
 <view class="container">
   <!-- 顶部标题 -->
-
   <!-- 内容区域 -->
   <view class="content">
     <!-- 海事公告列表 -->
     <view class="card">
       <view class="card-header">海事公告</view>
       <view class="card-content">
-        <view class="notice-list">
-          <view class="notice-item" wx:for="{{notices}}" wx:key="index">
-            <view class="notice-title">{{item.title}}</view>
-            <view class="notice-info">
-              <text class="notice-date">{{item.date}}</text>
-              <text class="notice-unit">{{item.unit}}</text>
+        <scroll-view class="notice-scroll" scroll-y="true" bindscrolltolower="onScrollToLower" refresher-enabled="true" refresher-triggered="{{isRefreshing}}" bindrefresherrefresh="onPullDownRefresh">
+          <view class="notice-list">
+            <view wx:if="{{notices.length === 0 && !isLoading}}" class="empty-tip">暂无海事公告</view>
+            <view class="notice-item" wx:for="{{notices}}" wx:key="id" bindtap="viewNoticeDetail" data-id="{{item.id}}">
+              <view class="notice-title">{{item.title}}</view>
+              <view class="notice-info">
+                <text class="notice-date">{{item.date}}</text>
+                <text class="notice-unit">{{item.unit}}</text>
+              </view>
             </view>
+            <view wx:if="{{isLoading}}" class="loading">加载中...</view>
+            <view wx:if="{{!hasMore && notices.length > 0}}" class="no-more">没有更多数据了</view>
           </view>
-        </view>
+        </scroll-view>
       </view>
     </view>
     <!-- 法律援助机构介绍 -->

miniprogram/pages/maritime/maritime.wxss

@@ -36,13 +36,22 @@
 }
 
 /* 海事公告列表样式 */
+.notice-scroll {
+  height: 600rpx;
+  width: 100%;
+  overflow: hidden;
+}
+
 .notice-list {
   margin-top: 10rpx;
 }
 
 .notice-item {
-  padding: 20rpx 0;
+  padding: 20rpx 10rpx;
   border-bottom: 2rpx solid #f0f0f0;
+  background-color: #fff;
+  border-radius: 8rpx;
+  margin-bottom: 10rpx;
 }
 
 .notice-item:last-child {
@@ -53,6 +62,13 @@
   font-size: 28rpx;
   color: #333;
   margin-bottom: 10rpx;
+  font-weight: 500;
+  word-break: break-all;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
 }
 
 .notice-info {
@@ -101,6 +117,35 @@
   border: 2rpx solid #e0e0e0;
   border-radius: 8rpx;
   font-size: 28rpx;
+}
+
+/* 加载状态样式 */
+.loading,
+.no-more {
+  text-align: center;
+  color: #999;
+  padding: 20rpx 0;
+  font-size: 24rpx;
+  width: 100%;
+  display: block;
+}
+
+.empty-tip {
+  text-align: center;
+  color: #999;
+  padding: 30rpx 0;
+  font-size: 28rpx;
+}
+
+/* 提交按钮样式 */
+.submit-btn {
+  margin-top: 20rpx;
+  background-color: #1989fa;
+  color: #fff;
+  text-align: center;
+  padding: 20rpx 0;
+  border-radius: 8rpx;
+  font-size: 28rpx;
   margin-bottom: 20rpx;
 }