Skip to content

C
CRM
Commit 1a484436 authored by youjie's avatar youjie
Browse files
Options

no message

parent 01c8a3d0
Hide whitespace changes
Inline Side-by-side
Showing with 376 additions and 2 deletions
src/components/dev/payroll.vue
View file @ 1a484436
......@@ -105,11 +105,9 @@
</template>
<script>
import inAccordanceWith from "../dialogModel/inAccordanceWithDialog"
import commissionPopUp from "../dialogModel/commissionPopUp"
export default {
components:{
inAccordanceWith,
commissionPopUp
},
data() {
......
src/components/dialogModel/inAccordanceWithDialog.vue 0 → 100644
View file @ 1a484436
<style scoped>
.CM_look {
padding: 4px !important;
position: relative;
top: 1px;
}
.opUl li {
display: inline-block;
margin: 10px 15px 10px 0;
}
.domesticCommissionUser .opUl li input{
height: 34px !important;
}
.domesticCommissionUser .singeRowTable{
/* position: absolute; */
}
.domesticCommissionUser .singeRowTable tr td {
padding: 8px 5px;
}
.domesticCommissionUser .hoverSpan span:hover {
cursor: pointer;
text-decoration: underline;
color: red;
}
.text-fixed{
/* height: 100%;
position: absolute;
left: 0;
top: 0; */
}
.cursor-p{
cursor: pointer;
}
.cursor-p:hover{
color: #409EFF;
}
.ITUDWageMoney-box{
margin-top: 20px;
margin-bottom: 10px;
}
.ITUDschedule-Box-box{
display: flex;
flex-direction: row;
justify-content: space-between;
}
.ITUDschedule-box{
flex: 1;
display: flex;
flex-direction: column;
}
.ITUD-title{
margin-top: 10px;
margin-bottom: 10px;
}
.progress-box{
flex: 1;
display: flex;
flex-direction: row;
}
.relative-position{
flex: 1;
margin-right: 0;
position: relative;
}
/deep/.relative-position .el-progress-bar__outer{
border-radius: 0 !important;
}
/deep/.relative-position .el-progress-bar__inner{
border-radius: 0 !important;
}
.ITUD-text-box{
position: relative;
}
.ITUD-text{
position: absolute;
z-index: 999;
color: red;
}
.rate-box {
position: absolute;
top: 30px;
left: 50%;
transform: translateX(-50%);
color: #000;
z-index: 9;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.sanjiao {
width: 0;
height: 0;
margin-left: 5%;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
border-bottom: 3px solid #CACACA;
}
.rate {
min-width: 20px;
padding: 2px 6px;
background-color: #CACACA !important;
display: flex;
justify-content: center;
align-items: center;
color: #666666;
font-size: 0.62vw;
font-family: PingFang SC;
border-radius: 7px;
line-height:12px;
white-space:nowrap;
}
.active-rate{
background-color: #FF7262 !important;
color: #FFFFFF !important;
}
.clickCp{
cursor: pointer;
color: #2961fe;
}
</style>
<template>
<div class="flexOne domesticCommissionUser">
<template>
<div
class="cm_content"
style="width: 100%;margin-bottom: 35px;margin-top: 30px;"
>
<div class="ITUDWageMoney-box" style="margin-bottom: 20px;">
<span>姓名：{{EmName}}</span>
</div>
<table
class="po_content singeRowTable"
style="border:1px solid #E6E6E6;"
cellspacing="0"
cellpadding="0"
v-loading="loading">
<tr>
<th>期数</th>
<th>类型</th>
<th>利润</th>
<th>引流数量</th>
<th>成交订单</th>
</tr>
<tr v-for="(item,index) in commissionratioList.List"
:key="index">
<td>{{item.Month}}</td>
<td>{{item.EmpType!=1?'引流':'销售'}}</td>
<td>{{item.ProfitMoney}}</td>
<td>{{item.EmpType!=1?item.LureNum:'-'}}</td>
<td>{{item.EmpType!=1?item.OrderNum:'-'}}</td>
</tr>
<tr>
<td>平均</td>
<td>-</td>
<td>{{commissionratioList.AvgProfit}}</td>
<td>{{commissionratioList.AvgLureNum}}</td>
<td>{{commissionratioList.AvfOrderNum}}</td>
</tr>
</table>
<div class="ITUDschedule-Box-box">
<div class="ITUDschedule-box">
<div class="ITUDWageMoney-box">
<span>追加工资：{{commissionratioList.WageMoney}}</span>
</div>
<div class="progress-box">
<div v-for="(item,index) in commissionratioList.WageRateList" :key="index"
class="relative-position">
<el-progress :text-inside="true" :stroke-width="20"
:percentage="setItemProgress(item)"
:status="setItemStatus(item)"
:format="setItemTextW(item)"
:color="commissionratioList.WageMoney>=item.Rate?colorlists[Math.floor(Math.random()*10)]
:colors[Math.floor(Math.random()*10)]">
</el-progress>
<div class="rate-box">
<div class="sanjiao" :style="{'border-bottom-color':commissionratioList.WageMoney>=item.Rate?'#FF7262':'#CACACA'}"></div>
<div class="rate full-width" :class="{'active-rate':commissionratioList.WageMoney>=item.Rate}">
<i class="el-icon-check" style="font-size:8px"></i> + {{item.Rate}}
</div>
</div>
</div>
</div>
</div>
<div class="ITUDschedule-box" style="margin-left: 20px;">
<div class="ITUDWageMoney-box">
<span>提成比例：{{commissionratioList.CommissionRate}}%</span>
</div>
<div class="progress-box">
<div v-for="(item,index) in commissionratioList.CommissionRateList" :key="index"
class="relative-position">
<el-progress :text-inside="true" :stroke-width="20"
:percentage="setItemProgress(item)"
:status="setItemStatus(item)"
:format="setItemText(item)"
:color="commissionratioList.CommissionRate>=item.Rate?colorlists[Math.floor(Math.random()*10)]:colors[Math.floor(Math.random()*10)]">
</el-progress>
<div class="rate-box">
<div class="sanjiao" :style="{'border-bottom-color':commissionratioList.CommissionRate>=item.Rate?'#FF7262':'#CACACA'}"></div>
<div class="rate full-width" :class="{'active-rate':commissionratioList.CommissionRate>=item.Rate}">
<i class="el-icon-check" style="font-size:8px"></i> {{item.Rate}}%
</div>
<!-- <div class="sanjiao" :style="{'border-bottom-color':commissionratioList.AvgLureNum>item.StartValue&&
commissionratioList.AvfOrderNum>item.EndValue?'#FF7262':'#CACACA'}"></div>
<div class="rate full-width" :class="{'active-rate':commissionratioList.AvgLureNum>item.StartValue&&
commissionratioList.AvfOrderNum>item.EndValue}">
<i class="el-icon-check" style="font-size:8px"></i> {{item.Rate}}%
</div> -->
</div>
</div>
</div>
</div>
</div>
</div>
<div v-if="!commissionratioList"
style="width: 100%;border:1px solid #fff;display: flex;align-items: center;justify-content: center;height: 60px;margin-top: 30px;"
>暂无数据</div>
</template>
</div>
</template>
<script>
export default {
props:{
msgNew: {
type: Object,
default: null
},
},
data() {
return {
msg:{},
EmName:'',
EmpType:'',
commissionratioList:[],//提成比例
outerVisible:false,//提成比例弹窗
loading: false,
titleList:[
{name:'不限',id:'-1'},
{name:'引流',id:'2'},
{name:'销售',id:'1'}
],
colors: [
'rgba(42, 48, 54,.2)',
'rgba(138, 24, 48,.2)',
'rgba(200, 138, 131,.2)',
'rgba(84, 221, 226,.2)',
'rgba(178, 199, 168,.2)',
'rgba(16, 195, 195,.2)',
'rgba(0, 21, 68,.2)',
'rgba(226, 166, 198,.2)',
'rgba(278,17,66,.2)',
'rgba(153, 199, 235,.2)',
'rgba(34,184,221,.2)',
'rgba(221,72,34,.2)',
'rgba(204,51,204,.23)',
'rgba(255,204,0,.2)',
'rgba(77,179,179,.2)',
'rgba(196,60,141,.2)',
'rgba(195,90,141,.2)',
],
colorlists: [
'rgba(42, 48, 54, 1)',
'rgba(138, 24, 48, 1)',
'rgba(200, 138, 131, 1)',
'rgba(84, 221, 226, 1)',
'rgba(178, 199, 168, 1)',
'rgba(16, 195, 195, 1)',
'rgba(0, 21, 68, 1)',
'rgba(226, 166, 198, 1)',
'rgba(278,17,66, 1)',
'rgba(153, 199, 235,1)',
'rgba(34,184,221,1)',
'rgba(221,72,34,1)',
'rgba(204,51,204,1)',
'rgba(255,204,0,1)',
'rgba(77,179,179,1)',
'rgba(196,60,141,1)',
'rgba(195,90,141,1)',
],
}
},
watch:{
msgNew: {
immediate:true,
handler: function(val, oldVal) {
this.msg = val
this.GenerateScale()
},
deep: true
},
},
mounted() {
},
methods: {
// 自定义进度条文字
setItemTextW(row) {
return () => {
return row.StartValue + ' - ' + row.EndValue
}
},
// 设置进度
setItemProgress(data) {
if(this.commissionratioList.AvgLureNum>=data.StartValue&&this.commissionratioList.AvfOrderNum>=data.EndValue){
return 100
}else{
return 100
}
},
// 自定义进度条文字
setItemText(row) {
this.formatProgress(row)
return () => {
return row.StartValue + ' - ' + row.EndValue
}
},
// 设置当前进度条状态，显示不同颜色
setItemStatus(data) {
if(this.commissionratioList.AvgLureNum>=data.StartValue&&this.commissionratioList.AvfOrderNum>=data.EndValue){
return 'exception'
}
},
formatProgress(data){
if (data.StartValue > 0) {
const s = data.StartValue.toString().slice(0, -4) ? data.StartValue.toString().slice(0, -4) : '0'
const e = data.StartValue.toString().slice(-4, -3)
data.StartValue = s + (e > 0 ? ('.' + e) : '') + 'w';
} else if (data.StartValue == 0) {
data.StartValue = 0
} else if (data.StartValue == -1) {
data.StartValue = '∞'
}
if (data.EndValue > 0) {
const s = data.EndValue.toString().slice(0, -4) ? data.EndValue.toString().slice(0, -4) : '0'
const e = data.EndValue.toString().slice(-4, -3)
data.EndValue = s + (e > 0 ? ('.' + e) : '') + 'w';
} else if (data.EndValue == 0) {
data.EndValue = 0
} else if (data.EndValue == -1) {
data.EndValue = '∞'
}
},
// 获取员工生成比例
GenerateScale(){
this.loading = true
this.EmName = this.msg.EmName
this.EmpType = this.msg.EmpType
let msg = {
WageReId:this.msg.WageReId
}
this.crmapipost("/api/Commission/GetCommissionSource",msg,res => {
if (res.data.resultCode == 1) {
this.loading = false
this.commissionratioList = res.data.data
} else {
this.loading = false
this.Error(res.data.message);
}
}
);
},
}
}
</script>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment