页面问题处理、新增消息通知

app.js

@@ -1,8 +1,8 @@
 // app.js
 const utils = require('/utils/util.js')
-// const baseIp= "http://localhost:9747"
+const baseIp= "http://localhost:9747"
 // const baseIp= "http://61.177.40.178:8000/zhsw"
-const baseIp = "http://192.168.0.215:9000/zhsw"  // 根据实际情况调整端口号
+// const baseIp = "http://192.168.0.215:9000/zhsw"  // 根据实际情况调整端口号
 // 图片预览地址
 
 App({
@@ -107,6 +107,8 @@ App({
       mineRepair: baseIp+  '/wechat/mine/repair',//报修登记
       mineFeedback: baseIp+  '/wechat/mine/feedback',//投诉建议
       paymentList: baseIp+  '/wechat/payment/record',//缴费记录信息
+      updateRadstateStatus: baseIp+  '/wechat/account/readStatus',//修改已读状态
+      updateRadstateStatusAll: baseIp+  '/wechat/account/readStatusAll',//全部消息已读
     },
     // 微信静态文件预览方式 使用二开服务的使用次方法
     weChatImgPreviewUrl: "http://192.168.0.215:8020/wechat/",

app.wxss

@@ -3,6 +3,7 @@
 page {
   background-color: #f5f5f5;
   box-sizing: border-box;
+  font-family: "PingFang SC", "H/。，elvetica Neue", "Microsoft YaHei", sans-serif;
 }
 
 .container {

pages/FirstBangDing/FirstBangDing.wxss

@@ -42,9 +42,9 @@
 .welcome-card {
   position: absolute;
   left: 4%;
-  top: 300rpx;
+  top: 250rpx;
   width: 92%;
-  height: 420rpx;
+  height: 370rpx;
   opacity: 1;
   background-color: #fff;
   border-radius: 16rpx;

pages/baoxiuList/baoxiuList.wxss

@@ -21,9 +21,12 @@
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 115rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .nav-title {

pages/baoxiudj/baoxiudj.wxss

@@ -21,9 +21,12 @@
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 115rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .nav-title {

pages/homepage/homepage.js

@@ -43,7 +43,7 @@ Page({
       },
       {
         icon: '/static_file/tzgg.png',
-        text: '通知公告',
+        text: '消息通知',
         url: '/pages/tongzhiList/tongzhiList'
       },
       {
@@ -65,7 +65,8 @@ Page({
       subtitle: '预留入口',
       imageUrl: '/static_file/background.png'
     },
-    currentAccountInfo: {}
+    currentAccountInfo: {},
+    unreadCount: 0
   },
 
   onLoad() {
@@ -89,6 +90,7 @@ Page({
           '!SAAS_LOGIN_TOKEN_!':app.globalData.currentAccountInfo.dsKey
         },
         success (res) {
+          debugger
           wx.hideLoading();
           let apiReturnData=res.data;
           apiReturnData.data.swNotificationAnnouncementDos.forEach(data=>{
@@ -96,16 +98,29 @@ Page({
           })
           // 所有的通知公告
           app.globalData.notices= apiReturnData.data.swNotificationAnnouncementDos;
+          // 该用户所有的消息通知
+          app.globalData.userNoticesList = apiReturnData.data.sysNotifyAnnounceUserDos;
           // 需要轮播的公告
           let data= apiReturnData.data.swNotificationAnnouncementDos.filter(data=>{
             return data.homepageslider=='1';
           });
+          if (app.globalData.userNoticesList) {
+            // 假设 userNoticesList 中有一个 isRead 属性表示消息是否已读
+            const unreadCount = app.globalData.userNoticesList.filter(notice => notice.readstate === '2').length;
+            _this.setData({
+              unreadCount: unreadCount
+            });
+          } else {
+            _this.setData({
+              unreadCount: 0
+            });
+          }
 
           _this.setData({
-            billInfo:{
-              totalAmount:apiReturnData.data.duFees,  // 总计应缴
-              waterUsage:apiReturnData.data.waterConsumption,      // 用水量
-              balance: apiReturnData.data.accountbalance   // 账户余额
+            billInfo: {
+              totalAmount: apiReturnData.data.duFees ?? 0,         // 总计应缴
+              waterUsage: apiReturnData.data.waterConsumption ?? 0, // 用水量
+              balance: apiReturnData.data.accountbalance ?? 0      // 账户余额
             },
             userInfo:{
               name: apiReturnData.data.username,
@@ -133,6 +148,17 @@ Page({
       wx.removeStorageSync('needRefreshHomepage');
       this.loadPageData();
     }
+    
+    // 从任何页面返回时都获取最新的未读消息数
+    this.getUnreadNoticeCount();
+    
+    // 检查是否从户号管理页面返回
+    const backFromHuHao = wx.getStorageSync('backFromHuHao');
+    if (backFromHuHao) {
+      wx.removeStorageSync('backFromHuHao');
+      // 从户号管理页面返回时重新加载全部数据
+      this.loadHomepageData();
+    }
   },
 
   loadPageData: function() {
@@ -158,13 +184,14 @@ Page({
       success(res) {
         wx.hideLoading();
         let apiReturnData = res.data;
-
+        // 该用户所有的消息通知
+        app.globalData.userNoticesList = apiReturnData.data.sysNotifyAnnounceUserDos;
         // 更新页面数据
         _this.setData({
           billInfo: {
-            totalAmount: apiReturnData.data.duFees,  // 总计应缴
-            waterUsage: apiReturnData.data.waterConsumption,  // 用水量
-            balance: apiReturnData.data.accountbalance   // 账户余额
+            totalAmount: apiReturnData.data.duFees ?? 0,         // 总计应缴
+            waterUsage: apiReturnData.data.waterConsumption ?? 0, // 用水量
+            balance: apiReturnData.data.accountbalance ?? 0      // 账户余额
           },
           userInfo: {
             name: apiReturnData.data.username,
@@ -403,4 +430,95 @@ Page({
       }
     });
   },
+
+  // 获取未读消息数量的方法
+  getUnreadNoticeCount: function() {
+    if (app.globalData.userNoticesList) {
+      // 假设 userNoticesList 中有一个 isRead 属性表示消息是否已读
+      const unreadCount = app.globalData.userNoticesList.filter(notice => notice.readstate === '2').length;
+      this.setData({
+        unreadCount: unreadCount
+      });
+    } else {
+      this.setData({
+        unreadCount: 0
+      });
+    }
+  },
+
+  // 新增方法：加载主页全部数据（包括消息通知）
+  loadHomepageData: function() {
+    const _this = this;
+    wx.showLoading({
+      title: '加载中...',
+    });
+    
+    if(!app.globalData.userWxInfo.token){
+      wx.hideLoading();
+      return;
+    }
+    
+    wx.request({
+      url: app.globalData.interfaceUrls.homePageInfo + app.globalData.currentAccountInfo.usernumber,
+      method: 'GET',
+      header: {
+        'content-type': 'application/json',
+        'token': app.globalData.userWxInfo.token,
+        'source': "wc",
+        '!SAAS_LOGIN_TOKEN_!': app.globalData.currentAccountInfo.dsKey
+      },
+      success(res) {
+        wx.hideLoading();
+        if (res.data && res.data.data) {
+          let apiReturnData = res.data;
+          
+          // 更新消息通知数据
+          apiReturnData.data.swNotificationAnnouncementDos.forEach(data => {
+            data.publishtime = data.publishtime.slice(0,10);
+          });
+          
+          // 更新全局数据
+          app.globalData.notices = apiReturnData.data.swNotificationAnnouncementDos;
+          app.globalData.userNoticesList = apiReturnData.data.sysNotifyAnnounceUserDos;
+          
+          // 需要轮播的公告
+          let data = apiReturnData.data.swNotificationAnnouncementDos.filter(data => {
+            return data.homepageslider == '1';
+          });
+          
+          // 更新未读消息数
+          _this.getUnreadNoticeCount();
+          
+          // 更新页面数据
+          _this.setData({
+            billInfo: {
+              totalAmount: apiReturnData.data.duFees ?? 0,
+              waterUsage: apiReturnData.data.waterConsumption ?? 0,
+              balance: apiReturnData.data.accountbalance ?? 0
+            },
+            userInfo: {
+              name: apiReturnData.data.username,
+              accountNumber: apiReturnData.data.usernumber,
+              address: apiReturnData.data.address
+            },
+            noticeList: data,
+            isScrolling: true
+          });
+          
+          // 如果有轮播公告，重新开始轮播
+          if(data && data.length > 0) {
+            _this.startNoticeScroll();
+          }
+        }
+      },
+      fail(error) {
+        wx.hideLoading();
+        wx.showToast({
+          title: '数据加载失败',
+          icon: 'none',
+          duration: 2000
+        });
+      }
+    });
+  }
 })

pages/homepage/homepage.wxml

@@ -60,9 +60,6 @@
         </view>
       </view>
 
-      <!-- 充值缴费按钮 -->
-      <button class="pay-btn" bindtap="goToPayment">立即缴费</button>
-
       <!-- 通知轮播区域 -->
       <view class="notice-bar" wx:if="{{noticeList && noticeList.length > 0}}">
         <view class="notice-icon">
@@ -75,6 +72,9 @@
           </view>
         </view>
       </view>
+      
+      <!-- 充值缴费按钮 -->
+      <button class="pay-btn" hover-class="pay-btn-hover" hover-stay-time="100" bindtap="goToPayment">立即缴费</button>
     </view>
   </view>
 
@@ -83,6 +83,7 @@
     <view class="function-grid">
       <view class="function-item" wx:for="{{functionList}}" wx:key="text" bindtap="handleFunctionClick" data-index="{{index}}">
         <image src="{{item.icon}}" mode="aspectFit"></image>
+        <view class="notice-badge {{unreadCount > 99 ? 'notice-badge-large' : ''}}" wx:if="{{item.text === '消息通知' && unreadCount > 0}}">{{unreadCount > 99 ? '99+' : unreadCount}}</view>
         <text>{{item.text}}</text>
       </view>
     </view>

pages/homepage/homepage.wxss

@@ -181,6 +181,7 @@
   flex-direction: column;
   align-items: center;
   margin-bottom: 20rpx;
+  position: relative;
 }
 
 .function-item image {
@@ -198,6 +199,7 @@
   margin: 0rpx 30rpx 0rpx;
   background-color: #ffffff;
   border-radius: 20rpx;
+  margin-top: -30rpx;
   padding: 30rpx;
   box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05);
 }
@@ -395,4 +397,35 @@
   padding: 10px 0;
   color: #666;
   font-size: 14px;
-}
+}
+
+.pay-btn-hover {
+  transform: scale(0.95);
+  opacity: 0.9;
+  background-color: #0080b0; /* 可以使用稍深一点的颜色 */
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+}
+
+/* 消息通知图标的红点样式 */
+.notice-badge {
+  position: absolute;
+  min-width: 32rpx;
+  height: 32rpx;
+  line-height: 32rpx;
+  border-radius: 16rpx;
+  background-color: #ff4d4f;
+  color: white;
+  font-size: 20rpx;
+  text-align: center;
+  box-sizing: border-box;
+  z-index: 99;
+  right: 30rpx;
+  top: -5rpx;
+  padding: 0 6rpx;
+}
+
+/* 针对超过99的情况显示99+ */
+.notice-badge-large {
+  min-width: 48rpx;
+}
+

pages/huhaobangding/huhaobangding.wxml

@@ -69,7 +69,7 @@
   </view>
 
   <view class="submit-btn">
-    <button type="primary" bindtap="confirmBinding">确认绑定</button>
+    <button class="pay-btn" hover-class="pay-btn-hover" hover-stay-time="100" bindtap="confirmBinding">确认绑定</button>
   </view>
 
   <view class="tips">

pages/huhaobangding/huhaobangding.wxss

@@ -25,9 +25,12 @@
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 115rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .nav-title {
@@ -75,15 +78,17 @@
 input {
   flex: 1;
   font-size: 32rpx;
-  color: #333333;
+  font-weight: 400;
+  color: rgba(170, 177, 192, 1);
   padding: 0 20rpx;
   text-align: right;
 }
 
 .placeholder {
-  color: #999999;
+  color: rgba(170, 177, 192, 1);
   text-align: right;
-  font-size: 28rpx;
+  font-size: 32rpx;
+  font-weight: 400;
 }
 
 .placeholdersecond {
@@ -102,7 +107,7 @@ input {
   background-color: #FFFFFF;
   border-radius: 16rpx;
   padding: 0 24rpx;
-  padding-top: 20rpx;
+  padding-top: 10rpx;
   margin-bottom: 30rpx;
   position: relative;
   overflow: visible;
@@ -110,8 +115,9 @@ input {
 
 .section-title {
   font-size: 32rpx;
-  color: #333333;
-  padding: 34rpx 0;
+  font-weight: 400;
+  color: rgba(46, 48, 56, 1);
+  padding: 20rpx 0;
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -135,7 +141,7 @@ input {
   overflow-x: auto;
   white-space: nowrap;
   width: 100%;
-  padding: 20rpx 0;
+  padding: 30rpx 0;
   -webkit-overflow-scrolling: touch;
 }
 
@@ -168,8 +174,7 @@ input {
   left: 0;
   right: 0;
   background-color: #FFFFFF;
-  padding: 20rpx 0;
-  margin-top: 0;
+  padding: 0rpx 12rpx 24rpx 0rpx;
 }
 
 .custom-input {
@@ -206,6 +211,24 @@ input {
   line-height: 88rpx;
 }
 
+.pay-btn-hover {
+  transform: scale(0.95);
+  opacity: 0.9;
+  background-color: #0080b0; 
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+}
+
+.pay-btn {
+  width: 100%;
+  height: 80rpx;
+  line-height: 80rpx;
+  background-color: #0080ff;
+  color: white;
+  font-size: 32rpx;
+  border-radius: 40rpx;
+  margin: 30rpx auto 0;
+}
+
 .tips {
   position: fixed;
   bottom: 100rpx; 
@@ -469,7 +492,7 @@ input {
 }
 
 .picker-confirm {
-  color: #1aad19;
+  color: rgba(46, 130, 255, 1);
 }
 
 .picker-title {

pages/huhaoguanli/huhaoguanli.js

@@ -107,6 +107,8 @@ Page({
               wx.setStorageSync('currentHuHao', otherInfo[0]);
               // 设置一个标记表示需要刷新首页
               wx.setStorageSync('needRefreshHomepage', true);
+              wx.setStorageSync('backFromHuHao', true);
+              wx.navigateBack();
             }
           }
         } else {
@@ -140,7 +142,7 @@ Page({
 
   switchHuHao(e) {
     const huHaoInfo = e.currentTarget.dataset.item;
-
+debugger
     // 更新全局数据
     app.globalData.userWxInfo = {
       ...app.globalData.userWxInfo,

pages/huhaoguanli/huhaoguanli.wxss

@@ -37,9 +37,12 @@
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 115rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .nav-title {
@@ -346,7 +349,7 @@
   left: 0;
   right: 0;
   bottom: 0;
-  border: 6rpx solid #ca188f;
+  border: 6rpx solid #1e6602;
   border-radius: 16rpx;
   pointer-events: none;
   z-index: 10;

pages/jiaofeiList/jiaofeiList.wxss

@@ -31,10 +31,10 @@
 .back-icon {
   position: fixed;
   top: 120rpx;
-  left: 30rpx;
+  left: 25rpx;
   z-index: 999;
-  width: 16px;
-  height: 16px;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 
@@ -47,10 +47,10 @@
 
 .user-info-container {
   position: fixed;
-  top: 200rpx;
+  top: 160rpx;
   left: 0;
   width: 100%;
-  padding: 0 30rpx;
+  padding: 0 0rpx;
   box-sizing: border-box;
   z-index: 10;
 }
@@ -58,7 +58,7 @@
 .user-info {
   background-color: transparent;
   color: white;
-  padding: 20rpx 20rpx;
+  padding: 24rpx 36rpx;
   width: 100%;
 }
 
@@ -71,14 +71,15 @@
 .user-id, .user-address {
   display: flex;
   align-items: center;
-  font-size: 28rpx;
+  font-size: 30rpx;
+  font-weight: 400;
   margin-bottom: 10rpx;
-  color: rgba(255, 255, 255, 0.9);
+  color: rgba(255, 255, 255, 1);
 }
 
 .id-icon, .address-icon {
-  width: 30rpx;
-  height: 30rpx;
+  width: 40rpx;
+  height: 40rpx;
   margin-right: 10rpx;
 }
 
@@ -116,17 +117,16 @@
 /* 修改搜索容器样式 */
 .search-container {
   position: fixed;
-  top: 395rpx; /* 调整位置到用户信息下方 */
+  top: 360rpx; /* 调整位置到用户信息下方 */
   left: 0;
-  width: 37%;
-  padding: 0 30rpx;
+  padding: 12rpx 24rpx 0rpx 24rpx;
   box-sizing: border-box;
   z-index: 20; /* 确保在背景之上 */
 }
 
 /* 修改搜索按钮样式 */
 .search-button {
-  padding: 15rpx 30rpx;
+  padding: 15rpx 20rpx;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -149,7 +149,7 @@
 /* 调整账单列表容器位置 */
 .bill-list-wrapper {
   position: fixed;
-  top: 480rpx; /* 调整位置，为搜索按钮留出空间 */
+  top: 450rpx; /* 调整位置，为搜索按钮留出空间 */
   left: 0;
   width: 100%;
   height: calc(100vh - 450rpx);
@@ -161,9 +161,8 @@
 .bill-list {
   width: 100%;
   height: 100%;
-  padding: 0 30rpx;
+  padding: 0 24rpx;
   box-sizing: border-box;
-  margin-top: 0;
   padding-bottom: 50rpx;
 }
 

pages/jiaofeixiangqing/jiaofeixiangqing.wxss

@@ -21,11 +21,11 @@
 /* 固定返回按钮样式 */
 .back-icon {
   position: fixed;
-  top: 100rpx;
-  left: 30rpx;
+  top: 120rpx;
+  left: 25rpx;
   z-index: 999;
-  width: 16px;
-  height: 16px;
+  width: 40rpx;
+  height: 40rpx;
 }
 .nav-title {
   flex: 1;
@@ -41,7 +41,7 @@
   left: 0;
   right: 0;
   z-index: 999;
-  padding: 20rpx;
+  padding: 24rpx 24rpx 0rpx 24rpx;
   background-color: #f6f7f9;
 }
 
@@ -100,12 +100,12 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 5rpx 10rpx;
+  padding: 0rpx 24rpx 0rpx 24rpx;
   margin: 10rpx 0;
 }
 
 .bill-list-title {
-  font-size: 30rpx;
+  font-size: 32rpx;
   font-weight: 500;
   color: #333;
 }
@@ -120,15 +120,16 @@
 
 /* 创建一个滚动内容区域，但考虑顶部固定区域的高度 */
 .scrollable-content {
-  margin-top: 460rpx;
-  padding: 0 20rpx;
+  margin-top: 400rpx;
+  padding: 0 24rpx;
 }
 
 /* 账单列表容器 */
 .bill-list-container {
   height: calc(100vh - 800rpx);
   padding-bottom: 60rpx;
-  padding: 300rpx 0rpx 0rpx 0rpx  ;
+  padding: 310rpx 0rpx 0rpx 0rpx;
+  z-index: 999;
 }
 
 /* 底部空间 */
@@ -180,7 +181,8 @@
 /* 支付状态标签 */
 .payment-status-tag {
   font-size: 22rpx;
-  padding: 4rpx 16rpx;
+  width: 90rpx;
+  padding: 4rpx 24rpx;
   border-radius: 20rpx;
 }
 

pages/lijijiaofei/lijijiaofei.wxml

@@ -1,5 +1,7 @@
 <view class="container">
-  <view class="fixed-back" bindtap="goBack">←</view>
+  <view bindtap="goBack">
+      <image src="/static_file/backcion.png" mode="aspectFit" class="back-icon"></image>
+    </view>
   <!-- 顶部导航以及背景 -->
   <view class="header">
     <image class="background" src="{{images.background}}" mode="widthFix" />

pages/lijijiaofei/lijijiaofei.wxss

@@ -25,17 +25,12 @@
 }
 
 .back-icon {
-  position: absolute;
+  position: fixed;
+  top: 100rpx;
   left: 30rpx;
-  top: 120rpx;
-  font-size: 40rpx;
-  color: white;
-  z-index: 10;
-  width: 60rpx;
-  height: 60rpx;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .header-title {
@@ -48,8 +43,8 @@
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
-  padding: 0rpx 30rpx;
-  top: -180rpx;
+  padding: 0rpx 24rpx;
+  top: -200rpx;
   width: 100%;
   box-sizing: border-box;
 }
@@ -115,7 +110,7 @@
   margin:  -10rpx 30rpx 0 30rpx;
   border-radius: 120rpx;
   padding: 0;
-  top: -180rpx;
+  top: -200rpx;
   box-shadow: none;
   width: calc(100% - 70rpx);
   box-sizing: border-box;
@@ -278,7 +273,7 @@
   font-size: 24rpx;
   color: #999;
   padding: 20rpx 30rpx;
-  top: -180rpx;
+  top: -200rpx;
   text-align: left;
   border-top: none;
   position: relative;
@@ -384,21 +379,6 @@ tips-content {
   border: 2rpx solid rgba(46, 125, 253, 1);
   color: rgba(46, 125, 253, 1);
 }
-
-/* 固定返回按钮样式 */
-.fixed-back {
-  position: fixed;
-  top: 50rpx;
-  left: 30rpx;
-  z-index: 999;
-  border-radius: 50%;
-  width: 50rpx;
-  height: 200rpx;
-  display: flex;
-  align-items: center;
-  color: rgba(255, 255, 255, 1);
-}
-
 .scrollable-content {
   height: 100%;
   width: 100%;

pages/tongzhiList/tongzhiList.js

@@ -1,49 +1,154 @@
 // 通知列表页面的JS文件
 const app = getApp();
-const utils = require('../../utils/util.js')
 Page({
   /**
    * 页面的初始数据
    */
   data: {
-    noticeList: [
-    ]
+    activeTab: 0, // 当前选中的tab，0为公告，1为消息
+    noticeList: [],
+    userNoticesList: [],
+    unreadCount: 0 // 未读消息数量
   },
 
   onLoad: function (options) {
-    debugger
-  
+    // 直接从全局数据获取通知列表
+    this.setData({
+      noticeList: app.globalData.notices || [],
+      userNoticesList: app.globalData.userNoticesList || []
+
+    });
+    
+    // 计算未读消息数量
+    this.countUnreadMessages();
+  },
+
+  /**
+   * 计算未读消息数量
+   */
+  countUnreadMessages: function() {
+    const unreadCount = this.data.userNoticesList.filter(item => item.readstate === '2').length;
+    this.setData({
+      unreadCount: unreadCount
+    });
+  },
+
+  /**
+   * 切换Tab
+   */
+  switchTab: function(e) {
+    const index = parseInt(e.currentTarget.dataset.index);
     this.setData({
-      noticeList:app.globalData.notices
+      activeTab: index
     });
+    
+    // 重新从全局数据获取最新数据
+    if (index === 0) {
+      this.setData({
+        noticeList: app.globalData.notices || []
+      });
+    } else if (index === 1) {
+      this.setData({
+        userNoticesList: app.globalData.userNoticesList || []
+      });
+      this.countUnreadMessages();
+    }
   },
 
+  /**
+   * 一键已读
+   */
+  markAllAsRead: function(e) {
+    wx.request({
+      url: app.globalData.interfaceUrls.updateRadstateStatusAll,
+      method: 'POST',
+      data: {
+        account: app.globalData.currentAccountInfo.usernumber,
+        deKey: app.globalData.currentAccountInfo.dsKey,
+      },
+      header: {
+        'content-type': 'application/json',
+        'token': app.globalData.userWxInfo.token,
+        'source': "wc",
+        '!SAAS_LOGIN_TOKEN_!': app.globalData.currentAccountInfo.dsKey
+      },
+      success: (res) => {
+        if (res.data.code == '200') {
+          // 更新本地数据
+          const updatedList = this.data.userNoticesList.map(item => {
+            return {...item, readstate: '1'};
+          });
 
-  // getNoticeList: function() {
-  //   wx.request({
-  //     url: 'API地址/notice/list', 
-  //     success: (res) => {
-  //       if (res.data && res.data.code === 200) {
-  //         this.setData({
-  //           noticeList: res.data.data
-  //         });
-  //       }
-  //     },
-  //     fail: () => {
-  //       // 网络请求失败时使用默认数据
-  //       console.log('获取通知列表失败，使用默认数据');
-  //     }
-  //   });
-  // },
+          // 更新全局数据和页面数据
+          app.globalData.userNoticesList = updatedList;
+          this.setData({
+            userNoticesList: updatedList,
+            unreadCount: 0
+          });
+          
+          // 更新未读消息数量
+          this.countUnreadMessages();
+          
+          // 提示操作成功
+          wx.showToast({
+            title: '操作成功',
+            icon: 'success',
+            duration: 1500
+          });
+          
+          // 通知首页刷新未读消息状态
+          if (typeof app.globalData.refreshUnreadStatus === 'function') {
+            app.globalData.refreshUnreadStatus();
+          }
+        } else {
+          wx.showToast({
+            title: res.data.msg || '操作失败',
+            icon: 'none',
+            duration: 1500
+          });
+        }
+      },
+      fail: (err) => {
+        console.error('更新消息状态失败:', err);
+        wx.showToast({
+          title: '网络异常，请稍后重试',
+          icon: 'none',
+          duration: 1500
+        });
+      }
+    });
+  },
+  
+  /**
+   * 刷新消息列表
+   */
+  refreshMessageList: function() {
+    // 从全局数据刷新
+    this.setData({
+      noticeList: app.globalData.notices || [],
+      userNoticesList: app.globalData.userNoticesList || []
+    });
+    
+    // 刷新完成后重新计算未读消息数
+    this.countUnreadMessages();
+  },
 
   /**
    * 跳转到通知详情页
    */
   goToDetail: function (e) {
     const id = e.currentTarget.dataset.id;
-    const notice = this.data.noticeList.find(item => item.id === id);
+    const tabIndex = this.data.activeTab; // 获取当前所在Tab
+    const notice = tabIndex === 0 
+      ? this.data.noticeList.find(item => item.id === id)
+      : this.data.userNoticesList.find(item => item.id === id);
     
     if (notice) {
+      // 如果是消息类型且是未读状态，调用后台方法更新已读状态
+      if (tabIndex === 1 && notice.readstate === '2') {
+        this.updateReadStatus(id);
+      }
+      
       // 将通知数据转换为JSON字符串
       const noticeStr = JSON.stringify(notice);
       // 跳转到详情页并传递完整数据
@@ -58,10 +163,115 @@ Page({
     }
   },
 
+  /**
+   * 更新消息的已读状态
+   */
+  updateReadStatus: function(id) {
+    wx.request({
+      url: app.globalData.interfaceUrls.updateRadstateStatus,
+      method: 'POST',
+      data: {
+        id: id,
+        account: app.globalData.currentAccountInfo.usernumber,
+        deKey: app.globalData.currentAccountInfo.dsKey,
+      },
+      header: {
+        'content-type': 'application/json',
+        'token': app.globalData.userWxInfo.token,
+        'source': "wc",
+        '!SAAS_LOGIN_TOKEN_!': app.globalData.currentAccountInfo.dsKey
+      },
+      success: (res) => {
+        debugger
+        if (res.data.code == '200') {
+          // 更新本地数据
+          const updatedList = this.data.userNoticesList.map(item => {
+            if (item.id === id) {
+              return {...item, readstate: '1'};
+            }
+            return item;
+          });
+          // 更新全局数据和页面数据
+          app.globalData.userNoticesList = updatedList;
+          this.setData({
+            userNoticesList: updatedList
+          });
+          // 更新未读消息数量
+          this.countUnreadMessages();
+        }
+      },
+      fail: (err) => {
+        console.error('更新消息状态失败:', err);
+      }
+    });
+  },
+
+  /**
+   * 获取最新消息数据
+   */
+  fetchLatestMessages: function() {
+    wx.showLoading({
+      title: '加载中...',
+    });
+    
+    // 调用获取公告列表API
+    wx.request({
+      url: app.globalData.apiUrl + '/api/getNotices', // 根据你的实际API地址调整
+      method: 'GET',
+      success: (res) => {
+        if (res.data.success) {
+          // 更新全局数据和页面数据
+          app.globalData.notices = res.data.data.notices || [];
+          this.setData({
+            noticeList: app.globalData.notices
+          });
+        }
+      },
+      complete: () => {
+        // 无论成功失败都继续获取用户消息
+        this.fetchUserMessages();
+      }
+    });
+  },
+
+  /**
+   * 获取用户消息
+   */
+  fetchUserMessages: function() {
+    wx.request({
+      url: app.globalData.apiUrl + '/api/getUserMessages', // 根据你的实际API地址调整
+      method: 'GET',
+      data: {
+        userId: app.globalData.userId // 假设全局有用户ID
+      },
+      success: (res) => {
+        if (res.data.success) {
+          // 更新全局数据和页面数据
+          app.globalData.userNoticesList = res.data.data.messages || [];
+          this.setData({
+            userNoticesList: app.globalData.userNoticesList
+          });
+          
+          // 更新未读消息数量
+          this.countUnreadMessages();
+        }
+      },
+      complete: () => {
+        wx.hideLoading();
+      }
+    });
+  },
+
   /**
    * 返回上一页
    */
   goBack: function() {
     wx.navigateBack();
   },
+  
+  // 页面显示时刷新数据
+  onShow: function() {
+    // 获取最新消息数据而不是从全局获取
+    this.fetchLatestMessages();
+  }
 })

pages/tongzhiList/tongzhiList.wxml

@@ -7,13 +7,30 @@
     <view bindtap="goBack">
       <image src="/static_file/backcion.png" mode="aspectFit" class="back-icon"></image>
     </view>
-    <view class="nav-title">通知公告</view>
+    <!-- <view class="nav-title">消息通知</view> -->
   </view>
-  <scroll-view scroll-y="true" class="notice-list">
+
+  <!-- 添加Tab页切换 -->
+  <view class="tab-container">
+    <view class="tab-item {{activeTab === 0 ? 'active' : ''}}" bindtap="switchTab" data-index="0">
+      <text class="tab-text">通知</text>
+    </view>
+    <view class="tab-divider"></view>
+    <view class="tab-item {{activeTab === 1 ? 'active' : ''}}" bindtap="switchTab" data-index="1">
+      <text class="tab-text">消息</text>
+      <view class="tab-right">
+        <view class="unread-badge" wx:if="{{unreadCount > 0}}">{{unreadCount > 99 ? '99+' : unreadCount}}</view>
+        <image class="clean-icon" src="/static_file/yjyd.png" catchtap="markAllAsRead"></image>
+      </view>
+    </view>
+  </view>
+
+  <!-- 公告列表 -->
+  <view class="notice-list" wx:if="{{activeTab === 0}}">
     <block wx:for="{{noticeList}}" wx:key="id">
       <view class="notice-item" bindtap="goToDetail" data-id="{{item.id}}">
         <view class="notice-left">
-          <image class="notice-icon" src="{{item.type === 'payment' ? '/static_file/horn_icon.png' : '/static_file/water_drop_icon.png'}}" mode="aspectFit"></image>
+          <image class="notice-icon" src="{{item.type === 'payment' ? '/static_file/speaker.png' : '/static_file/speaker.png'}}" mode="aspectFit"></image>
         </view>
         <view class="notice-content">
           <view class="notice-title">{{item.noticetitle}}</view>
@@ -24,10 +41,22 @@
         <view class="notice-date">{{item.publishtime}}</view>
       </view>
     </block>
-    
-    <!-- 只显示近3个月记录提示放在滚动区域内的最后 -->
-    <!-- <view class="notice-footer">
-      只显示近3个月记录
-    </view> -->
-  </scroll-view>
+    <view wx:if="{{noticeList.length === 0}}" class="empty-tip">暂无公告</view>
+  </view>
+
+  <!-- 消息列表 -->
+  <view class="notice-list" wx:if="{{activeTab === 1}}">
+    <view class="notice-item" wx:for="{{userNoticesList}}" wx:key="id" bindtap="goToDetail" data-id="{{item.id}}">
+      <view class="notice-left">
+        <image class="notice-icon" src="{{item.iconUrl || '/static_file/water_drop_icon.png'}}" mode="aspectFit"></image>
+        <view class="unread-dot" wx:if="{{item.readstate === '2'}}"></view>
+      </view>
+      <view class="notice-content">
+        <view class="notice-title">{{item.title}}</view>
+        <view class="notice-desc">{{item.roption}}</view>
+      </view>
+      <view class="notice-date">{{item.createdate}}</view>
+    </view>
+    <view wx:if="{{userNoticesList.length === 0}}" class="empty-tip">暂无消息</view>
+  </view>
 </view>

pages/tongzhiList/tongzhiList.wxss

@@ -21,23 +21,25 @@
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 130rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
-
+/* 
 .nav-title {
   flex: 1;
   text-align: center;
   font-size: 34rpx;
   color: #fff;
-}
+} */
 
 .notice-list {
   flex: 1;
-  padding: 20rpx 40rpx;
-  border-radius: 32px;
-  padding-top: 190rpx;
+  padding: 12rpx;
+  margin-top: 6rpx;
 }
 
 .notice-item {
@@ -51,39 +53,50 @@
   width: 90%;
   margin-left: auto;
   margin-right: auto;
+  max-height: 200rpx;
+  overflow: hidden;
 }
 
 .notice-left {
+  position: relative;
   margin-right: 20rpx;
 }
 
 .notice-icon {
-  width: 80rpx;
-  height: 80rpx;
+  width: 60rpx;
+  height: 60rpx;
+  padding: 30rpx 0 30rpx 0;
 }
 
 .notice-content {
   flex: 1;
   overflow: hidden;
   padding-right: 80rpx;
+  display: flex;
+  flex-direction: column;
+  max-height: 200rpx;
 }
 
 .notice-title {
-  font-size: 32rpx;
+  font-size: 32rpx !important;
   font-weight: 500;
   margin-bottom: 10rpx;
-  color: #333;
+  color: rgba(46, 48, 56, 1);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .notice-desc {
-  font-size: 28rpx;
-  color: #666;
+  font-size: 30rpx !important;
+  color: rgba(104, 108, 128, 1);
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   line-height: 1.4;
+  max-height: 84rpx;
 }
 
 .notice-date {
@@ -101,3 +114,119 @@
   padding: 20rpx 0;
   margin-bottom: 20rpx;
 }
+
+/* 添加Tab样式 */
+.tab-container {
+  display: flex;
+  width: 100%;
+  margin-top: 175rpx;
+  justify-content: space-around;
+  align-items: center;
+  border-bottom: 1rpx solid #eee;
+  background-color: rgba(46, 130, 255, 1);
+}
+
+.tab-item {
+  position: relative;
+  flex: 1;
+  height: 80rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 0 20rpx;
+}
+
+.tab-text {
+  text-align: center;
+  font-size: 32rpx;
+  font-weight: 400;
+  color: white;
+}
+
+.tab-right {
+  position: absolute;
+  right: 20rpx;
+  display: flex;
+  align-items: center;
+}
+
+.unread-badge {
+  position: absolute;
+  right: 80rpx;
+  top: -7rpx;
+  min-width: 32rpx;
+  height: 32rpx;
+  background: #ff4d4f;
+  color: white;
+  border-radius: 16rpx;
+  font-size: 20rpx;
+  text-align: center;
+  line-height: 32rpx;
+  padding: 0 6rpx;
+}
+
+.clean-icon {
+  width: 36rpx;
+  height: 36rpx;
+  margin-left: 15rpx;
+  background-color: rgba(46, 130, 255, 0.15);
+  border-radius: 50%;
+  padding: 10rpx;
+  box-sizing: content-box;
+  box-shadow: 0 0 8rpx rgba(0, 0, 0, 0.1);
+  transition: all 0.3s ease;
+}
+
+.clean-icon:active {
+  transform: scale(1.1);
+  background-color: rgba(46, 130, 255, 0.25);
+}
+
+.tab-item.active {
+  color: #1890ff;
+  border-bottom: 4rpx solid #220af7;
+}
+
+/* 未读消息红点 */
+.unread-dot {
+  position: absolute;
+  top: 25rpx;
+  right: 0rpx;
+  width: 16rpx;
+  height: 16rpx;
+  background-color: #ff4d4f;
+  border-radius: 50%;
+}
+
+.notice-content {
+  flex: 1;
+}
+
+.notice-time {
+  font-size: 24rpx;
+  color: #999;
+  margin-bottom: 10rpx;
+}
+
+.notice-desc {
+  font-size: 28rpx;
+  color: #666;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+}
+
+.empty-tip {
+  text-align: center;
+  padding: 100rpx 0;
+  color: #999;
+  font-size: 28rpx;
+}
+
+.tab-divider {
+  width: 2rpx;
+  height: 40rpx;
+  background-color: rgba(247, 248, 249, 1);
+  margin: 0 10rpx;
+}

pages/tousujianyi/tousujianyi.wxss

@@ -17,13 +17,16 @@
   right: 0;
   z-index: 1000;
   padding: 0 20rpx;
-  padding-top: 44px; /* 适配iPhone状态栏 */
+  padding-top: 88rpx; 
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 115rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .nav-title {

pages/tousujianyiList/tousujianyiList.wxss

@@ -21,9 +21,12 @@
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 115rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .nav-title {

pages/tzxq/tzxq.js

@@ -8,10 +8,25 @@ Page({
 
   onLoad: function (options) {
     const app = getApp();
-    // 如果传入了完整的通知数据，则直接使用
     if (options.noticeData) {
+      const parsedNotice = JSON.parse(decodeURIComponent(options.noticeData));
+      
+      // 确保数据格式正确，映射字段到正确的显示名称
+      const processedNotice = {
+        ...parsedNotice,
+        title: parsedNotice.title || parsedNotice.noticetitle || '',
+        content: parsedNotice.roption || parsedNotice.noticecontent || ''
+      };
+      
+      // 替换可能存在的占位符
+      // if (processedNotice.content) {
+        // const userInfo = app.globalData.userInfo || {};
+        // processedNotice.content = processedNotice.content
+        //   .replace(/\[用户姓名\]/g, userInfo.name || '用户');
+      // }
+      
       this.setData({
-        noticeDetail: JSON.parse(decodeURIComponent(options.noticeData))
+        noticeDetail: processedNotice
       });
       return;
     }
@@ -19,6 +34,7 @@ Page({
     // 如果只传入了id，则从全局notices中获取
     if (options.id) {
       const noticeDetail = app.globalData.notices.find(notice => notice.id === options.id);
+      
       this.setData({
         noticeDetail
       });

pages/tzxq/tzxq.wxml

@@ -16,21 +16,21 @@
   <scroll-view scroll-y="true" class="notice-scroll-view">
     <view class="notice-detail-wrapper">
       <view class="notice-detail">
-        <view class="notice-title">{{noticeDetail.noticetitle}}</view>
+        <view class="notice-title">{{noticeDetail.title}}</view>
         <!-- 标题下方的分隔线 -->
         <view class="title-divider"></view>
         <!-- 通知内容 -->
         <view class="notice-content">
-          <rich-text nodes="{{noticeDetail.noticecontent}}"></rich-text>
+          <rich-text nodes="{{noticeDetail.content}}"></rich-text>
         </view>
         
         <!-- 落款和日期放在右下角 -->
-        <view class="notice-footer">
+        <!-- <view class="notice-footer"> -->
           <!-- 
             <view class="notice-signature">{{noticeDetail.source}}</view> 
             <view class="notice-footer-date">{{noticeDetail.date}}</view>
           -->
-        </view> 
+        <!-- </view>  -->
       </view>
     </view>
   </scroll-view>

pages/tzxq/tzxq.wxss

@@ -36,9 +36,12 @@
 }
 
 .back-icon {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
+  position: fixed;
+  top: 130rpx;
+  left: 30rpx;
+  z-index: 999;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 .nav-title {

pages/zhangdanlist/zhangdanlist.wxss

@@ -31,10 +31,10 @@
 .fixed-back {
   position: fixed;
   top: 120rpx;
-  left: 30rpx;
+  left: 25rpx;
   z-index: 999;
-  width: 16px;
-  height: 16px;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 
@@ -47,10 +47,10 @@
 
 .user-info-container {
   position: fixed;
-  top: 200rpx;
+  top: 160rpx;
   left: 0;
   width: 100%;
-  padding: 0 30rpx;
+  padding: 0 0rpx;
   box-sizing: border-box;
   z-index: 10;
 }
@@ -58,7 +58,7 @@
 .user-info {
   background-color: transparent;
   color: white;
-  padding: 20rpx 20rpx;
+  padding: 24rpx 36rpx;
   width: 100%;
 }
 
@@ -73,7 +73,7 @@
   align-items: center;
   font-size: 30rpx;
   font-weight: 400;
-  margin-bottom: 20rpx;
+  margin-bottom: 10rpx;
   color: rgba(255, 255, 255, 1);
 }
 
@@ -117,17 +117,16 @@
 /* 修改搜索容器样式 */
 .search-container {
   position: fixed;
-  top: 405rpx; /* 调整位置到用户信息下方 */
+  top: 360rpx; /* 调整位置到用户信息下方 */
   left: 0;
-  width: 37%;
-  padding: 0 30rpx;
+  padding: 12rpx 24rpx 0rpx 36rpx;
   box-sizing: border-box;
   z-index: 20; /* 确保在背景之上 */
 }
 
 /* 修改搜索按钮样式 */
 .search-button {
-  padding: 15rpx 30rpx;
+  padding: 15rpx 20rpx;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -150,7 +149,7 @@
 /* 调整账单列表容器位置 */
 .bill-list-wrapper {
   position: fixed;
-  top: 490rpx; /* 调整位置，为搜索按钮留出空间 */
+  top: 450rpx; /* 调整位置，为搜索按钮留出空间 */
   left: 0;
   width: 100%;
   height: calc(100vh - 450rpx);
@@ -162,9 +161,8 @@
 .bill-list {
   width: 100%;
   height: 100%;
-  padding: 0 30rpx;
+  padding: 0 24rpx;
   box-sizing: border-box;
-  margin-top: 0;
   padding-bottom: 50rpx;
 }
 
@@ -211,7 +209,7 @@
   align-items: center;
   justify-content: center;
   margin-right: 15rpx;
-  margin-top: -50rpx;
+  margin-top: -90rpx;
 }
 
 .water-icon {
@@ -227,7 +225,7 @@
 /* 账单信息右侧区域 */
 .bill-info-right {
   text-align: right;
-  margin-top: -70rpx;
+  margin-top: -80rpx;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -258,6 +256,7 @@
   font-size: 28rpx;
   font-weight: 400;
   color: rgba(100, 108, 128, 1);
+  padding-bottom: 10rpx;
 }
 
 .bill-status {

pages/zhangdanxiangqing/zdxiangqing.wxss

@@ -23,11 +23,11 @@
 /* 固定返回按钮样式 */
 .back-icon {
   position: fixed;
-  top: 100rpx;
-  left: 30rpx;
+  top: 120rpx;
+  left: 25rpx;
   z-index: 999;
-  width: 16px;
-  height: 16px;
+  width: 40rpx;
+  height: 40rpx;
 }
 .nav-title {
   flex: 1;