index.vue 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455
  1. <template>
  2. <view :style="'padding-top:'+nvaHeight+'px;'">
  3. <view class="navbox">
  4. <uni-nav-bar color="#ffffff" leftWidth='400rpx' :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">智慧<text>社区</text></view>
  20. </view>
  21. <view class="adrtxt flexc mb4">
  22. <view class="over">嗨~{{nickName}}!</view><text v-if="postGroup">{{postGroup}}</text>
  23. </view>
  24. <view class="adrtip">{{deptName}}</view>
  25. <image :src="adrbgimg" class="adrbgimg"></image>
  26. </view>
  27. <view class="mb22">
  28. <notice :noticelist="noticelist" :autoplay='autoplay' @getNoticeDet="getNoticeDet"></notice>
  29. </view>
  30. <!-- 统计 -->
  31. <view class="contbox" v-if="checkPermi(['wuYe:statistics:num:app'])">
  32. <view class="cont flexc">
  33. <image :src="conta"></image>
  34. <view>今日数据统计</view>
  35. </view>
  36. <view class="lists">
  37. <view class="list">
  38. <view class="tit">{{count.kxcw||0}}</view>
  39. <view class="txt">空闲车位</view>
  40. </view>
  41. <view class="list">
  42. <view class="tit">{{count.kxcdz||0}}</view>
  43. <view class="txt">空闲充电桩</view>
  44. </view>
  45. <view class="list">
  46. <view class="tit">{{count.jrcl||0}}</view>
  47. <view class="txt">进入车辆</view>
  48. </view>
  49. <view class="list">
  50. <view class="tit">{{count.lkcl||0}}</view>
  51. <view class="txt">离开车辆</view>
  52. </view>
  53. <view class="list">
  54. <view class="tit">{{count.wlcl||0}}</view>
  55. <view class="txt">外来车辆</view>
  56. </view>
  57. <view class="list">
  58. <view class="tit">{{count.wtdj||0}}</view>
  59. <view class="txt">违停登记</view>
  60. </view>
  61. <view class="list">
  62. <view class="tit">{{count.wlry||0}}</view>
  63. <view class="txt">外来人员</view>
  64. </view>
  65. <view class="list">
  66. <view class="tit">{{count.jrry||0}}</view>
  67. <view class="txt">进入人员</view>
  68. </view>
  69. <block v-if="zhanflag">
  70. <view class="list">
  71. <view class="tit ca">{{count.yxg||0}}</view>
  72. <view class="txt">已巡更</view>
  73. </view>
  74. <view class="list">
  75. <view class="tit ca">{{count.wxg||0}}</view>
  76. <view class="txt">未巡更</view>
  77. </view>
  78. <view class="list">
  79. <view class="tit cb">{{count.jzdd||0}}</view>
  80. <view class="txt">家政订单</view>
  81. </view>
  82. <view class="list">
  83. <view class="tit cb">{{count.wcdd||0}}</view>
  84. <view class="txt">完成订单</view>
  85. </view>
  86. <view class="list">
  87. <view class="tit cc">{{count.jrbx||0}}</view>
  88. <view class="txt">今日报修</view>
  89. </view>
  90. <view class="list">
  91. <view class="tit cc">{{count.ypbx||0}}</view>
  92. <view class="txt">已派报修</view>
  93. </view>
  94. <view class="list">
  95. <view class="tit cc">{{count.tsjy||0}}</view>
  96. <view class="txt">投诉建议</view>
  97. </view>
  98. <view class="list">
  99. <view class="tit cc">{{count.yhjy||0}}</view>
  100. <view class="txt">已回投诉</view>
  101. </view>
  102. </block>
  103. </view>
  104. <view class="upbox" @click="getZhanFn">
  105. <image :src="upimg" :class="zhanflag?'':'zhe'"></image>
  106. <view>{{zhanflag?'收起':'展开'}}</view>
  107. </view>
  108. </view>
  109. <view class="contbox mb16">
  110. <view class="cont flexc mb9">
  111. <image :src="contb"></image>
  112. <view>物业管理</view>
  113. </view>
  114. <view class="lists">
  115. <view class="list bimga" @click="getCarFn">
  116. <view class="imgs"><image :src="htaba" class="imga"></image></view>
  117. <view class="txt">车辆管控</view>
  118. </view>
  119. <view class="list bimga" @click="getCarKuFn">
  120. <view class="imgs"><image :src="htabb" class="imgb"></image></view>
  121. <view class="txt">车库管理</view>
  122. </view>
  123. <view class="list bimga" @click="getCarCheckFn">
  124. <view class="imgs"><image :src="htabc" class="imgc"></image></view>
  125. <view class="txt">外来车辆登记</view>
  126. </view>
  127. <view class="list bimga" @click="getillegalParkFn" v-if="checkPermi(['wuYe:illegalParking:list'])">
  128. <view class="imgs"><image :src="htabd" class="imgd"></image></view>
  129. <view class="txt">违停管理</view>
  130. </view>
  131. <view class="list bimga" @click="getPeopleFn" v-if="checkPermi(['wuYe:residentInfo:list'])">
  132. <view class="imgs"><image :src="htabe" class="imge"></image></view>
  133. <view class="txt">人员管理</view>
  134. </view>
  135. <view class="list bimga" @click="getComeglFn" v-if="checkPermi(['wuYe:visitorManage:list'])">
  136. <view class="imgs"><image :src="htabf" class="imgf"></image></view>
  137. <view class="txt">来访管理</view>
  138. </view>
  139. <view class="list bimga" @click="getMoneyFn" v-if="checkPermi(['wuYe:fee:list'])">
  140. <view class="imgs"><image :src="htabg" class="imgd"></image></view>
  141. <view class="txt">物业费管理</view>
  142. </view>
  143. <view class="list bimga" @click="getHouseFn" v-if="checkPermi(['wuYe:houseInfo:list'])">
  144. <view class="imgs"><image :src="htabh" class="imgd"></image></view>
  145. <view class="txt">房屋管理</view>
  146. </view>
  147. </view>
  148. </view>
  149. <view class="contbox mb16">
  150. <view class="cont flexc mb9">
  151. <image :src="contc"></image>
  152. <view>物业服务</view>
  153. </view>
  154. <view class="lists">
  155. <view class="list bimga" @click="getPatrolFn" v-if="checkPermi(['wuYe:checkPointRecord:list'])">
  156. <view class="imgs"><image :src="htabi" class="imgg"></image></view>
  157. <view class="txt">今日巡更</view>
  158. </view>
  159. <view class="list bimga" @click="getWarrantyFn" v-if="checkPermi(['wuYe:repair:list'])">
  160. <view class="imgs"><image :src="htabj" class="imgb"></image><view class="tips">
  161. <block v-if="countTips.propertyRepair>98">99+</block>
  162. <block v-else>{{countTips.propertyRepair||0}}</block>
  163. </view>
  164. </view>
  165. <view class="txt">物业报修</view>
  166. </view>
  167. <view class="list bimga" @click="getStaffFn" v-if="checkPermi(['wuYe:staffManage:list'])">
  168. <view class="imgs"><image :src="htabk" class="imgb"></image></view>
  169. <view class="txt">员工管理</view>
  170. </view>
  171. <view class="list bimga" @click="getComplaintFn" v-if="checkPermi(['wuYe:suggestion:list'])">
  172. <view class="imgs"><image :src="htabl" class="imga"></image><view class="tips">
  173. <block v-if="countTips.complaintSuggestion>98">99+</block>
  174. <block v-else>{{countTips.complaintSuggestion||0}}</block>
  175. </view></view>
  176. <view class="txt">投诉建议</view>
  177. </view>
  178. </view>
  179. </view>
  180. <view class="contbox mb16">
  181. <view class="cont flexc mb9">
  182. <image :src="contd"></image>
  183. <view>社区管理</view>
  184. </view>
  185. <view class="lists">
  186. <view class="list bimga" @click="getNewsdjFn" v-if="checkPermi(['wuYe:partyNews:list'])">
  187. <view class="imgs"><image :src="htabm" class="imgh"></image></view>
  188. <view class="txt">党建信息</view>
  189. </view>
  190. <view class="list bimga" @click="getNewssqFn" v-if="checkPermi(['wuYe:news:list'])">
  191. <view class="imgs"><image :src="htabn" class="imgi"></image><view class="tips">
  192. <block v-if="countTips.commentInteractionUserCount>98">99+</block>
  193. <block v-else>{{countTips.commentInteractionUserCount||0}}</block>
  194. </view></view>
  195. <view class="txt">社区资讯</view>
  196. </view>
  197. <view class="list bimga" @click="getNewsYgFn" v-if="checkPermi(['wuYe:manual:list'])">
  198. <view class="imgs"><image :src="htabo" class="imgf"></image></view>
  199. <view class="txt">员工培训</view>
  200. </view>
  201. <view class="list bimga" @click="getSqmoneyFn" v-if="checkPermi(['wuYe:assets:list'])">
  202. <view class="imgs"><image :src="htabp" class="imgi"></image></view>
  203. <view class="txt">社区资产</view>
  204. </view>
  205. </view>
  206. </view>
  207. </view>
  208. <loading></loading>
  209. <footers v-if="isfootflag" :footerindex="footerindex"></footers>
  210. </view>
  211. </template>
  212. <script>
  213. import footers from '@/components/footer/footer.vue'
  214. import notice from '@/components/swiper/notice.vue'
  215. import {getUserProfile} from "@/api/system/user.js"
  216. import {repairList} from "@/api/work/service.js"
  217. import self from '@/utils/location.js';
  218. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  219. import {getCount,getCountTips} from "@/api/work/index.js"
  220. export default {
  221. components:{footers,notice},
  222. data(){
  223. return{
  224. footerindex:'home',
  225. isfootflag:true,
  226. nvaHeight:44,
  227. // activeColor:'#A7CDF9',
  228. // nactiveColor:'#DADADA',
  229. backgroundColor: "transparent",
  230. navbg:require("@/static/images/navbg.png"),
  231. adrimg:require("@/static/images/home/adr.png"),
  232. adraimg:require("@/static/images/home/adra.png"),
  233. adrbgimg:require("@/static/images/home/adrbg.png"),
  234. conta:require("@/static/images/home/conta.png"),
  235. contb:require("@/static/images/home/contb.png"),
  236. contc:require("@/static/images/home/contc.png"),
  237. contd:require("@/static/images/home/contd.png"),
  238. htaba:require("@/static/images/home/htaba.png"),
  239. htabb:require("@/static/images/home/htabb.png"),
  240. htabc:require("@/static/images/home/htabc.png"),
  241. htabd:require("@/static/images/home/htabd.png"),
  242. htabe:require("@/static/images/home/htabe.png"),
  243. htabf:require("@/static/images/home/htabf.png"),
  244. htabg:require("@/static/images/home/htabg.png"),
  245. htabh:require("@/static/images/home/htabh.png"),
  246. htabi:require("@/static/images/home/htabi.png"),
  247. htabj:require("@/static/images/home/htabj.png"),
  248. htabk:require("@/static/images/home/htabk.png"),
  249. htabl:require("@/static/images/home/htabl.png"),
  250. htabm:require("@/static/images/home/htabm.png"),
  251. htabn:require("@/static/images/home/htabn.png"),
  252. htabo:require("@/static/images/home/htabo.png"),
  253. htabp:require("@/static/images/home/htabp.png"),
  254. upimg:require("@/static/images/home/up.png"),
  255. city:'幸福大街',
  256. deptName:this.$store.state.user.deptName,
  257. nickName:this.$store.state.user.nickName,
  258. postGroup:'',//岗位
  259. autoplay:false,
  260. zhanflag:true,
  261. count:"",//统计
  262. countTips:'',//红点
  263. userId:this.$store.state.user.userId,
  264. noticelist:[],
  265. }
  266. },
  267. onPageScroll(e) {
  268. var scrollTop = Number(e.scrollTop);
  269. if (scrollTop > 0) {
  270. this.backgroundColor = '#C3EDFF'
  271. } else {
  272. this.backgroundColor = 'transparent'
  273. }
  274. },
  275. onLoad: function() {
  276. var that=this;
  277. uni.getSystemInfo({
  278. success: (e) => {
  279. this.nvaHeight = Number(e.statusBarHeight)+44;
  280. }
  281. })
  282. if(checkPermi(['wuYe:statistics:num:app'])){
  283. this.getCount()
  284. }
  285. this.getCountTips()
  286. if(checkPermi(['wuYe:repair:list'])){
  287. this.repairList()
  288. }
  289. // #ifndef H5
  290. self.getLocation(function(res){
  291. if(res==-1){
  292. }else{
  293. that.city=res.city;
  294. }
  295. })
  296. // #endif
  297. },
  298. methods:{
  299. checkPermi, checkRole,
  300. getNoticeDet(data){
  301. this.$tab.navigateTo(`/service/pages/service/warrantydetail?id=`+data)
  302. },
  303. repairList(){
  304. var params={
  305. pageSize: 10,
  306. pageNum: 1,
  307. repairStatus: 1,
  308. }
  309. repairList(params).then(res=>{
  310. if(res.code==200){
  311. this.noticelist=res.rows
  312. }
  313. })
  314. },
  315. getCount(){
  316. getCount().then(res => {
  317. if(res.code==200){
  318. this.count=res.data;
  319. }
  320. // this.roleGroup = response.roleGroup
  321. // this.postGroup = response.postGroup
  322. })
  323. },
  324. getCountTips(){
  325. var params={
  326. userId:this.userId
  327. }
  328. getCountTips(params).then(res=>{
  329. if(res.code==200){
  330. this.countTips=res.data;
  331. }
  332. })
  333. },
  334. getUser() {
  335. getUserProfile().then(response => {
  336. this.roleGroup = response.roleGroup
  337. this.postGroup = response.postGroup
  338. })
  339. },
  340. getZhanFn(){
  341. this.zhanflag=!this.zhanflag
  342. },
  343. getCarFn(){//车辆管控
  344. this.$tab.navigateTo(`/car/pages/index`)
  345. },
  346. getCarKuFn(){//车库管理
  347. this.$tab.navigateTo(`/car/pages/carku`)
  348. },
  349. getCarCheckFn(){//外来车辆登记
  350. this.$tab.navigateTo(`/car/pages/carcheck`)
  351. },
  352. getillegalParkFn(){//违停管理
  353. this.$tab.navigateTo(`/car/pages/illegalParking`)
  354. },
  355. getPeopleFn(){//人员管理
  356. this.$tab.navigateTo(`/people/pages/people/index`)
  357. },
  358. getComeglFn(){//来访管理
  359. this.$tab.navigateTo(`/people/pages/people/comegl`)
  360. },
  361. getMoneyFn(){//物业费管理
  362. this.$tab.navigateTo(`/work/pages/manage/money`)
  363. },
  364. getPatrolFn(){//今日巡更
  365. this.$tab.navigateTo(`/service/pages/service/patrol`)
  366. },
  367. getWarrantyFn(){//报修管理
  368. this.$tab.navigateTo(`/service/pages/service/warranty`)
  369. },
  370. getStaffFn(){//维修人员管理
  371. this.$tab.navigateTo(`/people/pages/people/staff`)
  372. },
  373. getHouseFn(){//房屋管理
  374. this.$tab.navigateTo(`/work/pages/manage/house`)
  375. },
  376. getComplaintFn(){//投诉建议
  377. this.$tab.navigateTo(`/service/pages/service/complaint`)
  378. },
  379. getNewsdjFn(){//党建资讯
  380. this.$tab.navigateTo(`/manage/pages/community/newsdj`)
  381. },
  382. getNewssqFn(){//党建资讯
  383. this.$tab.navigateTo(`/manage/pages/community/newssq`)
  384. },
  385. getNewsYgFn(){//员工培训
  386. this.$tab.navigateTo(`/manage/pages/community/newsyg`)
  387. },
  388. getSqmoneyFn(){//社区资产
  389. this.$tab.navigateTo(`/manage/pages/community/sqmoney`)
  390. },
  391. }
  392. }
  393. </script>
  394. <style lang="scss" scoped>
  395. .navbox{position: fixed;left: 0;right: 0;top: 0;z-index: 4; }
  396. .navbg{width: 100%;height: 782rpx;}
  397. .wymain{z-index: 2;position: relative;padding: 0 24rpx;}
  398. .topl{overflow: hidden;padding-left: 16rpx;
  399. image{width: 18rpx;height: 22rpx;margin-right: 14rpx;flex: 0 0 auto;}
  400. view{font-weight: bold;font-size: 26rpx;color: #272727;}
  401. }
  402. .adrbox{position: relative;padding:8rpx 240rpx 16rpx 36rpx;margin-bottom: 14rpx;
  403. .adr{width: 36rpx;height: 34rpx;margin-right: 14rpx;}
  404. .adrtit{font-size: 17px;color: #272727;font-weight: bold;
  405. text{color: #0256FD;}
  406. }
  407. .adrtxt{font-size: 16px;color: #272727;font-weight: bold;
  408. 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;}
  409. }
  410. .adrtip{font-weight: 500;font-size: 24rpx;color: #828282;}
  411. .adrbgimg{width: 212rpx;height: 236rpx;position: absolute;right: 20rpx;top: -70rpx;}
  412. }
  413. .contbox{
  414. .cont{padding-left: 24rpx;margin-bottom: 12rpx;
  415. image{width: 32rpx;height: 32rpx;margin-right: 16rpx;}
  416. view{font-size: 15px;color: #272727;font-weight: bold;}
  417. }
  418. .lists{
  419. display: flex;align-items: center;flex-wrap: wrap;
  420. .list{padding: 8rpx 0;
  421. width: 25%;display: flex;flex-direction: column;align-items: center;
  422. .tit{font-weight: bold;font-size: 30rpx;color: #3565ED;line-height: 60rpx;font-style: italic;margin-bottom: 8rpx;
  423. &.ca{color: #FF7E00;}
  424. &.cb{color: #28C529;}
  425. &.cc{color: #FF3737;}
  426. }
  427. .txt{font-weight: 500;font-size: 26rpx;color: #272727;}
  428. &.bimga{padding: 16rpx 0;}
  429. .imgs{display: flex;align-items: center;justify-content: center;width: 48rpx;height: 48rpx;margin-bottom: 18rpx;position: relative;
  430. .imga{width: 48rpx;height: 38rpx;}
  431. .imgb{width: 48rpx;height: 46rpx;}
  432. .imgc{width: 44rpx;height: 48rpx;}
  433. .imgd{width: 48rpx;height: 42rpx;}
  434. .imge{width: 46rpx;height: 46rpx;}
  435. .imgf{width: 48rpx;height: 48rpx;}
  436. .imgg{width: 42rpx;height: 48rpx;}
  437. .imgh{width: 44rpx;height: 44rpx;}
  438. .imgi{width: 48rpx;height: 44rpx;}
  439. .tips{position: absolute;min-width: 20rpx;top: -4rpx;left: 36rpx;box-sizing: border-box;
  440. 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;
  441. }
  442. }
  443. }
  444. }
  445. .upbox{display: flex;align-items: center;justify-content: center;flex-direction: column;margin-top: 8rpx;padding-top: 8rpx;margin-bottom: 6rpx;
  446. image{width: 24rpx;height: 20rpx;margin-bottom: 8rpx;transition: all 0.3s;
  447. &.zhe{transform: rotate(-180deg);}
  448. }
  449. view{font-weight: 500;font-size: 22rpx;color: #AAAAAA;}
  450. }
  451. }
  452. </style>