25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.
 
 
 

363 satır
11 KiB

  1. <template>
  2. <view class="box">
  3. <view class="boxtittab">
  4. <view class="tabbox">
  5. <view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4)">近七天</view>
  6. </view>
  7. <view class="tabbox">
  8. <view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5)">近15天</view>
  9. </view>
  10. <view class="tabbox">
  11. <view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6)">近30天</view>
  12. </view>
  13. <view class="tabbox">
  14. <view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3)">自定义</view>
  15. </view>
  16. </view>
  17. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  18. <view class="single">
  19. <view class="title">
  20. <view class="title1" style="flex: 1;">接待量排名(TOP10)</view>
  21. </view>
  22. <view class="hejisan">
  23. <view class="sanbox1" style="width: 35%;">
  24. <view class="text1-1">合计</view>
  25. <view class="text1-2">{{newlisttabinfo1.total}}</view>
  26. </view>
  27. <view class="sanbox1" style="width: 40%;">
  28. <view class="text1-1">顾问</view>
  29. <view class="text1-2">{{newlisttabinfo1.count}}</view>
  30. </view>
  31. <view class="sanbox1" style="width: 25%;">
  32. <view class="text1-1">人均接待量</view>
  33. <view class="text1-2">{{newlisttabinfo1.avg}}</view>
  34. </view>
  35. </view>
  36. <view class="jindu" style="height: 360rpx;overflow: auto;">
  37. <view v-if="newlisttabinfo1.result.length!=0" class="jindu-box" v-for="(item,index) in newlisttabinfo1.result" :key="index">
  38. <view class="jindu-boxche">
  39. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  40. <view style="width: 440rpx;margin-left: 10rpx;">
  41. <u-line-progress height="24" :show-percent="false" active-color="#FBA448" :percent="item.zxl1"></u-line-progress>
  42. </view>
  43. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  44. </view>
  45. </view>
  46. <view v-if="newlisttabinfo1.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  47. 暂无数据
  48. </view>
  49. </view>
  50. </view>
  51. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  52. <view class="single">
  53. <view class="title">
  54. <view class="title1" style="flex: 1;">录音时长(TOP10)</view>
  55. </view>
  56. <view class="hejisan">
  57. <view class="sanbox1" style="width: 35%;">
  58. <view class="text1-1">合计</view>
  59. <view class="text1-2">{{newlisttabinfo2.total}}</view>
  60. </view>
  61. <view class="sanbox1" style="width: 40%;">
  62. <view class="text1-1">顾问</view>
  63. <view class="text1-2">{{newlisttabinfo2.count}}</view>
  64. </view>
  65. <view class="sanbox1" style="width: 25%;">
  66. <view class="text1-1">人均录音时长</view>
  67. <view class="text1-2">{{newlisttabinfo2.avg}}</view>
  68. </view>
  69. </view>
  70. <view class="jindu" style="height: 360rpx;overflow: auto;">
  71. <view v-if="newlisttabinfo2.result.length!=0" class="jindu-box" v-for="(item,index) in newlisttabinfo2.result" :key="index">
  72. <view class="jindu-boxche">
  73. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  74. <view style="width: 440rpx;margin-left: 10rpx;">
  75. <u-line-progress height="24" :show-percent="false" active-color="#FBA448" :percent="item.zxl1"></u-line-progress>
  76. </view>
  77. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  78. </view>
  79. </view>
  80. <view v-if="newlisttabinfo2.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  81. 暂无数据
  82. </view>
  83. </view>
  84. </view>
  85. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  86. <view class="single">
  87. <view class="title">
  88. <view class="title1" style="flex: 1;">销讲执行率排行(TOP10)</view>
  89. </view>
  90. <view class="hejisan">
  91. <view class="sanbox1" style="width: 35%;">
  92. <view class="text1-1">合计</view>
  93. <view class="text1-2">{{newlisttabinfo3.total}}</view>
  94. </view>
  95. <view class="sanbox1" style="width: 40%;">
  96. <view class="text1-1">顾问</view>
  97. <view class="text1-2">{{newlisttabinfo3.count}}</view>
  98. </view>
  99. <view class="sanbox1" style="width: 25%;">
  100. <view class="text1-1">人均执行率</view>
  101. <view class="text1-2">{{newlisttabinfo3.avg}}</view>
  102. </view>
  103. </view>
  104. <view class="jindu" style="height: 360rpx;overflow: auto;">
  105. <view v-if="newlisttabinfo3.result.length!=0" class="jindu-box" v-for="(item,index) in newlisttabinfo3.result" :key="index">
  106. <view class="jindu-boxche">
  107. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  108. <view style="width: 440rpx;margin-left: 10rpx;">
  109. <u-line-progress height="24" :show-percent="false" active-color="#FBA448" :percent="item.zxl1"></u-line-progress>
  110. </view>
  111. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  112. </view>
  113. </view>
  114. <view v-if="newlisttabinfo3.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  115. 暂无数据
  116. </view>
  117. </view>
  118. </view>
  119. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  120. <view class="single">
  121. <view class="title">
  122. <view class="title1" style="flex: 1;">违禁次数排名(TOP10)</view>
  123. </view>
  124. <view class="hejisan">
  125. <view class="sanbox1" style="width: 35%;">
  126. <view class="text1-1">合计</view>
  127. <view class="text1-2">{{newlisttabinfo4.total}}</view>
  128. </view>
  129. <view class="sanbox1" style="width: 40%;">
  130. <view class="text1-1">顾问</view>
  131. <view class="text1-2">{{newlisttabinfo4.count}}</view>
  132. </view>
  133. <view class="sanbox1" style="width: 25%;">
  134. <view class="text1-1">人均违禁次数</view>
  135. <view class="text1-2">{{newlisttabinfo4.avg}}</view>
  136. </view>
  137. </view>
  138. <view class="jindu" style="height: 360rpx;overflow: auto;">
  139. <view v-if="newlisttabinfo4.result.length!=0" class="jindu-box" v-for="(item,index) in newlisttabinfo4.result" :key="index">
  140. <view class="jindu-boxche">
  141. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  142. <view style="width: 440rpx;margin-left: 10rpx;">
  143. <u-line-progress height="24" :show-percent="false" active-color="#FBA448" :percent="item.zxl1"></u-line-progress>
  144. </view>
  145. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  146. </view>
  147. </view>
  148. <view v-if="newlisttabinfo4.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  149. 暂无数据
  150. </view>
  151. </view>
  152. </view>
  153. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  154. </view>
  155. </template>
  156. <script>
  157. var app = getApp();
  158. var util = require("../../../utils/util.js");
  159. var config = require("../../../config");
  160. export default {
  161. data() {
  162. return {
  163. activeTotal: 4,
  164. totalTimeShow: false,
  165. // 楼盘id
  166. houseId:'',
  167. lastEndDate:'',
  168. lastStartDate:'',
  169. newlisttabinfo1:{
  170. avg:'',
  171. count:'',
  172. total:'',
  173. result:[],
  174. },
  175. newlisttabinfo2:{
  176. avg:'',
  177. count:'',
  178. total:'',
  179. result:[],
  180. },
  181. newlisttabinfo3:{
  182. avg:'',
  183. count:'',
  184. total:'',
  185. result:[],
  186. },
  187. newlisttabinfo4:{
  188. avg:'',
  189. count:'',
  190. total:'',
  191. result:[],
  192. },
  193. };
  194. },
  195. onLoad() {
  196. // 获取楼盘id
  197. this.houseId = uni.getStorageSync('buildingID').id;
  198. this.init()
  199. },
  200. methods: {
  201. init(){
  202. this.newlisttabinfo1={
  203. avg:'',
  204. count:'',
  205. total:'',
  206. result:[],
  207. },
  208. this.newlisttabinfo2={
  209. avg:'',
  210. count:'',
  211. total:'',
  212. result:[],
  213. },
  214. this.newlisttabinfo3={
  215. avg:'',
  216. count:'',
  217. total:'',
  218. result:[],
  219. },
  220. this.newlisttabinfo4={
  221. avg:'',
  222. count:'',
  223. total:'',
  224. result:[],
  225. }
  226. var activeTotal=0;
  227. if(this.activeTotal==3){
  228. activeTotal=null;
  229. }else{
  230. activeTotal=this.activeTotal;
  231. this.lastEndDate='';
  232. this.lastStartDate='';
  233. }
  234. var promse={
  235. timeType:activeTotal,
  236. lastStartDate:this.lastStartDate,
  237. lastEndDate:this.lastEndDate,
  238. houseId:this.houseId
  239. }
  240. this.staffStatisticsReceptionTop10(promse)
  241. this.staffStatisticsRecordingTimTop10(promse)
  242. this.staffStatisticsExecutionRateTop10(promse)
  243. this.staffStatisticsProhibitedTop10(promse)
  244. },
  245. //接待量排名
  246. staffStatisticsReceptionTop10(promse){
  247. this.$u.post('/cusLvStatistics/staffStatisticsReceptionTop10',promse).then(res=>{
  248. res.result.forEach(item=>{
  249. item.zxl=item.data
  250. item.name=item.accountName
  251. })
  252. res.result=this.dealData(res.result)
  253. this.newlisttabinfo1=res;
  254. })
  255. },
  256. //录音时长
  257. staffStatisticsRecordingTimTop10(promse){
  258. this.$u.post('/cusLvStatistics/staffStatisticsRecordingTimTop10',promse).then(res=>{
  259. res.result.forEach(item=>{
  260. item.zxl=item.data
  261. item.name=item.accountName
  262. })
  263. res.result=this.dealData(res.result)
  264. this.newlisttabinfo2=res;
  265. })
  266. },
  267. //销讲
  268. staffStatisticsExecutionRateTop10(promse){
  269. this.$u.post('/cusLvStatistics/staffStatisticsExecutionRateTop10',promse).then(res=>{
  270. res.result.forEach(item=>{
  271. item.zxl=item.data
  272. item.name=item.accountName
  273. })
  274. res.result=this.dealData(res.result)
  275. this.newlisttabinfo3=res;
  276. })
  277. },
  278. //j禁忌
  279. staffStatisticsProhibitedTop10(promse){
  280. this.$u.post('/cusLvStatistics/staffStatisticsProhibitedTop10',promse).then(res=>{
  281. res.result.forEach(item=>{
  282. item.zxl=item.data
  283. item.name=item.accountName
  284. })
  285. res.result=this.dealData(res.result)
  286. this.newlisttabinfo4=res;
  287. })
  288. },
  289. //自定义时间
  290. totalTimeChange(e) {
  291. console.log(e.startDate, e.endDate)
  292. this.activeTotal=3;
  293. this.lastEndDate=e.endDate
  294. this.lastStartDate=e.startDate
  295. this.init()
  296. },
  297. //时间切换
  298. tabtimetap(index) {
  299. if (index == 3) {
  300. this.totalTimeShow = true;
  301. } else {
  302. this.activeTotal = index;
  303. this.lastEndDate='';
  304. this.lastStartDate='';
  305. this.init()
  306. }
  307. },
  308. // 定义一个公共方法对数据进行处理
  309. dealData(arr){
  310. // 获取最大值
  311. let num=Math.max.apply(Math, arr.map(function (o) { return o.zxl })) //结果:3
  312. // console.log(num)
  313. if(num>100){
  314. // 获取最大值的下标
  315. // let idx=arr.findIndex(item=>item.zxl==num)
  316. // console.log(idx,123)
  317. arr.map(item=>{
  318. item.zxl1=Math.floor(item.zxl/num*100)
  319. })
  320. // console.log(arr)
  321. return arr
  322. }else{
  323. arr.map(item=>{
  324. item.zxl1=item.zxl
  325. })
  326. return arr
  327. }
  328. },
  329. }
  330. };
  331. </script>
  332. <style lang="scss" scoped>
  333. .box {
  334. width: 100%;
  335. height: 100%;
  336. background: #FAFAFA;
  337. padding-bottom: 60rpx;
  338. }
  339. .hejisan{
  340. width: 92%;
  341. margin: 0 auto;
  342. display: flex;
  343. padding-top: 20rpx;
  344. padding-bottom:20rpx;
  345. .text1-1{
  346. color: #666666;
  347. }
  348. .text1-2{
  349. color: #333333;
  350. margin-top: 10rpx;
  351. }
  352. }
  353. </style>