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