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.
 
 
 
 

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