You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
884 lines
26 KiB
884 lines
26 KiB
<template>
|
|
<div>
|
|
<cpt-bread
|
|
v-if="breadList.length > 1"
|
|
:bread-list="breadList"
|
|
@tap="clickBreadItem"
|
|
/>
|
|
<div class="g-row">
|
|
<div class="g-left">
|
|
<div class="bgImg">
|
|
<Title text="房屋概览"/>
|
|
<fwgl ref="fwgl" :orgId="orgId"></fwgl>
|
|
</div>
|
|
<div class="bgImg">
|
|
<Title text="居民概览"/>
|
|
<jmgl ref="jmgl" :orgId="orgId"></jmgl>
|
|
</div>
|
|
<div class="bgImg">
|
|
<Title text="图谱画像"/>
|
|
<jdtphx :id="orgId" :current-level-data="{orgId:orgId, orgLevel:orgLevel}"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="g-center">
|
|
<div class="m-map">
|
|
<div class="m-per">
|
|
<div class="item" @click="jumpPath('normal', 'aged', '老年人')">
|
|
<div class="item-info">
|
|
<div>
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/per/lnr.png"
|
|
/>老年人
|
|
</div>
|
|
<div>
|
|
<b>{{ perInfo.OLD_PEOPLE_FLAG }}</b>
|
|
%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item" @click="jumpPath('normal', 'aged', '低保人员')">
|
|
<div class="item-info">
|
|
<div>
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/per/qsn.png"
|
|
/>低保人员
|
|
</div>
|
|
<div>
|
|
<b class="blue">{{ perInfo.SUBSISTENCE_ALLOWANCE_FLAG }}</b>
|
|
%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item" @click="jumpPath('normal', 'aged', '失业人员')">
|
|
<div class="item-info">
|
|
<div>
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/per/syry.png"
|
|
/>失业人员
|
|
</div>
|
|
<div>
|
|
<b class="blue">{{ perInfo.UNEMPLOYED_FLAG }}</b>
|
|
%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item" @click="jumpPath('normal', 'aged', '党员')">
|
|
<div class="item-info">
|
|
<div>
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/per/dy.png"
|
|
/>党员
|
|
</div>
|
|
<div>
|
|
<b class="orange">{{ perInfo.PARTY_FLAG }}</b>
|
|
%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item" @click="jumpPath('normal', 'aged', '志愿者')">
|
|
<div class="item-info">
|
|
<div>
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/per/zyz.png"
|
|
/>志愿者
|
|
</div>
|
|
<div>
|
|
<b class="red">{{ perInfo.VOLUNTEER_FLAG }}</b>
|
|
%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item" @click="jumpPath('normal', 'aged', '特殊人群')">
|
|
<div class="item-info">
|
|
<div>
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/per/tsrq.png"
|
|
/>特殊人群
|
|
</div>
|
|
<div>
|
|
<b>{{ perInfo.SPECIAL_CROWD_FLAG }}</b>
|
|
%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<grid-map
|
|
ref="map"
|
|
:srcGridData="orgData"
|
|
@clickAgency="clickAgencyItem"
|
|
@clickDotBtn="handleClickDotBtn"
|
|
/>
|
|
<mapRight :orgData="orgData" @clickAgency="clickAgencyItem"/>
|
|
</div>
|
|
|
|
<div class="m-search">
|
|
<div class="btn" @click="searchModule.displayedCard = true">
|
|
<img alt="" class="border" src="@/assets/images/renfang/search_border.png">
|
|
<img alt="" class="icon" src="@/assets/images/renfang/search_icon.png">
|
|
</div>
|
|
|
|
<div v-show="searchModule.displayedCard" class="card">
|
|
<div class="card-input">
|
|
<div class="card-btn" @click="handleSearch">
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/search/search.png"
|
|
/>
|
|
</div>
|
|
|
|
<input
|
|
v-model.trim="searchModule.keyword"
|
|
placeholder="搜索本组织及下级的居民、小区、楼栋、房屋"
|
|
type="text"
|
|
@keyup.enter="handleSearch"
|
|
/>
|
|
|
|
<div class="i-div"></div>
|
|
|
|
<div class="card-btn" @click="searchModule.displayedCard = false">
|
|
<img
|
|
src="~@/assets/images/shuju/renfang/index/search/close.png"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="card-show">
|
|
<div class="card-tabs">
|
|
<div
|
|
:class="{
|
|
'z-on': searchModule.resultTab == 'all',
|
|
}"
|
|
@click="searchModule.resultTab = 'all'"
|
|
>
|
|
全部
|
|
</div>
|
|
<div
|
|
:class="{
|
|
'z-on': searchModule.resultTab == 'resident',
|
|
}"
|
|
@click="searchModule.resultTab = 'resident'"
|
|
>
|
|
居民
|
|
</div>
|
|
<div
|
|
:class="{
|
|
'z-on': searchModule.resultTab == 'quarter',
|
|
}"
|
|
@click="searchModule.resultTab = 'quarter'"
|
|
>
|
|
小区
|
|
</div>
|
|
<div
|
|
:class="{
|
|
'z-on': searchModule.resultTab == 'build',
|
|
}"
|
|
@click="searchModule.resultTab = 'build'"
|
|
>
|
|
楼栋
|
|
</div>
|
|
<div
|
|
:class="{
|
|
'z-on': searchModule.resultTab == 'home',
|
|
}"
|
|
@click="searchModule.resultTab = 'home'"
|
|
>
|
|
房屋
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="searchModule.result.length > 0" class="card-list">
|
|
<div
|
|
v-for="(item, index) in searchModule.result"
|
|
:key="item.title + index"
|
|
class="card-item"
|
|
@click="handleClickSearchItem(item)"
|
|
>
|
|
<span>{{ item.title }}</span>
|
|
<img
|
|
class="i-arrow"
|
|
src="~@/assets/images/shuju/renfang/index/search/arrow.png"
|
|
/>
|
|
<img
|
|
class="i-arrow z-on"
|
|
src="~@/assets/images/shuju/renfang/index/search/arrow-on.png"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-else class="card-empty">
|
|
<img src="~@/assets/images/shuju/renfang/index/empty.png"/>
|
|
<span>没有找到搜索结果～</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="bgImg m-box m-cate map-bottom">
|
|
<div class="box-title">
|
|
<Title v-if="!displayedForecast" text="居民分类统计">
|
|
<template>
|
|
<div
|
|
class="box-title-btn"
|
|
@click="displayedForecast = true"
|
|
>
|
|
<img src="~@/assets/images/shuju/renfang/index/znyc.png"/>
|
|
<span>智能预测</span>
|
|
|
|
<el-tooltip placement="top">
|
|
<div slot="content">
|
|
根据智能分类设置规则，预测来年育龄妇女、老年人、空巢老人、独居老人分别有多少人
|
|
</div>
|
|
<img src="~@/assets/images/shuju/renfang/index/i-hint.png"/>
|
|
</el-tooltip>
|
|
</div>
|
|
</template>
|
|
</Title>
|
|
<Title v-else text="居民分类统计-智能预测">
|
|
<template>
|
|
<div
|
|
class="box-title-btn"
|
|
@click="displayedForecast = false"
|
|
>
|
|
<img src="~@/assets/images/shuju/renfang/index/znyc.png"/>
|
|
<span>居民分类统计</span>
|
|
</div>
|
|
</template>
|
|
</Title>
|
|
</div>
|
|
|
|
<div v-if="!displayedForecast">
|
|
<div v-if="resiCategoryData.length > 0" class="list">
|
|
<div
|
|
v-for="(item, index) in resiCategoryData"
|
|
:key="item.code + index"
|
|
class="item"
|
|
@click="toResiClassPage('normal', item.code, item.name)"
|
|
>
|
|
<div>{{ ("0" + (index + 1)).substr(-2) }}.</div>
|
|
<div class="item-name">{{ item.name }}</div>
|
|
<div class="item-count">
|
|
<b>{{ item.count }}</b> 人
|
|
</div>
|
|
<div class="item-progress">
|
|
<b :style="{ width: item.ratio + '%' }"></b>
|
|
</div>
|
|
<div class="item-per">
|
|
<span>较上月</span>
|
|
<template v-if="item.growth !== 0">
|
|
<img
|
|
v-if="item.growth > 0"
|
|
src="~@/assets/images/shuju/renfang/index/up.png"
|
|
/>
|
|
<img
|
|
v-else
|
|
src="~@/assets/images/shuju/renfang/index/down.png"
|
|
/>
|
|
</template>
|
|
<span v-else style="width: 20px"></span>
|
|
<b>{{ item.growthAbs }}</b>
|
|
<span>人</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-else class="empty">
|
|
<img src="~@/assets/images/shuju/renfang/index/empty.png"/>
|
|
</div>
|
|
</div>
|
|
<div v-else>
|
|
<div v-if="resiCategoryForecastData.length > 0" class="list">
|
|
<div
|
|
v-for="(item, index) in resiCategoryForecastData"
|
|
:key="item.code + index"
|
|
class="item"
|
|
@click="toResiClassPage('ai', item.code, item.name)"
|
|
>
|
|
<div>{{ ("0" + (index + 1)).substr(-2) }}.</div>
|
|
<div class="item-name">{{ item.name }}</div>
|
|
<div class="item-count">
|
|
<b>{{ item.count }}</b> 人
|
|
</div>
|
|
<div class="item-progress">
|
|
<b :style="{ width: item.ratio + '%' }"></b>
|
|
</div>
|
|
|
|
<div class="item-per">
|
|
<span>较上一年</span>
|
|
<img
|
|
v-if="item.growth > 0"
|
|
src="~@/assets/images/shuju/renfang/index/up.png"
|
|
/>
|
|
<img
|
|
v-else
|
|
src="~@/assets/images/shuju/renfang/index/down.png"
|
|
/>
|
|
<b>{{ item.growthAbs }}</b>
|
|
<span>人</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-else class="empty">
|
|
<img src="~@/assets/images/shuju/renfang/index/empty.png"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="g-right">
|
|
<div class="bgImg">
|
|
<Title text="信息采集统计"></Title>
|
|
<rfsjtj :currentLevelData="{orgId:orgId, orgLevel:orgLevel}"/>
|
|
</div>
|
|
<div class="bgImg">
|
|
<Title text="人口预警"></Title>
|
|
|
|
<div
|
|
:class="{
|
|
'z-shrink':
|
|
orgLevel == 'district' ||
|
|
orgLevel == 'street' ||
|
|
orgLevel == 'city'
|
|
}"
|
|
class="m-subbox m-rkyj"
|
|
>
|
|
<rkyj :orgId="orgId"/>
|
|
</div>
|
|
</div>
|
|
<div class="bgImg">
|
|
<Title text="人口分析"></Title>
|
|
<rkfx :orgId="orgId" :orgType="orgLevel" @handelClickRkfxPei="handelClickRkfxPei"/>
|
|
</div>
|
|
</div>
|
|
|
|
<cpt-loading v-show="false"/>
|
|
</div>
|
|
|
|
<resi-details
|
|
v-if="popupShow"
|
|
:popupShow='popupShow'
|
|
:resi-id="displayedResiId"
|
|
@close="popupShow = false"
|
|
/>
|
|
|
|
<house-details
|
|
v-if="displayedHouseId"
|
|
:house-id="displayedHouseId"
|
|
@close="displayedHouseId = ''"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import gridMap from "@/views/dataBoard/cpts/map/index";
|
|
import fwgl from "@/views/dataBoard/renfang/cpts/fwgl";
|
|
import jmgl from "@/views/dataBoard/renfang/cpts/jmgl";
|
|
import rkfx from "@/views/dataBoard/renfang/cpts/rkfx";
|
|
import rkyj from "@/views/dataBoard/renfang/cpts/rkyj";
|
|
import szsq from "@/views/dataBoard/renfang/cpts/szsq";
|
|
import mapRight from "@/views/dataBoard/renfang/cpts/map-right.vue";
|
|
import cptBread from "@/views/dataBoard/renfang/cpts/bread";
|
|
import cptLoading from "@/views/dataBoard/cpts/loading";
|
|
import houseDetails from "@/views/dataBoard/cpts/house-details";
|
|
import resiDetails from "@/views/dataBoard/cpts/resi-details";
|
|
import {requestPostBi} from "@/js/dai/request-bipass";
|
|
import {requestPost} from "@/js/dai/request";
|
|
import getQueryPara from "dai-js/modules/getQueryPara";
|
|
import {requestGet} from "@/js/dai/request";
|
|
import resiCategoryMap from "@/views/business/resi-category-map.js";
|
|
import Title from "@/views/dataBoard/satisfactionEval/components/Title/index.vue";
|
|
import rfsjtj from "@/views/dataBoard/overview/components/rfsjtj.vue";
|
|
import jdtphx from "@/views/dataBoard/overview/components/jdtphx.vue";
|
|
|
|
function iniGetPerInfo() {
|
|
return {
|
|
OLD_PEOPLE_FLAG: "--",
|
|
PARTY_FLAG: "--",
|
|
UNEMPLOYED_FLAG: "--",
|
|
VOLUNTEER_FLAG: "--",
|
|
SUBSISTENCE_ALLOWANCE_FLAG: "--",
|
|
SPECIAL_CROWD_FLAG: "--",
|
|
};
|
|
}
|
|
|
|
export default {
|
|
name: "renfang",
|
|
|
|
components: {
|
|
Title,
|
|
gridMap,
|
|
fwgl,
|
|
jmgl,
|
|
rkfx,
|
|
rkyj,
|
|
szsq,
|
|
cptLoading,
|
|
cptBread,
|
|
houseDetails,
|
|
resiDetails,
|
|
mapRight,
|
|
rfsjtj,
|
|
jdtphx
|
|
},
|
|
|
|
data() {
|
|
return {
|
|
loading: false,
|
|
|
|
orgData: {
|
|
children: [],
|
|
}, //当前组织对象
|
|
orgId: "",
|
|
orgLevel: "",
|
|
|
|
breadList: [
|
|
{
|
|
orgId: "",
|
|
orgLevel: "",
|
|
meta: {title: "人房总览"},
|
|
},
|
|
],
|
|
|
|
resiCategoryData: [], // 居民分类分析
|
|
resiCategoryForecastData: [], // 居民分类预测
|
|
displayedForecast: false, //显示居民分类分析 还是居民分类预测
|
|
|
|
searchModule: {
|
|
displayedCard: false,
|
|
keyword: "",
|
|
resultTab: "all", // 0所有 1，居民；2，小区；3，楼栋；4，房屋
|
|
result: [
|
|
// {
|
|
// id: 1,
|
|
// title: "四季景园",
|
|
// },
|
|
],
|
|
},
|
|
|
|
perInfo: iniGetPerInfo(),
|
|
|
|
displayedResiId: "",
|
|
displayedHouseId: "",
|
|
|
|
pandectData: {},
|
|
|
|
popupShow: false
|
|
};
|
|
},
|
|
|
|
mounted() {
|
|
const queryOrgId = getQueryPara("orgId");
|
|
const queryOrgLevel = getQueryPara("orgLevel");
|
|
this.init(queryOrgId, queryOrgLevel);
|
|
},
|
|
|
|
watch: {
|
|
$route:{
|
|
handler:function(newVal,oldVal){
|
|
if(oldVal.name === 'HomeDetails'){
|
|
const queryBread=JSON.parse(getQueryPara("bread")) ;
|
|
const queryOrgId = getQueryPara("orgId");
|
|
const queryOrgLevel = getQueryPara("orgLevel");
|
|
console.log(queryBread,queryOrgLevel,queryOrgId,'seeee1');
|
|
this.$nextTick(()=>{
|
|
this.init(queryOrgId, queryOrgLevel);
|
|
})
|
|
if(queryBread.findIndex(item=>item.orgId === queryOrgId) != -1){
|
|
this.breadList = queryBread.splice(0,queryBread.findIndex(item=>item.orgId === queryOrgId)+1)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
async init(queryOrgId, queryOrgLevel) {
|
|
if (queryOrgId) {
|
|
this.orgId = queryOrgId;
|
|
this.orgLevel = queryOrgLevel || "agency";
|
|
} else {
|
|
this.orgId = this.$store.state.user.agencyId;
|
|
this.orgLevel = "agency";
|
|
}
|
|
|
|
//加载组织数据
|
|
this.loading = false;
|
|
// await this.loadOrgData();
|
|
await this.getMapData();
|
|
this.getResiCategoryData();
|
|
this.getPerInfo();
|
|
this.getPandectData()
|
|
|
|
await this.getResiCategoryForecastData();
|
|
this.loading = true;
|
|
},
|
|
//加载组织数据
|
|
async getPandectData() {
|
|
const {agencyId} = this.$store.state.user;
|
|
const url = "/actual/base/residentHouseMerge/communityOverview";
|
|
let params = {
|
|
agencyId: this.orgId,
|
|
orgId: this.orgId,
|
|
level: this.orgLevel,
|
|
};
|
|
console.log(params);
|
|
const {data, code, msg} = await requestGet(url, params);
|
|
if (code === 0) {
|
|
if (data) {
|
|
this.$nextTick(() => {
|
|
this.$refs['fwgl'].pandectData = data
|
|
this.$refs['jmgl'].pandectData = data
|
|
}
|
|
)
|
|
}
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
jumpPath(pageType, type_id = "", type_name) {
|
|
this.$router.push({
|
|
path: "/dataBoard/renfang/visualizing",
|
|
query: {
|
|
org_id: this.orgId,
|
|
type_id,
|
|
type_name,
|
|
pageType,
|
|
},
|
|
});
|
|
},
|
|
toResiClassPage(pageType, type_id = "", type_name) {
|
|
if (type_id) {
|
|
this.$router.push({
|
|
path: "/dataBoard/renfang/resi-class",
|
|
query: {
|
|
org_id: this.orgId,
|
|
type_id,
|
|
type_name,
|
|
pageType,
|
|
},
|
|
});
|
|
} else {
|
|
this.$message.error("该人员暂无居民信息！");
|
|
}
|
|
},
|
|
|
|
handleClickDotBtn(type, info) {
|
|
console.log(info,'--------------');
|
|
if (type == "watch-resi") {
|
|
this.$router.push({
|
|
path: "/dataBoard/renfang/resident",
|
|
query: {
|
|
user_id:info.search_id,
|
|
},
|
|
});
|
|
// this.displayedResiId = info.user_id;
|
|
// this.popupShow = true
|
|
} else if (type == "watch-house") {
|
|
this.displayedHouseId = info.house_id;
|
|
}
|
|
},
|
|
|
|
clickBreadItem({item}) {
|
|
this.toBread(item);
|
|
},
|
|
|
|
clickAgencyItem(item) {
|
|
console.log(item);
|
|
if (item.level === 'neighborHood') {
|
|
this.$router.push('/homeDetails/index?id=' + item.id + '&breadList='+JSON.stringify(this.breadList))
|
|
} else {
|
|
this.toBread({
|
|
orgId: item.id,
|
|
orgLevel: item.level,
|
|
meta: {title: item.name},
|
|
});
|
|
}
|
|
},
|
|
|
|
toBread(item) {
|
|
const {orgId} = item;
|
|
const {breadList} = this;
|
|
let index = breadList.findIndex((val) => val.orgId === orgId);
|
|
if (index >= 0) {
|
|
this.breadList = breadList.slice(0, index + 1);
|
|
} else {
|
|
breadList.push(item);
|
|
this.breadList = breadList;
|
|
}
|
|
this.init(item.orgId, item.orgLevel);
|
|
},
|
|
|
|
// 点击搜索结果条目，在地图上显示点和详情弹窗
|
|
handleClickSearchItem(item) {
|
|
if (!item.longitude) {
|
|
return this.$message.error("请先设置坐标");
|
|
}
|
|
this.$refs.map.setDotMarker(item, [
|
|
parseFloat(item.longitude),
|
|
parseFloat(item.latitude),
|
|
]);
|
|
},
|
|
|
|
// 根据类别搜索
|
|
async handleSearch() {
|
|
this.searchModule.result = [];
|
|
const {searchModule} = this;
|
|
|
|
/* const url = [
|
|
"search_all",
|
|
"search_resident",
|
|
"search_village",
|
|
"search_building",
|
|
"search_house",
|
|
][searchModule.resultTab];*/
|
|
let url = '/actual/base/peopleRoomOverview/getSearchResult'
|
|
|
|
const {data, code, msg} = await requestPost(
|
|
url,
|
|
{
|
|
org_id: this.orgId,
|
|
content: this.searchModule.keyword,
|
|
searchType: searchModule.resultTab
|
|
},
|
|
);
|
|
|
|
if (code === 0) {
|
|
this.searchModule.result = data.map((item) => {
|
|
let type = item.type;
|
|
let title = "";
|
|
let detailJson = item.detail_json;
|
|
// if (searchModule.resultTab == 0) {
|
|
title = item.name;
|
|
if (typeof item.detail_json == "string") {
|
|
try {
|
|
detailJson = JSON.parse(item.detail_json);
|
|
} catch (e) {
|
|
console.log(e);
|
|
}
|
|
}
|
|
if (type == "1") {
|
|
title = item.name;
|
|
} else if (type == "2") {
|
|
title = detailJson.village;
|
|
} else if (type == "3") {
|
|
console.log(item, 'detailJson')
|
|
title = detailJson.village + "-" + detailJson.building;
|
|
} else if (type == "4") {
|
|
title = item.center_addre;
|
|
}
|
|
return {
|
|
title,
|
|
type,
|
|
...item,
|
|
...detailJson,
|
|
};
|
|
})
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
//地图上居民分类百分比数据 ps:感觉有点重复显示
|
|
async getPerInfo() {
|
|
const url = "/actual/base/resiCategory/categoryCountPartList";
|
|
let params = {
|
|
orgId: this.orgId,
|
|
agencyId: this.orgId,
|
|
level: this.orgLevel,
|
|
};
|
|
const {data, code, msg} = await requestGet(
|
|
url,
|
|
params
|
|
);
|
|
if (code === 0 && data) {
|
|
// this.perInfo = {
|
|
// ...iniGetPerInfo(),
|
|
// ...data[0],
|
|
// };
|
|
const resiCount = data.resiCount;
|
|
Object.keys(data.categoryList).forEach((key) => {
|
|
const category = data.categoryList[key];
|
|
const categoryName = category.categoryName;
|
|
const categoryCount = category.categoryCount;
|
|
const radio = categoryCount?categoryCount / resiCount * 100:categoryCount;
|
|
console.log(radio, categoryCount,
|
|
resiCount, 'radioradioradio')
|
|
if (categoryName == "OLD_PEOPLE_FLAG") {
|
|
this.perInfo.OLD_PEOPLE_FLAG = radio || radio === 0 ? radio.toFixed(2) : '--';
|
|
} else if (categoryName == "PARTY_FLAG") {
|
|
this.perInfo.PARTY_FLAG = radio || radio === 0 ? radio.toFixed(2) : '--';
|
|
} else if (categoryName == "UNEMPLOYED_FLAG") {
|
|
this.perInfo.UNEMPLOYED_FLAG = radio || radio === 0 ? radio.toFixed(2) : '--';
|
|
} else if (categoryName == "VOLUNTEER_FLAG") {
|
|
this.perInfo.VOLUNTEER_FLAG = radio || radio === 0 ? radio.toFixed(2) : '--';
|
|
} else if (categoryName == "SUBSISTENCE_ALLOWANCE_FLAG") {
|
|
this.perInfo.SUBSISTENCE_ALLOWANCE_FLAG = radio || radio === 0 ? radio.toFixed(2) : '--';
|
|
} else if (categoryName == "SPECIAL_CROWD_FLAG") {
|
|
this.perInfo.SPECIAL_CROWD_FLAG = radio || radio === 0 ? radio.toFixed(2) : '--';
|
|
}
|
|
});
|
|
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
//居民分类分析数据
|
|
async getResiCategoryData() {
|
|
const {agencyId} = this.$store.state.user;
|
|
console.log(agencyId);
|
|
const url = "/actual/base/resiCategory/categoryCountList";
|
|
let params = {
|
|
agencyId: agencyId,
|
|
orgId: this.orgId,
|
|
level: this.orgLevel,
|
|
// id: this.orgId,
|
|
// level: "agency",
|
|
};
|
|
const {data, code, msg} = await requestGet(url, params);
|
|
if (code === 0) {
|
|
if (data) {
|
|
this.resiCategoryData = data.categoryList.map((item) => {
|
|
return {
|
|
code: item.categoryName,
|
|
name: resiCategoryMap[item.categoryName] || "",
|
|
count: item.categoryCount,
|
|
ratio: ((100 * item.categoryCount) / data.resiCount).toFixed(0),
|
|
growth: item.growth,
|
|
growthAbs: item.growth === 0 ? 0 : Math.abs(item.growth),
|
|
};
|
|
});
|
|
}
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
//居民分类预测数据
|
|
async getResiCategoryForecastData() {
|
|
const {agencyId} = this.$store.state.user;
|
|
const url = "/actual/base/resiCategory/intelligentPredictioncategoryCountList";
|
|
let params = {
|
|
agencyId: agencyId,
|
|
orgId: this.orgId,
|
|
level: this.orgLevel,
|
|
};
|
|
const {data, code, msg} = await requestGet(url, params);
|
|
if (code === 0) {
|
|
this.resiCategoryForecastData = data.categoryList.map((item) => {
|
|
return {
|
|
code: item.categoryName,
|
|
name: resiCategoryMap[item.categoryName] || "",
|
|
count: item.categoryCountNext,
|
|
// name:item.categoryCountName,
|
|
per: parseInt(
|
|
(100 * item.categoryCount) / data.resiCount
|
|
),
|
|
// per: item.change_ratio,
|
|
growth: item.categoryCountNext - item.categoryCount,
|
|
growthAbs: Math.abs(item.categoryCountNext - item.categoryCount)
|
|
};
|
|
});
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
//获取地图上显示的组织数据
|
|
async getMapData() {
|
|
|
|
const url = "/gov/org/agency/maporg";
|
|
let params = {
|
|
orgId: this.orgId,
|
|
level: this.orgLevel,
|
|
};
|
|
|
|
const {data, code, msg} = await requestPost(url, params);
|
|
|
|
if (code === 0) {
|
|
this.orgData = data;
|
|
this.orgId = this.orgId;
|
|
// this.orgLevel = this.orgData.level;
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
//加载组织数据
|
|
async loadOrgData() {
|
|
const url = "/gov/org/agency/maporg";
|
|
let params = {
|
|
orgId: this.orgId,
|
|
level: this.orgLevel,
|
|
};
|
|
|
|
const {data, code, msg} = await requestPost(url, params);
|
|
|
|
if (code === 0) {
|
|
this.orgData = data;
|
|
this.orgId = this.orgId;
|
|
this.orgLevel = this.orgData.level;
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
handelClickRkfxPei(val) {
|
|
console.log(val);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
@import "@/assets/scss/dataBoard/renfang/index.scss";
|
|
|
|
.bgImg {
|
|
margin-bottom: 7px;
|
|
background: url('@/assets/images/shuju/overview/box-bg.png') no-repeat;
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
.m-box {
|
|
height: 323px;
|
|
}
|
|
|
|
.map-bottom {
|
|
margin: 0 17px;
|
|
}
|
|
|
|
.m-search {
|
|
top: 595px !important;
|
|
|
|
.btn {
|
|
position: relative;
|
|
width: 56px;
|
|
height: 56px;
|
|
margin-left: 12px;
|
|
|
|
.border {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
//animation-iteration-count: infinite;
|
|
width: 56px;
|
|
height: 56px;
|
|
animation: autobiography 2s infinite;
|
|
animation-timing-function: linear;
|
|
}
|
|
|
|
.icon {
|
|
width: 56px;
|
|
height: 56px;
|
|
}
|
|
}
|
|
}
|
|
|
|
@keyframes autobiography {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
</style>
|
|
|