feat:微信端附件下载页面新增兑换权益等相关

src/jfw/modules/app/src/web/templates/frontRouter/fileRecord/sess/index.html

@@ -174,7 +174,7 @@
       <div class="j-container">
         <div class="j-main">
 <!--            大会员且有附件下载权益不展示头部-->
-            <template v-if="!(userPower.memberStatus && hasDownloadPower)">
+            <template v-if="!(userPower.memberStatus > 0 && hasDownloadPower)">
                 <div class="t-bg flex" style="min-height:3.28rem;">
                     <span class="view-detail" @click="viewDetail">兑换/购买附件下载明细<em class="j-icon icon-arrow-right"></em></span>
                     <div class="nums">
@@ -203,7 +203,7 @@
                         <div class="box-content">
                             <template v-if="!userPower.isFree">
                                 <!-- 大会员-->
-                                <div class="p-row upgrade-row" v-if="userPower.memberStatus">
+                                <div class="p-row upgrade-row" v-if="userPower.memberStatus > 0">
                                     <p class="row-top">
                                         <span><em>1</em>、服务升级</span>
                                         <span class="handle-text"   @click="consultKf">咨询客服 <em class="j-icon icon-arrow-right"></em></span>
@@ -219,7 +219,8 @@
                                     <p>您可购买大会员，获得每个月不限量附件下载。</p>
                                 </div>
                             </template>
-                            <div class="p-row recharge-row" v-if="!userPower.memberStatus">
+                            <!-- 仅是超级订阅或者免费用户（部分用户即是超级订阅又是大会员，优先按照大会员展示）-->
+                            <div class="p-row recharge-row" v-if="(userPower.isFree || userPower.vipStatus > 0) && userPower.memberStatus <= 0">
                                 <p class="row-top">
                                     <span>
                                         <em>{userPower.isFree ? 1 : 2}</em>、充值</span><span class="handle-text" @click="setBook">去充值 <em class="j-icon icon-arrow-right"></em>
@@ -230,7 +231,7 @@
                             <div class="p-row exchange-row">
                                 <p class="row-top">
                                     <span>
-                                        <em>{ (userPower.memberStatus || userPower.isFree) ? 2 : 3  }</em>
+                                        <em>{ (userPower.memberStatus > 0 || userPower.isFree) ? 2 : 3  }</em>
                                         、兑换</span><span class="handle-text"  @click="exchangeHandle">去兑换 <em class="j-icon icon-arrow-right"></em>
                                     </span>
                                 </p>

src/web/staticres/common-module/file-pack/js/index-wx.js

@@ -96,7 +96,38 @@ var vm = new Vue({
       statusEnum: ['存续', '吊销', '停业', '撤销'],
       statusColors: ['#2CB7CA', '#F5AF5C', '#58A1E7', '#51CEA2'],
       list: [],
-      ptype:""
+      ptype:"",
+      userPower: {
+        // 免费用户
+        isFree: false,
+        // 超级订阅(超级订阅默认一定有附件下载权益)
+        vipStatus: 0,
+        // 大会员
+        memberStatus: 0,
+        // 大会员power包含3， 则表示大会员有附件下载权益
+        power: []
+      },
+      // 附件下载相关权益信息
+      accountInfo: {
+        // 购买数量（充值）
+        number1: 0,
+        // 兑换数量
+        number2: 0,
+        // 定期投放数量（超级订阅剩余权益个数）
+        number3: 0,
+        // 留资数量（免费用户权益个数）
+        number4: 0
+      }
+    }
+  },
+  computed: {
+    // 大会员是否拥有附件下载权益
+    hasDownloadPower () {
+      return this.userPower.power.indexOf(3) > -1
+    },
+    // 展示外层边框（权益）(非大会员、免费用户且有免费权益、或者为超级订阅)
+    showSubscribeBox () {
+      return (this.userPower.vipStatus > 0 || (this.userPower.isFree && this.accountInfo.number4)) && this.userPower.memberStatus <= 0
     }
   },
   created: function () {
@@ -107,19 +138,45 @@ var vm = new Vue({
       this.curDate = new Date()
       this.minDate = new Date(2021, 0)
       this.maxTime = new Date(this.years, this.months - 1)
+      this.getUserPower()
       this.subPoint()
       this.onLoad()
-    	this.initHtml()
   },
   methods: {
-	initHtml(){
-		if(this.ptype=="1"){
-			document.title = '采购单位画像记录'
-            typeof setHeaderTitle === 'function' ? setHeaderTitle(document.title) : null
-			$(".btns span").text("当月采购单位画像剩余数")
-			$(".emptytext").text("暂无采购单位画像记录")
-		}
-	},
+    // 获取用户权限
+    getUserPower() {
+      var _this = this
+      $.ajax({
+        url: '/bigmember/use/isAdd',
+        type: 'POST',
+        success: function (res) {
+          console.log(res)
+          if (res.data) {
+            var resData = res.data
+            _this.userPower.isFree = resData.isFree
+            _this.userPower.vipStatus = resData.vipStatus
+            _this.userPower.memberStatus = resData.memberStatus
+            _this.userPower.power = resData.power
+          }
+        }
+      })
+    },
+    // 超级订阅-了解详情
+    knowMore () {
+      location.href = '/weixin/frontPage/bigmember/free/perfect_info?source=wx_test'
+    },
+    // 咨询客服
+    consultKf () {
+      console.log('咨询客服')
+    },
+    // 去兑换
+    exchangeHandle() {
+      location.href = '/jy_mobile/points/my_points'
+    },
+    // 兑换明细
+    viewDetail () {
+
+    },
 	getPType(paraName){
       	let _this = this
 		var url = document.location.toString();
@@ -306,6 +363,7 @@ var vm = new Vue({
       // location.href = '400-108-6670'
       location.href = '/big/wx/page/customer'
     },
+    // 去充值
     setBook() {
       var temp = {
         wx: '/jy_mobile/common/order/create/filepack?type=0',

src/web/staticres/common-module/file-pack/js/index.js

@@ -99,9 +99,9 @@ var vm = new Vue({
     hasDownloadPower () {
       return this.userPower.power.indexOf(3) > -1
     },
-    // 展示外层边框（权益）(非大会员、免费用户且有免费群益、或者为超级订阅)
+    // 展示外层边框（权益）(非大会员、免费用户且有免费权益、或者为超级订阅)
     showSubscribeBox () {
-      return (this.userPower.vipStatus > 0 || (this.userPower.isFree && this.accountInfo.number4)) && !this.userPower.memberStatus
+      return (this.userPower.vipStatus > 0 || (this.userPower.isFree && this.accountInfo.number4)) && this.userPower.memberStatus <= 0
     }
   },
   created: function () {
@@ -137,12 +137,7 @@ var vm = new Vue({
     },
     // 超级订阅-了解详情
     knowMore () {
-      var temp = {
-        wx: '/weixin/frontPage/bigmember/free/perfect_info?source=wx_test',
-        app: '/jyapp/frontPage/bigmember/free/perfect_info?source=app_test'
-      }
-      var isWeixin = navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1
-      location.href = temp[isWeixin ? 'wx' : 'app']
+      location.href = '/jyapp/frontPage/bigmember/free/perfect_info?source=app_test'
     },
     // 咨询客服
     consultKf () {

src/web/templates/frontRouter/wx/fileRecord/sess/index.html

@@ -99,6 +99,99 @@
           opacity: 0;
           transition: all 0.2s;
       }
+      .t-bg .view-detail{
+          position: absolute;
+          color: #2ABED1;
+          font-size: .24rem;
+          right: .24rem;
+          top: .24rem;
+          line-height: .32rem;
+      }
+      .t-bg .view-detail .icon-arrow-right {
+          width: .32rem;
+          height: .32rem;
+          vertical-align: bottom;
+      }
+      .highlight-color{
+          color: #2ABED1;
+      }
+      .rights-box{
+          margin: -1.4rem .32rem .24rem;
+      }
+      .subscribe-box{
+          border-radius: .16rem;
+          background: linear-gradient(281deg, #14A7D6 3.53%, #1EC2DB 98.32%);
+          box-shadow: 0 .08rem .32rem 0 rgba(8, 31, 38, 0.08);
+          padding: .24rem .04rem .04rem;
+      }
+      .subscribe-title{
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+          margin-bottom: .24rem;
+          color: #FFF;
+          font-size: .2rem;
+          line-height: .32rem;
+      }
+      .subscribe-box .subscribe-title img{
+          width: .96rem;
+          height: .84rem;
+          margin-right:2px;
+      }
+      .subscribe-box .subscribe-title strong{
+          font-size: .28rem;
+      }
+      .rights-box .box-container{
+          background: #fff;
+          padding: .32rem .24rem .24rem;
+          border-radius: .16rem;
+      }
+      .subscribe-box .box-container{
+          background: linear-gradient(90deg, #F3FEFF 0%, #DEFBFF 100%);
+      }
+      .subscribe-box .free-title{
+          margin-left: 18px;
+      }
+      .rights-box .box-title{
+          text-align: center;
+          color: #171826;
+          font-size: .24rem;
+          line-height: .48rem;
+          padding: .08rem 0;
+          border-bottom: .01rem solid rgba(0, 0, 0, 0.10);
+      }
+      .rights-box .p-row {
+          margin-top: .24rem;
+      }
+      .rights-box .box-content {
+          color: #5F5E64;
+          font-size: .22rem;
+          line-height: .32rem;
+      }
+      .rights-box .row-top{
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          color: #1B1A2A;
+          font-size: .28rem;
+          line-height: .4rem;
+          margin-bottom: .08rem;
+      }
+      .rights-box .handle-text{
+          color: #2ABED1;
+          text-align: right;
+          font-size: .24rem;
+          line-height: .36rem;
+          cursor: pointer;
+      }
+      .rights-box .icon-arrow-right{
+          width: .24rem;
+          height: .24rem;
+          vertical-align: middle;
+      }
+      .rights-box em.highlight-color{
+          font-size: .28rem;
+      }
     </style>
     <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
 </head>
@@ -108,16 +201,74 @@
     <div class="j-main portraited" id="proRecord" v-cloak>
       <div class="j-container">
         <div class="j-main">
-          <div class="t-bg flex">
-            <div class="nums">
-              <span v-if="points.total>=0">{points.total}</span>个
-              <img src='{{Msg "seo" "cdn"}}/common-module/portraitRecord/image/help-p.png?v={{Msg "seo" "version"}}' @click="helpTiped" alt="">
-            </div>
-            <div class="btns flex">
-              <span>当月附件下载余额</span>
-              <van-button round type="primary"  @click="setBook">立即充值</van-button>
-            </div>
-          </div>
+            <!--大会员且有附件下载权益不展示头部-->
+            <template v-if="!(userPower.memberStatus > 0 && hasDownloadPower)">
+                <div class="t-bg flex">
+                    <div class="nums">
+                        <span v-if="points.total>=0">{points.total}</span>个
+<!--                        <img src='{{Msg "seo" "cdn"}}/common-module/portraitRecord/image/help-p.png?v={{Msg "seo" "version"}}' @click="helpTiped" alt="">-->
+                    </div>
+                    <div class="btns flex">
+                        <span>当月附件下载余额</span>
+<!--                        <van-button round type="primary"  @click="setBook">立即充值</van-button>-->
+                    </div>
+                </div>
+                <div  class="rights-box" :class="{'subscribe-box': showSubscribeBox }">
+                    <div class="subscribe-title" v-if="showSubscribeBox">
+                        <template v-if="userPower.vipStatus > 0">
+                            <img src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/collection/image/subscribe-icon.png?v={{Msg "seo" "version"}}' alt="">
+                            <span>
+                                <strong>您当前是超级订阅用户</strong>，您每月享有 <em>10</em> 个附件下载权益。每月1号上余额清零重新计算。本月剩余 <em>{ accountInfo.number3 || 0} </em> 个权益。
+                            </span>
+                        </template>
+                        <span class="free-title" v-if="userPower.isFree">
+                            <strong>您当前是免费用户</strong>，可免费下载附件 <em>{ accountInfo.number4 || 0}</em> 次。
+                        </span>
+                    </div>
+                    <div class="box-container">
+                        <div class="box-title">不够用这么办？你有以下两种途径补充余额</div>
+                        <div class="box-content">
+                            <template v-if="!userPower.isFree">
+                                <!-- 大会员-->
+                                <div class="p-row upgrade-row" v-if="userPower.memberStatus > 0">
+                                    <p class="row-top">
+                                        <span><em>1</em>、服务升级</span>
+                                        <span class="handle-text"   @click="consultKf">咨询客服 <em class="j-icon icon-arrow-right"></em></span>
+                                    </p>
+                                    <p>您当前是大会员用户，目前不享有附件下载权益。您可以联系客服进行服务升级后获得。</p>
+                                </div>
+                                <!--非大会员-->
+                                <div class="p-row upgrade-row" v-else>
+                                    <p class="row-top">
+                                        <span><em>1</em>、服务升级</span>
+                                        <span class="handle-text" @click="knowMore">了解详情 <em class="j-icon icon-arrow-right"></em></span>
+                                    </p>
+                                    <p>您可购买大会员，获得每个月不限量附件下载。</p>
+                                </div>
+                            </template>
+                            <!-- 仅是超级订阅或者免费用户（部分用户即是超级订阅又是大会员，优先按照大会员展示）-->
+                            <div class="p-row recharge-row" v-if="(userPower.isFree || userPower.vipStatus) && userPower.memberStatus <= 0">
+                                <p class="row-top">
+                                    <span>
+                                        <em>{userPower.isFree ? 1 : 2}</em>、充值</span><span class="handle-text" @click="setBook">去充值 <em class="j-icon icon-arrow-right"></em>
+                                    </span>
+                                </p>
+                                <p>您购买了附加下载包，当月有效。本月剩余权益 <em class="highlight-color">{ accountInfo.number1 || 0 }</em> 个权益。</p>
+                            </div>
+                            <div class="p-row exchange-row">
+                                <p class="row-top">
+                                    <span>
+                                        <em>{ (userPower.memberStatus > 0 || userPower.isFree) ? 2 : 3  }</em>
+                                        、兑换</span><span class="handle-text"  @click="exchangeHandle">去兑换 <em class="j-icon icon-arrow-right"></em>
+                                    </span>
+                                </p>
+                                <p>您当月剩余剑鱼币兑换附件下载权益 <em class="highlight-color">{ accountInfo.number2 || 0 }</em> 个。</p>
+                                <p><em>350</em> 剑鱼币可兑换查看一个附件下载权益。兑换后30天内有效。</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </template>
           <div class="p1-date" style="background: #F5F6F7;">
             <div class="d-box flex">
               使用记录