Commit 3da56a86 authored by zhengke's avatar zhengke

修改

parent 5dd16afe
......@@ -57,7 +57,7 @@
.Data_List {
box-sizing: border-box;
flex: 0 0 18.5%;
padding: 32px;
padding: 21px;
background-color: #fff;
margin: 0 24px 24px 0;
font-size: 14px;
......@@ -671,19 +671,29 @@
</div>
</div>
</div>
<div style="display:none;">
<div v-if="comType==1">
<div class="Check_Map">
<div class="check_Title">统计数据</div>
<div class="Data_TotalTu">
<div class="Data_ListBottom" style="flex: 0 0 60%;">
<div style="margin-bottom:20px;">
<el-button size="mini" :type="btnHui2" @click="getBar(1)">回单</el-button>
<el-button size="mini" :type="btnVisit2" @click="getBar(2)">到访</el-button>
<el-button size="mini" :type="btnHetong2" @click="getBar(3)">合同</el-button>
</div>
<div>
<VueApexCharts width="90%" height="405" ref="zhu" :options="chartOptions5" :series="series5">
</VueApexCharts>
</div>
</div>
<div class="Data_ListBottom" style="flex: 0 0 35%;">
<div>
<VueApexCharts width="80%" height="105" ref="bing" :options="chartOptions4" :series="series4">
<div style="margin-bottom:40px;">
<el-button size="mini" :type="btnHui" @click="getPie(1)">回单</el-button>
<el-button size="mini" :type="btnVisit" @click="getPie(2)">到访</el-button>
<el-button size="mini" :type="btnHetong" @click="getPie(3)">合同</el-button>
</div>
<div style="margin-left:50px;">
<VueApexCharts width="80%" height="205" ref="bing" :options="chartOptions4" :series="series4">
</VueApexCharts>
</div>
</div>
......@@ -794,9 +804,9 @@
borderColor: '#f1f1f1'
},
},
series4: [4, 3, 2],
series4: [],
chartOptions4: {
labels: ["名单人数", "开单奖励", "线索奖励"],
labels: ['个人直客','同业介绍','学员转介绍','内部介绍'],
chart: {
type: "donut",
width: 40,
......@@ -819,7 +829,7 @@
}
},
series5: [{
data: [400, 430, 448, 470, 540, 580, 690, 1100, 1200, 1380]
data: []
}],
chartOptions5: {
plotOptions: {
......@@ -836,9 +846,7 @@
enabled: false
},
xaxis: {
categories: ['South Korea', 'Canada', 'United Kingdom', 'Netherlands', 'Italy', 'France', 'Japan',
'United States', 'China', 'Germany'
],
categories: [],
},
},
yesData: {}, //昨日数据
......@@ -853,6 +861,14 @@
return time.getTime() > Date.now() - 8.64e6
}
},
pieData:[], //饼数据
btnHui:'primary',
btnVisit:'',
btnHetong:'',
btnHui2:'primary',
btnVisit2:'',
btnHetong2:'',
barData:[] //柱状图数据
};
},
created() {
......@@ -898,6 +914,96 @@
this.searchData();
},
methods: {
//点击饼切换
getPie(type){
if(type==1){
this.btnHui='primary'
this.btnVisit=''
this.btnHetong=''
this.series4=[]
if(this.pieData.ClueData&&this.pieData.ClueData.length>0){
this.pieData.ClueData.forEach(x=>{
this.series4.push(x.ClueCount)
})
}
}
if(type==2){
this.btnVisit='primary'
this.btnHui=''
this.btnHetong=''
this.series4=[]
if(this.pieData.VisitData&&this.pieData.VisitData.length>0){
this.pieData.VisitData.forEach(x=>{
this.series4.push(x.VisitCount)
})
}
}
if(type==3){
this.btnVisit=''
this.btnHui=''
this.btnHetong='primary'
this.series4=[]
if(this.pieData.OrderData&&this.pieData.OrderData.length>0){
this.pieData.OrderData.forEach(x=>{
this.series4.push(x.OrderCount)
})
}
}
},
//切换柱状图
getBar(type){
if(type==1){
this.btnHui2='primary'
this.btnVisit2=''
this.btnHetong2=''
this.series5[0].data=[]
this.chartOptions5.xaxis.categories=[]
if(this.barData.ClueData&&this.barData.ClueData.length>0){
this.barData.ClueData.forEach(x=>{
this.series5[0].data.push(x.ClueCount)
this.chartOptions5.xaxis.categories.push(x.ChannelName)
})
}
setTimeout(() => {
this.$refs.zhu.updateOptions(this.chartOptions5)
this.$refs.zhu.updateSeries(this.series5)
}, 100)
}
if(type==2){
this.btnVisit2='primary'
this.btnHui2=''
this.btnHetong2=''
this.series5[0].data=[]
this.chartOptions5.xaxis.categories=[]
if(this.barData.VisitData&&this.barData.VisitData.length>0){
this.barData.VisitData.forEach(x=>{
this.series5[0].data.push(x.VisitCount)
this.chartOptions5.xaxis.categories.push(x.ChannelName)
})
}
setTimeout(() => {
this.$refs.zhu.updateOptions(this.chartOptions5)
this.$refs.zhu.updateSeries(this.series5)
}, 100)
}
if(type==3){
this.btnVisit2=''
this.btnHui2=''
this.btnHetong2='primary'
this.series5[0].data=[]
this.chartOptions5.xaxis.categories=[]
if(this.barData.OrderData&&this.barData.OrderData.length>0){
this.barData.OrderData.forEach(x=>{
this.series5[0].data.push(x.OrderCount)
this.chartOptions5.xaxis.categories.push(x.ChannelName)
})
}
setTimeout(() => {
this.$refs.zhu.updateOptions(this.chartOptions5)
this.$refs.zhu.updateSeries(this.series5)
}, 100)
}
},
//点击市场和课程顾问切换
getSwitch(type) {
this.comType = type;
......@@ -978,16 +1084,42 @@
this.series[0].data = [];
this.series[1].data = [];
this.series[2].data = [];
this.series4 = [];
this.series5[0].data = [];
this.chartOptions5.xaxis.categories=[];
this.btnHui='primary'
this.btnVisit=''
this.btnHetong=''
this.btnHui2='primary'
this.btnVisit2=''
this.btnHetong2=''
tempData.forEach(x => {
this.series[0].data.push(x.ClueCount);
this.series[1].data.push(x.VisitCount);
this.series[2].data.push(x.TrialLessonCount);
this.chartOptions.xaxis.categories.push(x.DayStr);
})
this.pieData = res.Data.PieData;
this.barData = res.Data.BarData;
if(this.pieData.ClueData&&this.pieData.ClueData.length>0){
this.pieData.ClueData.forEach(x=>{
this.series4.push(x.ClueCount)
})
}
if(this.barData.ClueData&&this.barData.ClueData.length>0){
this.barData.ClueData.forEach(x=>{
this.series5[0].data.push(x.ClueCount)
this.chartOptions5.xaxis.categories.push(x.ChannelName);
})
}
setTimeout(() => {
this.$refs.apex.updateOptions(this.chartOptions)
this.$refs.apex.updateSeries(this.series)
this.$refs.zhu.updateOptions(this.chartOptions5)
this.$refs.zhu.updateSeries(this.series5)
this.$refs.bing.updateSeries(this.series4)
}, 500)
}
});
......
......@@ -7,6 +7,9 @@
.Sysuser_Date .el-range-editor .el-range-input {
background: transparent !important;
}
.makeOutDiv .el-table th{
background: #f5f6f7;
}
</style>
<template>
<div class="page-body">
......@@ -34,30 +37,32 @@
</div>
</div>
</div>
<el-table :data="dataList" ref="table" style="width: 100%;" :height="tableHeight">
<el-table-column label="序号" type="index">
</el-table-column>
<el-table-column prop="ChannelName" label="渠道名">
</el-table-column>
<el-table-column prop="ClueCount" label="回单" sortable>
</el-table-column>
<el-table-column prop="VisitCount" label="到访" sortable>
</el-table-column>
<el-table-column prop="OrderCount" label="合同数" sortable>
</el-table-column>
<el-table-column prop="OrderIncome" label="新业绩金额" sortable>
</el-table-column>
<el-table-column prop="VisitingRate" label="到访率" sortable>
<template slot-scope="scope">
<span>{{scope.row.VisitingRate}}%</span>
</template>
</el-table-column>
<el-table-column prop="ContractRate" label="合同转化率" sortable>
<template slot-scope="scope">
<span>{{scope.row.ContractRate}}%</span>
</template>
</el-table-column>
</el-table>
<div class="makeOutDiv">
<el-table :data="dataList" ref="table" style="width: 100%;" :height="tableHeight">
<el-table-column label="序号" type="index">
</el-table-column>
<el-table-column prop="ChannelName" label="渠道名">
</el-table-column>
<el-table-column prop="ClueCount" label="回单" sortable>
</el-table-column>
<el-table-column prop="VisitCount" label="到访" sortable>
</el-table-column>
<el-table-column prop="OrderCount" label="合同数" sortable>
</el-table-column>
<el-table-column prop="OrderIncome" label="新业绩金额" sortable>
</el-table-column>
<el-table-column prop="VisitingRate" label="到访率" sortable>
<template slot-scope="scope">
<span>{{scope.row.VisitingRate}}%</span>
</template>
</el-table-column>
<el-table-column prop="ContractRate" label="合同转化率" sortable>
<template slot-scope="scope">
<span>{{scope.row.ContractRate}}%</span>
</template>
</el-table-column>
</el-table>
</div>
</div>
</template>
<script>
......
......@@ -106,6 +106,10 @@
.Sysuser_Date .el-range-editor .el-range-input {
background: transparent !important;
}
.makeOutDiv .el-table th{
background: #f5f6f7;
}
</style>
<template>
<div class="page-body">
......
<style>
<style lang="scss">
.Sysuser_Date .el-input__inner {
background: transparent !important;
border: 0 !important;
......@@ -7,6 +7,9 @@
.Sysuser_Date .el-range-editor .el-range-input {
background: transparent !important;
}
.makeOutDiv .el-table th{
background: #f5f6f7;
}
</style>
<template>
<div class="page-body">
......
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