index.vue 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591
  1. <template>
  2. <view :style="'padding-top:'+nvaHeight+'px;'">
  3. <view class="navbox">
  4. <uni-nav-bar color="#ffffff" leftWidth='520rpx' :background-color="backgroundColor" :border="false" statusBar='true' fixed="true">
  5. <block slot="left">
  6. <view class="topl flexc">
  7. <image :src="adrimg" ></image>
  8. <view class="over">{{city}}</view>
  9. </view>
  10. </block>
  11. </uni-nav-bar>
  12. </view>
  13. <!-- 主体 -->
  14. <image :src="navbg" class="navbg"></image>
  15. <view class="wymain" >
  16. <view class="adrbox">
  17. <view class="flexc mb14">
  18. <image :src="adraimg" class="adr"></image>
  19. <view class="adrtit flex0">智慧<text>社区</text></view>
  20. <view v-if="voList&&voList.length>1">
  21. <w-select
  22. style="margin-left: 20rpx;"
  23. v-model="chooseValue"
  24. :list='voList'
  25. width='200rpx'
  26. valueName='dictLabel'
  27. keyName="dictValue"
  28. :valuea="tenantId"
  29. :chosevalue="tenantName?tenantName:statusFormats(tenantId,voList,'tenant')"
  30. :filterable='filterable'
  31. @change='getchange'
  32. >
  33. </w-select>
  34. </view>
  35. </view>
  36. <view class="adrtxt flexc mb4">
  37. <view class="over">嗨~{{nickName}}!</view><text v-if="postGroup">{{postGroup}}</text>
  38. </view>
  39. <view class="adrtip">{{deptName}}</view>
  40. <image :src="adrbgimg" class="adrbgimg"></image>
  41. </view>
  42. <view class="mb22">
  43. <notice :noticelist="noticelist" :autoplay='autoplay' @getNoticeDet="getNoticeDet"></notice>
  44. </view>
  45. <!-- 统计 -->
  46. <view class="contbox" v-if="checkPermi(['wuYe:statistics:app'])">
  47. <view class="cont flexc">
  48. <image :src="conta"></image>
  49. <view>今日数据统计</view>
  50. </view>
  51. <view class="lists">
  52. <view class="list" @click="getCarKuFn">
  53. <view class="tit">{{count.kxcw||0}}</view>
  54. <view class="txt">空闲车位</view>
  55. </view>
  56. <view class="list" @click="getCarKuFn">
  57. <view class="tit">{{count.kxcdz||0}}</view>
  58. <view class="txt">空闲充电桩</view>
  59. </view>
  60. <view class="list" @click="getCarFn">
  61. <view class="tit">{{count.jrcl||0}}</view>
  62. <view class="txt">进入车辆</view>
  63. </view>
  64. <view class="list" @click="getCarFn">
  65. <view class="tit">{{count.lkcl||0}}</view>
  66. <view class="txt">离开车辆</view>
  67. </view>
  68. <view class="list" @click="getCarCheckFn">
  69. <view class="tit">{{count.wlcl||0}}</view>
  70. <view class="txt">外来车辆</view>
  71. </view>
  72. <view class="list" @click="getillegalParkFn">
  73. <view class="tit">{{count.wtdj||0}}</view>
  74. <view class="txt">违停登记</view>
  75. </view>
  76. <view class="list" @click="getCarCheckFn">
  77. <view class="tit">{{count.wlry||0}}</view>
  78. <view class="txt">外来人员</view>
  79. </view>
  80. <view class="list" @click="getCarCheckFn">
  81. <view class="tit">{{count.jrry||0}}</view>
  82. <view class="txt">进入人员</view>
  83. </view>
  84. <block v-if="zhanflag">
  85. <view class="list" @click="getPatrolFn(2)">
  86. <view class="tit ca">{{count.yxg||0}}</view>
  87. <view class="txt">已巡更</view>
  88. </view>
  89. <view class="list" @click="getPatrolFn(1)">
  90. <view class="tit ca">{{count.wxg||0}}</view>
  91. <view class="txt">未巡更</view>
  92. </view>
  93. <view class="list">
  94. <view class="tit cb">{{count.jzdd||0}}</view>
  95. <view class="txt">家政订单</view>
  96. </view>
  97. <view class="list">
  98. <view class="tit cb">{{count.wcdd||0}}</view>
  99. <view class="txt">完成订单</view>
  100. </view>
  101. <view class="list" @click="getWarrantyFn(1)">
  102. <view class="tit cc">{{count.jrbx||0}}</view>
  103. <view class="txt">今日报修</view>
  104. </view>
  105. <view class="list" @click="getWarrantyFn(2)">
  106. <view class="tit cc">{{count.ypbx||0}}</view>
  107. <view class="txt">已派报修</view>
  108. </view>
  109. <view class="list" @click="getComplaintFn(1)">
  110. <view class="tit cc">{{count.tsjy||0}}</view>
  111. <view class="txt">投诉建议</view>
  112. </view>
  113. <view class="list" @click="getComplaintFn(2)">
  114. <view class="tit cc">{{count.yhjy||0}}</view>
  115. <view class="txt">已回投诉</view>
  116. </view>
  117. </block>
  118. </view>
  119. <view class="upbox" @click="getZhanFn">
  120. <image :src="upimg" :class="zhanflag?'':'zhe'"></image>
  121. <view>{{zhanflag?'收起':'展开'}}</view>
  122. </view>
  123. </view>
  124. <view class="contbox mb16" v-if="initFaceflag==3||initFaceflag==4">
  125. <view class="cont flexc mb9">
  126. <image :src="contb"></image>
  127. <view>物业管理</view>
  128. </view>
  129. <view class="lists">
  130. <view class="list bimga" @click="getCarFn">
  131. <view class="imgs"><image :src="htaba" class="imga"></image></view>
  132. <view class="txt">车辆管控</view>
  133. </view>
  134. <view class="list bimga" @click="getCarKuFn">
  135. <view class="imgs"><image :src="htabb" class="imgb"></image></view>
  136. <view class="txt">车库管理</view>
  137. </view>
  138. <view class="list bimga" @click="getCarCheckFn">
  139. <view class="imgs"><image :src="htabc" class="imgc"></image></view>
  140. <view class="txt">外来车辆登记</view>
  141. </view>
  142. <view class="list bimga" @click="getillegalParkFn" v-if="checkPermi(['wuYe:illegalParking:list'])">
  143. <view class="imgs"><image :src="htabd" class="imgd"></image></view>
  144. <view class="txt">违停管理</view>
  145. </view>
  146. <view class="list bimga" @click="getPeopleFn" v-if="checkPermi(['wuYe:residentInfo:list'])">
  147. <view class="imgs"><image :src="htabe" class="imge"></image></view>
  148. <view class="txt">人员管理</view>
  149. </view>
  150. <view class="list bimga" @click="getComeglFn" v-if="checkPermi(['wuYe:visitorManage:list'])">
  151. <view class="imgs"><image :src="htabf" class="imgf"></image></view>
  152. <view class="txt">来访管理</view>
  153. </view>
  154. <view class="list bimga" @click="getMoneyFn" v-if="checkPermi(['wuYe:fee:list'])">
  155. <view class="imgs"><image :src="htabg" class="imgd"></image></view>
  156. <view class="txt">物业费管理</view>
  157. </view>
  158. <view class="list bimga" @click="getHouseFn" v-if="checkPermi(['wuYe:houseInfo:list'])">
  159. <view class="imgs"><image :src="htabh" class="imgd"></image>
  160. <view class="tips">
  161. <block v-if="countTips.residentInfoAuthenticationCount>98">99+</block>
  162. <block v-else>{{countTips.residentInfoAuthenticationCount||0}}</block>
  163. </view>
  164. </view>
  165. <view class="txt">房屋管理</view>
  166. </view>
  167. </view>
  168. </view>
  169. <view class="contbox mb16" v-if="initFaceflag==3||initFaceflag==4">
  170. <view class="cont flexc mb9">
  171. <image :src="contc"></image>
  172. <view>物业服务</view>
  173. </view>
  174. <view class="lists">
  175. <view class="list bimga" @click="getPatrolFn()" v-if="checkPermi(['wuYe:checkPointRecord:applist'])">
  176. <view class="imgs"><image :src="htabi" class="imgg"></image></view>
  177. <view class="txt">今日巡更</view>
  178. </view>
  179. <view class="list bimga" @click="getWarrantyFn()" v-if="checkPermi(['wuYe:repair:applist'])">
  180. <view class="imgs"><image :src="htabj" class="imgb"></image><view class="tips">
  181. <block v-if="countTips.propertyRepair>98">99+</block>
  182. <block v-else>{{countTips.propertyRepair||0}}</block>
  183. </view>
  184. </view>
  185. <view class="txt">物业报修</view>
  186. </view>
  187. <view class="list bimga" @click="getStaffFn" v-if="checkPermi(['wuYe:staffManage:list'])">
  188. <view class="imgs"><image :src="htabk" class="imgb"></image>
  189. <view class="tips">
  190. <block v-if="countTips.staffManageAuthenticationCount>98">99+</block>
  191. <block v-else>{{countTips.staffManageAuthenticationCount||0}}</block>
  192. </view>
  193. </view>
  194. <view class="txt">员工管理</view>
  195. </view>
  196. <view class="list bimga" @click="getComplaintFn()" v-if="checkPermi(['wuYe:suggestion:applist'])">
  197. <view class="imgs"><image :src="htabl" class="imga"></image><view class="tips">
  198. <block v-if="countTips.complaintSuggestion>98">99+</block>
  199. <block v-else>{{countTips.complaintSuggestion||0}}</block>
  200. </view></view>
  201. <view class="txt">投诉建议</view>
  202. </view>
  203. </view>
  204. </view>
  205. <view class="contbox mb16">
  206. <view class="cont flexc mb9">
  207. <image :src="contd"></image>
  208. <view>社区管理</view>
  209. </view>
  210. <view class="lists">
  211. <view class="list bimga" @click="getNewsdjFn" v-if="checkPermi(['wuYe:partyNews:list'])">
  212. <view class="imgs"><image :src="htabm" class="imgh"></image></view>
  213. <view class="txt">党建信息</view>
  214. </view>
  215. <view class="list bimga" @click="getNewssqFn" v-if="checkPermi(['wuYe:news:list'])">
  216. <view class="imgs"><image :src="htabn" class="imgi"></image><view class="tips">
  217. <block v-if="countTips.commentInteractionUserCount>98">99+</block>
  218. <block v-else>{{countTips.commentInteractionUserCount||0}}</block>
  219. </view></view>
  220. <view class="txt">社区资讯</view>
  221. </view>
  222. <view class="list bimga" @click="getNewsYgFn" v-if="checkPermi(['wuYe:manual:list'])">
  223. <view class="imgs"><image :src="htabo" class="imgf"></image></view>
  224. <view class="txt">员工培训</view>
  225. </view>
  226. <view class="list bimga" @click="getSqmoneyFn" v-if="checkPermi(['wuYe:assets:list'])">
  227. <view class="imgs"><image :src="htabp" class="imgi"></image></view>
  228. <view class="txt">社区资产</view>
  229. </view>
  230. </view>
  231. </view>
  232. </view>
  233. <loading></loading>
  234. <pop-up @getClose="getClose" :initFace='initFace' @getXxwsFn="getXxwsFn"></pop-up>
  235. <footers v-if="isfootflag" :footerindex="footerindex"></footers>
  236. </view>
  237. </template>
  238. <script>
  239. import footers from '@/components/footer/footer.vue'
  240. import notice from '@/components/swiper/notice.vue'
  241. import popUp from "@/components/box/popup.vue"
  242. import {getUserProfile} from "@/api/system/user.js"
  243. import {repairList} from "@/api/work/service.js"
  244. import {gettenantUserName,gettenantCheck} from "@/api/login.js"
  245. import self from '@/utils/location.js';
  246. import wSelect from "@/people/components/w-select/w-select.vue"
  247. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  248. import {getCount,getCountTips} from "@/api/work/index.js"
  249. import {selectValueKey} from "@/utils/common.js"
  250. import config from '@/config'
  251. const Clientid = config.Clientid
  252. export default {
  253. components:{footers,notice,popUp,wSelect},
  254. data(){
  255. return{
  256. footerindex:'home',
  257. isfootflag:true,
  258. nvaHeight:44,
  259. // activeColor:'#A7CDF9',
  260. // nactiveColor:'#DADADA',
  261. backgroundColor: "transparent",
  262. navbg:require("@/static/images/navbg.png"),
  263. adrimg:require("@/static/images/home/adr.png"),
  264. adraimg:require("@/static/images/home/adra.png"),
  265. adrbgimg:require("@/static/images/home/adrbg.png"),
  266. conta:require("@/static/images/home/conta.png"),
  267. contb:require("@/static/images/home/contb.png"),
  268. contc:require("@/static/images/home/contc.png"),
  269. contd:require("@/static/images/home/contd.png"),
  270. htaba:require("@/static/images/home/htaba.png"),
  271. htabb:require("@/static/images/home/htabb.png"),
  272. htabc:require("@/static/images/home/htabc.png"),
  273. htabd:require("@/static/images/home/htabd.png"),
  274. htabe:require("@/static/images/home/htabe.png"),
  275. htabf:require("@/static/images/home/htabf.png"),
  276. htabg:require("@/static/images/home/htabg.png"),
  277. htabh:require("@/static/images/home/htabh.png"),
  278. htabi:require("@/static/images/home/htabi.png"),
  279. htabj:require("@/static/images/home/htabj.png"),
  280. htabk:require("@/static/images/home/htabk.png"),
  281. htabl:require("@/static/images/home/htabl.png"),
  282. htabm:require("@/static/images/home/htabm.png"),
  283. htabn:require("@/static/images/home/htabn.png"),
  284. htabo:require("@/static/images/home/htabo.png"),
  285. htabp:require("@/static/images/home/htabp.png"),
  286. upimg:require("@/static/images/home/up.png"),
  287. aupimg: require('@/static/images/aup.png'),
  288. city:'合肥市',
  289. initFace:'',//initFace 1:双端都未认证 2:只认证了业主端 3:只认证了物业端 4:双端都认证过
  290. deptName:this.$store.state.user.deptName,
  291. nickName:this.$store.state.user.nickName,
  292. postGroup:'',//岗位
  293. autoplay:false,
  294. zhanflag:true,
  295. xxList:[],
  296. companyName:'',
  297. count:"",//统计
  298. countTips:'',//红点
  299. userId:this.$store.state.user.userId,
  300. noticelist:[],
  301. chooseValue:'',
  302. tenantId:'',
  303. tenantName:'',
  304. voList:[],
  305. filterable:true,
  306. initFaceflag:'',
  307. }
  308. },
  309. onPageScroll(e) {
  310. var scrollTop = Number(e.scrollTop);
  311. if (scrollTop > 0) {
  312. this.backgroundColor = '#C3EDFF'
  313. } else {
  314. this.backgroundColor = 'transparent'
  315. }
  316. },
  317. onShow() {
  318. this.initFace=this.$store.state.user.initFace;
  319. this.initFaceflag=this.$store.state.user.initFace;
  320. // this.tenantId=this.$store.state.user.tenantId;
  321. },
  322. onLoad: function() {
  323. var that=this;
  324. uni.getSystemInfo({
  325. success: (e) => {
  326. this.nvaHeight = Number(e.statusBarHeight)+44;
  327. }
  328. })
  329. this.gettenantList()
  330. if(checkPermi(['wuYe:statistics:app'])){
  331. this.getCount()
  332. }
  333. if(checkPermi(['wuYe:statistics:wuYeTips'])){
  334. this.getCountTips()
  335. }
  336. if(checkPermi(['wuYe:repair:applist'])){
  337. this.repairList()
  338. }
  339. // #ifndef H5
  340. self.getLocation(function(res){
  341. if(res==-1){
  342. }else{
  343. that.city=res.city;
  344. }
  345. })
  346. // #endif
  347. },
  348. methods:{
  349. checkPermi, checkRole,
  350. statusFormats(data, list,type) {
  351. var aite=selectValueKey(list, data);
  352. if(type=='tenant'){
  353. this.tenantName=aite.actions
  354. }
  355. return aite.actions;
  356. },
  357. // 获取租户列表
  358. gettenantList(){
  359. var params={
  360. userId:this.userId
  361. }
  362. gettenantUserName().then(res=>{
  363. if(res.code==200){
  364. if(res.data&&res.data.length){
  365. this.voList = res.data.map(v => {
  366. return {
  367. dictLabel: v.companyName,
  368. dictValue: v.tenantId
  369. }
  370. })
  371. }
  372. }else{
  373. this.$toast(res.msg)
  374. }
  375. })
  376. },
  377. getchange(e){
  378. var id=e.dictValue;
  379. var name=e.dictLabel;
  380. var that=this;
  381. this.tenantId=id;
  382. this.tenantName=name;
  383. var params={
  384. tenantId:id,
  385. clientId:Clientid,
  386. grantType:'password'
  387. }
  388. gettenantCheck(params).then(res=>{
  389. var token=res.msg;
  390. // 切换token
  391. this.$store.dispatch('checkToken', token).then(() => {
  392. this.$store.dispatch('GetInfo').then(res => {
  393. })
  394. }).catch(() => {
  395. })
  396. })
  397. },
  398. getXxwsFn(){
  399. var type='rz'
  400. this.$tab.navigateTo(`/people/pages/people/staffadd?type=${type}`)
  401. },
  402. getClose(){
  403. this.initFace='';
  404. },
  405. getNoticeDet(data){
  406. this.$tab.navigateTo(`/service/pages/service/warrantydetail?id=`+data)
  407. },
  408. repairList(){
  409. var params={
  410. pageSize: 10,
  411. pageNum: 1,
  412. }
  413. if(checkPermi(['wuYe:repair:repairlist'])){
  414. params.staffUserId=this.userId;
  415. params.repairStatus=2
  416. }else{
  417. params.repairStatus=1
  418. }
  419. repairList(params).then(res=>{
  420. if(res.code==200){
  421. this.noticelist=res.rows
  422. }
  423. })
  424. },
  425. getCount(){
  426. getCount().then(res => {
  427. if(res.code==200){
  428. this.count=res.data;
  429. }
  430. // this.roleGroup = response.roleGroup
  431. // this.postGroup = response.postGroup
  432. })
  433. },
  434. getCountTips(){
  435. var params={}
  436. if(checkPermi(['wuYe:repair:repairlist'])){
  437. params.userId=this.userId
  438. }
  439. // userId:this.userId
  440. getCountTips(params).then(res=>{
  441. if(res.code==200){
  442. this.countTips=res.data;
  443. }
  444. })
  445. },
  446. getUser() {
  447. getUserProfile().then(response => {
  448. this.roleGroup = response.roleGroup
  449. this.postGroup = response.postGroup
  450. })
  451. },
  452. getZhanFn(){
  453. this.zhanflag=!this.zhanflag
  454. },
  455. getCarFn(){//车辆管控
  456. this.$toast("模块建设中~")
  457. // this.$tab.navigateTo(`/car/pages/index`)
  458. },
  459. getCarKuFn(){//车库管理
  460. this.$toast("模块建设中~")
  461. // this.$tab.navigateTo(`/car/pages/carku`)
  462. },
  463. getCarCheckFn(){//外来车辆登记
  464. this.$toast("模块建设中~")
  465. // this.$tab.navigateTo(`/car/pages/carcheck`)
  466. },
  467. getillegalParkFn(){//违停管理
  468. this.$tab.navigateTo(`/car/pages/illegalParking`)
  469. },
  470. getPeopleFn(){//人员管理
  471. this.$tab.navigateTo(`/people/pages/people/index`)
  472. },
  473. getComeglFn(){//来访管理
  474. this.$tab.navigateTo(`/people/pages/people/comegl`)
  475. },
  476. getMoneyFn(){//物业费管理
  477. this.$tab.navigateTo(`/work/pages/manage/money`)
  478. },
  479. getPatrolFn(type){//今日巡更
  480. if(type){
  481. this.$tab.navigateTo(`/service/pages/service/patrol?type=${type}`)
  482. }else{
  483. this.$tab.navigateTo(`/service/pages/service/patrol`)
  484. }
  485. },
  486. getWarrantyFn(type){//报修管理
  487. if(type){
  488. this.$tab.navigateTo(`/service/pages/service/warranty?type=${type}`)
  489. }else{
  490. this.$tab.navigateTo(`/service/pages/service/warranty`)
  491. }
  492. },
  493. getStaffFn(){//维修人员管理
  494. this.$tab.navigateTo(`/people/pages/people/staff`)
  495. },
  496. getHouseFn(){//房屋管理
  497. this.$tab.navigateTo(`/work/pages/manage/house`)
  498. },
  499. getComplaintFn(type){//投诉建议
  500. if(type){
  501. this.$tab.navigateTo(`/service/pages/service/complaint?type=${type}`)
  502. }else{
  503. this.$tab.navigateTo(`/service/pages/service/complaint`)
  504. }
  505. },
  506. getNewsdjFn(){//党建资讯
  507. this.$tab.navigateTo(`/manage/pages/community/newsdj`)
  508. },
  509. getNewssqFn(){//党建资讯
  510. this.$tab.navigateTo(`/manage/pages/community/newssq`)
  511. },
  512. getNewsYgFn(){//员工培训
  513. this.$tab.navigateTo(`/manage/pages/community/newsyg`)
  514. },
  515. getSqmoneyFn(){//社区资产
  516. this.$tab.navigateTo(`/manage/pages/community/sqmoney`)
  517. },
  518. }
  519. }
  520. </script>
  521. <style lang="scss" scoped>
  522. /deep/ .uni-navbar__header-btns{overflow: auto;}
  523. .navbox{position: fixed;left: 0;right: 0;top: 0;z-index: 4; }
  524. .navbg{width: 100%;height: 782rpx;}
  525. .wymain{z-index: 2;position: relative;padding: 0 24rpx;}
  526. .topl{overflow: hidden;padding-left: 16rpx;max-width: 200rpx;flex: 0 0 auto;
  527. image{width: 18rpx;height: 22rpx;margin-right: 14rpx;flex: 0 0 auto;}
  528. view{font-weight: bold;font-size: 26rpx;color: #272727;}
  529. }
  530. .adrbox{position: relative;padding:8rpx 240rpx 16rpx 36rpx;margin-bottom: 14rpx;
  531. .adr{width: 36rpx;height: 34rpx;margin-right: 14rpx;}
  532. .adrtit{font-size: 17px;color: #272727;font-weight: bold;
  533. text{color: #0256FD;}
  534. }
  535. .adrtxt{font-size: 16px;color: #272727;font-weight: bold;
  536. text{font-size: 10px;color: #3F7EFD;display: inline-flex;background: rgba(119, 171, 184, 0.3);margin-left: 22rpx;min-width: 66rpx;height: 30rpx;padding: 0 14rpx;box-sizing: border-box;flex: 0 0 auto;border-radius: 8px;align-items: center;justify-content: center;}
  537. }
  538. .adrtip{font-weight: 500;font-size: 24rpx;color: #828282;}
  539. .adrbgimg{width: 212rpx;height: 236rpx;position: absolute;right: 20rpx;top: -70rpx;}
  540. }
  541. .contbox{
  542. .cont{padding-left: 24rpx;margin-bottom: 12rpx;
  543. image{width: 32rpx;height: 32rpx;margin-right: 16rpx;}
  544. view{font-size: 15px;color: #272727;font-weight: bold;}
  545. }
  546. .lists{
  547. display: flex;align-items: center;flex-wrap: wrap;
  548. .list{padding: 8rpx 0;
  549. width: 25%;display: flex;flex-direction: column;align-items: center;
  550. .tit{font-weight: bold;font-size: 30rpx;color: #3565ED;line-height: 60rpx;font-style: italic;margin-bottom: 8rpx;
  551. &.ca{color: #FF7E00;}
  552. &.cb{color: #28C529;}
  553. &.cc{color: #FF3737;}
  554. }
  555. .txt{font-weight: 500;font-size: 26rpx;color: #272727;}
  556. &.bimga{padding: 16rpx 0;}
  557. .imgs{display: flex;align-items: center;justify-content: center;width: 48rpx;height: 48rpx;margin-bottom: 18rpx;position: relative;
  558. .imga{width: 48rpx;height: 38rpx;}
  559. .imgb{width: 48rpx;height: 46rpx;}
  560. .imgc{width: 44rpx;height: 48rpx;}
  561. .imgd{width: 48rpx;height: 42rpx;}
  562. .imge{width: 46rpx;height: 46rpx;}
  563. .imgf{width: 48rpx;height: 48rpx;}
  564. .imgg{width: 42rpx;height: 48rpx;}
  565. .imgh{width: 44rpx;height: 44rpx;}
  566. .imgi{width: 48rpx;height: 44rpx;}
  567. .tips{position: absolute;min-width: 20rpx;top: -4rpx;left: 36rpx;box-sizing: border-box;
  568. height: 20rpx;padding: 0 4rpx;display: flex;align-items: center;justify-content: center;font-weight: bold;font-size: 16rpx;color: #FCF9F1;background: #D32C26;border-radius: 10rpx;
  569. }
  570. }
  571. }
  572. }
  573. .upbox{display: flex;align-items: center;justify-content: center;flex-direction: column;margin-top: 8rpx;padding-top: 8rpx;margin-bottom: 6rpx;
  574. image{width: 24rpx;height: 20rpx;margin-bottom: 8rpx;transition: all 0.3s;
  575. &.zhe{transform: rotate(-180deg);}
  576. }
  577. view{font-weight: 500;font-size: 22rpx;color: #AAAAAA;}
  578. }
  579. }
  580. .pay_btn{min-width: 240rpx;height: 66rpx;flex: 0 1 auto;margin-left: 20rpx;max-width: 320rpx;
  581. .tit{font-size: 26rpx;font-weight: 500;color: #333432;overflow: hidden;}
  582. image{width: 18rpx;height: 10rpx;margin-left: 20rpx;flex:0 0 auto;}
  583. }
  584. </style>