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

接接口

parent ce2dec22
......@@ -6,15 +6,18 @@ case 'production':
DATA_URL = 'http://10.89.1.208:10005'
break
default:
// BASE_URL = 'http://yangpu.hm.omniview.pro/api'
BASE_URL = 'http://yapi.omniview.pro/mock/350'
BASE_URL = 'http://yangpu.hm.omniview.pro/api'
// BASE_URL = 'http://yapi.omniview.pro/mock/350'
DATA_URL = 'http://10.89.1.208:10005'
}
export default {
BASE_URL,
DATA_URL,
GET_HANDLE_LIST: '/service-special-ddd/public/alarm/index', // 联勤联动列表
GET_RESOURCE_COUNT: '/public/resource/count', // 6项运行体征
GET_RESOURCE_COUNT: '/service-basicdatasync-ddd/public/resource/count', // 6项运行体征
GET_COMMUNITY_RATE: '/service-basicdatasync-ddd/public/community/ratio', // 小区类型占比
GET_MARKET_SHARE: '/service-basicdatasync-ddd/public/property/topten', // 市场份额
GET_INDUSTRY_INFO: '/service-documents-ddd/public/industry/supervision', // 行业监管信息
GET_REPAIR_INFO: '/service-documents-ddd/public/property/maintenance', // 物业维修
GET_COMPLAINT_INFO: '/service-docments-ddd/public/complaint/lettersvisits', // 信访投诉
}
......@@ -10,6 +10,9 @@ export default {
dispatch('getResourceCount')
dispatch('getCommunityRate')
dispatch('getMarketShare')
dispatch('getIndustryInfo')
dispatch('getRepairInfo')
dispatch('getComplaintInfo')
},
getHandleList({commit}) { // 获取并全局设置联勤联动处置列表
ajax.get({url: api.GET_HANDLE_LIST}).then(res => {
......@@ -31,4 +34,19 @@ export default {
commit('SET_MARKET_SHARE', com.confirm(res, 'data.content', {}))
})
},
getIndustryInfo({commit}) { // 行业督查
ajax.get({url: api.GET_INDUSTRY_INFO}).then(res => {
commit('SET_INDUSTRY_INFO', com.confirm(res, 'data.content', {}))
})
},
getRepairInfo({commit}) { // 物业维修
ajax.get({url: api.GET_REPAIR_INFO}).then(res => {
commit('SET_REPAIR_INFO', com.confirm(res, 'data.content', {}))
})
},
getComplaintInfo({commit}) { // 信访投诉
ajax.get({url: api.GET_COMPLAINT_INFO}).then(res => {
commit('SET_COMPLAINT_INFO', com.confirm(res, 'data.content', {}))
})
},
}
......@@ -20,4 +20,13 @@ export default {
SET_MARKET_SHARE(state, data) {
state.marketShare = data
},
SET_INDUSTRY_INFO(state, data) {
state.industryInfo = data
},
SET_REPAIR_INFO(state, data) {
state.repairInfo = data
},
SET_COMPLAINT_INFO(state, data) {
state.complaintInfo = data
},
}
......@@ -6,6 +6,9 @@ export default {
resourceCount: {},
communityRate: {},
marketShare: {},
industryInfo: {},
repairInfo: {},
complaintInfo: {},
commandData: {
name1: '赵广浩',
name2: '成剑杰',
......
......@@ -23,7 +23,10 @@
<m-step class="combine-step" :steps="steps" :current="getCurrent(item)" />
</div>
</m-scroll>
<div v-else class="no-data">— 暂无数据 —</div>
<div v-else class="no-data">
<img src="@/assets/images/building.png" />
<p>— 暂无数据 —</p>
</div>
</div>
</template>
......@@ -60,10 +63,19 @@ export default {
<style lang="stylus" scoped>
.combine
// .no-data
// width 100%
// height 100%
// $flex-center()
.no-data
$flex-center()
flex-direction column
width 100%
height 100%
$flex-center()
color #999
img
width .35rem
height @width
.detail
background $section-bg
padding .05rem .1rem .2rem
......
<template>
<div class="complaint-report">
<div class="sum">
<div v-for="item in sum" :key="item.name">
<div v-for="item in sum" :key="item.key" @click="curType = item.key" :class="{on: item.key === curType}">
<img :src="require(`@/assets/images/${item.img}`)" />
<div>
<p>{{item.name}}</p>
......@@ -17,12 +17,18 @@
<span class="dot" :style="`border-color:${config.colors[i]}`"/>
<p>{{item.name}}</p>
<p>{{item.value}}</p>
<p>{{item.rate}}%</p>
<p>{{item.rate}}</p>
</div>
</div>
</div>
<Divider>投诉分布</Divider>
<div class="rate"><RateComponent :colors="['#EF6F6F', '#FFC500']"/></div>
<div class="rate">
<RateComponent
:info="rateInfo"
:list="rateList"
:colors="['#EF6F6F', '#FFC500']"
/>
</div>
</div>
</template>
......@@ -33,10 +39,7 @@ export default {
components: {RateComponent},
data() {
return {
sum: [
{name: '12345', value: 100, img: 'complaint1.png'},
{name: '962121', value: 203, img: 'complaint2.png'},
],
curType: 'B',
config: {
colors: ['#E44949', '#FDA62D', '#FFCE34', '#71C012', '#6BE1B2', '#DC732D', '#5BD5FF', '#006ED4', '#2E43C9', '#826AFA', '#CCCCCC'],
// tooltip: {
......@@ -48,17 +51,41 @@ export default {
{type: 'pie', radius: [30 * Number((screen.height / 800).toFixed(1)), 45 * Number((screen.height / 800).toFixed(1))], center: ['40%', '50%']}
]
},
chartData: [
{name: '物业服务管理', value: 90, rate: 30},
{name: '小区综合管理', value: 75, rate: 25},
{name: '房管物业', value: 60, rate: 20},
{name: '城管执法', value: 45, rate: 15},
{name: '绿化市容', value: 12, rate: 4},
{name: '发展改革', value: 12, rate: 4},
{name: '其他', value: 9, rate: 3},
],
}
},
computed: {
complaintInfo() {
return this.$store.state.complaintInfo
},
sum() {
const {allRowsA = 0, allRowsB = 0} = this.complaintInfo
return [
{key: 'B', name: '12345', value: allRowsB, img: 'complaint1.png'},
{key: 'A', name: '962121', value: allRowsA, img: 'complaint2.png'},
]
},
rateInfo() {
const {cCommunity = {}} = this.complaintInfo
return cCommunity[this.curType]
},
rateList() {
const {cCompany = {}} = this.complaintInfo
const keys = Object.keys(cCompany[`cCompany${this.curType}`] || {})
return keys.map(key => cCompany[`cCompany${this.curType}`][key])
},
chartData() {
const data = this.complaintInfo[`typeCount${this.curType}`]
const keys = Object.keys(data || {})
return keys.map(key => {
const {count = 0, businsessTypeLv1 = '', classification1 = '', ratio = '0'} = data[key]
return {
name: businsessTypeLv1 || classification1,
value: count,
rate: ratio,
}
})
},
},
}
</script>
......@@ -74,6 +101,8 @@ export default {
flex 1
$flex-center()
cursor pointer
border-bottom .02rem solid transparent
transition all .3s ease-in-out
img
width .25rem
height @width
......@@ -84,8 +113,10 @@ export default {
.unit
color #aaa
font-size .08rem
&:first-child
&:hover
&.on
background $color-map(.15)
&.on
border-bottom .02rem solid $color-blue
.chart-wrapper
width 100%
......
......@@ -24,7 +24,10 @@
</div>
</div>
</m-scroll>
<div v-else class="no-data">— 暂无数据 —</div>
<div v-else class="no-data">
<img src="@/assets/images/building.png" />
<p>— 暂无数据 —</p>
</div>
</div>
</template>
......@@ -46,9 +49,14 @@ export default {
<style lang="stylus" scoped>
.example-community
.no-data
$flex-center()
flex-direction column
width 100%
height 100%
$flex-center()
color #999
img
width .35rem
height @width
.detail
background $section-bg
padding .05rem .1rem
......
......@@ -14,7 +14,7 @@
<div>
<p>房办月查完成情况</p>
<div class="inner">
<span v-for="i in 12" :key="i">{{i}}</span>
<span v-for="(month, i) in months" :class="getClass(month)" :key="i">{{i+1}}</span>
</div>
</div>
</div>
......@@ -38,7 +38,11 @@
</div>
<Divider>重大事件清单</Divider>
<div class="important-list">
<div class="detail" v-for="(item, i) in list" :key="i">
<div class="no-data">
<img src="@/assets/images/building.png" />
<p>— 暂无数据 —</p>
</div>
<!-- <div class="detail" v-for="(item, i) in list" :key="i">
<div>
<h5>{{item.community}}</h5>
<p>{{item.theme}}</p>
......@@ -57,7 +61,7 @@
<p><m-count :value="item.lost" /><span class="unit"></span></p>
</div>
</div>
</div>
</div> -->
</div>
</div>
</template>
......@@ -67,16 +71,24 @@ export default {
name: 'IndustrySupervise',
data() {
return {
supervise: [
{name: '日常巡查完成数', value: 16},
{name: '重点督查完成数', value: 29},
{name: '整改跟踪', value: [5, 16]},
{name: '专项检查完成数', value: 32},
],
list: [
{community: '保利维拉家园', theme: '上报主题', type: '事件类型', die: 3, lost: 5000},
{community: '中凯城市之光', theme: '上报主题', type: '事件类型', die: 3, lost: 5000},
],
months: [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sept',
'Oct',
'Nov',
'Dec',
],
config: {
colors: ['#5bd4ff', '#72c011', '#fece35', '#ff6160', '#826bfa', '#cccccc'],
tooltip: {
......@@ -115,6 +127,36 @@ export default {
],
}
},
computed: {
industryInfo() {
return this.$store.state.industryInfo
},
supervise() {
const {dailySupervision = 0, keySupervision = 0, notOther = 0, other = 0, specialExamination = 0} = this.industryInfo
return [
{name: '日常巡查完成数', value: +dailySupervision},
{name: '重点督查完成数', value: +keySupervision},
{name: '整改跟踪', value: [+notOther, +other]},
{name: '专项检查完成数', value: +specialExamination},
]
},
},
methods: {
getClass(month) {
const {monthCompletion = {}} = this.industryInfo
if (!month || !monthCompletion[month]) return null
switch (monthCompletion[month]) {
case 'c':
return 'red'
case 'w':
return 'yellow'
case 'i':
return 'green'
default:
return null
}
},
},
}
</script>
......@@ -181,10 +223,17 @@ export default {
span
$flex-center()
border-radius .02rem
width .16rem
width .17rem
height @width
background $color-yellow
margin-top .05rem
background #13427a
&.red
background #cc4d4d
&.yellow
background $color-yellow
&.green
background #6eb629
.info-submit
display flex
align-items center
......@@ -199,6 +248,15 @@ export default {
display flex
flex 1
margin-top .2rem
.no-data
$flex-center()
flex-direction column
width 100%
height 100%
color #999
img
width .35rem
height @width
.detail
width 49%
margin-right .05rem
......
......@@ -23,7 +23,10 @@
</div>
<div class="chart">
<m-chart v-if="mockData.length > 0" :config="config" :data="mockData" :options="options" />
<div v-else class="no-data">— 暂无数据 —</div>
<div v-else class="no-data">
<img src="@/assets/images/building.png" />
<p>— 暂无数据 —</p>
</div>
</div>
</div>
</template>
......@@ -90,9 +93,14 @@ export default {
<style lang="stylus" scoped>
.party-lead
.no-data
$flex-center()
flex-direction column
width 100%
height 100%
$flex-center()
color #999
img
width .35rem
height @width
.sum
display flex
justify-content space-around
......
......@@ -3,21 +3,21 @@
<div class="sum">
<div>
<p>全区物业保修数</p>
<p><m-count class="count" :value="100" /><span class="unit"></span></p>
<p><m-count class="count" :value="+repairInfo.allRows || 0" /><span class="unit"></span></p>
</div>
<div>
<p>应急维修数</p>
<p class="count">
<m-count class="count red" :value="2" /> /
<m-count class="count" :value="4" /> /
<m-count class="count" :value="18" />
<m-count class="count red" :value="+repairInfo.emMaintenanceNotRows || 0" /> /
<m-count class="count" :value="+repairInfo.emMaintenanceHandlerRows || 0" /> /
<m-count class="count" :value="+repairInfo.emMaintenanceAllRows || 0" />
<span class="unit"></span>
<span class="unit sub">逾期 / 执行中 / 总数</span>
</p>
</div>
</div>
<div class="rate">
<RateComponent />
<RateComponent :list="listData" :info="repairInfo.mCommunity"/>
</div>
</div>
</template>
......@@ -29,8 +29,15 @@ export default {
components: {
RateComponent,
},
data() {
return {}
computed: {
repairInfo() {
return this.$store.state.repairInfo
},
listData() {
const {mCompany = {}} = this.repairInfo
const keys = Object.keys(mCompany)
return keys.map(key => mCompany[key])
},
},
}
</script>
......
<template>
<div class="rate-component">
<div>
<div class="bar">
<div v-for="item in rate" :key="item.name" :style="`background:${item.color};width:${item.percent}%;`">
<p :style="`color:${item.color}`">
<div class="info">
<p :style="`color:${item.color}`" v-for="item in rate" :key="item.name">
<span>{{item.name}}</span>
<span>{{item.value}}/{{item.percent}}%/{{item.rate}}</span>
<span>{{item.value}}/{{item.percent}}/{{item.rate}}</span>
</p>
</div>
<div class="bar">
<div v-for="item in rate" :key="item.name" :style="`background:${item.color};width:${item.percent};`">
<!-- <p :style="`color:${item.color}`" /> -->
</div>
</div>
<div class="wrapper">
<div v-for="item in list" :key="item.name">
<p>{{item.name}}</p>
<div><div class="inner" :style="`width:${item.val2 * 10}%;background:linear-gradient(to right, ${colors[0]}, ${colors[1]})`"/></div>
<p>{{item.val1}} / {{item.val2}}% / {{item.val3}}</p>
<template v-if="list.length > 0">
<div v-for="item in list" :key="item.cspName">
<p>{{item.cspName}}</p>
<div><div class="inner" :style="`width:${item.cspRatio};background:linear-gradient(to right, ${colors[0]}, ${colors[1]})`"/></div>
<p>{{item.countSize || item.cspCount || 0}} / {{item.cspRatio || 0}} / {{item.cspDensity || 0}}</p>
</div>
</template>
<div v-else class="no-data">
<img src="@/assets/images/building.png" />
<p>— 暂无数据 —</p>
</div>
</div>
</div>
......@@ -29,24 +36,39 @@ export default {
default() {
return ['#D445EC', '#008FFF']
}
},
list: {
type: Array,
default() {
return []
},
},
info: {
type: Object,
default() {
return {}
}
},
data() {
return {
rate: [
{name: '商品房', value: 60, percent: 20, rate: 0.1, color: '#00C6FE'},
{name: '老旧小区', value: 135, percent: 45, rate: 0.5, color: '#FF9500'},
{name: '保障房', value: 105, percent: 35, rate: 0.3, color: '#44D7B6'},
],
list: [
{name: '物业企业1', val1: 21, val2: 7, val3: 0.5},
{name: '物业企业2', val1: 12, val2: 4, val3: 0.4},
{name: '物业企业3', val1: 12, val2: 4, val3: 0.4},
{name: '物业企业4', val1: 9, val2: 3, val3: 0.3},
{name: '物业企业5', val1: 9, val2: 3, val3: 0.3},
{name: '其他', val1: 210, val2: 7, val3: 0.8},
},
computed: {
rate() {
const {
condoCount = 0,
condoRatio = 0,
condoDensity = 0,
straightAndMixedCount = 0,
straightAndMixedRatio = 0,
straightAndMixedDensity = 0,
otherCount = 0,
otherRatio = 0,
otherDensity = 0
} = this.info
return [
{name: '商品房', value: condoCount, percent: condoRatio, rate: condoDensity, color: '#00C6FE'},
{name: '老旧小区', value: straightAndMixedCount, percent: straightAndMixedRatio, rate: straightAndMixedDensity, color: '#FF9500'},
{name: '保障房', value: otherCount, percent: otherRatio, rate: otherDensity, color: '#44D7B6'},
]
}
},
},
}
</script>
......@@ -57,19 +79,20 @@ export default {
height 100%
display flex
flex-direction column
.bar
width 100%
height .08rem
.info
margin-top .1rem
display flex
margin-top .4rem
>div
>p
transform translateY(-100%)
justify-content space-between
p
>span
display block
&:first-child
color #fff
font-size .09rem
.bar
width 100%
height .08rem
display flex
.wrapper
flex 1
margin-top .05rem
......@@ -81,6 +104,15 @@ export default {
display flex
align-items center
height 16.6%
&.no-data
$flex-center()
flex-direction column
width 100%
height 100%
color #999
img
width .35rem
height @width
p
font-size .09rem
line-height 1.5
......
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