Merge branch 'dev/v1.0.80_yf' of jianyu/web into feature/v1.0.80

apps/mobile/src/views/tabbar/Subscribe.vue

@@ -496,12 +496,27 @@
     />
     <PopupDataexport ref="popup_dataExport" @next="next_export" />
     <CheckUserDialog />
+    <!-- 订阅引导 -->
+    <van-overlay :show="showGuide" @click="showGuide = false">
+      <div class="subscribe-guide">
+        <div class="guide-tips">
+          <div v-if="$envs.inApp" class="tabbar-header-top-placeholder" />
+          <div class="tips-button">订阅管理</div>
+          <div class="tips-popover">
+            <div class="tips-popover-content">
+              <p class="tips-text">您可点击此处修改订阅条件</p>
+              <span class="know-btn" @click="onGuideKnow">我知道了</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </van-overlay>
   </div>
 </template>
 
 <script>
 import { mapActions, mapGetters, mapState } from 'vuex'
-import { Badge, Button, List, Popup, Tab, Tabs, Tag } from 'vant'
+import { Badge, Button, List, Popup, Tab, Tabs, Tag, Overlay } from 'vant'
 import dayjs from 'dayjs'
 import qs from 'qs'
 import { throttle } from 'lodash'
@@ -557,7 +572,8 @@ import {
   getUserSubscribeSomeInfo,
   selectEnt,
   setSubscribePageAreaPackTipClose,
-  setUserSubscribeListVisited
+  setUserSubscribeListVisited,
+  ajaxGetTipInfo
 } from '@/api/modules'
 import { leadGetDate } from '@/api/modules/leadGeneration'
 
@@ -584,6 +600,7 @@ export default {
     [Tab.name]: Tab,
     [Tag.name]: Tag,
     [Popup.name]: Popup,
+    [Overlay.name]: Overlay,
     [AppIcon.name]: AppIcon,
     [Ad.name]: Ad,
     [AppEmpty.name]: AppEmpty,
@@ -844,7 +861,8 @@ export default {
       mergedKeywords: [],
       alreadyLeave: false, // 免费用户是否已经留资. true为已留资，false为未留资或者留资信息不全
       scrollStatus: true,
-      showTutorial: false
+      showTutorial: false,
+      showGuide: false
     }
   },
   computed: {
@@ -1147,6 +1165,7 @@ export default {
     }
     console.log(this.restfulApiUserTypeWitchVSwitch, 'created')
     console.log(this.vSwitch)
+    this.getGuideInfo()
   },
   mounted() {
     iosBackRefresh()
@@ -2852,6 +2871,32 @@ export default {
       } else {
         console.warn(msg)
       }
+    },
+    async getGuideInfo(know) {
+      try {
+        const params = {
+          tipName: 'subscribe_guide',
+          doType: know || ''
+        }
+        const { error_code: code, data } = await ajaxGetTipInfo(params)
+        if (code === 0) {
+          if (know && data === 1) {
+            this.showGuide = false
+          } else {
+            if (data === 0) {
+              this.showGuide = true
+            } else {
+              this.showGuide = false
+            }
+          }
+        }
+      } catch (err) {
+        console.log(err)
+      }
+    },
+    onGuideKnow() {
+      this.getGuideInfo('know')
+      this.showGuide = false
     }
   }
 }
@@ -3182,4 +3227,55 @@ export default {
   background-size: contain;
   margin-top: -2px;
 }
+.subscribe-guide {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+  height: 100%;
+  .guide-tips {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    padding-right: 8px;
+    .tips-button {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 80px;
+      height: 44px;
+      background: #fff;
+      border-radius: 8px;
+      font-size: 14px;
+      line-height: 20px;
+    }
+    .tips-popover {
+      width: 203px;
+      height: 98px;
+      margin-top: 8px;
+      margin-right: 20px;
+      background: url(@/assets/image/guide/subscribe-guide.png) no-repeat center;
+      background-size: contain;
+      &-content {
+        padding-top: 26px;
+        text-align: center;
+        .tips-text {
+          color: #1d1d1d;
+          font-size: 12px;
+          line-height: 16px;
+        }
+        .know-btn {
+          display: inline-block;
+          width: 120px;
+          height: 32px;
+          margin-top: 10px;
+          font-size: 12px;
+          line-height: 32px;
+          background: $color_main;
+          color: #fff;
+          border-radius: 4px;
+        }
+      }
+    }
+  }
+}
 </style>