Acher
/
newEdition
1
0
Fork 0
Code Issues 0 Pull-Requests 0 Releases 0 Wiki Aktivität
AI销管
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.
193 Commits
13 Branches
9.8 MiB
 
 
 
 
Struktur: 183d42f844
Branches Tags
${ item.name }
Erstelle Branch ${ searchTerm }
von „183d42f844“
${ noResults }
newEdition/pages/center/Piabodata/Employeesstatistics.vue

684 Zeilen
20 KiB
Originalformat Blame Verlauf 

  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. 		<!-- 销讲业务 -->

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

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

  15. 

  16. 		<view class="single">

  17. 			<view class="title">

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

  19. 			</view>

  20. 			<view class="hejisan">

  21. 				<view class="sanbox1">

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

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

  24. 				</view>

  25. 				<view class="sanbox1">

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

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

  28. 				</view>

  29. 				<view class="sanbox1">

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

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

  32. 				</view>

  33. 			</view>

  34. 

  35. 			<view class="jindu" style="margin-top: 20rpx;">

  36. 				<view v-if="newlisttabinfo1.result.length" class="jindu-box"

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

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

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

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

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

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

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

  44. 							{{item.name.substring(0,4)}}

  45. 						</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:'+ getPercent(item.zxl,1) + '%'"></view>

  49. 							<view class="color3" v-if="index==2" :style="'width:'+ getPercent(item.zxl,1) + '%'"></view>

  50. 							<view class="color4" v-if="index>2" :style="'width:'+ getPercent(item.zxl,1) + '%'"></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 class="single">

  62. 			<view class="title">

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

  64. 			</view>

  65. 			<view class="hejisan">

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

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

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

  69. 				</view>

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

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

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

  73. 				</view>

  74. 			</view>

  75. 			<view class="jindu" style="margin-top: 20rpx;">

  76. 				<view v-if="newlisttabinfo3.result.length" class="jindu-box"

  77. 					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)}}

  85. 						</view>

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

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

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

  89. 						</view> -->

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

  91. 							<view class="color1" v-if="index==0" :style="'width:'+ getPercent1(item.zxl) + '%'"></view>

  92. 							<view class="color2" v-if="index==1" :style="'width:'+ getPercent1(item.zxl) + '%'"></view>

  93. 							<view class="color3" v-if="index==2" :style="'width:'+ getPercent1(item.zxl) + '%'"></view>

  94. 							<view class="color4" v-if="index>2" :style="'width:'+ getPercent1(item.zxl) + '%'"></view>

  95. 						</view>

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

  97. 					</view>

  98. 				</view>

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

  100. 					暂无数据

  101. 				</view>

  102. 			</view>

  103. 		</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;">

  123. 				<view v-if="newlisttabinfo2.result.length" class="jindu-box"

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

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

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

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

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

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

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

  131. 							{{item.name.substring(0,4)}}

  132. 						</view>

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

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

  135. 							<view class="color2" v-if="index==1" :style="'width:'+ getPercent(item.zxl,2)+ '%'"></view>

  136. 							<view class="color3" v-if="index==2" :style="'width:'+ getPercent(item.zxl,2)+ '%'"></view>

  137. 							<view class="color4" v-if="index>2" :style="'width:'+ getPercent(item.zxl,2)+ '%'"></view>

  138. 						</view>

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

  140. 					</view>

  141. 				</view>

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

  143. 					暂无数据

  144. 				</view>

  145. 			</view>

  146. 		</view>

  147. 

  148. 		<view class="single">

  149. 			<view class="title">

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

  151. 			</view>

  152. 			<view class="hejisan">

  153. 				<view class="sanbox1">

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

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

  156. 				</view>

  157. 				<view class="sanbox1">

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

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

  160. 				</view>

  161. 				<view class="sanbox1">

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

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

  164. 				</view>

  165. 			</view>

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

  167. 				<view v-if="newlisttabinfo4.result.length" class="jindu-box"

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

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

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

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

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

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

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

  175. 							{{item.name.substring(0,4)}}

  176. 						</view>

  177. 

  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:'+ getPercent(item.zxl,4)+ '%'"></view>

  181. 							<view class="color3" v-if="index==2" :style="'width:'+ getPercent(item.zxl,4) + '%'"></view>

  182. 							<view class="color4" v-if="index>2" :style="'width:'+ getPercent(item.zxl,4)+ '%'"></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 class="single">

  194. 			<view class="title">

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

  196. 			</view>

  197. 			<view class="hejisan">

  198. 				<view class="sanbox1">

  199. 					<view class="text1-2">{{newlisttabinfo5.total||0}}</view>

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

  201. 				</view>

  202. 				<view class="sanbox1">

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

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

  205. 				</view>

  206. 				<view class="sanbox1">

  207. 					<view class="text1-2">{{newlisttabinfo5.avg||0}}</view>

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

  209. 				</view>

  210. 			</view>

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

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

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

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

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

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

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

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

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

  220. 							{{item.name.substring(0,4)}}

  221. 						</view>

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

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

  224. 							<view class="color2" v-if="index==1" :style="'width:'+ getPercent(item.zxl,5)+ '%'"></view>

  225. 							<view class="color3" v-if="index==2" :style="'width:'+ getPercent(item.zxl,5) + '%'"></view>

  226. 							<view class="color4" v-if="index>2" :style="'width:'+ getPercent(item.zxl,5)+ '%'"></view>

  227. 						</view>

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

  229. 					</view>

  230. 				</view>

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

  232. 					暂无数据

  233. 				</view>

  234. 			</view>

  235. 		</view>

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

  237. 

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

  239. 		<u-loadings v-model="LOADING"></u-loadings>

  240. 

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

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

  243. 			<view class="screen">

  244. 				<view class="boxtittab">

  245. 					<view class="tabbox">

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

  247. 					</view>

  248. 					<view class="tabbox">

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

  250. 					</view>

  251. 					<view class="tabbox">

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

  253. 					</view>

  254. 					<view class="tabbox">

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

  256. 					</view>

  257. 				</view>

  258. 			</view>

  259. 		</u-popup>

  260. 	</view>

  261. </template>

  262. 

  263. <script>

  264. 	var app = getApp();

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

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

  267. 	export default {

  268. 		data() {

  269. 			return {

  270. 				activeTotal: 4,

  271. 				totalTimeShow: false,

  272. 				// 项目id

  273. 				houseId: '',

  274. 				lastEndDate: '',

  275. 				lastStartDate: '',

  276. 				newlisttabinfo1: {

  277. 					avg: '',

  278. 					count: '',

  279. 					total: '',

  280. 					result: [],

  281. 				},

  282. 				newlisttabinfo2: {

  283. 					avg: '',

  284. 					count: '',

  285. 					total: '',

  286. 					result: [],

  287. 				},

  288. 				newlisttabinfo3: {

  289. 					avg: '',

  290. 					count: '',

  291. 					total: '',

  292. 					result: [],

  293. 				},

  294. 				newlisttabinfo4: {

  295. 					avg: '',

  296. 					count: '',

  297. 					total: '',

  298. 					result: [],

  299. 				},

  300. 				newlisttabinfo5: {

  301. 					avg: '',

  302. 					count: '',

  303. 					total: '',

  304. 					result: [],

  305. 				},

  306. 

  307. 

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

  309. 				showTimeText: '近一周', // 展示文字

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

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

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

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

  314. 			};

  315. 		},

  316. 		onLoad() {

  317. 			this.LOADING = true

  318. 			// 获取项目id

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

  320. 			this.init()

  321. 			this.getMarketingBusiness()

  322. 		},

  323. 		computed: {

  324. 

  325. 		},

  326. 		onPullDownRefresh() {

  327. 			this.init()

  328. 			setTimeout(function() {

  329. 				uni.stopPullDownRefresh();

  330. 			}, 1000);

  331. 		},

  332. 		methods: { // 销讲业务方法

  333. 			templateCancel() {

  334. 				this.showTemplate = false;

  335. 			},

  336. 

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

  338. 			templateConfirm(e) {

  339. 				this.showTemplate = false;

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

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

  342. 				this.init()

  343. 			},

  344. 

  345. 

  346. 			// 获取销讲业务

  347. 			getMarketingBusiness() {

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

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

  350. 				}).then(res => {

  351. 					this.templateList = res

  352. 					this.templateList.unshift({

  353. 						templateName: '全部业务',

  354. 						id: ''

  355. 					})

  356. 				})

  357. 			},

  358. 

  359. 			getPercent(num, type) {

  360. 				if (this.newlisttabinfo1.result && this.newlisttabinfo1.result.length && type == 1) {

  361. 					let index0 = this.newlisttabinfo1.result[0]

  362. 					let percent = num / (index0.zxl == 0 ? 1 : index0.zxl) * 100

  363. 					return percent.toFixed(2)

  364. 

  365. 				} else if (this.newlisttabinfo2.result && this.newlisttabinfo2.result.length && type == 2) {

  366. 					let index0 = this.newlisttabinfo2.result[0]

  367. 					let percent = num / (index0.zxl == 0 ? 1 : index0.zxl) * 100

  368. 					return percent.toFixed(2)

  369. 

  370. 				} else if (this.newlisttabinfo4.result && this.newlisttabinfo4.result.length && type == 4) {

  371. 					let index0 = this.newlisttabinfo4.result[0]

  372. 					let percent = num / (index0.zxl == 0 ? 1 : index0.zxl) * 100

  373. 					return percent.toFixed(2)

  374. 				} else if (this.newlisttabinfo5.result && this.newlisttabinfo5.result.length && type == 5) {

  375. 					let index0 = this.newlisttabinfo5.result[0]

  376. 					let percent = num / (index0.zxl == 0 ? 1 : index0.zxl) * 100

  377. 					return percent.toFixed(2)

  378. 				} else {

  379. 					return 0

  380. 				}

  381. 			},

  382. 			getPercent1(num) {

  383. 				return num || 0

  384. 			},

  385. 			init() {

  386. 				this.newlisttabinfo1 = {

  387. 						avg: '',

  388. 						count: '',

  389. 						total: '',

  390. 						result: [],

  391. 					},

  392. 					this.newlisttabinfo2 = {

  393. 						avg: '',

  394. 						count: '',

  395. 						total: '',

  396. 						result: [],

  397. 					},

  398. 					this.newlisttabinfo3 = {

  399. 						avg: '',

  400. 						count: '',

  401. 						total: '',

  402. 						result: [],

  403. 					},

  404. 					this.newlisttabinfo4 = {

  405. 						avg: '',

  406. 						count: '',

  407. 						total: '',

  408. 						result: [],

  409. 					}

  410. 				this.newlisttabinfo2 = {

  411. 					avg: '',

  412. 					count: '',

  413. 					total: '',

  414. 					result: [],

  415. 				}

  416. 				this.newlisttabinfo3 = {

  417. 					avg: '',

  418. 					count: '',

  419. 					total: '',

  420. 					result: [],

  421. 				}

  422. 				this.newlisttabinfo4 = {

  423. 					avg: '',

  424. 					count: '',

  425. 					total: '',

  426. 					result: [],

  427. 				}

  428. 				this.newlisttabinfo5 = {

  429. 					avg: '',

  430. 					count: '',

  431. 					total: '',

  432. 					result: [],

  433. 				}

  434. 

  435. 				var activeTotal = 0;

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

  437. 					activeTotal = null;

  438. 				} else {

  439. 					activeTotal = this.activeTotal;

  440. 					this.lastEndDate = '';

  441. 					this.lastStartDate = '';

  442. 				}

  443. 				var promse = {

  444. 					timeType: activeTotal,

  445. 					lastStartDate: this.lastStartDate,

  446. 					lastEndDate: this.lastEndDate,

  447. 					houseId: this.houseId

  448. 				}

  449. 				this.staffStatisticsReceptionTop10(promse)

  450. 				this.staffStatisticsRecordingTimTop10(promse)

  451. 				this.staffStatisticsExecutionRateTop10(promse)

  452. 				this.staffStatisticsProhibitedTop10(promse)

  453. 				this.staffStatisticsUnlabeledTop10(promse)

  454. 			},

  455. 			//接待量排名

  456. 			staffStatisticsReceptionTop10(promse) {

  457. 

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

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

  460. 						item.zxl = item.data

  461. 						item.name = item.accountName

  462. 					})

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

  464. 					this.newlisttabinfo1 = res;

  465. 				})

  466. 			},

  467. 			//录音时长

  468. 			staffStatisticsRecordingTimTop10(promse) {

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

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

  471. 						item.zxl = item.data

  472. 						item.name = item.accountName

  473. 					})

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

  475. 					this.newlisttabinfo2 = res;

  476. 				})

  477. 			},

  478. 			//销讲

  479. 			staffStatisticsExecutionRateTop10(promse) {

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

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

  482. 						item.zxl = item.data;

  483. 						item.zxl1 = item.data;

  484. 						item.name = item.accountName

  485. 					})

  486. 					this.newlisttabinfo3 = res;

  487. 				})

  488. 			},

  489. 			//j禁忌

  490. 			staffStatisticsProhibitedTop10(promse) {

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

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

  493. 						item.zxl = item.data

  494. 						item.name = item.accountName

  495. 					})

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

  497. 					this.newlisttabinfo4 = res;

  498. 				})

  499. 			},

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

  501. 			staffStatisticsUnlabeledTop10(promse) {

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

  503. 					this.LOADING = false

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

  505. 						item.zxl = item.tagCustomer

  506. 						item.name = item.accountName

  507. 					})

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

  509. 					this.newlisttabinfo5 = res;

  510. 				}).catch(e => {

  511. 					this.LOADING = false

  512. 				})

  513. 			},

  514. 

  515. 			//自定义时间

  516. 			totalTimeChange(e) {

  517. 				this.screenShow = false

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

  519. 				this.activeTotal = 3;

  520. 				this.lastEndDate = e.endDate

  521. 				this.lastStartDate = e.startDate

  522. 				this.init()

  523. 			},

  524. 			//时间切换

  525. 			tabtimetap(index, text) {

  526. 				if (index == 3) {

  527. 					this.totalTimeShow = true;

  528. 					this.screenShow = false

  529. 				} else {

  530. 					this.screenShow = false

  531. 					this.showTimeText = text

  532. 					this.activeTotal = index;

  533. 					this.lastEndDate = '';

  534. 					this.lastStartDate = '';

  535. 					this.init()

  536. 				}

  537. 			},

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

  539. 			dealData(arr) {

  540. 				// 获取最大值

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

  542. 					return o.zxl

  543. 				})) //结果：3

  544. 				arr.map(item => {

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

  546. 				})

  547. 				return arr

  548. 

  549. 			},

  550. 		}

  551. 	};

  552. </script>

  553. <style lang="scss" scoped>

  554. 	.boxtittabs {

  555. 		width: 100%;

  556. 		height: 92rpx;

  557. 		background: #FFFFFF;

  558. 		display: flex;

  559. 		align-items: center;

  560. 

  561. 		.items {

  562. 			padding: 0 24rpx;

  563. 			width: 50%;

  564. 			height: 100%;

  565. 			display: flex;

  566. 			align-items: center;

  567. 			justify-content: center;

  568. 			overflow: hidden;

  569. 			white-space: nowrap;

  570. 			text-overflow: ellipsis;

  571. 		}

  572. 	}

  573. 

  574. 	.screen {

  575. 		width: 100%;

  576. 

  577. 		.boxtittab {

  578. 			width: 100%;

  579. 			flex-direction: column;

  580. 			border: none;

  581. 

  582. 			.tabbox {

  583. 				width: 100%;

  584. 			}

  585. 		}

  586. 	}

  587. 

  588. 	.box {

  589. 		width: 100%;

  590. 		height: 100%;

  591. 		background: #FAFAFA;

  592. 	}

  593. 

  594. 	.single {

  595. 		padding-bottom: 20rpx;

  596. 		margin-top: 20rpx;

  597. 	}

  598. 

  599. 	.boxtittab {

  600. 		position: sticky;

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

  602. 		z-index: 999;

  603. 	}

  604. 

  605. 	.hejisan {

  606. 		width: 92%;

  607. 		margin: 0 auto;

  608. 		display: flex;

  609. 		padding-top: 20rpx;

  610. 

  611. 		padding-bottom: 20rpx;

  612. 

  613. 		.sanbox1 {

  614. 			flex: 1;

  615. 			display: flex;

  616. 			flex-direction: column;

  617. 			justify-content: center;

  618. 			align-items: center;

  619. 			position: relative;

  620. 

  621. 			&::after {

  622. 				position: absolute;

  623. 				content: '';

  624. 				width: 1rpx;

  625. 				height: 86rpx;

  626. 				background: #E0E0E0;

  627. 				right: 0;

  628. 				top: 0;

  629. 			}

  630. 

  631. 			&:last-child::after {

  632. 				position: absolute;

  633. 				content: '';

  634. 				width: 1rpx;

  635. 				height: 86rpx;

  636. 				right: 0;

  637. 				top: 0;

  638. 				background: #fff;

  639. 			}

  640. 		}

  641. 

  642. 		.text1-1 {

  643. 			font-size: 24rpx;

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

  645. 			font-weight: 400;

  646. 			color: #333333;

  647. 			line-height: 32rpx;

  648. 		}

  649. 

  650. 		.text1-2 {

  651. 			color: #333333;

  652. 			font-size: 40rpx;

  653. 			line-height: 46rpx;

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

  655. 			margin-bottom: 10rpx;

  656. 		}

  657. 	}

  658. 

  659. 	.jindu-name {

  660. 		width: 180rpx;

  661. 		margin-left: 15rpx;

  662. 	}

  663. 

  664. 	.sort-img {

  665. 		width: 44rpx;

  666. 		height: 44rpx;

  667. 		margin-right: 15rpx;

  668. 	}

  669. 

  670. 	.sort-number {

  671. 		width: 40rpx;

  672. 		height: 40rpx;

  673. 		background: #E5F0FF;

  674. 		border-radius: 50%;

  675. 		font-size: 24rpx;

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

  677. 		font-weight: 400;

  678. 		color: #333333;

  679. 		text-align: center;

  680. 		line-height: 40rpx;

  681. 		margin-right: 15rpx;

  682. 	}

  683. </style>