jje_spread_uniapp/pages/spreadRankingList/spreadRankingList.vue

<template>
  <view class="page">
    <!-- #ifdef H5-->
    <uni-nav-bar v-if="!$isWxBrowser()" :fixed="true" background-color="#FFE05C" :border="false" :statusBar="false"
                 left-icon="left" title="拓客排行榜" @clickLeft="back"/>
    <!-- #endif -->

    <view class="example-body">
      <uni-datetime-picker v-model="range" type="daterange" @change="maskClick"/>

    </view>
    <view :style="{height:height}">
      <mescroll-item ref="MescrollItem" @call-father="maskClick(range)" :i="0" :index="0" :rankDate='rankDate' :height="height">
      </mescroll-item>
    </view>


    <!--#ifdef H5-->
    <liu-drag-button v-if="$isWxBrowser()" @clickBtn="back">返回</liu-drag-button>
    <!--#endif-->
  </view>
</template>

<script>
import MescrollItem from "./module/mescrollUni-item.vue";

export default {
  components: {
    MescrollItem
  },
  data() {
    return {
      height: '',
      rankDate: null,
      range: null,
    }
  },
  onLoad(e) {
    this.getRanking()
    let sysInfo = uni.getSystemInfoSync()
    this.height = sysInfo.windowHeight - 50 + 'px' //除标题栏栏外的屏幕可用高度
  },
  methods: {
    getRanking(date) {
      this.$api.service.getRank(date).then((res) => {
        this.rankDate = res.data.data
      })
    },
    maskClick(e) {
      let date = null
      if (e) {
        this.range = e
      }
      if(this.range &&this.range.length > 0){
        date = {
          startDate: this.range[0],
              endDate: this.range[1],
        }
      }else {
        date = null
      }
      this.getRanking(date)
    },
    back() {
      let pages = getCurrentPages()
      if (pages.length > 1) {
        uni.navigateBack({
          delta: 1,
          fail: err => {
            console.log(err)
          }
        })
      } else {
        uni.switchTab({
          url: '/pages/my/my'
        });
      }
    },

  }
}
</script>

<style>

</style>