feat: 订阅管理页面展示优化

src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/js/vip_index_new.js

@@ -35,6 +35,9 @@ var subNode = new Vue({
       this.switehAjax()
     },
     mounted () {
+        this.$nextTick(function () {
+            $(".app-layout-content-b").removeAttr('v-cloak')
+        })
         // this.userAreaNum = 0
         // this.userType = true
         // this.userAreaAllNum = 1

src/jfw/modules/app/src/web/templates/vipsubscribe/vip_index_new.html

@@ -247,13 +247,13 @@
     <!-- <a href="/jyapp/vipsubscribe/vipsubscribe_renew" class="custom-header-right go_renew" style="display: none;">续费</a> -->
     <!-- <a href="/jyapp/vipsubscribe/vipsubscribe_new" class="custom-header-right go_buy" style="display: none;">去购买</a> -->
   </div>
-  <div class="app-layout-content-b">
+  <div class="app-layout-content-b"  v-cloak>
     {{if not .T.isLiveActive}}
     <div class="vip-upgrade">
       {{else}}
       <div class="vip-upgrade live-20200707">
         {{end}}
-        <ul class="vip-body" id="vip-body">
+        <ul class="vip-body" id="vip-body" v-cloak>
           <li class="sub-box">
             <a data-href="/jyapp/vipsubscribe/introducePage?type=renew" class="banner-ad-box update"
               style="display: none">
@@ -267,7 +267,7 @@
               </div>
             </a>
             <ul class="sub-info" :class="vSwitch !== 'm' && vSwitch !== 'v' ? 'go_to_levelup' : ''" @click="toPaySupSub" style="min-height: 1.48rem">
-              <li class="cycle" v-show="vSwitch !== 'f'">
+              <li class="cycle" v-show="vSwitch == 'm' || vSwitch == 'v'">
                 <a class="item-container" :href="vipLink">
                   <div class="item">
                     <span class="item-l">
@@ -332,7 +332,7 @@
           </li>
         </ul>
         <!-- 升级 -->
-        <div class="update_renew" v-if="thisvSwitch === 'v'">
+        <div class="update_renew" style="display: none">
           <div class="update-tips" data-update-tips>因系统升级，已购买用户可选择原套餐续费，或升级到新版本享受更多权益。</div>
           <div class="footer-button-group j-button-group">
             <button class="j-button-confirm" data-bind-renew>续费</button>
@@ -391,7 +391,7 @@
       sessionStorage.removeItem('vip-cur-select-size')
     </script>
     <script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/UpgradePrice.js?v={{Msg "seo" "version"}}'></script>
-    <script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/vip_index_new.js?v={{Msg "seo" "version"}}'></script>
+    <script src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/vipsubscribe/js/vip_index_new.js?v=11{{Msg "seo" "version"}}'></script>
 </body>
 {{include "/common/baiducc.html"}}
 

src/web/staticres/vipsubscribe/js/vip_index_new.js

@@ -20,13 +20,18 @@ var subNode = new Vue({
             userAreaAllNum: 1, // 用户可修改地区总次数
             subscribeTime: '', // 用户订阅的时间
             vSwitch:'', // 用户版本权限
-            freeUserArea: {}, // 购买省份订阅包的用户所选择的地区 
+            freeUserArea: {}, // 购买省份订阅包的用户所选择的地区
         }
     },
     created () {
         this.getUserSubscribe()
         this.getUserType()
     },
+    mounted () {
+        this.$nextTick(function () {
+            $(".app-layout-content-b").removeAttr('v-cloak')
+        })
+    },
     methods: {
         superOrderTemplateMounted () {
             $('#pushResultPreview').attr('data-cl-event', 'c_wx_preview_buttonclick')
@@ -37,7 +42,7 @@ var subNode = new Vue({
                 var href = '/front/vipsubscribe/introducePage'
                 location.href = href
             }
-            
+
         },
         // 得到用户是否购买省份包
         getUserSubscribe: function () {
@@ -56,11 +61,11 @@ var subNode = new Vue({
                 }
             })
         },
-        // 省份订阅包续费 
+        // 省份订阅包续费
         renewBtn: function () {
             location.href = '/areaPack/wx/page/buy?type=renew'
         },
-        // 省份订阅包升级 
+        // 省份订阅包升级
         updateBtn: function () {
             location.href = '/areaPack/wx/page/buy?type=upgrade&area=' +  encodeURIComponent(JSON.stringify(this.freeUserArea))
         },
@@ -149,7 +154,7 @@ function getNewYearMarketing () {
 
 $(function () {
     /* vue 代码 start 提交订单 */
-  // var coupon = new Vue({ 
+  // var coupon = new Vue({
   //   el: '#coupon-vue',
   //   data: function () {
   //     return {
@@ -173,7 +178,7 @@ $(function () {
   //   },
   //   mounted () {
   //     this.init()
-  //   }, 
+  //   },
   //   methods: {
   //     // 更新价格相关
   //     updatePrice: function (before) {
@@ -1009,7 +1014,7 @@ $(function () {
     //         // initBack(2);// 升级
     //     }
     // } else {
-        
+
     // }
     getDataWitXHR()
     //返回提示使用

src/web/templates/weixin/vipsubscribe/vip_index_new.html

@@ -80,7 +80,7 @@
     .j-button-confirm:nth-child(1){
       margin-right: .16rem;
     }
-    
+
     </style>
 </head>
 
@@ -105,7 +105,7 @@
         </div> -->
       </div>
     </div>
-    <ul class="vip-body" id="vip-body">
+    <ul class="vip-body" id="vip-body" v-cloak>
         <li class="sub-box">
             <a data-href="/front/vipsubscribe/introducePage?type=renew" class="banner-ad-box update" style="display: none">
                 <span>限时续费，3个月起，续多久送多久！</span>
@@ -360,7 +360,7 @@
     </div>
     <!-- 升级 -->
     <!-- 升级 -->
-    <div class="update_renew" v-show="vSwitch === 'v'">
+    <div class="update_renew" style="display: none">
       <div class="update-tips" data-update-tips>因系统升级，已购买用户可选择原套餐续费，或升级到新版本享受更多权益。</div>
       <div class="footer-button-group j-button-group">
         <button class="j-button-confirm" data-bind-renew data-cl-event="c_wx_buy_buttonclick">续费</button>