AI销管
Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.
 
 
 
 

939 řádky
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:'+ item.zxl||0 + '%'" ></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:'+ item.zxl||0 + '%'" ></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:'+ item.zxl||0 + '%'" ></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. //是否对比
  393. checkboxChange() {
  394. this.timepickpickisshow = !this.timepickpickisshow;
  395. this.staff2.label = '平均'
  396. this.staff2.value = ''
  397. this.lineOptsect1 = null
  398. this.lineOptsect2 = null
  399. this.lineOptsect3 = null
  400. this.chartData1 = null
  401. // 团队对比接待量
  402. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  403. // 团队对比接待时长
  404. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  405. /* 销奖执行率 */
  406. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  407. // 获取销奖能力
  408. this.getPowerList()
  409. },
  410. // 获取部门列表
  411. getSectionList() {
  412. this.$u.post('/cusLvStatistics/findAllDeptIdByHouseId', {
  413. houseId: this.houseId
  414. })
  415. .then(res => {
  416. this.staffList = []
  417. this.staffList1 = []
  418. res.map(item => {
  419. let obj = {}
  420. obj.value = item.deptId
  421. obj.label = item.deptName
  422. this.staffList.push(obj)
  423. })
  424. this.staffList1 = [...this.staffList]
  425. this.staffList.unshift({
  426. value: '',
  427. label: '全部'
  428. })
  429. this.staffList1.unshift({
  430. value: '',
  431. label: '平均'
  432. })
  433. this.staff1 = this.staffList[0]
  434. // 团队对比接待量
  435. this.receptionCountList(0, 1, '/cusLvStatistics/teamAnalysisReception')
  436. // 团队对比接待时长
  437. this.receptionCountList(0, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  438. /* 销奖执行率 */
  439. this.receptionCountList(0, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  440. // 获取销奖能力
  441. this.getPowerList()
  442. })
  443. },
  444. // 点击部门对比
  445. chiocStaff(idx) {
  446. if (idx == 0) {
  447. // 当选择了第一个的时候
  448. this.choseStaffFlag = false
  449. this.staffShow = true
  450. } else {
  451. this.choseStaffFlag = true
  452. this.staffShow1 = true
  453. }
  454. },
  455. //时间切换
  456. tabtimetap(index) {
  457. this.activeTotal = index;
  458. if (index == 3) {
  459. this.totalTimeShow = true;
  460. } else {
  461. this.lastEndDate = ''
  462. this.lastStartDate = ''
  463. // 获取数据
  464. // 团队对比接待量
  465. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  466. // 团队对比接待时长
  467. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  468. /* 销奖执行率 */
  469. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  470. // 获取销奖能力
  471. this.getPowerList()
  472. }
  473. },
  474. // 接待量
  475. tabtimetap1(idx) {
  476. this.eharTab.active1 = idx
  477. // 调用方法
  478. this.receptionCountList(idx, 1, '/cusLvStatistics/teamAnalysisReception')
  479. },
  480. // 接待时长
  481. tabtimetap2(idx) {
  482. this.eharTab.active2 = idx
  483. // 调用方法
  484. this.receptionCountList(idx, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  485. },
  486. tabtimetap3(idx) {
  487. this.eharTab.active3 = idx
  488. // 调用方法
  489. this.receptionCountList(idx, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  490. },
  491. tabtimetap4(idx) {
  492. this.eharTab.active4 = idx
  493. // 调用方法
  494. // this.getRecordList()
  495. },
  496. //自定义时间
  497. totalTimeChange(e) {
  498. console.log(e.startDate, e.endDate)
  499. this.activeTotal = 3;
  500. this.lastEndDate = e.endDate
  501. this.lastStartDate = e.startDate
  502. // 获取数据
  503. // 团队对比接待量
  504. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  505. // 团队对比接待时长
  506. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  507. /* 销奖执行率 */
  508. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  509. // 获取销奖能力
  510. this.getPowerList()
  511. },
  512. //指标执行率分析tab
  513. tapspagek2(index) {
  514. this.bocindex = index;
  515. },
  516. //集团对比
  517. Groupcontrast() {
  518. uni.navigateTo({
  519. url: '/pages/center/Piabodata/Groupcontrast'
  520. });
  521. },
  522. // 去选择团队
  523. goTeam() {
  524. uni.navigateTo({
  525. url: `/pages/center/Piabodata/selectTeam?ids=${this.deptids}`
  526. })
  527. },
  528. staffSelectCallback(e) {
  529. if (this.choseStaffFlag) {
  530. // 第二个客户
  531. // console.log(e,'第二个')
  532. this.staff2 = e[0]
  533. } else {
  534. // 第一个客户
  535. // console.log(e,'第一个')
  536. // 当选择全部时
  537. if (!e.value) {
  538. this.timepickpickisshow = false
  539. this.staff2.label = '平均'
  540. this.staff2.value = ''
  541. }
  542. this.staff1 = e[0]
  543. }
  544. if (this.staff1.label == this.staff2.label) {
  545. uni.showToast({
  546. title: '请勿选择重复',
  547. icon: 'none'
  548. })
  549. this.staff2.label = '请选择'
  550. // this.staff2.label='平均'
  551. // this.staff2.value=''
  552. return
  553. } else {
  554. // 获取数据
  555. // 团队对比接待量
  556. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  557. // 团队对比接待时长
  558. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  559. /* 销奖执行率 */
  560. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  561. // 获取销奖能力
  562. this.getPowerList()
  563. }
  564. },
  565. // 公共方法
  566. receptionCountList(idx, index, url) {
  567. this.$u.post(url, {
  568. deptIds: [this.staff1.value, this.staff2.value].filter(item => item).join(','),
  569. showRank: idx,
  570. houseId: this.houseId,
  571. timeType: this.lastEndDate ? null : this.activeTotal + '',
  572. lastEndDate: this.lastEndDate,
  573. lastStartDate: this.lastStartDate
  574. })
  575. .then(res => {
  576. console.log('我再此')
  577. let result = res.result
  578. this['newTeam' + index] = res.avg[0]
  579. this['newAvg' + index] = res.avg[1]
  580. if (idx == 0) {
  581. console.log(idx, index, url, '打卡记录撒橘红颗粒大健康1 ')
  582. // 当选择的是牌名时
  583. // 处理数据
  584. // 先处理牌名数据,需要进行判断全部还是单个
  585. // 当为全部时
  586. this['newlisttabinfo' + index] = []
  587. let arr = []
  588. // 当选择全部时
  589. if (!this.staff1.value && !this.staff2.value) {
  590. // console.log(1)
  591. result[0].map(item => {
  592. let obj = {}
  593. obj.name = item.deptName
  594. obj.zxl = item.data
  595. arr.push(obj)
  596. })
  597. arr = this.dealData(arr)
  598. this['newlisttabinfo' + index] = arr
  599. }
  600. // 当选择只有一个时
  601. else if (this.staff1.value && !this.staff2.value) {
  602. // console.log(2)
  603. result[0].map(item => {
  604. let obj = {}
  605. obj.name = item.deptName
  606. obj.zxl = item.data
  607. arr.push(obj)
  608. })
  609. // 判断是否显示平均
  610. // 如果显示对比
  611. if (this.timepickpickisshow) {
  612. result[1].map(item => {
  613. let obj = {}
  614. obj.name = '平均'
  615. obj.zxl = item.data
  616. arr.push(obj)
  617. })
  618. }
  619. arr = this.dealData(arr)
  620. this['newlisttabinfo' + index] = arr
  621. } else {
  622. console.log(3, '啥大上课了就可领取诶去玩害偶尔UI哦请勿诶哦')
  623. // 当两个都选择的时候
  624. result[0].map(item => {
  625. let obj = {}
  626. obj.name = item.deptName
  627. obj.zxl = item.data
  628. arr.push(obj)
  629. })
  630. result[1].map(item => {
  631. let obj = {}
  632. obj.name = item.deptName
  633. obj.zxl = item.data
  634. arr.push(obj)
  635. })
  636. arr = this.dealData(arr)
  637. this['newlisttabinfo' + index] = arr
  638. }
  639. } else {
  640. console.log(idx, index, url, '1231231231289123132UI哦23UI哦23UI哦1 ')
  641. // 当选择趋势时
  642. this['lineOptsect' + index] = {}
  643. let allobj = {
  644. categories: [],
  645. series: []
  646. }
  647. // 先处理时间
  648. // 当选择全部时
  649. if (!this.staff1.value && !this.staff2.value) {
  650. result.map((item, idx) => {
  651. let obj = {}
  652. obj.name = item[0].deptName
  653. obj.data = []
  654. item.map(item1 => {
  655. // 时间的处理
  656. if (idx == 0) {
  657. allobj.categories.push(item1.statDate.slice(5, 10))
  658. }
  659. obj.data.push(item1.data)
  660. })
  661. allobj.series.push(obj)
  662. })
  663. }
  664. // 当选择只有一个时
  665. else if (this.staff1.value && !this.staff2.value) {
  666. // console.log(2)
  667. let obj = {}
  668. obj.data = []
  669. obj.name = result[0][0].deptName
  670. result[0].map(item => {
  671. allobj.categories.push(item.statDate.slice(5, 10))
  672. obj.data.push(item.data)
  673. })
  674. allobj.series.push(obj)
  675. // 判断是否显示平均
  676. // 如果显示对比
  677. if (this.timepickpickisshow) {
  678. let obj = {}
  679. obj.data = []
  680. obj.name = '平均'
  681. result[1].map(item => {
  682. obj.data.push(item.data)
  683. })
  684. allobj.series.push(obj)
  685. }
  686. } else {
  687. // console.log(3)
  688. // 当两个都选择的时候
  689. let obj = {}
  690. let obj1 = {}
  691. obj.data = []
  692. obj1.data = []
  693. obj.name = result[0][0].deptName
  694. obj1.name = result[1][0].deptName
  695. result[0].map(item => {
  696. allobj.categories.push(item.statDate.slice(5, 10))
  697. obj.data.push(item.data)
  698. })
  699. result[1].map(item => {
  700. obj1.data.push(item.data)
  701. })
  702. allobj.series.push(obj)
  703. allobj.series.push(obj1)
  704. }
  705. // console.log(allobj)
  706. // return
  707. // this.lineOptsect1=allobj
  708. this['lineOptsect' + index] = allobj
  709. // this['lineOptsect'+index].series=allobj.series
  710. // this['lineOptsect'+index].categories=allobj.categories
  711. }
  712. this.$forceUpdate()
  713. })
  714. },
  715. // 获取销奖能力
  716. getPowerList() {
  717. this.$u.post('/cusLvStatistics/teamAnalysisMarketingAbility', {
  718. deptIds: this.deptids || [this.staff1.value, this.staff2.value].filter(item => item).join(','),
  719. houseId: this.houseId,
  720. timeType: this.lastEndDate ? null : this.activeTotal + '',
  721. lastEndDate: this.lastEndDate,
  722. lastStartDate: this.lastStartDate
  723. })
  724. .then(res => {
  725. // console.log(res)
  726. // 处理数据
  727. this.chartData1 = {
  728. categories: [],
  729. series: []
  730. }
  731. let allobj = {
  732. categories: [],
  733. series: []
  734. }
  735. // 当选择全部时
  736. if (!this.staff1.value && !this.staff2.value) {
  737. // let first=res.first
  738. res.first.map((item, index) => {
  739. let obj = {
  740. name: item[0].deptName,
  741. data: []
  742. }
  743. item.map((item1) => {
  744. if (index == 0) {
  745. allobj.categories.push(item1.name)
  746. }
  747. obj.data.push(item1.avgExecutionRate)
  748. })
  749. allobj.series.push(obj)
  750. })
  751. }
  752. // 当选择只有一个时
  753. else if (this.staff1.value && !this.staff2.value) {
  754. res.first.map((item, index) => {
  755. let obj = {
  756. name: item[0].deptName,
  757. data: []
  758. }
  759. item.map((item1) => {
  760. if (index == 0) {
  761. allobj.categories.push(item1.name)
  762. }
  763. obj.data.push(item1.avgExecutionRate)
  764. })
  765. allobj.series.push(obj)
  766. })
  767. // 判断是否显示平均
  768. // 如果显示对比
  769. if (this.timepickpickisshow) {
  770. res.second.map((item, index) => {
  771. let obj = {
  772. name: '平均',
  773. data: []
  774. }
  775. item.map((item1) => {
  776. obj.data.push(item1.avgExecutionRate)
  777. })
  778. allobj.series.push(obj)
  779. })
  780. }
  781. } else {
  782. // console.log(3)
  783. // 当两个都选择的时候
  784. res.first.map((item, index) => {
  785. let obj = {
  786. name: item[0].deptName,
  787. data: []
  788. }
  789. item.map((item1) => {
  790. if (index == 0) {
  791. allobj.categories.push(item1.name)
  792. }
  793. obj.data.push(item1.avgExecutionRate)
  794. })
  795. allobj.series.push(obj)
  796. })
  797. }
  798. // console.log(allobj)
  799. this.chartData1 = allobj
  800. this.$forceUpdate()
  801. })
  802. },
  803. // 定义一个公共方法对数据进行处理
  804. dealData(arr) {
  805. // 获取最大值
  806. let num = Math.max.apply(Math, arr.map(function(o) {
  807. return o.zxl
  808. })) //结果:3
  809. // console.log(num)
  810. if (num > 100) {
  811. // 获取最大值的下标
  812. // let idx=arr.findIndex(item=>item.zxl==num)
  813. // console.log(idx,123)
  814. arr.map(item => {
  815. item.zxl1 = Math.floor(item.zxl / num * 100)
  816. })
  817. // console.log(arr)
  818. return arr
  819. } else {
  820. arr.map(item => {
  821. item.zxl1 = item.zxl
  822. })
  823. return arr
  824. }
  825. },
  826. }
  827. };
  828. </script>
  829. <style lang="scss" scoped>
  830. .boxtittab {
  831. position: sticky;
  832. top: var(--window-top);
  833. z-index: 999;
  834. }
  835. .box {
  836. width: 100%;
  837. height: 100%;
  838. background: #FAFAFA;
  839. padding-bottom: 60rpx;
  840. }
  841. // 对比时间切换
  842. .timepick {
  843. width: 100%;
  844. height: 90rpx;
  845. display: flex;
  846. align-items: center;
  847. background: #FFFFFF;
  848. }
  849. .timepicktime {
  850. width: 260rpx;
  851. height: 50rpx;
  852. margin-left: 30rpx;
  853. display: flex;
  854. align-items: center;
  855. background: #FFFFFF;
  856. }
  857. .timepickpick {
  858. width: 110rpx;
  859. height: 50rpx;
  860. margin-left: 30rpx;
  861. display: flex;
  862. align-items: center;
  863. }
  864. .Underimg {
  865. width: 28rpx;
  866. height: 14rpx;
  867. margin-left: 12rpx;
  868. }
  869. .hejisan{
  870. width: 92%;
  871. margin: 0 auto;
  872. display: flex;
  873. padding-top: 20rpx;
  874. padding-bottom:20rpx;
  875. .sanbox1{
  876. flex: 1;
  877. display: flex;
  878. flex-direction: column;
  879. justify-content: center;
  880. align-items: center;
  881. position: relative;
  882. &::after{
  883. position: absolute;
  884. content: '';
  885. width: 1rpx;
  886. height: 86rpx;
  887. background: #E0E0E0;
  888. right: 0;
  889. top: 0;
  890. }
  891. &:last-child::after {
  892. position: absolute;
  893. content: '';
  894. width: 1rpx;
  895. height: 86rpx;
  896. right: 0;
  897. top: 0;
  898. background: #fff;
  899. }
  900. }
  901. .text1-1{
  902. font-size: 24rpx;
  903. font-family: PingFangSC-Regular, PingFang SC;
  904. font-weight: 400;
  905. color: #333333;
  906. line-height: 32rpx;
  907. }
  908. .text1-2{
  909. color: #333333;
  910. font-size: 40rpx;
  911. line-height: 46rpx;
  912. font-family: PingFangSC-Regular, PingFang SC;
  913. margin-bottom: 10rpx;
  914. }
  915. }
  916. </style>