13.1.1 ok

pages/material/material.vue

@@ -29,6 +29,15 @@
               item.Name
             }}</view>
           </view>
+          <!-- 我的收藏滚动显示 -->
+          <view class="notice" @click="noticeBarHandler" v-if="secondActive==0">
+            <van-notice-bar
+              custom-class="custom-class-notice"
+              color="#E37318"
+              background="#FFF1E9"
+              text="如何定制自己的图表面板：在上方分栏下选择感兴趣的图表类别，点击标题查看大图，点亮☆收藏就可以在自己的图表首页可见。也可在报告中随时点☆收藏感兴趣的图表。"
+            />
+          </view>
         </block>
         <view v-if="topTabsActive == '4'" class="medium-ul">
           <view class="global_two_tabs">
@@ -104,6 +113,17 @@
       <image src="https://hzchart.oss-cn-shanghai.aliyuncs.com/new_cygx/Joined_play_list.png"></image>
     </view>
     <Loading />
+    <van-popup custom-class="custom-class-popup" :show="isNoticeBarShow" :close-on-click-overlay="false" @close="onCloseHandler">
+      <view class="close-iocn">
+        <van-icon @click="onCloseHandler" color="#333" name="cross" />
+      </view>
+      <view class="popup-box">
+        如何定制自己的图表面板：在上方分栏下选择感兴趣的图表类别，点击标题查看大图，点亮<van-icon name="star" color="#E37318" />收藏就可以在自己的图表首页可见。也可在报告中随时点<van-icon
+          name="star"
+          color="#E37318"
+        />收藏感兴趣的图表。
+      </view>
+    </van-popup>
   </view>
 </template>
 
@@ -155,6 +175,7 @@ export default {
       listChartPermission: [], // 行业
       chartPermissionName: "全行业",
       chartPermissionIds: "",
+      isNoticeBarShow: false,
     };
   },
   components: {
@@ -556,6 +577,14 @@ export default {
       this.showAudioPop = true;
       uni.$emit("play-list-emit", {});
     },
+    // 点击了图表下的滚动条
+    noticeBarHandler() {
+      this.isNoticeBarShow = true;
+    },
+    // 关闭滚动条的弹框
+    onCloseHandler() {
+      this.isNoticeBarShow = false;
+    },
   },
   onHide() {
     this.$store.commit("audioBg/parseIntAudio", false);
@@ -805,5 +834,19 @@ export default {
   /deep/ .van-ellipsis {
     font-size: 24rpx;
   }
+  .custom-class-popup {
+    border-radius: 12rpx;
+    .close-iocn {
+      padding: 25rpx 35rpx;
+      display: flex;
+      justify-content: flex-end;
+    }
+    .popup-box {
+      width: 632rpx;
+      padding: 0 30rpx 50rpx;
+      line-height: 48rpx;
+      font-size: 32rpx;
+    }
+  }
 }
 </style>