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.

248 lines
6.7 KiB
Vue

<template>
<view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>当前月份</text>
</view>
<scroll-view scroll-x class=" nav">
<view class="flex text-center">
<view v-for="(item,index) in list" :key='index' class="cu-item light flex-sub "
:class="[TabCur==item.type?'bg-cyan text-whit':'']" @tap="tabSelect"
:data-id="item.type">
<text>{{item.monthName}}</text>
</view>
</view>
</scroll-view>
<!-- <picker fields="month" mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
<button class="cu-btn bg-green shadow margin-right" data-target="Modal">{{date}}</button>
</picker> -->
</view>
<!-- <view class="cu-bar bg-white margin-top">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>员工职位</text>
</view>
<text class="margin-right">{{form.job}}</text>
</view> -->
<view class="cu-bar bg-white margin-top" v-show="form.baseSalary!=null">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>底薪</text>
</view>
<text class="margin-right text-price text-red">{{form.baseSalary}}</text>
</view>
<view class="cu-bar bg-white margin-top" @click="onCLick(0)">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>充值</text>
</view>
<text class="margin-right text-price text-red">{{form.recComm}}</text>
</view>
<view class="cu-bar bg-white margin-top" @click="onCLick(1)">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>疗程</text>
</view>
<text class="margin-right text-price text-red">{{form.courseComm}}</text>
</view>
<view class="cu-bar bg-white margin-top" @click="onCLick(2)">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>服务</text>
</view>
<text class="margin-right text-price text-red">{{form.cashComm}}</text>
</view>
<view class="cu-bar bg-white margin-top" @click="onCLick(3)">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>还款</text>
</view>
<text class="margin-right text-price text-red">{{form.repayComm}}</text>
</view>
<view class="cu-bar bg-white margin-top" @click="onCLick(4)">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>充值退</text>
</view>
<text class="margin-right text-price text-red">{{form.recRefundComm}}</text>
</view>
<view class="cu-bar bg-white margin-top" @click="onCLick(5)">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>疗程退</text>
</view>
<text class="margin-right text-price text-red">{{form.courseRefundComm}}</text>
</view>
<view class="cu-bar bg-white margin-top" @click="onCLick(6)">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>消费退</text>
</view>
<text class="margin-right text-price text-red">{{form.cashRefundComm}}</text>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>总提成</text>
</view>
<text class="margin-right text-price text-red">{{form.commSalary}}</text>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="cuIcon-titles text-red"></text>
<text>合计</text>
</view>
<text
class="margin-right text-price text-red">{{((form.baseSalary==null?0:form.baseSalary)+form.commSalary).toFixed(2)*1}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
const currentDate = this.getDate({
format: true
})
return {
userInfo: {},
TabCur: 0,
date: currentDate,
form: {
staffName: "刘乐乐",
job: 5,
basePay: 1800,
performance: 156000,
royalty: 3200,
close: 5000
},
staffForm: {},
list: [{}, {}, {}]
}
},
computed: {
startDate() {
return this.getDate('start');
},
endDate() {
return this.getDate('end');
}
},
methods: {
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id * 1;
this.form.type = this.TabCur
},
onCLick(key) {
this.form.classify = key
uni.navigateTo({
url: '../../../myHome/sales-commission/detail/detail?form='+ JSON.stringify(this.form)
});
},
getDate(type) {
//获取时间
const date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
if (type === 'start') {
month = month - 2;
} else if (type === 'end') {
month = month
}
month = month > 9 ? month : '0' + month;;
return `${year}-${month}`;
},
bindDateChange: function(e) {
this.date = e.target.value
this.salaryByStaff()
},
salaryByStaff() {
console.log(this.staffForm);
let date = this.date
var form = {
storeId: this.userInfo.storeId,
storeName: this.userInfo.storeName,
brandNumber: this.userInfo.brandNumber,
date: date
}
if (this.staffForm.storeId != undefined) {
form.staffId = this.staffForm.staffId,
form.staffName = this.staffForm.staffName
} else {
form.staffId = this.userInfo.id,
form.staffName = this.userInfo.staffName
}
this.$api.salaryByStaff(form).then(res => {
if (res.code == '000000') {
this.form = res.data
} else {
uni.showModal({
title: '提示',
content: res.message,
showCancel: false,
success: function(res) {}
})
}
})
},
listDates(data) {
var nowdays = new Date();
var year = nowdays.getFullYear();
var month = nowdays.getMonth() + 1 - data;
var day = nowdays.getDate()
var hours = nowdays.getHours()
var min = nowdays.getMinutes()
var sec = nowdays.getSeconds()
if (month == 0) {
month = 12;
year = year - 1;
}
if (month < 10) {
month = '0' + month;
}
return year + '-' + month
},
},
onLoad: function(option) {
this.userInfo = uni.getStorageSync('userInfo')
console.log(option.item);
if (option.item != undefined) {
var item = JSON.parse(option.item)
uni.setNavigationBarTitle({
title: item.staffName + '工资明细'
})
this.staffForm = item
}
},
onShow: function() {
this.salaryByStaff()
this.list.forEach((item, index) => {
item.monthName = this.listDates(index)
item.type = index
})
this.form.type = this.TabCur
},
onPullDownRefresh: function() {
setTimeout(function() {
uni.redirectTo({
url: './salary'
})
uni.showToast({
title: '刷新成功',
icon: 'success',
duration: 2000
});
uni.stopPullDownRefresh();
}, 500);
},
}
</script>
<style>
</style>