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.
 
 
 

1121 lines
32 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 class="timepick">
  18. <view class="timepicktime" @click="chiocStaff(0)">
  19. <view>{{staff1.label}}</view>
  20. <view>
  21. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  22. </view>
  23. </view>
  24. <view class="timepickpick" v-if="staff1.value">
  25. <view @click="checkboxChange()" style="width: 40rpx;height:40rpx;border: 1rpx solid #E0E0E0;">
  26. <image v-if="timepickpickisshow" style="width: 40rpx;height: 40rpx;"
  27. src="../../../static/images/xuanzhong.png" mode=""></image>
  28. </view>
  29. <view style="font-size:26rpx;text-indent: 12rpx;">对比</view>
  30. </view>
  31. <view class="timepicktime" v-if="timepickpickisshow" @click="chiocStaff(1)">
  32. <view>{{staff2.label}}</view>
  33. <view>
  34. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  35. </view>
  36. </view>
  37. </view>
  38. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  39. <view class="single">
  40. <view class="title">
  41. <view class="title1" style="flex: 1;">接待量</view>
  42. <view class="title3" style="flex: 1;">
  43. <view class="title3-box" @click="tabtimetap1(0)">
  44. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active1 == 0 }">排名</view>
  45. </view>
  46. <view class="title3-box" @click="tabtimetap1(1)">
  47. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active1 == 1 }">趋势</view>
  48. </view>
  49. </view>
  50. </view>
  51. <view class="hejibox">
  52. <view class="heji">{{!staff1.value?'团队总数':staff1.label}}:{{newTeam1||0}}</view>
  53. <view class="heji">{{!staff2.value?'团队平均':staff2.label}}:{{newAvg1||0}}</view>
  54. </view>
  55. <view class="" v-if=" eharTab.active1 == 1 ">
  56. <view class="danwei">接待量</view>
  57. <view class="uchaserbox">
  58. <template v-if="showLineOptsect1">
  59. <qiun-data-charts type="line" :chartData="lineOptsect1" background="none" :ontouch="true"
  60. canvasId="wangxiaohuaerlingeryilingwuyibbb" :canvas2d="true" />
  61. </template>
  62. </view>
  63. </view>
  64. <view class="jindu" v-if=" eharTab.active1 == 0 ">
  65. <view class="jindu-box" v-for="(item,index) in newlisttabinfo1" :key="index">
  66. <view class="jindu-boxche">
  67. <view class="jindu-name">{{item.name.substring(0, 4)}}</view>
  68. <view style="width: 440rpx;margin-left: 10rpx;">
  69. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  70. :percent="item.zxl1 || 0"></u-line-progress>
  71. </view>
  72. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  73. </view>
  74. </view>
  75. </view>
  76. </view>
  77. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  78. <view class="single">
  79. <view class="title">
  80. <view class="title1" style="flex: 1;">接待时长</view>
  81. <view class="title3" style="flex: 1;">
  82. <view class="title3-box" @click="tabtimetap2(0)">
  83. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active2 == 0 }">排名</view>
  84. </view>
  85. <view class="title3-box" @click="tabtimetap2(1)">
  86. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active2 == 1 }">趋势</view>
  87. </view>
  88. </view>
  89. </view>
  90. <view class="hejibox">
  91. <view class="heji">{{!staff1.value?'团队总数':staff1.label}}:{{newTeam2||0}}</view>
  92. <view class="heji">{{!staff2.value?'团队平均':staff2.label}}:{{newAvg2||0}}</view>
  93. </view>
  94. <view class="" v-if=" eharTab.active2 == 1 ">
  95. <view class="danwei">录音时长</view>
  96. <view class="uchaserbox">
  97. <template v-if="showLineOptsect2">
  98. <qiun-data-charts type="line" :chartData="lineOptsect2" background="none" :ontouch="true"
  99. canvasId="wangxiaohuaerlingeryilingwuyibb" :canvas2d="true" />
  100. </template>
  101. </view>
  102. </view>
  103. <view class="jindu" v-if=" eharTab.active2 == 0 ">
  104. <view class="jindu-box" v-for="(item,index) in newlisttabinfo2" :key="index">
  105. <view class="jindu-boxche">
  106. <view class="jindu-name">{{item.name.substring(0, 4)}}</view>
  107. <view style="width: 440rpx;margin-left: 10rpx;">
  108. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  109. :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>
  115. </view>
  116. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  117. <view class="single">
  118. <view class="title">
  119. <view class="title1" style="flex: 1;">销讲执行率</view>
  120. <view class="title3" style="flex: 1;">
  121. <view class="title3-box" @click="tabtimetap3(0)">
  122. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active3 == 0 }">排名</view>
  123. </view>
  124. <view class="title3-box" @click="tabtimetap3(1)">
  125. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active3 == 1 }">趋势</view>
  126. </view>
  127. </view>
  128. </view>
  129. <view class="" v-if=" eharTab.active3 == 1 ">
  130. <view class="danwei">执行率</view>
  131. <view class="uchaserbox">
  132. <template v-if="showLineOptsect3">
  133. <qiun-data-charts type="line" :chartData="lineOptsect3" background="none" :ontouch="true"
  134. canvasId="wangxiaohuaerlingeryilingwuyib" :canvas2d="true" />
  135. </template>
  136. </view>
  137. </view>
  138. <view class="jindu" v-if=" eharTab.active3 == 0 ">
  139. <view class="jindu-box" v-for="(item,index) in newlisttabinfo3" :key="index">
  140. <view class="jindu-boxche">
  141. <view class="jindu-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"
  144. :percent="item.zxl1"></u-line-progress>
  145. </view>
  146. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}%</view>
  147. </view>
  148. </view>
  149. </view>
  150. </view>
  151. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  152. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  153. <view class="single">
  154. <view class="title" style="padding-right: 30rpx;">
  155. <view class="title1" style="flex: 1;">销讲能力</view>
  156. <view class="title2" style="flex: 1;justify-content: flex-end;" @click="goTeam">
  157. <view class="title2-che">团队
  158. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  159. </view>
  160. </view>
  161. </view>
  162. <view class="uchaserbox uchaserboxs">
  163. <template v-if="showChartData1">
  164. <qiun-data-charts type="radar" :opts="opts" :chartData="chartData1" :canvas2d="true"
  165. canvasId="wangxiaohuaerlingeryilingwuyib88" background="none" />
  166. </template>
  167. </view>
  168. </view>
  169. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  170. <!-- <view class="single">
  171. <view class="title">
  172. <view class="title1" style="flex: 1;">禁忌执行率</view>
  173. <view class="title3" style="flex: 1;">
  174. <view class="title3-box" @click="tabtimetap4(0)">
  175. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active4 == 0 }">排名</view>
  176. </view>
  177. <view class="title3-box" @click="tabtimetap4(1)">
  178. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active4 == 1 }">趋势</view>
  179. </view>
  180. <view class="title3-box">
  181. <view style="height: 42rpx;" :class="{ activecltab: activeTotal2 == 2 }">表格</view>
  182. </view>
  183. </view>
  184. </view>
  185. <view class="hejibox">
  186. <view class="heji">{{!staff1.value?'团队':staff1.label}}:{{newTeam4||0}}</view>
  187. <view class="heji">{{!staff2.value?'均值':staff2.label}}:{{newAvg4||0}}</view>
  188. </view>
  189. <view class="" v-if=" eharTab.active4 == 1 ">
  190. <view class="danwei">来访(人)</view>
  191. <view class="uchaserbox">
  192. <qiun-data-charts
  193. type="line"
  194. :chartData="lineOptsect4"
  195. background="none"
  196. :ontouch="true"
  197. canvasId="wangxiaohuaerlingeryilingwuyi"
  198. :canvas2d="true"
  199. />
  200. </view>
  201. </view>
  202. <view class="jindu" v-if=" eharTab.active4 == 0 ">
  203. <view class="jindu-box" v-for="(item,index) in newlisttabinfo4" :key="index">
  204. <view class="jindu-boxche">
  205. <view class="jindu-name">{{item.name.substring(0, 4)}}</view>
  206. <view style="width: 440rpx;margin-left: 10rpx;">
  207. <u-line-progress height="24" :show-percent="false" active-color="#FBA448" :percent="item.zxl"></u-line-progress>
  208. </view>
  209. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  210. </view>
  211. </view>
  212. </view>
  213. </view> -->
  214. <!-- <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view> -->
  215. <!-- <view class="single">
  216. <view class="title" style="padding-right: 30rpx;">
  217. <view class="title1" style="flex: 1;">违禁能力(TOP10)</view>
  218. <view class="title2" style="flex: 1;justify-content: flex-end;">
  219. <view class="title2-che">项目
  220. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  221. </view>
  222. </view>
  223. </view>
  224. <view class="hejibox">
  225. <view class="heji">合计:50</view>
  226. <view class="heji">均值:25</view>
  227. </view>
  228. <view class="uchaserbox">
  229. <qiun-data-charts
  230. type="radar"
  231. :chartData="chartData"
  232. :canvas2d="true"
  233. canvasId="wangxiaohuaerlingeryilingwuyib89"
  234. background="none"
  235. />
  236. </view>
  237. </view> -->
  238. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  239. <!-- 选择部门的选择框 -->
  240. <u-select v-model="staffShow" :list="staffList" @confirm="staffSelectCallback" :default-value='selindex'>
  241. </u-select>
  242. <u-select v-model="staffShow1" :list="staffList1" @confirm="staffSelectCallback" :default-value='selindex'>
  243. </u-select>
  244. </view>
  245. </template>
  246. <script>
  247. var app = getApp();
  248. var util = require("../../../utils/util.js");
  249. var config = require("../../../config");
  250. export default {
  251. data() {
  252. return {
  253. activeTotal: 4,
  254. eharTab: {
  255. active1: 0,
  256. active2: 0,
  257. active3: 0,
  258. active4: 0,
  259. },
  260. deptids: '',
  261. bocindex: 0,
  262. timepickpickisshow: false,
  263. totalTimeShow: false,
  264. // 项目id
  265. houseId: '',
  266. staffList: [],
  267. staffList1: [],
  268. staffShow: false,
  269. staffShow1: false,
  270. staff1: {
  271. value: '',
  272. label: ''
  273. },
  274. staff2: {
  275. value: '',
  276. label: '平均'
  277. },
  278. lastStartDate: '',
  279. lastEndDate: '',
  280. selindex: [0],
  281. choseStaffFlag: false,
  282. lineOptsect1: {
  283. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  284. "series": [{
  285. "name": "成交量1",
  286. "data": [35, 8, 25, 37, 4, 20]
  287. },
  288. {
  289. "name": "成交量2",
  290. "data": [40, 18, 45, 44, 10, 60]
  291. }
  292. ]
  293. },
  294. lineOptsect2: {
  295. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  296. "series": [{
  297. "name": "成交量1",
  298. "data": [35, 8, 25, 37, 4, 20]
  299. },
  300. {
  301. "name": "成交量2",
  302. "data": [40, 18, 45, 44, 10, 60]
  303. }
  304. ]
  305. },
  306. lineOptsect3: {
  307. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  308. "series": [{
  309. "name": "成交量1",
  310. "data": [35, 8, 25, 37, 4, 20]
  311. },
  312. {
  313. "name": "成交量2",
  314. "data": [40, 18, 45, 44, 10, 60]
  315. }
  316. ]
  317. },
  318. lineOptsect4: {
  319. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  320. "series": [{
  321. "name": "成交量1",
  322. "data": [35, 8, 25, 37, 4, 20]
  323. },
  324. {
  325. "name": "成交量2",
  326. "data": [40, 18, 45, 44, 10, 60]
  327. }
  328. ]
  329. },
  330. newlisttabinfo1: [{
  331. name: '接待量',
  332. zxl: '10'
  333. },
  334. {
  335. name: '平均执行率',
  336. zxl: '50'
  337. },
  338. {
  339. name: '接待客户',
  340. zxl: '80'
  341. },
  342. ],
  343. newlisttabinfo2: [{
  344. name: '接待量',
  345. zxl: '10'
  346. },
  347. {
  348. name: '平均执行率',
  349. zxl: '50'
  350. },
  351. {
  352. name: '接待客户',
  353. zxl: '80'
  354. },
  355. ],
  356. newlisttabinfo3: [{
  357. name: '接待量',
  358. zxl: '10'
  359. },
  360. {
  361. name: '平均执行率',
  362. zxl: '50'
  363. },
  364. {
  365. name: '接待客户',
  366. zxl: '80'
  367. },
  368. ],
  369. newlisttabinfo4: [{
  370. name: '接待量',
  371. zxl: '10'
  372. },
  373. {
  374. name: '平均执行率',
  375. zxl: '50'
  376. },
  377. {
  378. name: '接待客户',
  379. zxl: '80'
  380. },
  381. ],
  382. newTeam1: '',
  383. newAvg1: '',
  384. newTeam2: '',
  385. newAvg2: '',
  386. newTeam3: '',
  387. newAvg3: '',
  388. newTeam4: '',
  389. newAvg4: '',
  390. chartData1: {
  391. "categories": ["维度1", "维度2", "维度3", "维度4", "维度5", "维度6"],
  392. "series": [{
  393. "name": "成交量",
  394. "data": [90, 110, 165, 195, 187, 172]
  395. }]
  396. },
  397. chartData2: {
  398. "categories": ["维度1", "维度2", "维度3", "维度4", "维度5", "维度6"],
  399. "series": [{
  400. "name": "成交量",
  401. "data": [90, 110, 165, 195, 187, 172]
  402. }]
  403. },
  404. opts: {
  405. fontSize: 10,
  406. extra: {
  407. radar: {
  408. max: ''
  409. }
  410. }
  411. }
  412. };
  413. },
  414. computed: {
  415. showLineOptsect1() {
  416. return this.lineOptsect1.series.length > 0
  417. },
  418. showLineOptsect2() {
  419. return this.lineOptsect2.series.length > 0
  420. },
  421. showLineOptsect3() {
  422. return this.lineOptsect3.series.length > 0
  423. },
  424. showChartData1() {
  425. return this.chartData1.series.length > 0
  426. },
  427. },
  428. onLoad() {
  429. let that = this
  430. uni.$on('update', function(data) {
  431. // console.log(data)
  432. that.deptids = data.arr.join(',')
  433. // 获取销奖能力
  434. that.getPowerList()
  435. })
  436. // 获取项目id
  437. this.houseId = uni.getStorageSync('buildingID').id;
  438. // this.buildingname = uni.getStorageSync('buildingID').name;
  439. // 请求接口获取所有置业顾问员工的列表
  440. this.getSectionList()
  441. },
  442. onPullDownRefresh() {
  443. let that = this
  444. uni.$on('update', function(data) {
  445. // console.log(data)
  446. that.deptids = data.arr.join(',')
  447. // 获取销奖能力
  448. that.getPowerList()
  449. })
  450. // 获取项目id
  451. this.houseId = uni.getStorageSync('buildingID').id;
  452. // this.buildingname = uni.getStorageSync('buildingID').name;
  453. // 请求接口获取所有置业顾问员工的列表
  454. this.getSectionList()
  455. setTimeout(function() {
  456. uni.stopPullDownRefresh();
  457. }, 1000);
  458. },
  459. methods: {
  460. //是否对比
  461. checkboxChange() {
  462. this.timepickpickisshow = !this.timepickpickisshow;
  463. this.staff2.label = '平均'
  464. this.staff2.value = ''
  465. // 团队对比接待量
  466. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  467. // 团队对比接待时长
  468. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  469. /* 销奖执行率 */
  470. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  471. // 获取销奖能力
  472. this.getPowerList()
  473. },
  474. // 获取部门列表
  475. getSectionList() {
  476. this.$u.post('/cusLvStatistics/findAllDeptIdByHouseId', {
  477. houseId: this.houseId
  478. })
  479. .then(res => {
  480. this.staffList = []
  481. this.staffList1 = []
  482. res.map(item => {
  483. let obj = {}
  484. obj.value = item.deptId
  485. obj.label = item.deptName
  486. this.staffList.push(obj)
  487. })
  488. this.staffList1 = [...this.staffList]
  489. this.staffList.unshift({
  490. value: '',
  491. label: '全部'
  492. })
  493. this.staffList1.unshift({
  494. value: '',
  495. label: '平均'
  496. })
  497. this.staff1 = this.staffList[0]
  498. // 团队对比接待量
  499. this.receptionCountList(0, 1, '/cusLvStatistics/teamAnalysisReception')
  500. // 团队对比接待时长
  501. this.receptionCountList(0, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  502. /* 销奖执行率 */
  503. this.receptionCountList(0, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  504. // 获取销奖能力
  505. this.getPowerList()
  506. })
  507. },
  508. // 点击部门对比
  509. chiocStaff(idx) {
  510. if (idx == 0) {
  511. // 当选择了第一个的时候
  512. this.choseStaffFlag = false
  513. this.staffShow = true
  514. } else {
  515. this.choseStaffFlag = true
  516. this.staffShow1 = true
  517. }
  518. },
  519. //时间切换
  520. tabtimetap(index) {
  521. if (index == 3) {
  522. this.totalTimeShow = true;
  523. } else {
  524. this.activeTotal = index;
  525. this.lastEndDate = ''
  526. this.lastStartDate = ''
  527. // 获取数据
  528. // 团队对比接待量
  529. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  530. // 团队对比接待时长
  531. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  532. /* 销奖执行率 */
  533. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  534. // 获取销奖能力
  535. this.getPowerList()
  536. }
  537. },
  538. // 接待量
  539. tabtimetap1(idx) {
  540. this.eharTab.active1 = idx
  541. // 调用方法
  542. this.receptionCountList(idx, 1, '/cusLvStatistics/teamAnalysisReception')
  543. },
  544. // 接待时长
  545. tabtimetap2(idx) {
  546. this.eharTab.active2 = idx
  547. // 调用方法
  548. this.receptionCountList(idx, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  549. },
  550. tabtimetap3(idx) {
  551. this.eharTab.active3 = idx
  552. // 调用方法
  553. this.receptionCountList(idx, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  554. },
  555. tabtimetap4(idx) {
  556. this.eharTab.active4 = idx
  557. // 调用方法
  558. // this.getRecordList()
  559. },
  560. //自定义时间
  561. totalTimeChange(e) {
  562. console.log(e.startDate, e.endDate)
  563. this.activeTotal = 3;
  564. this.lastEndDate = e.endDate
  565. this.lastStartDate = e.startDate
  566. // 获取数据
  567. // 团队对比接待量
  568. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  569. // 团队对比接待时长
  570. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  571. /* 销奖执行率 */
  572. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  573. // 获取销奖能力
  574. this.getPowerList()
  575. },
  576. //指标执行率分析tab
  577. tapspagek2(index) {
  578. this.bocindex = index;
  579. },
  580. //集团对比
  581. Groupcontrast() {
  582. uni.navigateTo({
  583. url: '/pages/center/Piabodata/Groupcontrast'
  584. });
  585. },
  586. // 去选择团队
  587. goTeam() {
  588. uni.navigateTo({
  589. url: `/pages/center/Piabodata/selectTeam?ids=${this.deptids}`
  590. })
  591. },
  592. staffSelectCallback(e) {
  593. if (this.choseStaffFlag) {
  594. // 第二个客户
  595. // console.log(e,'第二个')
  596. this.staff2 = e[0]
  597. } else {
  598. // 第一个客户
  599. // console.log(e,'第一个')
  600. // 当选择全部时
  601. if (!e.value) {
  602. this.timepickpickisshow = false
  603. this.staff2.label = '平均'
  604. this.staff2.value = ''
  605. }
  606. this.staff1 = e[0]
  607. }
  608. if (this.staff1.label == this.staff2.label) {
  609. uni.showToast({
  610. title: '请勿选择重复',
  611. icon: 'none'
  612. })
  613. this.staff2.label = '请选择'
  614. // this.staff2.label='平均'
  615. // this.staff2.value=''
  616. return
  617. } else {
  618. // 获取数据
  619. // 团队对比接待量
  620. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  621. // 团队对比接待时长
  622. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  623. /* 销奖执行率 */
  624. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  625. // 获取销奖能力
  626. this.getPowerList()
  627. }
  628. },
  629. // 团队对比接待量
  630. // receptionCountList(idx){
  631. // this.$u.post('/cusLvStatistics/teamAnalysisReception',{
  632. // // userA:this.staff1.value,
  633. // // userB:this.staff2.value,
  634. // deptIds:[this.staff1.value,this.staff2.value].filter(item=>item).join(','),
  635. // showRank:idx,
  636. // houseId:this.houseId,
  637. // timeType:this.lastEndDate?null:this.activeTotal+'',
  638. // lastEndDate:this.lastEndDate,
  639. // lastStartDate:this.lastStartDate
  640. // })
  641. // .then(res=>{
  642. // // console.log(res)
  643. // let result=res.result
  644. // this.newTeam=res.avg[0]
  645. // this.newAvg=res.avg[1]
  646. // if(idx==0){
  647. // // 当选择的是牌名时
  648. // // 处理数据
  649. // // 先处理牌名数据,需要进行判断全部还是单个
  650. // // 当为全部时
  651. // this.newlisttabinfo=[]
  652. // // 当选择全部时
  653. // if(!this.staff1.value&&!this.staff2.value){
  654. // // console.log(1)
  655. // result[0].map(item=>{
  656. // let obj={}
  657. // obj.name=item.deptName
  658. // obj.zxl=item.receptionCount
  659. // this.newlisttabinfo.push(obj)
  660. // })
  661. // }
  662. // // 当选择只有一个时
  663. // else if(this.staff1.value&&!this.staff2.value){
  664. // // console.log(2)
  665. // result[0].map(item=>{
  666. // let obj={}
  667. // obj.name=item.deptName
  668. // obj.zxl=item.receptionCount
  669. // this.newlisttabinfo.push(obj)
  670. // })
  671. // // 判断是否显示平均
  672. // // 如果显示对比
  673. // if(this.timepickpickisshow){
  674. // result[1].map(item=>{
  675. // let obj={}
  676. // obj.name='平均'
  677. // obj.zxl=item.receptionCount
  678. // this.newlisttabinfo.push(obj)
  679. // })
  680. // }
  681. // }else{
  682. // // console.log(3)
  683. // // 当两个都选择的时候
  684. // result[0].map(item=>{
  685. // let obj={}
  686. // obj.name=item.deptName
  687. // obj.zxl=item.receptionCount
  688. // this.newlisttabinfo.push(obj)
  689. // })
  690. // result[1].map(item=>{
  691. // let obj={}
  692. // obj.name=item.deptName
  693. // obj.zxl=item.receptionCount
  694. // this.newlisttabinfo.push(obj)
  695. // })
  696. // }
  697. // }else{
  698. // // 当选择趋势时
  699. // // this.lineOptsect={
  700. // // categories:[],
  701. // // series:[]
  702. // // }
  703. // let allobj={
  704. // categories:[],
  705. // series:[]
  706. // }
  707. // // 先处理时间
  708. // // 当选择全部时
  709. // if(!this.staff1.value&&!this.staff2.value){
  710. // // console.log(1)
  711. // result.map((item,idx)=>{
  712. // let obj={}
  713. // obj.name=item[0].deptName
  714. // obj.data=[]
  715. // item.map(item1=>{
  716. // // 时间的处理
  717. // if(idx==0){
  718. // allobj.categories.push(item1.statDate.slice(5,10))
  719. // }
  720. // obj.data.push(item1.receptionCount)
  721. // })
  722. // allobj.series.push(obj)
  723. // })
  724. // }
  725. // // 当选择只有一个时
  726. // else if(this.staff1.value&&!this.staff2.value){
  727. // // console.log(2)
  728. // let obj={}
  729. // obj.data=[]
  730. // obj.name=result[0][0].deptName
  731. // result[0].map(item=>{
  732. // allobj.categories.push(item.statDate.slice(5,10))
  733. // obj.data.push(item.receptionCount)
  734. // })
  735. // allobj.series.push(obj)
  736. // // 判断是否显示平均
  737. // // 如果显示对比
  738. // if(this.timepickpickisshow){
  739. // let obj={}
  740. // obj.data=[]
  741. // obj.name='平均'
  742. // result[1].map(item=>{
  743. // obj.data.push(item.receptionCount)
  744. // })
  745. // allobj.series.push(obj)
  746. // }
  747. // }else{
  748. // // console.log(3)
  749. // // 当两个都选择的时候
  750. // let obj={}
  751. // let obj1={}
  752. // obj.data=[]
  753. // obj1.data=[]
  754. // obj.name=result[0][0].deptName
  755. // obj1.name=result[1][0].deptName
  756. // result[0].map(item=>{
  757. // allobj.categories.push(item.statDate.slice(5,10))
  758. // obj.data.push(item.receptionCount)
  759. // })
  760. // result[1].map(item=>{
  761. // obj1.data.push(item.receptionCount)
  762. // })
  763. // allobj.series.push(obj)
  764. // allobj.series.push(obj1)
  765. // }
  766. // this.lineOptsect=allobj
  767. // }
  768. // })
  769. // },
  770. // 接待时长
  771. receptionCountList(idx, index, url) {
  772. this.$u.post(url, {
  773. // userA:this.staff1.value,
  774. // userB:this.staff2.value,
  775. deptIds: [this.staff1.value, this.staff2.value].filter(item => item).join(','),
  776. showRank: idx,
  777. houseId: this.houseId,
  778. timeType: this.lastEndDate ? null : this.activeTotal + '',
  779. lastEndDate: this.lastEndDate,
  780. lastStartDate: this.lastStartDate
  781. })
  782. .then(res => {
  783. // console.log(res)
  784. let result = res.result
  785. this['newTeam' + index] = res.avg[0]
  786. this['newAvg' + index] = res.avg[1]
  787. if (idx == 0) {
  788. // 当选择的是牌名时
  789. // 处理数据
  790. // 先处理牌名数据,需要进行判断全部还是单个
  791. // 当为全部时
  792. this['newlisttabinfo' + index] = []
  793. let arr = []
  794. // 当选择全部时
  795. if (!this.staff1.value && !this.staff2.value) {
  796. // console.log(1)
  797. result[0].map(item => {
  798. let obj = {}
  799. obj.name = item.deptName
  800. obj.zxl = item.data
  801. arr.push(obj)
  802. })
  803. arr = this.dealData(arr)
  804. this['newlisttabinfo' + index] = arr
  805. }
  806. // 当选择只有一个时
  807. else if (this.staff1.value && !this.staff2.value) {
  808. // console.log(2)
  809. result[0].map(item => {
  810. let obj = {}
  811. obj.name = item.deptName
  812. obj.zxl = item.data
  813. arr.push(obj)
  814. })
  815. // 判断是否显示平均
  816. // 如果显示对比
  817. if (this.timepickpickisshow) {
  818. result[1].map(item => {
  819. let obj = {}
  820. obj.name = '平均'
  821. obj.zxl = item.data
  822. arr.push(obj)
  823. })
  824. }
  825. arr = this.dealData(arr)
  826. this['newlisttabinfo' + index] = arr
  827. } else {
  828. // console.log(3)
  829. // 当两个都选择的时候
  830. result[0].map(item => {
  831. let obj = {}
  832. obj.name = item.deptName
  833. obj.zxl = item.data
  834. arr.push(obj)
  835. })
  836. result[1].map(item => {
  837. let obj = {}
  838. obj.name = item.deptName
  839. obj.zxl = item.data
  840. arr.push(obj)
  841. })
  842. arr = this.dealData(arr)
  843. this['newlisttabinfo' + index] = arr
  844. }
  845. } else {
  846. // 当选择趋势时
  847. this['lineOptsect' + index] = {}
  848. let allobj = {
  849. categories: [],
  850. series: []
  851. }
  852. // 先处理时间
  853. // 当选择全部时
  854. if (!this.staff1.value && !this.staff2.value) {
  855. result.map((item, idx) => {
  856. let obj = {}
  857. obj.name = item[0].deptName
  858. obj.data = []
  859. item.map(item1 => {
  860. // 时间的处理
  861. if (idx == 0) {
  862. allobj.categories.push(item1.statDate.slice(5, 10))
  863. }
  864. obj.data.push(item1.data)
  865. })
  866. allobj.series.push(obj)
  867. })
  868. }
  869. // 当选择只有一个时
  870. else if (this.staff1.value && !this.staff2.value) {
  871. // console.log(2)
  872. let obj = {}
  873. obj.data = []
  874. obj.name = result[0][0].deptName
  875. result[0].map(item => {
  876. allobj.categories.push(item.statDate.slice(5, 10))
  877. obj.data.push(item.data)
  878. })
  879. allobj.series.push(obj)
  880. // 判断是否显示平均
  881. // 如果显示对比
  882. if (this.timepickpickisshow) {
  883. let obj = {}
  884. obj.data = []
  885. obj.name = '平均'
  886. result[1].map(item => {
  887. obj.data.push(item.data)
  888. })
  889. allobj.series.push(obj)
  890. }
  891. } else {
  892. // console.log(3)
  893. // 当两个都选择的时候
  894. let obj = {}
  895. let obj1 = {}
  896. obj.data = []
  897. obj1.data = []
  898. obj.name = result[0][0].deptName
  899. obj1.name = result[1][0].deptName
  900. result[0].map(item => {
  901. allobj.categories.push(item.statDate.slice(5, 10))
  902. obj.data.push(item.data)
  903. })
  904. result[1].map(item => {
  905. obj1.data.push(item.data)
  906. })
  907. allobj.series.push(obj)
  908. allobj.series.push(obj1)
  909. }
  910. // console.log(allobj)
  911. // return
  912. // this.lineOptsect1=allobj
  913. this['lineOptsect' + index] = allobj
  914. // this['lineOptsect'+index].series=allobj.series
  915. // this['lineOptsect'+index].categories=allobj.categories
  916. }
  917. })
  918. },
  919. // 获取销奖能力
  920. getPowerList() {
  921. this.$u.post('/cusLvStatistics/teamAnalysisMarketingAbility', {
  922. deptIds: this.deptids || [this.staff1.value, this.staff2.value].filter(item => item).join(','),
  923. houseId: this.houseId,
  924. timeType: this.lastEndDate ? null : this.activeTotal + '',
  925. lastEndDate: this.lastEndDate,
  926. lastStartDate: this.lastStartDate
  927. })
  928. .then(res => {
  929. // console.log(res)
  930. // 处理数据
  931. this.chartData1 = {
  932. categories: [],
  933. series: []
  934. }
  935. let allobj = {
  936. categories: [],
  937. series: []
  938. }
  939. let max = 0;
  940. // 当选择全部时
  941. if (!this.staff1.value && !this.staff2.value) {
  942. // let first=res.first
  943. res.first.map((item, index) => {
  944. let obj = {
  945. name: item[0].deptName,
  946. data: []
  947. }
  948. item.map((item1) => {
  949. if (index == 0) {
  950. allobj.categories.push(item1.name)
  951. }
  952. obj.data.push(item1.avgExecutionRate)
  953. if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;
  954. })
  955. allobj.series.push(obj)
  956. })
  957. }
  958. // 当选择只有一个时
  959. else if (this.staff1.value && !this.staff2.value) {
  960. res.first.map((item, index) => {
  961. let obj = {
  962. name: item[0].deptName,
  963. data: []
  964. }
  965. item.map((item1) => {
  966. if (index == 0) {
  967. allobj.categories.push(item1.name)
  968. }
  969. obj.data.push(item1.avgExecutionRate)
  970. if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;
  971. })
  972. allobj.series.push(obj)
  973. })
  974. // 判断是否显示平均
  975. // 如果显示对比
  976. if (this.timepickpickisshow) {
  977. res.second.map((item, index) => {
  978. let obj = {
  979. name: '平均',
  980. data: []
  981. }
  982. item.map((item1) => {
  983. obj.data.push(item1.avgExecutionRate)
  984. })
  985. allobj.series.push(obj)
  986. })
  987. }
  988. } else {
  989. // console.log(3)
  990. // 当两个都选择的时候
  991. res.first.map((item, index) => {
  992. let obj = {
  993. name: item[0].deptName,
  994. data: []
  995. }
  996. item.map((item1) => {
  997. if (index == 0) {
  998. allobj.categories.push(item1.name)
  999. }
  1000. obj.data.push(item1.avgExecutionRate)
  1001. if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;
  1002. })
  1003. allobj.series.push(obj)
  1004. })
  1005. }
  1006. this.opts.extra.radar.max = max + 25
  1007. // console.log(allobj)
  1008. this.chartData1 = allobj
  1009. this.$forceUpdate()
  1010. })
  1011. },
  1012. // 定义一个公共方法对数据进行处理
  1013. dealData(arr) {
  1014. // 获取最大值
  1015. let num = Math.max.apply(Math, arr.map(function(o) {
  1016. return o.zxl
  1017. })) //结果:3
  1018. // console.log(num)
  1019. if (num > 100) {
  1020. // 获取最大值的下标
  1021. // let idx=arr.findIndex(item=>item.zxl==num)
  1022. // console.log(idx,123)
  1023. arr.map(item => {
  1024. item.zxl1 = Math.floor(item.zxl / num * 100)
  1025. })
  1026. // console.log(arr)
  1027. return arr
  1028. } else {
  1029. arr.map(item => {
  1030. item.zxl1 = item.zxl
  1031. })
  1032. return arr
  1033. }
  1034. },
  1035. }
  1036. };
  1037. </script>
  1038. <style lang="scss" scoped>
  1039. .uchaserboxs {
  1040. width: 100%;
  1041. height: 70vh;
  1042. }
  1043. .box {
  1044. width: 100%;
  1045. height: 100%;
  1046. background: #FAFAFA;
  1047. padding-bottom: 60rpx;
  1048. }
  1049. // 对比时间切换
  1050. .timepick {
  1051. width: 100%;
  1052. height: 90rpx;
  1053. display: flex;
  1054. align-items: center;
  1055. background: #FAFAFA;
  1056. }
  1057. .timepicktime {
  1058. width: 260rpx;
  1059. height: 50rpx;
  1060. border: 1rpx solid #E0E0E0;
  1061. margin-left: 30rpx;
  1062. display: flex;
  1063. background: #FFFFFF;
  1064. }
  1065. .timepicktime>view:nth-of-type(1) {
  1066. width: 210rpx;
  1067. height: 100%;
  1068. line-height: 50rpx;
  1069. font-size: 26rpx;
  1070. font-weight: 400;
  1071. text-align: center;
  1072. }
  1073. .timepicktime>view:nth-of-type(2) {
  1074. width: 49rpx;
  1075. height: 100%;
  1076. // border-left: 1px solid #E0E0E0;
  1077. }
  1078. .timepickpick {
  1079. width: 110rpx;
  1080. height: 50rpx;
  1081. margin-left: 30rpx;
  1082. display: flex;
  1083. align-items: center;
  1084. }
  1085. .Underimg {
  1086. width: 50rpx;
  1087. height: 50rpx;
  1088. margin-top: -2rpx;
  1089. }
  1090. </style>