|
|
@@ -174,6 +174,54 @@ |
|
|
|
<div class="pagechen1"></div> |
|
|
|
<div class="pagechen1" ></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="app-box-san"> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">维度触达占比</div> |
|
|
|
</div> |
|
|
|
<div v-if="indexZxllist.length==0" style="display:flex;justify-content: center; align-items: center;height: 60%;"> |
|
|
|
<div>暂无数据</div> |
|
|
|
</div> |
|
|
|
<div v-else class="tabbox" style="display:flex;flex-wrap: wrap;height: 290px;overflow-y: auto;width: 90%;margin:0 auto;"> |
|
|
|
<div v-for="(item,index) in indexZxllist" :key="index" style="width:130px;margin-left: 16px;margin-top: 10px;"> |
|
|
|
<div style="width:100%;height:100px;"><el-progress :stroke-width="12" :width='130' type="dashboard" :percentage="item.fraction" ></el-progress></div> |
|
|
|
<div style="width:100%;text-align: center;">{{item.name.substring(0,3)}}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="you"> |
|
|
|
<div class="title"> |
|
|
|
<div class="text1">员工执行率排名(TOP10)</div> |
|
|
|
</div> |
|
|
|
<div class="hejisan"> |
|
|
|
<div class="sanbox1" style="width: 35%;"> |
|
|
|
<div class="text1-1">合计</div> |
|
|
|
<div class="text1-2">1</div> |
|
|
|
</div> |
|
|
|
<div class="sanbox1" style="width: 40%;"> |
|
|
|
<div class="text1-1">顾问</div> |
|
|
|
<div class="text1-2">1</div> |
|
|
|
</div> |
|
|
|
<div class="sanbox1" style="width: 25%;"> |
|
|
|
<div class="text1-1">人均接待量</div> |
|
|
|
<div class="text1-2">1</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="tabbox"> |
|
|
|
<div style="overflow-y:auto;height: 350px;width: 94%;margin: 0 auto;"> |
|
|
|
<div class="jinbox" v-for="(item,i) in ceratelist" :key='i'> |
|
|
|
<div class="jinboxtit">{{item.name}}</div> |
|
|
|
<div class="jinbox-box"> |
|
|
|
<div class="boxbaifenbi" :style="'width:'+(item.avgZxl)+'%;'"></div> |
|
|
|
</div> |
|
|
|
<div class="jinboxbott">{{item.avgZxl}}%</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="app-box-san"> |
|
|
|
<div class="zuo"> |
|
|
|
<div class="title"> |
|
|
@@ -321,6 +369,16 @@ export default { |
|
|
|
tableData: [], |
|
|
|
equipmentList:[], |
|
|
|
prohibitedlist:[], |
|
|
|
ceratelist:[ |
|
|
|
{name:'还是得',avgZxl:80}, |
|
|
|
{name:'大大奥德赛',avgZxl:90}, |
|
|
|
{name:'沙发和',avgZxl:20}, |
|
|
|
{name:'还是得',avgZxl:10}, |
|
|
|
{name:'还客户家客户是得',avgZxl:80}, |
|
|
|
], |
|
|
|
indexZxllist:[], |
|
|
|
employeeExecutionRatelist:[] |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
@@ -331,7 +389,31 @@ export default { |
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
|
//获取看片数据 |
|
|
|
//切换楼盘 |
|
|
|
houseChange() { |
|
|
|
this.TimetoAhoose=0; |
|
|
|
this.statDateStart=''; |
|
|
|
this.statDateEnd=''; |
|
|
|
this.getgicd() |
|
|
|
this.findProhibitedRecord() |
|
|
|
}, |
|
|
|
//获取楼盘 |
|
|
|
zkhousePage() { |
|
|
|
this.$api.api |
|
|
|
.findHouseByUser({ |
|
|
|
orgType: localStorage.getItem("orgType"), |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
this.houseList = res.data; |
|
|
|
this.houseId = res.data[0].id; |
|
|
|
this.getgicd(); |
|
|
|
this.getindexZxllist() |
|
|
|
this.getemployeeExecutionRatelist() |
|
|
|
this.findProhibitedRecord() |
|
|
|
this.findAllZkEquipment() |
|
|
|
}); |
|
|
|
}, |
|
|
|
//获取卡片数据 |
|
|
|
getgicd(){ |
|
|
|
let obj = { |
|
|
|
houseId:this.houseId, |
|
|
@@ -384,6 +466,7 @@ export default { |
|
|
|
this.equipmentList=res.data; |
|
|
|
}) |
|
|
|
}, |
|
|
|
//获取违禁提醒列表 |
|
|
|
findProhibitedRecord(){ |
|
|
|
this.prohibitedlist=[]; |
|
|
|
this.$api.http.findProhibitedRecord({ |
|
|
@@ -395,29 +478,30 @@ export default { |
|
|
|
this.prohibitedlist=res.data; |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
//切换楼盘 |
|
|
|
houseChange() { |
|
|
|
this.TimetoAhoose=0; |
|
|
|
this.statDateStart=''; |
|
|
|
this.statDateEnd=''; |
|
|
|
this.getgicd() |
|
|
|
this.findProhibitedRecord() |
|
|
|
getindexZxllist(){ |
|
|
|
this.indexZxllist=[] |
|
|
|
this.$api.http.getindexZxllist({ |
|
|
|
houseId:this.houseId, |
|
|
|
dateType: this.TimetoAhoose, |
|
|
|
statDateStart: this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd |
|
|
|
}).then((res) => { |
|
|
|
this.indexZxllist=res.data.list||[] |
|
|
|
}) |
|
|
|
}, |
|
|
|
//获取楼盘 |
|
|
|
zkhousePage() { |
|
|
|
this.$api.api |
|
|
|
.findHouseByUser({ |
|
|
|
orgType: localStorage.getItem("orgType"), |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
this.houseList = res.data; |
|
|
|
this.houseId = res.data[0].id; |
|
|
|
this.getgicd(); |
|
|
|
this.findProhibitedRecord() |
|
|
|
this.findAllZkEquipment() |
|
|
|
}); |
|
|
|
getemployeeExecutionRatelist(){ |
|
|
|
this.employeeExecutionRatelist=[] |
|
|
|
this.$api.http.getemployeeExecutionRatelist({ |
|
|
|
houseId:this.houseId, |
|
|
|
dateType: this.TimetoAhoose, |
|
|
|
statDateStart: this.statDateStart, |
|
|
|
statDateEnd:this.statDateEnd |
|
|
|
}).then((res) => { |
|
|
|
|
|
|
|
this.employeeExecutionRatelist=res.list |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
tabclick(i){ |
|
|
|
this.classatec=i; |
|
|
|
this.findAllZkEquipment() |
|
|
@@ -428,6 +512,8 @@ export default { |
|
|
|
this.customtime=[]; |
|
|
|
this.TimetoAhoose=i; |
|
|
|
this.getgicd() |
|
|
|
this.getindexZxllist() |
|
|
|
this.getemployeeExecutionRatelist() |
|
|
|
this.findProhibitedRecord() |
|
|
|
}, |
|
|
|
//切换时间 |
|
|
@@ -436,6 +522,8 @@ export default { |
|
|
|
this.statDateEnd=this.customtime[1]; |
|
|
|
this.TimetoAhoose=5; |
|
|
|
this.getgicd() |
|
|
|
this.getindexZxllist() |
|
|
|
this.getemployeeExecutionRatelist() |
|
|
|
this.findProhibitedRecord() |
|
|
|
}, |
|
|
|
} |
|
|
@@ -624,4 +712,55 @@ export default { |
|
|
|
font-size: 14px; |
|
|
|
} |
|
|
|
} |
|
|
|
// 进度条 |
|
|
|
.jinbox { |
|
|
|
width: 100%; |
|
|
|
height: 18px; |
|
|
|
line-height: 18px; |
|
|
|
display: flex; |
|
|
|
font-size: 16px; |
|
|
|
color: #2C3542; |
|
|
|
margin-top: 20px; |
|
|
|
.jinboxtit { |
|
|
|
width: 14%; |
|
|
|
height: 18px; |
|
|
|
padding-right: 6px; |
|
|
|
white-space: nowrap; |
|
|
|
text-overflow:ellipsis; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.jinbox-box { |
|
|
|
width: 75%; |
|
|
|
height: 100%; |
|
|
|
border-radius: 8px; |
|
|
|
background: #F2F2F2; |
|
|
|
} |
|
|
|
.boxbaifenbi { |
|
|
|
height: 100%; |
|
|
|
background:#60D7A0; |
|
|
|
border-radius: 8px; |
|
|
|
} |
|
|
|
.boxbaifenbi2 { |
|
|
|
height: 100%; |
|
|
|
background: #5B8FF9; |
|
|
|
} |
|
|
|
.jinboxbott { |
|
|
|
width: 16%; |
|
|
|
text-indent: 50px; |
|
|
|
} |
|
|
|
} |
|
|
|
.hejisan{ |
|
|
|
width: 92%; |
|
|
|
margin: 0 auto; |
|
|
|
display: flex; |
|
|
|
padding-top: 10px; |
|
|
|
padding-bottom:10px; |
|
|
|
.text1-1{ |
|
|
|
color: #666666; |
|
|
|
} |
|
|
|
.text1-2{ |
|
|
|
color: #333333; |
|
|
|
margin-top: 10px; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |