You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
112 lines
2.9 KiB
Vue
112 lines
2.9 KiB
Vue
<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="">
|
|
<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="item.content==1?'bg-pink':'bg-grey' && item.content==2?'bg-red':'bg-grey' &&item.content==3?'bg-orange':'bg-grey' ">
|
|
<view class="cur" style="width: 15%;">
|
|
<text>{{item.content}}</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.sumAich}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
TabCur: 0,
|
|
daylist:[],
|
|
starList: [{
|
|
content: 1,
|
|
brandNumber: 100023,
|
|
staffName: "疾风弟弟",
|
|
sumAich: 10560
|
|
},
|
|
{
|
|
content: 2,
|
|
brandNumber: 100023,
|
|
staffName: "疾风弟弟",
|
|
sumAich: 10500
|
|
},
|
|
{
|
|
content: 3,
|
|
brandNumber: 100023,
|
|
staffName: "疾风弟弟",
|
|
sumAich: 10160
|
|
},
|
|
{
|
|
content: 4,
|
|
brandNumber: 100023,
|
|
staffName: "疾风弟弟",
|
|
sumAich: 10060
|
|
},
|
|
{
|
|
content: 5,
|
|
brandNumber: 100023,
|
|
staffName: "疾风弟弟",
|
|
sumAich: 10060
|
|
},
|
|
],
|
|
}
|
|
},
|
|
methods: {
|
|
tabSelect(e) {
|
|
this.TabCur = e.currentTarget.dataset.id * 1
|
|
this.starList = []
|
|
if(e.currentTarget.dataset.id * 1==0){
|
|
this.starList= this.daylist
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
this.daylist = this.starList
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.text-main {
|
|
font-size: 28upx;
|
|
height: 80upx;
|
|
width: 100%;
|
|
line-height: 80upx;
|
|
margin-top: 10upx;
|
|
color: #000000;
|
|
}
|
|
</style>
|