AI销管
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

452 lines
13 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"
  38. v-for="(item,index) in newlisttabinfo1.result" :key="index">
  39. <view class="jindu-boxche" v-if="item.zxl != 0">
  40. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  41. <view style="width: 440rpx;margin-left: 10rpx;">
  42. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  43. :percent="item.zxl1"></u-line-progress>
  44. </view>
  45. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}次</view>
  46. </view>
  47. </view>
  48. <view v-if="newlisttabinfo1.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  49. 暂无数据
  50. </view>
  51. </view>
  52. </view>
  53. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  54. <view class="single">
  55. <view class="title">
  56. <view class="title1" style="flex: 1;">销讲执行率排行(TOP10)</view>
  57. </view>
  58. <view class="hejisan">
  59. <view class="sanbox1" style="width: 40%;">
  60. <view class="text1-1">顾问</view>
  61. <view class="text1-2">{{newlisttabinfo3.count}}人</view>
  62. </view>
  63. <view class="sanbox1" style="width: 25%;">
  64. <view class="text1-1">人均执行率</view>
  65. <view class="text1-2">{{newlisttabinfo3.avg}}%</view>
  66. </view>
  67. </view>
  68. <view class="jindu" style="height: 360rpx;overflow: auto;">
  69. <view v-if="newlisttabinfo3.result.length!=0" class="jindu-box"
  70. v-for="(item,index) in newlisttabinfo3.result" :key="index">
  71. <view class="jindu-boxche" v-if="item.zxl != 0">
  72. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  73. <view style="width: 440rpx;margin-left: 10rpx;">
  74. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  75. :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="newlisttabinfo3.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">{{newlisttabinfo2.total}}分钟</view>
  94. </view>
  95. <view class="sanbox1" style="width: 40%;">
  96. <view class="text1-1">顾问</view>
  97. <view class="text1-2">{{newlisttabinfo2.count}}人</view>
  98. </view>
  99. <view class="sanbox1" style="width: 25%;">
  100. <view class="text1-1">人均录音时长</view>
  101. <view class="text1-2">{{newlisttabinfo2.avg}}分钟</view>
  102. </view>
  103. </view>
  104. <view class="jindu" style="height: 360rpx;overflow: auto;">
  105. <view v-if="newlisttabinfo2.result.length!=0" class="jindu-box"
  106. v-for="(item,index) in newlisttabinfo2.result" :key="index">
  107. <view class="jindu-boxche" v-if="item.zxl != 0">
  108. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  109. <view style="width: 440rpx;margin-left: 10rpx;">
  110. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  111. :percent="item.zxl1"></u-line-progress>
  112. </view>
  113. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}分钟</view>
  114. </view>
  115. </view>
  116. <view v-if="newlisttabinfo2.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  117. 暂无数据
  118. </view>
  119. </view>
  120. </view>
  121. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  122. <view class="single">
  123. <view class="title">
  124. <view class="title1" style="flex: 1;">违禁次数排名(TOP10)</view>
  125. </view>
  126. <view class="hejisan">
  127. <view class="sanbox1" style="width: 35%;">
  128. <view class="text1-1">合计</view>
  129. <view class="text1-2">{{newlisttabinfo4.total}}次</view>
  130. </view>
  131. <view class="sanbox1" style="width: 40%;">
  132. <view class="text1-1">顾问</view>
  133. <view class="text1-2">{{newlisttabinfo4.count}}人</view>
  134. </view>
  135. <view class="sanbox1" style="width: 25%;">
  136. <view class="text1-1">人均违禁次数</view>
  137. <view class="text1-2">{{newlisttabinfo4.avg}}次</view>
  138. </view>
  139. </view>
  140. <view class="jindu" style="height: 360rpx;overflow: auto;">
  141. <view v-if="newlisttabinfo4.result.length!=0" class="jindu-box"
  142. v-for="(item,index) in newlisttabinfo4.result" :key="index">
  143. <view class="jindu-boxche" v-if="item.zxl != 0">
  144. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  145. <view style="width: 440rpx;margin-left: 10rpx;">
  146. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  147. :percent="item.zxl1"></u-line-progress>
  148. </view>
  149. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}次</view>
  150. </view>
  151. </view>
  152. <view v-if="newlisttabinfo4.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  153. 暂无数据
  154. </view>
  155. </view>
  156. </view>
  157. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  158. <view class="single">
  159. <view class="title">
  160. <view class="title1" style="flex: 1;">接待未标顾问排名(TOP10)</view>
  161. </view>
  162. <view class="hejisan">
  163. <view class="sanbox1" style="width: 35%;">
  164. <view class="text1-1">合计</view>
  165. <view class="text1-2">{{newlisttabinfo5.total}}次</view>
  166. </view>
  167. <view class="sanbox1" style="width: 40%;">
  168. <view class="text1-1">顾问</view>
  169. <view class="text1-2">{{newlisttabinfo5.count}}人</view>
  170. </view>
  171. <view class="sanbox1" style="width: 25%;">
  172. <view class="text1-1">均值</view>
  173. <view class="text1-2">{{newlisttabinfo5.avg}}次</view>
  174. </view>
  175. </view>
  176. <view class="jindu" style="height: 360rpx;overflow: auto;">
  177. <view v-if="newlisttabinfo5.result.length!=0" class="jindu-box"
  178. v-for="(item,index) in newlisttabinfo5.result" :key="index">
  179. <view class="jindu-boxche" v-if="item.zxl1 != 0">
  180. <view class="jindu-name" v-if="item.name">{{item.name.substring(0,4)}}</view>
  181. <view style="width: 440rpx;margin-left: 10rpx;">
  182. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  183. :percent="item.zxl1"></u-line-progress>
  184. </view>
  185. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}次</view>
  186. </view>
  187. </view>
  188. <view v-if="newlisttabinfo5.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">
  189. 暂无数据
  190. </view>
  191. </view>
  192. </view>
  193. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  194. </view>
  195. </template>
  196. <script>
  197. var app = getApp();
  198. var util = require("../../../utils/util.js");
  199. var config = require("../../../config");
  200. export default {
  201. data() {
  202. return {
  203. activeTotal: 4,
  204. totalTimeShow: false,
  205. // 项目id
  206. houseId: '',
  207. lastEndDate: '',
  208. lastStartDate: '',
  209. newlisttabinfo1: {
  210. avg: '',
  211. count: '',
  212. total: '',
  213. result: [],
  214. },
  215. newlisttabinfo2: {
  216. avg: '',
  217. count: '',
  218. total: '',
  219. result: [],
  220. },
  221. newlisttabinfo3: {
  222. avg: '',
  223. count: '',
  224. total: '',
  225. result: [],
  226. },
  227. newlisttabinfo4: {
  228. avg: '',
  229. count: '',
  230. total: '',
  231. result: [],
  232. },
  233. newlisttabinfo5: {
  234. avg: '',
  235. count: '',
  236. total: '',
  237. result: [],
  238. },
  239. };
  240. },
  241. onLoad() {
  242. // 获取项目id
  243. this.houseId = uni.getStorageSync('buildingID').id;
  244. this.init()
  245. },
  246. onPullDownRefresh() {
  247. this.init()
  248. setTimeout(function() {
  249. uni.stopPullDownRefresh();
  250. }, 1000);
  251. },
  252. methods: {
  253. init() {
  254. this.newlisttabinfo1 = {
  255. avg: '',
  256. count: '',
  257. total: '',
  258. result: [],
  259. }
  260. this.newlisttabinfo2 = {
  261. avg: '',
  262. count: '',
  263. total: '',
  264. result: [],
  265. }
  266. this.newlisttabinfo3 = {
  267. avg: '',
  268. count: '',
  269. total: '',
  270. result: [],
  271. }
  272. this.newlisttabinfo4 = {
  273. avg: '',
  274. count: '',
  275. total: '',
  276. result: [],
  277. }
  278. this.newlisttabinfo5 = {
  279. avg: '',
  280. count: '',
  281. total: '',
  282. result: [],
  283. }
  284. var activeTotal = 0;
  285. if (this.activeTotal == 3) {
  286. activeTotal = null;
  287. } else {
  288. activeTotal = this.activeTotal;
  289. this.lastEndDate = '';
  290. this.lastStartDate = '';
  291. }
  292. var promse = {
  293. timeType: activeTotal,
  294. lastStartDate: this.lastStartDate,
  295. lastEndDate: this.lastEndDate,
  296. houseId: this.houseId
  297. }
  298. this.staffStatisticsReceptionTop10(promse)
  299. this.staffStatisticsRecordingTimTop10(promse)
  300. this.staffStatisticsExecutionRateTop10(promse)
  301. this.staffStatisticsProhibitedTop10(promse)
  302. this.staffStatisticsUnlabeledTop10(promse)
  303. },
  304. //接待量排名
  305. staffStatisticsReceptionTop10(promse) {
  306. this.$u.post('/cusLvStatistics/staffStatisticsReceptionTop10', promse).then(res => {
  307. res.result.forEach(item => {
  308. item.zxl = item.data
  309. item.name = item.accountName
  310. })
  311. res.result = this.dealData(res.result)
  312. this.newlisttabinfo1 = res;
  313. })
  314. },
  315. //录音时长
  316. staffStatisticsRecordingTimTop10(promse) {
  317. this.$u.post('/cusLvStatistics/staffStatisticsRecordingTimTop10', promse).then(res => {
  318. res.result.forEach(item => {
  319. item.zxl = item.data
  320. item.name = item.accountName
  321. })
  322. res.result = this.dealData(res.result)
  323. this.newlisttabinfo2 = res;
  324. })
  325. },
  326. //销讲
  327. staffStatisticsExecutionRateTop10(promse) {
  328. this.$u.post('/cusLvStatistics/staffStatisticsExecutionRateTop10', promse).then(res => {
  329. res.result.forEach(item => {
  330. item.zxl = item.data;
  331. item.zxl1 = item.data;
  332. item.name = item.accountName
  333. })
  334. this.newlisttabinfo3 = res;
  335. })
  336. },
  337. //j禁忌
  338. staffStatisticsProhibitedTop10(promse) {
  339. this.$u.post('/cusLvStatistics/staffStatisticsProhibitedTop10', promse).then(res => {
  340. res.result.forEach(item => {
  341. item.zxl = item.data
  342. item.name = item.accountName
  343. })
  344. res.result = this.dealData(res.result)
  345. this.newlisttabinfo4 = res;
  346. })
  347. },
  348. //未标记客户数量排名,
  349. staffStatisticsUnlabeledTop10(promse) {
  350. this.$u.post('/cusLvStatistics/staffStatisticsUnlabeledTop', promse).then(res => {
  351. res.result.forEach(item => {
  352. item.zxl = item.tagCustomer
  353. item.name = item.accountName
  354. })
  355. res.result = this.dealData(res.result)
  356. this.newlisttabinfo5 = res;
  357. })
  358. },
  359. //自定义时间
  360. totalTimeChange(e) {
  361. console.log(e.startDate, e.endDate)
  362. this.activeTotal = 3;
  363. this.lastEndDate = e.endDate
  364. this.lastStartDate = e.startDate
  365. this.init()
  366. },
  367. //时间切换
  368. tabtimetap(index) {
  369. if (index == 3) {
  370. this.totalTimeShow = true;
  371. } else {
  372. this.activeTotal = index;
  373. this.lastEndDate = '';
  374. this.lastStartDate = '';
  375. this.init()
  376. }
  377. },
  378. // 定义一个公共方法对数据进行处理
  379. dealData(arr) {
  380. // 获取最大值
  381. let num = Math.max.apply(Math, arr.map(function(o) {
  382. return o.zxl
  383. })) //结果:3
  384. // console.log(num)
  385. // if(num>100){
  386. // // 获取最大值的下标
  387. // // let idx=arr.findIndex(item=>item.zxl==num)
  388. // // console.log(idx,123)
  389. // arr.map(item=>{
  390. // item.zxl1=Math.floor(item.zxl/num*100)
  391. // })
  392. // // console.log(arr)
  393. // return arr
  394. // }else{
  395. // arr.map(item=>{
  396. // item.zxl1=item.zxl
  397. // })
  398. // return arr
  399. // }
  400. arr.map(item => {
  401. item.zxl1 = Math.floor(item.zxl / num * 100)
  402. })
  403. return arr
  404. },
  405. }
  406. };
  407. </script>
  408. <style lang="scss" scoped>
  409. .box {
  410. width: 100%;
  411. height: 100%;
  412. background: #FAFAFA;
  413. padding-bottom: 60rpx;
  414. }
  415. .boxtittab {
  416. position: sticky;
  417. top: var(--window-top);
  418. z-index: 999;
  419. }
  420. .hejisan {
  421. width: 92%;
  422. margin: 0 auto;
  423. display: flex;
  424. padding-top: 20rpx;
  425. padding-bottom: 20rpx;
  426. .text1-1 {
  427. color: #666666;
  428. }
  429. .text1-2 {
  430. color: #333333;
  431. margin-top: 10rpx;
  432. }
  433. }
  434. </style>