Browse Source

feat(market): 业绩看板展示优化

- 动态展示销售排行,移除静态数据- 添加获取统计信息功能
- 优化进度条显示,根据实际数据计算百分比
-调整数据展示格式,提高可读性
master
liutong 1 year ago
parent
commit
e67f343ee4
  1. 70
      pages/market/data/index.vue

70
pages/market/data/index.vue

@ -106,33 +106,11 @@
<!-- 销售排名-->
<view class="section_box_2" v-else>
<view class="itme">
<view class="title">01 李小刚</view>
<view class="money">¥100000</view>
<view class="itme" v-for="(v,k) in infoData.staff_list" :key="k">
<view class="title">{{k+1}} {{v.name}}</view>
<view class="money">¥{{v.goal}}</view>
<view class="plan">
<fui-progress :percent="80" height="15" radius="15" background="#e4e4e4" activeColor="#4bced0"></fui-progress>
</view>
</view>
<view class="itme">
<view class="title">02 张刚</view>
<view class="money">¥100000</view>
<view class="plan">
<fui-progress :percent="80" height="15" radius="15" background="#e4e4e4" activeColor="#4bced0"></fui-progress>
</view>
</view>
<view class="itme">
<view class="title">03 李华</view>
<view class="money">¥100000</view>
<view class="plan">
<fui-progress :percent="80" height="15" radius="15" background="#e4e4e4" activeColor="#4bced0"></fui-progress>
</view>
</view>
<view class="itme">
<view class="title">04 王明</view>
<view class="money">¥100000</view>
<view class="plan">
<fui-progress :percent="80" height="15" radius="15" background="#e4e4e4" activeColor="#4bced0"></fui-progress>
<fui-progress :percent="getPercent(v.wx_yj,v.goal)" height="15" radius="100" background="#e4e4e4" activeColor="#4bced0"></fui-progress>
</view>
</view>
</view>
@ -157,7 +135,9 @@ export default {
data() {
return {
infoData:{},//详情数据
infoData:{
staff_list:[],//销售排行
},//详情数据
//统计图相关
chartData: {},
@ -254,6 +234,7 @@ export default {
this.getPerformance()
},
//获取统计信息
async getPerformance(){
let res= await marketApi.performance({})
if (res.code != 1) {
@ -263,7 +244,7 @@ export default {
});
return
}
console.log('xx',res)
// console.log('xx',res)
this.infoData = res.data
//计算
@ -278,10 +259,10 @@ export default {
wwc_percent = parseInt(wwc_percent)
let w_c_d = ((xp + xf) - mb) * -1 * 100 //完成度
w_c_d = w_c_d >= 0 ? 0 : w_c_d
w_c_d = w_c_d <= 0 ? 0 : w_c_d
w_c_d = 100 - w_c_d
let w_c_d_rounded = Math.round(w_c_d * 10) / 10;
console.log('zzz',[xp_percent,xf_percent,wwc_percent,w_c_d_rounded])
// console.log('zzz',[xp_percent,xf_percent,wwc_percent,w_c_d_rounded])
@ -323,24 +304,24 @@ export default {
data: [
{
"name": "跟进中", // 数据项的名称,表示当前数据的分类为“跟进中”
"centerText": "70", // 中心显示的文本内容,这里为空字符串,表示不显示中心文本
"value": 70, // 数据项的值,表示“跟进中”的数量为50
"centerText": this.infoData.gj_count, // 中心显示的文本内容,这里为空字符串,表示不显示中心文本
"value": this.infoData.gj_lv, // 数据项的值,表示“跟进中”的数量为50
// "labelText":'跟进中'
"labelShow":false,
"color": "#FFCB31", // 自定义颜色
},
{
"name": "试听",
"centerText": "30",
"value": 30,
"centerText": this.infoData.st_count,
"value": this.infoData.st_lv,
// "labelText":"试听"
"labelShow":false,
"color": "#4DA3FF", // 自定义颜色
},
{
"name": "已成交",
"centerText": "10",
"value": 10,
"centerText": this.infoData.cj_count,
"value": this.infoData.cj_lv,
// "labelText":"已成交"
"labelShow":false,
"color": "#12E7E8", // 自定义颜色
@ -353,6 +334,23 @@ export default {
},
//计算百分比取整数
getPercent(num1,total){
// 计算百分比并取整数
if(!total){
return 0
}
let num_percent = (num1 / total) * 100;
if(num_percent <= 0){
num_percent = 0
}else{
num_percent = Math.ceil((num1 / total) * 100);
}
// console.log('qqq',[num_percent,num1,total])
return num_percent
},
//切换tag

Loading…
Cancel
Save