Просмотр исходного кода

refactor(miniprogram): 重构分享页面样式和逻辑

- 更新了 cert、school、securityCheck 和 shipyard 模块的分享页面样式
- 优化了分享页面的数据加载和错误处理逻辑
- 添加了拨打电话功能
- 调整了页面布局和样式,提高了用户体验
wzg 8 месяцев назад
Родитель
Сommit
47997834e0

+ 13 - 25
miniprogram/pages/cert/sharePage/sharePage.js

@@ -24,35 +24,23 @@ Page({
     }
   },
 
-  getSharedCertInfo(token) {
-    // 调用API获取分享的证书信息
-    // API: POST /ship/cert/share/list
-    // 参数: token (query)
+  async getSharedCertInfo(token) {
     wx.showLoading({
       title: "加载中...",
     });
-    postApi("/ship/cert/share/list", { token })
-      .then((res) => {
-        wx.hideLoading();
-        if (res.success && res.data) {
-          this.setData({
-            sharedCertList: res.data,
-          });
-        } else {
-          wx.showToast({
-            title: res.msg || "获取证书信息失败",
-            icon: "none",
-          });
-        }
-      })
-      .catch((err) => {
-        wx.hideLoading();
-        wx.showToast({
-          title: "网络错误",
-          icon: "none",
-        });
-        console.error("获取分享证书信息失败:", err);
+    let { data } = await postApi("/ship/cert/share/list", { token });
+
+    wx.hideLoading();
+    if (data.status === 0) {
+      this.setData({
+        sharedCertList: data.result,
+      });
+    } else {
+      wx.showToast({
+        title: data.msg || "获取证书信息失败",
+        icon: "none",
       });
+    }
   },
 
   /**

+ 2 - 34
miniprogram/pages/school/school.js

@@ -5,40 +5,8 @@ Page({
    * 页面的初始数据
    */
   data: {
-    school: {
-      id: 1,
-      crewSchoolName: "新蔡海员培训学校",
-      crewSchoolImgFileKey:
-        "new/crew_school/2cd3fd6c-0de4-400c-a847-d7fa07ddd6d31746529627175.png",
-      crewSchoolImgUrl:
-        "https://hhd-shipping-1255802371.cos.ap-shanghai.myqcloud.com/new/crew_school/2cd3fd6c-0de4-400c-a847-d7fa07ddd6d31746529627175.png?sign=q-sign-algorithm%3Dsha1%26q-ak%3DAKID4xb091cy4tRikV0EBrGOGsCF1WkhMlum%26q-sign-time%3D1746529628%3B93158697600%26q-key-time%3D1746529628%3B93158697600%26q-header-list%3Dhost%26q-url-param-list%3D%26q-signature%3D659f4bedef396f033e75d39425a4fe00f93dca3c",
-      crewSchoolIntroduce: "新蔡海员",
-      crewSchoolSiteSize: 2000,
-      crewSchoolAnnualGraduationNum: 500,
-      createTime: "2024/02/01 00:00:00",
-    },
-    noticeList: [
-      {
-        id: 3,
-        crewSchoolId: 1,
-        trainingNoticeTitle: "测试公告",
-        trainingNoticeImgFileKey:
-          "new/crew_school_training_notice/31c56330-3e68-4204-860b-87925b0f24dd1746495769145.png",
-        trainingNoticeImgUrl:
-          "https://hhd-shipping-1255802371.cos.ap-shanghai.myqcloud.com/new/crew_school_training_notice/31c56330-3e68-4204-860b-87925b0f24dd1746495769145.png?sign=q-sign-algorithm%3Dsha1%26q-ak%3DAKID4xb091cy4tRikV0EBrGOGsCF1WkhMlum%26q-sign-time%3D1746495776%3B93158697600%26q-key-time%3D1746495776%3B93158697600%26q-header-list%3Dhost%26q-url-param-list%3D%26q-signature%3D53284698ccdc5d1cbafe36965c22375effbc3e84",
-        trainingNoticeContent: "测试内容",
-        postedBy: "汇很多",
-        createTime: "2025/04/25 14:42:23",
-      },
-    ],
-    notice: {
-      title: "海员培训课程将在2025年3月10-15日期间在新蔡学员举办",
-      author: "汇很多",
-      date: "2024-02-01",
-      photoUrl: "../../images/new-version/pic.png",
-      content:
-        "为提高海员专业素质,满足航运业发展需求,我校定于2025年3月10日至15日开展新一期海员培训课程。本次培训主要面向有志于从事航海事业的学员,课程内容包括船舶操作技能、航海英语、海事法规、安全管理等方面。培训采用理论与实践相结合的方式,配备经验丰富的教师团队,使用先进的模拟设备,确保学员能够掌握必要的专业知识和实操技能。完成培训并通过考核的学员,将获得相应的培训证书。此次培训名额有限,请有意向的学员提前报名。学校将为学员提供良好的学习环境和完善的后勤保障服务。",
-    },
+    school: {},
+    noticeList: [],
   },
 
   /**

+ 9 - 7
miniprogram/pages/school/sharePage/sharePage.js

@@ -7,16 +7,16 @@ Page({
    * 页面的初始数据
    */
   data: {
-    sharedShipyardInfo: null, // 用于存储分享的船厂信息
+    schoolTrainingNotice: null, // 用于存储分享的船厂信息
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-    const shipyardId = options.shipyardId;
-    if (shipyardId) {
-      this.getSharedShipyardInfo(shipyardId);
+    const noticeId = options.noticeId;
+    if (noticeId) {
+      this.getSchoolTrainingNotice(noticeId);
     } else {
       wx.showToast({
         title: "无效的分享链接",
@@ -25,15 +25,17 @@ Page({
     }
   },
 
-  async getSharedShipyardInfo(shipyardId) {
+  async getSchoolTrainingNotice(noticeId) {
     wx.showLoading({
       title: "加载中...",
     });
-    let { data } = await postApi("/shipyard/info/share", { shipyardId });
+    let { data } = await postApi("/crew/school/training/notice/share", {
+      noticeId,
+    });
     wx.hideLoading();
     if (data.status === 0) {
       this.setData({
-        sharedShipyardInfo: data.result,
+        schoolTrainingNotice: data.result,
       });
     } else {
       wx.showToast({

+ 21 - 24
miniprogram/pages/school/sharePage/sharePage.wxml

@@ -1,25 +1,22 @@
-<!-- pages/school/sharePage/sharePage.wxml -->
-<view class="container">
-    <block wx:if="{{sharedShipyardInfo}}">
-        <view class="info-card">
-            <view class="info-title">{{sharedShipyardInfo.name || '船厂信息'}}</view>
-            <view class="info-item">
-                <text class="label">船厂地址:</text>
-                <text class="value">{{sharedShipyardInfo.address || '暂无地址'}}</text>
-            </view>
-            <view class="info-item">
-                <text class="label">联系电话:</text>
-                <text class="value">{{sharedShipyardInfo.phone || '暂无电话'}}</text>
-            </view>
-            <view class="info-item">
-                <text class="label">主营业务:</text>
-                <text class="value">{{sharedShipyardInfo.majorBusiness || '暂无介绍'}}</text>
-            </view>
-            <!-- 根据实际返回的对象字段进行调整 -->
-            <!-- 例如: sharedShipyardInfo.contactPerson, sharedShipyardInfo.website 等 -->
-        </view>
-    </block>
-    <block wx:else>
-        <text class="empty-text">暂无分享的船厂信息</text>
-    </block>
+<view class="card">
+  <view class="card-header">培训公告</view>
+  <view class="card-content">
+    <view class="notice-info">
+      <view class="notice-title">{{schoolTrainingNotice.trainingNoticeTitle}}</view>
+      <view class="notice-meta">
+        <text class="notice-author">{{schoolTrainingNotice.postedBy}}</text>
+        <text class="notice-date">{{schoolTrainingNotice.createTime}}</text>
+      </view>
+      <image class="notice-photo" mode="aspectFill" src="{{schoolTrainingNotice.trainingNoticeImgUrl}}"></image>
+      <view class="notice-content">
+        <text>{{schoolTrainingNotice.trainingNoticeContent}}</text>
+      </view>
+      <!-- <button class="contact-btn" bindtap="makePhoneCall" data-id="{{item.id}}" data-phone="{{item.contactPhone}}">
+            拨打电话
+          </button> -->
+      <!-- <button class="share-btn" open-type="share" data-title="{{schoolTrainingNotice.trainingNoticeTitle}}">
+        分享公告
+      </button> -->
+    </view>
+  </view>
 </view>

+ 118 - 30
miniprogram/pages/school/sharePage/sharePage.wxss

@@ -1,52 +1,140 @@
-/* pages/school/sharePage/sharePage.wxss */
 .container {
   padding: 20rpx;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
-    Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-  min-height: 100vh;
-  background-color: #f4f4f4;
+  background-color: #f5f5f5;
 }
 
-.info-card {
+.header {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #333;
+  padding: 20rpx 0;
+  text-align: center;
+}
+
+.content {
+  margin-top: 20rpx;
+}
+
+.card {
   background-color: #fff;
-  border-radius: 10rpx;
-  padding: 30rpx 20rpx;
-  margin-bottom: 20rpx;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+  border-radius: 16rpx;
+  margin: 20rpx;
+  padding: 10rpx 20rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+  overflow: hidden;
 }
 
-.info-title {
-  font-size: 36rpx;
-  color: #333;
+.card-header {
+  font-size: 32rpx;
   font-weight: bold;
+  color: #333;
+  padding: 20rpx;
+  border-bottom: 2rpx solid #f0f0f0;
+}
+
+.card-content {
+  padding: 20rpx;
+}
+
+/* 学校信息样式 */
+.school-info {
+  margin-top: 10rpx;
+}
+
+.school-photo {
+  width: 100%;
+  height: 400rpx;
+  border-radius: 8rpx;
   margin-bottom: 20rpx;
-  text-align: center;
 }
 
 .info-item {
-  display: flex;
-  font-size: 30rpx;
-  color: #555;
-  margin-bottom: 15rpx;
+  margin-bottom: 16rpx;
+}
+
+.intro-text {
+  font-size: 28rpx;
+  color: #666;
   line-height: 1.6;
 }
 
-.info-item .label {
-  width: 180rpx; /* 根据实际标签长度调整 */
-  color: #888;
-  margin-right: 10rpx;
+/* 运营数据样式 */
+.operation-data {
+  display: flex;
+  justify-content: space-around;
+  padding: 20rpx 0;
 }
 
-.info-item .value {
-  flex: 1;
-  color: #333;
+.data-item {
+  text-align: center;
 }
 
-/* 如果对象为空 */
-.container > .empty-text {
+.data-value {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #333;
   display: block;
-  text-align: center;
+  margin-bottom: 8rpx;
+}
+
+.data-label {
+  font-size: 24rpx;
+  color: #999;
+}
+
+/* 公告样式 */
+.notice-info {
+  margin-top: 10rpx;
+}
+
+.notice-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 16rpx;
+}
+
+.notice-meta {
+  display: flex;
+  align-items: center;
+  margin-bottom: 16rpx;
+}
+
+.notice-author {
+  font-size: 24rpx;
+  color: #666;
+  margin-right: 20rpx;
+}
+
+.notice-date {
+  font-size: 24rpx;
   color: #999;
-  font-size: 30rpx;
-  padding-top: 200rpx;
+}
+
+.notice-photo {
+  width: 100%;
+  height: 300rpx;
+  border-radius: 8rpx;
+  margin-bottom: 16rpx;
+}
+
+.notice-content {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.6;
+  margin-bottom: 20rpx;
+}
+
+.share-btn {
+  background-color: #07c160;
+  color: #fff;
+  font-size: 28rpx;
+  padding: 16rpx 32rpx;
+  border-radius: 8rpx;
+  border: none;
+  margin-top: 20rpx;
+}
+
+.share-btn::after {
+  border: none;
 }

+ 1 - 29
miniprogram/pages/securityCheck/securityCheck.js

@@ -6,35 +6,7 @@ Page({
    */
   data: {
     currentNotice: {}, // 当前显示的通知详情
-    noticeList: [
-      {
-        id: 2,
-        noticeTitle: "测试通知通知",
-        noticeImgFileKey:
-          "new/annual_inspection_notice/0ebe0d67-1ead-4d0c-ac97-f4d644b5a56f1745505310167.png",
-        noticeImgUrl:
-          "https://hhd-shipping-1255802371.cos.ap-shanghai.myqcloud.com/new/annual_inspection_notice/0ebe0d67-1ead-4d0c-ac97-f4d644b5a56f1745505310167.png?sign=q-sign-algorithm%3Dsha1%26q-ak%3DAKID4xb091cy4tRikV0EBrGOGsCF1WkhMlum%26q-sign-time%3D1745505322%3B93158697600%26q-key-time%3D1745505322%3B93158697600%26q-header-list%3Dhost%26q-url-param-list%3D%26q-signature%3D2e87d32969f92f6a2894bafee945e4433ae5240b",
-        noticeContent: "13333333333333333",
-        contactName: "测试人",
-        contactPhone: "13111111112",
-        postedBy: "汇很多",
-        createTime: "2025/04/24 22:35:22",
-      },
-      {
-        id: 1,
-        noticeTitle: "江苏海事局即将在3月10-15日期间在江阴码头开放统一年检",
-        noticeImgFileKey:
-          "new/annual_inspection_notice/0c75b46a-f4ba-4652-be47-569a63e962ad1745504543747.png",
-        noticeImgUrl:
-          "https://hhd-shipping-1255802371.cos.ap-shanghai.myqcloud.com/new/annual_inspection_notice/0c75b46a-f4ba-4652-be47-569a63e962ad1745504543747.png?sign=q-sign-algorithm%3Dsha1%26q-ak%3DAKID4xb091cy4tRikV0EBrGOGsCF1WkhMlum%26q-sign-time%3D1745504545%3B93158697600%26q-key-time%3D1745504545%3B93158697600%26q-header-list%3Dhost%26q-url-param-list%3D%26q-signature%3Df2bf012506b634d2437fb5bc726af541c66d5869",
-        noticeContent:
-          "江苏海事局进一步提高船舶年检效率,方便船东集中办理船舶检验业务,定于2024年3月10日至15日期间在江阴码头开展船舶统一年检活动。本次年检主要针对内河干散货运输船舶,重点检查船舶适航状态、消防救生设备、防污染设备等安全设施。参检船舶需提前准备船舶证书、船员证书等相关文件,并确保各项安全设备处于良好状态。检验期间将开通绿色通道,提供现场咨询服务,帮助船东解决实际困难。请各位船东根据自身情况合理安排时间,按期参加年检。我们将竭诚为广大船东提供优质、高效的检验服务。",
-        contactName: "朱经理",
-        contactPhone: "13912345678",
-        postedBy: "汇很多1",
-        createTime: "2024/02/01 00:00:00",
-      },
-    ],
+    noticeList: [],
   },
 
   /**

+ 14 - 1
miniprogram/pages/securityCheck/sharePage/sharePage.js

@@ -7,7 +7,20 @@ Page({
    * 页面的初始数据
    */
   data: {
-    sharedNoticeInfo: null, // 用于存储分享的海事年检通知信息
+    sharedNoticeInfo: {}, // 用于存储分享的海事年检通知信息
+  },
+  makePhoneCall: function (e) {
+    const phoneNumber = e.currentTarget.dataset.phone;
+    if (phoneNumber) {
+      wx.makePhoneCall({
+        phoneNumber: phoneNumber,
+      });
+    } else {
+      wx.showToast({
+        title: "电话号码不存在",
+        icon: "none",
+      });
+    }
   },
 
   /**

+ 23 - 20
miniprogram/pages/securityCheck/sharePage/sharePage.wxml

@@ -1,21 +1,24 @@
-<!-- pages/securityCheck/sharePage/sharePage.wxml -->
 <view class="container">
-    <block wx:if="{{sharedNoticeInfo}}">
-        <view class="notice-card">
-            <view class="notice-title">{{sharedNoticeInfo.title || '海事年检通知'}}</view>
-            <view class="notice-item">
-                <text class="label">通知内容:</text>
-                <text class="value">{{sharedNoticeInfo.content || '暂无内容'}}</text>
-            </view>
-            <view class="notice-item">
-                <text class="label">发布日期:</text>
-                <text class="value">{{sharedNoticeInfo.publishDate || 'N/A'}}</text>
-            </view>
-            <!-- 根据实际返回的对象字段进行调整 -->
-            <!-- 例如: sharedNoticeInfo.shipName, sharedNoticeInfo.inspectionDate 等 -->
-        </view>
-    </block>
-    <block wx:else>
-        <text>暂无分享的通知信息</text>
-    </block>
-</view>
+  <!-- 顶部标题 -->
+  <view class="header">海事年检通知</view>
+  <!-- 内容区域 -->
+  <view class="content" wx:if="{{sharedNoticeInfo.id}}">
+    <view class="card">
+      <view class="notice-title">{{sharedNoticeInfo.noticeTitle}}</view>
+      <view class="notice-info">
+        <text class="notice-author">{{sharedNoticeInfo.postedBy}}</text>
+        <text class="notice-date">{{sharedNoticeInfo.createTime}}</text>
+      </view>
+      <image class="dock-photo" mode="aspectFill" src="{{sharedNoticeInfo.noticeImgUrl}}"></image>
+      <view class="notice-content">{{sharedNoticeInfo.noticeContent}}</view>
+      <view class="contact-section">
+        <text class="contact-info">详情请联系{{sharedNoticeInfo.contactName}}:{{sharedNoticeInfo.contactPhone}}</text>
+        <button class="contact-btn" bindtap="makePhoneCall" data-phone="{{sharedNoticeInfo.contactPhone}}">
+          拨打电话
+        </button>
+      </view>
+    </view>
+  </view>
+  <view class="tac fs28 c7 p40" wx:else>暂无数据</view>
+</view>
+<view class="h200"></view>

+ 61 - 29
miniprogram/pages/securityCheck/sharePage/sharePage.wxss

@@ -1,52 +1,84 @@
-/* pages/securityCheck/sharePage/sharePage.wxss */
 .container {
   padding: 20rpx;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
-    Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-  min-height: 100vh;
-  background-color: #f4f4f4;
+  background-color: #f5f5f5;
 }
 
-.notice-card {
+.header {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #333;
+  padding: 20rpx 0;
+  text-align: center;
+}
+
+.content {
+  margin-top: 20rpx;
+}
+
+.card {
   background-color: #fff;
-  border-radius: 10rpx;
-  padding: 30rpx 20rpx;
+  border-radius: 16rpx;
   margin-bottom: 20rpx;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+  padding: 20rpx;
 }
 
 .notice-title {
-  font-size: 36rpx;
-  color: #333;
+  font-size: 32rpx;
   font-weight: bold;
+  color: #333;
   margin-bottom: 20rpx;
-  text-align: center;
 }
 
-.notice-item {
+.notice-info {
   display: flex;
-  font-size: 30rpx;
-  color: #555;
-  margin-bottom: 15rpx;
+  justify-content: space-between;
+  font-size: 24rpx;
+  color: #999;
+  margin-bottom: 20rpx;
+}
+
+.dock-photo {
+  width: 100%;
+  height: 400rpx;
+  border-radius: 8rpx;
+  margin-bottom: 20rpx;
+}
+
+.notice-content {
+  font-size: 28rpx;
+  color: #666;
   line-height: 1.6;
+  margin-bottom: 30rpx;
+  text-align: justify;
 }
 
-.notice-item .label {
-  width: 180rpx;
-  color: #888;
-  margin-right: 10rpx;
+.contact-section {
+  margin-bottom: 20rpx;
 }
 
-.notice-item .value {
-  flex: 1;
+.contact-info {
+  font-size: 28rpx;
   color: #333;
+  margin-bottom: 20rpx;
+  display: block;
 }
 
-/* 如果对象为空 */
-.container > .empty-text {
-  display: block;
-  text-align: center;
-  color: #999;
-  font-size: 30rpx;
-  padding-top: 200rpx;
+.contact-btn {
+  background-color: #1aad19;
+  color: #fff;
+  font-size: 28rpx;
+  margin-bottom: 20rpx;
 }
+
+.share-btn {
+  background-color: #576b95;
+  color: #fff;
+  font-size: 28rpx;
+}
+
+.contact-btn::after,
+.share-btn::after {
+  border: none;
+}

+ 31 - 28
miniprogram/pages/shipyard/sharePage/sharePage.js

@@ -9,14 +9,27 @@ Page({
   data: {
     sharedTrainingNotice: null, // 用于存储分享的培训通知信息
   },
+  makePhoneCall: function (e) {
+    const phoneNumber = e.currentTarget.dataset.phone;
+    if (phoneNumber) {
+      wx.makePhoneCall({
+        phoneNumber: phoneNumber,
+      });
+    } else {
+      wx.showToast({
+        title: "电话号码不存在",
+        icon: "none",
+      });
+    }
+  },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-    const noticeId = options.noticeId;
-    if (noticeId) {
-      this.getSharedTrainingNotice(noticeId);
+    const shipyardId = options.shipyardId;
+    if (shipyardId) {
+      this.getSharedTrainingNotice(shipyardId);
     } else {
       wx.showToast({
         title: "无效的分享链接",
@@ -25,35 +38,25 @@ Page({
     }
   },
 
-  getSharedTrainingNotice(noticeId) {
-    // 调用API获取分享的培训通知信息
-    // API: POST /crew/school/training/notice/share
-    // 参数: noticeId (query)
+  async getSharedTrainingNotice(shipyardId) {
     wx.showLoading({
       title: "加载中...",
     });
-    postApi("/crew/school/training/notice/share", { noticeId })
-      .then((res) => {
-        wx.hideLoading();
-        if (res.success && res.data) {
-          this.setData({
-            sharedTrainingNotice: res.data,
-          });
-        } else {
-          wx.showToast({
-            title: res.msg || "获取培训通知失败",
-            icon: "none",
-          });
-        }
-      })
-      .catch((err) => {
-        wx.hideLoading();
-        wx.showToast({
-          title: "网络错误",
-          icon: "none",
-        });
-        console.error("获取分享培训通知信息失败:", err);
+    let { data } = await postApi("/shipyard/info/share", {
+      shipyardId,
+    });
+
+    wx.hideLoading();
+    if (data.status === 0) {
+      this.setData({
+        sharedTrainingNotice: data.result,
       });
+    } else {
+      wx.showToast({
+        title: data.msg || "获取通知信息失败",
+        icon: "none",
+      });
+    }
   },
 
   /**

+ 50 - 23
miniprogram/pages/shipyard/sharePage/sharePage.wxml

@@ -1,25 +1,52 @@
-<!-- pages/shipyard/sharePage/sharePage.wxml -->
 <view class="container">
-    <block wx:if="{{sharedTrainingNotice}}">
-        <view class="notice-card">
-            <view class="notice-title">{{sharedTrainingNotice.title || '培训通知'}}</view>
-            <view class="notice-item">
-                <text class="label">学校名称:</text>
-                <text class="value">{{sharedTrainingNotice.schoolName || '暂无'}}</text>
-            </view>
-            <view class="notice-item">
-                <text class="label">培训内容:</text>
-                <text class="value">{{sharedTrainingNotice.content || '暂无内容'}}</text>
-            </view>
-            <view class="notice-item">
-                <text class="label">发布日期:</text>
-                <text class="value">{{sharedTrainingNotice.publishDate || 'N/A'}}</text>
-            </view>
-            <!-- 根据实际返回的对象字段进行调整 -->
-            <!-- 例如: sharedTrainingNotice.trainingCourse, sharedTrainingNotice.startDate 等 -->
+  <!-- 顶部标题 -->
+  <view class="header">船厂服务</view>
+  <!-- 内容区域 -->
+  <view class="content" wx:if="{{sharedTrainingNotice.id}}">
+    <view class="card">
+      <!-- 船厂基本信息 -->
+      <view class="card-header">{{sharedTrainingNotice.shipyardName}}</view>
+      <view class="card-content">
+        <view class="shipyard-info">
+          <image class="shipyard-photo" mode="aspectFill" src="{{sharedTrainingNotice.shipyardImageUrl}}"></image>
+          <view class="info-item">
+            <text class="label">地址:</text>
+            <text class="value">{{sharedTrainingNotice.shipyardAddress}}</text>
+          </view>
+          <view class="info-item">
+            <text class="intro-text">{{sharedTrainingNotice.shipyardIntroduce}}</text>
+          </view>
         </view>
-    </block>
-    <block wx:else>
-        <text class="empty-text">暂无分享的培训通知信息</text>
-    </block>
-</view>
+      </view>
+      <!-- 运营数据 -->
+      <view class="card-header">运营数据</view>
+      <view class="card-content">
+        <view class="operation-data">
+          <view class="data-item">
+            <text class="data-value">{{sharedTrainingNotice.shipyardDockNum}}</text>
+            <text class="data-label">船坞数量</text>
+          </view>
+          <view class="data-item">
+            <text class="data-value">{{sharedTrainingNotice.shipyardAnnualProdCapacity}}</text>
+            <text class="data-label">年产能</text>
+          </view>
+        </view>
+      </view>
+      <!-- 联系方式 -->
+      <view class="card-header">联系方式</view>
+      <view class="card-content">
+        <view class="contact-info">
+          <text class="contact-text">拆船、造船、补贴申请请联系{{sharedTrainingNotice.contactName}}</text>
+          <button class="contact-btn" bindtap="makePhoneCall" data-phone="{{sharedTrainingNotice.contactPhone}}" data-id="{{sharedTrainingNotice.id}}">
+            拨打电话
+          </button>
+        </view>
+      </view>
+      <!-- <button class="share-btn" open-type="share" data-title="{{sharedTrainingNotice.shipyardName}}">
+        分享船厂
+      </button> -->
+    </view>
+  </view>
+  <view class="tac fs28 c7 p40" wx:else>暂无数据</view>
+</view>
+<view class="h200"></view>

+ 106 - 28
miniprogram/pages/shipyard/sharePage/sharePage.wxss

@@ -1,52 +1,130 @@
-/* pages/shipyard/sharePage/sharePage.wxss */
 .container {
   padding: 20rpx;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
-    Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-  min-height: 100vh;
-  background-color: #f4f4f4;
+  background-color: #f5f5f5;
 }
 
-.notice-card {
+.header {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #333;
+  padding: 20rpx 0;
+  text-align: center;
+}
+
+.content {
+  margin-top: 20rpx;
+}
+
+.card {
   background-color: #fff;
-  border-radius: 10rpx;
-  padding: 30rpx 20rpx;
+  border-radius: 16rpx;
   margin-bottom: 20rpx;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+  overflow: hidden;
 }
 
-.notice-title {
-  font-size: 36rpx;
-  color: #333;
+.card-header {
+  font-size: 32rpx;
   font-weight: bold;
+  color: #333;
+  padding: 20rpx;
+  padding-left: 30rpx;
+  border-bottom: 2rpx solid #f0f0f0;
+}
+
+.card-content {
+  padding: 20rpx;
+}
+
+/* 船厂信息样式 */
+.shipyard-info {
+  margin-top: 10rpx;
+}
+
+.shipyard-photo {
+  width: 100%;
+  height: 400rpx;
+  border-radius: 8rpx;
   margin-bottom: 20rpx;
-  text-align: center;
 }
 
-.notice-item {
-  display: flex;
-  font-size: 30rpx;
-  color: #555;
-  margin-bottom: 15rpx;
-  line-height: 1.6;
+.info-item {
+  margin-bottom: 16rpx;
 }
 
-.notice-item .label {
-  width: 180rpx; /* 根据实际标签长度调整 */
-  color: #888;
+.label {
+  color: #666;
+  font-size: 28rpx;
   margin-right: 10rpx;
 }
 
-.notice-item .value {
-  flex: 1;
+.value {
+  color: #333;
+  font-size: 28rpx;
+}
+
+.intro-text {
   color: #333;
+  font-size: 28rpx;
+  line-height: 1.6;
 }
 
-/* 如果对象为空 */
-.container > .empty-text {
+/* 运营数据样式 */
+.operation-data {
+  display: flex;
+  justify-content: space-around;
+  padding: 20rpx 0;
+}
+
+.data-item {
+  text-align: center;
+}
+
+.data-value {
+  font-size: 40rpx;
+  font-weight: bold;
+  color: #333;
   display: block;
+  margin-bottom: 10rpx;
+}
+
+.data-label {
+  font-size: 24rpx;
+  color: #666;
+}
+
+/* 联系方式样式 */
+.contact-info {
   text-align: center;
-  color: #999;
+}
+
+.share-btn {
+  width: 90%;
+  margin: 20rpx auto;
+  background-color: #f8f8f8;
+  color: #333;
+  border: 1rpx solid #ddd;
+  border-radius: 8rpx;
+  font-size: 28rpx;
+}
+
+.contact-text {
+  font-size: 28rpx;
+  color: #333;
+  margin-bottom: 20rpx;
+  display: block;
+}
+
+.contact-btn {
+  background-color: #1aad19;
+  color: #fff;
   font-size: 30rpx;
-  padding-top: 200rpx;
+  padding: 16rpx 32rpx;
+  border-radius: 8rpx;
+  border: none;
+  margin-top: 20rpx;
 }
+
+.contact-btn:active {
+  opacity: 0.8;
+}

+ 1 - 17
miniprogram/pages/shipyard/shipyard.js

@@ -5,23 +5,7 @@ Page({
    * 页面的初始数据
    */
   data: {
-    shipyardList: [
-      {
-        id: 3,
-        shipyardName: "测试船厂",
-        shipyardImgFileKey:
-          "new/shipyard/895a0951-c84e-41c3-990a-948271c926891746495962026.png",
-        shipyardImageUrl:
-          "https://hhd-shipping-1255802371.cos.ap-shanghai.myqcloud.com/new/shipyard/895a0951-c84e-41c3-990a-948271c926891746495962026.png?sign=q-sign-algorithm%3Dsha1%26q-ak%3DAKID4xb091cy4tRikV0EBrGOGsCF1WkhMlum%26q-sign-time%3D1746495978%3B93158697600%26q-key-time%3D1746495978%3B93158697600%26q-header-list%3Dhost%26q-url-param-list%3D%26q-signature%3D3523ba70be8a436daab400f5c865c0cf4a49fe5a",
-        shipyardAddress: "张家港",
-        shipyardIntroduce: "测试测试",
-        shipyardDockNum: 2,
-        shipyardAnnualProdCapacity: 2,
-        contactName: "测试人",
-        contactPhone: "122222222222",
-        createTime: "2025/05/06 09:46:18",
-      },
-    ],
+    shipyardList: [],
   },
 
   /**

+ 14 - 0
project.private.config.json

@@ -2,6 +2,20 @@
   "condition": {
     "miniprogram": {
       "list": [
+        {
+          "name": "pages/school/sharePage/sharePage",
+          "pathName": "pages/school/sharePage/sharePage",
+          "query": "noticeId=1",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "pages/shipyard/sharePage/sharePage",
+          "pathName": "pages/shipyard/sharePage/sharePage",
+          "query": "shipyardId=3",
+          "launchMode": "default",
+          "scene": null
+        },
         {
           "name": "pages/securityCheck/sharePage/sharePage",
           "pathName": "pages/securityCheck/sharePage/sharePage",