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" :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)=>{
          console.log(res)
          this.rankDate = res.data.data
        })
      },
      maskClick(e){
        console.log('maskClick事件:', e,this.range);
        const date = {
          startDate:this.range[0],
          endDate:this.range[1],
        }

        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>