liumin
/
NewZkgj
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
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.
520 Commits
7 Branches
28 MiB
 
 
 
Tree: 5997387ddd
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from '5997387ddd'
${ noResults }
NewZkgj/pages/center/Piabodata/Theteamcompared.vue

1065 lines
29 KiB
Raw Blame History 

  1. <template>

  2. 	<view class="box">

  3. 		<view class="boxtittabs">

  4. 			<div class="items" @tap="screenShow = true">{{ showTimeText }}

  5. 				<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon>

  6. 			</div>

  7. 			<div class="items" @tap="showTemplate = true">{{ showBeText }}

  8. 				<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon>

  9. 			</div>

  10. 		</view>

  11. 

  12. 		<view class="timepick">

  13. 			<view style="display: flex;" class="timepicktime" @click="chiocStaff(0)">

  14. 				<view style="flex-grow: 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">

  15. 					{{staff1.label}}

  16. 				</view>

  17. 				<view style="flex-shrink: 0;">

  18. 					<image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>

  19. 				</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}}</view>

  30. 				<view>

  31. 					<image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>

  32. 				</view>

  33. 			</view>

  34. 		</view>

  35. 

  36. 		<view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>

  37. 		<view class="single">

  38. 			<view class="title">

  39. 				<view class="title1" style="flex: 1;">接待量</view>

  40. 				<view class="title3" style="flex: 1;">

  41. 					<view class="title3-box" @click="tabtimetap1(0)">

  42. 						<view style="height: 42rpx;" :class="{ activecltab: eharTab.active1 == 0 }">排名</view>

  43. 					</view>

  44. 					<view class="title3-box" @click="tabtimetap1(1)">

  45. 						<view style="height: 42rpx;" :class="{ activecltab: eharTab.active1 == 1 }">趋势</view>

  46. 					</view>

  47. 				</view>

  48. 			</view>

  49. 			<view class="hejibox">

  50. 				<view class="heji">{{!staff1.value?'团队总数':staff1.label}}：{{newTeam1||0}}</view>

  51. 				<view class="heji">{{!staff2.value?'团队平均':staff2.label}}：{{newAvg1||0}}</view>

  52. 			</view>

  53. 			<view class="" v-if=" eharTab.active1 == 1 ">

  54. 				<view class="danwei">接待量</view>

  55. 				<view class="uchaserbox">

  56. 					<template v-if="showLineOptsect1">

  57. 						<qiun-data-charts type="line" :chartData="lineOptsect1" background="none" :ontouch="true"

  58. 							canvasId="wangxiaohuaerlingeryilingwuyibbb" :canvas2d="true" />

  59. 					</template>

  60. 				</view>

  61. 			</view>

  62. 			<view class="jindu" v-if=" eharTab.active1 == 0 ">

  63. 				<view class="jindu-box" v-for="(item,index) in newlisttabinfo1" :key="index">

  64. 					<view class="jindu-boxche">

  65. 						<view class="jindu-name">{{item.name.substring(0, 4)}}</view>

  66. 						<view style="width: 440rpx;margin-left: 10rpx;">

  67. 							<u-line-progress height="24" :show-percent="false" active-color="#FBA448"

  68. 								:percent="item.zxl1 || 0"></u-line-progress>

  69. 						</view>

  70. 						<view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>

  71. 					</view>

  72. 				</view>

  73. 			</view>

  74. 		</view>

  75. 

  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>

  88. 			</view>

  89. 			<view class="hejibox">

  90. 				<view class="heji">{{!staff1.value?'团队总数':staff1.label}}：{{newTeam2||0}}</view>

  91. 				<view class="heji">{{!staff2.value?'团队平均':staff2.label}}：{{newAvg2||0}}</view>

  92. 			</view>

  93. 			<view class="" v-if=" eharTab.active2 == 1 ">

  94. 				<view class="danwei">录音时长</view>

  95. 				<view class="uchaserbox">

  96. 					<template v-if="showLineOptsect2">

  97. 						<qiun-data-charts type="line" :chartData="lineOptsect2" background="none" :ontouch="true"

  98. 							canvasId="wangxiaohuaerlingeryilingwuyibb" :canvas2d="true" />

  99. 					</template>

  100. 				</view>

  101. 			</view>

  102. 			<view class="jindu" v-if=" eharTab.active2 == 0 ">

  103. 				<view class="jindu-box" v-for="(item,index) in newlisttabinfo2" :key="index">

  104. 					<view class="jindu-boxche">

  105. 						<view class="jindu-name">{{item.name.substring(0, 4)}}</view>

  106. 						<view style="width: 440rpx;margin-left: 10rpx;">

  107. 							<u-line-progress height="24" :show-percent="false" active-color="#FBA448"

  108. 								:percent="item.zxl1"></u-line-progress>

  109. 						</view>

  110. 						<view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>

  111. 					</view>

  112. 				</view>

  113. 			</view>

  114. 		</view>

  115. 

  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" :opts="lineOpts" />

  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. 

  152. 		<view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>

  153. 

  154. 		<view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>

  155. 		<view class="single">

  156. 			<view class="title" style="padding-right: 30rpx;">

  157. 				<view class="title1" style="flex-grow: 1;">销讲能力</view>

  158. 

  159. 				<view class="title2" style="flex-grow: 1;justify-content: flex-end;">

  160. 					<view class="title2-che" @click="showTemplates=true" style="width: 220rpx;">

  161. 						{{ showBeTexts }}

  162. 						<image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>

  163. 					</view>

  164. 					<view class="title2-che" @click="goTeam">团队

  165. 						<image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>

  166. 					</view>

  167. 				</view>

  168. 			</view>

  169. 

  170. 			<view class="uchaserbox uchaserboxs">

  171. 				<template v-if="showChartData1">

  172. 					<qiun-data-charts type="radar" :opts="opts" :chartData="chartData1" :canvas2d="true"

  173. 						canvasId="wangxiaohuaerlingeryilingwuyib88" background="none" />

  174. 				</template>

  175. 			</view>

  176. 		</view>

  177. 

  178. 

  179. 

  180. 

  181. 		<view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>

  182. 

  183. 		<u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>

  184. 

  185. 		<!-- 选择部门的选择框 -->

  186. 		<u-select v-model="staffShow" :list="staffList" @confirm="staffSelectCallback" :default-value='selindex'>

  187. 		</u-select>

  188. 		<u-select v-model="staffShow1" :list="staffList1" @confirm="staffSelectCallback" :default-value='selindex'>

  189. 		</u-select>

  190. 

  191. 

  192. 		<!-- 更多筛选 -->

  193. 		<u-popup v-model="screenShow" mode="bottom" height="368">

  194. 			<view class="screen">

  195. 				<view class="boxtittab">

  196. 					<view class="tabbox">

  197. 						<view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4, '近七天')">近七天</view>

  198. 					</view>

  199. 					<view class="tabbox">

  200. 						<view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5, '近15天')">近15天</view>

  201. 					</view>

  202. 					<view class="tabbox">

  203. 						<view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6, '近30天')">近30天</view>

  204. 					</view>

  205. 					<view class="tabbox">

  206. 						<view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3, '自定义')">自定义</view>

  207. 					</view>

  208. 				</view>

  209. 			</view>

  210. 		</u-popup>

  211. 

  212. 		<!-- 销讲业务 -->

  213. 		<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate"

  214. 			mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select>

  215. 

  216. 

  217. 		<!-- 销讲业务2 -->

  218. 		<u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplates"

  219. 			mode="single-column" :list="templateLists" @cancel="showTemplates = false" @confirm="templateConfirms">

  220. 		</u-select>

  221. 		<!-- 加载组件  -->

  222. 		<loading v-model="LOADING"></loading>

  223. 	</view>

  224. </template>

  225. 

  226. <script>

  227. 	var app = getApp();

  228. 	var util = require("../../../utils/util.js");

  229. 	var config = require("../../../config");

  230. 	import loading from "@/components/loading/index.vue"

  231. 	export default {

  232. 		components: {

  233. 			loading

  234. 		},

  235. 		data() {

  236. 			return {

  237. 				activeTotal: 4,

  238. 				eharTab: {

  239. 					active1: 0,

  240. 					active2: 0,

  241. 					active3: 0,

  242. 					active4: 0,

  243. 				},

  244. 				deptids: '',

  245. 				bocindex: 0,

  246. 				timepickpickisshow: false,

  247. 				totalTimeShow: false,

  248. 				// 项目id

  249. 				houseId: '',

  250. 				staffList: [],

  251. 				staffList1: [],

  252. 				staffShow: false,

  253. 				staffShow1: false,

  254. 				staff1: {

  255. 					value: '',

  256. 					label: ''

  257. 				},

  258. 				staff2: {

  259. 					value: '',

  260. 					label: '平均'

  261. 				},

  262. 				lastStartDate: '',

  263. 				lastEndDate: '',

  264. 				selindex: [0],

  265. 				choseStaffFlag: false,

  266. 				lineOptsect1: {

  267. 					"categories": ["2016", "2017", "2018", "2019", "2020", "2021"],

  268. 					"series": [{

  269. 							"name": "成交量1",

  270. 							"data": [35, 8, 25, 37, 4, 20]

  271. 						},

  272. 						{

  273. 							"name": "成交量2",

  274. 							"data": [40, 18, 45, 44, 10, 60]

  275. 						}

  276. 					]

  277. 				},

  278. 				lineOptsect2: {

  279. 					"categories": ["2016", "2017", "2018", "2019", "2020", "2021"],

  280. 					"series": [{

  281. 							"name": "成交量1",

  282. 							"data": [35, 8, 25, 37, 4, 20]

  283. 						},

  284. 						{

  285. 							"name": "成交量2",

  286. 							"data": [40, 18, 45, 44, 10, 60]

  287. 						}

  288. 					]

  289. 				},

  290. 				lineOptsect3: {

  291. 					"categories": ["2016", "2017", "2018", "2019", "2020", "2021"],

  292. 					"series": [{

  293. 							"name": "成交量1",

  294. 							"data": [35, 8, 25, 37, 4, 20]

  295. 						},

  296. 						{

  297. 							"name": "成交量2",

  298. 							"data": [40, 18, 45, 44, 10, 60]

  299. 						}

  300. 					]

  301. 				},

  302. 				lineOptsect4: {

  303. 					"categories": ["2016", "2017", "2018", "2019", "2020", "2021"],

  304. 					"series": [{

  305. 							"name": "成交量1",

  306. 							"data": [35, 8, 25, 37, 4, 20]

  307. 						},

  308. 						{

  309. 							"name": "成交量2",

  310. 							"data": [40, 18, 45, 44, 10, 60]

  311. 						}

  312. 					]

  313. 				},

  314. 				newlisttabinfo1: [{

  315. 						name: '接待量',

  316. 						zxl: '10'

  317. 					},

  318. 					{

  319. 						name: '平均执行率',

  320. 						zxl: '50'

  321. 					},

  322. 					{

  323. 						name: '接待客户',

  324. 						zxl: '80'

  325. 					},

  326. 				],

  327. 				newlisttabinfo2: [{

  328. 						name: '接待量',

  329. 						zxl: '10'

  330. 					},

  331. 					{

  332. 						name: '平均执行率',

  333. 						zxl: '50'

  334. 					},

  335. 					{

  336. 						name: '接待客户',

  337. 						zxl: '80'

  338. 					},

  339. 				],

  340. 				newlisttabinfo3: [{

  341. 						name: '接待量',

  342. 						zxl: '10'

  343. 					},

  344. 					{

  345. 						name: '平均执行率',

  346. 						zxl: '50'

  347. 					},

  348. 					{

  349. 						name: '接待客户',

  350. 						zxl: '80'

  351. 					},

  352. 				],

  353. 				newlisttabinfo4: [{

  354. 						name: '接待量',

  355. 						zxl: '10'

  356. 					},

  357. 					{

  358. 						name: '平均执行率',

  359. 						zxl: '50'

  360. 					},

  361. 					{

  362. 						name: '接待客户',

  363. 						zxl: '80'

  364. 					},

  365. 				],

  366. 				newTeam1: '',

  367. 				newAvg1: '',

  368. 				newTeam2: '',

  369. 				newAvg2: '',

  370. 				newTeam3: '',

  371. 				newAvg3: '',

  372. 				newTeam4: '',

  373. 				newAvg4: '',

  374. 				chartData1: {

  375. 					"categories": ["维度1", "维度2", "维度3", "维度4", "维度5", "维度6"],

  376. 					"series": [{

  377. 						"name": "成交量",

  378. 						"data": [90, 110, 165, 195, 187, 172]

  379. 					}]

  380. 				},

  381. 				chartData2: {

  382. 					"categories": ["维度1", "维度2", "维度3", "维度4", "维度5", "维度6"],

  383. 					"series": [{

  384. 						"name": "成交量",

  385. 						"data": [90, 110, 165, 195, 187, 172]

  386. 					}]

  387. 				},

  388. 

  389. 				opts: {

  390. 					fontSize: 10,

  391. 					extra: {

  392. 						radar: {

  393. 							max: ''

  394. 						}

  395. 					}

  396. 				},

  397. 

  398. 				lineOpts: {

  399. 					yAxis: {

  400. 						data: [{

  401. 							max: 100,

  402. 							min: 0,

  403. 						}]

  404. 					}

  405. 				},

  406. 

  407. 

  408. 				screenShow: false, // 时间筛选弹窗

  409. 				showTimeText: '近七天', // 展示文字

  410. 				showBeText: '全部业务', // 

  411. 				templateList: [], // 销讲业务

  412. 				showTemplate: false, // 展示选择销讲业务弹窗

  413. 				marketingBusiness: '', // 选择的业务id

  414. 

  415. 

  416. 				showTemplates: false, // 展示选择销讲业务弹窗

  417. 				templateLists: [], // 销讲业务

  418. 				marketingBusinessId: '', // 选择的业务id

  419. 				showBeTexts: '', //

  420. 			};

  421. 		},

  422. 

  423. 		computed: {

  424. 			showLineOptsect1() {

  425. 				return this.lineOptsect1.series.length > 0

  426. 			},

  427. 			showLineOptsect2() {

  428. 				return this.lineOptsect2.series.length > 0

  429. 			},

  430. 			showLineOptsect3() {

  431. 				return this.lineOptsect3.series.length > 0

  432. 			},

  433. 			showChartData1() {

  434. 				return this.chartData1.series.length > 0

  435. 			},

  436. 		},

  437. 

  438. 		onLoad() {

  439. 			this.LOADING = true

  440. 			this.getMarketingBusiness()

  441. 			let that = this

  442. 			uni.$on('update', function(data) {

  443. 				// console.log(data)

  444. 				that.deptids = data.arr.join(',')

  445. 				// 获取销奖能力

  446. 				that.getPowerList()

  447. 			})

  448. 			// 获取项目id

  449. 			this.houseId = uni.getStorageSync('buildingID').id;

  450. 			// this.buildingname = uni.getStorageSync('buildingID').name;

  451. 			// 请求接口获取所有置业顾问员工的列表

  452. 			this.getSectionList()

  453. 

  454. 		},

  455. 		onPullDownRefresh() {

  456. 			let that = this

  457. 			this.getMarketingBusiness()

  458. 			uni.$on('update', function(data) {

  459. 				// console.log(data)

  460. 				that.deptids = data.arr.join(',')

  461. 				// 获取销奖能力

  462. 				that.getPowerList()

  463. 			})

  464. 			// 获取项目id

  465. 			this.houseId = uni.getStorageSync('buildingID').id;

  466. 			// this.buildingname = uni.getStorageSync('buildingID').name;

  467. 			// 请求接口获取所有置业顾问员工的列表

  468. 			this.getSectionList()

  469. 			setTimeout(function() {

  470. 				uni.stopPullDownRefresh();

  471. 			}, 1000);

  472. 		},

  473. 		methods: {

  474. 

  475. 			// 销讲业务方法

  476. 			templateCancel() {

  477. 				this.showTemplate = false;

  478. 			},

  479. 

  480. 			// 确认选择销讲业务

  481. 			templateConfirm(e) {

  482. 				this.showTemplate = false;

  483. 				this.marketingBusiness = e[0].value

  484. 				this.showBeText = e[0].label

  485. 				this.getSectionList()

  486. 			},

  487. 

  488. 

  489. 			// 确认选择销讲业务

  490. 			templateConfirms(e) {

  491. 				this.showTemplates = false;

  492. 				this.marketingBusinessId = e[0].value

  493. 				this.showBeTexts = e[0].label

  494. 				// 获取销奖能力

  495. 				this.getPowerList()

  496. 			},

  497. 

  498. 			// 获取销讲业务

  499. 			getMarketingBusiness() {

  500. 				this.$u.get('/customer/marketingBusiness', {

  501. 					houseId: uni.getStorageSync('buildingID').id,

  502. 				}).then(res => {

  503. 					this.templateLists = res.map(item => {

  504. 						return item

  505. 					})

  506. 					this.marketingBusinessId = res[0].id

  507. 					this.showBeTexts = res[0].templateName

  508. 					this.templateList = res

  509. 					this.templateList.unshift({

  510. 						templateName: '全部业务',

  511. 						id: ''

  512. 					})

  513. 				})

  514. 			},

  515. 

  516. 			//是否对比

  517. 			checkboxChange() {

  518. 				this.timepickpickisshow = !this.timepickpickisshow;

  519. 				this.staff2.label = '平均'

  520. 				this.staff2.value = ''

  521. 				// 团队对比接待量

  522. 				this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')

  523. 				// 团队对比接待时长

  524. 				this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')

  525. 				/* 销奖执行率 */

  526. 				this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')

  527. 				// 获取销奖能力

  528. 				this.getPowerList()

  529. 			},

  530. 			// 获取部门列表

  531. 			getSectionList() {

  532. 				this.$u.post('/cusLvStatistics/findAllDeptIdByHouseId', {

  533. 						houseId: this.houseId,

  534. 					})

  535. 					.then(res => {

  536. 						this.staffList = []

  537. 						this.staffList1 = []

  538. 						res.map(item => {

  539. 							let obj = {}

  540. 							obj.value = item.deptId

  541. 							obj.label = item.deptName

  542. 							this.staffList.push(obj)

  543. 						})

  544. 						this.staffList1 = [...this.staffList]

  545. 						this.staffList.unshift({

  546. 							value: '',

  547. 							label: '全部'

  548. 						})

  549. 						this.staffList1.unshift({

  550. 							value: '',

  551. 							label: '平均'

  552. 						})

  553. 						this.staff1 = this.staffList[0]

  554. 						// 团队对比接待量

  555. 						this.receptionCountList(0, 1, '/cusLvStatistics/teamAnalysisReception')

  556. 						// 团队对比接待时长

  557. 						this.receptionCountList(0, 2, '/cusLvStatistics/teamAnalysisReceptionTime')

  558. 						/* 销奖执行率 */

  559. 						this.receptionCountList(0, 3, '/cusLvStatistics/teamAnalysisExecutionRate')

  560. 						// 获取销奖能力

  561. 						this.getPowerList()

  562. 

  563. 					})

  564. 			},

  565. 			// 点击部门对比

  566. 			chiocStaff(idx) {

  567. 				if (idx == 0) {

  568. 					// 当选择了第一个的时候

  569. 					this.choseStaffFlag = false

  570. 					this.staffShow = true

  571. 				} else {

  572. 					this.choseStaffFlag = true

  573. 					this.staffShow1 = true

  574. 				}

  575. 

  576. 			},

  577. 			//时间切换

  578. 			tabtimetap(index, text) {

  579. 				if (index == 3) {

  580. 					this.totalTimeShow = true;

  581. 					this.screenShow = false

  582. 				} else {

  583. 					this.screenShow = false

  584. 					this.showTimeText = text

  585. 					this.activeTotal = index;

  586. 					this.lastEndDate = ''

  587. 					this.lastStartDate = ''

  588. 					// 获取数据

  589. 					// 团队对比接待量

  590. 					this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')

  591. 					// 团队对比接待时长

  592. 					this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')

  593. 					/* 销奖执行率 */

  594. 					this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')

  595. 					// 获取销奖能力

  596. 					this.getPowerList()

  597. 				}

  598. 			},

  599. 			// 接待量

  600. 			tabtimetap1(idx) {

  601. 				this.eharTab.active1 = idx

  602. 				// 调用方法

  603. 				this.receptionCountList(idx, 1, '/cusLvStatistics/teamAnalysisReception')

  604. 			},

  605. 			// 接待时长

  606. 			tabtimetap2(idx) {

  607. 				this.eharTab.active2 = idx

  608. 				// 调用方法

  609. 				this.receptionCountList(idx, 2, '/cusLvStatistics/teamAnalysisReceptionTime')

  610. 			},

  611. 			tabtimetap3(idx) {

  612. 				this.eharTab.active3 = idx

  613. 				// 调用方法

  614. 				this.receptionCountList(idx, 3, '/cusLvStatistics/teamAnalysisExecutionRate')

  615. 			},

  616. 			tabtimetap4(idx) {

  617. 				this.eharTab.active4 = idx

  618. 				// 调用方法

  619. 				// this.getRecordList()

  620. 			},

  621. 			//自定义时间

  622. 			totalTimeChange(e) {

  623. 				this.screenShow = false

  624. 				this.showTimeText = `${e.startDate}-${e.endDate}`

  625. 				this.activeTotal = 3;

  626. 				this.lastEndDate = e.endDate

  627. 				this.lastStartDate = e.startDate

  628. 				// 获取数据

  629. 				// 团队对比接待量

  630. 				this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')

  631. 				// 团队对比接待时长

  632. 				this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')

  633. 				/* 销奖执行率 */

  634. 				this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')

  635. 				// 获取销奖能力

  636. 				this.getPowerList()

  637. 			},

  638. 			//指标执行率分析tab

  639. 			tapspagek2(index) {

  640. 				this.bocindex = index;

  641. 			},

  642. 			//集团对比

  643. 			Groupcontrast() {

  644. 				uni.navigateTo({

  645. 					url: '/pages/center/Piabodata/Groupcontrast'

  646. 				});

  647. 			},

  648. 			// 去选择团队

  649. 			goTeam() {

  650. 				uni.navigateTo({

  651. 					url: `/pages/center/Piabodata/selectTeam?ids=${this.deptids}`

  652. 				})

  653. 			},

  654. 			staffSelectCallback(e) {

  655. 				if (this.choseStaffFlag) {

  656. 					// 第二个客户

  657. 					// console.log(e,'第二个')

  658. 					this.staff2 = e[0]

  659. 				} else {

  660. 					// 第一个客户

  661. 					// console.log(e,'第一个')

  662. 					// 当选择全部时

  663. 					if (!e.value) {

  664. 						this.timepickpickisshow = false

  665. 						this.staff2.label = '平均'

  666. 						this.staff2.value = ''

  667. 					}

  668. 					this.staff1 = e[0]

  669. 				}

  670. 				if (this.staff1.label == this.staff2.label) {

  671. 					uni.showToast({

  672. 						title: '请勿选择重复',

  673. 						icon: 'none'

  674. 					})

  675. 					this.staff2.label = '请选择'

  676. 					// this.staff2.label='平均'

  677. 					// this.staff2.value=''

  678. 					return

  679. 				} else {

  680. 					// 获取数据

  681. 					// 团队对比接待量

  682. 					this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')

  683. 					// 团队对比接待时长

  684. 					this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')

  685. 					/* 销奖执行率 */

  686. 					this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')

  687. 					// 获取销奖能力

  688. 					this.getPowerList()

  689. 				}

  690. 			},

  691. 			// 接待时长

  692. 			receptionCountList(idx, index, url) {

  693. 				this.$u.post(url, {

  694. 						// userA:this.staff1.value,

  695. 						// userB:this.staff2.value,

  696. 						deptIds: [this.staff1.value, this.staff2.value].filter(item => item).join(','),

  697. 						showRank: idx,

  698. 						houseId: this.houseId,

  699. 						timeType: this.lastEndDate ? null : this.activeTotal + '',

  700. 						lastEndDate: this.lastEndDate,

  701. 						lastStartDate: this.lastStartDate,

  702. 						marketingBusiness: this.marketingBusiness,

  703. 					})

  704. 					.then(res => {

  705. 						// console.log(res)

  706. 						let result = res.result

  707. 						this['newTeam' + index] = res.avg[0]

  708. 						this['newAvg' + index] = res.avg[1]

  709. 						if (idx == 0) {

  710. 							// 当选择的是牌名时

  711. 							// 处理数据

  712. 							// 先处理牌名数据,需要进行判断全部还是单个

  713. 							// 当为全部时

  714. 							this['newlisttabinfo' + index] = []

  715. 							let arr = []

  716. 							// 当选择全部时

  717. 							if (!this.staff1.value && !this.staff2.value) {

  718. 								// console.log(1)

  719. 								result[0].map(item => {

  720. 									let obj = {}

  721. 									obj.name = item.deptName

  722. 									obj.zxl = item.data

  723. 									arr.push(obj)

  724. 

  725. 								})

  726. 								arr = this.dealData(arr)

  727. 								this['newlisttabinfo' + index] = arr

  728. 							}

  729. 							// 当选择只有一个时

  730. 							else if (this.staff1.value && !this.staff2.value) {

  731. 								// console.log(2)

  732. 								result[0].map(item => {

  733. 									let obj = {}

  734. 									obj.name = item.deptName

  735. 									obj.zxl = item.data

  736. 									arr.push(obj)

  737. 								})

  738. 								// 判断是否显示平均

  739. 								// 如果显示对比

  740. 								if (this.timepickpickisshow) {

  741. 									result[1].map(item => {

  742. 										let obj = {}

  743. 										obj.name = '平均'

  744. 										obj.zxl = item.data

  745. 										arr.push(obj)

  746. 									})

  747. 								}

  748. 								arr = this.dealData(arr)

  749. 								this['newlisttabinfo' + index] = arr

  750. 							} else {

  751. 								// console.log(3)

  752. 								// 当两个都选择的时候

  753. 								result[0].map(item => {

  754. 									let obj = {}

  755. 									obj.name = item.deptName

  756. 									obj.zxl = item.data

  757. 									arr.push(obj)

  758. 								})

  759. 								result[1].map(item => {

  760. 									let obj = {}

  761. 									obj.name = item.deptName

  762. 									obj.zxl = item.data

  763. 									arr.push(obj)

  764. 								})

  765. 								arr = this.dealData(arr)

  766. 								this['newlisttabinfo' + index] = arr

  767. 							}

  768. 						} else {

  769. 							// 当选择趋势时

  770. 							this['lineOptsect' + index] = {}

  771. 							let allobj = {

  772. 								categories: [],

  773. 								series: []

  774. 							}

  775. 							// 先处理时间

  776. 							// 当选择全部时

  777. 							if (!this.staff1.value && !this.staff2.value) {

  778. 								result.map((item, idx) => {

  779. 									let obj = {}

  780. 									obj.name = item[0].deptName

  781. 									obj.data = []

  782. 									item.map(item1 => {

  783. 										// 时间的处理

  784. 										if (idx == 0) {

  785. 											allobj.categories.push(item1.statDate.slice(5, 10))

  786. 										}

  787. 										obj.data.push(item1.data)

  788. 									})

  789. 									allobj.series.push(obj)

  790. 								})

  791. 							}

  792. 							// 当选择只有一个时

  793. 							else if (this.staff1.value && !this.staff2.value) {

  794. 								// console.log(2)

  795. 								let obj = {}

  796. 								obj.data = []

  797. 								obj.name = result[0][0].deptName

  798. 								result[0].map(item => {

  799. 									allobj.categories.push(item.statDate.slice(5, 10))

  800. 									obj.data.push(item.data)

  801. 								})

  802. 								allobj.series.push(obj)

  803. 								// 判断是否显示平均

  804. 								// 如果显示对比

  805. 								if (this.timepickpickisshow) {

  806. 									let obj = {}

  807. 									obj.data = []

  808. 									obj.name = '平均'

  809. 									result[1].map(item => {

  810. 										obj.data.push(item.data)

  811. 									})

  812. 									allobj.series.push(obj)

  813. 								}

  814. 							} else {

  815. 								// console.log(3)

  816. 								// 当两个都选择的时候

  817. 								let obj = {}

  818. 								let obj1 = {}

  819. 								obj.data = []

  820. 								obj1.data = []

  821. 								obj.name = result[0][0].deptName

  822. 								obj1.name = result[1][0].deptName

  823. 								result[0].map(item => {

  824. 									allobj.categories.push(item.statDate.slice(5, 10))

  825. 									obj.data.push(item.data)

  826. 								})

  827. 								result[1].map(item => {

  828. 									obj1.data.push(item.data)

  829. 								})

  830. 								allobj.series.push(obj)

  831. 								allobj.series.push(obj1)

  832. 							}

  833. 							// console.log(allobj)

  834. 							// return 

  835. 							// this.lineOptsect1=allobj

  836. 							this['lineOptsect' + index] = allobj

  837. 							// this['lineOptsect'+index].series=allobj.series

  838. 							// this['lineOptsect'+index].categories=allobj.categories

  839. 						}

  840. 					})

  841. 			},

  842. 			// 获取销奖能力

  843. 			getPowerList() {

  844. 				this.$u.post('/cusLvStatistics/teamAnalysisMarketingAbility', {

  845. 						deptIds: this.deptids || [this.staff1.value, this.staff2.value].filter(item => item).join(','),

  846. 						houseId: this.houseId,

  847. 						timeType: this.lastEndDate ? null : this.activeTotal + '',

  848. 						lastEndDate: this.lastEndDate,

  849. 						lastStartDate: this.lastStartDate,

  850. 						marketingBusiness: this.marketingBusinessId,

  851. 					})

  852. 					.then(res => {

  853. 						this.LOADING = false

  854. 						// console.log(res)

  855. 						// 处理数据

  856. 						this.chartData1 = {

  857. 							categories: [],

  858. 							series: []

  859. 						}

  860. 						let allobj = {

  861. 							categories: [],

  862. 							series: []

  863. 						}

  864. 						let max = 0;

  865. 						// 当选择全部时

  866. 						if (!this.staff1.value && !this.staff2.value) {

  867. 							// let first=res.first

  868. 							res.first.map((item, index) => {

  869. 								let obj = {

  870. 									name: item[0].deptName,

  871. 									data: []

  872. 								}

  873. 								item.map((item1) => {

  874. 									if (index == 0) {

  875. 										allobj.categories.push(item1.name)

  876. 									}

  877. 									obj.data.push(item1.avgExecutionRate)

  878. 									if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;

  879. 								})

  880. 								allobj.series.push(obj)

  881. 							})

  882. 						}

  883. 						// 当选择只有一个时

  884. 						else if (this.staff1.value && !this.staff2.value) {

  885. 							res.first.map((item, index) => {

  886. 								let obj = {

  887. 									name: item[0].deptName,

  888. 									data: []

  889. 								}

  890. 								item.map((item1) => {

  891. 									if (index == 0) {

  892. 										allobj.categories.push(item1.name)

  893. 									}

  894. 									obj.data.push(item1.avgExecutionRate)

  895. 									if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;

  896. 								})

  897. 								allobj.series.push(obj)

  898. 							})

  899. 							// 判断是否显示平均

  900. 							// 如果显示对比

  901. 							if (this.timepickpickisshow) {

  902. 								res.second.map((item, index) => {

  903. 									let obj = {

  904. 										name: '平均',

  905. 										data: []

  906. 									}

  907. 									item.map((item1) => {

  908. 										obj.data.push(item1.avgExecutionRate)

  909. 									})

  910. 									allobj.series.push(obj)

  911. 								})

  912. 							}

  913. 						} else {

  914. 							// console.log(3)

  915. 							// 当两个都选择的时候

  916. 							res.first.map((item, index) => {

  917. 								let obj = {

  918. 									name: item[0].deptName,

  919. 									data: []

  920. 								}

  921. 								item.map((item1) => {

  922. 									if (index == 0) {

  923. 										allobj.categories.push(item1.name)

  924. 									}

  925. 									obj.data.push(item1.avgExecutionRate)

  926. 									if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;

  927. 								})

  928. 								allobj.series.push(obj)

  929. 							})

  930. 						}

  931. 						this.opts.extra.radar.max = max + 25

  932. 						// console.log(allobj)

  933. 						this.chartData1 = allobj

  934. 						this.$forceUpdate()

  935. 					}).catch(e => {

  936. 						this.LOADING = false

  937. 					})

  938. 			},

  939. 			// 定义一个公共方法对数据进行处理

  940. 			dealData(arr) {

  941. 				// 获取最大值

  942. 				let num = Math.max.apply(Math, arr.map(function(o) {

  943. 					return o.zxl

  944. 				})) //结果：3

  945. 				// console.log(num)

  946. 				if (num > 100) {

  947. 					// 获取最大值的下标

  948. 					// let idx=arr.findIndex(item=>item.zxl==num)

  949. 					// console.log(idx,123)

  950. 					arr.map(item => {

  951. 						item.zxl1 = Math.floor(item.zxl / num * 100)

  952. 					})

  953. 					// console.log(arr)

  954. 					return arr

  955. 				} else {

  956. 					arr.map(item => {

  957. 						item.zxl1 = item.zxl

  958. 					})

  959. 					return arr

  960. 				}

  961. 			},

  962. 		}

  963. 	};

  964. </script>

  965. <style lang="scss" scoped>

  966. 	.boxtittabs {

  967. 		width: 100%;

  968. 		height: 92rpx;

  969. 		background: #FFFFFF;

  970. 		display: flex;

  971. 		align-items: center;

  972. 

  973. 		.items {

  974. 			padding: 0 24rpx;

  975. 			width: 50%;

  976. 			height: 100%;

  977. 			display: flex;

  978. 			align-items: center;

  979. 			justify-content: center;

  980. 			overflow: hidden;

  981. 			white-space: nowrap;

  982. 			text-overflow: ellipsis;

  983. 		}

  984. 	}

  985. 

  986. 	.screen {

  987. 		width: 100%;

  988. 

  989. 		.boxtittab {

  990. 			width: 100%;

  991. 			flex-direction: column;

  992. 			border: none;

  993. 

  994. 			.tabbox {

  995. 				width: 100%;

  996. 			}

  997. 		}

  998. 	}

  999. 

  1000. 	.uchaserboxs {

  1001. 		width: 100%;

  1002. 		height: 70vh;

  1003. 	}

  1004. 

  1005. 	.box {

  1006. 		width: 100%;

  1007. 		height: 100%;

  1008. 		background: #FAFAFA;

  1009. 		padding-bottom: 60rpx;

  1010. 	}

  1011. 

  1012. 	// 对比时间切换

  1013. 	.timepick {

  1014. 		width: 100%;

  1015. 		height: 90rpx;

  1016. 		display: flex;

  1017. 		align-items: center;

  1018. 		background: #FAFAFA;

  1019. 	}

  1020. 

  1021. 	.timepicktime {

  1022. 		width: 260rpx;

  1023. 		height: 50rpx;

  1024. 		border: 1rpx solid #E0E0E0;

  1025. 		margin-left: 30rpx;

  1026. 		display: flex;

  1027. 		background: #FFFFFF;

  1028. 	}

  1029. 

  1030. 	.timepicktime>view:nth-of-type(1) {

  1031. 		width: 210rpx;

  1032. 		height: 100%;

  1033. 		line-height: 50rpx;

  1034. 		font-size: 26rpx;

  1035. 		font-weight: 400;

  1036. 		text-align: center;

  1037. 	}

  1038. 

  1039. 	.timepicktime>view:nth-of-type(2) {

  1040. 		width: 49rpx;

  1041. 		height: 100%;

  1042. 		// border-left: 1px solid  #E0E0E0;

  1043. 	}

  1044. 

  1045. 	.timepickpick {

  1046. 		width: 110rpx;

  1047. 		height: 50rpx;

  1048. 		margin-left: 30rpx;

  1049. 		display: flex;

  1050. 		align-items: center;

  1051. 	}

  1052. 

  1053. 	.Underimg {

  1054. 		width: 50rpx;

  1055. 		height: 50rpx;

  1056. 		margin-top: -2rpx;

  1057. 	}

  1058. 

  1059. 	.heji {

  1060. 		overflow: hidden;

  1061. 		text-overflow: ellipsis;

  1062. 		white-space: nowrap;

  1063. 	}

  1064. </style>