1

miniprogram/pages/index/index.json

@@ -2,6 +2,7 @@
     "navigationBarTitleText": "首页",
     "navigationStyle": "custom",
     "usingComponents": {
-        "van-notify": "@vant/weapp/notify/index"
+        "van-notify": "@vant/weapp/notify/index",
+        "van-icon": "@vant/weapp/icon/index"
     }
 }

miniprogram/pages/index/index.wxml

@@ -25,6 +25,22 @@
         </view>
     </view>
 
+    <!-- 消息通知 -->
+    <view class="itemTitleView">
+        <view class="title">消息通知</view>
+        <view class="more">更多</view>
+    </view>
+    <view class="infoView">
+        <view class="itemView" wx:for="{{3}}">
+            <view class="contentView ellipsisFont">
+                <view class="title">工单动态</view>
+                <view class="msg ellipsisFont">您的工单《空调》已受理,正在处理中正在处理中正在处理中正在处理中</view>
+                <view class="time">2024-08-16 13:49:11</view>
+            </view>
+            <van-icon class="arrow" name="arrow" color="#c3c3c3" size="40rpx"/>
+        </view>
+    </view>
+
     <!-- tabBar -->
     <view class="tab-bar">
         <view wx:for="{{tabBarList}}" wx:key="index" class="tab-bar-item {{item.bulge?'bulge':''}}" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">

miniprogram/pages/index/index.wxss

@@ -1,4 +1,11 @@
 @import "../../tabBar.wxss";
+
+.containerView.public {
+    position: relative;
+    background: #fbfbfb;
+    padding-bottom: 300rpx;
+}
+
 .topHead {
     position: relative;
     height: 500rpx;
@@ -40,12 +47,12 @@
     border-bottom-right-radius: 96rpx;
 }
 
-.topHead .homeView{
+.topHead .homeView {
     position: absolute;
     z-index: 4;
     left: 40rpx;
     top: 100rpx;
-    
+
     border-radius: 50rpx;
     width: 50rpx;
     height: 50rpx;
@@ -115,15 +122,59 @@
 }
 
 
+.itemTitleView .more {
+    font-size: 28rpx;
+    color: #5482de;
+}
+
+.infoView {
+    /* border: 1px solid red; */
+    background: white;
+    margin: 30rpx 20rpx;
+}
+
+.infoView .itemView {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 30rpx 30rpx;
+    border-bottom: 2rpx solid rgb(126, 126, 126, 0.2);
+}
+
+
+.infoView .itemView:last-of-type {
+    border-bottom: none;
+}
+
+.infoView .itemView .contentView {}
+
+.infoView .itemView .arrow {
+    margin-left: 20rpx;
+}
+
+.infoView .itemView .contentView .title {
+    font-size: 30rpx;
+    color: orange;
+}
+
+.infoView .itemView .contentView .msg {
+    font-size: 26rpx;
+    color: gray;
+    margin-top: 16rpx;
+}
+
+.infoView .itemView .contentView .time {
+    font-size: 24rpx;
+    color: gray;
+    margin-top: 4rpx
+}
 
 
 .fixed {
-    background: white;
-    padding: 0 30rpx 240rpx 30rpx;
+    padding: 0 30rpx 10rpx 30rpx;
     display: flex;
     flex-wrap: wrap;
     /* border-radius: 20rpx; */
-    margin-bottom: 40rpx;
 }
 
 .fixedbox {