liumin
/
NewZkgj
1
0
Çatalla 0
Kod Konular 0 Değişiklik İstekleri 0 Sürümler 0 Wiki Aktivite
25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.
53 İşleme
7 Dallar
28 MiB
 
 
 
Ağaç: 59b3def0bc
Dallar Biçim İmleri
${ item.name }
${ searchTerm } dalı oluştur
'59b3def0bc'den
${ noResults }
NewZkgj/pages/index/index.vue

663 satır
17 KiB
Ham Suçlama Geçmiş 

  1. <template>

  2. 	<view class="cented-box">

  3. 		<view class="Switchingbox">

  4. 			<view class="Switching1">

  5. 				<image class="Switching1-img" src="../../static/images/building.png" mode=""></image>

  6. 			</view>

  7. 			<view class="Switching2">楼盘：</view>

  8. 			<view class="Switching3">{{buildingname}}</view>

  9. 			<view class="Switching4" v-if="buildingishow" @click="piskbuilding()">切换楼盘</view>

  10. 		</view>

  11. 

  12. 		<view class="title" style="margin-top: 30rpx;" v-if="Myworkcard">我的工牌</view>

  13. 		<view v-if="Myworkcard">

  14. 			<view class="Workcard" v-if="Whetheroffline==true">

  15. 				<view class="Workcard-box">

  16. 					<view class="Workcardimg">

  17. 						<view class="Workcardimg1">

  18. 							<view v-if="percentage>20" class="bar" :style="{width : percentage + '%' }"></view>

  19. 							<view v-if="percentage<20" class="bar1" :style="{width : percentage + '%' }"></view>

  20. 						</view>

  21. 					</view>

  22. 					<view class="Workcardtext">电量：{{percentage}}%</view>

  23. 				</view>

  24. 				<view class="Workcard-box">

  25. 					<view class="Workcardimg">

  26. 						<image v-if="signalDevice==''" class="Workcardimg2" src="../../static/images/signal0.png"

  27. 							mode=""></image>

  28. 						<image v-else-if="signalDevice<20 && signalDevice>0" class="Workcardimg2"

  29. 							src="../../static/images/signal1.png" mode=""></image>

  30. 						<image v-else-if="signalDevice<50 && signalDevice>20" class="Workcardimg2"

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

  32. 						<image v-else-if="signalDevice<70 && signalDevice>50" class="Workcardimg2"

  33. 							src="../../static/images/signal3.png" mode=""></image>

  34. 						<image v-else-if="signalDevice<90 && signalDevice>70" class="Workcardimg2"

  35. 							src="../../static/images/signal4.png" mode=""></image>

  36. 						<image v-else-if="signalDevice<=100 && signalDevice>90" class="Workcardimg2"

  37. 							src="../../static/images/signal5.png" mode=""></image>

  38. 					</view>

  39. 					<view class="Workcardtext">信号：{{signalDevicetext}}</view>

  40. 				</view>

  41. 				<view class="Workcard-box">

  42. 					<view class="Workcardimg">

  43. 						<image v-if="audioStatus=='true'" class="Workcardimg3"

  44. 							src="../../static/images/Thtapedrive1.png" mode=""></image>

  45. 						<image v-if="audioStatus=='false'" class="Workcardimg3"

  46. 							src="../../static/images/Thtapedrive2.png" mode=""></image>

  47. 					</view>

  48. 					<view v-if="audioStatus=='true'" class="Workcardtext">录音：已开启</view>

  49. 					<view v-if="audioStatus=='false'" class="Workcardtext">录音：未开启</view>

  50. 				</view>

  51. 			</view>

  52. 			<view class="Workcard" v-if="Whetheroffline==false">

  53. 				<view class="Workcard-box">

  54. 					<view class="Workcardimg">

  55. 						<image class="Workcardimg4" src="../../static/images/offline.png" mode=""></image>

  56. 					</view>

  57. 					<view class="Workcardtext">设备离线</view>

  58. 				</view>

  59. 			</view>

  60. 		</view>

  61. 

  62. 		<view class="title" v-if="equipmentisshow">设备</view>

  63. 		<view class="shebenbox" v-if="equipmentisshow">

  64. 			<view class="shebenche">

  65. 				<view class="shebenchenum">{{equipmentobj.totalNum || 0}}</view>

  66. 				<view class="shebenchetext">设备总数</view>

  67. 			</view>

  68. 			<view class="shebenche">

  69. 				<view class="shebenchenum">{{equipmentobj.onlineNum || 0}}</view>

  70. 				<view class="shebenchetext">在线</view>

  71. 			</view>

  72. 			<view class="shebenche">

  73. 				<view class="shebenchenum">{{equipmentobj.activeNum || 0}}</view>

  74. 				<view class="shebenchetext">活跃</view>

  75. 			</view>

  76. 			<view class="shebenche">

  77. 				<view class="shebenchenum" style="color: red;">{{equipmentobj.lowPowerNum || 0}}</view>

  78. 				<view class="shebenchetext">急需充电</view>

  79. 			</view>

  80. 		</view>

  81. 

  82. 

  83. 

  84. 		<view class="title">实时统计</view>

  85. 		<view class="real-timebox">

  86. 			<view class="timebox">

  87. 				<view class="real">

  88. 					<view class="realnum">{{realtimeobj.receptionCount || 0}}</view>

  89. 					<view class="realtext">接待量</view>

  90. 				</view>

  91. 				<view class="real">

  92. 					<view class="realnum">{{realtimeobj.receivingCustomer || 0}}</view>

  93. 					<view class="realtext">正在接待</view>

  94. 				</view>

  95. 				<view class="real">

  96. 					<view class="realnum">{{realtimeobj.sumCustomer|| 0}}</view>

  97. 					<view class="realtext">接待客户</view>

  98. 				</view>

  99. 				<view class="real">

  100. 					<view class="realnum">{{realtimeobj.sumDuration || 0}}</view>

  101. 					<view class="realtext">录音时长</view>

  102. 				</view>

  103. 			</view>

  104. 			<view class="timebox">

  105. 				<view class="real">

  106. 					<view class="realnum">{{realtimeobj.tagCustomer || 0}}</view>

  107. 					<view class="realtext">未标顾问</view>

  108. 				</view>

  109. 				<view class="real">

  110. 					<view class="realnum">{{realtimeobj.fraction || 0}}</view>

  111. 					<view class="realtext">平均执行率</view>

  112. 				</view>

  113. 				<view class="real">

  114. 					<!-- <view class="realnum">{{realtimeobj.fraction || 0}}</view>

  115. 					<view class="realtext">平均得分</view> -->

  116. 				</view>

  117. 				<view class="real">

  118. 					<!-- <view class="realnum" style="color: red;">44</view>

  119. 					<view class="realtext">违禁提醒</view> -->

  120. 				</view>

  121. 			</view>

  122. 		</view>

  123. 

  124. 		<view class="title">本周工作</view>

  125. 		<view class="real-timebox">

  126. 			<view class="timebox">

  127. 				<view class="real">

  128. 					<view class="realnum">{{Thisweekobj.receptionCount || 0}}</view>

  129. 					<view class="realtext">接待量</view>

  130. 				</view>

  131. 				<view class="real">

  132. 					<view class="realnum">{{Thisweekobj.sumCustomer  || 0}}</view>

  133. 					<view class="realtext">接待客户</view>

  134. 				</view>

  135. 				<view class="real">

  136. 					<view class="realnum">{{Thisweekobj.sumDuration  || 0}}</view>

  137. 					<view class="realtext">录音时长</view>

  138. 				</view>

  139. 			</view>

  140. 			<view class="timebox">

  141. 

  142. 				<view class="real">

  143. 					<view class="realnum">{{Thisweekobj.fraction  || 0}}</view>

  144. 					<view class="realtext">平均执行率</view>

  145. 				</view>

  146. 				<view class="real">

  147. 					<!-- <view class="realnum">{{Thisweekobj.fraction  || 0}}</view>

  148. 					<view class="realtext">平均得分</view> -->

  149. 				</view>

  150. 				<view class="real">

  151. 					<!-- <view class="realnum">44</view>

  152. 					<view class="realtext">违禁预警</view> -->

  153. 				</view>

  154. 			</view>

  155. 		</view>

  156. 

  157. 		<view class="title">常用功能</view>

  158. 		<view class="commonly-box">

  159. 			<view class="commonly" @click="Piabodata(item.name)" v-for="(item,index) in Menulist" :key='index'>

  160. 				<view class="commonly-img">

  161. 					<image v-if="item.name=='客户管理'" class="commonly-img1" src="../../static/images/function1.png"

  162. 						mode=""></image>

  163. 					<image v-if="item.name=='接待记录'" class="commonly-img1" src="../../static/images/function2.png"

  164. 						mode=""></image>

  165. 					<image v-if="item.name=='销讲数据'" class="commonly-img1" src="../../static/images/function4.png"

  166. 						mode=""></image>

  167. 					<image v-if="item.name=='设备管理'" class="commonly-img1" src="../../static/images/function5.png"

  168. 						mode=""></image>

  169. 					<image v-if="item.name=='值班顾问'" class="commonly-img1" src="../../static/images/function6.png"

  170. 						mode=""></image>

  171. 				</view>

  172. 				<view class="commonly-text">{{item.name}}</view>

  173. 			</view>

  174. 		</view>

  175. 

  176. 

  177. 		<!-- 楼盘切换 -->

  178. 		<view v-if="Showhiddenunits">

  179. 			<u-select :mask-close-able="false" v-model="Showhiddenunits" mode="single-column" :list="lpanlist"

  180. 				@cancel="cancel" @confirm="confirm"></u-select>

  181. 		</view>

  182. 	</view>

  183. </template>

  184. 

  185. <script>

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

  187. 	export default {

  188. 		data() {

  189. 			return {

  190. 				userInfo: {},

  191. 				Showhiddenunits: false,

  192. 				lpanlist: [], //楼盘列表

  193. 				buildingname: '', //楼盘名

  194. 				buildingID: '', //楼盘id

  195. 				buildingishow: false, //是否选择楼盘

  196. 				Myworkcard: false,

  197. 				percentage: '', //设备电量

  198. 				Whetheroffline: false, //是否离线

  199. 				signalDevice: 0, //信号

  200. 				signalDevicetext: "",

  201. 				audioStatus: false,

  202. 				equipmentisshow: false,

  203. 				equipmentobj: {

  204. 					totalNum: '',

  205. 					onlineNum: '',

  206. 					activeNum: '',

  207. 					lowPowerNum: '',

  208. 				},

  209. 				Menulist: [],

  210. 				realtimeobj: {

  211. 					sumCustomer: '',

  212. 					receivingCustomer: '',

  213. 					activeCustomer: '',

  214. 					sumDuration: '',

  215. 					tagCustomer: '',

  216. 					fraction: '',

  217. 					receptionCount:''

  218. 				},

  219. 				Thisweekobj: {

  220. 					sumCustomer: '',

  221. 					receivingCustomer: '',

  222. 					activeCustomer: '',

  223. 					sumDuration: '',

  224. 					tagCustomer: '',

  225. 					fraction: '',

  226. 					receptionCount:''

  227. 				}

  228. 			};

  229. 		},

  230. 		components: {},

  231. 		onShow() {

  232. 			this.userInfo = uni.getStorageSync('weapp_session_userInfo_data');

  233. 			this.Menulist = uni.getStorageSync('weapp_session_Menu_data');

  234. 			if (this.userInfo.zkProperties.length == 1) {

  235. 				this.buildingID = uni.getStorageSync('buildingID').id;

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

  237. 				this.buildingishow = false;

  238. 			} else {

  239. 				this.buildingishow = true;

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

  241. 				this.buildingID = uni.getStorageSync('buildingID').id;

  242. 				this.userInfo.zkProperties.forEach(item => {

  243. 					item.label = item.propertyName;

  244. 					item.value = item.id

  245. 				})

  246. 				this.lpanlist = this.userInfo.zkProperties

  247. 			}

  248. 			if (this.userInfo.dataCode == 6) {

  249. 				this.Myworkcard = true;

  250. 				this.equipmentisshow = false;

  251. 				this.iniodianloang()

  252. 			} else {

  253. 				this.equipmentisshow = true;

  254. 				this.Myworkcard = false;

  255. 				this.initequipment()

  256. 			}

  257. 			this.initworkThisWeek()

  258. 			this.initrealTimeStatistics()

  259. 		},

  260. 		methods: {

  261. 			initworkThisWeek() {

  262. 				uni.request({

  263. 					url: config.service.workThisWeek,

  264. 					method: "POST",

  265. 					header: {

  266. 						'content-type': 'application/json',

  267. 						'Access-Token': uni.getStorageSync('weapp_session_login_data').token

  268. 					},

  269. 					data: {

  270. 						houseId: this.buildingID

  271. 					},

  272. 					success: (data) => {

  273. 						if (data.data.data == null) {

  274. 							return

  275. 						} else {

  276. 							this.Thisweekobj = {

  277. 								sumCustomer: data.data.data.sumCustomer,

  278. 								receivingCustomer: data.data.data.receivingCustomer,

  279. 								activeCustomer: data.data.data.activeCustomer,

  280. 								sumDuration: Math.floor(data.data.data.sumDuration),

  281. 								tagCustomer: data.data.data.tagCustomer,

  282. 								fraction: data.data.data.fraction,

  283. 								receptionCount:data.data.data.receptionCount

  284. 							}

  285. 						}

  286. 					}

  287. 				})

  288. 			},

  289. 			//实时统计

  290. 			initrealTimeStatistics() {

  291. 				uni.request({

  292. 					url: config.service.realTimeStatistics,

  293. 					method: "POST",

  294. 					header: {

  295. 						'content-type': 'application/json',

  296. 						'Access-Token': uni.getStorageSync('weapp_session_login_data').token

  297. 					},

  298. 					data: {

  299. 						houseId: this.buildingID

  300. 					},

  301. 					success: (data) => {

  302. 						if (data.data.data == null) {

  303. 							return

  304. 						} else {

  305. 							this.realtimeobj = {

  306. 								sumCustomer: data.data.data.sumCustomer,

  307. 								receivingCustomer: data.data.data.receivingCustomer,

  308. 								activeCustomer: data.data.data.activeCustomer,

  309. 								sumDuration:Math.floor(data.data.data.sumDuration/60) || 0,

  310. 								tagCustomer: data.data.data.tagCustomer,

  311. 								fraction: data.data.data.fraction,

  312. 								receptionCount:data.data.data.receptionCount

  313. 							}

  314. 						}

  315. 					}

  316. 				})

  317. 			},

  318. 			

  319. 			//设备

  320. 			initequipment() {

  321. 				uni.request({

  322. 					url: config.service.findEquipmentState,

  323. 					method: "POST",

  324. 					header: {

  325. 						'content-type': 'application/json',

  326. 						'Access-Token': uni.getStorageSync('weapp_session_login_data').token

  327. 					},

  328. 					data: {

  329. 						propertyId: this.buildingID

  330. 					},

  331. 					success: (data) => {

  332. 						if (data.data.data == null) {

  333. 							return

  334. 						} else {

  335. 							this.equipmentobj = {

  336. 								totalNum: data.data.data.totalNum,

  337. 								onlineNum: data.data.data.onlineNum,

  338. 								activeNum: data.data.data.activeNum,

  339. 								lowPowerNum: data.data.data.lowPowerNum,

  340. 							}

  341. 						}

  342. 					}

  343. 				})

  344. 			},

  345. 			//我的工牌

  346. 			iniodianloang() {

  347. 				uni.request({

  348. 					url: config.service.findElectricity,

  349. 					method: "POST",

  350. 					header: {

  351. 						'content-type': 'application/json',

  352. 						'Access-Token': uni.getStorageSync('weapp_session_login_data').token

  353. 					},

  354. 					data: {},

  355. 					success: (data) => {

  356. 						if (data.data.data == null) {

  357. 							return

  358. 						} else {

  359. 							if (data.data.data > 100) {

  360. 								this.percentage = 100;

  361. 							} else {

  362. 								if (data.data.data.onLine == 0) {

  363. 									this.Whetheroffline = false;

  364. 								} else {

  365. 									this.Whetheroffline = true;

  366. 									this.percentage = data.data.data.electricity;

  367. 									this.signalDevice = data.data.data.signalDevice / 1;

  368. 									console.log(this.signalDevice)

  369. 									this.audioStatus = data.data.data.audioStatus;

  370. 									if (this.signalDevice > 80) {

  371. 										this.signalDevicetext = '高';

  372. 									} else {

  373. 										if (this.signalDevice == 0) {

  374. 											this.signalDevicetext = '无';

  375. 										} else {

  376. 											this.signalDevicetext = '低';

  377. 										}

  378. 									}

  379. 								}

  380. 

  381. 							}

  382. 						}

  383. 					}

  384. 				})

  385. 			},

  386. 			//选择楼盘弹框

  387. 			piskbuilding() {

  388. 				this.Showhiddenunits = true;

  389. 			},

  390. 			// 楼盘选择确认

  391. 			confirm(e) {

  392. 				this.buildingname = e[0].label;

  393. 				this.buildingID = e[0].value;

  394. 				let lopan = {

  395. 					id: e[0].value,

  396. 					name: e[0].label

  397. 				}

  398. 				uni.setStorageSync("buildingID", lopan); //楼盘id写入缓存

  399. 				this.initworkThisWeek()

  400. 				this.initrealTimeStatistics()

  401. 				

  402. 			},

  403. 			// 楼盘选择取消

  404. 			cancel() {

  405. 				this.Showhiddenunits = false;

  406. 			},

  407. 			Piabodata(item) {

  408. 				if (item == '销讲数据') {

  409. 					uni.navigateTo({

  410. 						url: '/pages/center/Piabodata/index'

  411. 					});

  412. 				} else if (item == '接待记录') {

  413. 					uni.navigateTo({

  414. 						url: '/pages/center/records/index'

  415. 					});

  416. 				} else if (item == '值班顾问') {

  417. 					uni.navigateTo({

  418. 						url: '/pages/mine/consultanonduty/index'

  419. 					});

  420. 				} else if (item == '设备管理') {

  421. 					uni.navigateTo({

  422. 						url: '/pages/mine/equipment/index'

  423. 					});

  424. 				} else {

  425. 					uni.navigateTo({

  426. 						url: '/pages/center/consumer/index'

  427. 					});

  428. 				}

  429. 			},

  430. 		},

  431. 

  432. 	};

  433. </script>

  434. 

  435. <style lang="scss" scoped>

  436. 	.cented-box {

  437. 		padding: 30rpx;

  438. 		background: #F8F8F8;

  439. 		width: 100%;

  440. 		height: 100%;

  441. 	}

  442. 

  443. 	.Switchingbox {

  444. 		width: 100%;

  445. 		height: 44rpx;

  446. 		display: flex;

  447. 		align-items: center;

  448. 

  449. 		.Switching1 {

  450. 			width: 44rpx;

  451. 			height: 44rpx;

  452. 

  453. 			.Switching1-img {

  454. 				width: 44rpx;

  455. 				height: 44rpx;

  456. 			}

  457. 		}

  458. 

  459. 		.Switching2 {

  460. 			margin-left: 12rpx;

  461. 			font-size: 32rpx;

  462. 			color: #303030;

  463. 			font-weight: 500;

  464. 		}

  465. 

  466. 		.Switching3 {

  467. 			width: calc(100% - 280rpx);

  468. 			font-size: 32rpx;

  469. 			color: #303030;

  470. 			font-weight: 500;

  471. 		}

  472. 

  473. 		.Switching4 {

  474. 			width: 112rpx;

  475. 			font-size: 28rpx;

  476. 			color: #303030;

  477. 			font-weight: 400;

  478. 			text-align: right;

  479. 			text-decoration: underline

  480. 		}

  481. 	}

  482. 

  483. 	.Workcard {

  484. 		width: 100%;

  485. 		background: #FFFFFF;

  486. 		height: 154rpx;

  487. 		box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);

  488. 		border-radius: 12rpx;

  489. 		display: flex;

  490. 

  491. 		.Workcard-box {

  492. 			flex: 1;

  493. 			height: 100%;

  494. 

  495. 			.Workcardimg {

  496. 				width: 100%;

  497. 				display: flex;

  498. 				justify-content: center;

  499. 				margin-top: 42rpx;

  500. 

  501. 				.Workcardimg1 {

  502. 					width: 64rpx;

  503. 					height: 36rpx;

  504. 					background-image: url(../../static/images/battery.png);

  505. 					background-size: 100% 100%;

  506. 					padding: 8rpx;

  507. 

  508. 					.bar {

  509. 						background-color: #43CD80;

  510. 						height: 100%;

  511. 						border-radius: 4rpx;

  512. 					}

  513. 

  514. 					.bar1 {

  515. 						background-color: red;

  516. 						height: 100%;

  517. 						border-radius: 4rpx;

  518. 					}

  519. 				}

  520. 

  521. 				.Workcardimg2 {

  522. 					width: 56rpx;

  523. 					height: 36rpx;

  524. 				}

  525. 

  526. 				.Workcardimg3 {

  527. 					width: 34rpx;

  528. 					height: 36rpx;

  529. 				}

  530. 

  531. 				.Workcardimg4 {

  532. 					width: 50rpx;

  533. 					height: 40rpx;

  534. 				}

  535. 			}

  536. 

  537. 			.Workcardtext {

  538. 				width: 100%;

  539. 				text-align: center;

  540. 				font-size: 24rpx;

  541. 				font-weight: 400;

  542. 				color: #666666;

  543. 				margin-top: 20rpx;

  544. 			}

  545. 		}

  546. 	}

  547. 

  548. 	.title {

  549. 		width: 100%;

  550. 		height: 30rpx;

  551. 		font-size: 30rpx;

  552. 		font-weight: 600;

  553. 		color: #333333;

  554. 		margin-top: 40rpx;

  555. 		margin-bottom: 24rpx;

  556. 	}

  557. 

  558. 	.shebenbox {

  559. 		width: 100%;

  560. 		height: 156rpx;

  561. 		background: #FFFFFF;

  562. 		box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);

  563. 		border-radius: 12rpx;

  564. 		display: flex;

  565. 

  566. 		.shebenche {

  567. 			width: 25%;

  568. 			height: 100%;

  569. 

  570. 			.shebenchenum {

  571. 				width: 100%;

  572. 				font-size: 36rpx;

  573. 				font-weight: 600;

  574. 				color: #333333;

  575. 				text-align: center;

  576. 				margin-top: 28rpx;

  577. 			}

  578. 

  579. 			.shebenchetext {

  580. 				width: 100%;

  581. 				font-size: 24rpx;

  582. 				font-weight: 400;

  583. 				color: #666666;

  584. 				text-align: center;

  585. 				margin-top: 24rpx;

  586. 			}

  587. 		}

  588. 	}

  589. 

  590. 	.real-timebox {

  591. 		width: 100%;

  592. 		background: #FFFFFF;

  593. 		box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);

  594. 		border-radius: 12rpx;

  595. 		padding-bottom: 36rpx;

  596. 

  597. 		.timebox {

  598. 			width: 100%;

  599. 			display: flex;

  600. 

  601. 			.real {

  602. 				flex: 1;

  603. 				height: 100%;

  604. 

  605. 				.realnum {

  606. 					width: 100%;

  607. 					font-size: 36rpx;

  608. 					font-weight: 600;

  609. 					color: #333333;

  610. 					text-align: center;

  611. 					margin-top: 36rpx;

  612. 				}

  613. 

  614. 				.realtext {

  615. 					width: 100%;

  616. 					font-size: 24rpx;

  617. 					font-weight: 400;

  618. 					color: #666666;

  619. 					text-align: center;

  620. 					margin-top: 24rpx;

  621. 				}

  622. 			}

  623. 		}

  624. 

  625. 	}

  626. 

  627. 	.commonly-box {

  628. 		width: 100%;

  629. 		background: #FFFFFF;

  630. 		box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);

  631. 		border-radius: 12rpx;

  632. 		display: flex;

  633. 		flex-wrap: wrap;

  634. 		padding-bottom: 36rpx;

  635. 

  636. 		.commonly {

  637. 			width: 25%;

  638. 			margin-top: 36rpx;

  639. 

  640. 			.commonly-img {

  641. 				width: 100%;

  642. 				height: 68rpx;

  643. 				text-align: center;

  644. 

  645. 				.commonly-img1 {

  646. 					width: 68rpx;

  647. 					height: 68rpx;

  648. 					border-radius: 50%;

  649. 				}

  650. 			}

  651. 

  652. 			.commonly-text {

  653. 				width: 100%;

  654. 				text-align: center;

  655. 				font-size: 24rpx;

  656. 				font-weight: 400;

  657. 				color: #333333;

  658. 				margin-top: 16rpx;

  659. 			}

  660. 		}

  661. 	}

  662. </style>