Browse Source

对接首页不满意事项月度趋势分析

V1.0
战立标 2 years ago
parent
commit
d5a382fdb8
  1. 224
      src/views/modules/home/index.vue

224
src/views/modules/home/index.vue

@ -1,4 +1,3 @@
<template>
<div>
<div class="g-row">
@ -27,12 +26,12 @@
:placeholder="typePlaceholder[searchData.type]
"
v-model="searchData.searchKey"
@keyup.enter="handleClickSearchBtn" />
@keyup.enter="handleClickSearchBtn"/>
<div class="close-btn"
v-if="searchData.searchKey != ''"
@click="searchData.searchKey = ''">
<img src="@/assets/img/shequ/close.png" />
<img src="@/assets/img/shequ/close.png"/>
</div>
</div>
<div class="btn"
@ -46,31 +45,36 @@
</div>
<div class=" m-pan m-box">
<div class="header">
<img src="@/assets/images/index/title-icon-sqzl.png" />
<img src="@/assets/images/index/title-icon-sqzl.png"/>
<span>组织总览</span>
</div>
<div class="flex_box">
<div class="cnt">
<div class="cnt-left">
<div class="subtitle">
<img src="@/assets/images/index/i-sqjj.png" />
<img src="@/assets/images/index/i-sqjj.png"/>
<span>组织简介</span>
</div>
<p>
{{ pandectData.deptName }}<span v-if="pandectData.gridCount">划分为{{
pandectData.underCount }}{{
pandectData.underName
}}</span> 现有房屋{{ pandectData.homeCount }}自住房屋{{
pandectData.selfStay
}}出租房屋{{
pandectData.rentOut
}}闲置房屋{{
pandectData.vacantHouse
}}现有居民{{pandectData.resiCount}}{{pandectData.totalResidents}}其中常住人口{{pandectData.permanentResiCount}}流动人口{{pandectData.floatingResiCount}}各类群体分布如下
pandectData.underCount
}}{{
pandectData.underName
}}</span> 现有房屋{{ pandectData.homeCount }}自住房屋{{
pandectData.selfStay
}}出租房屋{{
pandectData.rentOut
}}闲置房屋{{
pandectData.vacantHouse
}}现有居民{{ pandectData.resiCount }}{{
pandectData.totalResidents
}}其中常住人口{{ pandectData.permanentResiCount }}流动人口{{
pandectData.floatingResiCount
}}各类群体分布如下
</p>
<div class="subtitle">
<img src="@/assets/images/index/i-fxjg.png" />
<img src="@/assets/images/index/i-fxjg.png"/>
<span>分析结果</span>
</div>
@ -78,8 +82,8 @@
v-if="resiCategory.list.length > 0">
根据数据分析结果建议重点关注
<b>{{ resiCategory.list[0].name }}{{
resiCategory.list[1].name
}}{{ resiCategory.list[2].name }}</b>
resiCategory.list[1].name
}}{{ resiCategory.list[2].name }}</b>
三类群体开展相关的社区服务和活动
</p>
</div>
@ -97,8 +101,8 @@
) in resiCategory.list">
<div>
{{
("0" + (index + 1)).substr(-2)
}}.
("0" + (index + 1)).substr(-2)
}}.
</div>
<div class="item-name">
{{ item.name }}
@ -130,8 +134,8 @@
) in znycCategory.list">
<div>
{{
("0" + (index + 1)).substr(-2)
}}.
("0" + (index + 1)).substr(-2)
}}.
</div>
<div class="item-name">
{{ item.name }}
@ -160,11 +164,12 @@
<div class="g-row-right">
<div class="m-box m-tx">
<div class="header">
<img src="@/assets/images/index/title-icon-zntx.png" />
<img src="@/assets/images/index/title-icon-zntx.png"/>
<span>智能提醒</span>
</div>
<div class="more"
@click="toNoticePage">更多></div>
@click="toNoticePage">更多>
</div>
<div class="cnt"
v-if="noticeData.length > 0">
<div @click="handleClickNotice(item)"
@ -191,7 +196,7 @@
<div class="cnt"
v-else>
<div class="empty">
<img src="~@/assets/images/shuju/renfang/index/empty.png" />
<img src="~@/assets/images/shuju/renfang/index/empty.png"/>
<span>暂无提醒</span>
</div>
</div>
@ -199,7 +204,7 @@
<div class="m-box m-tb">
<div class="wrap">
<div class="header">
<img src="@/assets/images/index/title-icon-zntb.png" />
<img src="@/assets/images/index/title-icon-zntb.png"/>
<span>不满意事项月度趋势分析</span>
</div>
</div>
@ -211,21 +216,21 @@
</div>
</div>
</div>
<fastcall ref="fastcall" />
<fastcall ref="fastcall"/>
</div>
</template>
<script>
import { requestPost, requestGet } from "@/js/dai/request";
import {requestPost, requestGet} from "@/js/dai/request";
import resiCategoryMap from "@/views/business/resi-category-map.js";
import { mapGetters } from "vuex";
import {mapGetters} from "vuex";
import nextTick from "dai-js/tools/nextTick";
import fastcall from "@/views/modules/cpts/fastcall";
import * as echarts from 'echarts';
export default {
components: { fastcall },
components: {fastcall},
data () {
data() {
return {
searchStatus: "ini", //ing over
searchData: {
@ -269,63 +274,11 @@ export default {
activeName: 'resi',
option: {
tooltip: {
trigger: 'axis'
},
legend: {
data: ['12345不满意数', '省满意调查不满意数', '社区自评不满意数'],
bottom: '10%',
icon: 'rect',
itemWidth: 20,
itemHeight: 5,
itemGap: 20,
},
grid: {
left: '3%',
right: '4%',
bottom: '25%',
containLabel: true
},
toolbox: {
// feature: {
// saveAsImage: {}
// }
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月']
},
yAxis: {
type: 'value'
},
series: [
{
name: '12345不满意数',
type: 'line',
stack: 'Total',
data: [120, 132, 101, 134, 90, 230, 210]
},
{
name: '省满意调查不满意数',
type: 'line',
stack: 'Total',
data: [220, 182, 191, 234, 290, 330, 310]
},
{
name: '社区自评不满意数',
type: 'line',
stack: 'Total',
data: [150, 232, 201, 154, 190, 330, 410]
}
]
},
myChart: {}
}
},
computed: {
maxTableHeight () {
maxTableHeight() {
// return this.clientHeight - 450;
return 420;
},
@ -347,31 +300,76 @@ export default {
immediate: true,
},
},
mounted () {
mounted() {
this.getApiData();
this.$nextTick(() => {
this.initChart()
})
console.log(
"dynamicMenuRoutes----------------------------",
this.$store.state.sidebarMenuList
"dynamicMenuRoutes----------------------------",
this.$store.state.sidebarMenuList
);
},
methods: {
initChart () {
this.myChart = echarts.init(document.getElementById('my_chart'));
this.myChart.setOption(this.option)
window.addEventListener('resize', this.handleWindowResize);
initChart() {
this.$http.get('/governance/satisfactionOverview/notSatisfactionTrend').then(({data: {data}}) => {
this.myChart = echarts.init(document.getElementById('my_chart'));
let series = []
console.log(data,'datadatadata')
data.series.forEach(item => {
series.push({
...item,
type: 'line',
stack: 'Total',
})
})
let option = {
tooltip: {
trigger: 'axis'
},
legend: {
data: data.series.map(item => item.name),
bottom: '10%',
icon: 'rect',
itemWidth: 20,
itemHeight: 5,
itemGap: 20,
},
grid: {
left: '3%',
right: '4%',
bottom: '25%',
containLabel: true
},
toolbox: {
// feature: {
// saveAsImage: {}
// }
},
xAxis: {
type: 'category',
boundaryGap: false,
data: data.monthTimes.map(item => this.$moment(item).format('M') + '月')
},
yAxis: {
type: 'value'
},
series
}
this.myChart.setOption(option, true)
window.addEventListener('resize', this.handleWindowResize);
})
},
handleWindowResize () {
handleWindowResize() {
if (this.myChart) {
this.myChart.resize();
}
},
searchDataTab (str) {
searchDataTab(str) {
this.searchData.type = str;
},
handleClickCategory (item) {
handleClickCategory(item) {
this.$router.push({
name: "base-resi",
params: {
@ -380,18 +378,18 @@ export default {
});
},
async readClearOne (item) {
async readClearOne(item) {
console.log("item", item)
const url = `/message/intelligentMessage/msg/clearOne/?msgId=${item.id}`
const { data, code, msg } = await requestPost(url)
const {data, code, msg} = await requestPost(url)
if (code == 0) {
this.getNoticeData()
} else if (code >= 8000) {
this.$message.error(msg)
}
},
handleClickNotice (item) {
const { msgType, targetId } = item;
handleClickNotice(item) {
const {msgType, targetId} = item;
this.readClearOne(item)
if (msgType == "community_house") {
this.$refs.fastcall.showHouseInfo(targetId);
@ -400,13 +398,13 @@ export default {
}
},
toNoticePage () {
toNoticePage() {
this.$router.push({
path: "/main/home-notice",
});
},
toSearchPage (type, searchKey) {
toSearchPage(type, searchKey) {
this.$router.push({
path: "/main/shequ-chaxun"
});
@ -414,9 +412,9 @@ export default {
localStorage.setItem('homeSearchKey', searchKey)
},
handleClickSearchBtn (str) {
handleClickSearchBtn(str) {
const {
searchData: { type, searchKey },
searchData: {type, searchKey},
} = this;
if (str) {
this.toSearchPage(type, searchKey);
@ -426,7 +424,7 @@ export default {
this.toSearchPage(type, searchKey);
},
async getApiData () {
async getApiData() {
await this.getOrgData();
this.getWarningList();
this.getZnycList();
@ -435,14 +433,14 @@ export default {
},
//
async getOrgData () {
async getOrgData() {
const url = "/gov/org/agency/maporg";
let params = {
orgId: "",
level: "",
};
const { data, code, msg } = await requestPost(url, params);
const {data, code, msg} = await requestPost(url, params);
if (code === 0) {
this.orgData = data;
@ -452,14 +450,14 @@ export default {
},
//
async getPandectData () {
async getPandectData() {
const url = "/actual/base/residentHouseMerge/communityOverview";
let params = {
// orgId: "",
// level: "",
};
const { data, code, msg } = await requestGet(url, params);
const {data, code, msg} = await requestGet(url, params);
if (code === 0) {
if (data) {
@ -471,13 +469,13 @@ export default {
},
//
async getNoticeData () {
async getNoticeData() {
const url = "/message/intelligentMessage/list";
let params = {
last: "10",
};
const { data, code, msg } = await requestGet(url, params);
const {data, code, msg} = await requestGet(url, params);
if (code === 0) {
if (data) {
@ -489,7 +487,7 @@ export default {
},
//
async getWarningList () {
async getWarningList() {
const url = "/actual/base/resiCategory/categoryCountList";
let params = {
// id: this.orgData.id,
@ -497,7 +495,7 @@ export default {
};
this.resiCategory.loading = true;
const { data, code, msg } = await requestGet(url, params);
const {data, code, msg} = await requestGet(url, params);
this.resiCategory.loading = false;
if (code === 0) {
@ -509,7 +507,7 @@ export default {
name: resiCategoryMap[item.categoryName] || "",
count: item.categoryCount,
per: parseInt(
(100 * item.categoryCount) / data.resiCount
(100 * item.categoryCount) / data.resiCount
),
const: "const",
};
@ -520,7 +518,7 @@ export default {
}
},
//
async getZnycList () {
async getZnycList() {
const url = "/actual/base/resiCategory/intelligentPredictioncategoryCountList";
// const url = "/actual/base/resiCategory/categoryCountList";
let params = {
@ -529,7 +527,7 @@ export default {
};
this.znycCategory.loading = true;
const { data, code, msg } = await requestGet(url, params);
const {data, code, msg} = await requestGet(url, params);
this.znycCategory.loading = false;
if (code === 0) {

Loading…
Cancel
Save