<template>
	<view class="todaystar ">
		<!-- 	<scroll-view scroll-x class="bg-white nav text-center ">
			<view class="cu-item" :class="TabCur==0?'text-white light bg-red':''" @tap="tabSelect" :data-id="0">今日</view>
			<view class="cu-item" :class="TabCur==1?'text-white light bg-red':''" @tap="tabSelect" :data-id="1">作日</view>
			<view class="cu-item" :class="TabCur==2?'text-white light bg-red':''" @tap="tabSelect" :data-id="2">本月</view>
			<view class="cu-item" :class="TabCur==3?'text-white light bg-red':''" @tap="tabSelect" :data-id="3">上月</view>
		</scroll-view> -->
		<view class=" margin-top " style="padding: 10upx;">
			<view style="margin: 10upx auto;"
				class="bg-red flex solid-bottom padding justify-start text-white text-center">
				<view class="text-header" style="width: 15%;">
					<text>排名</text>
				</view>
				<view class="text-header" style="width: 25%;">
					<text>水牌号</text>
				</view>
				<view class="text-header" style="width: 25%;">
					<text>员工</text>
				</view>
				<view class="text-header" style="width: 35%;">
					<text>总业绩</text>
				</view>
			</view>
			<view v-if="starList.length==0">
				<view class='empty cuIcon-info'></view>
				<view class='empty-text text-gray'>暂无数据</view>
			</view>
			<view class=" light flex justify-start text-black text-center text-main" v-for="(item,index) in  starList"
				:key='index'
				:class="index+1==1?'bg-pink':'bg-grey' && index+1==2?'bg-red':'bg-grey' &&index+1==3?'bg-orange':'bg-grey' ">
				<view class="cur" style="width: 15%;">
					<text>{{index+1}}</text>
				</view>
				<view class="text-header" style="width: 25%;">
					<text>{{item.brandNumber}}</text>
				</view>
				<view class="text-header" style="width: 25%;">
					<text>{{item.staffName}}</text>
				</view>
				<view class="text-header" style="width: 35%;">
					<text>{{item.commissionAmount}}</text>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				TabCur: 0,
				userInfo: {},
				daylist: [],
				starList: [{
						index: 1,
						brandNumber: 100023,
						staffName: "疾风弟弟",
						commissionAmount: 10560
					},
					{
						index: 2,
						brandNumber: 100023,
						staffName: "疾风弟弟",
						commissionAmount: 10500
					},
					{
						index: 3,
						brandNumber: 100023,
						staffName: "疾风弟弟",
						commissionAmount: 10160
					},
					{
						index: 4,
						brandNumber: 100023,
						staffName: "疾风弟弟",
						commissionAmount: 10060
					},
					{
						index: 5,
						brandNumber: 100023,
						staffName: "疾风弟弟",
						commissionAmount: 10060
					},
				],
			}
		},
		methods: {
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id * 1
				this.starList = []
				if (e.currentTarget.dataset.id * 1 == 0) {
					this.starList = this.daylist
				}
			},

			achiCommList() {
				this.$api.staffDayList({
					storeId: this.userInfo.storeId,
				}).then(res => {
					console.log(res);
					if (res.code == '000000') {
						this.starList = res.rows
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 2000
						});
					}

				})
			}
		},
		onShow: function() {
			this.daylist = this.starList
			this.userInfo = uni.getStorageSync("userInfo")
			this.achiCommList()
		},
		onPullDownRefresh: function() {
			setTimeout(function() {
				uni.redirectTo({
					url: './todays-star'
				})
				uni.showToast({
					title: '刷新成功',
					icon: 'success',
					duration: 2000
				});
				uni.stopPullDownRefresh();
			}, 1000);
		},


	}
</script>

<style>
	.text-main {
		font-size: 28upx;
		height: 80upx;
		width: 100%;
		line-height: 80upx;
		margin-top: 10upx;
		color: #000000;
	}
</style>
