@@ -1,19 +1,18 @@ | |||
<template> | |||
<view class="box"> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4)">近七天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5)">近15天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6)">近30天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3)">自定义</view> | |||
</view> | |||
<view class="boxtittabs"> | |||
<div class="items" @tap="screenShow = true">{{ showTimeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
<div class="items" @tap="showTemplate = true">{{ showBeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
</view> | |||
<!-- 销讲业务 --> | |||
<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate" | |||
mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select> | |||
<view class="single"> | |||
<view class="title"> | |||
<view class="title1" style="flex: 1;">接待量排名(TOP10)</view> | |||
@@ -175,7 +174,7 @@ | |||
<view class="sort-number" v-if="index>2">{{index+1}}</view> | |||
{{item.name.substring(0,4)}} | |||
</view> | |||
<view class="progress-cus"> | |||
<view class="color1" v-if="index==0" :style="'width:'+ item.zxl||0 + '%'"></view> | |||
<view class="color2" v-if="index==1" :style="'width:'+ getPercent(item.zxl,4)+ '%'"></view> | |||
@@ -239,6 +238,25 @@ | |||
<!-- 加载组件 --> | |||
<u-loadings v-model="LOADING"></u-loadings> | |||
<!-- 更多筛选 --> | |||
<u-popup v-model="screenShow" mode="bottom" height="368"> | |||
<view class="screen"> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4, '近七天')">近七天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5, '近15天')">近15天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6, '近30天')">近30天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3, '自定义')">自定义</view> | |||
</view> | |||
</view> | |||
</view> | |||
</u-popup> | |||
</view> | |||
</template> | |||
@@ -285,6 +303,14 @@ | |||
total: '', | |||
result: [], | |||
}, | |||
screenShow: false, // 时间筛选弹窗 | |||
showTimeText: '近一周', // 展示文字 | |||
showBeText: '全部业务', // | |||
templateList: [], // 销讲业务 | |||
showTemplate: false, // 展示选择销讲业务弹窗 | |||
marketingBusiness: '', // 选择的业务id | |||
}; | |||
}, | |||
onLoad() { | |||
@@ -292,6 +318,7 @@ | |||
// 获取项目id | |||
this.houseId = uni.getStorageSync('buildingID').id; | |||
this.init() | |||
this.getMarketingBusiness() | |||
}, | |||
computed: { | |||
@@ -302,7 +329,33 @@ | |||
uni.stopPullDownRefresh(); | |||
}, 1000); | |||
}, | |||
methods: { | |||
methods: { // 销讲业务方法 | |||
templateCancel() { | |||
this.showTemplate = false; | |||
}, | |||
// 确认选择销讲业务 | |||
templateConfirm(e) { | |||
this.showTemplate = false; | |||
this.marketingBusiness = e[0].value | |||
this.showBeText = e[0].label | |||
this.init() | |||
}, | |||
// 获取销讲业务 | |||
getMarketingBusiness() { | |||
this.$u.get('/customer/marketingBusiness', { | |||
houseId: uni.getStorageSync('buildingID').id, | |||
}).then(res => { | |||
this.templateList = res | |||
this.templateList.unshift({ | |||
templateName: '全部业务', | |||
id: '' | |||
}) | |||
}) | |||
}, | |||
getPercent(num, type) { | |||
if (this.newlisttabinfo1.result && this.newlisttabinfo1.result.length && type == 1) { | |||
let index0 = this.newlisttabinfo1.result[0] | |||
@@ -461,17 +514,22 @@ | |||
//自定义时间 | |||
totalTimeChange(e) { | |||
this.screenShow = false | |||
this.showTimeText = `${e.startDate}-${e.endDate}` | |||
this.activeTotal = 3; | |||
this.lastEndDate = e.endDate | |||
this.lastStartDate = e.startDate | |||
this.init() | |||
}, | |||
//时间切换 | |||
tabtimetap(index) { | |||
this.activeTotal = index; | |||
tabtimetap(index, text) { | |||
if (index == 3) { | |||
this.totalTimeShow = true; | |||
this.screenShow = false | |||
} else { | |||
this.screenShow = false | |||
this.showTimeText = text | |||
this.activeTotal = index; | |||
this.lastEndDate = ''; | |||
this.lastStartDate = ''; | |||
this.init() | |||
@@ -493,6 +551,40 @@ | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.boxtittabs { | |||
width: 100%; | |||
height: 92rpx; | |||
background: #FFFFFF; | |||
display: flex; | |||
align-items: center; | |||
.items { | |||
padding: 0 24rpx; | |||
width: 50%; | |||
height: 100%; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
} | |||
} | |||
.screen { | |||
width: 100%; | |||
.boxtittab { | |||
width: 100%; | |||
flex-direction: column; | |||
border: none; | |||
.tabbox { | |||
width: 100%; | |||
} | |||
} | |||
} | |||
.box { | |||
width: 100%; | |||
height: 100%; | |||
@@ -1,18 +1,12 @@ | |||
<template> | |||
<view> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4)">近七天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5)">近15天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6)">近30天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3)">自定义</view> | |||
</view> | |||
<view class="boxtittabs"> | |||
<div class="items" @tap="screenShow = true">{{ showTimeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
<div class="items" @tap="showTemplate = true">{{ showBeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
</view> | |||
<view class="timepick"> | |||
@@ -22,8 +16,8 @@ | |||
</view> | |||
</view> | |||
<view class="timepickpick" @click="checkboxChange"> | |||
<image v-if="timepickpickisshow" style="width: 30rpx;height: 30rpx;" | |||
src="../../../static/images/xuanzhong.png" mode=""></image> | |||
<image v-if="timepickpickisshow" style="width: 30rpx;height: 30rpx;" | |||
src="../../../static/images/xuanzhong.png" mode=""></image> | |||
<view v-else style="width: 30rpx;height:30rpx;border: 1rpx solid #E0E0E0;"></view> | |||
<view style="font-size:26rpx;text-indent: 12rpx;">对比</view> | |||
</view> | |||
@@ -39,18 +33,18 @@ | |||
<view class="title1" style="flex: 1;">接待量</view> | |||
</view> | |||
<view class="hejisan"> | |||
<view class="sanbox1" > | |||
<view class="sanbox1"> | |||
<view class="text1-2">{{newTeam1||0}}</view> | |||
<view class="text1-1">{{staff1.label}}</view> | |||
</view> | |||
<view class="sanbox1" v-if="timepickpickisshow"> | |||
<view class="sanbox1" v-if="timepickpickisshow"> | |||
<view class="text1-2">{{newAvg1||0}}</view> | |||
<view class="text1-1">{{staff2.label}}</view> | |||
</view> | |||
</view> | |||
<view class="danwei">来访(人)</view> | |||
<view class="uchaserbox"> | |||
<qiun-data-charts v-if="isShow" type="line" :chartData="lineOptsect" background="none" :ontouch="true" | |||
<qiun-data-charts v-if="isShow" type="line" :chartData="lineOptsect" background="none" :ontouch="true" | |||
canvasId="wangxiaohuaerlingeryilingwuyibbb" :canvas2d="true" /> | |||
</view> | |||
</view> | |||
@@ -69,18 +63,18 @@ | |||
</view> | |||
</view> | |||
<view class="hejisan"> | |||
<view class="sanbox1" > | |||
<view class="sanbox1"> | |||
<view class="text1-2">{{newTeam2||0}}</view> | |||
<view class="text1-1">{{staff1.label}}</view> | |||
</view> | |||
<view class="sanbox1" v-if="timepickpickisshow"> | |||
<view class="sanbox1" v-if="timepickpickisshow"> | |||
<view class="text1-2">{{newAvg2||0}}</view> | |||
<view class="text1-1">{{staff2.label}}</view> | |||
</view> | |||
</view> | |||
<view class="danwei">录音时长</view> | |||
<view class="uchaserbox"> | |||
<qiun-data-charts v-if="isShow" type="line" :chartData="lineOptsect1" background="none" :ontouch="true" | |||
<qiun-data-charts v-if="isShow" type="line" :chartData="lineOptsect1" background="none" :ontouch="true" | |||
canvasId="wangxiaouaerlingeryilingwuyibhh" :canvas2d="true" /> | |||
</view> | |||
</view> | |||
@@ -99,11 +93,11 @@ | |||
</view> | |||
</view> | |||
<view class="hejisan"> | |||
<view class="sanbox1" > | |||
<view class="sanbox1"> | |||
<view class="text1-2">{{newTeam3||0}}</view> | |||
<view class="text1-1">{{staff1.label}}</view> | |||
</view> | |||
<view class="sanbox1" v-if="timepickpickisshow"> | |||
<view class="sanbox1" v-if="timepickpickisshow"> | |||
<view class="text1-2">{{newAvg3||0}}</view> | |||
<view class="text1-1">{{staff2.label}}</view> | |||
</view> | |||
@@ -130,10 +124,41 @@ | |||
</u-select> | |||
<u-select v-model="staffShow1" :list="staffList1" @confirm="staffSelectCallback" :default-value='selindex'> | |||
</u-select> | |||
<!-- 更多筛选 --> | |||
<u-popup v-model="screenShow" mode="bottom" height="368"> | |||
<view class="screen"> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4, '近七天')">近七天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5, '近15天')">近15天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6, '近30天')">近30天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3, '自定义')">自定义</view> | |||
</view> | |||
</view> | |||
</view> | |||
</u-popup> | |||
<!-- 销讲业务 --> | |||
<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate" | |||
mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select> | |||
<!-- 销讲业务2 --> | |||
<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplates" | |||
mode="single-column" :list="templateLists" @cancel="showTemplates = false" @confirm="templateConfirms"> | |||
</u-select> | |||
<!-- 加载组件 --> | |||
<u-loadings v-model="LOADING"></u-loadings> | |||
</view> | |||
</template> | |||
<script> | |||
@@ -228,6 +253,20 @@ | |||
} | |||
}, | |||
isShow: true, // 默认都展示 | |||
screenShow: false, // 时间筛选弹窗 | |||
showTimeText: '近七天', // 展示文字 | |||
showBeText: '全部业务', // | |||
templateList: [], // 销讲业务 | |||
showTemplate: false, // 展示选择销讲业务弹窗 | |||
marketingBusiness: '', // 选择的业务id | |||
showTemplates: false, // 展示选择销讲业务弹窗 | |||
templateLists: [], // 销讲业务 | |||
marketingBusinessId: '', // 选择的业务id | |||
showBeTexts: '', // | |||
}; | |||
}, | |||
@@ -238,6 +277,7 @@ | |||
// this.buildingname = uni.getStorageSync('buildingID').name; | |||
// 请求接口获取所有置业顾问员工的列表 | |||
this.getStaffList() | |||
this.getMarketingBusiness() | |||
}, | |||
onPullDownRefresh() { | |||
this.getStaffList() | |||
@@ -246,6 +286,47 @@ | |||
}, 1000); | |||
}, | |||
methods: { | |||
// 销讲业务方法 | |||
templateCancel() { | |||
this.showTemplate = false; | |||
}, | |||
// 确认选择销讲业务 | |||
templateConfirm(e) { | |||
this.showTemplate = false; | |||
this.marketingBusiness = e[0].value | |||
this.showBeText = e[0].label | |||
this.getdata() | |||
}, | |||
// 确认选择销讲业务 | |||
templateConfirms(e) { | |||
this.showTemplates = false; | |||
this.marketingBusinessId = e[0].value | |||
this.showBeTexts = e[0].label | |||
this.getdata() | |||
}, | |||
// 获取销讲业务 | |||
getMarketingBusiness() { | |||
this.$u.get('/customer/marketingBusiness', { | |||
houseId: uni.getStorageSync('buildingID').id, | |||
}).then(res => { | |||
this.templateLists = res.map(item => { | |||
return item | |||
}) | |||
this.marketingBusinessId = res[0].id | |||
this.showBeTexts = res[0].templateName | |||
this.templateList = res | |||
this.templateList.unshift({ | |||
templateName: '全部业务', | |||
id: '' | |||
}) | |||
}) | |||
}, | |||
//是否对比 | |||
checkboxChange() { | |||
this.isShow = false | |||
@@ -316,7 +397,8 @@ | |||
houseId: this.houseId, | |||
timeType: this.lastEndDate ? null : this.activeTotal + '', | |||
lastEndDate: this.lastEndDate, | |||
lastStartDate: this.lastStartDate | |||
lastStartDate: this.lastStartDate, | |||
marketingBusiness: this.marketingBusiness, | |||
}) | |||
.then(res => { | |||
this.newTeam1 = res.avg[0] | |||
@@ -363,7 +445,8 @@ | |||
houseId: this.houseId, | |||
timeType: this.lastEndDate ? null : this.activeTotal + '', | |||
lastEndDate: this.lastEndDate, | |||
lastStartDate: this.lastStartDate | |||
lastStartDate: this.lastStartDate, | |||
marketingBusiness: this.marketingBusiness, | |||
}) | |||
.then(res => { | |||
this.newTeam3 = res.avg[0] | |||
@@ -414,7 +497,8 @@ | |||
houseId: this.houseId, | |||
timeType: this.lastEndDate ? null : this.activeTotal + '', | |||
lastEndDate: this.lastEndDate, | |||
lastStartDate: this.lastStartDate | |||
lastStartDate: this.lastStartDate, | |||
marketingBusiness: this.marketingBusiness, | |||
}) | |||
} else { | |||
res = await this.$u.post('/cusLvStatistics/employeeAnalysisRecordingTime', { | |||
@@ -423,7 +507,8 @@ | |||
houseId: this.houseId, | |||
timeType: this.lastEndDate ? null : this.activeTotal + '', | |||
lastEndDate: this.lastEndDate, | |||
lastStartDate: this.lastStartDate | |||
lastStartDate: this.lastStartDate, | |||
marketingBusiness: this.marketingBusiness, | |||
}) | |||
} | |||
// console.log(res) | |||
@@ -473,7 +558,8 @@ | |||
houseId: this.houseId, | |||
timeType: this.lastEndDate ? null : this.activeTotal + '', | |||
lastEndDate: this.lastEndDate, | |||
lastStartDate: this.lastStartDate | |||
lastStartDate: this.lastStartDate, | |||
marketingBusiness: this.marketingBusinessId, | |||
}) | |||
.then(res => { | |||
this.LOADING = false | |||
@@ -513,17 +599,17 @@ | |||
this.LOADING = false | |||
}) | |||
}, | |||
tabtimetap(index) { | |||
this.activeTotal = index; | |||
tabtimetap(index, text) { | |||
if (index == 3) { | |||
this.totalTimeShow = true; | |||
this.screenShow = false | |||
} else { | |||
this.screenShow = false | |||
this.showTimeText = text | |||
this.activeTotal = index; | |||
this.lastEndDate = '' | |||
this.lastStartDate = '' | |||
// 获取数据 | |||
// this.getreception() | |||
// this.getRecordList() | |||
// this.getAwardList() | |||
this.getdata() | |||
} | |||
}, | |||
@@ -535,6 +621,8 @@ | |||
//自定义时间 | |||
totalTimeChange(e) { | |||
console.log(e.startDate, e.endDate) | |||
this.screenShow = false | |||
this.showTimeText = `${e.startDate}-${e.endDate}` | |||
this.activeTotal = 3; | |||
this.lastEndDate = e.endDate | |||
this.lastStartDate = e.startDate | |||
@@ -573,24 +661,58 @@ | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.boxtittabs { | |||
width: 100%; | |||
height: 92rpx; | |||
background: #FFFFFF; | |||
display: flex; | |||
align-items: center; | |||
.items { | |||
padding: 0 24rpx; | |||
width: 50%; | |||
height: 100%; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
} | |||
} | |||
.screen { | |||
width: 100%; | |||
.boxtittab { | |||
width: 100%; | |||
flex-direction: column; | |||
border: none; | |||
.tabbox { | |||
width: 100%; | |||
} | |||
} | |||
} | |||
.boxtittab { | |||
position: sticky; | |||
top: var(--window-top); | |||
z-index: 999; | |||
} | |||
.hejisan{ | |||
.hejisan { | |||
width: 92%; | |||
margin: 0 auto; | |||
display: flex; | |||
padding-bottom:20rpx; | |||
.sanbox1{ | |||
padding-bottom: 20rpx; | |||
.sanbox1 { | |||
flex: 1; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
align-items: center; | |||
position: relative; | |||
&::after{ | |||
&::after { | |||
position: absolute; | |||
content: ''; | |||
width: 1rpx; | |||
@@ -599,6 +721,7 @@ | |||
right: 0; | |||
top: 0; | |||
} | |||
&:last-child::after { | |||
position: absolute; | |||
content: ''; | |||
@@ -609,14 +732,16 @@ | |||
background: #fff; | |||
} | |||
} | |||
.text1-1{ | |||
.text1-1 { | |||
font-size: 24rpx; | |||
font-family: PingFangSC-Regular, PingFang SC; | |||
font-weight: 400; | |||
color: #333333; | |||
line-height: 32rpx; | |||
} | |||
.text1-2{ | |||
.text1-2 { | |||
color: #333333; | |||
font-size: 40rpx; | |||
line-height: 46rpx; | |||
@@ -1,23 +1,21 @@ | |||
<template> | |||
<view class="box"> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4)">近七天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5)">近15天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6)">近30天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3)">自定义</view> | |||
</view> | |||
<view class="boxtittabs"> | |||
<div class="items" @tap="screenShow = true">{{ showTimeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
<div class="items" @tap="showTemplate = true">{{ showBeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
</view> | |||
<view class="timepick"> | |||
<view class="timepicktime" @click="chiocStaff(0)"> | |||
<view>{{staff1.label}} <image class="Underimg" src="../../../static/images/down.png" mode=""></image></view> | |||
<view>{{staff1.label}} | |||
<image class="Underimg" src="../../../static/images/down.png" mode=""></image> | |||
</view> | |||
</view> | |||
<view class="timepickpick" v-if="staff1.value"> | |||
<view @click="checkboxChange()" style="width: 40rpx;height:40rpx;border: 1rpx solid #E0E0E0;"> | |||
@@ -27,7 +25,9 @@ | |||
<view style="font-size:26rpx;text-indent: 12rpx;">对比</view> | |||
</view> | |||
<view class="timepicktime" v-if="timepickpickisshow" @click="chiocStaff(1)"> | |||
<view>{{staff2.label}}<image class="Underimg" src="../../../static/images/down.png" mode=""></image></view> | |||
<view>{{staff2.label}} | |||
<image class="Underimg" src="../../../static/images/down.png" mode=""></image> | |||
</view> | |||
</view> | |||
</view> | |||
@@ -48,7 +48,7 @@ | |||
<view class="text1-2">{{newTeam1||0}}</view> | |||
<view class="text1-1">{{!staff1.value?'团队总数':staff1.label}}</view> | |||
</view> | |||
<view class="sanbox1" > | |||
<view class="sanbox1"> | |||
<view class="text1-2">{{newAvg1||0}}</view> | |||
<view class="text1-1">{{!staff2.value?'团队平均':staff2.label}}</view> | |||
</view> | |||
@@ -57,9 +57,9 @@ | |||
<view class="danwei">接待量(次)</view> | |||
<view class="uchaserbox"> | |||
<template v-if="lineOptsect1"> | |||
<qiun-data-charts type="line" :opts="lineOpts1" :chartData="lineOptsect1" background="none" :ontouch="true" | |||
canvasId="wangxiaohuaerlingeryilingwuyibbb" :canvas2d="true" /> | |||
</template> | |||
<qiun-data-charts type="line" :opts="lineOpts1" :chartData="lineOptsect1" background="none" | |||
:ontouch="true" canvasId="wangxiaohuaerlingeryilingwuyibbb" :canvas2d="true" /> | |||
</template> | |||
</view> | |||
</view> | |||
<view class="jindu" v-if="eharTab.active1 == 0 "> | |||
@@ -67,7 +67,7 @@ | |||
<view class="jindu-boxche"> | |||
<view class="jindu-name">{{item.name.substring(0, 4)}}</view> | |||
<view class="progress-cus"> | |||
<view class="color" :style="'width:'+ getPercent(item.zxl,1) + '%'" ></view> | |||
<view class="color" :style="'width:'+ getPercent(item.zxl,1) + '%'"></view> | |||
</view> | |||
<view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view> | |||
</view> | |||
@@ -91,11 +91,11 @@ | |||
</view> | |||
</view> | |||
<view class="hejisan"> | |||
<view class="sanbox1" > | |||
<view class="sanbox1"> | |||
<view class="text1-2">{{newTeam2||0}}</view> | |||
<view class="text1-1">{{!staff1.value?'团队总数':staff1.label}}</view> | |||
</view> | |||
<view class="sanbox1" > | |||
<view class="sanbox1"> | |||
<view class="text1-2">{{newAvg2||0}}</view> | |||
<view class="text1-1">{{!staff2.value?'团队平均':staff2.label}}</view> | |||
</view> | |||
@@ -104,8 +104,8 @@ | |||
<view class="danwei">录音时长(min)</view> | |||
<view class="uchaserbox"> | |||
<template v-if="lineOptsect2"> | |||
<qiun-data-charts type="line" :opts="lineOpts1" :chartData="lineOptsect2" background="none" :ontouch="true" | |||
canvasId="wangxiaohuaerlingeryilingwuyibb" :canvas2d="true" /> | |||
<qiun-data-charts type="line" :opts="lineOpts1" :chartData="lineOptsect2" background="none" | |||
:ontouch="true" canvasId="wangxiaohuaerlingeryilingwuyibb" :canvas2d="true" /> | |||
</template> | |||
</view> | |||
</view> | |||
@@ -114,7 +114,7 @@ | |||
<view class="jindu-boxche"> | |||
<view class="jindu-name">{{item.name.substring(0, 4)}}</view> | |||
<view class="progress-cus"> | |||
<view class="color" :style="'width:'+ getPercent(item.zxl,2) + '%'" ></view> | |||
<view class="color" :style="'width:'+ getPercent(item.zxl,2) + '%'"></view> | |||
</view> | |||
<view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view> | |||
</view> | |||
@@ -148,7 +148,7 @@ | |||
<view class="jindu-boxche"> | |||
<view class="jindu-name">{{item.name.substring(0, 4)}}</view> | |||
<view class="progress-cus"> | |||
<view class="color" :style="'width:'+ getPercent1(item.zxl) + '%'" ></view> | |||
<view class="color" :style="'width:'+ getPercent1(item.zxl) + '%'"></view> | |||
</view> | |||
<view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}%</view> | |||
</view> | |||
@@ -159,9 +159,14 @@ | |||
<view class="single"> | |||
<view class="title" style="padding-right: 30rpx;"> | |||
<view class="title1" style="flex: 1;">销讲能力</view> | |||
<view class="title2" style="flex: 1;justify-content: flex-end;" @click="goTeam"> | |||
<view class="title2-che">团队 | |||
<image class="righttochoose" src="../../../static/images/down.png" mode=""></image> | |||
<view class="title2" style="flex-grow: 1;justify-content: flex-end;"> | |||
<view class="title2-che" @click="showTemplates=true" style="width: 220rpx;"> | |||
{{ showBeTexts }} | |||
<image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image> | |||
</view> | |||
<view class="title2-che" @click="goTeam" style="width: 170rpx;">团队 | |||
<image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image> | |||
</view> | |||
</view> | |||
</view> | |||
@@ -177,10 +182,39 @@ | |||
</u-select> | |||
<u-select v-model="staffShow1" :list="staffList1" @confirm="staffSelectCallback" :default-value='selindex'> | |||
</u-select> | |||
<!-- 更多筛选 --> | |||
<u-popup v-model="screenShow" mode="bottom" height="368"> | |||
<view class="screen"> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4, '近七天')">近七天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5, '近15天')">近15天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6, '近30天')">近30天</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3, '自定义')">自定义</view> | |||
</view> | |||
</view> | |||
</view> | |||
</u-popup> | |||
<!-- 销讲业务 --> | |||
<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate" | |||
mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select> | |||
<!-- 销讲业务2 --> | |||
<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplates" | |||
mode="single-column" :list="templateLists" @cancel="showTemplates = false" @confirm="templateConfirms"> | |||
</u-select> | |||
<!-- 加载组件 --> | |||
<u-loadings v-model="LOADING"></u-loadings> | |||
</view> | |||
</template> | |||
@@ -357,12 +391,10 @@ | |||
itemCount: 8 | |||
}, | |||
yAxis: { | |||
data: [ | |||
{ | |||
max: 100, | |||
min: 0, | |||
} | |||
] | |||
data: [{ | |||
max: 100, | |||
min: 0, | |||
}] | |||
} | |||
}, | |||
lineOpts1: { | |||
@@ -372,10 +404,26 @@ | |||
itemCount: 8 | |||
} | |||
}, | |||
screenShow: false, // 时间筛选弹窗 | |||
showTimeText: '近七天', // 展示文字 | |||
showBeText: '全部业务', // | |||
templateList: [], // 销讲业务 | |||
showTemplate: false, // 展示选择销讲业务弹窗 | |||
marketingBusiness: '', // 选择的业务id | |||
showTemplates: false, // 展示选择销讲业务弹窗 | |||
templateLists: [], // 销讲业务 | |||
marketingBusinessId: '', // 选择的业务id | |||
showBeTexts: '', // | |||
}; | |||
}, | |||
onLoad() { | |||
this.LOADING = true | |||
this.getMarketingBusiness() | |||
let that = this | |||
uni.$on('update', function(data) { | |||
// console.log(data) | |||
@@ -390,32 +438,76 @@ | |||
this.getSectionList() | |||
}, | |||
onPullDownRefresh(){ | |||
onPullDownRefresh() { | |||
this.getSectionList() | |||
setTimeout(function () { | |||
uni.stopPullDownRefresh(); | |||
setTimeout(function() { | |||
uni.stopPullDownRefresh(); | |||
}, 1000); | |||
}, | |||
methods: { | |||
getPercent1(num){ | |||
// 销讲业务方法 | |||
templateCancel() { | |||
this.showTemplate = false; | |||
}, | |||
// 确认选择销讲业务 | |||
templateConfirm(e) { | |||
this.showTemplate = false; | |||
this.marketingBusiness = e[0].value | |||
this.showBeText = e[0].label | |||
this.getSectionList() | |||
}, | |||
// 确认选择销讲业务 | |||
templateConfirms(e) { | |||
this.showTemplates = false; | |||
this.marketingBusinessId = e[0].value | |||
this.showBeTexts = e[0].label | |||
// 获取销奖能力 | |||
this.getPowerList() | |||
}, | |||
// 获取销讲业务 | |||
getMarketingBusiness() { | |||
this.$u.get('/customer/marketingBusiness', { | |||
houseId: uni.getStorageSync('buildingID').id, | |||
}).then(res => { | |||
this.templateLists = res.map(item => { | |||
return item | |||
}) | |||
this.marketingBusinessId = res[0].id | |||
this.showBeTexts = res[0].templateName | |||
this.templateList = res | |||
this.templateList.unshift({ | |||
templateName: '全部业务', | |||
id: '' | |||
}) | |||
}) | |||
}, | |||
getPercent1(num) { | |||
console.log(num) | |||
return num||0 | |||
return num || 0 | |||
}, | |||
getPercent(num,type) { | |||
if(this.newlisttabinfo1&&this.newlisttabinfo1.length&&type==1){ | |||
getPercent(num, type) { | |||
if (this.newlisttabinfo1 && this.newlisttabinfo1.length && type == 1) { | |||
console.log(this.newlisttabinfo1) | |||
let index0 = this.newlisttabinfo1[0] | |||
let percent = num/(index0.zxl) * 100 | |||
let percent = num / (index0.zxl) * 100 | |||
return percent.toFixed(2) | |||
}else if(this.newlisttabinfo2&&this.newlisttabinfo2.length&&type==2){ | |||
} else if (this.newlisttabinfo2 && this.newlisttabinfo2.length && type == 2) { | |||
let index0 = this.newlisttabinfo2[0] | |||
let percent = num/(index0.zxl) * 100 | |||
let percent = num / (index0.zxl) * 100 | |||
return percent.toFixed(2) | |||
}else if(this.newlisttabinfo3&&this.newlisttabinfo3.length&&type==3){ | |||
} else if (this.newlisttabinfo3 && this.newlisttabinfo3.length && type == 3) { | |||
let index0 = this.newlisttabinfo3[0] | |||
let percent = num/(index0.zxl) * 100 | |||
let percent = num / (index0.zxl) * 100 | |||
return percent.toFixed(2) | |||
}else{ | |||
} else { | |||
return 0 | |||
} | |||
}, | |||
@@ -485,11 +577,15 @@ | |||
}, | |||
//时间切换 | |||
tabtimetap(index) { | |||
tabtimetap(index, text) { | |||
this.activeTotal = index; | |||
if (index == 3) { | |||
this.totalTimeShow = true; | |||
this.screenShow = false | |||
} else { | |||
this.screenShow = false | |||
this.showTimeText = text | |||
this.activeTotal = index; | |||
this.lastEndDate = '' | |||
this.lastStartDate = '' | |||
// 获取数据 | |||
@@ -528,6 +624,8 @@ | |||
//自定义时间 | |||
totalTimeChange(e) { | |||
console.log(e.startDate, e.endDate) | |||
this.screenShow = false | |||
this.showTimeText = `${e.startDate}-${e.endDate}` | |||
this.activeTotal = 3; | |||
this.lastEndDate = e.endDate | |||
this.lastStartDate = e.startDate | |||
@@ -603,7 +701,8 @@ | |||
houseId: this.houseId, | |||
timeType: this.lastEndDate ? null : this.activeTotal + '', | |||
lastEndDate: this.lastEndDate, | |||
lastStartDate: this.lastStartDate | |||
lastStartDate: this.lastStartDate, | |||
marketingBusiness: this.marketingBusiness, | |||
}) | |||
.then(res => { | |||
console.log('我再此') | |||
@@ -754,7 +853,8 @@ | |||
houseId: this.houseId, | |||
timeType: this.lastEndDate ? null : this.activeTotal + '', | |||
lastEndDate: this.lastEndDate, | |||
lastStartDate: this.lastStartDate | |||
lastStartDate: this.lastStartDate, | |||
marketingBusiness: this.marketingBusinessId, | |||
}) | |||
.then(res => { | |||
this.LOADING = false | |||
@@ -865,6 +965,26 @@ | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.boxtittabs { | |||
width: 100%; | |||
height: 92rpx; | |||
background: #FFFFFF; | |||
display: flex; | |||
align-items: center; | |||
.items { | |||
padding: 0 24rpx; | |||
width: 50%; | |||
height: 100%; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
} | |||
} | |||
.boxtittab { | |||
position: sticky; | |||
top: var(--window-top); | |||
@@ -876,7 +996,8 @@ | |||
height: 100%; | |||
background: #FAFAFA; | |||
} | |||
.single{ | |||
.single { | |||
margin-top: 20rpx; | |||
padding-bottom: 20rpx; | |||
} | |||
@@ -913,20 +1034,22 @@ | |||
margin-left: 12rpx; | |||
} | |||
.hejisan{ | |||
.hejisan { | |||
width: 92%; | |||
margin: 0 auto; | |||
display: flex; | |||
padding-top: 20rpx; | |||
padding-bottom:20rpx; | |||
.sanbox1{ | |||
padding-bottom: 20rpx; | |||
.sanbox1 { | |||
flex: 1; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
align-items: center; | |||
position: relative; | |||
&::after{ | |||
&::after { | |||
position: absolute; | |||
content: ''; | |||
width: 1rpx; | |||
@@ -935,6 +1058,7 @@ | |||
right: 0; | |||
top: 0; | |||
} | |||
&:last-child::after { | |||
position: absolute; | |||
content: ''; | |||
@@ -945,14 +1069,16 @@ | |||
background: #fff; | |||
} | |||
} | |||
.text1-1{ | |||
.text1-1 { | |||
font-size: 24rpx; | |||
font-family: PingFangSC-Regular, PingFang SC; | |||
font-weight: 400; | |||
color: #333333; | |||
line-height: 32rpx; | |||
} | |||
.text1-2{ | |||
.text1-2 { | |||
color: #333333; | |||
font-size: 40rpx; | |||
line-height: 46rpx; | |||
@@ -960,4 +1086,30 @@ | |||
margin-bottom: 10rpx; | |||
} | |||
} | |||
.righttochoose { | |||
width: 24rpx; | |||
height: 24rpx !important; | |||
} | |||
.title2-che { | |||
display: flex; | |||
align-items: center; | |||
justify-content: space-around; | |||
overflow: hidden; | |||
} | |||
.screen { | |||
width: 100%; | |||
.boxtittab { | |||
width: 100%; | |||
flex-direction: column; | |||
border: none; | |||
.tabbox { | |||
width: 100%; | |||
} | |||
} | |||
} | |||
</style> |
@@ -63,25 +63,6 @@ | |||
{{(item.num2*1) > 0 ? '↑' : '↓'}}</text> | |||
</view> | |||
</view> | |||
<!-- <view class="grid" v-for="(item,index) in numlist" :key="index" | |||
style="height: auto;padding-bottom: 20rpx;"> | |||
<view class="audonum" v-if="item.name=='平均接待时长'"> | |||
<view class="circle"></view> | |||
{{item.name}}/分</view> | |||
<view class="audonum" v-else> | |||
<view class="circle"></view> | |||
{{item.name}}</view> | |||
<view class="num"> | |||
<view class="" style="width: 35%;"> | |||
{{index==0?item.num+'%':item.num}} | |||
</view> | |||
<view class="comparesize" v-if="compareFlag&&timepickpickisshow"> | |||
<text style="margin-right: 10rpx;">对比:{{index==1?item.num1+'%':item.num1}}</text> | |||
<text | |||
:style="{color:item.num2*1>0?'red':'green'}">{{item.num2+'%'}}{{(item.num2*1) > 0 ? '↑' : '↓'}}</text> | |||
</view> | |||
</view> | |||
</view> --> | |||
</view> | |||
</view> | |||
<view class="boxtittab" style="border: none;height: 82rpx;"> | |||
@@ -104,11 +85,19 @@ | |||
<view class="chart"> | |||
<view | |||
style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 16rpx;" | |||
v-if="guwenshow&&lopanobj.name" @click="oninputtap()"> | |||
<view class="title2-che u-flex" style="width: 220rpx;">{{lopanobj.name}} | |||
<image class="righttochoose" src="../../../static/images/down.png" mode=""></image> | |||
<view style="display: flex;padding: 0 0 40rpx 0;justify-content: center;"> | |||
<view class="marketingBusiness"> | |||
<view class="marketingBusinesstext" style="min-width: 50rpx;" @click="showMarketingBusiness = true"> | |||
{{ marketingBusinessText }} | |||
<image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image> | |||
</view> | |||
</view> | |||
<view | |||
style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 0rpx;" | |||
v-if="guwenshow&&lopanobj.name" @click="oninputtap()"> | |||
<view class="title2-che u-flex" style="width: 220rpx;">{{lopanobj.name}} | |||
<image class="righttochoose" src="../../../static/images/down.png" mode=""></image> | |||
</view> | |||
</view> | |||
</view> | |||
<view style="padding: 30rpx;padding-bottom: 20rpx;align-items: center;" v-if="Selectlevel"> | |||
@@ -122,12 +111,6 @@ | |||
<image src="https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/qf/more.png" | |||
style="width:12rpx;height:23rpx;margin-left: 16rpx;"> | |||
</view> | |||
<!-- <view style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 16rpx;" | |||
v-if="Selectlevelobj.name" @click="oninputtap2()"> | |||
<view class="title2-che" style="width: 220rpx;">{{Selectlevelobj.name}} | |||
<image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image> | |||
</view> | |||
</view> --> | |||
</view> | |||
@@ -230,9 +213,12 @@ | |||
<newcalendar v-model="totalTimeShow2" :planNum='intervaltime' mode="date" @change="totalTimeChange2"> | |||
</newcalendar> | |||
<u-select v-model="showMarketingBusiness" mode="single-column" :list="showMarketingList" | |||
label-name="templateName" value-name="id" @confirm="selectMarketingBusiness"></u-select> | |||
<!-- 加载组件 --> | |||
<u-loadings v-model="LOADING"></u-loadings> | |||
</view> | |||
</template> | |||
<script> | |||
@@ -353,7 +339,13 @@ | |||
max: 100 | |||
} | |||
} | |||
} | |||
}, | |||
marketingBusinessText: '请选择销讲业务', | |||
showMarketingBusiness: false, // 展示可选择的销讲业务 | |||
showMarketingList: [], // 销讲业务列表 | |||
marketingBusiness: '', // 销讲业务 | |||
}; | |||
}, | |||
@@ -364,6 +356,7 @@ | |||
this.LOADING = true | |||
this.pamect.houseId = uni.getStorageSync('buildingID').id; | |||
this.init() | |||
this.getMarketingBusiness() | |||
}, | |||
onPullDownRefresh() { | |||
this.init() | |||
@@ -396,6 +389,30 @@ | |||
}, | |||
}, | |||
methods: { | |||
// 获取销讲业务模板 | |||
getMarketingBusiness() { | |||
this.$u.get("/customer/marketingBusiness", { | |||
houseId: this.pamect.houseId | |||
}).then(res => { | |||
console.log(res) | |||
if (res) { | |||
this.showMarketingList = res | |||
this.showMarketingList.unshift({ | |||
templateName: '全部', | |||
id: '' | |||
}) | |||
} | |||
}) | |||
}, | |||
// 选择趋势分析 | |||
selectMarketingBusiness(e) { | |||
this.marketingBusinessText = e[0].label | |||
this.marketingBusiness = e[0].value | |||
this.init() | |||
}, | |||
//是否对比 | |||
checkboxChange() { | |||
if (this.newactiveTotal == 3) { | |||
@@ -427,6 +444,7 @@ | |||
}, | |||
init() { | |||
this.pamect.marketingBusiness = this.marketingBusiness | |||
this.$u.post("/cusLvStatistics/lyAndcp", this.pamect).then(data => { | |||
this.pamect.lastStartDate = data.lastStartDate; | |||
this.pamect.lastEndDate = data.lastEndDate; | |||
@@ -449,8 +467,6 @@ | |||
this.numlist[1].num2 = data.contrastSumDuration || 0; | |||
this.numlist[2].num = data.startReceptionCount || 0 | |||
this.numlist[2].num2 = data.contrastReceptionCount || 0 | |||
} else { | |||
this.compareFlag = false | |||
} | |||
@@ -495,7 +511,7 @@ | |||
this.aboutEecondary() | |||
} | |||
} | |||
setTimeout(() => { | |||
this.LOADING = false | |||
}, 1500) | |||
@@ -611,6 +627,20 @@ | |||
}, | |||
//tab切换 | |||
tabxuanxiangtap(index) { | |||
if (index == 1 || index == 3 || index == 4) { | |||
if (this.showMarketingList.findIndex(item => item.id == '') != -1) { | |||
this.showMarketingList.shift() | |||
} | |||
this.marketingBusinessText = this.showMarketingList[0].templateName | |||
this.marketingBusiness = this.showMarketingList[0].id | |||
} else { | |||
this.showMarketingList.unshift({ | |||
templateName: '全部', | |||
id: '' | |||
}) | |||
this.marketingBusiness = '' | |||
this.marketingBusinessText = '请选择销讲业务' | |||
} | |||
this.newactiveTotal = index; | |||
this.guwenshow = false; | |||
this.Selectlevel = false; | |||
@@ -1442,4 +1472,47 @@ | |||
.grid:nth-child(3) { | |||
border-right: 1rpx solid #E0E0E0; | |||
} | |||
.chart { | |||
padding: 40rpx 0 20rpx; | |||
min-height: 50vh; | |||
.marketingBusiness { | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
.marketingBusinesstext { | |||
padding: 0 20rpx; | |||
display: flex; | |||
align-items: center; | |||
border-radius: 8rpx; | |||
border: 1rpx solid #666666; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
.righttochoose { | |||
margin-left: 12rpx; | |||
width: 18rpx; | |||
height: 24rpx; | |||
} | |||
} | |||
} | |||
} | |||
.screen { | |||
width: 100%; | |||
.boxtittab { | |||
width: 100%; | |||
flex-direction: column; | |||
border: none; | |||
.tabbox { | |||
width: 100%; | |||
} | |||
} | |||
} | |||
</style> |
@@ -1,18 +1,12 @@ | |||
<template> | |||
<view class="box"> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 0 }" @click="tabtimetap(0)">今日</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 1 }" @click="tabtimetap(1)">昨日</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 2 }" @click="tabtimetap(2)">近一周</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3)">自定义</view> | |||
</view> | |||
<view class="boxtittabs"> | |||
<div class="items" @tap="screenShow = true">{{ showTimeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
<div class="items" @tap="showTemplate = true">{{ showBeText }} | |||
<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon> | |||
</div> | |||
</view> | |||
<view class="info"> | |||
<view class="item" @click="goTo(1)"> | |||
@@ -34,12 +28,17 @@ | |||
<view class="grid" v-for="(item,index) in numlist" :key="index" v-if="item.isshow"> | |||
<view class="audonum"> | |||
<view class="circle"></view> | |||
{{item.name}} {{index!=0?'触达次数':''}}</view> | |||
{{item.name}} {{index!=0?'触达次数':''}} | |||
</view> | |||
<view class="num">{{item.num}}</view> | |||
</view> | |||
</view> | |||
<view v-if="Afolding==true" class="anclack" @click="anclick(1)">展开 <u-icon style="margin-left: 8rpx;" label-color='#666666' name="arrow-down"></u-icon></view> | |||
<view v-if="Afolding==false" class="anclack" @click="anclick(2)">收起 <u-icon style="margin-left: 8rpx;" label-color='#666666' name="arrow-up"></u-icon></view> | |||
<view v-if="Afolding==true" class="anclack" @click="anclick(1)">展开 <u-icon style="margin-left: 8rpx;" | |||
label-color='#666666' name="arrow-down"></u-icon> | |||
</view> | |||
<view v-if="Afolding==false" class="anclack" @click="anclick(2)">收起 <u-icon style="margin-left: 8rpx;" | |||
label-color='#666666' name="arrow-up"></u-icon> | |||
</view> | |||
</view> | |||
<view class="centerfor" v-for="(item,index) in objlist" :key="index"> | |||
<view class="fortit"> | |||
@@ -60,7 +59,9 @@ | |||
<view>触达占比</view> | |||
<view>沟通记录</view> | |||
</view> | |||
<view v-if="item.total==0" style="color: #666;font-size:28rpx;width: 100%;height: 500rpx;line-height: 500rpx;text-align: center;" >暂无数据</view> | |||
<view v-if="item.total==0" | |||
style="color: #666;font-size:28rpx;width: 100%;height: 500rpx;line-height: 500rpx;text-align: center;"> | |||
暂无数据</view> | |||
<view class="tabtd" v-if="item.total" v-for="(chend,i) in item.matchKeywords" :key="i"> | |||
<view> | |||
<image v-if="i==0" class="ranking" src="../../../static/images/top1.png" mode=""></image> | |||
@@ -75,18 +76,14 @@ | |||
</view> | |||
<view v-if="item.activeTab==1" class="tabech"> | |||
<template v-if="item.chartDataShow"> | |||
<qiun-data-charts | |||
:key="item.id" | |||
type="ring" | |||
:chartData="item.chartData" | |||
:canvas2d="true" | |||
:canvasId="'wangxiaohuahahahahaha'+item.id" | |||
:opts='item.opts' | |||
background="none" /> | |||
<qiun-data-charts :key="item.id" type="ring" :chartData="item.chartData" :canvas2d="true" | |||
:canvasId="'wangxiaohuahahahahaha'+item.id" :opts='item.opts' background="none" /> | |||
</template> | |||
<template v-else> | |||
<view> | |||
<view style="color: #666;font-size:28rpx;width: 100%;height: 500rpx;line-height: 500rpx;text-align: center;" >暂无数据</view> | |||
<view | |||
style="color: #666;font-size:28rpx;width: 100%;height: 500rpx;line-height: 500rpx;text-align: center;"> | |||
暂无数据</view> | |||
</view> | |||
</template> | |||
</view> | |||
@@ -94,6 +91,36 @@ | |||
<u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar> | |||
<u-back-top :scroll-top="scrollTop"></u-back-top> | |||
<!-- 更多筛选 --> | |||
<u-popup v-model="screenShow" mode="bottom" height="368"> | |||
<view class="screen"> | |||
<view class="boxtittab"> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 0 }" @click="tabtimetap(0, '今日')">今日</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 1 }" @click="tabtimetap(1, '昨日')">昨日</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 2 }" @click="tabtimetap(2, '近一周')">近一周 | |||
</view> | |||
</view> | |||
<view class="tabbox"> | |||
<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3, '自定义')">自定义 | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
</u-popup> | |||
<!-- 销讲业务 --> | |||
<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate" | |||
mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select> | |||
</view> | |||
</template> | |||
@@ -106,97 +133,139 @@ | |||
return { | |||
scrollTop: 0, | |||
activeTotal: 2, | |||
timeobj:{ | |||
statDateStart:'', | |||
statDateEnd:'' | |||
timeobj: { | |||
statDateStart: '', | |||
statDateEnd: '' | |||
}, | |||
buildingID:'', | |||
buildingID: '', | |||
totalTimeShow: false, | |||
activeTab: 0, | |||
numlist:[], | |||
objlist:[], | |||
Afolding:true, | |||
efficient:"", | |||
markCount:"", | |||
noMarkCount:"" | |||
numlist: [], | |||
objlist: [], | |||
Afolding: true, | |||
efficient: "", | |||
markCount: "", | |||
noMarkCount: "", | |||
screenShow: false, // 时间筛选弹窗 | |||
showTimeText: '近一周', // 展示文字 | |||
showBeText: '全部业务', // | |||
templateList: [], // 销讲业务 | |||
showTemplate: false, // 展示选择销讲业务弹窗 | |||
marketingBusiness: '', // 选择的业务id | |||
}; | |||
}, | |||
onPageScroll(e) { | |||
this.scrollTop = e.scrollTop; | |||
}, | |||
onLoad() { | |||
this.buildingID=uni.getStorageSync('buildingID').id; | |||
this.buildingID = uni.getStorageSync('buildingID').id; | |||
this.gitinit() | |||
this.getMarketingBusiness() | |||
}, | |||
onPullDownRefresh(){ | |||
onPullDownRefresh() { | |||
this.gitinit() | |||
setTimeout(function () { | |||
uni.stopPullDownRefresh(); | |||
setTimeout(function() { | |||
uni.stopPullDownRefresh(); | |||
}, 1000); | |||
}, | |||
methods: { | |||
goTo(i){ | |||
if(i==1){ | |||
methods: { // 销讲业务方法 | |||
templateCancel() { | |||
this.showTemplate = false; | |||
}, | |||
// 确认选择销讲业务 | |||
templateConfirm(e) { | |||
this.showTemplate = false; | |||
this.marketingBusiness = e[0].value | |||
this.showBeText = e[0].label | |||
this.gitinit() | |||
}, | |||
// 获取销讲业务 | |||
getMarketingBusiness() { | |||
this.$u.get('/customer/marketingBusiness', { | |||
houseId: uni.getStorageSync('buildingID').id, | |||
}).then(res => { | |||
this.templateList = res | |||
this.templateList.unshift({ | |||
templateName: '全部业务', | |||
id: '' | |||
}) | |||
}) | |||
}, | |||
goTo(i) { | |||
if (i == 1) { | |||
uni.navigateTo({ | |||
url: '/pages/center/records/index?refresh='+'refresh'+'&activeTotal='+this.activeTotal+'&validInvalid=0'+'&staTime='+this.timeobj.statDateStart+'&endtime='+this.timeobj.statDateEnd | |||
url: '/pages/center/records/index?refresh=' + 'refresh' + '&activeTotal=' + this | |||
.activeTotal + '&validInvalid=0' + '&staTime=' + this.timeobj.statDateStart + | |||
'&endtime=' + this.timeobj.statDateEnd | |||
}); | |||
}else if(i==2){ | |||
} else if (i == 2) { | |||
uni.navigateTo({ | |||
url: '/pages/center/records/index?refresh='+'refresh'+'&activeTotal='+this.activeTotal+'&markAdvisor=1&validInvalid=0'+'&staTime='+this.timeobj.statDateStart+'&endtime='+this.timeobj.statDateEnd | |||
url: '/pages/center/records/index?refresh=' + 'refresh' + '&activeTotal=' + this | |||
.activeTotal + '&markAdvisor=1&validInvalid=0' + '&staTime=' + this.timeobj | |||
.statDateStart + '&endtime=' + this.timeobj.statDateEnd | |||
}); | |||
}else{ | |||
} else { | |||
uni.navigateTo({ | |||
url: '/pages/center/records/index?refresh='+'refresh'+'&activeTotal='+this.activeTotal+'&markAdvisor=0&validInvalid=0'+'&staTime='+this.timeobj.statDateStart+'&endtime='+this.timeobj.statDateEnd | |||
url: '/pages/center/records/index?refresh=' + 'refresh' + '&activeTotal=' + this | |||
.activeTotal + '&markAdvisor=0&validInvalid=0' + '&staTime=' + this.timeobj | |||
.statDateStart + '&endtime=' + this.timeobj.statDateEnd | |||
}); | |||
} | |||
}, | |||
anclick(i){ | |||
anclick(i) { | |||
console.log(i) | |||
this.Afolding=!this.Afolding; | |||
this.numlist.forEach((citem,index)=>{ | |||
if(index<6){ | |||
citem.isshow=true; | |||
}else{ | |||
citem.isshow=!citem.isshow; | |||
this.Afolding = !this.Afolding; | |||
this.numlist.forEach((citem, index) => { | |||
if (index < 6) { | |||
citem.isshow = true; | |||
} else { | |||
citem.isshow = !citem.isshow; | |||
} | |||
}) | |||
this.$forceUpdate() | |||
}, | |||
//获取数据 | |||
gitinit(){ | |||
this.objlist=[]; | |||
this.numlist=[]; | |||
var dateType=''; | |||
if(this.activeTotal==3){ | |||
dateType=null; | |||
}else{ | |||
dateType=this.activeTotal; | |||
gitinit() { | |||
this.objlist = []; | |||
this.numlist = []; | |||
var dateType = ''; | |||
if (this.activeTotal == 3) { | |||
dateType = null; | |||
} else { | |||
dateType = this.activeTotal; | |||
} | |||
let parames={ | |||
dateType:dateType, | |||
statDateStart:this.timeobj.statDateStart, | |||
statDateEnd:this.timeobj.statDateEnd, | |||
houseId:this.buildingID | |||
let parames = { | |||
dateType: dateType, | |||
statDateStart: this.timeobj.statDateStart, | |||
statDateEnd: this.timeobj.statDateEnd, | |||
houseId: this.buildingID, | |||
marketingBusiness: this.marketingBusiness, | |||
} | |||
this.$u.post("/matchKeywords/findmatchdata", parames).then(data => { | |||
// this.numlist.push({ | |||
// name:"有效接待", | |||
// num:data.total | |||
// }) | |||
data.list.forEach((item,index)=>{ | |||
data.list.forEach((item, index) => { | |||
this.numlist.push({ | |||
name:item.name, | |||
num:item.total | |||
name: item.name, | |||
num: item.total | |||
}) | |||
this.efficient = data.total | |||
this.markCount = data.markCount | |||
this.noMarkCount = data.noMarkCount | |||
item.activeTab=0; | |||
item.opts={ | |||
item.activeTab = 0; | |||
item.opts = { | |||
"title": { | |||
"name": item.total, | |||
"color": '#666666', | |||
@@ -206,18 +275,18 @@ | |||
"name": '总触达次数', | |||
"color": '#32363D', | |||
"fontSize": 12, | |||
"offsetY": 4 | |||
"offsetY": 4 | |||
} | |||
} | |||
item.chartData={ | |||
item.chartData = { | |||
"categories": [], | |||
"series": [{ | |||
"data": [] | |||
}], | |||
}; | |||
item.matchKeywords.forEach(chend=>{ | |||
item.matchKeywords.forEach(chend => { | |||
item.chartData.series[0].data.push({ | |||
"name":chend.name, | |||
"name": chend.name, | |||
"value": chend.proportion | |||
}) | |||
}) | |||
@@ -227,78 +296,121 @@ | |||
item.chartDataShow = false | |||
} | |||
}) | |||
data.list.forEach(item=>{ | |||
item.matchKeywords.forEach(chend=>{ | |||
if(chend.isInterval==0){ | |||
chend.name=chend.name+chend.unit+'-'+chend.endName+chend.unit | |||
}else{ | |||
chend.name=chend.name | |||
data.list.forEach(item => { | |||
item.matchKeywords.forEach(chend => { | |||
if (chend.isInterval == 0) { | |||
chend.name = chend.name + chend.unit + '-' + chend.endName + chend | |||
.unit | |||
} else { | |||
chend.name = chend.name | |||
} | |||
}) | |||
}) | |||
this.objlist=data.list; | |||
this.Afolding=true; | |||
this.numlist.forEach((citem,index)=>{ | |||
if(index<6){ | |||
citem.isshow=true | |||
}else{ | |||
citem.isshow=false | |||
this.objlist = data.list; | |||
this.Afolding = true; | |||
this.numlist.forEach((citem, index) => { | |||
if (index < 6) { | |||
citem.isshow = true | |||
} else { | |||
citem.isshow = false | |||
} | |||
}) | |||
}) | |||
}, | |||
//查看 | |||
Toview(item,i){ | |||
Toview(item, i) { | |||
uni.navigateTo({ | |||
url: '/pages/center/Piabodata/Customerportrait/Receivingrecords?datatype='+this.activeTotal+"&keywordsId="+item.matchKeywords[i].keywordsId+"&starttime="+this.timeobj.statDateStart+"&endoftime="+this.timeobj.statDateEnd | |||
url: '/pages/center/Piabodata/Customerportrait/Receivingrecords?datatype=' + this.activeTotal + | |||
"&keywordsId=" + item.matchKeywords[i].keywordsId + "&starttime=" + this.timeobj | |||
.statDateStart + "&endoftime=" + this.timeobj.statDateEnd | |||
}) | |||
}, | |||
//时间切换 | |||
tabtimetap(index) { | |||
this.activeTotal = index; | |||
tabtimetap(index, text) { | |||
if (index == 3) { | |||
this.totalTimeShow = true; | |||
this.screenShow = false | |||
} else { | |||
this.screenShow = false | |||
this.showTimeText = text | |||
this.activeTotal = index; | |||
this.gitinit() | |||
} | |||
}, | |||
//自定义时间 | |||
totalTimeChange(e) { | |||
this.screenShow = false | |||
this.showTimeText = `${e.startDate}-${e.endDate}` | |||
this.timeobj.statDateStart = e.startDate; | |||
this.timeobj.statDateEnd = e.endDate; | |||
this.activeTotal=3; | |||
this.activeTotal = 3; | |||
this.gitinit() | |||
}, | |||
charttoswitch(index,num) { | |||
this.objlist[index].activeTab=num | |||
charttoswitch(index, num) { | |||
this.objlist[index].activeTab = num | |||
} | |||
} | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.info{ | |||
.boxtittabs { | |||
width: 100%; | |||
height: 92rpx; | |||
background: #FFFFFF; | |||
display: flex; | |||
align-items: center; | |||
.items { | |||
padding: 0 24rpx; | |||
width: 50%; | |||
height: 100%; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
overflow: hidden; | |||
white-space: nowrap; | |||
text-overflow: ellipsis; | |||
} | |||
} | |||
.screen { | |||
width: 100%; | |||
.boxtittab { | |||
width: 100%; | |||
flex-direction: column; | |||
border: none; | |||
.tabbox { | |||
width: 100%; | |||
} | |||
} | |||
} | |||
.info { | |||
display: flex; | |||
justify-content: space-between; | |||
background: #fff; | |||
padding: 20rpx 40rpx; | |||
.item{ | |||
.item { | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
align-items: center; | |||
text{ | |||
text { | |||
font-size: 32rpx; | |||
} | |||
.num{ | |||
.num { | |||
font-weight: bold; | |||
} | |||
.tit{ | |||
.tit { | |||
margin-top: 20rpx; | |||
} | |||
} | |||
} | |||
.anclack{ | |||
.anclack { | |||
width: 100%; | |||
height: 78rpx; | |||
text-align: center; | |||
@@ -308,6 +420,7 @@ | |||
font-weight: 400; | |||
color: #666666; | |||
} | |||
.box { | |||
width: 100%; | |||
height: 100%; | |||
@@ -376,14 +489,17 @@ | |||
.grid { | |||
width: 50%; | |||
padding-left: 10rpx; | |||
&:nth-child(odd){ | |||
&:nth-child(odd) { | |||
border-bottom: 1rpx solid #E0E0E0; | |||
border-right: 1rpx solid #E0E0E0; | |||
} | |||
&:nth-child(even){ | |||
&:nth-child(even) { | |||
border-bottom: 1rpx solid #E0E0E0; | |||
// border-right: 1rpx solid #E0E0E0; | |||
} | |||
.audonum { | |||
color: #666666; | |||
text-indent: 40rpx; | |||
@@ -392,7 +508,8 @@ | |||
line-height: 40rpx; | |||
display: flex; | |||
align-items: center; | |||
.circle{ | |||
.circle { | |||
margin-right: 12rpx; | |||
width: 20rpx; | |||
height: 20rpx; | |||
@@ -401,11 +518,12 @@ | |||
border: 6rpx solid #2671E2; | |||
} | |||
} | |||
.num { | |||
color: #333333; | |||
font-size: 44rpx; | |||
font-weight: bold; | |||
margin: 18rpx 0 0; | |||
margin: 18rpx 0 0; | |||
} | |||
} | |||
} | |||
@@ -542,10 +660,11 @@ | |||
width: 44rpx; | |||
height: 44rpx; | |||
} | |||
.ranking1 { | |||
width: 40rpx; | |||
height: 40rpx; | |||
background: #E5F0FF; | |||
background: #E5F0FF; | |||
color: #333; | |||
font-size: 24rpx; | |||
text-align: center; | |||
@@ -327,7 +327,8 @@ | |||
scrollShow: true, | |||
itemCount: 8 | |||
} | |||
} | |||
}, | |||
}; | |||
}, | |||
onShow() { | |||
@@ -677,6 +678,7 @@ | |||
position: sticky; | |||
top: var(--window-top); | |||
z-index: 999; | |||
background: #fff; | |||
} | |||
.Piabodata-box { | |||
@@ -722,4 +724,13 @@ | |||
.grid:nth-child(3) { | |||
border-right: 1rpx solid #E0E0E0; | |||
} | |||
.tabbox { | |||
overflow: hidden; | |||
.activecllasscet { | |||
width: 100%; | |||
} | |||
} | |||
</style> |
@@ -527,7 +527,7 @@ | |||
this.isRefresh = false; | |||
this.getMyCustom() | |||
this.getFreeList(); | |||
// this.getMarketingBusiness() | |||
this.getMarketingBusiness() | |||
this.isnorefresh = ''; | |||
} | |||
}, | |||
@@ -565,6 +565,7 @@ | |||
isShow: false, | |||
} | |||
}) | |||
console.log(this.templateList, 'this.templateList') | |||
}) | |||
}, | |||
@@ -717,7 +718,7 @@ | |||
}) | |||
// 销讲业务 | |||
this.templateList.forEach(i => { | |||
if (i.isShow) this.screen.marketingBusiness.push(i.value) | |||
if (i.isShow) this.screen.marketingBusiness.push(i.id) | |||
}) | |||
var parames = { | |||
pageNum: this.nextPage, | |||
@@ -633,7 +633,7 @@ | |||
this.getWordMiningList(); | |||
this.getCustomPhase(); | |||
this.getFromSource(); | |||
// this.getMarketingBusiness();// 销讲业务 | |||
this.getMarketingBusiness();// 销讲业务 | |||
this.isRefresh = false; | |||
this.isnorefresh = 'refresh'; | |||
uni.setStorageSync('updatebuildingID', ''); | |||
@@ -655,6 +655,7 @@ | |||
} | |||
}, | |||
methods: { | |||
// 获取客户阶段数据 | |||
getCustomPhase() { | |||
this.phaseList = []; | |||