Acher
/
newEdition
1
0
Vork 0
Code Kwesties 0 Pull-aanvragen 0 Publicaties 0 Wiki Activiteit
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.
87 Commits
13 Branches
9.9 MiB
 
 
 
 
Tree: a8c426827c
Branches Labels
${ item.name }
Maak branch ${ searchTerm }
van 'a8c426827c'
${ noResults }
newEdition/pages/center/Piabodata/Employeesstatistics.vue

540 regels
17 KiB
Ruw Blame Geschiedenis 

  1. <template>

  2. 	<view class="box">

  3. 		<view class="boxtittab">

  4. 			<view class="tabbox">

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

  6. 			</view>

  7. 			<view class="tabbox">

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

  9. 			</view>

  10. 			<view class="tabbox">

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

  12. 			</view>

  13. 			<view class="tabbox">

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

  15. 			</view>

  16. 		</view>

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

  18. 		<view class="single">

  19. 			<view class="title">

  20. 				<view class="title1" style="flex: 1;">接待量排名（TOP10）</view>

  21. 			</view>

  22. 			<view class="hejisan">

  23. 				<view class="sanbox1" >

  24. 					<view class="text1-2">{{newlisttabinfo1.total}}</view>

  25. 					<view class="text1-1">合计接待次数</view>

  26. 				</view>

  27. 				<view  class="sanbox1" >

  28. 					<view class="text1-2">{{newlisttabinfo1.count}}</view>

  29. 					<view class="text1-1">顾问人数</view>

  30. 				</view>

  31. 				<view  class="sanbox1">

  32. 					<view class="text1-2">{{newlisttabinfo1.avg}}</view>

  33. 					<view class="text1-1">人均接待次数</view>

  34. 				</view>

  35. 			</view>

  36. 		

  37. 			<view class="jindu" style="margin-top: 20rpx;min-height: 300rpx;">

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

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

  40. 						<view class="jindu-name u-flex" style='width: 170rpx' v-if="item.name">

  41. 							<image v-if="index==0" class="sort-img" src="/static/images/top1.png" mode="" />

  42. 							<image v-if="index==1" class="sort-img" src="/static/images/top2.png" mode="" />

  43. 							<image v-if="index==2" class="sort-img" src="/static/images/top3.png" mode="" />

  44. 							<view class="sort-number" v-if="index>2">{{index+1}}</view>

  45. 							{{item.name.substring(0,4)}}</view>

  46. 						<view class="progress-cus">

  47. 							<view class="color1" v-if="index==0" :style="'width:'+ item.zxl||0 + '%'" ></view>

  48. 							<view class="color2" v-if="index==1" :style="'width:'+ item.zxl||0 + '%'" ></view>

  49. 							<view class="color3" v-if="index==2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  50. 							<view class="color4" v-if="index>2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  51. 						</view>

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

  53. 					</view>

  54. 				</view>

  55. 				<view v-if="newlisttabinfo1.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">

  56. 					暂无数据

  57. 				</view>

  58. 			</view>

  59. 		</view>

  60. 

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

  62. 		<view class="single">

  63. 			<view class="title">

  64. 				<view class="title1"  style="flex: 1;">平均执行率排行（TOP10）</view>

  65. 			</view>

  66. 			<view class="hejisan">

  67. 				<view  class="sanbox1" style="width: 40%;">

  68. 					<view class="text1-2">{{newlisttabinfo3.count}}</view>

  69. 					<view class="text1-1">顾问人数</view>

  70. 				</view>

  71. 				<view  class="sanbox1" style="width: 25%;">

  72. 					<view class="text1-2">{{newlisttabinfo3.avg}}%</view>

  73. 					<view class="text1-1">人均执行率</view>

  74. 				</view>

  75. 			</view>

  76. 			<view class="jindu" style="margin-top: 20rpx;min-height: 300rpx;">

  77. 				<view v-if="newlisttabinfo3.result.length" class="jindu-box" v-for="(item,index) in newlisttabinfo3.result" :key="index">

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

  79. 						<view class="jindu-name u-flex" style='width: 170rpx' v-if="item.name">

  80. 							<image v-if="index==0" class="sort-img" src="/static/images/top1.png" mode="" />

  81. 							<image v-if="index==1" class="sort-img" src="/static/images/top2.png" mode="" />

  82. 							<image v-if="index==2" class="sort-img" src="/static/images/top3.png" mode="" />

  83. 							<view class="sort-number" v-if="index>2">{{index+1}}</view>

  84. 							{{item.name.substring(0,4)}}</view>

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

  86. 						<!-- <view class="progress-cus">

  87. 							<view class="color" :style="'width:'+ item.zxl||0 + '%'" ></view>

  88. 						</view> -->

  89. 							<view class="progress-cus">

  90. 							<view class="color1" v-if="index==0" :style="'width:'+ item.zxl||0 + '%'" ></view>

  91. 							<view class="color2" v-if="index==1" :style="'width:'+ item.zxl||0 + '%'" ></view>

  92. 							<view class="color3" v-if="index==2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  93. 							<view class="color4" v-if="index>2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  94. 						</view>

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

  96. 					</view>

  97. 				</view>

  98. 				<view v-if="newlisttabinfo3.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">

  99. 					暂无数据

  100. 				</view>

  101. 			</view>

  102. 		</view>

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

  104. 		<view class="single">

  105. 			<view class="title">

  106. 				<view class="title1" style="flex: 1;">录音时长（TOP10）</view>

  107. 			</view>

  108. 			<view class="hejisan">

  109. 				<view class="sanbox1" >

  110. 					<view class="text1-2">{{newlisttabinfo2.total}}</view>

  111. 					<view class="text1-1">合计时长/分钟</view>

  112. 				</view>

  113. 				<view  class="sanbox1">

  114. 					<view class="text1-2">{{newlisttabinfo2.count}}</view>

  115. 					<view class="text1-1">顾问人数</view>

  116. 				</view>

  117. 				<view  class="sanbox1" >

  118. 					<view class="text1-2">{{newlisttabinfo2.avg}}</view>

  119. 					<view class="text1-1">人均录音时长/分钟</view>

  120. 				</view>

  121. 			</view>

  122. 			<view class="jindu" style="margin-top: 20rpx;min-height: 300rpx;">

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

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

  125. 						<view class="jindu-name u-flex" style='width: 170rpx' v-if="item.name">

  126. 							<image v-if="index==0" class="sort-img" src="/static/images/top1.png" mode="" />

  127. 							<image v-if="index==1" class="sort-img" src="/static/images/top2.png" mode="" />

  128. 							<image v-if="index==2" class="sort-img" src="/static/images/top3.png" mode="" />

  129. 							<view class="sort-number" v-if="index>2">{{index+1}}</view>

  130. 							{{item.name.substring(0,4)}}</view>

  131. 						<view class="progress-cus">

  132. 							<view class="color1" v-if="index==0" :style="'width:'+ item.zxl||0 + '%'" ></view>

  133. 							<view class="color2" v-if="index==1" :style="'width:'+ item.zxl||0 + '%'" ></view>

  134. 							<view class="color3" v-if="index==2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  135. 							<view class="color4" v-if="index>2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  136. 						</view>

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

  138. 						<view class="progress-cus">

  139. 							<view class="color" :style="'width:'+ item.zxl||0 + '%'" ></view>

  140. 						</view> -->

  141. 						<view class="jindu-zxl u-line-1">{{item.zxl==null?0:item.zxl}}分钟</view>

  142. 					</view>

  143. 				</view>

  144. 				<view v-if="newlisttabinfo2.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">

  145. 					暂无数据

  146. 				</view>

  147. 			</view>

  148. 		</view>

  149. 

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

  151. 		<view class="single">

  152. 			<view class="title">

  153. 				<view class="title1" style="flex: 1;">违禁次数排名（TOP10）</view>

  154. 			</view>

  155. 			<view class="hejisan">

  156. 				<view class="sanbox1">

  157. 					<view class="text1-2">{{newlisttabinfo4.total}}</view>

  158. 					<view class="text1-1">合计次数</view>

  159. 				</view>

  160. 				<view  class="sanbox1">

  161. 					<view class="text1-2">{{newlisttabinfo4.count}}人</view>

  162. 					<view class="text1-1">顾问人数</view>

  163. 				</view>

  164. 				<view  class="sanbox1">

  165. 					<view class="text1-2">{{newlisttabinfo4.avg}}</view>

  166. 					<view class="text1-1">人均违禁次数</view>

  167. 				</view>

  168. 			</view>

  169. 			<view class="jindu" style="margin-top: 20rpx;min-height: 300rpx">

  170. 				<view v-if="newlisttabinfo4.result.length" class="jindu-box" v-for="(item,index) in newlisttabinfo4.result" :key="index">

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

  172. 						<view class="jindu-name u-flex" style='width: 170rpx' v-if="item.name">

  173. 							<image v-if="index==0" class="sort-img" src="/static/images/top1.png" mode="" />

  174. 							<image v-if="index==1" class="sort-img" src="/static/images/top2.png" mode="" />

  175. 							<image v-if="index==2" class="sort-img" src="/static/images/top3.png" mode="" />

  176. 							<view class="sort-number" v-if="index>2">{{index+1}}</view>

  177. 							{{item.name.substring(0,4)}}</view>

  178. 						<view class="progress-cus">

  179. 							<view class="color1" v-if="index==0" :style="'width:'+ item.zxl||0 + '%'" ></view>

  180. 							<view class="color2" v-if="index==1" :style="'width:'+ item.zxl||0 + '%'" ></view>

  181. 							<view class="color3" v-if="index==2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  182. 							<view class="color4" v-if="index>2" :style="'width:'+ item.zxl||0 + '%'" ></view>

  183. 						</view>

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

  185. 					</view>

  186. 				</view>

  187. 				<view v-if="newlisttabinfo4.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">

  188. 					暂无数据

  189. 				</view>

  190. 			</view>

  191. 		</view>

  192. 

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

  194. 		<view class="single">

  195. 			<view class="title">

  196. 				<view class="title1" style="flex: 1;">接待未标顾问排名（TOP10）</view>

  197. 			</view>

  198. 			<view class="hejisan">

  199. 				<view class="sanbox1" style="width: 35%;">

  200. 					<view class="text1-1">合计</view>

  201. 					<view class="text1-2">{{newlisttabinfo5.total}}次</view>

  202. 				</view>

  203. 				<view class="sanbox1" style="width: 40%;">

  204. 					<view class="text1-1">顾问</view>

  205. 					<view class="text1-2">{{newlisttabinfo5.count}}人</view>

  206. 				</view>

  207. 				<view class="sanbox1" style="width: 25%;">

  208. 					<view class="text1-1">均值</view>

  209. 					<view class="text1-2">{{newlisttabinfo5.avg}}次</view>

  210. 				</view>

  211. 			</view>

  212. 			<view class="jindu" style="height: 360rpx;overflow: auto;">

  213. 				<view v-if="newlisttabinfo5.result.length!=0" class="jindu-box"

  214. 					v-for="(item,index) in newlisttabinfo5.result" :key="index">

  215. 					<view class="jindu-boxche" v-if="item.zxl1 != 0">

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

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

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

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

  220. 						</view>

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

  222. 					</view>

  223. 				</view>

  224. 				<view v-if="newlisttabinfo5.result.length==0" style="width: 100%;text-align: center;margin-top: 60rpx;">

  225. 					暂无数据

  226. 				</view>

  227. 			</view>

  228. 		</view>

  229. 

  230. 

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

  232. 	</view>

  233. </template>

  234. 

  235. <script>

  236. 	var app = getApp();

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

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

  239. 	export default {

  240. 		data() {

  241. 			return {

  242. 				activeTotal: 4,

  243. 				totalTimeShow: false,

  244. 				// 项目id

  245. 				houseId: '',

  246. 				lastEndDate: '',

  247. 				lastStartDate: '',

  248. 				newlisttabinfo1: {

  249. 					avg: '',

  250. 					count: '',

  251. 					total: '',

  252. 					result: [],

  253. 				},

  254. 				newlisttabinfo2: {

  255. 					avg: '',

  256. 					count: '',

  257. 					total: '',

  258. 					result: [],

  259. 				},

  260. 				newlisttabinfo3: {

  261. 					avg: '',

  262. 					count: '',

  263. 					total: '',

  264. 					result: [],

  265. 				},

  266. 				newlisttabinfo4: {

  267. 					avg: '',

  268. 					count: '',

  269. 					total: '',

  270. 					result: [],

  271. 				},

  272. 				newlisttabinfo5: {

  273. 					avg: '',

  274. 					count: '',

  275. 					total: '',

  276. 					result: [],

  277. 				},

  278. 			};

  279. 		},

  280. 		onLoad() {

  281. 			// 获取项目id

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

  283. 			this.init()

  284. 		},

  285. 		onPullDownRefresh() {

  286. 			this.init()

  287. 			setTimeout(function() {

  288. 				uni.stopPullDownRefresh();

  289. 			}, 1000);

  290. 		},

  291. 		methods: {

  292. 			init() {

  293. 				this.newlisttabinfo1 = {

  294. 					avg: '',

  295. 					count: '',

  296. 					total: '',

  297. 					result: [],

  298. 				}

  299. 				this.newlisttabinfo2 = {

  300. 					avg: '',

  301. 					count: '',

  302. 					total: '',

  303. 					result: [],

  304. 				}

  305. 				this.newlisttabinfo3 = {

  306. 					avg: '',

  307. 					count: '',

  308. 					total: '',

  309. 					result: [],

  310. 				}

  311. 				this.newlisttabinfo4 = {

  312. 					avg: '',

  313. 					count: '',

  314. 					total: '',

  315. 					result: [],

  316. 				}

  317. 				this.newlisttabinfo5 = {

  318. 					avg: '',

  319. 					count: '',

  320. 					total: '',

  321. 					result: [],

  322. 				}

  323. 

  324. 				var activeTotal = 0;

  325. 				if (this.activeTotal == 3) {

  326. 					activeTotal = null;

  327. 				} else {

  328. 					activeTotal = this.activeTotal;

  329. 					this.lastEndDate = '';

  330. 					this.lastStartDate = '';

  331. 				}

  332. 				var promse = {

  333. 					timeType: activeTotal,

  334. 					lastStartDate: this.lastStartDate,

  335. 					lastEndDate: this.lastEndDate,

  336. 					houseId: this.houseId

  337. 				}

  338. 				this.staffStatisticsReceptionTop10(promse)

  339. 				this.staffStatisticsRecordingTimTop10(promse)

  340. 				this.staffStatisticsExecutionRateTop10(promse)

  341. 				this.staffStatisticsProhibitedTop10(promse)

  342. 				this.staffStatisticsUnlabeledTop10(promse)

  343. 			},

  344. 			//接待量排名

  345. 			staffStatisticsReceptionTop10(promse) {

  346. 

  347. 				this.$u.post('/cusLvStatistics/staffStatisticsReceptionTop10', promse).then(res => {

  348. 					res.result.forEach(item => {

  349. 						item.zxl = item.data

  350. 						item.name = item.accountName

  351. 					})

  352. 					res.result = this.dealData(res.result)

  353. 					this.newlisttabinfo1 = res;

  354. 				})

  355. 			},

  356. 			//录音时长

  357. 			staffStatisticsRecordingTimTop10(promse) {

  358. 				this.$u.post('/cusLvStatistics/staffStatisticsRecordingTimTop10', promse).then(res => {

  359. 					res.result.forEach(item => {

  360. 						item.zxl = item.data

  361. 						item.name = item.accountName

  362. 					})

  363. 					res.result = this.dealData(res.result)

  364. 					this.newlisttabinfo2 = res;

  365. 				})

  366. 			},

  367. 			//销讲

  368. 			staffStatisticsExecutionRateTop10(promse) {

  369. 				this.$u.post('/cusLvStatistics/staffStatisticsExecutionRateTop10', promse).then(res => {

  370. 					res.result.forEach(item => {

  371. 						item.zxl = item.data;

  372. 						item.zxl1 = item.data;

  373. 						item.name = item.accountName

  374. 					})

  375. 					this.newlisttabinfo3 = res;

  376. 				})

  377. 			},

  378. 			//j禁忌

  379. 			staffStatisticsProhibitedTop10(promse) {

  380. 				this.$u.post('/cusLvStatistics/staffStatisticsProhibitedTop10', promse).then(res => {

  381. 					res.result.forEach(item => {

  382. 						item.zxl = item.data

  383. 						item.name = item.accountName

  384. 					})

  385. 					res.result = this.dealData(res.result)

  386. 					this.newlisttabinfo4 = res;

  387. 				})

  388. 			},

  389. 			//未标记客户数量排名,

  390. 			staffStatisticsUnlabeledTop10(promse) {

  391. 				this.$u.post('/cusLvStatistics/staffStatisticsUnlabeledTop', promse).then(res => {

  392. 					res.result.forEach(item => {

  393. 						item.zxl = item.tagCustomer

  394. 						item.name = item.accountName

  395. 					})

  396. 					res.result = this.dealData(res.result)

  397. 					this.newlisttabinfo5 = res;

  398. 				})

  399. 			},

  400. 

  401. 			//自定义时间

  402. 			totalTimeChange(e) {

  403. 				console.log(e.startDate, e.endDate)

  404. 				this.activeTotal = 3;

  405. 				this.lastEndDate = e.endDate

  406. 				this.lastStartDate = e.startDate

  407. 				this.init()

  408. 			},

  409. 			//时间切换

  410. 			tabtimetap(index) {

  411. 				this.activeTotal = index;

  412. 				if (index == 3) {

  413. 					this.totalTimeShow = true;

  414. 				} else {

  415. 					this.lastEndDate='';

  416. 					this.lastStartDate='';

  417. 					this.init()

  418. 				}

  419. 			},

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

  421. 			dealData(arr) {

  422. 				// 获取最大值

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

  424. 					return o.zxl

  425. 				})) //结果：3

  426. 				// console.log(num)

  427. 				// if(num>100){

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

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

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

  431. 				// 	arr.map(item=>{

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

  433. 				// 	})

  434. 				// 	// console.log(arr)

  435. 				// 	return arr

  436. 				// }else{

  437. 				// 	arr.map(item=>{

  438. 				// 		item.zxl1=item.zxl

  439. 				// 	})

  440. 				// 	return arr

  441. 				// }

  442. 				arr.map(item => {

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

  444. 				})

  445. 				return arr

  446. 

  447. 			},

  448. 		}

  449. 	};

  450. </script>

  451. <style lang="scss" scoped>

  452. 	.box {

  453. 		width: 100%;

  454. 		height: 100%;

  455. 		background: #FAFAFA;

  456. 		padding-bottom: 60rpx;

  457. 	}

  458. 

  459. 	.boxtittab {

  460. 		position: sticky;

  461. 		top: var(--window-top);

  462. 		z-index: 999;

  463. 	}

  464. 

  465. 	.hejisan {

  466. 		width: 92%;

  467. 		margin: 0 auto;

  468. 		display: flex;

  469. 		padding-top: 20rpx;

  470. 

  471. 		padding-bottom:20rpx;

  472. 		.sanbox1{

  473. 			flex: 1;

  474. 			display: flex;

  475. 			flex-direction: column;

  476. 			justify-content: center;

  477. 			align-items: center;

  478. 			position: relative;

  479. 			&::after{

  480. 				position: absolute;

  481. 				content: '';

  482. 				width: 1rpx;

  483. 				height: 86rpx;

  484. 				background: #E0E0E0;

  485. 				right: 0;

  486. 				top: 0;

  487. 			}

  488. 			&:last-child::after {

  489. 				position: absolute;

  490. 				content: '';

  491. 				width: 1rpx;

  492. 				height: 86rpx;

  493. 				right: 0;

  494. 				top: 0;

  495. 				background: #fff;

  496. 			}

  497. 		}

  498. 		.text1-1{

  499. 			font-size: 24rpx;

  500. 			font-family: PingFangSC-Regular, PingFang SC;

  501. 			font-weight: 400;

  502. 			color: #333333;

  503. 			line-height: 32rpx;

  504. 		}

  505. 

  506. 		.text1-2 {

  507. 			color: #333333;

  508. 			font-size: 40rpx;

  509. 			line-height: 46rpx;

  510. 			font-family: PingFangSC-Regular, PingFang SC;

  511. 			margin-bottom: 10rpx;

  512. 		}

  513. 	}

  514. 		.progress-cus{

  515. 

  516. 		}

  517. 		.jindu-name{

  518. 			width: 180rpx;

  519. 			margin-left: 15rpx;

  520. 		}

  521. 		.sort-img{

  522. 			width: 44rpx;

  523. 			height: 44rpx;

  524. 			margin-right: 15rpx;

  525. 		}

  526. 		.sort-number{

  527. 			width: 40rpx;

  528. 			height: 40rpx;

  529. 			background: #E5F0FF;

  530. 			border-radius: 50%;

  531. 			font-size: 24rpx;

  532. 			font-family: PingFangSC-Regular, PingFang SC;

  533. 			font-weight: 400;

  534. 			color: #333333;

  535. 			text-align: center;

  536. 			line-height: 40rpx;

  537. 			margin-right: 15rpx;

  538. 		}

  539. </style>