|
|
|
@@ -1,35 +1,22 @@ |
|
|
|
<template> |
|
|
|
<div class="box-center"> |
|
|
|
<!-- 头 --> |
|
|
|
<div class="app-titel"> |
|
|
|
<div class="titel-text"> |
|
|
|
楼盘选择： |
|
|
|
<el-select v-model="houseId" placeholder="请选择"> |
|
|
|
<el-option |
|
|
|
v-for="item in buildingoptions" |
|
|
|
:key="item.value" |
|
|
|
:label="item.propertyName" |
|
|
|
:value="item.id" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="app-titel"> |
|
|
|
<div class="toptimeqhuan"> |
|
|
|
<div :class="{ tophove: TimetoAhoose == 0 }" @click="tabtimetap(0)"> |
|
|
|
今日 |
|
|
|
<div :class="{ tophove: TimetoAhoose == 4 }" @click="tabtimetap(4)"> |
|
|
|
近7天 |
|
|
|
</div> |
|
|
|
<div :class="{ tophove: TimetoAhoose == 1 }" @click="tabtimetap(1)"> |
|
|
|
昨日 |
|
|
|
<div :class="{ tophove: TimetoAhoose == 5 }" @click="tabtimetap(5)"> |
|
|
|
近15天 |
|
|
|
</div> |
|
|
|
<div :class="{ tophove: TimetoAhoose == 2 }" @click="tabtimetap(2)"> |
|
|
|
近一周 |
|
|
|
<div :class="{ tophove: TimetoAhoose == 6 }" @click="tabtimetap(6)"> |
|
|
|
近30天 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 26px"> |
|
|
|
<el-date-picker |
|
|
|
v-model="customtime" |
|
|
|
:clearable='false' |
|
|
|
@change="confirmtime()" |
|
|
|
type="daterange" |
|
|
|
range-separator="-" |
|
|
|
@@ -42,24 +29,24 @@ |
|
|
|
</div> |
|
|
|
<div style="margin-left: 26px" class="div-lab"> |
|
|
|
<div class="label">员工</div> |
|
|
|
<el-select v-model="value" placeholder="请选择" class="div-inp"> |
|
|
|
<el-select v-model="consultantlistid" @change="consultanttap" placeholder="请选择" class="div-inp"> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
v-for="item in consultantlist" |
|
|
|
:key="item.createUser" |
|
|
|
:label="item.accountName" |
|
|
|
:value="item.createUser" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 26px" class="div-lab"> |
|
|
|
<div class="label">对比</div> |
|
|
|
<el-select v-model="value" placeholder="请选择" class="div-inp"> |
|
|
|
<el-select v-model="Pklistid" @change="packtap" placeholder="请选择" class="div-inp"> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
v-for="item in Pklist" |
|
|
|
:key="item.createUser" |
|
|
|
:label="item.accountName" |
|
|
|
:value="item.createUser" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
@@ -69,43 +56,142 @@ |
|
|
|
<div class="app-box-san"> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">接待量（TOP10）</div> |
|
|
|
<div class="text1">接待量</div> |
|
|
|
</div> |
|
|
|
<div class="hejisan"> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{consultantname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj1.avgA}}</div> |
|
|
|
</div> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{Packname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj1.avgB}}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style="height: 350px; width: 94%; margin: 0 auto" |
|
|
|
> |
|
|
|
<div id="data1" style="min-height:350px;"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">接待时长</div> |
|
|
|
</div> |
|
|
|
<div class="hejisan"> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{consultantname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj2.avgA}}</div> |
|
|
|
</div> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{Packname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj2.avgB}}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style="height: 350px; width: 94%; margin: 0 auto" |
|
|
|
> |
|
|
|
<div id="data2" style="min-height:350px;"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="app-box-san"> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">销讲执行趋势</div> |
|
|
|
<div class="text2"> |
|
|
|
<el-select @change="teamAllLevelidtap()" style="width: 90%; margin: 0 auto;" v-model="teamAllLevelid" placeholder="请选择"> |
|
|
|
<el-option |
|
|
|
v-for="item in teamAllLevel" |
|
|
|
:key="item.value" |
|
|
|
:label="item.name" |
|
|
|
:value="item.value"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="hejisan"> |
|
|
|
<div class="sanbox1" style="width: 35%"> |
|
|
|
<div class="text1-1">宋先锋</div> |
|
|
|
<div class="text1-2">1</div> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{consultantname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj3.avgA}}</div> |
|
|
|
</div> |
|
|
|
<div class="sanbox1" style="width: 40%"> |
|
|
|
<div class="text1-1">案场平均</div> |
|
|
|
<div class="text1-2">1</div> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{Packname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj3.avgB}}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div |
|
|
|
style="overflow-y: auto; height: 350px; width: 94%; margin: 0 auto" |
|
|
|
style=" height: 350px; width: 94%; margin: 0 auto" |
|
|
|
> |
|
|
|
<div id="data3" style="height:350px;"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">销讲能力雷达图</div> |
|
|
|
</div> |
|
|
|
<div class="hejisan"> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1"> </div> |
|
|
|
<div class="text1-2"> </div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style="height: 350px; width: 94%; margin: 0 auto" |
|
|
|
> |
|
|
|
<div id="echar" style="height:300px;"></div> |
|
|
|
<div id="data4" style="height:350px;"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="app-box-san"> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">销讲能雷达图（TOP10）</div> |
|
|
|
<div class="text1">违禁接待次数</div> |
|
|
|
<div class="text2"> |
|
|
|
<el-select @change="teamAllLeve2tap()" style="width: 90%; margin: 0 auto;" v-model="teamAllLeve2id" placeholder="请选择"> |
|
|
|
<el-option |
|
|
|
v-for="item in teamAllLeve2" |
|
|
|
:key="item.value" |
|
|
|
:label="item.name" |
|
|
|
:value="item.value"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="hejisan"> |
|
|
|
<div class="sanbox1" style="width: 35%"> |
|
|
|
<div class="text1-1">合计</div> |
|
|
|
<div class="text1-2">1</div> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{consultantname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj5.avgA}}</div> |
|
|
|
</div> |
|
|
|
<div class="sanbox1" style="width: 40%"> |
|
|
|
<div class="text1-1">顾问</div> |
|
|
|
<div class="text1-2">1</div> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1">{{Packname}}</div> |
|
|
|
<div class="text1-2">{{datalistobj5.avgB}}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div |
|
|
|
style="height: 350px; width: 94%; margin: 0 auto" |
|
|
|
> |
|
|
|
<div id="data5" style="height:350px;"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">违禁话术雷达图</div> |
|
|
|
</div> |
|
|
|
<div class="hejisan"> |
|
|
|
<div class="sanbox1" style="width: 50%"> |
|
|
|
<div class="text1-1"> </div> |
|
|
|
<div class="text1-2"> </div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style="overflow-y: auto; height: 350px; width: 94%; margin: 0 auto" |
|
|
|
style="height: 350px; width: 94%; margin: 0 auto" |
|
|
|
> |
|
|
|
<div id="echar1" style="height:250px;"></div> |
|
|
|
<div id="data6" style="height:350px;"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@@ -184,107 +270,540 @@ export default { |
|
|
|
return { |
|
|
|
houseId: "", |
|
|
|
buildingoptions: [], |
|
|
|
TimetoAhoose: 2, |
|
|
|
TimetoAhoose: 4, |
|
|
|
tabFlag: 1, |
|
|
|
customtime: [], |
|
|
|
tableData: [], |
|
|
|
currentPage4: 1, |
|
|
|
total: 20, |
|
|
|
options: [ |
|
|
|
{ |
|
|
|
value: "1", |
|
|
|
label: "排名", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: "2", |
|
|
|
label: "趋势", |
|
|
|
}, |
|
|
|
], |
|
|
|
echarList: {}, |
|
|
|
value: "1", |
|
|
|
ceratelist: [ |
|
|
|
{ name: "还是得", avgZxl: 80 }, |
|
|
|
{ name: "大大奥德赛", avgZxl: 90 }, |
|
|
|
{ name: "沙发和", avgZxl: 20 }, |
|
|
|
{ name: "还是得", avgZxl: 10 }, |
|
|
|
{ name: "还客户家客户是得", avgZxl: 80 }, |
|
|
|
], |
|
|
|
|
|
|
|
statDateStart:'', |
|
|
|
statDateEnd:'', |
|
|
|
consultantlist:[], |
|
|
|
consultantlistid:'', |
|
|
|
consultantname:'', |
|
|
|
|
|
|
|
Pklist:[], |
|
|
|
Pklistid:'', |
|
|
|
Packname:'', |
|
|
|
|
|
|
|
teamAllLevel:[], |
|
|
|
teamAllLevelid:'', |
|
|
|
|
|
|
|
teamAllLeve2:[], |
|
|
|
teamAllLeve2id:'', |
|
|
|
|
|
|
|
datalistobj1:{ |
|
|
|
avgA:'', |
|
|
|
avgB:'', |
|
|
|
listA:[], |
|
|
|
listB:[], |
|
|
|
}, |
|
|
|
datalistobj2:{ |
|
|
|
avgA:'', |
|
|
|
avgB:'', |
|
|
|
listA:[], |
|
|
|
listB:[], |
|
|
|
}, |
|
|
|
datalistobj3:{ |
|
|
|
avgA:'', |
|
|
|
avgB:'', |
|
|
|
listA:[], |
|
|
|
listB:[], |
|
|
|
}, |
|
|
|
datalistobj4:{ |
|
|
|
listA:[], |
|
|
|
listB:[], |
|
|
|
}, |
|
|
|
datalistobj5:{ |
|
|
|
avgA:'', |
|
|
|
avgB:'', |
|
|
|
listA:[], |
|
|
|
listB:[], |
|
|
|
}, |
|
|
|
datalistobj6:{ |
|
|
|
listA:[], |
|
|
|
listB:[], |
|
|
|
}, |
|
|
|
|
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.echarCreat(); |
|
|
|
this.creatRadar(); |
|
|
|
this.houseId = localStorage.getItem("houseId"); |
|
|
|
this.init() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
echarCreat() { |
|
|
|
let myChart = echarts.init(document.getElementById("echar")); |
|
|
|
let option = { |
|
|
|
init(){ |
|
|
|
this.getAccount() |
|
|
|
this.teamAllLeve() |
|
|
|
}, |
|
|
|
accountData1(){ |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
userA:this.consultantlistid, |
|
|
|
userB:this.Pklistid, |
|
|
|
type:1 |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.accountData(pamaet).then((res) => { |
|
|
|
this.datalistobj1={ |
|
|
|
avgA:res.data.avgA || 0, |
|
|
|
avgB:res.data.avgB || 0, |
|
|
|
listA:res.data.listA || [], |
|
|
|
listB:res.data.listB || [], |
|
|
|
} |
|
|
|
let arr1=[]; |
|
|
|
let arr2=[]; |
|
|
|
let timelist=[]; |
|
|
|
this.datalistobj1.listA.map((item,index)=>{ |
|
|
|
timelist.push(item.statDate.substring(5,10)) |
|
|
|
}) |
|
|
|
this.datalistobj1.listA.map((item,index)=>{ |
|
|
|
arr1.push(item.activeCustomer) |
|
|
|
}) |
|
|
|
this.datalistobj1.listB.map((item,index)=>{ |
|
|
|
arr2.push(item.activeCustomer) |
|
|
|
}) |
|
|
|
this.SwitchCARDS1(arr1,arr2,timelist,"data1") |
|
|
|
}) |
|
|
|
}, |
|
|
|
accountData2(){ |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
userA:this.consultantlistid, |
|
|
|
userB:this.Pklistid, |
|
|
|
type:2 |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.accountData(pamaet).then((res) => { |
|
|
|
this.datalistobj2={ |
|
|
|
avgA:Math.floor(res.data.avgA/60) || 0, |
|
|
|
avgB:Math.floor(res.data.avgB/60) || 0, |
|
|
|
listA:res.data.listA || [], |
|
|
|
listB:res.data.listB || [], |
|
|
|
} |
|
|
|
let arr1=[]; |
|
|
|
let arr2=[]; |
|
|
|
let timelist=[]; |
|
|
|
this.datalistobj2.listA.map((item,index)=>{ |
|
|
|
timelist.push(item.statDate.substring(5,10)) |
|
|
|
}) |
|
|
|
this.datalistobj2.listA.map((item,index)=>{ |
|
|
|
arr1.push(Math.floor(item.sumDuration/60)|| 0) |
|
|
|
}) |
|
|
|
this.datalistobj2.listB.map((item,index)=>{ |
|
|
|
arr2.push(Math.floor(item.sumDuration/60) || 0) |
|
|
|
}) |
|
|
|
this.SwitchCARDS1(arr1,arr2,timelist,"data2") |
|
|
|
}) |
|
|
|
}, |
|
|
|
accountData3(){ |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
userA:this.consultantlistid, |
|
|
|
userB:this.Pklistid, |
|
|
|
type:3, |
|
|
|
marketingId:this.teamAllLevelid |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.accountData(pamaet).then((res) => { |
|
|
|
this.datalistobj3={ |
|
|
|
avgA:res.data.avgA || 0, |
|
|
|
avgB:res.data.avgB || 0, |
|
|
|
listA:res.data.listA || [], |
|
|
|
listB:res.data.listB || [], |
|
|
|
} |
|
|
|
let arr1=[]; |
|
|
|
let arr2=[]; |
|
|
|
let timelist=[]; |
|
|
|
this.datalistobj3.listA.map((item,index)=>{ |
|
|
|
timelist.push(item.statDate.substring(5,10)) |
|
|
|
}) |
|
|
|
this.datalistobj3.listA.map((item,index)=>{ |
|
|
|
arr1.push(item.fraction) |
|
|
|
}) |
|
|
|
this.datalistobj3.listB.map((item,index)=>{ |
|
|
|
arr2.push(item.fraction) |
|
|
|
}) |
|
|
|
this.SwitchCARDS1(arr1,arr2,timelist,"data3") |
|
|
|
}) |
|
|
|
}, |
|
|
|
teamAllLevelidtap(){ |
|
|
|
this.accountData3() |
|
|
|
}, |
|
|
|
accountData4(){ |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
userA:this.consultantlistid, |
|
|
|
userB:this.Pklistid, |
|
|
|
type:4 |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.accountData(pamaet).then((res) => { |
|
|
|
this.datalistobj4={ |
|
|
|
listA:res.data.listA || [], |
|
|
|
listB:res.data.listB || [], |
|
|
|
} |
|
|
|
let arr1=[]; |
|
|
|
let arr2=[]; |
|
|
|
let timelist=[]; |
|
|
|
this.datalistobj4.listA.map((item,index)=>{ |
|
|
|
timelist.push({name:item.name, max: 100 },) |
|
|
|
}) |
|
|
|
this.datalistobj4.listA.map((item,index)=>{ |
|
|
|
arr1.push(item.zxl) |
|
|
|
}) |
|
|
|
this.datalistobj4.listB.map((item,index)=>{ |
|
|
|
arr2.push(item.zxl) |
|
|
|
}) |
|
|
|
this.piechart2(arr1,arr2,timelist,"data4") |
|
|
|
}) |
|
|
|
}, |
|
|
|
accountData5(){ |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
userA:this.consultantlistid, |
|
|
|
userB:this.Pklistid, |
|
|
|
type:5, |
|
|
|
words:this.teamAllLeve2id |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.accountData(pamaet).then((res) => { |
|
|
|
this.datalistobj5={ |
|
|
|
avgA:res.data.avgA || 0, |
|
|
|
avgB:res.data.avgB || 0, |
|
|
|
listA:res.data.listA || [], |
|
|
|
listB:res.data.listB || [], |
|
|
|
} |
|
|
|
let arr1=[]; |
|
|
|
let arr2=[]; |
|
|
|
let timelist=[]; |
|
|
|
this.datalistobj5.listA.map((item,index)=>{ |
|
|
|
timelist.push(item.statDate.substring(5,10)) |
|
|
|
}) |
|
|
|
this.datalistobj5.listA.map((item,index)=>{ |
|
|
|
arr1.push(item.prohibitedCustomer) |
|
|
|
}) |
|
|
|
this.datalistobj5.listB.map((item,index)=>{ |
|
|
|
arr2.push(item.prohibitedCustomer) |
|
|
|
}) |
|
|
|
this.SwitchCARDS1(arr1,arr2,timelist,"data5") |
|
|
|
}) |
|
|
|
}, |
|
|
|
accountData6(){ |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
userA:this.consultantlistid, |
|
|
|
userB:this.Pklistid, |
|
|
|
type:6 |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.accountData(pamaet).then((res) => { |
|
|
|
console.log(res.data) |
|
|
|
this.datalistobj6={ |
|
|
|
listA:res.data.listA || [], |
|
|
|
listB:res.data.listB || [], |
|
|
|
} |
|
|
|
let arr1=[]; |
|
|
|
let arr2=[]; |
|
|
|
let timelist=[]; |
|
|
|
this.datalistobj6.listA.map((item,index)=>{ |
|
|
|
timelist.push({name:item.words, max: 100 },) |
|
|
|
}) |
|
|
|
this.datalistobj6.listA.map((item,index)=>{ |
|
|
|
arr1.push(item.num) |
|
|
|
}) |
|
|
|
this.datalistobj6.listB.map((item,index)=>{ |
|
|
|
arr2.push(item.num) |
|
|
|
}) |
|
|
|
this.piechart2(arr1,arr2,timelist,"data6") |
|
|
|
}) |
|
|
|
}, |
|
|
|
teamAllLeve2tap(){ |
|
|
|
this.accountData5() |
|
|
|
}, |
|
|
|
//切换顾问 |
|
|
|
consultanttap(){ |
|
|
|
this.consultantlist.map(item=>{ |
|
|
|
if(item.createUser==this.consultantlistid){ |
|
|
|
this.consultantname=item.accountName |
|
|
|
} |
|
|
|
}) |
|
|
|
this.accountData1() |
|
|
|
this.accountData2() |
|
|
|
this.accountData3() |
|
|
|
this.accountData4() |
|
|
|
this.accountData5() |
|
|
|
this.accountData6() |
|
|
|
}, |
|
|
|
//对比切换 |
|
|
|
packtap(){ |
|
|
|
this.Pklist.map(item=>{ |
|
|
|
if(item.createUser==this.Pklistid){ |
|
|
|
this.Packname=item.accountName |
|
|
|
} |
|
|
|
}) |
|
|
|
this.accountData1() |
|
|
|
this.accountData2() |
|
|
|
this.accountData3() |
|
|
|
this.accountData4() |
|
|
|
this.accountData5() |
|
|
|
this.accountData6() |
|
|
|
}, |
|
|
|
|
|
|
|
// 获取一级 |
|
|
|
teamAllLeve(){ |
|
|
|
this.teamAllLevel=[ |
|
|
|
{name:'平均执行',value:''}, |
|
|
|
] |
|
|
|
this.teamAllLeve2=[ |
|
|
|
{name:'总次数',value:''}, |
|
|
|
] |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
dateType:0, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.teamAllLevel(pamaet).then((res) => { |
|
|
|
let arr1=res.data.resultsList ||[]; |
|
|
|
let arr2=res.data.sensitiveWordsList ||[]; |
|
|
|
arr1.map(item=>{ |
|
|
|
this.teamAllLevel.push({ |
|
|
|
name:item.name, |
|
|
|
value:item.marketingId |
|
|
|
}) |
|
|
|
}) |
|
|
|
arr2.map(item=>{ |
|
|
|
this.teamAllLeve2.push({ |
|
|
|
name:item.words, |
|
|
|
value:item.words |
|
|
|
}) |
|
|
|
}) |
|
|
|
this.teamAllLevelid=''; |
|
|
|
this.teamAllLeve2id=''; |
|
|
|
|
|
|
|
}) |
|
|
|
}, |
|
|
|
getAccount(){ |
|
|
|
let pamaet={ |
|
|
|
houseId:this.houseId, |
|
|
|
statDateStart:this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd, |
|
|
|
} |
|
|
|
if(this.TimetoAhoose==7){ |
|
|
|
pamaet.dateType=null |
|
|
|
}else{ |
|
|
|
pamaet.dateType=this.TimetoAhoose |
|
|
|
} |
|
|
|
this.$api.http.getAccount(pamaet).then((res) => { |
|
|
|
this.consultantlist=res.data; |
|
|
|
this.consultantlistid=res.data[0].createUser; |
|
|
|
this.consultantname=res.data[0].accountName; |
|
|
|
let arr=[ |
|
|
|
{ |
|
|
|
accountName:"案场平均", |
|
|
|
createUser:'' |
|
|
|
} |
|
|
|
]; |
|
|
|
res.data.forEach(element => { |
|
|
|
arr.push({ |
|
|
|
accountName:element.accountName, |
|
|
|
createUser:element.createUser |
|
|
|
}) |
|
|
|
}) |
|
|
|
this.Pklist=arr; |
|
|
|
this.Pklistid=''; |
|
|
|
this.Packname=this.Pklist[0].accountName; |
|
|
|
this.accountData1() |
|
|
|
this.accountData2() |
|
|
|
this.accountData3() |
|
|
|
this.accountData4() |
|
|
|
this.accountData5() |
|
|
|
this.accountData6() |
|
|
|
}) |
|
|
|
}, |
|
|
|
SwitchCARDS1(arr1,arr2,timelist,data1) { |
|
|
|
echarts.init(document.getElementById(data1)).dispose(); |
|
|
|
var chartDom = document.getElementById(data1); |
|
|
|
var myChart = echarts.init(chartDom); |
|
|
|
var option; |
|
|
|
option = { |
|
|
|
tooltip: { |
|
|
|
trigger: "axis", |
|
|
|
}, |
|
|
|
legend: { |
|
|
|
data: [this.consultantname,this.Packname], |
|
|
|
top: "6", |
|
|
|
}, |
|
|
|
grid: { |
|
|
|
left: 10, |
|
|
|
right: 10, |
|
|
|
|
|
|
|
containLabel: true, |
|
|
|
}, |
|
|
|
xAxis: { |
|
|
|
type: "category", |
|
|
|
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], |
|
|
|
data: timelist, |
|
|
|
axisLabel: { |
|
|
|
//重点在这一块，其余可以忽略 |
|
|
|
textStyle: { |
|
|
|
color: "#212121", //更改坐标轴文字颜色 |
|
|
|
}, |
|
|
|
}, |
|
|
|
axisLine: { |
|
|
|
lineStyle: { |
|
|
|
type: "solid", |
|
|
|
color: "#DDE1EE", //x线的颜色 |
|
|
|
width: "1", //坐标线的宽度 |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
yAxis: { |
|
|
|
type: "value", |
|
|
|
}, |
|
|
|
legend: { |
|
|
|
data: ["line", "line1"], |
|
|
|
splitNumber: 4, |
|
|
|
axisLabel: { |
|
|
|
//重点在这一块，其余可以忽略 |
|
|
|
textStyle: { |
|
|
|
color: "#212121", //更改坐标轴文字颜色 |
|
|
|
}, |
|
|
|
}, |
|
|
|
axisLine: { |
|
|
|
lineStyle: { |
|
|
|
ype: "solid", |
|
|
|
color: "#DDE1EE", //x线的颜色 |
|
|
|
width: "1", //坐标线的宽度 |
|
|
|
}, |
|
|
|
}, |
|
|
|
splitLine: { |
|
|
|
lineStyle: { |
|
|
|
type: "dashed", // y轴分割线类型 |
|
|
|
}, |
|
|
|
}, |
|
|
|
axisTick: { |
|
|
|
//y轴刻度线 |
|
|
|
show: false, |
|
|
|
}, |
|
|
|
}, |
|
|
|
series: [ |
|
|
|
{ |
|
|
|
data: [150, 230, 224, 218, 135, 147, 260], |
|
|
|
name: this.consultantname, |
|
|
|
data:arr1, |
|
|
|
type: "line", |
|
|
|
name: "line", |
|
|
|
smooth: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
data: [10, 20, 24, 28, 13, 17, 20], |
|
|
|
name: this.Packname, |
|
|
|
data:arr2, |
|
|
|
type: "line", |
|
|
|
name: "line1", |
|
|
|
}, |
|
|
|
smooth: true, |
|
|
|
} |
|
|
|
], |
|
|
|
}; |
|
|
|
myChart.setOption(option); |
|
|
|
option && myChart.setOption(option); |
|
|
|
window.addEventListener("resize", () => { |
|
|
|
myChart.resize(); |
|
|
|
}); |
|
|
|
}, |
|
|
|
creatRadar() { |
|
|
|
let myChart = echarts.init(document.getElementById("echar1")); |
|
|
|
let option = { |
|
|
|
piechart2(arr1,arr2,timelist,data1){ |
|
|
|
echarts.init(document.getElementById(data1)).dispose(); |
|
|
|
var chartDom = document.getElementById(data1); |
|
|
|
var myChart = echarts.init(chartDom); |
|
|
|
var option; |
|
|
|
option = { |
|
|
|
tooltip: { |
|
|
|
trigger: 'axis' |
|
|
|
}, |
|
|
|
legend: { |
|
|
|
data: ["Allocate", "Actua"], |
|
|
|
data: [this.consultantname,this.Packname,], |
|
|
|
bottom: "10", |
|
|
|
}, |
|
|
|
color:[ |
|
|
|
'#2671E2', |
|
|
|
'#F3787B', |
|
|
|
], |
|
|
|
radar: { |
|
|
|
// shape: 'circle', |
|
|
|
indicator: [ |
|
|
|
{ name: "Sales", max: 6500 }, |
|
|
|
{ name: "Administration", max: 16000 }, |
|
|
|
{ name: "Information Technology", max: 30000 }, |
|
|
|
{ name: "Customer Support", max: 38000 }, |
|
|
|
{ name: "Development", max: 52000 }, |
|
|
|
{ name: "Marketing", max: 25000 }, |
|
|
|
], |
|
|
|
indicator: timelist |
|
|
|
}, |
|
|
|
series: [ |
|
|
|
{ |
|
|
|
name: "Budget vs spending", |
|
|
|
type: "radar", |
|
|
|
type: 'radar', |
|
|
|
tooltip: { |
|
|
|
trigger: 'item' |
|
|
|
}, |
|
|
|
data: [ |
|
|
|
{ |
|
|
|
value: [4200, 3000, 20000, 35000, 50000, 18000], |
|
|
|
name: "Allocate", |
|
|
|
value:arr1, |
|
|
|
name: this.consultantname |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: [5000, 14000, 28000, 26000, 42000, 21000], |
|
|
|
name: "Actua", |
|
|
|
value:arr2, |
|
|
|
name: this.Packname |
|
|
|
}, |
|
|
|
], |
|
|
|
}, |
|
|
|
], |
|
|
|
] |
|
|
|
} |
|
|
|
] |
|
|
|
}; |
|
|
|
myChart.setOption(option); |
|
|
|
option && myChart.setOption(option); |
|
|
|
window.addEventListener("resize", () => { |
|
|
|
myChart.resize(); |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleCurrentChange() {}, |
|
|
|
handleSizeChange() {}, |
|
|
|
confirmtime(){ |
|
|
|
this.TimetoAhoose = 7; |
|
|
|
this.statDateStart=this.customtime[0]; |
|
|
|
this.statDateEnd=this.customtime[1]; |
|
|
|
this.init() |
|
|
|
}, |
|
|
|
//切换时间 |
|
|
|
tabtimetap(index) { |
|
|
|
this.TimetoAhoose = index; |
|
|
|
this.statDateStart=''; |
|
|
|
this.statDateEnd=''; |
|
|
|
this.init() |
|
|
|
}, |
|
|
|
tabFlagChange(idx) { |
|
|
|
this.tabFlag = idx; |
|
|
|
@@ -348,7 +867,7 @@ export default { |
|
|
|
|
|
|
|
.app-box-san { |
|
|
|
width: 100%; |
|
|
|
height: 400px; |
|
|
|
// height: 400px; |
|
|
|
display: flex; |
|
|
|
margin-top: 15px; |
|
|
|
.zuo { |
|
|
|
|
