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.

138 lines
3.7 KiB
Vue

<template>
<view class="todaystar ">
<scroll-view scroll-x class="bg-white nav text-center ">
<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: 5%;">
</view>
<view class="text-header" style="width: 50%;">
<text>项目名称</text>
</view>
<view class="text-header" style="width: 30%;">
<text v-show="TabCur==1"></text>
<text v-show="TabCur==2"></text>
<text v-show="TabCur==3"></text>
</view>
<view class="text-header" style="width:15%;">
<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: 5%;">
<text>{{index+1}}</text>
</view>
<view class="text-header" style="width: 50%;">
<text>{{item.projectName}}</text>
</view>
<view class="text-header" style="width: 25%;">
<text>{{item.projectStatisticMoney}}</text>
</view>
<view class="text-header" style="width: 20%;">
<text>{{item.ratio}}</text>
</view>
</view>
</view>
</view>
</template>
<script>
import host from '../../../../utils/host.js'
export default {
data() {
return {
TabCur: 3,
userInfo: {},
daylist: [],
starList: [{
index: 1,
brandNumber: 100023,
staffName: "疾风弟弟",
commissionAmount: 10560
},
],
}
},
methods: {
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id * 1
this.starList = []
this.projectList()
},
projectList() {
var that = this
var formData = {type:this.TabCur,storeId:this.userInfo.storeId}
uni.request({
url: host + '/demay/ssm/staff/projectList', // 请求接口
data: formData, // 发送参数
method: 'post', // 参数类型
header: {
'content-type': 'application/x-www-form-urlencoded',
'token':that.userInfo.token
}, // 请求头
dataType: 'json', // 返回数据格式
success(response) {
//console.log(response.data.rows);
that.starList = response.data.rows
that.starList.forEach(item=>{
// if(item.projectName=='十八岁'){
// item.projectName='精品面部保养S疗'
// }
// if(item.projectName=='返老还童'){
// item.projectName='高端SPS全身护理'
// }
item.ratio =( item.ratio*100).toFixed(2)*1+'%'
})
},
fail(error) {
},
complete(com) {
}
})
}
},
onShow: function() {
this.userInfo = uni.getStorageSync("userInfo")
this.projectList()
},
onPullDownRefresh: function() {
setTimeout(function() {
uni.stopPullDownRefresh();
}, 1000);
},
}
</script>
<style>
.text-main {
font-size: 28upx;
height: 80upx;
width: 100%;
line-height: 80upx;
margin-top: 10upx;
color: #000000;
}
</style>