Acher
/
newEdition
1
0
Bifurcation 0
Code Tickets 0 Demandes d'ajout 0 Versions 0 Wiki Activité
AI销管
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
96 Révisions
13 Branches
9.8 MiB
 
 
 
 
Aborescence: 452832c3a1
Branches Tags
${ item.name }
Créer la branche ${ searchTerm }
de '452832c3a1'
${ noResults }
newEdition/pages/center/Piabodata/Employeesstatistics.vue

594 lignes
19 KiB
Brut Annotations Historique 

  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;">

  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:'+ 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 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;">

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

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

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

  93. 							<view class="color4" v-if="index>2" :style="'width:'+ getPercent1(item.zxl) + '%'" ></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;">

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

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

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

  136. 						</view>

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

  138. 					</view>

  139. 				</view>

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

  141. 					暂无数据

  142. 				</view>

  143. 			</view>

  144. 		</view>

  145. 

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

  147. 		<view class="single">

  148. 			<view class="title">

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

  150. 			</view>

  151. 			<view class="hejisan">

  152. 				<view class="sanbox1">

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

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

  155. 				</view>

  156. 				<view  class="sanbox1">

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

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

  159. 				</view>

  160. 				<view  class="sanbox1">

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

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

  163. 				</view>

  164. 			</view>

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  179. 						</view>

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

  181. 					</view>

  182. 				</view>

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

  184. 					暂无数据

  185. 				</view>

  186. 			</view>

  187. 		</view>

  188. 

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

  190. 		<view class="single">

  191. 			<view class="title">

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

  193. 			</view>

  194. 			<view class="hejisan">

  195. 				<view class="sanbox1">

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

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

  198. 				</view>

  199. 				<view  class="sanbox1">

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

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

  202. 				</view>

  203. 				<view  class="sanbox1">

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

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

  206. 				</view>

  207. 			</view>

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  223. 						</view>

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

  225. 					</view>

  226. 				</view>

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

  228. 					暂无数据

  229. 				</view>

  230. 			</view>

  231. 		</view>

  232. 

  233. 

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

  235. 	</view>

  236. </template>

  237. 

  238. <script>

  239. 	var app = getApp();

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

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

  242. 	export default {

  243. 		data() {

  244. 			return {

  245. 				activeTotal: 4,

  246. 				totalTimeShow: false,

  247. 				// 项目id

  248. 				houseId: '',

  249. 				lastEndDate: '',

  250. 				lastStartDate: '',

  251. 				newlisttabinfo1: {

  252. 					avg: '',

  253. 					count: '',

  254. 					total: '',

  255. 					result: [],

  256. 				},

  257. 				newlisttabinfo2: {

  258. 					avg: '',

  259. 					count: '',

  260. 					total: '',

  261. 					result: [],

  262. 				},

  263. 				newlisttabinfo3: {

  264. 					avg: '',

  265. 					count: '',

  266. 					total: '',

  267. 					result: [],

  268. 				},

  269. 				newlisttabinfo4: {

  270. 					avg: '',

  271. 					count: '',

  272. 					total: '',

  273. 					result: [],

  274. 				},

  275. 				newlisttabinfo5: {

  276. 					avg: '',

  277. 					count: '',

  278. 					total: '',

  279. 					result: [],

  280. 				},

  281. 			};

  282. 		},

  283. 		onLoad() {

  284. 			// 获取项目id

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

  286. 			this.init()

  287. 		},

  288. 		computed: {

  289. 			

  290. 		},

  291. 		onPullDownRefresh(){

  292. 			this.init()

  293. 			setTimeout(function() {

  294. 				uni.stopPullDownRefresh();

  295. 			}, 1000);

  296. 		},

  297. 		methods: {

  298. 			getPercent(num,type) {

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

  300. 					console.log(this.newlisttabinfo1.result)

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

  302. 					let percent = num/(index0.zxl) * 100

  303. 					// console.log(index0.zxl)

  304. 					// console.log(index0)

  305. 					// console.log('num',num)

  306. 					// console.log(percent)

  307. 					// console.log(percent.toFixed(2))

  308. 					return percent.toFixed(2)

  309. 

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

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

  312. 					let percent = num/(index0.zxl) * 100

  313. 					return percent.toFixed(2)

  314. 			

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

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

  317. 					let percent = num/(index0.zxl) * 100

  318. 					return percent.toFixed(2)

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

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

  321. 					let percent = num/(index0.zxl) * 100

  322. 					return percent.toFixed(2)

  323. 				}else{

  324. 					return 0

  325. 				}

  326. 			},

  327. 			getPercent1(num){

  328. 				console.log(num)

  329. 				return num||0

  330. 			},

  331. 			init(){

  332. 				this.newlisttabinfo1={

  333. 					avg:'',

  334. 					count:'',

  335. 					total:'',

  336. 					result:[],

  337. 				},

  338. 				this.newlisttabinfo2={

  339. 					avg:'',

  340. 					count:'',

  341. 					total:'',

  342. 					result:[],

  343. 				},

  344. 				this.newlisttabinfo3={

  345. 					avg:'',

  346. 					count:'',

  347. 					total:'',

  348. 					result:[],

  349. 				},

  350. 				this.newlisttabinfo4={

  351. 					avg:'',

  352. 					count:'',

  353. 					total:'',

  354. 					result:[],

  355. 				}

  356. 				this.newlisttabinfo2 = {

  357. 					avg: '',

  358. 					count: '',

  359. 					total: '',

  360. 					result: [],

  361. 				}

  362. 				this.newlisttabinfo3 = {

  363. 					avg: '',

  364. 					count: '',

  365. 					total: '',

  366. 					result: [],

  367. 				}

  368. 				this.newlisttabinfo4 = {

  369. 					avg: '',

  370. 					count: '',

  371. 					total: '',

  372. 					result: [],

  373. 				}

  374. 				this.newlisttabinfo5 = {

  375. 					avg: '',

  376. 					count: '',

  377. 					total: '',

  378. 					result: [],

  379. 				}

  380. 

  381. 				var activeTotal = 0;

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

  383. 					activeTotal = null;

  384. 				} else {

  385. 					activeTotal = this.activeTotal;

  386. 					this.lastEndDate = '';

  387. 					this.lastStartDate = '';

  388. 				}

  389. 				var promse = {

  390. 					timeType: activeTotal,

  391. 					lastStartDate: this.lastStartDate,

  392. 					lastEndDate: this.lastEndDate,

  393. 					houseId: this.houseId

  394. 				}

  395. 				this.staffStatisticsReceptionTop10(promse)

  396. 				this.staffStatisticsRecordingTimTop10(promse)

  397. 				this.staffStatisticsExecutionRateTop10(promse)

  398. 				this.staffStatisticsProhibitedTop10(promse)

  399. 				this.staffStatisticsUnlabeledTop10(promse)

  400. 			},

  401. 			//接待量排名

  402. 			staffStatisticsReceptionTop10(promse) {

  403. 

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

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

  406. 						item.zxl = item.data

  407. 						item.name = item.accountName

  408. 					})

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

  410. 					this.newlisttabinfo1 = res;

  411. 				})

  412. 			},

  413. 			//录音时长

  414. 			staffStatisticsRecordingTimTop10(promse) {

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

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

  417. 						item.zxl = item.data

  418. 						item.name = item.accountName

  419. 					})

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

  421. 					this.newlisttabinfo2 = res;

  422. 				})

  423. 			},

  424. 			//销讲

  425. 			staffStatisticsExecutionRateTop10(promse) {

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

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

  428. 						item.zxl = item.data;

  429. 						item.zxl1 = item.data;

  430. 						item.name = item.accountName

  431. 					})

  432. 					this.newlisttabinfo3 = res;

  433. 				})

  434. 			},

  435. 			//j禁忌

  436. 			staffStatisticsProhibitedTop10(promse) {

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

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

  439. 						item.zxl = item.data

  440. 						item.name = item.accountName

  441. 					})

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

  443. 					this.newlisttabinfo4 = res;

  444. 				})

  445. 			},

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

  447. 			staffStatisticsUnlabeledTop10(promse) {

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

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

  450. 						item.zxl = item.tagCustomer

  451. 						item.name = item.accountName

  452. 					})

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

  454. 					this.newlisttabinfo5 = res;

  455. 				})

  456. 			},

  457. 

  458. 			//自定义时间

  459. 			totalTimeChange(e) {

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

  461. 				this.activeTotal = 3;

  462. 				this.lastEndDate = e.endDate

  463. 				this.lastStartDate = e.startDate

  464. 				this.init()

  465. 			},

  466. 			//时间切换

  467. 			tabtimetap(index) {

  468. 				this.activeTotal = index;

  469. 				if (index == 3) {

  470. 					this.totalTimeShow = true;

  471. 				} else {

  472. 					this.lastEndDate='';

  473. 					this.lastStartDate='';

  474. 					this.init()

  475. 				}

  476. 			},

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

  478. 			dealData(arr) {

  479. 				// 获取最大值

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

  481. 					return o.zxl

  482. 				})) //结果：3

  483. 				// console.log(num)

  484. 				// if(num>100){

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

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

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

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

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

  490. 				// 	})

  491. 				// 	// console.log(arr)

  492. 				// 	return arr

  493. 				// }else{

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

  495. 				// 		item.zxl1=item.zxl

  496. 				// 	})

  497. 				// 	return arr

  498. 				// }

  499. 				arr.map(item => {

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

  501. 				})

  502. 				return arr

  503. 

  504. 			},

  505. 		}

  506. 	};

  507. </script>

  508. <style lang="scss" scoped>

  509. 	.box {

  510. 		width: 100%;

  511. 		height: 100%;

  512. 		background: #FAFAFA;

  513. 		padding-bottom: 60rpx;

  514. 	}

  515. 

  516. 	.boxtittab {

  517. 		position: sticky;

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

  519. 		z-index: 999;

  520. 	}

  521. 

  522. 	.hejisan {

  523. 		width: 92%;

  524. 		margin: 0 auto;

  525. 		display: flex;

  526. 		padding-top: 20rpx;

  527. 

  528. 		padding-bottom:20rpx;

  529. 		.sanbox1{

  530. 			flex: 1;

  531. 			display: flex;

  532. 			flex-direction: column;

  533. 			justify-content: center;

  534. 			align-items: center;

  535. 			position: relative;

  536. 			&::after{

  537. 				position: absolute;

  538. 				content: '';

  539. 				width: 1rpx;

  540. 				height: 86rpx;

  541. 				background: #E0E0E0;

  542. 				right: 0;

  543. 				top: 0;

  544. 			}

  545. 			&:last-child::after {

  546. 				position: absolute;

  547. 				content: '';

  548. 				width: 1rpx;

  549. 				height: 86rpx;

  550. 				right: 0;

  551. 				top: 0;

  552. 				background: #fff;

  553. 			}

  554. 		}

  555. 		.text1-1{

  556. 			font-size: 24rpx;

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

  558. 			font-weight: 400;

  559. 			color: #333333;

  560. 			line-height: 32rpx;

  561. 		}

  562. 

  563. 		.text1-2 {

  564. 			color: #333333;

  565. 			font-size: 40rpx;

  566. 			line-height: 46rpx;

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

  568. 			margin-bottom: 10rpx;

  569. 		}

  570. 	}

  571. 		.jindu-name{

  572. 			width: 180rpx;

  573. 			margin-left: 15rpx;

  574. 		}

  575. 		.sort-img{

  576. 			width: 44rpx;

  577. 			height: 44rpx;

  578. 			margin-right: 15rpx;

  579. 		}

  580. 		.sort-number{

  581. 			width: 40rpx;

  582. 			height: 40rpx;

  583. 			background: #E5F0FF;

  584. 			border-radius: 50%;

  585. 			font-size: 24rpx;

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

  587. 			font-weight: 400;

  588. 			color: #333333;

  589. 			text-align: center;

  590. 			line-height: 40rpx;

  591. 			margin-right: 15rpx;

  592. 		}

  593. </style>