jufubao-base 1.0.61-beta1010 → 1.0.61-beta1012

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-base",
-  "version": "1.0.61-beta1010",
+  "version": "1.0.61-beta1012",
   "private": false,
   "description": "聚福宝业务组件基础插件包",
   "main": "index.js",

package/src/components/JfbBaseCardDetailEntry/JfbBaseCardDetailEntry.vue

@@ -66,7 +66,7 @@
        >
       进入业务板块
       </view>
-      <view style="display:flex;align-content:center;justify-content:center">
+      <view style="display:flex;align-content:center;justify-content:flex-start">
         <view class="jfb-base-card-detail-entry__body-business-content">
         <view
         class="jfb-base-card-detail-entry__body-business-content-item"

package/src/components/JfbBaseCardDisabledEntry/JfbBaseCardDisabledEntry.vue

@@ -16,14 +16,85 @@
     </view>
     <!-- #endif -->
     <view class="jfb-base-card-disabled-entry__body">
-      <view
-        v-if="disableList && disableList.length > 0"
-        class="jfb-base-card-entry__body-card"
-      >
+      <view class="card-content">
         <view
-          v-for="(item) in disableList"
-          class="card-list"
+          v-if="cardList && cardList.length > 0"
+          class="jfb-base-card-entry__body-card"
+        >
+          <template v-for="(item,index) in cardList">
+            <view
+              class="card-list"
+              :data-card="item.card_number"
+              :data-index="index"
+              :data-top="item.top"
+              :key="item.card_number"
+              v-if="setCardItemShow(item,index)"
+              :style="{
+                background: item['theme']['color'],
+                backgroundSize: '100%'
+              }"
+            >
+              <view class="card-list-warp" :style="{backgroundImage: 'url('+ item['theme']['image'] +')'}">
+                <view class="card-list__title">
+                  <view>{{item['card_type_name']}}</view>
+                </view>
+                <div class="card-list__content">
+                  <view>
+                    <text>券号：</text>
+                    <text>{{item.card_number}}</text>
+                  </view>
+                </div>
+                <view class="card-list__date">
+                  <text>有效期：</text>
+                  <text>--</text>
+                </view>
+                <view class="card-list__yue">
+                  <text>余额：</text>
+                  <text>--</text>
+                </view>
+                <view class="card-list__other" v-if="item.other_card_point && item.card_point_type === 2 ">
+                  <view>
+                    <text>购买其他物品可抵：</text>
+                    <text>--</text>
+                  </view>
+                </view>
+                <template>
+                  <view class="card-list__entry" v-if="item.entries.length > 0">
+                    <view
+                      @click.stop="handleUnBindCard(item)"
+                      :style="{color: item['theme']['color']}"
+                    >解绑</view>
+                  </view>
+                  <view class="card-list__nodata" v-else>暂无支持服务列表</view>
+                </template>
+              </view>
+            </view>
+            <view
+              class="card-content-empty card-list"
+              v-else
+              :data-card="item.card_number"
+              :style="{
+              height: item.height + 'px',
+              backgroundImage: 'url('+  cardItem +')'
+            }"
+            ></view>
+          </template>
+        </view>
+        <view v-if="cardList !== null && cardList.length === 0">
+          <view class="jfb-base-card-disabled-entry__body-empty">
+            <view class="jfb-base-card-disabled-entry__body-empty-wrap">
+              <image :src="emptyBg"></image>
+              暂无票券
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="computed-height">
+        <view
+          v-for="(item) in cardComputedList"
+          class="card-list computed-box"
           :key="item.card_number"
+          :data-card="item.card_number"
           :style="{
             background: item['theme']['color'],
             backgroundSize: '100%'
@@ -65,16 +136,8 @@
           </view>
         </view>
       </view>
-      <view v-else>
-        <view class="jfb-base-card-disabled-entry__body-empty">
-          <view class="jfb-base-card-disabled-entry__body-empty-wrap">
-            <image :src="emptyBg"></image>
-            暂无票券
-          </view>
-        </view>
-      </view>
       <view class="bottom_btn-mask"></view>
-      <view v-if="ajaxCardList && ajaxCardList.length>0" class="bottom_btn" :style="prod_bottom">
+      <view v-if="cardList && cardList.length>0" class="bottom_btn" :style="prod_bottom">
         <xd-button
           width="680rpx"
           radius="50rpx"
@@ -234,6 +297,7 @@ export default {
     onJfbBack(options) {
       console.log("event.onJfbBack", options);
     },
+
   },
 };
 </script>
@@ -581,4 +645,22 @@ export default {
     height: unit(120, rpx);
   }
 }
+
+.computed-height {
+  position: fixed;
+  top:-999999px;
+  width: 100%;
+  z-index: 99999;
+}
+
+.card-content-empty {
+  background-size: 100%;
+  background-repeat: no-repeat;
+  background-position: top center;
+
+  & > image {
+    width: 100%;
+    height: 100%;
+  }
+}
 </style>

package/src/components/JfbBaseCardDisabledEntry/cardListMixins.js

@@ -1,5 +1,5 @@
 'use strict';
-import {mapState} from "vuex";
+import {mapState,mapMutations} from "vuex";
 
 export default {
   data() {
@@ -8,9 +8,9 @@ export default {
 
       //卡券列表
       cardOrgList:[], //原始数据
-      cardList:[], //计算后的卡列表
+      cardList:null, //计算后的卡列表
       cardPageNum: 0, //当前页面
-      cardPageLen: 10, //每页获取数据调试
+      cardPageLen: 5, //每页获取数据调试
       cardComputedList:[], //当前获取的数据列表
       cardLoading: false, //加载状态值设置
       cardNextTop: 0, //计算到每一个节点的距离顶部Top值
@@ -20,29 +20,24 @@ export default {
       //转换按钮
       hasChangeStatus: false,//是否有转换按钮
 
-      cardItemBg1: '//img.jufubao.cn/component/card/card_item_02.png',
-      cardItemBg2: '//img.jufubao.cn/component/card/card_item_01.png'
+      cardItemEntry: '//img.jufubao.cn/component/card/card_item_entry.png?v1=11',
+      cardItem: '//img.jufubao.cn/component/card/card_item.png?v1=11'
     }
   },
   computed:{
     ...mapState(['srollPreview'])
   },
-  watch:{
-    // srollPreview(value){
-    //   console.log(value)
-    // }
-  },
-  created(){
 
+  created() {
+    this.setSrollPreview({
+      pageWindowPrevStart: 0,
+      pageWindowPrevEnd: uni.getSystemInfoSync().safeArea.height,
+    });
   },
 
-  mounted(){
-
-
-  },
   methods:{
+    ...mapMutations(['setSrollPreview']),
     setCardItemShow({height , top},index){
-
       //预览模式只获取10条
       if(this.$configProject.isPreview) {
         console.log(this.cardPageLen, index, this.cardPageLen > index)
@@ -84,7 +79,7 @@ export default {
             this.cardNextTop =  this.cardNextTop + card['height'] +  (paddingBottom * this.$rpxNum)
             return card
           });
-          this.cardList = this.cardList.concat(arr);
+          this.cardList = (this.cardList||[]).concat(arr);
           this.$xdHideLoading();
         }).exec();
       })
@@ -94,12 +89,15 @@ export default {
       let newCardList = this.$xdUniHelper.cloneDeep(cardList);
       let validCardList = this.getCardGroupItem(newCardList.list.filter((item) => {
          return item["is_valid"] === "N";
-      }), newCardList['site_entry_settings']).map((item,index)=>{
+      }), newCardList['site_entry_settings'],'Y').map((item,index)=>{
         item['index'] = index;
         return item
       });
       this.cardOrgList = this.$xdUniHelper.cloneDeep(validCardList);
-      this.cardComputedList = this.cardOrgList.slice(this.cardPageNum,this.cardPageLen);
+      this.cardComputedList = this.cardOrgList.slice(
+        this.cardPageNum*this.cardPageLen,
+        this.cardPageNum*this.cardPageLen + this.cardPageLen
+      );
       this.handleCardComputed(paddingBottom).then().catch();
     },
 
@@ -108,7 +106,6 @@ export default {
       this.cardLoading = true;
       this.$xdShowLoading({});
       this.cardPageNum++;
-      console.log('onJfbReachBottom',this.cardPageNum)
       this.$nextTick(()=>{
         setTimeout(()=>{
           this.cardLoading = false;
@@ -126,16 +123,13 @@ export default {
 
     },
 
-    clearDefault(){
-      this.cardOrgList = [];
-      this.cardList = [];
-      this.cardPageNum = 0;
-      this.cardComputedList = [];
-      this.cardLoading = false;
-      this.cardNextTop = 0;
-      this.contentStatus = false;
-      this.hasContent = true;
-    }
+    onJfbScroll({e}){
+      this.setSrollPreview({
+        pageWindowPrevStart: e.scrollTop,
+        pageWindowPrevEnd:e.scrollTop + uni.getSystemInfoSync().safeArea.height
+      })
+    },
+
   }
 }
 

package/src/components/JfbBaseCardEntry/JfbBaseCardEntry.vue

@@ -223,7 +223,7 @@
             }"
           ></view>
         </view>
-        <view v-else-if="cardList === null">
+        <view v-else-if="cardList !== null && cardList.length === 0">
           <view class="jfb-base-card-entry__body-empty">
             <view class="jfb-base-card-entry__body-empty-wrap">
               <image :src="emptyBg"></image>
@@ -261,7 +261,6 @@
           :data-card="item.card_number"
           class="card-list computed-box"
           :key="item.card_number"
-          v-if="index < 20"
           :style="{
             background: item['theme']['color'],
             backgroundSize: '100%'
@@ -664,7 +663,7 @@ export default {
       })
         .then((res) => {
           this.showDisabled = res.is_show_invalid_card_entrance;
-          res.list.map((item) => {
+          res.list = res.list.map((item) => {
             return {
               ...item,
               card_point: this.$xdUniHelper.divisionFloatNumber(
@@ -684,15 +683,12 @@ export default {
           this.hasChangeStatus = this.getCardGroupItem(this.ajaxCardList.list.filter((item) => {
             return item["is_exchange"] === "Y";
           }), res['site_entry_settings']).length > 0;
+
           this.$xdHideLoading();
         })
         .catch(() => this.$xdHideLoading());
     },
 
-    onShow(options) {
-      this.onJfbLoad(options);
-    },
-
     onJfbUpdate(data) {
       this.getContent();
     },

package/src/components/JfbBaseCardInfoEntry/JfbBaseCardInfoEntry.vue

@@ -93,7 +93,7 @@
             style="
               display: flex;
               align-content: center;
-              justify-content: center;
+              justify-content: flex-start;
             "
           >
             <view class="jfb-base-card-info-entry__body-business-content">
@@ -289,7 +289,7 @@ export default {
               }
             });
             if(res && res.site_entry_settings && res.site_entry_settings.length>0) {
-              res.site_entry_settings = res.site_entry_settings.filter(item=>{
+              temp.site_entry_settings = res.site_entry_settings.filter(item=>{
               item['image_url'] = getServiceUrl(item['image_url'])
               return res.business_codes.includes(item.business_code)
             })
@@ -326,7 +326,7 @@ export default {
             }
           });
           if(res && res.site_entry_settings && res.site_entry_settings.length>0) {
-            res.site_entry_settings = res.site_entry_settings.filter(item=>{
+            temp.site_entry_settings = res.site_entry_settings.filter(item=>{
               item['image_url'] = getServiceUrl(item['image_url'])
               return res.business_codes.includes(item.business_code)
             })

package/src/mixins/cardListMixins.js

@@ -1,148 +0,0 @@
-'use strict';
-import {mapState} from "vuex";
-
-export default {
-  data() {
-    return {
-      ajaxCardList: null, //接口返回原始数据
-
-      //卡券列表
-      cardOrgList:[], //原始数据
-      cardList:[], //计算后的卡列表
-      cardPageNum: 0, //当前页面
-      cardPageLen: 5, //每页获取数据调试
-      cardComputedList:[], //当前获取的数据列表
-      cardLoading: false, //加载状态值设置
-      cardNextTop: 0, //计算到每一个节点的距离顶部Top值
-      contentStatus: false, //内容框是否已经进行过计算距离顶部Top值状态
-      hasContent: true, //是否可以进行继续加载状态
-
-      //转换按钮
-      hasChangeStatus: false,//是否有转换按钮
-
-      cardItemBg1: '//img.jufubao.cn/component/card/card_item_02.png',
-      cardItemBg2: '//img.jufubao.cn/component/card/card_item_01.png'
-    }
-  },
-  computed:{
-    ...mapState(['srollPreview'])
-  },
-  watch:{
-    // srollPreview(value){
-    //   console.log(value)
-    // }
-  },
-  created(){
-
-  },
-
-  mounted(){
-
-
-  },
-  methods:{
-    setCardItemShow({height , top},index){
-
-      //预览模式只获取10条
-      if(this.$configProject.isPreview) {
-        console.log(this.cardPageLen, index, this.cardPageLen > index)
-        return this.cardPageLen > index;
-      }
-
-      //打包模式
-      let fiexd = 50;
-      let boxTop = top + height + fiexd;
-      let boxBottom = top - (fiexd);
-      let {pageWindowPrevStart, pageWindowPrevEnd} = this.srollPreview;
-      return boxTop > pageWindowPrevStart && boxBottom < pageWindowPrevEnd;
-    },
-
-    getBoxTop(){
-      return new Promise((resolve, reject)=>{
-        const query = uni.createSelectorQuery().in(this);
-        query.select('.card-content').boundingClientRect(data=>{
-          this.cardNextTop = data.top;
-          this.contentStatus = true;
-          resolve();
-        }).exec()
-      })
-
-    },
-
-    async handleCardComputed(paddingBottom){
-      this.$xdShowLoading({});
-      if(this.contentStatus === false)  await this.getBoxTop();
-      this.$nextTick(()=>{
-        const query = uni.createSelectorQuery().in(this);
-        query.selectAll('.computed-box').boundingClientRect(data => {
-          let arr = data.map(item=>{
-            let card =  this.cardComputedList.filter(it=>{
-              return item.dataset.card === it.card_number;
-            })[0];
-            card['height'] = item.height + (paddingBottom * this.$rpxNum);
-            card['top'] =  this.cardNextTop;
-            this.cardNextTop =  this.cardNextTop + card['height']
-            return card
-          });
-
-
-          this.cardList = this.cardList.concat(arr);
-
-
-
-          this.$xdHideLoading();
-        }).exec();
-      })
-    },
-
-    handleCardInit(cardList,isChange = false, paddingBottom = 30){
-      let newCardList = this.$xdUniHelper.cloneDeep(cardList);
-      let validCardList = this.getCardGroupItem(newCardList.list.filter((item) => {
-        if(isChange === true)  return item["is_valid"] === "Y";
-        else return item["is_exchange"] === "Y";
-      }), newCardList['site_entry_settings']).map((item,index)=>{
-        item['index'] = index;
-        return item
-      });
-      this.cardOrgList = this.$xdUniHelper.cloneDeep(validCardList);
-      this.cardComputedList = this.cardOrgList.slice(this.cardPageNum,this.cardPageLen);
-      this.handleCardComputed(paddingBottom).then().catch();
-    },
-
-    onJfbReachBottom(){
-      if(this.cardLoading || !this.hasContent) return;
-      this.cardLoading = true;
-      this.$xdShowLoading({});
-      this.cardPageNum++;
-      console.log('onJfbReachBottom',this.cardPageNum)
-      this.$nextTick(()=>{
-        setTimeout(()=>{
-          this.cardLoading = false;
-          this.$xdHideLoading();
-          this.cardComputedList = this.cardOrgList.slice(
-            this.cardPageNum*this.cardPageLen,
-            this.cardPageNum*this.cardPageLen + this.cardPageLen
-          );
-          this.handleCardComputed().then().catch();
-          if(this.cardComputedList.length < this.cardPageLen) {
-            this.hasContent = false;
-          }
-        },500)
-      })
-
-    },
-
-    clearDefault(){
-      this.cardOrgList = [];
-      this.cardList = [];
-      this.cardPageNum = 0;
-      this.cardComputedList = [];
-      this.cardLoading = false;
-      this.cardNextTop = 0;
-      this.contentStatus = false;
-      this.hasContent = true;
-    }
-  }
-}
-
-