订阅

sph_applet/pages/followAccount/followAccount.js

    * 页面的初始数据
    */
   data: {
+    isShow: true,
+    notice: '公告：“-”代表该视频号预估粉丝增量数据获取异常，对您造成的不便尽请谅解.',
     safeAreaTop: '',
     page: 1,
     time: 1,
    */
   onLoad: function (options) {
     this.setData({
-      safeAreaTop:50+app.data.safeAreaTop,
+      safeAreaTop:30+app.data.safeAreaTop,
       page: 1,
       pages: 1,
       videoList: []
     })
     this.getVideoList();
   },
+  switchShow() {
+    this.setData({
+      isShow: false
+    })
+  },
   checkType(e) {
     this.setData({
       time: e.currentTarget.dataset.time,

sph_applet/pages/followAccount/followAccount.wxml

 <!--pages/followAccount/followAccount.wxml-->
 <wxs module="filter" src="../../assets/js/common.wxs"></wxs>
 <custom-header title="收藏的视频号" isBack="true"></custom-header>
-<view class="follow" style="margin-top:{{safeAreaTop}}px">
+<view class="notice-wrap" style="margin-top:{{safeAreaTop}}px" wx:if="{{isShow}}">
+    <view class="tongzhitext">
+      <text class="tongzhi-text">{{notice}}</text>
+  　　<image bindtap='switchShow' src="../../assets/img/close11.png" class="closeView">x</image>
+    </view>
+  </view>
+<!-- <view class="follow" style="margin-top:calc({{safeAreaTop}}px {{isShow?' + 80rpx':''}})"> -->
+<view class="follow" style="margin-top:{{isShow?'30rpx':(safeAreaTop+20+'px')}}">
   <view class="flex">
     <view class="item" bindtap="showBox">{{time==''?'日期筛选':(time==1?'昨日':'近'+time+'天')}}
       <view class="sort"></view>

sph_applet/pages/followAccount/followAccount.wxss

   display: inline-block;
   width: 100%;
   height: 100%;
+}
+
+@keyframes remindMessage {
+  0% {
+    -webkit-transform: translateX(4%);
+  }
+
+  100% {
+    -webkit-transform: translateX(-20%);
+  }
+}
+
+.tongzhitext {
+  margin-right:80rpx;
+  margin-left: 20rpx;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.tongzhi-text {
+  font-size: 24rpx;
+  line-height: 52rpx;
+  animation: remindMessage 4s linear infinite 3s;
+  width: 100%;
+  color: #FF7500;
+  display: block;
+}
+
+.notice-wrap {
+  background: #ffebda;
+  width: 100%;
+  height: 52rpx;
+  line-height: 52rpx;
+  color: #FEF6EA;
+  font-size: 28rpx;
+  position: relative;
+  margin-top: 20rpx;
+  /* border: 0.5px solid #FF8426; */
+}
+
+.closeView {
+  width: 34rpx;
+  height: 34rpx;
+  position: absolute;
+  right: 10rpx;
+  top: 50%;
+  transform: translateY(-50%);
 }