Skip to content

Y
yangpu
Commit d3ab7ef4 authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

完善

parent baf61f9f
Show whitespace changes
Inline Side-by-side
Showing with 371 additions and 97 deletions
src/components/MonitorComponents/MonitorTitle/monitor-title.vue
View file @ d3ab7ef4
...@@ -15,8 +15,8 @@ ...@@ -15,8 +15,8 @@
</div> </div>
<div class="duty"> <div class="duty">
今日值班： 今日值班：
<p>李明良<img src="@/assets/images/phone.png" /></p> <p>{{masters[0]}}<img src="@/assets/images/phone.png" /></p>
<p>方芳<img src="@/assets/images/phone.png" /></p> <p>{{masters[1]}}<img src="@/assets/images/phone.png" /></p>
</div> </div>
<span v-if="!hideTime" class="moment time"> <span v-if="!hideTime" class="moment time">
<!-- <span class="switch"><img src="@/assets/images/switch.png"/> 切换街道</span> --> <!-- <span class="switch"><img src="@/assets/images/switch.png"/> 切换街道</span> -->
...@@ -88,7 +88,12 @@ export default { ...@@ -88,7 +88,12 @@ export default {
return this.$moment(date).isAfter(this.$moment()) return this.$moment(date).isAfter(this.$moment())
} }
} }
} },
masters() {
const {currentStreetInfo, streetInfo} = this.$store.state
const {master1, master2} = streetInfo[currentStreetInfo.id]
return [master1, master2]
},
}, },
methods: { methods: {
handleDateChange(date) { handleDateChange(date) {
......
src/store/actions.js
View file @ d3ab7ef4
...@@ -120,13 +120,13 @@ export default { ...@@ -120,13 +120,13 @@ export default {
url: api.GET_DISCOVER_INFO, url: api.GET_DISCOVER_INFO,
params: {streetId}, params: {streetId},
}).then(res => { }).then(res => {
const sum = {total: 0, today: 0} const sum = {done: 0, today: 0}
const data = com.confirm(res, 'data.content', []) const data = com.confirm(res, 'data.content', [])
const keys = ['accCtl', 'heap', 'nonVehicleCharg', 'streetMonitor'] const keys = ['accCtl', 'heap', 'nonVehicleCharg', 'streetMonitor']
// const keys = ['heap', 'parkFireExit', 'nonVehicleCharg', 'buildingVibration', 'trash', 'manholeCover', 'waterTank', 'roofWater', 'hermeticSpace', 'accCtl', 'streetMonitor'] // const keys = ['heap', 'parkFireExit', 'nonVehicleCharg', 'buildingVibration', 'trash', 'manholeCover', 'waterTank', 'roofWater', 'hermeticSpace', 'accCtl', 'streetMonitor']
const result = data.filter(item => keys.indexOf(item.types) >= 0) const result = data.filter(item => keys.indexOf(item.types) >= 0)
result.forEach(e => { result.forEach(e => {
sum.total += +e.total sum.done += +e.done
sum.today += +e.numbers sum.today += +e.numbers
}) })
commit('SET_DISCOVER_SUM', sum) commit('SET_DISCOVER_SUM', sum)
......
src/store/state.js
View file @ d3ab7ef4
...@@ -106,6 +106,152 @@ export default { ...@@ -106,6 +106,152 @@ export default {
handleList: [], handleList: [],
doneList: [], doneList: [],
repairInfo: [[0, 0], [0, 0]], repairInfo: [[0, 0], [0, 0]],
populationInfo: {
310110013000: {
total: 70195,
pie: [
{name: '0～14岁', value: 3923},
{name: '15～64岁', value: 55722},
{name: '65岁以上', value: 10550},
],
bar: [
{name: '男', value: 35741},
{name: '女', value: 34454},
]
},
310110020000: {
total: 27251,
pie: [
{name: '0～14岁', value: 2557},
{name: '15～64岁', value: 23420},
{name: '65岁以上', value: 1274},
],
bar: [
{name: '男', value: 15564},
{name: '女', value: 11687},
]
},
310110001000: {
total: 100480,
pie: [
{name: '0～14岁', value: 6299},
{name: '15～64岁', value: 82583},
{name: '65岁以上', value: 11598},
],
bar: [
{name: '男', value: 53745},
{name: '女', value: 46735},
]
},
310110006000: {
total: 85870,
pie: [
{name: '0～14岁', value: 5271},
{name: '15～64岁', value: 69092},
{name: '65岁以上', value: 11507},
],
bar: [
{name: '男', value: 44384},
{name: '女', value: 41486},
]
},
310110008000: {
total: 95382,
pie: [
{name: '0～14岁', value: 6655},
{name: '15～64岁', value: 75506},
{name: '65岁以上', value: 13221},
],
bar: [
{name: '男', value: 47687},
{name: '女', value: 47695},
]
},
310110009000: {
total: 92505,
pie: [
{name: '0～14岁', value: 5074},
{name: '15～64岁', value: 73085},
{name: '65岁以上', value: 14346},
],
bar: [
{name: '男', value: 47488},
{name: '女', value: 45017},
]
},
310110012000: {
total: 105613,
pie: [
{name: '0～14岁', value: 7158},
{name: '15～64岁', value: 82567},
{name: '65岁以上', value: 15888},
],
bar: [
{name: '男', value: 51742},
{name: '女', value: 53871},
]
},
310110015000: {
total: 90334,
pie: [
{name: '0～14岁', value: 4645},
{name: '15～64岁', value: 68558},
{name: '65岁以上', value: 17131},
],
bar: [
{name: '男', value: 44289},
{name: '女', value: 46045},
]
},
310110016000: {
total: 192554,
pie: [
{name: '0～14岁', value: 11174},
{name: '15～64岁', value: 152631},
{name: '65岁以上', value: 28749},
],
bar: [
{name: '男', value: 96510},
{name: '女', value: 96044},
]
},
310110018000: {
total: 124954,
pie: [
{name: '0～14岁', value: 7852},
{name: '15～64岁', value: 100928},
{name: '65岁以上', value: 16174},
],
bar: [
{name: '男', value: 63143},
{name: '女', value: 61811},
]
},
310110019000: {
total: 149090,
pie: [
{name: '0～14岁', value: 9891},
{name: '15～64岁', value: 122668},
{name: '65岁以上', value: 16531},
],
bar: [
{name: '男', value: 73882},
{name: '女', value: 75208},
]
},
310110101000: {
total: 178994,
pie: [
{name: '0～14岁', value: 14648},
{name: '15～64岁', value: 145778},
{name: '65岁以上', value: 18568},
],
bar: [
{name: '男', value: 90599},
{name: '女', value: 88395},
]
},
},
streetInfo: { streetInfo: {
310110020000: { 310110020000: {
num: 190, num: 190,
......
src/views/components/city-environment.vue
View file @ d3ab7ef4
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
</div> </div>
<div> <div>
<m-count class="count" :value="item.value" :decimal="item.decimal" /> <m-count class="count" :value="item.value" :decimal="item.decimal" />
<span class="unit">{{item.unit}}</span> <span class="unit"> {{item.unit}}</span>
</div> </div>
</div> </div>
</div> </div>
...@@ -16,18 +16,19 @@ ...@@ -16,18 +16,19 @@
<script> <script>
export default { export default {
name: 'CityEnvironment', name: 'CityEnvironment',
data() { computed: {
return { list() {
list: [ const [a={value: 0}, b={value: 0}, c={value: 0}] = this.$store.state.greenInfo
return [
{title: '空气质量', value: 91.1, unit: '%优良率', decimal: 1, icon: 'city1.png'}, {title: '空气质量', value: 91.1, unit: '%优良率', decimal: 1, icon: 'city1.png'},
{title: 'PM2.5', value: 32, unit: '微克/㎡', decimal: 0, icon: 'city2.png'}, {title: 'PM2.5', value: 32, unit: '微克/㎡', decimal: 0, icon: 'city2.png'},
{title: '人均绿地', value: 91.1, unit: '㎡/人', decimal: 2, icon: 'city3.png'}, {title: '人均绿地', value: 91.1, unit: '㎡/人', decimal: 2, icon: 'city3.png'},
{title: '环卫公厕', value: 9, unit: '个', decimal: 0, icon: 'city4.png'}, {title: '环卫公厕', value: a.value, unit: '个', decimal: 0, icon: 'city4.png'},
{title: '生活垃圾收集', value: 98, unit: '个', decimal: 0, icon: 'city5.png'}, {title: '生活垃圾收集', value: b.value, unit: '个', decimal: 0, icon: 'city5.png'},
{title: '小型压缩站', value: 34, unit: '个', decimal: 0, icon: 'city6.png'}, {title: '小型压缩站', value: c.value, unit: '个', decimal: 0, icon: 'city6.png'},
] ]
} }
}, }
} }
</script> </script>
...@@ -39,6 +40,10 @@ export default { ...@@ -39,6 +40,10 @@ export default {
height 100% height 100%
>div >div
width 33.3% width 33.3%
height 50%
display flex
flex-direction column
justify-content center
>div >div
display flex display flex
align-items center align-items center
......
src/views/components/left-component.vue
View file @ d3ab7ef4
<template> <template>
<div class="left-component"> <div class="left-component">
<div class="left"> <div class="left">
<m-card title="街道基数"></m-card> <m-card title="街道基数"><StreetBasic /></m-card>
<m-card title="城市环境"><CityEnvironment /></m-card> <m-card title="城市环境"><CityEnvironment /></m-card>
<m-card title="土地人口"><LandPopulation /></m-card> <m-card title="土地人口"><LandPopulation /></m-card>
</div> </div>
...@@ -17,6 +17,7 @@ import LandPopulation from './land-population' ...@@ -17,6 +17,7 @@ import LandPopulation from './land-population'
import Defense from './defense' import Defense from './defense'
import CityEnvironment from './city-environment' import CityEnvironment from './city-environment'
import Property from './property-score' import Property from './property-score'
import StreetBasic from './street-basic'
export default { export default {
name: 'LeftComponent', name: 'LeftComponent',
components: { components: {
...@@ -24,6 +25,7 @@ export default { ...@@ -24,6 +25,7 @@ export default {
Defense, Defense,
CityEnvironment, CityEnvironment,
Property, Property,
StreetBasic,
}, },
data() { data() {
return {} return {}
...@@ -39,14 +41,15 @@ export default { ...@@ -39,14 +41,15 @@ export default {
height calc(100vh - 0.5rem) height calc(100vh - 0.5rem)
position relative position relative
>div >div
width 50% // width 50%
width calc(33.3vw / 2)
height 100% height 100%
&.left &.left
>div >div
&:nth-child(1) &:nth-child(1)
height 50% height 45%
&:nth-child(2) &:nth-child(2)
height 20% height 25%
&:nth-child(3) &:nth-child(3)
height 30% height 30%
&.right &.right
......
src/views/components/property-score.vue
View file @ d3ab7ef4
...@@ -129,33 +129,18 @@ export default { ...@@ -129,33 +129,18 @@ export default {
return Number((screen.height / 800).toFixed(1)) return Number((screen.height / 800).toFixed(1))
}, },
chartData() { chartData() {
return [
18.1,
19.9,
15.5,
17.2,
16.1
]
// const {creditScore, propertyWarrantyScore, communityManagementScore, ownerSatisfactionScore, monthCheck} = this.$store.state.healthInfo
// return [
// +creditScore.county || 0,
// +propertyWarrantyScore.county || 0,
// +communityManagementScore.county || 0,
// +ownerSatisfactionScore.county || 0,
// +monthCheck.county || 0,
// ]
},
total() {
const {id} = this.$store.state.currentStreetInfo const {id} = this.$store.state.currentStreetInfo
const {creditScore, propertyWarrantyScore, communityManagementScore, ownerSatisfactionScore, monthCheck} = this.$store.state.healthInfo const {creditScore, propertyWarrantyScore, communityManagementScore, ownerSatisfactionScore, monthCheck} = this.$store.state.healthInfo
const list = [ return [
+creditScore[id + ''] || 0, +creditScore[id + ''] || 0,
+propertyWarrantyScore[id + ''] || 0, +propertyWarrantyScore[id + ''] || 0,
+communityManagementScore[id + ''] || 0, +communityManagementScore[id + ''] || 0,
+ownerSatisfactionScore[id + ''] || 0, +ownerSatisfactionScore[id + ''] || 0,
+monthCheck[id + ''] || 0, +monthCheck[id + ''] || 0,
] ]
return list.reduce((cur, acc) => cur + acc, 0) },
total() {
return this.chartData.reduce((cur, acc) => cur + acc, 0)
}, },
switchColor() { switchColor() {
if (this.total >= 75) { if (this.total >= 75) {
......
src/views/components/smart-discover.vue
View file @ d3ab7ef4
...@@ -68,10 +68,10 @@ export default { ...@@ -68,10 +68,10 @@ export default {
return this.$store.state.curSmartType return this.$store.state.curSmartType
}, },
sum() { sum() {
const {total, today} = this.$store.state.discoverSum const {done, today} = this.$store.state.discoverSum
return [ return [
{name: '当日新增', value: today || 0, img: 'today-new.png', color: '#ffd400'}, {name: '当日新增', value: today || 0, img: 'today-new.png', color: '#ffd400'},
{name: '当日关闭', value: total || 0, img: 'today-close.png', color: '#01BFFD'}, {name: '当日关闭', value: done || 0, img: 'today-close.png', color: '#01BFFD'},
] ]
}, },
list() { list() {
......
src/views/components/street-basic.vue
View file @ d3ab7ef4
<template> <template>
<div class="street-basic"> <div class="street-basic">
<div>
<p class="title">
<img src="@/assets/images/icon7.png" />
实有人口
<m-count class="count" :value="curData.total" :decimal="0" />
<span class="unit">人</span>
</p>
<div class="chart" v-if="showChart">
<m-chart :config="config" :data="curData.pie" :options="options" />
</div>
<div class="chart" v-if="showChart">
<m-chart :config="config2" :data="curData.bar" />
</div>
</div>
<div>
<p class="title">
<img src="@/assets/images/icon8.png" />
实有住户
<m-count class="count" :value="list[1].value" :decimal="0" />
<span class="unit">户</span>
</p>
<div class="sum">
<div v-for="item in list" :key="item.name">
<m-count class="count" :value="item.value" :decimal="item.dec || 0" />
<p>{{item.name}}（{{item.unit}}）</p>
</div>
</div>
</div>
</div> </div>
</template> </template>
...@@ -8,11 +35,114 @@ ...@@ -8,11 +35,114 @@
export default { export default {
name: 'StreetBasic', name: 'StreetBasic',
data() { data() {
return {} return {
showChart: false,
config: {
colors: ['#5bd4ff', '#72c011', '#fece35', '#ff6160', '#826bfa', '#cccccc'],
tooltip: {
formatter: '{b}：{c}人 ({d}%)',
confine: true,
},
legend: {
align: 'left',
orient: 'vertical',
},
shape: [
{type: 'pie', radius: [20 * Number((screen.height / 800).toFixed(1)), 40 * Number((screen.height / 800).toFixed(1))], center: ['75%', '50%']}
]
},
config2: {
colors: ['#826bfa', '#cccccc'],
legend: {hide: true},
shape: [
{key: 'value', type: 'bar', barWidth: '30%', barGap: '20%'},
],
xAxis: {
key: 'name',
}
},
options: {
legend: {
top: '10%',
// formatter: (name) => {
// // const data = this.$store.state.repairRate
// // return `${name} ${(data.find(e => e.name === name)).value}件`
// const data = this.$store.state.repairRate
// let total = 0
// let tarValue
// for (let i = 0; i < data.length; i++) {
// total += data[i].value
// if (data[i].name === name) {
// tarValue = data[i].value
// }
// }
// const percent = (tarValue / total * 100).toFixed(0)
// return `${name} ${percent}%`
// }
}
}
}
},
mounted() {
setTimeout(() => this.showChart = true, 100)
},
computed: {
list() {
const {community, house, area} = this.$store.state.resourceSum
return [
{name: '小区数量', unit: '个', value: +community || 0},
{name: '总户数', unit: '户', value: +house || 0},
// {name: '物业企业', unit: '个', value: +company || 0},
{name: '管理面积', unit: '㎡', value: +area || 0},
]
},
curData() {
const {currentStreetInfo, populationInfo} = this.$store.state
return populationInfo[currentStreetInfo.id]
},
}, },
} }
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.street-basic
width 100%
height 100%
display flex
flex-direction column
justify-content space-around
.title
display flex
align-items center
margin-bottom .1rem
img
width .15rem
height @width
margin-right .1rem
.count
font-size .12rem
margin-left .1rem
.unit
font-size .08rem
color #999
.sum
display flex
justify-content space-between
>div
width 30%
min-height .5rem
background $cardBg
$flex-center()
flex-direction column
box-shadow inset 0 0 .1rem 0 rgba(71,179,255,.2)
.count
font-size 0.12rem
p
font-size .09rem
color $cardFontColor
.chart
display inline-block
width 49%
height 14vh
margin-top .1rem
</style> </style>
src/views/main.vue
View file @ d3ab7ef4
...@@ -30,9 +30,9 @@ ...@@ -30,9 +30,9 @@
<m-modal v-model="doneModal" title="已完成处置"> <m-modal v-model="doneModal" title="已完成处置">
<DoneComponent v-if="doneModal" :data="doneData" /> <DoneComponent v-if="doneModal" :data="doneData" />
</m-modal> </m-modal>
<m-modal v-model="patrolModal" title="主动巡检"> <!-- <m-modal v-model="patrolModal" title="主动巡检">
<m-form :label-width=".6" :model="patrolData" :layout="patrolLayout" /> <m-form :label-width=".6" :model="patrolData" :layout="patrolLayout" />
</m-modal> </m-modal> -->
<m-modal title="指挥体系" :value="showCommandModal" @close="$store.commit('SET_COMMAND_MODAL', false)"> <m-modal title="指挥体系" :value="showCommandModal" @close="$store.commit('SET_COMMAND_MODAL', false)">
<m-form :label-width=".7" :model="streetInfo[currentStreetInfo.id]" :layout="streetInfo[currentStreetInfo.id].layout" /> <m-form :label-width=".7" :model="streetInfo[currentStreetInfo.id]" :layout="streetInfo[currentStreetInfo.id].layout" />
</m-modal> </m-modal>
...@@ -67,11 +67,11 @@ export default { ...@@ -67,11 +67,11 @@ export default {
videoModal: false, videoModal: false,
videoSrc: null, videoSrc: null,
detailModal: false, detailModal: false,
patrolModal: false, // patrolModal: false,
smartPoints: null, smartPoints: null,
patrolPoints: null, // patrolPoints: null,
detailData: {}, detailData: {},
patrolData: {}, // patrolData: {},
detailLayout: [ detailLayout: [
{ {
communityName: { communityName: {
...@@ -102,44 +102,44 @@ export default { ...@@ -102,44 +102,44 @@ export default {
}, },
}, },
], ],
patrolLayout: [ // patrolLayout: [
{ // {
communityName: { // communityName: {
label: '小区名称', // label: '小区名称',
width: 12, // width: 12,
}, // },
orderTypeName: { // orderTypeName: {
label: '整改事项', // label: '整改事项',
width: 12, // width: 12,
}, // },
}, // },
{ // {
checkTime: { // checkTime: {
label: '发现时间', // label: '发现时间',
width: 12, // width: 12,
}, // },
checkStateName: { // checkStateName: {
label: '整改状态', // label: '整改状态',
width: 12, // width: 12,
}, // },
}, // },
{ // {
checkPersonName: { // checkPersonName: {
label: '上报人', // label: '上报人',
width: 12, // width: 12,
}, // },
hoName: { // hoName: {
label: '房办名称', // label: '房办名称',
width: 12, // width: 12,
}, // },
}, // },
{ // {
tcName: { // tcName: {
label: '检查主题', // label: '检查主题',
width: 24, // width: 24,
}, // },
}, // },
], // ],
doneModal: false, doneModal: false,
doneData: {}, doneData: {},
} }
...@@ -150,7 +150,7 @@ export default { ...@@ -150,7 +150,7 @@ export default {
'streetInfo', 'streetInfo',
'curSmartType', 'curSmartType',
'showCommandModal', 'showCommandModal',
'patrolList', // 'patrolList',
'handleList', 'handleList',
'handleCurTab', 'handleCurTab',
]) ])
...@@ -175,7 +175,7 @@ export default { ...@@ -175,7 +175,7 @@ export default {
'getHandleList', 'getHandleList',
'getDoneList', 'getDoneList',
'getCheckSum', 'getCheckSum',
'getPatrolList', // 'getPatrolList',
'getGridSum', 'getGridSum',
]), ]),
mapComplete() { mapComplete() {
...@@ -188,7 +188,7 @@ export default { ...@@ -188,7 +188,7 @@ export default {
this.getDiscoverInfo() this.getDiscoverInfo()
this.getRepairInfo() this.getRepairInfo()
this.getCheckSum() this.getCheckSum()
this.getPatrolList() // this.getPatrolList()
this.getHandleList() this.getHandleList()
this.getDoneList() this.getDoneList()
}, 1000 * 60 * 1) }, 1000 * 60 * 1)
...@@ -251,16 +251,16 @@ export default { ...@@ -251,16 +251,16 @@ export default {
}, },
}, },
watch: { watch: {
patrolList(cur) { // patrolList(cur) {
const {addPoint, removePoint} = this.$refs.map // const {addPoint, removePoint} = this.$refs.map
removePoint(this.patrolPoints) // removePoint(this.patrolPoints)
this.patrolPoints = addPoint({ // this.patrolPoints = addPoint({
key: 'patrol', // key: 'patrol',
size: 14, // size: 14,
icon: 'red.png', // icon: 'red.png',
data: cur, // data: cur,
}) // })
}, // },
curSmartType(cur) { curSmartType(cur) {
let data = this.handleList let data = this.handleList
if (cur) { if (cur) {
......
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