Browse Source

调整地图

feature
战立标 2 years ago
parent
commit
48c821b776
  1. 4
      src/views/dataBoard/overview/components/jdwgy.vue
  2. 104
      src/views/dataBoard/overview/index.vue

4
src/views/dataBoard/overview/components/jdwgy.vue

@ -84,9 +84,9 @@ export default {
} }
}, },
methods: { methods: {
getData(level = "", orgId = "") { getData() {
this.loading = true; this.loading = true;
if (level == "grid") { if (this.currentLevelData.orgLevel == "grid") {
this.$http.get("/actual/base/streetOverview/queryPersonnelGridGroup?personnelType=" + this.$http.get("/actual/base/streetOverview/queryPersonnelGridGroup?personnelType=" +
this.peopleType + this.peopleType +
"&level=" + this.currentLevelData.orgLevel + "&level=" + this.currentLevelData.orgLevel +

104
src/views/dataBoard/overview/index.vue

@ -8,91 +8,100 @@
<div class="g-row"> <div class="g-row">
<div class="g-left"> <div class="g-left">
<div class="m-box"> <div class="m-box">
<title-box :text="`${currentLevel === 'district' ? '区' : currentLevel === 'street' ? '街道' : currentLevel === 'community' ? '社区' : currentLevel === 'grid' ? '网格' : ''}介绍`" /> <title-box
<jdjs :currentLevelData="currentLevelData" /> :text="`${currentLevel === 'district' ? '区' : currentLevel === 'street' ? '街道' : currentLevel === 'community' ? '社区' : currentLevel === 'grid' ? '网格' : ''}介绍`"/>
<jdjs :currentLevelData="currentLevelData"/>
</div> </div>
<div class="m-box"> <div class="m-box">
<title-box :text="`${currentLevel === 'district' ? '区' : currentLevel === 'street' ? '街道' : currentLevel === 'community' ? '社区' : currentLevel === 'grid' ? '网格' : ''}图谱画像`" /> <title-box
<jdtphx :currentLevelData="currentLevelData" :id="orgId" /> :text="`${currentLevel === 'district' ? '区' : currentLevel === 'street' ? '街道' : currentLevel === 'community' ? '社区' : currentLevel === 'grid' ? '网格' : ''}图谱画像`"/>
<jdtphx :currentLevelData="currentLevelData" :id="orgId"/>
</div> </div>
</div> </div>
<div class="g-center"> <div class="g-center">
<div class="m-map" style="overflow: hidden"> <div class="m-map" style="overflow: hidden">
<map-top :currentLevelData="currentLevelData" @changeType="changeType" :level="currentLevel" /> <map-top :currentLevelData="currentLevelData" @changeType="changeType" :level="currentLevel"/>
<div v-if="breadList.length > 1" class="go-back" @click="goBackMap"> <div v-if="breadList.length > 1" class="go-back" @click="goBackMap">
<img src="~@/assets/images/shuju/overview/go-back.png" /> <img src="~@/assets/images/shuju/overview/go-back.png"/>
</div> </div>
<grid-map ref="map" @clickAgency="clickAgencyItem" :srcGridData="orgData" @clickDotBtn="handleClickDotBtn" :level="currentLevel" /> <grid-map ref="map" @clickAgency="clickAgencyItem" :srcGridData="orgData" @clickDotBtn="handleClickDotBtn"
:level="currentLevel"/>
</div> </div>
<div class="m-box m-rybox"> <div class="m-box m-rybox">
<title-box :text="`${customerName}${peopleList[peopleType]}`" /> <title-box :text="`${customerName}${peopleList[peopleType]}`"/>
<jdwgy :peopleType="peopleType" :currentLevelData="currentLevelData" @setNum="setNum" @setPoint="setPoint" /> <jdwgy :peopleType="peopleType" :currentLevelData="currentLevelData" @setNum="setNum" @setPoint="setPoint"/>
</div> </div>
</div> </div>
<div class="g-right"> <div class="g-right">
<div class="m-box"> <div class="m-box">
<title-box text="人房数据统计" /> <title-box text="人房数据统计"/>
<rfsjtj :currentLevelData="currentLevelData" /> <rfsjtj :currentLevelData="currentLevelData"/>
</div> </div>
<!-- 街道概览 --> <!-- 街道概览 -->
<div v-if="currentLevel === 'street' || currentLevel === 'district'" class="m-box"> <div v-if="currentLevel === 'street' || currentLevel === 'district'" class="m-box">
<title-box text="各社区人房数据更新排行"> <title-box text="各社区人房数据更新排行">
<span class="date-span"> <span class="date-span">
<el-date-picker v-model="rfphDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate" type="month" :clearable="false" placeholder="选择月"> </el-date-picker> <el-date-picker v-model="rfphDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate"
type="month" :clearable="false" placeholder="选择月"> </el-date-picker>
</span> </span>
</title-box> </title-box>
<sqrfph :currentLevelData="currentLevelData" :date="rfphDate" /> <sqrfph :currentLevelData="currentLevelData" :date="rfphDate"/>
</div> </div>
<div v-if="currentLevel === 'street' || currentLevel === 'district'" class="m-box"> <div v-if="currentLevel === 'street' || currentLevel === 'district'" class="m-box">
<title-box text="各社区12345投诉事件统计"> <title-box text="各社区12345投诉事件统计">
<span class="date-span"> <span class="date-span">
<el-date-picker v-model="sq12345Date" format="yyyy-MM" value-format="yyyy-MM" type="month" :clearable="false" placeholder="选择月" /> <el-date-picker v-model="sq12345Date" format="yyyy-MM" value-format="yyyy-MM" type="month"
:clearable="false" placeholder="选择月"/>
</span> </span>
</title-box> </title-box>
<sq12345 :currentLevelData="currentLevelData" :date="sq12345Date" /> <sq12345 :currentLevelData="currentLevelData" :date="sq12345Date"/>
</div> </div>
<!-- 社区&网格--> <!-- 社区&网格-->
<div v-if="currentLevel === 'community' || currentLevel === 'grid'" class="m-box"> <div v-if="currentLevel === 'community' || currentLevel === 'grid'" class="m-box">
<title-box text="人房数据动态更新" /> <title-box text="人房数据动态更新"/>
<Tabs v-model="dynamicType" :list="dynamicTypeList" v-if="currentLevel === 'community'" @changeVal="dynamicTypeChange" /> <Tabs v-model="dynamicType" :list="dynamicTypeList" v-if="currentLevel === 'community'"
<DynamicHumanRoomData :currentLevelData="currentLevelData" v-if="dynamicType === 1" /> @changeVal="dynamicTypeChange"/>
<GridUpdateRanking :currentLevelData="currentLevelData" v-if="dynamicType === 2" /> <DynamicHumanRoomData :currentLevelData="currentLevelData" v-if="dynamicType === 1"/>
<GridUpdateRanking :currentLevelData="currentLevelData" v-if="dynamicType === 2"/>
</div> </div>
<!-- 社区概览--> <!-- 社区概览-->
<div v-if="currentLevel === 'community'" class="m-box"> <div v-if="currentLevel === 'community'" class="m-box">
<title-box text="社区满意度自查结果"> <title-box text="社区满意度自查结果">
<span class="date-span"> <span class="date-span">
<el-date-picker v-model="sqzcDate" format="yyyy-MM" value-format="yyyy-MM" type="month" :clearable="false" placeholder="选择月" /> <el-date-picker v-model="sqzcDate" format="yyyy-MM" value-format="yyyy-MM" type="month" :clearable="false"
placeholder="选择月"/>
</span> </span>
</title-box> </title-box>
<CommunityResult :currentLevelData="currentLevelData" :date="sqzcDate" /> <CommunityResult :currentLevelData="currentLevelData" :date="sqzcDate"/>
</div> </div>
<div v-if="currentLevel === 'community'" class="m-box"> <div v-if="currentLevel === 'community'" class="m-box">
<title-box text="事件&回访"> <title-box text="事件&回访">
<span class="date-span"> <span class="date-span">
<el-date-picker v-model="sjhfDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate" type="month" :clearable="false" placeholder="选择月" /> <el-date-picker v-model="sjhfDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate"
type="month" :clearable="false" placeholder="选择月"/>
</span> </span>
</title-box> </title-box>
<Tabs v-model="eventType" :list="eventTypeList" @changeVal="eventTypeChange" /> <Tabs v-model="eventType" :list="eventTypeList" @changeVal="eventTypeChange"/>
<EventAndFollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 1" /> <EventAndFollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 1"/>
<FollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 2" /> <FollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 2"/>
</div> </div>
<!-- 网格 --> <!-- 网格 -->
<div v-if="currentLevel === 'grid'" class="m-box"> <div v-if="currentLevel === 'grid'" class="m-box">
<title-box text="社区网格数据更新情况排行"> <title-box text="社区网格数据更新情况排行">
<span class="date-span"> <span class="date-span">
<el-date-picker v-model="sqwggxDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate" type="month" :clearable="false" placeholder="选择月" /> <el-date-picker v-model="sqwggxDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate"
type="month" :clearable="false" placeholder="选择月"/>
</span> </span>
</title-box> </title-box>
<RankingGridData :currentLevelData="currentLevelData" :date="sqwggxDate" /> <RankingGridData :currentLevelData="currentLevelData" :date="sqwggxDate"/>
</div> </div>
</div> </div>
</div> </div>
<cpt-loading v-show="false" /> <cpt-loading v-show="false"/>
</div> </div>
</template> </template>
@ -117,8 +126,8 @@ import RankingGridData from "@/views/dataBoard/overview/components/RankingGridDa
import FollowUp from "@/views/dataBoard/overview/components/FollowUp.vue"; import FollowUp from "@/views/dataBoard/overview/components/FollowUp.vue";
import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue"; import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue";
import { requestPostBi } from "@/js/dai/request-bipass"; import {requestPostBi} from "@/js/dai/request-bipass";
import { requestPost } from "@/js/dai/request"; import {requestPost} from "@/js/dai/request";
export default { export default {
name: "renfang", name: "renfang",
@ -161,7 +170,7 @@ export default {
currentLevelData: { currentLevelData: {
orgId: this.$store.state.chooseArea.chooseName.orgId, orgId: this.$store.state.chooseArea.chooseName.orgId,
orgLevel: this.$store.state.chooseArea.chooseName.level, orgLevel: this.$store.state.chooseArea.chooseName.level,
meta: { title: "人房总览" }, meta: {title: "人房总览"},
}, },
breadList: [ breadList: [
{ {
@ -169,7 +178,7 @@ export default {
orgLevel: "", orgLevel: "",
id: "", id: "",
level: "", level: "",
meta: { title: "人房总览" }, meta: {title: "人房总览"},
}, },
], ],
peopleList: { peopleList: {
@ -217,9 +226,7 @@ export default {
// const queryOrgLevel = getQueryPara("orgLevel"); // const queryOrgLevel = getQueryPara("orgLevel");
// this.init(queryOrgId, queryOrgLevel); // this.init(queryOrgId, queryOrgLevel);
this.changeCustomerName(); this.changeCustomerName();
if (this.$store.state.chooseArea.chooseName.orgId) {
this.getMapData(); this.getMapData();
}
}, },
watch: { watch: {
@ -235,9 +242,6 @@ export default {
}, },
}, },
mounted() {
this.getMapData();
},
methods: { methods: {
changeCustomerName() { changeCustomerName() {
@ -279,7 +283,7 @@ export default {
} }
}, },
clickBreadItem({ item }) { clickBreadItem({item}) {
this.toBread(item); this.toBread(item);
}, },
@ -301,7 +305,7 @@ export default {
this.toBread({ this.toBread({
orgId: item.id, orgId: item.id,
orgLevel: item.level, orgLevel: item.level,
meta: { title: item.name }, meta: {title: item.name},
}); });
}, },
goBackMap() { goBackMap() {
@ -309,13 +313,13 @@ export default {
this.clickAgencyItem(item); this.clickAgencyItem(item);
}, },
toBread(item) { toBread(item) {
const { orgId } = item; const {orgId} = item;
const { breadList } = this; const {breadList} = this;
let index = breadList.findIndex((val) => val.orgId === orgId); let index = breadList.findIndex((val) => val.orgId === orgId);
if (index >= 0) { if (index >= 0) {
this.breadList = breadList.slice(0, index + 1); this.breadList = breadList.slice(0, index + 1);
} else { } else {
breadList.push({ ...item, id: item.orgId, level: item.orgLevel }); breadList.push({...item, id: item.orgId, level: item.orgLevel});
this.breadList = breadList; this.breadList = breadList;
} }
this.getMapData(item.orgId, item.orgLevel); this.getMapData(item.orgId, item.orgLevel);
@ -367,7 +371,7 @@ export default {
level = this.$store.state.chooseArea.chooseName.level level = this.$store.state.chooseArea.chooseName.level
) { ) {
const url = "org_map"; const url = "org_map";
this.$http.post(`/gov/org/agency/maporg`, { orgId, level }).then(({ data: { data } }) => { this.$http.post(`/gov/org/agency/maporg`, {orgId, level}).then(({data: {data}}) => {
this.orgData = data; this.orgData = data;
this.orgId = this.orgData.id; this.orgId = this.orgData.id;
console.log(this.orgId); console.log(this.orgId);
@ -385,7 +389,7 @@ export default {
async getSubMapData() { async getSubMapData() {
const url = "sub_org_map"; const url = "sub_org_map";
const { data, code, msg } = await requestPostBi( const {data, code, msg} = await requestPostBi(
url, url,
{ {
queryParam: { queryParam: {
@ -398,7 +402,7 @@ export default {
); );
if (code === 0) { if (code === 0) {
const { orgData } = this; const {orgData} = this;
orgData.children = data.map((item) => { orgData.children = data.map((item) => {
return { return {
...item, ...item,
@ -409,7 +413,7 @@ export default {
coordinates: item.coordinates || "", coordinates: item.coordinates || "",
}; };
}); });
this.orgData = { ...orgData }; this.orgData = {...orgData};
} else { } else {
this.$message.error(msg); this.$message.error(msg);
} }
@ -423,7 +427,7 @@ export default {
level: this.orgLevel, level: this.orgLevel,
}; };
const { data, code, msg } = await requestPost(url, params); const {data, code, msg} = await requestPost(url, params);
if (code === 0) { if (code === 0) {
this.orgData = data; this.orgData = data;
this.orgId = this.orgId; this.orgId = this.orgId;
@ -441,14 +445,17 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.up-style { .up-style {
width: 51%; width: 51%;
img { img {
height: 12px; height: 12px;
width: 12px; width: 12px;
} }
img:hover { img:hover {
cursor: pointer; cursor: pointer;
} }
} }
.go-back { .go-back {
position: absolute; position: absolute;
z-index: 100; z-index: 100;
@ -465,7 +472,8 @@ export default {
cursor: pointer; cursor: pointer;
} }
} }
.date-current-weiyi{
.date-current-weiyi {
background: #000; background: #000;
} }
</style> </style>

Loading…
Cancel
Save