Skip to content

Y
yangpu-property
Commit e9d28713 authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

接入运行体征mock数据

parent 7c7f8213
Hide whitespace changes
Inline Side-by-side
Showing with 139 additions and 61 deletions
src/server/api.js
View file @ e9d28713
......@@ -6,29 +6,15 @@ 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_DISCOVER_TREND: '/service-special-ddd/public/alarm/unremoved/statistics', // 智能发现趋势图
GET_REPAIR_RATE: '/service-documents-ddd/public/unsolved/repair/type/count', // 投诉报修比例图
GET_RESOURCE_SUM: '/service-basicdatasync-ddd/public/resource/count', // 房屋物业统计数字
GET_CHECK_SUM: '/service-documents-ddd/public/checkorder/count', // 主动巡检统计数字
GET_DISCOVER_INFO: '/service-special-ddd/public/discoverInfo', // 智能发现数目
GET_TS_BX: '/service-documents-ddd/public/repair/complaint', // 投诉报修数目
GET_HANDLE_LIST: '/service-special-ddd/public/alarm/index', // 联勤联动列表
GET_GRID_TOTAL: '/dc/countDiscoveredCaseByStreet', // 网格数
GET_GRID_SOLVING: '/dc/countSolvingCaseByStreet', // 网格处置中数
GET_GRID_OVERDUE: 'dc/countExceedCaseByStreet', // 网格处逾期数
GET_NOT_ALERT_TOTAL: '/dc/countClosedNotPolice', // 非警情数
GET_NOT_ALERT_SOLVING: '/dc/countSolvingNotPoliceByStreet', // 非警情数处置中数
GET_NOT_ALERT_OVERDUE: '/dc/countExceedNotPoliceByStreet', // 非警情数逾期数
GET_POPULATION_INFO: '/dc/statisticsbureauArea', // 土地人口统计数字
GET_COMPRESS_COUNT: '/dc/countCompressStationsByStreet', // 街道小型压缩站数目
GET_GARBAGE_COUNT: '/dc/countPointsByStreet', // 街道垃圾收集点数目
GET_TOILET_COUNT: '/dc/countToiletsByStreet', // 街道环卫公厕数目
GET_VIDEO_URL: 'http://10.89.1.208:7000/hawkeye/api/v1/camera/', // 后面接id获取视频地址
GET_RESOURCE_COUNT: '/public/resource/count', // 6项运行体征
GET_COMMUNITY_RATE: '/service-basicdatasync-ddd/public/community/ratio', // 小区类型占比
GET_MARKET_SHARE: '/service-basicdatasync-ddd/public/property/topten', // 市场份额
}
src/store/actions.js
View file @ e9d28713
......@@ -7,10 +7,28 @@ import com from '@/util/common'
export default {
initData({dispatch}) {
dispatch('getHandleList')
dispatch('getResourceCount')
dispatch('getCommunityRate')
dispatch('getMarketShare')
},
getHandleList({commit}) { // 获取并全局设置联勤联动处置列表
ajax.get({url: api.GET_HANDLE_LIST}).then(res => {
commit('SET_HANDLE_LIST', com.confirm(res, 'data.content', []))
})
},
getResourceCount({commit}) { // 获取运行体征
ajax.get({url: api.GET_RESOURCE_COUNT}).then(res => {
commit('SET_RESOURCE_COUNT', com.confirm(res, 'data.content', {}))
})
},
getCommunityRate({commit}) { // 小区占比
ajax.get({url: api.GET_COMMUNITY_RATE}).then(res => {
commit('SET_COMMUNITY_RATE', com.confirm(res, 'data.content', {}))
})
},
getMarketShare({commit}) { // 市场份额
ajax.get({url: api.GET_MARKET_SHARE}).then(res => {
commit('SET_MARKET_SHARE', com.confirm(res, 'data.content', {}))
})
},
}
src/store/mutations.js
View file @ e9d28713
......@@ -11,4 +11,13 @@ export default {
SET_HANDLE_LIST(state, data) {
state.handleList = data
},
SET_RESOURCE_COUNT(state, data) {
state.resourceCount = data
},
SET_COMMUNITY_RATE(state, data) {
state.communityRate = data
},
SET_MARKET_SHARE(state, data) {
state.marketShare = data
},
}
src/store/state.js
View file @ e9d28713
......@@ -3,6 +3,9 @@ export default {
curDate: null,
showCommandModal: false,
handleList: [],
resourceCount: {},
communityRate: {},
marketShare: {},
commandData: {
name1: '赵广浩',
name2: '成剑杰',
......
src/views/components/operation-sign.vue
View file @ e9d28713
......@@ -32,11 +32,18 @@
<Divider>市场份额</Divider>
<div class="btns">
<div class="select">
<div class="btn" v-for="btn in ['全部物业', '仅区内物业', '仅区外物业']" :key="btn">
{{btn}}
<div
:class="{btn, on: curTab === btn.value}"
v-for="btn in tabs"
:key="btn.value"
@click="curTab = btn.value"
>
{{btn.name}}
</div>
</div>
<div class="select">按管理面积</div>
<Select class="select" v-model="curType">
<Option v-for="option in options" :key="option.value" :value="option.value">{{option.name}}</Option>
</Select>
</div>
<div class="chart-wrapper">
<div class="chart"><m-chart :config="config" :data="chartData" /></div>
......@@ -52,25 +59,22 @@
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'OperationSign',
data() {
return {
list: [
{name: '物业小区', value: 909, unit: '个'},
{name: '楼栋总数', value: 27644, unit: '个'},
{name: '物业管理面积', value: 41935047, unit: '㎡'},
options: [
{name: '按管理面积', value: 'area'},
{name: '按管理数量', value: 'num'},
],
info: [
{name: '业委会', value: 725, unit: '个', img: 'operation1.png'},
{name: '物业企业', value: 222, unit: '个', img: 'operation2.png'},
{name: '小区经理', value: 505, unit: '个', img: 'operation3.png'},
],
rate: [
{name: '商品房', value: 946, percent: '41%', color: '#00C6FE'},
{name: '直管公房及混合', value: 20, percent: '19%', color: '#FF9500'},
{name: '保障房及其他', value: 361, percent: '40%', color: '#44D7B6'},
curType: 'area',
tabs: [
{name: '全部物业', value: 'all'},
{name: '仅区内物业', value: 'in'},
{name: '仅区外物业', value: 'out'},
],
curTab: 'all',
config: {
colors: ['#E44949', '#FDA62D', '#FFCE34', '#71C012', '#6BE1B2', '#DC732D', '#5BD5FF', '#006ED4', '#2E43C9', '#826AFA', '#CCCCCC'],
// tooltip: {
......@@ -82,24 +86,73 @@ export default {
{type: 'pie', radius: [40 * Number((screen.height / 800).toFixed(1)), 55 * Number((screen.height / 800).toFixed(1))], center: ['40%', '50%']}
]
},
chartData: [
{name: '上海延吉物业', value: 6},
{name: '上海四平物业', value: 3},
{name: '上海殷行物业', value: 3},
{name: '上海阳置物业', value: 3},
{name: '上海凯晨物业', value: 2},
{name: '上海兴桥盛物业', value: 2},
{name: '上海五角场物业', value: 2},
{name: '上海文化银湾物业', value: 2},
{name: '上海海鸿福船物业', value: 2},
{name: '上海平凉物业', value: 1},
{name: '其他', value: 74},
],
// chartData: [
// {name: '上海延吉物业', value: 6},
// {name: '上海四平物业', value: 3},
// {name: '上海殷行物业', value: 3},
// {name: '上海阳置物业', value: 3},
// {name: '上海凯晨物业', value: 2},
// {name: '上海兴桥盛物业', value: 2},
// {name: '上海五角场物业', value: 2},
// {name: '上海文化银湾物业', value: 2},
// {name: '上海海鸿福船物业', value: 2},
// {name: '上海平凉物业', value: 1},
// {name: '其他', value: 74},
// ],
}
},
computed: {
...mapState([
'resourceCount',
'communityRate',
'marketShare',
]),
list(){
const {community, building, area} = this.resourceCount
return [
{name: '物业小区', value: +community || 0, unit: '个'},
{name: '楼栋总数', value: +building || 0, unit: '个'},
{name: '物业管理面积', value: +area || 0, unit: '㎡'},
]
},
info() {
const {ic, company, csm} = this.resourceCount
return [
{name: '业委会', value: +ic || 0, unit: '个', img: 'operation1.png'},
{name: '物业企业', value: +company || 0, unit: '个', img: 'operation2.png'},
{name: '小区经理', value: +csm || 0, unit: '个', img: 'operation3.png'},
]
},
rate() {
const {condoRatio, condoRows, straightAndMixedRows, straightAndMixedRatio, otherRows, otherRatio} = this.communityRate
return [
{name: '商品房', value: +condoRows || 0, percent: condoRatio || '0', color: '#00C6FE'},
{name: '直管公房及混合', value: +straightAndMixedRows || 0, percent: straightAndMixedRatio || '0', color: '#FF9500'},
{name: '保障房及其他', value: +otherRows || 0, percent: otherRatio || '0', color: '#44D7B6'},
]
},
chartData() {
const result = this.marketShare[`${this.curTab}_${this.curType}`]
return (result && result.map(item => ({
name: item.name,
value: Number(item.ratio.replace('%', '')),
}))) || []
},
},
}
</script>
<style lang="stylus">
.operation-sign
.ivu-select-dropdown
.ivu-select-selection
border-color #3391FF !important
border-radius .04rem !important
>div
.ivu-select-selected-value
line-height .25rem !important
</style>
<style lang="stylus" scoped>
.operation-sign
.unit
......@@ -130,7 +183,7 @@ export default {
align-items center
flex 1
img
width .25rem
width .3rem
height @width
margin-right .05rem
p
......@@ -167,27 +220,30 @@ export default {
align-items center
.select
background rgba(25,154,204,.2)
border .01rem solid #3391FF
border-radius .04rem
color #839DAC
width 25%
width 32%
text-align center
line-height .25rem
cursor pointer
&:first-child
width 70%
width 65%
display flex
padding 0 .08rem
border .01rem solid #3391FF
>div
flex 1
box-sizing border-box
&:first-child
border-top .02rem solid transparent
&:hover
&.on
background linear-gradient(to bottom, rgba(250,219,113,.5), transparent)
border-top .02rem solid $color-yellow
color $color-yellow
&.on
border-top .02rem solid $color-yellow
.chart-wrapper
width 100%
height 1.6rem
height 2rem
display flex
.chart
height 100%
......@@ -197,12 +253,13 @@ export default {
display flex
flex-direction column
flex-wrap wrap
padding-left .1rem
margin-top 5%
// margin-left -0.3rem
transform translateX(-0.3rem)
margin-top 3%
transform translateX(-15%)
>div
height 16%
min-height 16.5%
display flex
align-items flex-start
margin-left .03rem
.dot
display inline-block
width .08rem
......@@ -210,7 +267,11 @@ export default {
border .02rem solid
border-radius 50%
p
margin 0 .03rem
margin 0 .02rem
display inline-block
font-size .09rem
line-height 1.2
&:nth-of-type(1)
width .81rem
</style>
src/views/components/rate-component.vue
View file @ e9d28713
......@@ -80,6 +80,7 @@ export default {
>div
display flex
align-items center
height 16.6%
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