<template>
	<view>
		<uni-section class="mb-10" title="业绩查看范围" type="line">
			<uni-datetime-picker v-model="range" type="daterange" @change="change" />
		</uni-section>
		<view class="">
			<uni-card title="业绩排名">
				<uni-list>
					<uni-list-item direction="row" v-for="(item , index) in staffList" :key="index">
						<template #header>
							<view class="avatar-wrap">
								<text class="staff-name">{{ item.createByName?item.createByName:'暂无' }}</text>
							</view>
						</template>
						<template #footer>
							<view style="display: flex;" @tap="goDetail(item)">
								<view style="font-size: 24rpx;display: flex;flex-direction: column;width: 250rpx;">
									<text style="display: inline-block;width: auto;">单数：{{item.totalCount?item.totalCount:'暂无'}}单</text>
									<text style="display: inline-block;width: auto;">总金额：{{item.totalPrice?item.totalPrice:'暂无'}}元</text>
								</view>
								<view style="height: 88rpx;line-height: 88rpx;">
									<uni-icons type="right" size="24"></uni-icons>
								</view>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
			</uni-card>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				range: [],
				name: '',
				staffList:[]
			}
		},
		onLoad() {
			this.getMonth();
			this.getStaffList()
		},
		methods: {
			//改变时间选择
			change(e){
				var start = e[0]
				var end = e[1]
				this.range = [start,end]
				this.getStaffList();
			},
			//获取业绩列表
			getStaffList() {
				this.tui.request('/app/sale/getSalesRankingByShopId', 'post', {
					startTime:this.range[0],
					endTime:this.range[1],
				}, false, false, true).then((res) => {
					if (res.code !== 200) return
					this.staffList = res.result
				})
			},
			//获取当月1日到当前时间
			getMonth() {
				let date = new Date()
				let year = date.getFullYear().toString()
				let month = date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1).toString():(date.getMonth()+1).toString()  //'月'
				let da = date.getDate() < 10 ? '0'+date.getDate().toString():date.getDate().toString()  //'日'
				let end = year + '-' + month + '-' + da 
				let beg = year + '-' + month + '-01' 
				this.range = [beg,end]
			},
			goDetail(item){
				uni.navigateTo({
					url: '/package1/staff/staffSaleDetail?createBy=' + item.createBy+'&range='+JSON.stringify(this.range)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.example-body {}
	.tag-wrap {
		width: 100rpx;
		flex: 1;
		display: flex;
	
		view {
			margin: 0 2upx;
		}
	}
	
	.avatar-wrap {
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 24upx;
	}
</style>