[update] 修改变更21样式调整

pages/home/home.js

@@ -165,10 +165,11 @@ Page({
     const params = Object.assign({}, this.data.searchParams, {noticeStatus: 1})
     UserApi.noticeList(params).then(res => {
       if (res.success) {
+        console.log(this.data.searchParams.pageNo)
         // 搜索时，把原数据清空，重新筛选
         if (this.data.searchParams.pageNo === 1) {
           this.setData({
-            list: []
+            noticeList: []
           })
         }
         if (res.result.records && res.result.records.length) {
@@ -179,7 +180,7 @@ Page({
       }
     }).catch(err => {
       wx.showToast({
-        title: '登录后查看消息通知！',
+        title: '登录后查看公告！',
         icon: 'none',
         duration: 2000
       })
@@ -323,6 +324,15 @@ Page({
     })
     this.loadData()
   },
+  // 公告日期选中
+  bindNoticeDateChange: function (e) {
+    this.data.searchParams.pageNo = 1
+    this.setData({
+      "searchParams.startTime": e.detail.value,
+      "searchParams.endTime": e.detail.value
+    })
+    this.loadNoticeData()
+  },
   // tab选中
   changeTab: function (e) {
     const that = this

pages/home/home.wxml

@@ -20,12 +20,15 @@
     <!-- 消息列表筛选框 -->
     <view class="list-box">
       <view class="swiper-tab">
+        <image wx:if="{{tabActiveKey === 'message'}}" class="bg-image-left" mode="scaleToFill" src="../../assets/images/tab-back-img-left.png"></image>
+        <image wx:if="{{tabActiveKey === 'notice'}}" class="bg-image-right" mode="scaleToFill" src="../../assets/images/tab-back-img-right.png"></image>
         <view wx:for="{{tabList}}" wx:key="key" catchtap="changeTab"
-              class="{{tabActiveKey === item.key ?'selected-menu':'unselect-menu'}}" data-key="{{item.key}}">{{item.tab}}
+              class="{{(tabActiveKey === item.key ?'selected-menu':'unselect-menu')}}" data-key="{{item.key}}">{{item.tab}}
           <hr class="{{tabActiveKey == item.key ? 'selected-line':'unselect-line'}}" />
         </view>
       </view>
 
+      <!--  消息查询条件  -->
       <view wx:if="{{tabActiveKey === 'message'}}" class="sign-list">
         <view class="select-list">
           <view class="select-item">
@@ -74,13 +77,30 @@
           <text class="status" wx:if="{{item.readFlag == 0}}"></text>
         </view>
       </view>
+
+      <!--  公告查询条件 -->
+      <view wx:if="{{tabActiveKey === 'notice'}}" class="sign-list">
+        <view class="select-list">
+          <view class="select-item">
+            <picker mode="date" value="{{searchParams.startTime}}" start="2000-01-01" end="2050-12-31"
+                    bindchange="bindNoticeDateChange">
+              <view class="picker">
+                <text wx:if="{{!searchParams.startTime}}">时间</text>
+                <text wx:if="{{searchParams.startTime}}">{{searchParams.startTime}}</text>
+              </view>
+            </picker>
+          </view>
+        </view>
+      </view>
       <!-- 公告列表 -->
       <view class="list-content" wx:if="{{noticeList && noticeList.length && tabActiveKey === 'notice'}}">
         <view class="list-content-item" wx:for="{{noticeList}}" wx:key="item" wx:for-item="item" bindtap="showNoticeDialog"
               data-message="{{item}}">
           <view class="content-top">
             <view>
-              <text class="green">{{item.noticeName}}</text>
+              <image src="../../assets/images/notice-img.png"></image>
+              <text class="green">公告提醒</text>
+<!--              <text class="green">{{item.noticeName}}</text>-->
             </view>
             <text class="content-time">{{item.createTime}}</text>
           </view>
@@ -88,12 +108,10 @@
         </view>
       </view>
     </view>
-  </view>
+    <view wx:if="{{tabActiveKey === 'message' && (!list || list.length === 0)}}" class="no-data">
-  <view>
-    <view wx:if="{{tabActiveKey === 'message' && list.length === 0}}" class="no-data">
       <text>暂无消息通知！</text>
     </view>
-    <view wx:if="{{tabActiveKey === 'notice' && noticeList.length === 0}}" class="no-data">
+    <view wx:if="{{tabActiveKey === 'notice' && (!noticeList || noticeList.length === 0)}}" class="no-data">
       <text>暂无公告！</text>
     </view>
   </view>
@@ -131,7 +149,7 @@
     <view class="modal-content">
       <!-- {{content}} -->
 <!--      <view class="title">{{clickItem.currentTarget.dataset.message.noticeName}}</view>-->
-      <view class="title">公告</view>
+      <view class="title">公告提醒</view>
       <!-- rich-text 会解析html模板中的html标签 -->
       <view>     <rich-text nodes="{{content}}"></rich-text></view>
     </view>

pages/home/home.wxss

@@ -225,30 +225,43 @@ page{
 /* tab栏 */
 .swiper-tab {
   width: 100%;
-  height: 80rpx;
+  height: 98rpx;
   text-align: center;
   display: flex;
   justify-content: space-between;
-  background: white;
+  background: #EBEDED;
+  margin-top: -15pt;
+  border-top-left-radius: 10px;
+  border-top-right-radius: 10px;
+  position: relative;
   /*border-bottom: 2rpx solid rgba(193, 193, 193, 0.3);*/
 }
+.bg-image-left {
+  position: absolute;
+  width: 54%;
+  z-index: 99;
+}
+.bg-image-right {
+  position: absolute;
+  right: 0;
+  width: 54%;
+  z-index: 99;
+}
 
 .selected-menu {
   display: flex;
   flex-direction: column;
   align-items: center;
   color: #069F99;
-  background: #fff;
   font-size: 32rpx;
-  font-weight: bold;
+  /*background: transparent;*/
-  font-family: PingFang SC;
-  font-weight: 400;
   width: 50%;
-  height: 60rpx;
+  height: 98rpx;
-  line-height: 60rpx;
+  line-height: 98rpx;
   opacity: 1;
   /*border-bottom: 2rpx solid #069F99;*/
   position: relative;
+  z-index: 100;
 }
 
 .unselect-menu {
@@ -256,15 +269,15 @@ page{
   flex-direction: column;
   align-items: center;
   font-size: 16px;
-  font-family: PingFang SC;
   font-weight: 400;
   color: #4f4f50;
   width: 50%;
-  height: 60rpx;
+  height: 98rpx;
-  line-height: 60rpx;
+  line-height: 98rpx;
-  background: #fff;
+  background: transparent;
   opacity: 1;
   position: relative;
+  z-index: 100;
   /* border-radius: 34rpx; */
 }
 
@@ -274,6 +287,5 @@ page{
   width: 90rpx;
   position: absolute;
   /* margin-top: 10rpx; */
-  bottom: -18rpx;
+  bottom: 0rpx;
-  width: 60rpx;
 }