<template>
|
<view class="">
|
<!-- <u-navbar height="48" :autoBack="true" safeAreaInsetTop placeholder bgColor="transparent" leftIconColor="#fff">
|
</u-navbar> -->
|
<view class="top">
|
<image class="top-img" src="/static/img/repair-bg.png" mode="aspectFill"></image>
|
</view>
|
|
<view class="container">
|
<view class="c-ff f-36">请选择您需要的服务</view>
|
<view class="serve-box bgc-ff mb-20 flex j-c-s-b a-i-c">
|
<view class="flex a-i-c">
|
<u-icon name="/static/icon/nav-09.png" width="91rpx" height="70rpx"></u-icon>
|
<view class="flex f-d-c ml-40">
|
<text class="f-36">总申请</text>
|
<view class="flex a-i-c">
|
<text class="f-48 c-blue fw mr-6">{{count.all}}</text>
|
<text class="f-24 c-99">件</text>
|
</view>
|
</view>
|
</view>
|
<view class="flex a-i-c">
|
<u-icon name="/static/icon/nav-10.png" width="91rpx" height="70rpx"></u-icon>
|
<view class="flex f-d-c ml-40">
|
<text class="f-36">已处理</text>
|
<view class="flex a-i-c">
|
<text class="f-48 c-green fw mr-6">{{count.processed}}</text>
|
<text class="f-24 c-99">件</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<view class="site-box bgc-ff flex" v-if="curSiteInfo.name">
|
<view class="flex a-i-c">
|
<u-icon name="map-fill" color="#AAAAAA"></u-icon>
|
<text class="f-28 c-aa ml-20">当前小区：</text>
|
</view>
|
<text class="address f-28">{{curSiteInfo.name}}</text>
|
</view>
|
|
<!-- <view class="nav flex flex-wrap j-c-s-b" v-if="isNine == 2">
|
<view class="nav-item" v-for="(i,k) in labelList" :key="k" @click="navTo(i.path,k)">
|
<image class="nav-item-bg" :src="i.bgImg" mode="aspectFill"></image>
|
<view class="nav-item-inner flex f-d-c">
|
<text class="f-32 mb-30">{{i.title}}</text>
|
<button class="item-btn" :style="{backgroundColor:i.background}">立即上报</button>
|
</view>
|
</view>
|
</view> -->
|
|
<view class="nav flex flex-wrap j-c-s-b">
|
<view class="nav-item" :key="k" @click="navTo('check')" v-if="isNine == 1">
|
<image class="nav-item-bg" src="/static/icon/nav-bg-12.png" mode="aspectFill"></image>
|
<view class="nav-item-inner flex f-d-c">
|
<text class="f-32 mb-30">消防检查</text>
|
<button class="item-btn" :style="{backgroundColor:'#EC7E51'}">立即上报</button>
|
</view>
|
</view>
|
|
<view class="nav-item" :key="k" @click="navTo('form')" v-if="isFront == 1">
|
<image class="nav-item-bg" src="/static/icon/nav-bg-11.png" mode="aspectFill"></image>
|
<view class="nav-item-inner flex f-d-c">
|
<text class="f-32 mb-30">二手交易</text>
|
<button class="item-btn" :style="{backgroundColor:'#4D98E2'}">立即上报</button>
|
</view>
|
</view>
|
|
</view>
|
|
</view>
|
</view>
|
|
</template>
|
|
<script>
|
import {
|
getReportingCount
|
} from '@/api/reporting/reporting.js'
|
|
export default {
|
data() {
|
return {
|
navList: [
|
// {
|
// title:"取保候审",
|
// bgImg:"/static/icon/nav-bg-10.png",
|
// path:"bail",
|
// background:"#63C875"
|
// },
|
{
|
title: "打金店",
|
bgImg: "/static/icon/nav-bg-11.png",
|
path: "form?type=1",
|
background: "#4D98E2",
|
id: "130808"
|
},
|
{
|
title: "旅馆安全",
|
bgImg: "/static/icon/nav-bg-12.png",
|
path: "hotel",
|
background: "#EC7E51",
|
id: "120101,120102,120103,120104"
|
},
|
{
|
title: "二手车交易",
|
bgImg: "/static/icon/nav-bg-13.png",
|
path: "form?type=3",
|
background: "#F4B862",
|
id: "140304"
|
},
|
{
|
title: "二手手机维修",
|
bgImg: "/static/icon/nav-bg-14.png",
|
path: "form?type=2",
|
background: "#13C6C7",
|
id: "130604"
|
},
|
{
|
title: "校园安全",
|
bgImg: "/static/icon/nav-bg-11.png",
|
path: "school",
|
background: "#4D98E2",
|
id: "160100,160101,160102,160103,160104,160105,160106,160107,160109,160110,160111,160112"
|
}
|
],
|
curSiteInfo: {},
|
count: {},
|
labelList: [],
|
isNine: 2,
|
isNineHotel: false,
|
isFront: 2
|
}
|
},
|
|
onLoad() {
|
|
let siteInfo = uni.getStorageSync("siteInfo");
|
this.curSiteInfo = siteInfo;
|
this.isNine = siteInfo.isNine || 2;
|
this.isFront = siteInfo.isFront || 2;
|
if (siteInfo.isNine == 1) {
|
for (let i of this.navList[1]) {
|
if (i.id.includes(siteInfo.categoryList[0].categoryNo)) {
|
this.isNineHotel = true;
|
}
|
}
|
} else {
|
this.getMenu()
|
}
|
// this.navList = uni.getStorageSync("labelMenuList");
|
|
},
|
|
onShow() {
|
this.getCount(uni.getStorageSync("siteInfo").houseCode);
|
},
|
|
methods: {
|
|
getMenu() {
|
let labelList = this.curSiteInfo.categoryList;
|
let navList = this.navList;
|
let list = []
|
for (let i = 0, ii = labelList.length; i < ii; i++) {
|
for (let k = 0, kk = navList.length; k < kk; k++) {
|
if (navList[k].id.includes(labelList[i].categoryNo)) {
|
list.push(navList[k])
|
}
|
}
|
}
|
this.labelList = list;
|
},
|
|
getCount(code) {
|
getReportingCount({
|
houseCode: code
|
}).then(res => {
|
console.log(res);
|
this.count = res.data;
|
})
|
},
|
|
navTo(path, index) {
|
// let type = 1;
|
// if(index == 1){
|
// type == 1
|
// }else if (index == 3){
|
// type = 3
|
// }else if(index == 4) {
|
// type = 2
|
// }
|
// this.$u.func.globalNavigator(`${path}?type=${type}`, "navTo")
|
this.$u.func.globalNavigator(path, "navTo")
|
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
page {
|
width: 100%;
|
height: 100%;
|
}
|
|
.top {
|
width: 100%;
|
height: 659rpx;
|
background: linear-gradient(180deg, #017BFC 0%, rgba(1, 123, 252, 0) 100%);
|
position: fixed;
|
top: 0;
|
left: 0;
|
|
.top-img {
|
width: 100%;
|
height: 659rpx;
|
}
|
}
|
|
.container {
|
width: 100%;
|
padding: 0 30rpx;
|
position: fixed;
|
box-sizing: border-box;
|
top: 40rpx;
|
left: 0;
|
z-index: 100;
|
|
.serve-box {
|
width: 100%;
|
height: 213rpx;
|
border-radius: 8rpx;
|
margin-top: 30rpx;
|
padding: 0 60rpx 0 40rpx;
|
box-sizing: border-box;
|
}
|
|
.f-48 {
|
font-size: 48rpx;
|
}
|
|
.c-blue {
|
color: #677CF8;
|
|
}
|
|
.c-green {
|
color: #30D17C;
|
}
|
|
.ml-40 {
|
margin-left: 40rpx;
|
}
|
|
.site-box {
|
width: 100%;
|
padding: 30rpx;
|
box-sizing: border-box;
|
border-radius: 4rpx;
|
|
.c-aa {
|
color: #aaa;
|
}
|
|
.address {
|
width: 60%;
|
margin-left: 25rpx;
|
}
|
}
|
|
.nav {
|
width: 100%;
|
|
.nav-item,
|
.nav-item-bg,
|
.nav-item-inner {
|
width: 330rpx;
|
height: 167rpx;
|
}
|
|
.nav-item {
|
position: relative;
|
margin-top: 30rpx;
|
}
|
|
.nav-item-inner {
|
padding: 30rpx 30rpx 0;
|
position: absolute;
|
top: 0;
|
left: 0;
|
|
}
|
|
.item-btn {
|
width: 125rpx;
|
height: 42rpx;
|
line-height: 42rpx;
|
border-radius: 20rpx;
|
color: #fff;
|
font-size: 22rpx;
|
padding: 0;
|
margin: 0;
|
border: none;
|
}
|
|
.item-btn::after {
|
border: none;
|
}
|
}
|
|
}
|
</style>
|
