Commit 42ba3a51 authored by 郭铭瑶's avatar 郭铭瑶 🤘

界面调整

parent 7ba61613
...@@ -34,7 +34,7 @@ html, body ...@@ -34,7 +34,7 @@ html, body
-moz-osx-font-smoothing grayscale -moz-osx-font-smoothing grayscale
width 100% width 100%
height 100% height 100%
font-size 1rem font-size 1.01rem
overflow: hidden overflow: hidden
color #eee color #eee
......
...@@ -303,10 +303,10 @@ export default { ...@@ -303,10 +303,10 @@ export default {
legend: { legend: {
width: '100%', width: '100%',
data: [], data: [],
itemWidth: this.fontSize * 1.1, itemWidth: this.fontSize * 1.5,
textStyle: { textStyle: {
color: '#ccc', color: '#ccc',
fontSize: this.fontSize * 0.9, fontSize: this.fontSize,
}, },
}, },
tooltip: { tooltip: {
...@@ -324,7 +324,7 @@ export default { ...@@ -324,7 +324,7 @@ export default {
textStyle: { textStyle: {
color: '#ccc', color: '#ccc',
}, },
fontSize: this.fontSize * 0.9, fontSize: this.fontSize,
}, },
axisLine: { axisLine: {
lineStyle: { lineStyle: {
......
...@@ -5,7 +5,7 @@ import Vue from 'vue' ...@@ -5,7 +5,7 @@ import Vue from 'vue'
import App from './App' import App from './App'
import router from './router' import router from './router'
import store from './store' import store from './store'
import {Row, Col, Select, Option, DatePicker, Message, Carousel, CarouselItem, Tooltip, Icon, Circle} from 'view-design' import {Row, Col, Select, Option, DatePicker, Tooltip, Icon, Circle, Tabs, TabPane} from 'view-design'
import ajax from '@/server/ajax' import ajax from '@/server/ajax'
import api from '@/server/api' import api from '@/server/api'
import common from '@/util/common' import common from '@/util/common'
...@@ -20,18 +20,17 @@ Vue.prototype.$ajax = ajax ...@@ -20,18 +20,17 @@ Vue.prototype.$ajax = ajax
Vue.prototype.$api = api Vue.prototype.$api = api
Vue.prototype.$com = common Vue.prototype.$com = common
Vue.prototype.$moment = moment Vue.prototype.$moment = moment
Vue.prototype.$Message = Message // 添加全局提示
Vue.use(MonitorComponents) Vue.use(MonitorComponents)
Vue.component('Row', Row) Vue.component('Row', Row)
Vue.component('i-col', Col) Vue.component('i-col', Col)
Vue.component('Select', Select) Vue.component('Select', Select)
Vue.component('Option', Option) Vue.component('Option', Option)
Vue.component('DatePicker', DatePicker) Vue.component('DatePicker', DatePicker)
Vue.component('Carousel', Carousel)
Vue.component('CarouselItem', CarouselItem)
Vue.component('Tooltip', Tooltip) Vue.component('Tooltip', Tooltip)
Vue.component('Icon', Icon) Vue.component('Icon', Icon)
Vue.component('i-circle', Circle) Vue.component('i-circle', Circle)
Vue.component('Tabs', Tabs)
Vue.component('TabPane', TabPane)
/* eslint-disable no-new */ /* eslint-disable no-new */
new Vue({ new Vue({
......
...@@ -5,11 +5,13 @@ case 'production': ...@@ -5,11 +5,13 @@ case 'production':
break break
default: default:
// BASE_URL = 'http://yapi.omniview.pro/mock/54/propertyinspector/api/v1/' // BASE_URL = 'http://yapi.omniview.pro/mock/54/propertyinspector/api/v1/'
BASE_URL = 'http://www.962121.net/hmfmstest/shanghaiwuye/propertyinspector/api/v1' // BASE_URL = 'http://www.962121.net/hmfmstest/shanghaiwuye/propertyinspector/api/v1'
BASE_URL = 'http://hm.omniview.pro/api/service-special'
}; };
export default { export default {
BASE_URL, BASE_URL,
POST_CHECKCOMMUNITY_LIST:'sharingplatform/sectListForOneDay', //物业督查---每一个主题下某天已检查的小区列表 POST_CHECKCOMMUNITY_LIST:'sharingplatform/sectListForOneDay', //物业督查---每一个主题下某天已检查的小区列表
POST_CHECKPEOPLE_LIST:'sharingplatform/getInspectors', // 检查人员列表 POST_CHECKPEOPLE_LIST:'sharingplatform/getInspectors', // 检查人员列表
GET_SENSOR: '/public/sensor/discover'
} }
...@@ -57,13 +57,13 @@ export default { ...@@ -57,13 +57,13 @@ export default {
] ]
const REPAIRLIST = [ // 报修投诉 const REPAIRLIST = [ // 报修投诉
{ {
title:'报修', title:'报修数量',
img:'repair.png', img:'repair.png',
num:'15', num:'15',
allNum: '348', allNum: '348',
}, },
{ {
title:'投诉', title:'投诉数量',
img:'complaint.png', img:'complaint.png',
num:'26', num:'26',
allNum: '248', allNum: '248',
...@@ -270,13 +270,13 @@ export default { ...@@ -270,13 +270,13 @@ export default {
] ]
const REPAIRLIST = [ // 报修投诉 const REPAIRLIST = [ // 报修投诉
{ {
title:'报修', title:'报修数量',
img:'repair.png', img:'repair.png',
num:'2', num:'2',
allNum: '38', allNum: '38',
}, },
{ {
title:'投诉', title:'投诉数量',
img:'complaint.png', img:'complaint.png',
num:'6', num:'6',
allNum: '48', allNum: '48',
...@@ -592,13 +592,13 @@ export default { ...@@ -592,13 +592,13 @@ export default {
] ]
const REPAIRLIST = [ // 报修投诉 const REPAIRLIST = [ // 报修投诉
{ {
title:'报修', title:'报修数量',
img:'repair.png', img:'repair.png',
num:'1', num:'1',
allNum: '3', allNum: '3',
}, },
{ {
title:'投诉', title:'投诉数量',
img:'complaint.png', img:'complaint.png',
num:'1', num:'1',
allNum: '5', allNum: '5',
...@@ -924,13 +924,13 @@ export default { ...@@ -924,13 +924,13 @@ export default {
] ]
const REPAIRLIST = [ // 报修投诉 const REPAIRLIST = [ // 报修投诉
{ {
title:'报修', title:'报修数量',
img:'repair.png', img:'repair.png',
num:'1', num:'1',
allNum: '3', allNum: '3',
}, },
{ {
title:'投诉', title:'投诉数量',
img:'complaint.png', img:'complaint.png',
num:'1', num:'1',
allNum: '5', allNum: '5',
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
:unit="data.unit" :unit="data.unit"
countColor="#00f2ff" countColor="#00f2ff"
labelColor="#61c2f3" labelColor="#61c2f3"
:icon="require(`@/assets/images/${data.img}`)"/> :icon="data.img ? require(`@/assets/images/${data.img}`) : null"/>
</div> </div>
</template> </template>
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
:count="+data.num" :count="+data.num"
:unit="data.unit" :unit="data.unit"
countColor="gold" countColor="gold"
size="1.2rem" size="1.4rem"
/> />
<div class="d-list"> <div class="d-list">
<div <div
...@@ -66,7 +66,7 @@ export default { ...@@ -66,7 +66,7 @@ export default {
align-items center align-items center
width 80% width 80%
color #fff color #fff
font-size 0.8rem font-size 0.9rem
font-weight normal font-weight normal
>img >img
width 1.25rem width 1.25rem
......
<template> <template>
<div class="govern-analysis" @mouseenter="auto = false" @mouseleave="auto = true" > <div class="govern-analysis">
<Carousel v-model="cur" :autoplay="auto" :autoplay-speed="5000" dots="none"> <div @click="$emit('select', item.name)" class="item" v-for="item in datas" :key="item.name">
<CarouselItem> <img src="@/assets/images/icon1.png"/>
<div class="content"> <p>{{item.name}}</p>
<div class="title">物业服务满意度得分较低项目</div> </div>
<div><p>定期公布维修资金使用项目</p><p>76.02</p></div>
<div><p>定期公布公共收益项目</p><p>76.82</p></div>
<div><p>对违法搭建、群租问题定期巡视、发现</p><p>77.61</p></div>
<div><p>投诉及时回复</p><p>79.59</p></div>
<div><p>提供便民服务或特约服务</p><p>79.81</p></div>
<div><p>建筑垃圾有制定堆放点</p><p>80.34</p></div>
</div>
</CarouselItem>
<CarouselItem>
<div class="content">
<div class="title">物业服务企业整体满意度倒数企业</div>
<div><p>上海豫园旅游商城物业管理有限公司</p><p>67.18</p></div>
<div><p>上海华夏物业有限公司</p><p>69.74</p></div>
<div><p>上海振南物业有限公司</p><p>75.29</p></div>
<div><p>上海霞悦物业管理有限公司</p><p>77.71</p></div>
<div><p>上海东方明珠物产管理有限公司</p><p>78.27</p></div>
<div><p>上海富宁物业管理有限公司</p><p>79.51</p></div>
</div>
</CarouselItem>
<CarouselItem>
<div class="chart-wrapper">
<p class="title">南码头街道业委会运作情况</p>
<m-chart :config="operationConfig" :data="operationData" />
</div>
</CarouselItem>
<CarouselItem>
<div class="card">
<p class="title">南码头街道12345诉求数量全市排名</p>
<div class="inner">
<div v-for="(item, i) in list" :key="i">
<p>{{item.title}}</p>
<p>
<b><m-count style="color:#00f2ff;font-size:1.2rem;" :value="item.count" :decimal="0"/></b>
<span v-if="item.unit">{{item.unit}}</span>
<i v-if="item.info">{{item.info}}</i>
</p>
</div>
</div>
</div>
</CarouselItem>
<CarouselItem>
<div class="chart-wrapper">
<p class="title">南码头街道综合管理诉求二级指标占比</p>
<m-chart :config="manageConfig" :data="manageData" />
</div>
</CarouselItem>
</Carousel>
</div> </div>
</template> </template>
...@@ -59,82 +12,12 @@ export default { ...@@ -59,82 +12,12 @@ export default {
name: 'GovernAnalysis', name: 'GovernAnalysis',
data() { data() {
return { return {
auto: true, datas: [
cur: 0, {name: '物业服务满意度得分较低项目'},
list: [ {name: '物业服务企业整体满意度倒数企业'},
{ {name: '南码头街道业委会运作情况'},
title: '2019诉求量', {name: '南码头街道12345诉求数量全市排名'},
count: 1582, {name: '南码头街道综合管理诉求二级指标占比'},
unit: '件',
},
{
title: '数量变化',
count: 115,
unit: '%',
},
{
title: '全市排名',
count: 41,
info: '较去年+51',
},
{
title: '2019诉求密度',
count: 46,
unit: '件',
},
{
title: '密度变化',
count: 112,
unit: '%',
},
{
title: '全市排名',
count: 17,
info: '较去年+70',
},
],
operationConfig: {
colors: [['#a45cd1', '#3e29b1'], ['#00f2fe', '#007eff']],
legend: {
align: 'right',
},
shape: [
{key: 'nanmatou', name: '南码头', type: 'bar', barWidth: '30%'},
{key: 'pudong', name: '浦东总体', type: 'bar', barWidth: '30%'},
],
xAxis: {
key: 'name',
},
},
operationData: [
{name: '规范', pudong: 24.87, nanmatou: 31.38},
{name: '正常', pudong: 45.93, nanmatou: 36.49},
{name: '还可以', pudong: 25.87, nanmatou: 26.83},
{name: '不正常', pudong: 1.06, nanmatou: 0},
{name: '不了解', pudong: 2.27, nanmatou: 5.29},
],
manageConfig: {
grid: {
right: '1%',
},
legend: {
align: 'right',
orient: 'vertical',
},
shape: [
{key: 'value', type: 'pie', center: ['20%', '50%'], radius: [15, 65], roseType: 'area',},
],
},
manageData: [
{name: '公共秩序、环境维护', value: 36.17},
{name: '非物业类', value: 34.57},
{name: '公用设施养护', value: 8.88},
{name: '物业服务规范', value: 7.04},
{name: '业委会、业主大会', value: 5.14},
{name: '自用部位维修', value: 4.89},
{name: '物业使用规范', value: 2.09},
{name: '维修资金管理', value: 1.21},
// {name: '其他', value: 47.9},
], ],
} }
...@@ -143,64 +26,19 @@ export default { ...@@ -143,64 +26,19 @@ export default {
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
$title()
margin 1rem 0
font-size 1.1rem
text-align center
// font-weight bold
.govern-analysis .govern-analysis
width 100% width 100%
height 100% height 100%
.chart-wrapper display flex
width 100% flex-wrap wrap
height 100% .item
.title display flex
$title() width 50%
.content cursor pointer
width 100% &:hover
height 96% color $color-blue
div img
display flex width 1.2rem
align-items center height @width
justify-content space-between margin .3rem .5rem 0 0
padding .3rem .5rem
background rgba(0,0,0,0.5)
margin-bottom .5rem
&.title
$title()
justify-content center
background none
>p
&:last-child
color $edgeColor
// font-weight bold
.card
.title
$title()
margin-bottom .5rem
.inner
display flex
flex-wrap wrap
>div
width 33%
text-align center
margin-top 1rem
>p
color #8fb6fb
span
color #fff
i
color red
</style>
<style lang="stylus">
.govern-analysis
.ivu-carousel
height 100%
.ivu-carousel-list
height 100%
.ivu-carousel-track
height 100%
.ivu-carousel-item
height 90% !important
</style> </style>
<template> <template>
<div class="manage-issue"> <div class="manage-issue">
<div class="circle-wrapper" :style="`height: ${showList ? '40%' : ''}`"> <div class="circle-wrapper">
<i-circle <i-circle
v-for="circle in circles" v-for="circle in circles"
:key="circle.title" :key="circle.title"
:percent="circle.count" :percent="circle.count"
:size="85 * sizeRate" :size="90 * sizeRate"
:trail-width="2 * sizeRate" :trail-width="2 * sizeRate"
:stroke-width="6 * sizeRate" :stroke-width="6 * sizeRate"
trail-color="gray" trail-color="gray"
...@@ -16,14 +16,19 @@ ...@@ -16,14 +16,19 @@
</div> </div>
</i-circle> </i-circle>
</div> </div>
<div class="list" v-if="showList"> <Tabs value="all" size="small" @on-click="handleClick">
<TabPane label="管理提醒" name="all"/>
<TabPane label="安全类" name="安全"/>
<TabPane label="有序类" name="有序"/>
<TabPane label="干净类" name="干净"/>
</Tabs>
<div class="list">
<div <div
class="item" class="item"
v-for="item in list" v-for="item in datas"
:key="item.name" :key="item.name"
> >
<span class="title"> <span class="title">
<img src="@/assets/images/xf.png"/>
{{item.name}} {{item.name}}
</span> </span>
<span :style="+item.count !== 0 ? 'color:red' : ''">{{item.count}}</span> <span :style="+item.count !== 0 ? 'color:red' : ''">{{item.count}}</span>
...@@ -35,48 +40,71 @@ ...@@ -35,48 +40,71 @@
<script> <script>
export default { export default {
name: 'ManageIssue', name: 'ManageIssue',
props: {
showList: {
type: Boolean,
default: false,
}
},
data() { data() {
return { return {
circles: [ circles: [
{ {
title: '安全', title: '安全',
count: 40, count: 40,
color: '#fee902', color: '#fee902',
}, },
{ {
title: '有序', title: '有序',
count: 80, count: 80,
color: '#01a7ff', color: '#01a7ff',
}, },
{ {
title: '干净', title: '干净',
count: 19, count: 19,
color: '#8fd618', color: '#8fd618',
}, },
], ],
datas: [],
} }
}, },
mounted() {
this.datas = this.list
},
computed: { computed: {
list() { list() {
let data = require('../../../static/govern-issue.json')
if (this.$route.name === 'linyiercun') { if (this.$route.name === 'linyiercun') {
return require('../../../static/govern-linyi.json') data = require('../../../static/govern-linyi.json')
} else {
return require('../../../static/govern-issue.json')
} }
return data.sort((a, b) => b.count - a.count)
}, },
sizeRate() { sizeRate() {
return Math.floor(screen.height * 1.48 / 100 / 10) return Math.floor(screen.height * 1.48 / 100 / 10)
}, },
}, },
methods: {
handleClick(name) {
if (name === 'all') {
this.datas = this.list
return
}
this.datas = this.list.filter(item => item.type == name)
}
},
} }
</script> </script>
<style lang="stylus">
$blue = #3391FF
.manage-issue
.ivu-tabs-bar
margin-bottom 0.5rem
border-bottom .1rem solid $color-map()
.ivu-tabs-nav
.ivu-tabs-ink-bar
background-color $edgeColor
.ivu-tabs-tab
font-size 1rem
padding 0.3rem 0.5rem
color $blue
&.ivu-tabs-tab-active
color #fff
background $blue
</style>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.manage-issue .manage-issue
width 100% width 100%
...@@ -87,17 +115,15 @@ export default { ...@@ -87,17 +115,15 @@ export default {
.circle-wrapper .circle-wrapper
display flex display flex
align-items center align-items center
height 100% height 40%
justify-content space-around justify-content space-around
margin-bottom .5rem
.list .list
display flex
flex-wrap wrap
// height 60%
flex 1 flex 1
overflow-y auto overflow-y auto
.item .item
float left
width 49% width 49%
height 3rem
background-color rgba(6,27,50,0.9) background-color rgba(6,27,50,0.9)
margin 0.1rem margin 0.1rem
padding 0 .7rem padding 0 .7rem
...@@ -105,17 +131,10 @@ export default { ...@@ -105,17 +131,10 @@ export default {
justify-content space-between justify-content space-between
align-items center align-items center
span span
color gold
font-weight 700 font-weight 700
&.title &.title
display flex
align-items center
width 80% width 80%
color #fff color #fff
font-size 0.8rem font-size 0.9rem
font-weight normal font-weight normal
>img
width 1.25rem
height 1.25rem
margin-right 0.8rem
</style> </style>
...@@ -24,8 +24,8 @@ export default { ...@@ -24,8 +24,8 @@ export default {
} }
} }
return { return {
left: '1%', left: '0',
bottom: '1%', bottom: '0',
} }
} }
} }
......
...@@ -6,10 +6,10 @@ ...@@ -6,10 +6,10 @@
:key="i" :key="i"
:label="data.title" :label="data.title"
:icon="require(`@/assets/images/${data.img}`) " :icon="require(`@/assets/images/${data.img}`) "
:unit="`/ ${data.allNum}`" :unit="`/ ${data.allNum}`"
:count="+data.num" :count="+data.num"
countColor="gold" countColor="gold"
size="1.2rem" size="1.4rem"
/> />
</div> </div>
</template> </template>
...@@ -28,5 +28,6 @@ export default { ...@@ -28,5 +28,6 @@ export default {
height 100% height 100%
.card .card
width 50% width 50%
padding-left 1rem
</style> </style>
...@@ -7,11 +7,10 @@ ...@@ -7,11 +7,10 @@
'box2 . box5', 'box2 . box5',
'box8 . box3', 'box8 . box3',
'box8 . box10', 'box8 . box10',
'box8 . box6', 'box6 box7 box9',
'box9 box7 box6',
]" ]"
columns="1fr 2fr 1fr" columns="1fr 2fr 1fr"
rows="3rem 1fr 1fr 1fr 1.5fr 1.5fr 0.5fr 2fr" rows="3rem 1fr 1fr 1fr 1.5fr 1.5fr 1.9fr"
gap="0.5rem" gap="0.5rem"
style="padding: 0.5rem" style="padding: 0.5rem"
:complete="complete" :complete="complete"
...@@ -32,7 +31,7 @@ ...@@ -32,7 +31,7 @@
<m-card v-show="complete" area="box10" title="辅助应用" mode="4"> <m-card v-show="complete" area="box10" title="辅助应用" mode="4">
<Application @elevator="showEleMap = true"/> <Application @elevator="showEleMap = true"/>
</m-card> </m-card>
<m-card v-show="complete" area="box9" enter="fadeInLeft" leave="fadeOutLeft" title="视频监控" mode="4"> <m-card v-show="complete" area="box9" title="视频监控" mode="4">
<div style="display:flex;height:100%;padding:0.3rem;justify-content:space-between;"> <div style="display:flex;height:100%;padding:0.3rem;justify-content:space-between;">
<ImgContainer style="width:48%;" text="小区入口岗亭" src="gate1.png"/> <ImgContainer style="width:48%;" text="小区入口岗亭" src="gate1.png"/>
<ImgContainer style="width:48%;" text="小区入口岗亭" src="gate2.png"/> <ImgContainer style="width:48%;" text="小区入口岗亭" src="gate2.png"/>
...@@ -44,7 +43,7 @@ ...@@ -44,7 +43,7 @@
<m-card v-show="complete" area="box3" title="投诉报修" mode="4"> <m-card v-show="complete" area="box3" title="投诉报修" mode="4">
<Repair /> <Repair />
</m-card> </m-card>
<m-card v-show="complete" area="box6" title="重点工作智能提示" mode="4" :width="50"> <m-card v-show="complete" area="box6" enter="fadeInLeft" leave="fadeOutLeft" title="重点工作智能提示" mode="4" :width="50">
<div v-if="complete" class="analysis-wrapper"> <div v-if="complete" class="analysis-wrapper">
<div v-for="item in remindList" :key="item.title" @click="handleViewRemind(item.key)"> <div v-for="item in remindList" :key="item.title" @click="handleViewRemind(item.key)">
<p><img src="@/assets/images/home.png"/>{{item.title}}</p> <p><img src="@/assets/images/home.png"/>{{item.title}}</p>
...@@ -74,12 +73,9 @@ ...@@ -74,12 +73,9 @@
<m-modal v-model="showEleMap" width="90%" title="电梯加装地图"> <m-modal v-model="showEleMap" width="90%" title="电梯加装地图">
<iframe style="width:100%;min-height:80vh;background:#fff;" src="http://211.136.105.193/elev/#/?name=南码头" frameborder="0"/> <iframe style="width:100%;min-height:80vh;background:#fff;" src="http://211.136.105.193/elev/#/?name=南码头" frameborder="0"/>
</m-modal> </m-modal>
<m-modal v-model="showImgModal" title="图片">
<img v-if="showImgModal" style="width: 100%;" :src="require(`@/assets/images/${curImg}`)" />
</m-modal>
<m-modal v-model="showEventModal" title="事件详情"> <m-modal v-model="showEventModal" title="事件详情">
<m-form v-if="showEventModal" title="基本信息" :label-width="8" :model="eventData" :layout="eventLayout"/> <m-form v-if="showEventModal" title="基本信息" :label-width="8" :model="eventData" :layout="eventLayout"/>
<img v-if="showEventModal" style="width:100%;" :src="require(`@/assets/images/${eventData.img}`)"/> <img v-if="showEventModal" style="width:100%;" :src="eventData.img ? require(`@/assets/images/${eventData.img}`) : null"/>
</m-modal> </m-modal>
</m-grid> </m-grid>
</template> </template>
...@@ -124,10 +120,6 @@ export default { ...@@ -124,10 +120,6 @@ export default {
curTitle: '', curTitle: '',
complete: false, complete: false,
showEleMap: false, showEleMap: false,
curTab: 0,
curImg: '',
showImgModal: false,
// images: ['d1.png', 'd2.png', 'd3.png', 'd4.png', 'd5.png', 'd6.png', 'd7.png'],
remindList: [ remindList: [
{key: 'linyi', title: '临沂二村', total: 17, detail: [ {key: 'linyi', title: '临沂二村', total: 17, detail: [
{title: '屋顶漏水', num: 6}, {title: '屋顶漏水', num: 6},
...@@ -166,18 +158,15 @@ export default { ...@@ -166,18 +158,15 @@ export default {
], ],
remindData: [], remindData: [],
showEventModal: false, showEventModal: false,
eventData: { eventData: {},
name: 'test',
des: 'test'
},
eventLayout: [ eventLayout: [
{ {
type: { type: {
label: '预警类型', label: '预警类型',
width: 12, width: 12,
}, },
method: { addr: {
label: '发现方式', label: '地址',
width: 12, width: 12,
} }
} }
...@@ -203,12 +192,12 @@ export default { ...@@ -203,12 +192,12 @@ export default {
}, },
handleMapClick({layername, data}) { handleMapClick({layername, data}) {
switch (layername) { switch (layername) {
case 'community': // 当点击图层为小区时 case 'sensor':
const {X, Y} = data[0] const {x, y} = data[0]
const {map} = this.$refs const {map} = this.$refs
map.removeGifPoint('selected-point') // 先移除已点击的点 map.removeGifPoint('selected-point') // 先移除已点击的点
map.focus(X, Y, 9) map.focus(x, y, 9)
map.addGifPoint({name: 'selected-point', key: 'COMMUNITYID', labelKey: 'COMMUNITYNAME', data: data[0], icon: 'yellow.png'}) map.addGifPoint({name: 'selected-point', key: 'id', data: data[0], icon: 'yellow.png'})
this.handleEventModal(data[0]) this.handleEventModal(data[0])
break break
default: default:
...@@ -220,22 +209,25 @@ export default { ...@@ -220,22 +209,25 @@ export default {
this.remindData = data[key] this.remindData = data[key]
this.remindModal = true this.remindModal = true
}, },
handleEventModal({msg}) { handleEventModal({type, addr}) {
this.eventData = msg this.eventData = {img: null, type, addr}
this.showEventModal = true this.showEventModal = true
}, },
clickCommunity(data){
console.log(data)
},
addPoints() { addPoints() {
const data = [ // const data = [
{TASKID:'(补)临沂二村', COMMUNITYID: '(补)临沂二村', msg: {img: '1.png', type: '屋顶违建', method: '物联传感'}, X: 3706.690186, Y: -4234.159912}, // {TASKID:'(补)临沂二村', COMMUNITYID: '(补)临沂二村', msg: {img: '1.png', type: '屋顶违建', method: '物联传感'}, X: 3706.690186, Y: -4234.159912},
{TASKID:'铭城园', COMMUNITYID: '铭城园', msg: {img: '2.png', type: '非定时倾倒垃圾', method: '物联传感'}, X: 3787.49700927734, Y: -4072.19757080078}, // {TASKID:'铭城园', COMMUNITYID: '铭城园', msg: {img: '2.png', type: '非定时倾倒垃圾', method: '物联传感'}, X: 3787.49700927734, Y: -4072.19757080078},
{TASKID:'海浦小区', COMMUNITYID: '海浦小区', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3750.58459472656, Y: -3983.67626953125}, // {TASKID:'海浦小区', COMMUNITYID: '海浦小区', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3750.58459472656, Y: -3983.67626953125},
{TASKID:'浦三路12弄', COMMUNITYID: '浦三路12弄', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3731.8646240234375, Y: -4073.232177734375}, // {TASKID:'浦三路12弄', COMMUNITYID: '浦三路12弄', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3731.8646240234375, Y: -4073.232177734375},
{TASKID:'4号大楼', COMMUNITYID: '4号大楼', msg: {img: '3.png', type: '集中充电异常', method: '视频识别'}, X: 3706.68023681641, Y: -4030.7874558594}, // {TASKID:'4号大楼', COMMUNITYID: '4号大楼', msg: {img: '3.png', type: '集中充电异常', method: '视频识别'}, X: 3706.68023681641, Y: -4030.7874558594},
] // ]
this.$refs.map.addPoint({name: 'community', key: 'COMMUNITYID', data: data, icon: 'yellow.png'}) // this.$refs.map.addPoint({name: 'community', key: 'COMMUNITYID', data: data, icon: 'yellow.png'})
this.$ajax.get({
url: this.$api.GET_SENSOR,
}).then(res => {
const sensorList = this.$com.confirm(res, 'data.content', [])
this.$refs.map.addPoint({name: 'sensor', key: 'id', data: sensorList, icon: 'yellow.png'})
})
}, },
handleStreetSelect(index, name) { handleStreetSelect(index, name) {
if (name === '临沂二村') return if (name === '临沂二村') return
...@@ -245,10 +237,6 @@ export default { ...@@ -245,10 +237,6 @@ export default {
} }
this.$router.push({path: '/'}) this.$router.push({path: '/'})
}, },
handleViewImg(img) {
this.curImg = img
this.showImgModal = true
},
...mapActions([ ...mapActions([
'initData', 'initData',
'initNanmatouData', 'initNanmatouData',
...@@ -266,10 +254,10 @@ export default { ...@@ -266,10 +254,10 @@ export default {
>div >div
display flex display flex
align-items center align-items center
padding 0.2rem 0 0.2rem 0.3rem padding 0 0 0 0.3rem
cursor pointer cursor pointer
background rgba(6,27,50,0.9) &:nth-child(2n+1)
margin-bottom .4rem background rgba(6,27,50,0.9)
&:hover &:hover
color $color-blue color $color-blue
p p
......
...@@ -4,10 +4,10 @@ ...@@ -4,10 +4,10 @@
'title title title', 'title title title',
'box1 . box5', 'box1 . box5',
'box2 . box5', 'box2 . box5',
'box6 . box3', 'box8 . box3',
'box6 . box4', 'box8 . box4',
'box6 . box10', 'box8 . box10',
'box8 box7 box9', 'box6 box7 box9',
]" ]"
columns="1fr 2fr 1fr" columns="1fr 2fr 1fr"
rows="3rem 1fr 1.5fr 1fr 1fr 1.3fr 1.8fr" rows="3rem 1fr 1.5fr 1fr 1fr 1.3fr 1.8fr"
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
<EmergencyCommand @changeMode="changeMode"/> <EmergencyCommand @changeMode="changeMode"/>
</m-card> </m-card>
<m-card v-show="complete" enter="fadeInLeft" leave="fadeOutLeft" area="box2" title="基础数据" mode="4"> <m-card v-show="complete" enter="fadeInLeft" leave="fadeOutLeft" area="box2" title="基础数据" mode="4">
<Operation @select="handleSelect" /> <Operation />
</m-card> </m-card>
<m-card v-show="complete" enter="fadeInLeft" leave="fadeOutLeft" area="box8" title="管理要素" mode="4" btn="list"> <m-card v-show="complete" enter="fadeInLeft" leave="fadeOutLeft" area="box8" title="管理要素" mode="4" btn="list">
<ManageIssue /> <ManageIssue />
...@@ -68,7 +68,7 @@ ...@@ -68,7 +68,7 @@
<Repair /> <Repair />
</m-card> </m-card>
<m-card v-show="complete" area="box4" title="督查提醒" mode="4"> <m-card v-show="complete" area="box4" title="督查提醒" mode="4">
<Supervision @clickCommunity="clickCommunity"/> <Supervision />
</m-card> </m-card>
<m-card v-show="complete" area="box9" title="视频监控" mode="4"> <m-card v-show="complete" area="box9" title="视频监控" mode="4">
<div style="display:flex;height:100%;padding:0.3rem;justify-content:space-between;"> <div style="display:flex;height:100%;padding:0.3rem;justify-content:space-between;">
...@@ -83,14 +83,7 @@ ...@@ -83,14 +83,7 @@
<Application @elevator="showEleMap = true"/> <Application @elevator="showEleMap = true"/>
</m-card> </m-card>
<m-card v-show="complete" enter="fadeInLeft" leave="fadeOutLeft" area="box6" title="治理分析" mode="4"> <m-card v-show="complete" enter="fadeInLeft" leave="fadeOutLeft" area="box6" title="治理分析" mode="4">
<GovernAnalysis v-if="complete"/> <GovernAnalysis @select="(name) => {this.showAnalysisDetail = true; this.analysisTitle = name;}" v-if="complete"/>
<!-- <div class="analysis-wrapper">
<Carousel v-if="complete" autoplay v-model="curTab" @on-click="handleViewImg(images[$event])" loop :autoplay-speed="5000">
<CarouselItem v-for="img in images" :key="img">
<img style="width:100%;height:100%;display:block;" :src="require(`@/assets/images/${img}`)" />
</CarouselItem>
</Carousel>
</div> -->
</m-card> </m-card>
<m-card v-show="complete" enter="fadeInUp" leave="fadeOutDown" area="box7" title="联勤联动动态流程" mode="4" :width="25"> <m-card v-show="complete" enter="fadeInUp" leave="fadeOutDown" area="box7" title="联勤联动动态流程" mode="4" :width="25">
<Handle v-if="complete"/> <Handle v-if="complete"/>
...@@ -109,6 +102,49 @@ ...@@ -109,6 +102,49 @@
<m-modal v-model="showImgModal" title="图片"> <m-modal v-model="showImgModal" title="图片">
<img v-if="showImgModal" style="width: 100%;" :src="require(`@/assets/images/${curImg}`)" /> <img v-if="showImgModal" style="width: 100%;" :src="require(`@/assets/images/${curImg}`)" />
</m-modal> </m-modal>
<m-modal v-model="showAnalysisDetail" title="治理分析">
<div class="analysis-modal">
<div v-if="analysisTitle == '物业服务满意度得分较低项目'" class="content">
<div class="title">物业服务满意度得分较低项目</div>
<div><p>定期公布维修资金使用项目</p><p>76.02</p></div>
<div><p>定期公布公共收益项目</p><p>76.82</p></div>
<div><p>对违法搭建、群租问题定期巡视、发现</p><p>77.61</p></div>
<div><p>投诉及时回复</p><p>79.59</p></div>
<div><p>提供便民服务或特约服务</p><p>79.81</p></div>
<div><p>建筑垃圾有制定堆放点</p><p>80.34</p></div>
</div>
<div v-else-if="analysisTitle == '物业服务企业整体满意度倒数企业'" class="content">
<div class="title">物业服务企业整体满意度倒数企业</div>
<div><p>上海豫园旅游商城物业管理有限公司</p><p>67.18</p></div>
<div><p>上海华夏物业有限公司</p><p>69.74</p></div>
<div><p>上海振南物业有限公司</p><p>75.29</p></div>
<div><p>上海霞悦物业管理有限公司</p><p>77.71</p></div>
<div><p>上海东方明珠物产管理有限公司</p><p>78.27</p></div>
<div><p>上海富宁物业管理有限公司</p><p>79.51</p></div>
</div>
<div v-else-if="analysisTitle == '南码头街道业委会运作情况'" class="chart-wrapper">
<p class="title">南码头街道业委会运作情况</p>
<m-chart :config="operationConfig" :data="operationData" />
</div>
<div v-else-if="analysisTitle == '南码头街道12345诉求数量全市排名'" class="card">
<p class="title">南码头街道12345诉求数量全市排名</p>
<div class="inner">
<div v-for="(item, i) in list" :key="i">
<p>{{item.title}}</p>
<p>
<b><m-count style="color:#00f2ff;font-size:1.2rem;" :value="item.count" :decimal="0"/></b>
<span v-if="item.unit">{{item.unit}}</span>
<i v-if="item.info">{{item.info}}</i>
</p>
</div>
</div>
</div>
<div v-else-if="analysisTitle == '南码头街道综合管理诉求二级指标占比'" class="chart-wrapper">
<p class="title">南码头街道综合管理诉求二级指标占比</p>
<m-chart :config="manageConfig" :data="manageData" />
</div>
</div>
</m-modal>
</m-grid> </m-grid>
</template> </template>
...@@ -156,10 +192,8 @@ export default { ...@@ -156,10 +192,8 @@ export default {
showModeMenu: false, showModeMenu: false,
complete: false, complete: false,
showEleMap: false, showEleMap: false,
curTab: 0,
curImg: '', curImg: '',
showImgModal: false, showImgModal: false,
images: ['c1.png', 'c2.png', 'c3.png', 'c4.png', 'c5.png', 'c6.png'],
personList: [ personList: [
{name: '张三', phone: '13764650559'}, {name: '张三', phone: '13764650559'},
{name: '李四', phone: '13764330559'}, {name: '李四', phone: '13764330559'},
...@@ -174,6 +208,80 @@ export default { ...@@ -174,6 +208,80 @@ export default {
{name: '王五', phone: '13764633559'}, {name: '王五', phone: '13764633559'},
{name: '赵六', phone: '13394650559'}, {name: '赵六', phone: '13394650559'},
], ],
showAnalysisDetail: false,
analysisTitle: null,
list: [
{
title: '2019诉求量',
count: 1582,
unit: '件',
},
{
title: '数量变化',
count: 115,
unit: '%',
},
{
title: '全市排名',
count: 41,
info: '较去年+51',
},
{
title: '2019诉求密度',
count: 46,
unit: '件',
},
{
title: '密度变化',
count: 112,
unit: '%',
},
{
title: '全市排名',
count: 17,
info: '较去年+70',
},
],
operationConfig: {
colors: [['#a45cd1', '#3e29b1'], ['#00f2fe', '#007eff']],
legend: {
align: 'right',
},
shape: [
{key: 'nanmatou', name: '南码头', type: 'bar', barWidth: '30%'},
{key: 'pudong', name: '浦东总体', type: 'bar', barWidth: '30%'},
],
xAxis: {
key: 'name',
},
},
operationData: [
{name: '规范', pudong: 24.87, nanmatou: 31.38},
{name: '正常', pudong: 45.93, nanmatou: 36.49},
{name: '还可以', pudong: 25.87, nanmatou: 26.83},
{name: '不正常', pudong: 1.06, nanmatou: 0},
{name: '不了解', pudong: 2.27, nanmatou: 5.29},
],
manageConfig: {
legend: {
align: 'right',
orient: 'vertical',
},
shape: [
{key: 'value', type: 'pie', center: ['30%', '40%'], radius: [20, 110], roseType: 'area',},
],
},
manageData: [
{name: '公共秩序、环境维护', value: 36.17},
{name: '非物业类', value: 34.57},
{name: '公用设施养护', value: 8.88},
{name: '物业服务规范', value: 7.04},
{name: '业委会、业主大会', value: 5.14},
{name: '自用部位维修', value: 4.89},
{name: '物业使用规范', value: 2.09},
{name: '维修资金管理', value: 1.21},
// {name: '其他', value: 47.9},
],
} }
}, },
methods: { methods: {
...@@ -217,12 +325,6 @@ export default { ...@@ -217,12 +325,6 @@ export default {
this.complete = false this.complete = false
this.emergencyMode = true this.emergencyMode = true
}, },
handleSelect(data) {
console.log(data)
},
clickCommunity(data){
console.log(data)
},
handleStreetSelect(index, name) { handleStreetSelect(index, name) {
if (name === '临沂二村') { if (name === '临沂二村') {
this.$router.push({path: '/linyiercun'}) this.$router.push({path: '/linyiercun'})
...@@ -288,18 +390,6 @@ export default { ...@@ -288,18 +390,6 @@ export default {
} }
</script> </script>
<style lang="stylus">
.analysis-wrapper
width 100%
height 100%
overflow hidden
.ivu-carousel
height 100%
overflow hidden
img
height 100%
width 100%
</style>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.mode-btn .mode-btn
display block display block
...@@ -346,11 +436,50 @@ export default { ...@@ -346,11 +436,50 @@ export default {
img img
width 1rem width 1rem
height @width height @width
.analysis-wrapper
width 100% $title()
height 100% margin 1rem 0
overflow hidden font-size 1.2rem
img text-align center
.analysis-modal
.chart-wrapper
width 100%
height 40vh
.title
$title()
.content
width 100% width 100%
height 80% height 96%
div
display flex
align-items center
justify-content space-between
padding .5rem 1rem
background rgba(0,0,0,0.3)
margin-bottom 1rem
&.title
$title()
justify-content center
background none
>p
&:last-child
color $edgeColor
// font-weight bold
.card
.title
$title()
margin-bottom 1rem
.inner
display flex
flex-wrap wrap
>div
width 33%
text-align center
margin-top 2rem
>p
color #8fb6fb
span
color #fff
i
color red
</style> </style>
...@@ -7,11 +7,10 @@ ...@@ -7,11 +7,10 @@
'box2 . box5', 'box2 . box5',
'box8 . box3', 'box8 . box3',
'box8 . box10', 'box8 . box10',
'box8 . box6', 'box6 box7 box9',
'box9 box7 box6',
]" ]"
columns="1fr 2fr 1fr" columns="1fr 2fr 1fr"
rows="3rem 1fr 1fr 1fr 1.5fr 1.5fr 0.5fr 2fr" rows="3rem 1fr 1fr 1fr 1.5fr 1.5fr 1.9fr"
gap="0.5rem" gap="0.5rem"
style="padding: 0.5rem" style="padding: 0.5rem"
:complete="complete" :complete="complete"
...@@ -32,7 +31,7 @@ ...@@ -32,7 +31,7 @@
<m-card v-show="complete" area="box10" title="辅助应用" mode="4"> <m-card v-show="complete" area="box10" title="辅助应用" mode="4">
<Application @elevator="showEleMap = true"/> <Application @elevator="showEleMap = true"/>
</m-card> </m-card>
<m-card v-show="complete" area="box9" enter="fadeInLeft" leave="fadeOutLeft" title="视频监控" mode="4"> <m-card v-show="complete" area="box9" title="视频监控" mode="4">
<div style="display:flex;height:100%;padding:0.3rem;justify-content:space-between;"> <div style="display:flex;height:100%;padding:0.3rem;justify-content:space-between;">
<ImgContainer style="width:48%;" text="小区入口岗亭" src="gate1.png"/> <ImgContainer style="width:48%;" text="小区入口岗亭" src="gate1.png"/>
<ImgContainer style="width:48%;" text="小区入口岗亭" src="gate2.png"/> <ImgContainer style="width:48%;" text="小区入口岗亭" src="gate2.png"/>
...@@ -44,7 +43,7 @@ ...@@ -44,7 +43,7 @@
<m-card v-show="complete" area="box3" title="投诉报修" mode="4"> <m-card v-show="complete" area="box3" title="投诉报修" mode="4">
<Repair /> <Repair />
</m-card> </m-card>
<m-card v-show="complete" area="box6" title="重点工作智能提示" mode="4" :width="50"> <m-card v-show="complete" area="box6" enter="fadeInLeft" leave="fadeOutLeft" title="重点工作智能提示" mode="4" :width="50">
<div v-if="complete" class="analysis-wrapper"> <div v-if="complete" class="analysis-wrapper">
<div v-for="item in remindList" :key="item.title" @click="handleViewRemind(item.key)"> <div v-for="item in remindList" :key="item.title" @click="handleViewRemind(item.key)">
<p><img src="@/assets/images/home.png"/>{{item.title}}</p> <p><img src="@/assets/images/home.png"/>{{item.title}}</p>
...@@ -74,12 +73,9 @@ ...@@ -74,12 +73,9 @@
<m-modal v-model="showEleMap" width="90%" title="电梯加装地图"> <m-modal v-model="showEleMap" width="90%" title="电梯加装地图">
<iframe style="width:100%;min-height:80vh;background:#fff;" src="http://211.136.105.193/elev/#/?name=南码头" frameborder="0"/> <iframe style="width:100%;min-height:80vh;background:#fff;" src="http://211.136.105.193/elev/#/?name=南码头" frameborder="0"/>
</m-modal> </m-modal>
<m-modal v-model="showImgModal" title="图片">
<img v-if="showImgModal" style="width: 100%;" :src="require(`@/assets/images/${curImg}`)" />
</m-modal>
<m-modal v-model="showEventModal" title="事件详情"> <m-modal v-model="showEventModal" title="事件详情">
<m-form v-if="showEventModal" title="基本信息" :label-width="8" :model="eventData" :layout="eventLayout"/> <m-form v-if="showEventModal" title="基本信息" :label-width="8" :model="eventData" :layout="eventLayout"/>
<img v-if="showEventModal" style="width:100%;" :src="require(`@/assets/images/${eventData.img}`)"/> <img v-if="showEventModal" style="width:100%;" :src="eventData.img ? require(`@/assets/images/${eventData.img}`) : null"/>
</m-modal> </m-modal>
</m-grid> </m-grid>
</template> </template>
...@@ -124,10 +120,6 @@ export default { ...@@ -124,10 +120,6 @@ export default {
curTitle: '', curTitle: '',
complete: false, complete: false,
showEleMap: false, showEleMap: false,
curTab: 0,
curImg: '',
showImgModal: false,
// images: ['d1.png', 'd2.png', 'd3.png', 'd4.png', 'd5.png', 'd6.png', 'd7.png'],
remindList: [ remindList: [
{key: 'linyi', title: '临沂二村', total: 17, detail: [ {key: 'linyi', title: '临沂二村', total: 17, detail: [
{title: '屋顶漏水', num: 6}, {title: '屋顶漏水', num: 6},
...@@ -166,18 +158,15 @@ export default { ...@@ -166,18 +158,15 @@ export default {
], ],
remindData: [], remindData: [],
showEventModal: false, showEventModal: false,
eventData: { eventData: {},
name: 'test',
des: 'test'
},
eventLayout: [ eventLayout: [
{ {
type: { type: {
label: '预警类型', label: '预警类型',
width: 12, width: 12,
}, },
method: { addr: {
label: '发现方式', label: '地址',
width: 12, width: 12,
} }
} }
...@@ -205,12 +194,12 @@ export default { ...@@ -205,12 +194,12 @@ export default {
}, },
handleMapClick({layername, data}) { handleMapClick({layername, data}) {
switch (layername) { switch (layername) {
case 'community': // 当点击图层为小区时 case 'sensor':
const {X, Y} = data[0] const {x, y} = data[0]
const {map} = this.$refs const {map} = this.$refs
map.removeGifPoint('selected-point') // 先移除已点击的点 map.removeGifPoint('selected-point') // 先移除已点击的点
map.focus(X, Y, 9) map.focus(x, y, 9)
map.addGifPoint({name: 'selected-point', key: 'COMMUNITYID', labelKey: 'COMMUNITYNAME', data: data[0], icon: 'yellow.png'}) map.addGifPoint({name: 'selected-point', key: 'id', data: data[0], icon: 'yellow.png'})
this.handleEventModal(data[0]) this.handleEventModal(data[0])
break break
default: default:
...@@ -222,22 +211,25 @@ export default { ...@@ -222,22 +211,25 @@ export default {
this.remindData = data[key] this.remindData = data[key]
this.remindModal = true this.remindModal = true
}, },
handleEventModal({msg}) { handleEventModal({type, addr}) {
this.eventData = msg this.eventData = {img: null, type, addr}
this.showEventModal = true this.showEventModal = true
}, },
clickCommunity(data){
console.log(data)
},
addPoints() { addPoints() {
const data = [ // const data = [
{TASKID:'(补)临沂二村', COMMUNITYID: '(补)临沂二村', msg: {img: '1.png', type: '屋顶违建', method: '物联传感'}, X: 3706.690186, Y: -4234.159912}, // {TASKID:'(补)临沂二村', COMMUNITYID: '(补)临沂二村', msg: {img: '1.png', type: '屋顶违建', method: '物联传感'}, X: 3706.690186, Y: -4234.159912},
{TASKID:'铭城园', COMMUNITYID: '铭城园', msg: {img: '2.png', type: '非定时倾倒垃圾', method: '物联传感'}, X: 3787.49700927734, Y: -4072.19757080078}, // {TASKID:'铭城园', COMMUNITYID: '铭城园', msg: {img: '2.png', type: '非定时倾倒垃圾', method: '物联传感'}, X: 3787.49700927734, Y: -4072.19757080078},
{TASKID:'海浦小区', COMMUNITYID: '海浦小区', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3750.58459472656, Y: -3983.67626953125}, // {TASKID:'海浦小区', COMMUNITYID: '海浦小区', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3750.58459472656, Y: -3983.67626953125},
{TASKID:'浦三路12弄', COMMUNITYID: '浦三路12弄', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3731.8646240234375, Y: -4073.232177734375}, // {TASKID:'浦三路12弄', COMMUNITYID: '浦三路12弄', msg: {img: '4.png', type: '楼道充电', method: '视频识别'}, X: 3731.8646240234375, Y: -4073.232177734375},
{TASKID:'4号大楼', COMMUNITYID: '4号大楼', msg: {img: '3.png', type: '集中充电异常', method: '视频识别'}, X: 3706.68023681641, Y: -4030.7874558594}, // {TASKID:'4号大楼', COMMUNITYID: '4号大楼', msg: {img: '3.png', type: '集中充电异常', method: '视频识别'}, X: 3706.68023681641, Y: -4030.7874558594},
] // ]
this.$refs.map.addPoint({name: 'community', key: 'COMMUNITYID', data: data, icon: 'yellow.png'}) // this.$refs.map.addPoint({name: 'community', key: 'COMMUNITYID', data: data, icon: 'yellow.png'})
this.$ajax.get({
url: this.$api.GET_SENSOR,
}).then(res => {
const sensorList = this.$com.confirm(res, 'data.content', [])
this.$refs.map.addPoint({name: 'sensor', key: 'id', data: sensorList, icon: 'yellow.png'})
})
}, },
handleStreetSelect(index, name) { handleStreetSelect(index, name) {
if (name === '申江豪城') return if (name === '申江豪城') return
...@@ -247,10 +239,6 @@ export default { ...@@ -247,10 +239,6 @@ export default {
} }
this.$router.push({path: '/'}) this.$router.push({path: '/'})
}, },
handleViewImg(img) {
this.curImg = img
this.showImgModal = true
},
...mapActions([ ...mapActions([
'initData', 'initData',
'initNanmatouData', 'initNanmatouData',
...@@ -268,10 +256,10 @@ export default { ...@@ -268,10 +256,10 @@ export default {
>div >div
display flex display flex
align-items center align-items center
padding 0.2rem 0 0.2rem 0.3rem padding 0 0 0 0.3rem
cursor pointer cursor pointer
background rgba(6,27,50,0.9) &:nth-child(2n+1)
margin-bottom .4rem background rgba(6,27,50,0.9)
&:hover &:hover
color $color-blue color $color-blue
p p
......
[{ [{
"name": "供水、供电、供气异常", "name": "供水、供电、供气异常",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "电梯运行异常", "name": "电梯运行异常",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "占用消防通道", "name": "占用消防通道",
"type": "安全",
"count": 2 "count": 2
}, { }, {
"name": "违规充电", "name": "违规充电",
"type": "安全",
"count": 2 "count": 2
}, { }, {
"name": "损坏房屋承重结构", "name": "损坏房屋承重结构",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "违规租赁行为", "name": "违规租赁行为",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "违法搭建", "name": "违法搭建",
"type": "有序",
"count": 1 "count": 1
}, { }, {
"name": "垃圾分类违规", "name": "垃圾分类违规",
"type": "干净",
"count": 0 "count": 0
}, { }, {
"name": "高空坠物隐患", "name": "高空坠物隐患",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "消防设施设备异常", "name": "消防设施设备异常",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "噪音扰民", "name": "噪音扰民",
"type": "有序",
"count": 1 "count": 1
}, { }, {
"name": "空调安装违规", "name": "空调安装违规",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "毁绿占绿", "name": "毁绿占绿",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "擅自改变物业使用性质", "name": "擅自改变物业使用性质",
"type": "有序",
"count": 1 "count": 1
}, { }, {
"name": "物业交接矛盾", "name": "物业交接矛盾",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "乱收费", "name": "乱收费",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "破坏房屋外貌", "name": "破坏房屋外貌",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "擅自改建、占用共用部位", "name": "擅自改建、占用共用部位",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "停车矛盾", "name": "停车矛盾",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "违规饲养动物", "name": "违规饲养动物",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "维修资金使用异常", "name": "维修资金使用异常",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "建筑垃圾清运违规", "name": "建筑垃圾清运违规",
"type": "干净",
"count": 0 "count": 0
}, { }, {
"name": "乱布线 ", "name": "乱布线 ",
"type": "干净",
"count": 0 "count": 0
}, { }, {
"name": "楼道小广告", "name": "楼道小广告",
"type": "干净",
"count": 0 "count": 0
}] }]
[{ [{
"name": "供水、供电、供气异常", "name": "供水、供电、供气异常",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "电梯运行异常", "name": "电梯运行异常",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "占用消防通道", "name": "占用消防通道",
"type": "安全",
"count": 1 "count": 1
}, { }, {
"name": "违规充电", "name": "违规充电",
"type": "安全",
"count": 1 "count": 1
}, { }, {
"name": "损坏房屋承重结构", "name": "损坏房屋承重结构",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "违规租赁行为", "name": "违规租赁行为",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "违法搭建", "name": "违法搭建",
"type": "有序",
"count": 1 "count": 1
}, { }, {
"name": "垃圾分类违规", "name": "垃圾分类违规",
"type": "干净",
"count": 1 "count": 1
}, { }, {
"name": "高空坠物隐患", "name": "高空坠物隐患",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "消防设施设备异常", "name": "消防设施设备异常",
"type": "安全",
"count": 0 "count": 0
}, { }, {
"name": "噪音扰民", "name": "噪音扰民",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "空调安装违规", "name": "空调安装违规",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "毁绿占绿", "name": "毁绿占绿",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "擅自改变物业使用性质", "name": "擅自改变物业使用性质",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "物业交接矛盾", "name": "物业交接矛盾",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "乱收费", "name": "乱收费",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "破坏房屋外貌", "name": "破坏房屋外貌",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "擅自改建、占用共用部位", "name": "擅自改建、占用共用部位",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "停车矛盾", "name": "停车矛盾",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "违规饲养动物", "name": "违规饲养动物",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "维修资金使用异常", "name": "维修资金使用异常",
"type": "有序",
"count": 0 "count": 0
}, { }, {
"name": "建筑垃圾清运违规", "name": "建筑垃圾清运违规",
"type": "干净",
"count": 0 "count": 0
}, { }, {
"name": "乱布线 ", "name": "乱布线 ",
"type": "干净",
"count": 0 "count": 0
}, { }, {
"name": "楼道小广告", "name": "楼道小广告",
"type": "干净",
"count": 0 "count": 0
}] }]
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment