jufubao-movie 1.0.39-beta5 → 1.0.39-beta6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-movie",
-  "version": "1.0.39-beta5",
+  "version": "1.0.39-beta6",
   "private": false,
   "description": "聚福宝在线选座业务组件插件包",
   "main": "index.js",

package/src/components/JfbMovieLineLineSeat/JfbMovieLineLineSeat.vue

@@ -79,7 +79,6 @@
     mixins: [componentsMixins,extsMixins,JfbMovieLineLineSeatMixin],
     data() {
       return {
-        hideMask: true,
         scheduleId: '',
         filmId: '',
         cinemaId: '',

package/src/components/JfbMovieTfkFilmList/ContentItem.vue

@@ -8,48 +8,53 @@
       <image v-if="!errorStatus" :src="item['poster']" :alt="item['show_name']" @error="handleError()" ></image>
     </view>
     <view class="middle">
-      <view class="name">{{item['show_name']}}</view>
-      <view class="other">类型：{{item['type']}}</view>
-      <view class="other">导演：{{item['director']}}</view>
-      <view class="other">主演：{{item['leading_role']}}</view>
-    </view>
-    <view class="right">
-      <view class="score">
-        <template v-if="item['remark']">
-          <text>评分：</text><text :style="{color:color}">{{item['remark']}}</text>
-        </template>
+      <view class="top">
+        <view class="name">{{item['show_name']}}</view>
+        <view class="score">
+          <template v-if="item['remark']">
+            <text>评分：</text><text :style="{color:color}">{{item['remark']}}</text>
+          </template>
+        </view>
       </view>
-      <view class="btn">
-        <template v-if="type === 'hot'">
-          <xd-button
-            v-if="item['show_button'] === '1'"
-            type="primary"
-            style="display:block;"
-            size="small"
-            @click.stop="handleBuy(item)">购票</xd-button>
-          <xd-button
-            v-else-if="item['show_button'] === '2'"
-            type="subPrimary"
-            style="display:block;"
-            size="small"
-            @click="handleBuy(item)">预售</xd-button>
-        </template>
-        <template v-if="type === 'rightnow'">
-          <xd-button
-            v-if="item['show_button'] === '3'"
-            type="success"
-            style="display:block;"
-            size="small"
-            @click.stop="handleDetail(item)"
-          >想看</xd-button>
-          <xd-button
-            v-else-if="item['show_button'] === '2'"
-            type="subPrimary"
-            style="display:block;"
-            size="small"
-            @click.stop="handleBuy(item)">预售</xd-button>
-        </template>
+      <view class="bottom">
+        <view>
+          <view class="other">类型：{{item['type']}}</view>
+          <view class="other">导演：{{item['director']}}</view>
+          <view class="other">主演：{{item['leading_role']}}</view>
+        </view>
+        <view class="btn">
+          <template v-if="type === 'hot'">
+            <xd-button
+              v-if="item['show_button'] === '1'"
+              type="primary"
+              style="display:block;"
+              size="small"
+              @click.stop="handleBuy(item)">购票</xd-button>
+            <xd-button
+              v-else-if="item['show_button'] === '2'"
+              type="subPrimary"
+              style="display:block;"
+              size="small"
+              @click="handleBuy(item)">预售</xd-button>
+          </template>
+          <template v-if="type === 'rightnow'">
+            <xd-button
+              v-if="item['show_button'] === '3'"
+              type="success"
+              style="display:block;"
+              size="small"
+              @click.stop="handleDetail(item)"
+            >想看</xd-button>
+            <xd-button
+              v-else-if="item['show_button'] === '2'"
+              type="subPrimary"
+              style="display:block;"
+              size="small"
+              @click.stop="handleBuy(item)">预售</xd-button>
+          </template>
+        </view>
       </view>
+
     </view>
   </view>
 </template>
@@ -125,50 +130,89 @@
   }
   .middle {
     flex: 1;
-    & .name {
-      font-size: 36rpx;
-      font-weight: 600;
+
+    & .top {
+      display: flex;
+      justify-content: space-between;
+      align-items: flex-end;
       margin-bottom: 20rpx;
-      .uni-max-cut(2, 90);
-      line-height: 45rpx;
-    }
 
-    & .other {
-      font-size: 25rpx;
-      color: #999;
-      .uni-max-cut(1,36);
-      line-height: 36rpx;
-      margin-bottom: 10rpx;
-      &:last-child {
-        margin-bottom: 0!important;
+      & > view:first-child{
+        flex: 1;
+        font-size: 36rpx;
+        font-weight: 600;
+        .uni-max-cut(2, 90);
+        line-height: 45rpx;
+      }
+      & >view:nth-child(2) {
+        flex-shrink: 0;
+        height: 45rpx;
+        line-height: 45rpx;
+        margin-left: 20rpx;
+        text-align: right;
+        & > text:nth-child(1) {
+          font-size: 20rpx;
+        }
+        & > text:nth-child(2) {
+          font-size: 28rpx;
+        }
       }
     }
-  }
 
-  .right {
-    flex-shrink: 0;
-    display: flex;
-    align-content: space-between;
-    align-items: flex-end;
-    justify-content: flex-end;
-    flex-flow: wrap;
-    box-sizing: border-box;
-    width: 160rpx;
-    height: 200rpx;
+    & .bottom {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
 
-    & .score {
-      height: 40rpx;
-      width:100%;
-      text-align: right;
-      & > text:nth-child(1) {
-        font-size: 20rpx;
-      }
-      & > text:nth-child(2) {
-        font-size: 28rpx;
+      & > view:first-child {
+        flex: 1;
+        & > view {
+          font-size: 25rpx;
+          color: #999;
+          .uni-max-cut(1,36);
+          line-height: 36rpx;
+          margin-bottom: 10rpx;
+          &:last-child {
+            margin-bottom: 0!important;
+          }
+        }
       }
 
+      & .btn {
+        width: 140rpx;
+        flex-shrink: 0;
+        margin-left: 20rpx;
+      }
     }
+    //& .name {
+    //  font-size: 36rpx;
+    //  font-weight: 600;
+    //  margin-bottom: 20rpx;
+    //  .uni-max-cut(2, 90);
+    //  line-height: 45rpx;
+    //}
+    //
+    //& .other {
 
+    //}
   }
+
+  //.right {
+  //  flex-shrink: 0;
+  //  display: flex;
+  //  align-content: space-between;
+  //  align-items: flex-end;
+  //  justify-content: flex-end;
+  //  flex-flow: wrap;
+  //  box-sizing: border-box;
+  //  width: 160rpx;
+  //  height: 200rpx;
+  //
+  //  & .score {
+
+  //
+  //  }
+  //
+  //}
 }
 </style>

package/src/components/JfbMovieTfkFilmList/JfbMovieTfkFilmList.vue

@@ -471,7 +471,6 @@
         if (JSON.stringify(value) === JSON.stringify(oldValue)) return;
         if (this.$configProject['isPreview']) this.init(value)
       },
-
       posterNum(){
         if (this.$configProject['isPreview']){
           this.onJfbLoad();
@@ -876,10 +875,7 @@
       },
 
       onJfbScroll(options){
-        if(!this.pageToken || this.dataList === null) return false;
-        if(this.type === 'hot' || this.type === 'rightnow'){
-          this.virtualList.onScrollEvent(options.e.scrollTop);
-        }
+        this.virtualList.onScrollEvent(options.e.scrollTop);
       },
 
       setShowTypeList(){

package/src/components/JfbMovieTfkFilmRecommend/JfbMovieTfkFilmRecommend.vue

@@ -182,7 +182,6 @@
     ],
     data() {
       return {
-        hideMask: true,
         options: {},
         type:'', //hot rightnow
         typeList:{hot:{label: '热映影片', value: 'hot'},rightnow:{label: '即将上映', value: 'rightnow'}},

package/src/lib/VirtualList.js

@@ -1,12 +1,13 @@
 'use strict';
 //原点对象
 let __orgUpdateTop = null;
+let idx = 0;
 
 export default class VirtualList {
   virtualType='fixed';
   virtualBufferHeight= 300;
   virtualFixedItemHeight; //固定模式高度设置
-  virtualVue; //当前组件vm实例
+  //virtualVue; //当前组件vm实例(小程序不可用)
   virtualTotalData=[]; //数组长度
   virtualHeightObj = {}; //高度序列index: {max:xx,min:xx}
   $el= null; //开始点元素
@@ -22,7 +23,9 @@ export default class VirtualList {
   top=0;
   bottom=0;
   virtualCallback=  ()=>{};
-  status= false
+  status= false;
+  options = null;
+
 
   /**
    * @description 初始化或者重置对象
@@ -35,59 +38,63 @@ export default class VirtualList {
    * @param params.otherHeight {number} 其他高度(rpx)
    * @param params.callback {Function} 回调方法
    */
-  constructor($vm,$el, params ) {
-    this.virtualVue = $vm;
-    this.virtualBufferHeight = 480 *  this.virtualVue.$rpxNum;
+  constructor($vm ,$el, params ) {
+    this.options = params;
+    this.virtualBufferHeight = 480 *  $vm.$rpxNum;
     if(params.type && ['auto','fixed'].includes(params.type)) this.virtualType = params.type;
-    if(params.bufferHeight) this.virtualBufferHeight = params.bufferHeight * this.virtualVue.$rpxNum;
-    if(params.otherHeight) this.otherHeight = params.otherHeight * this.virtualVue.$rpxNum;
+    if(params.bufferHeight) this.virtualBufferHeight = params.bufferHeight * $vm.$rpxNum;
+    if(params.otherHeight) this.otherHeight = params.otherHeight * $vm.$rpxNum;
     if(this.virtualType === 'fixed'){
       if(params.fixedHeight === undefined) throw new Error(`FixedHeight is require, got is ${params.fixedHeight}`);
-      else this.virtualFixedItemHeight = params.fixedHeight * this.virtualVue.$rpxNum;
+      else this.virtualFixedItemHeight = params.fixedHeight * $vm.$rpxNum;
     }
     this.virtualTotalData = [];
-    this.virtualVue.virtualViewData = null;
     this.$el = $el;
-    this.virtualVue.$nextTick(()=>{
+    $vm.$nextTick(()=>{
       this.checkOffsetTop();
     });
     this.screenHeight = uni.getSystemInfoSync().safeArea.height;
     if(typeof params.callback !== 'function') {
       throw new Error(`FixedHeight is require, got is ${params.fixedHeight}`);
     }else this.virtualCallback = params.callback;
-
   }
 
+  /**
+   * @description 获取原点的偏移量
+   */
   checkOffsetTop(){
-    if(__orgUpdateTop) {
-      this.orgUpdateTop = __orgUpdateTop;
-      this.status = true;
-      return;
-    }
+
     //相对了10次不在检查
-    if(this.eqMaxTimer >= 3) {
+    if(this.eqMaxTimer >= 5) {
       this.status = true;
-      __orgUpdateTop = this.orgUpdateTop;
       return
     }
-    if(this.virtualVue.$refs[this.$el]) {
-      let offsetTop =  this.virtualVue.$refs[this.$el].$el.getBoundingClientRect().top;
+
+    this.options.getDom(this.$el).then(res=>{
+      let offsetTop =  res.top
       if(this.offsetTop === offsetTop) {
         this.eqMaxTimer++;
       }
       else this.offsetTop = offsetTop;
       this.orgUpdateTop = offsetTop + this.otherHeight;
       if(this.virtualType === 'fixed') this.computedMinAndMaxFixed();
-    }
-    setTimeout(()=>{
-      this.checkOffsetTop();
-    }, 200)
+      setTimeout(()=>{
+        this.checkOffsetTop();
+      }, 100)
+    }).catch(res=>{
+      setTimeout(()=>{
+        this.checkOffsetTop();
+      }, 100)
+    })
   }
 
   cloneDeep(data){
     return JSON.parse(JSON.stringify(data));
   }
 
+  /**
+   * @description 固定高度模式初始化列表记录范围
+   */
   computedMinAndMaxFixed(){
     let itemHeight = this.virtualFixedItemHeight;
     this.virtualTotalData.map((item,index)=>{
@@ -107,32 +114,62 @@ export default class VirtualList {
     });
   }
 
+  /**
+   * @description 新增数据时候调用此方法（对外）
+   * @param data {Array} 列表数据
+   * @param height {Array} 高度数组
+   */
   pushVirtualData(data, height){
-    //清空响应对象
-    this.virtualVue.virtualViewData = null;
-    if(this.virtualTotalData.length > 0) this.isFirst = false;
-
-    //非固定模式
-    if(this.virtualType === 'auto') {
-      if(!height) throw new Error(`height is require, got is ${height}`);
-      this.virtualHeightObj = Object.assign({},this.virtualHeightObj, this.cloneDeep(height));
-    }
+    if(this.status) {
+      // data = data.map((item,index)=>{
+      //   return {
+      //     ...item,
+      //     show_name: `【${idx} - ${index}】${item.show_name}`,
+      //   }
+      // });
+      idx++;
+      //清空响应对象
+      if(this.virtualTotalData.length > 0) this.isFirst = false;
+
+      //非固定模式
+      if(this.virtualType === 'auto') {
+        if(!height) throw new Error(`height is require, got is ${height}`);
+        this.virtualHeightObj = Object.assign({},this.virtualHeightObj, this.cloneDeep(height));
+      }
+
+      //固定模式
+      if(this.virtualType === 'fixed') {
+        this.virtualTotalData = this.virtualTotalData.concat(this.cloneDeep(data));
+        this.computedMinAndMaxFixed();
+        if(this.isFirst) this.onScrollEvent(0);
+      }
 
-    //固定模式
-    if(this.virtualType === 'fixed') {
-      this.virtualTotalData = this.virtualTotalData.concat(this.cloneDeep(data));
-      this.computedMinAndMaxFixed();
-      if(this.isFirst) this.onScrollEvent(0);
+      this.isFirst = false
+    }
+    else {
+      setTimeout(()=>{
+        this.pushVirtualData(data, height)
+      },100)
     }
 
-    this.isFirst = false
   }
 
   /**
-   * @description 滚动事件
+   * @description 滚动事件（对外）
    * @param scrollTop
    */
   onScrollEvent(scrollTop) {
+    //console.log('onScrollEvent',scrollTop)
+    if(!this.status || this.virtualTotalData.length === 0) {
+      /**@type Function **/
+      this.virtualCallback({
+        paddingTop:0,
+        paddingBottom: 0,
+        data: []
+      });
+      return;
+    }
+
     //非固定计算索引
     let time = new Date().getTime();
     //计算开始索引
@@ -170,14 +207,41 @@ export default class VirtualList {
 
     this.top = this.virtualHeightObj[this.startIndex].min - this.orgUpdateTop.toString() + 'px'
     this.bottom = this.virtualHeightObj[this.virtualTotalData.length-1].max - this.virtualHeightObj[this.endIndex-1].max.toString() + 'px'
-    console.log('onScrollEvent.index',this.endIndex - this.startIndex, this.startIndex,this.endIndex, this.top, this.bottom)
+    console.log('onScrollEvent.index',this.endIndex - this.startIndex, this.startIndex,this.endIndex, this.top, this.bottom);
+
 
     /**@type Function **/
     this.virtualCallback({
-      paddingTop:this.top,
+      paddingTop: this.top,
       paddingBottom: this.bottom,
-      data:this.cloneDeep(this.virtualTotalData).slice(this.startIndex, this.endIndex + 1)}
-    );
+      data: this.cloneDeep(this.virtualTotalData).slice(this.startIndex, this.endIndex + 1)
+    });
+  }
+
+  /**
+   * @description 切换Tab调用此方法（对外）
+   * @param virtualType {string} 类型
+   * @param $vm {Vue} vue实例 (在自动高度模式必选)
+   * @param ref 元素对象 (在自动高度模式必选)
+   */
+  onChangeTab($vm , ref , virtualType = 'fixed'){
+    this.virtualTotalData = [];
+    this.isFirst = true;
+
+    //改变顶部偏移量元素
+    if(virtualType && virtualType !== this.virtualType) {
+      if(!$vm)  throw new Error(`$vm is require, got is ${$vm.$xdUniHelper.checkVarType($vm)},value is ${$vm}`);
+      if(!ref)  throw new Error(`ref is require, got is ${$vm.$xdUniHelper.checkVarType(ref)}, value is ${ref}`);
+      this.virtualType = virtualType;
+      if(type === 'auto' && $vm && ref) {
+        this.$el = ref;
+        this.status = false;
+        this.eqMaxTimer = 3;
+        $vm.$nextTick(()=>{
+          this.checkOffsetTop();
+        });
+      }
+    }
   }
 }