Commit d3ab7ef4 authored by 郭铭瑶's avatar 郭铭瑶 🤘

完善

parent baf61f9f
......@@ -15,8 +15,8 @@
</div>
<div class="duty">
今日值班:
<p>李明良<img src="@/assets/images/phone.png" /></p>
<p>方芳<img src="@/assets/images/phone.png" /></p>
<p>{{masters[0]}}<img src="@/assets/images/phone.png" /></p>
<p>{{masters[1]}}<img src="@/assets/images/phone.png" /></p>
</div>
<span v-if="!hideTime" class="moment time">
<!-- <span class="switch"><img src="@/assets/images/switch.png"/> 切换街道</span> -->
......@@ -88,7 +88,12 @@ export default {
return this.$moment(date).isAfter(this.$moment())
}
}
}
},
masters() {
const {currentStreetInfo, streetInfo} = this.$store.state
const {master1, master2} = streetInfo[currentStreetInfo.id]
return [master1, master2]
},
},
methods: {
handleDateChange(date) {
......
......@@ -120,13 +120,13 @@ export default {
url: api.GET_DISCOVER_INFO,
params: {streetId},
}).then(res => {
const sum = {total: 0, today: 0}
const sum = {done: 0, today: 0}
const data = com.confirm(res, 'data.content', [])
const keys = ['accCtl', 'heap', 'nonVehicleCharg', 'streetMonitor']
// const keys = ['heap', 'parkFireExit', 'nonVehicleCharg', 'buildingVibration', 'trash', 'manholeCover', 'waterTank', 'roofWater', 'hermeticSpace', 'accCtl', 'streetMonitor']
const result = data.filter(item => keys.indexOf(item.types) >= 0)
result.forEach(e => {
sum.total += +e.total
sum.done += +e.done
sum.today += +e.numbers
})
commit('SET_DISCOVER_SUM', sum)
......
......@@ -106,6 +106,152 @@ export default {
handleList: [],
doneList: [],
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: {
310110020000: {
num: 190,
......
......@@ -7,7 +7,7 @@
</div>
<div>
<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>
......@@ -16,18 +16,19 @@
<script>
export default {
name: 'CityEnvironment',
data() {
return {
list: [
computed: {
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: 'PM2.5', value: 32, unit: '微克/㎡', decimal: 0, icon: 'city2.png'},
{title: '人均绿地', value: 91.1, unit: '㎡/人', decimal: 2, icon: 'city3.png'},
{title: '环卫公厕', value: 9, unit: '个', decimal: 0, icon: 'city4.png'},
{title: '生活垃圾收集', value: 98, unit: '个', decimal: 0, icon: 'city5.png'},
{title: '小型压缩站', value: 34, unit: '个', decimal: 0, icon: 'city6.png'},
{title: '环卫公厕', value: a.value, unit: '个', decimal: 0, icon: 'city4.png'},
{title: '生活垃圾收集', value: b.value, unit: '个', decimal: 0, icon: 'city5.png'},
{title: '小型压缩站', value: c.value, unit: '个', decimal: 0, icon: 'city6.png'},
]
}
},
}
}
</script>
......@@ -39,6 +40,10 @@ export default {
height 100%
>div
width 33.3%
height 50%
display flex
flex-direction column
justify-content center
>div
display flex
align-items center
......
<template>
<div class="left-component">
<div class="left">
<m-card title="街道基数"></m-card>
<m-card title="街道基数"><StreetBasic /></m-card>
<m-card title="城市环境"><CityEnvironment /></m-card>
<m-card title="土地人口"><LandPopulation /></m-card>
</div>
......@@ -17,6 +17,7 @@ import LandPopulation from './land-population'
import Defense from './defense'
import CityEnvironment from './city-environment'
import Property from './property-score'
import StreetBasic from './street-basic'
export default {
name: 'LeftComponent',
components: {
......@@ -24,6 +25,7 @@ export default {
Defense,
CityEnvironment,
Property,
StreetBasic,
},
data() {
return {}
......@@ -39,14 +41,15 @@ export default {
height calc(100vh - 0.5rem)
position relative
>div
width 50%
// width 50%
width calc(33.3vw / 2)
height 100%
&.left
>div
&:nth-child(1)
height 50%
height 45%
&:nth-child(2)
height 20%
height 25%
&:nth-child(3)
height 30%
&.right
......
......@@ -129,33 +129,18 @@ export default {
return Number((screen.height / 800).toFixed(1))
},
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 {creditScore, propertyWarrantyScore, communityManagementScore, ownerSatisfactionScore, monthCheck} = this.$store.state.healthInfo
const list = [
return [
+creditScore[id + ''] || 0,
+propertyWarrantyScore[id + ''] || 0,
+communityManagementScore[id + ''] || 0,
+ownerSatisfactionScore[id + ''] || 0,
+monthCheck[id + ''] || 0,
]
return list.reduce((cur, acc) => cur + acc, 0)
},
total() {
return this.chartData.reduce((cur, acc) => cur + acc, 0)
},
switchColor() {
if (this.total >= 75) {
......
......@@ -68,10 +68,10 @@ export default {
return this.$store.state.curSmartType
},
sum() {
const {total, today} = this.$store.state.discoverSum
const {done, today} = this.$store.state.discoverSum
return [
{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() {
......
<template>
<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>
</template>
......@@ -8,11 +35,114 @@
export default {
name: 'StreetBasic',
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>
<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>
......@@ -30,9 +30,9 @@
<m-modal v-model="doneModal" title="已完成处置">
<DoneComponent v-if="doneModal" :data="doneData" />
</m-modal>
<m-modal v-model="patrolModal" title="主动巡检">
<!-- <m-modal v-model="patrolModal" title="主动巡检">
<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-form :label-width=".7" :model="streetInfo[currentStreetInfo.id]" :layout="streetInfo[currentStreetInfo.id].layout" />
</m-modal>
......@@ -67,11 +67,11 @@ export default {
videoModal: false,
videoSrc: null,
detailModal: false,
patrolModal: false,
// patrolModal: false,
smartPoints: null,
patrolPoints: null,
// patrolPoints: null,
detailData: {},
patrolData: {},
// patrolData: {},
detailLayout: [
{
communityName: {
......@@ -102,44 +102,44 @@ export default {
},
},
],
patrolLayout: [
{
communityName: {
label: '小区名称',
width: 12,
},
orderTypeName: {
label: '整改事项',
width: 12,
},
},
{
checkTime: {
label: '发现时间',
width: 12,
},
checkStateName: {
label: '整改状态',
width: 12,
},
},
{
checkPersonName: {
label: '上报人',
width: 12,
},
hoName: {
label: '房办名称',
width: 12,
},
},
{
tcName: {
label: '检查主题',
width: 24,
},
},
],
// patrolLayout: [
// {
// communityName: {
// label: '小区名称',
// width: 12,
// },
// orderTypeName: {
// label: '整改事项',
// width: 12,
// },
// },
// {
// checkTime: {
// label: '发现时间',
// width: 12,
// },
// checkStateName: {
// label: '整改状态',
// width: 12,
// },
// },
// {
// checkPersonName: {
// label: '上报人',
// width: 12,
// },
// hoName: {
// label: '房办名称',
// width: 12,
// },
// },
// {
// tcName: {
// label: '检查主题',
// width: 24,
// },
// },
// ],
doneModal: false,
doneData: {},
}
......@@ -150,7 +150,7 @@ export default {
'streetInfo',
'curSmartType',
'showCommandModal',
'patrolList',
// 'patrolList',
'handleList',
'handleCurTab',
])
......@@ -175,7 +175,7 @@ export default {
'getHandleList',
'getDoneList',
'getCheckSum',
'getPatrolList',
// 'getPatrolList',
'getGridSum',
]),
mapComplete() {
......@@ -188,7 +188,7 @@ export default {
this.getDiscoverInfo()
this.getRepairInfo()
this.getCheckSum()
this.getPatrolList()
// this.getPatrolList()
this.getHandleList()
this.getDoneList()
}, 1000 * 60 * 1)
......@@ -251,16 +251,16 @@ export default {
},
},
watch: {
patrolList(cur) {
const {addPoint, removePoint} = this.$refs.map
removePoint(this.patrolPoints)
this.patrolPoints = addPoint({
key: 'patrol',
size: 14,
icon: 'red.png',
data: cur,
})
},
// patrolList(cur) {
// const {addPoint, removePoint} = this.$refs.map
// removePoint(this.patrolPoints)
// this.patrolPoints = addPoint({
// key: 'patrol',
// size: 14,
// icon: 'red.png',
// data: cur,
// })
// },
curSmartType(cur) {
let data = this.handleList
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