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.
849 lines
27 KiB
849 lines
27 KiB
<template>
|
|
<div style="position: relative">
|
|
<!-- 组织路由 -->
|
|
<div class="m-crumb">
|
|
<div class="router_line"></div>
|
|
<div class="div_router">
|
|
<span
|
|
class="router_parents"
|
|
v-for="(item, index) in runAgencyArray"
|
|
@click="handleClickAgency(index)"
|
|
:key="index"
|
|
>{{ item.name }}<span class="arrow">></span></span
|
|
>
|
|
|
|
<span class="router_child">{{ orgData.name }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<people v-if="orgLevel === 'people'" :uid="selUserId" />
|
|
|
|
<div v-show="orgLevel !== 'people'" class="g-cnt">
|
|
<div class="m-map" @click="handleClickMapBox">
|
|
<grid-map
|
|
ref="map"
|
|
v-if="orgData.id"
|
|
@clickAgency="clickAgencyItem"
|
|
@clickDotBtn="handleClickDotBtn"
|
|
:srcGridData="orgData"
|
|
:dotList="dotList"
|
|
:dotIcoList="dotIcoList"
|
|
:dotList2="dotList2"
|
|
:dotIcoList2="dotIcoList2"
|
|
:gridCountData="gridCountData"
|
|
:pitch="0"
|
|
/>
|
|
|
|
<div class="m-mapmenu">
|
|
<sidemenu-left
|
|
:orgId="orgId"
|
|
@change="handleChangeMenuLeft"
|
|
></sidemenu-left>
|
|
</div>
|
|
|
|
<div class="m-search">
|
|
<div class="input">
|
|
<img class="i-search" src="@/assets/img/shuju/command/search.png" />
|
|
<input
|
|
type="text"
|
|
placeholder="请输入"
|
|
@keyup.enter="handleSearch"
|
|
v-model="searchName"
|
|
/>
|
|
<img
|
|
class="i-close"
|
|
@click="clearSearch"
|
|
src="@/assets/img/shuju/command/close.png"
|
|
/>
|
|
<div class="btn" @click="handleSearch">搜索</div>
|
|
</div>
|
|
<div class="result" v-if="showedSearchResult">
|
|
<template v-for="item in searchResult">
|
|
<div
|
|
:key="'searchResult' + item.type"
|
|
class="result-item"
|
|
v-show="item.list.length > 0"
|
|
>
|
|
<div class="result-type">{{ item.title }}</div>
|
|
<div
|
|
class="result-more"
|
|
@click.stop="handleClickSearchResultMore(item)"
|
|
v-show="item.allList.length > 2"
|
|
>
|
|
更多
|
|
</div>
|
|
<div class="result-ul">
|
|
<div
|
|
class="result-li z-toe"
|
|
:key="item.type + 'li' + index"
|
|
v-for="(li, index) in item.list"
|
|
@click.stop="handleClickSearchLi(li, item)"
|
|
>
|
|
<span v-if="item.type == 'position'">{{
|
|
li.name + " " + li.address
|
|
}}</span>
|
|
<span v-if="item.type == 'resi'">{{
|
|
li.name + "（" + li.idCard + "）"
|
|
}}</span>
|
|
<span v-if="item.type == 'event'">{{
|
|
li.eventContent
|
|
}}</span>
|
|
<span v-if="item.type == 'resource'">{{ li.name }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="result-panel" v-show="item.showedMore">
|
|
<div class="result-type">{{ item.title }}</div>
|
|
<div class="result-ul">
|
|
<div
|
|
class="result-li z-toe"
|
|
:key="item.type + 'li2_' + index"
|
|
v-for="(li, index) in item.allList"
|
|
@click.stop="handleClickSearchLi(li, item)"
|
|
>
|
|
<span v-if="item.type == 'position'">{{
|
|
li.name + " " + li.address
|
|
}}</span>
|
|
<span v-if="item.type == 'resi'">{{
|
|
li.name + "（" + li.idCard + "）"
|
|
}}</span>
|
|
<span v-if="item.type == 'event'">{{
|
|
li.eventContent
|
|
}}</span>
|
|
<span v-if="item.type == 'resource'">{{ li.name }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="m-sidebar" v-show="false">
|
|
<div class="wrap" :class="[{ 'wrap-hidden': !showAgencyList }]">
|
|
<div @click="hideAgencyList" class="arrow_tip">
|
|
<img src="@/assets/img/modules/visual/popup.png" alt />
|
|
</div>
|
|
|
|
<div class="div_agency_list">
|
|
<div class="agency_main">
|
|
<el-scrollbar
|
|
style="height: 98%"
|
|
wrap-style="overflow-x:hidden"
|
|
>
|
|
<div v-if="subAgencyArray.length > 0" class="agency_list">
|
|
<div
|
|
v-for="(item, index) in subAgencyArray"
|
|
:key="index"
|
|
@click="clickAgencyItem(item, index)"
|
|
:class="[
|
|
'agency_item',
|
|
{ agency_item_on: index % 2 == 0 },
|
|
]"
|
|
>
|
|
<div class="agency_item_name">{{ item.name }}</div>
|
|
</div>
|
|
</div>
|
|
<div v-else>
|
|
<img
|
|
src="@/assets/img/modules/visual/noData.png"
|
|
alt=""
|
|
srcset=""
|
|
class="no-data-img"
|
|
/>
|
|
</div>
|
|
</el-scrollbar>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="m-sidemenu">
|
|
<cpt-card>
|
|
<div class="title">
|
|
<img src="@/assets/img/shuju/title-tip.png" />
|
|
<span>指挥调度</span>
|
|
</div>
|
|
|
|
<div class="list">
|
|
<sidemenu
|
|
:orgId="orgId"
|
|
@change="handleChangeMenu"
|
|
:grandIcoList="dotIcoList"
|
|
></sidemenu>
|
|
</div>
|
|
</cpt-card>
|
|
</div>
|
|
</div>
|
|
|
|
<event-info
|
|
v-if="pageType === 'watch-event'"
|
|
ref="ref_event"
|
|
:eventId="eventId"
|
|
@handleClose="handleClose"
|
|
/>
|
|
|
|
<service-info
|
|
v-if="pageType === 'create-service'"
|
|
ref="ref_service"
|
|
@handleClose="handleClose"
|
|
/>
|
|
|
|
<demand-info
|
|
v-if="pageType === 'create-demand'"
|
|
ref="ref_demand"
|
|
:icResiUserId="icResiUserId"
|
|
:selGridId="selGridId"
|
|
@handleClose="handleClose"
|
|
/>
|
|
|
|
<qsydw
|
|
v-if="pageType === 'watch-xuncha'"
|
|
ref="ref_xuncha"
|
|
:enterpriseId="enterpriseId"
|
|
@handleClose="handleClose"
|
|
/>
|
|
|
|
<!-- <people v-if="pageType==='watch-resi'"
|
|
:uid="icResiUserId"
|
|
ref="ref_people"></people> -->
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import nextTick from "dai-js/tools/nextTick";
|
|
import { mapGetters } from "vuex";
|
|
import { Loading } from "element-ui"; //引入Loading服务
|
|
import { requestPost } from "@/js/dai/request";
|
|
import People from "@/views/modules/visual/basicinfo/people";
|
|
import cptCard from "@/views/modules/visual/cpts/card";
|
|
import gridMap from "@/views/modules/visual/command/cpts/map";
|
|
import sidemenu from "@/views/modules/visual/command/cpts/sidemenu";
|
|
import sidemenuLeft from "@/views/modules/visual/command/cpts/sidemenu-left";
|
|
import ScreenLoading from "@/views/modules/visual/cpts/loading";
|
|
|
|
import eventInfo from "@/views/modules/visual/command/cpts/eventInfo";
|
|
import serviceInfo from "@/views/modules/visual/command/cpts/serviceInfo";
|
|
import demandInfo from "@/views/modules/visual/command/cpts/demandInfo";
|
|
import qsydw from "@/views/modules/visual/command/cpts/qsydw";
|
|
|
|
let loading; //加载动画
|
|
|
|
function iniSearchResult() {
|
|
return [
|
|
{
|
|
type: "position",
|
|
title: "地点",
|
|
showedMore: false,
|
|
list: [],
|
|
allList: [],
|
|
},
|
|
{
|
|
type: "resi",
|
|
title: "居民",
|
|
showedMore: false,
|
|
list: [],
|
|
allList: [],
|
|
},
|
|
{
|
|
type: "event",
|
|
title: "事件",
|
|
showedMore: false,
|
|
list: [],
|
|
allList: [],
|
|
},
|
|
{
|
|
type: "resource",
|
|
title: "资源",
|
|
showedMore: false,
|
|
list: [],
|
|
allList: [],
|
|
},
|
|
];
|
|
}
|
|
|
|
export default {
|
|
name: "HomeMap",
|
|
|
|
components: {
|
|
People,
|
|
cptCard,
|
|
ScreenLoading,
|
|
gridMap,
|
|
sidemenu,
|
|
sidemenuLeft,
|
|
eventInfo,
|
|
serviceInfo,
|
|
demandInfo,
|
|
qsydw,
|
|
},
|
|
|
|
props: {},
|
|
|
|
computed: {
|
|
...mapGetters(["clientHeight"]),
|
|
},
|
|
|
|
data() {
|
|
return {
|
|
showAgencyList: false,
|
|
|
|
orgData: {}, //当前组织对象
|
|
orgId: "",
|
|
orgLevel: "",
|
|
|
|
subAgencyArray: [], //下拉框数据
|
|
|
|
//下钻层级记录
|
|
runNum: 0,
|
|
runAgencyArray: [],
|
|
selUserId: "",
|
|
|
|
dotList: [],
|
|
categoryKeys: [],
|
|
coverageTypes: [],
|
|
|
|
dotIcoList: {
|
|
anzhibangjiao: require("@/assets/img/shuju/command/ico/anzhibangjiao.png"),
|
|
buliangqingshaonian: require("@/assets/img/shuju/command/ico/buliangqingshaonian.png"),
|
|
shequjiaozheng: require("@/assets/img/shuju/command/ico/shequjiaozheng.png"),
|
|
resi_xfry: require("@/assets/img/shuju/command/ico/resi_xfry.png"),
|
|
xidurenyuan: require("@/assets/img/shuju/command/ico/xidurenyuan.png"),
|
|
xiejiaorenyuan: require("@/assets/img/shuju/command/ico/xiejiaorenyuan.png"),
|
|
zhaoshizhaohuojingshenbing: require("@/assets/img/shuju/command/ico/zhaoshizhaohuojingshenbing.png"),
|
|
|
|
enterprise_patrol_unqualified: require("@/assets/img/shuju/command/ico/enterprise_patrol_unqualified.png"),
|
|
|
|
yjdw: require("@/assets/img/shuju/command/ico/yjdw.png"),
|
|
sr_gy: require("@/assets/img/shuju/command/ico/sr_gy.png"),
|
|
sr_gc: require("@/assets/img/shuju/command/ico/sr_gc.png"),
|
|
whdw: require("@/assets/img/shuju/command/ico/whdw.png"),
|
|
sr_ggld: require("@/assets/img/shuju/command/ico/sr_ggld.png"),
|
|
lwh: require("@/assets/img/shuju/command/ico/lwh.png"),
|
|
sr_tyc: require("@/assets/img/shuju/command/ico/sr_tyc.png"),
|
|
lyjlb: require("@/assets/img/shuju/command/ico/lyjlb.png"),
|
|
sr_yjy: require("@/assets/img/shuju/command/ico/sr_yjy.png"),
|
|
zaxld: require("@/assets/img/shuju/command/ico/zaxld.png"),
|
|
other: require("@/assets/img/shuju/command/ico/other.png"),
|
|
sr_jzz: require("@/assets/img/shuju/command/ico/sr_jzz.png"),
|
|
sr_djc: require("@/assets/img/shuju/command/ico/sr_djc.png"),
|
|
sr_rfqck: require("@/assets/img/shuju/command/ico/sr_rfqck.png"),
|
|
ep_lg: require("@/assets/img/shuju/command/ico/ep_lg.png"),
|
|
sr_xfz: require("@/assets/img/shuju/command/ico/sr_xfz.png"),
|
|
pu_jgzsbm: require("@/assets/img/shuju/command/ico/pu_jgzsbm.png"),
|
|
ep_qt: require("@/assets/img/shuju/command/ico/ep_qt.png"),
|
|
|
|
sr_others: require("@/assets/img/shuju/command/ico/sr_others.png"),
|
|
cm_others: require("@/assets/img/shuju/command/ico/cm_others.png"),
|
|
ps_others: require("@/assets/img/shuju/command/ico/ps_others.png"),
|
|
ps_nat: require("@/assets/img/shuju/command/ico/ps_nat.png"),
|
|
ps_vaccine: require("@/assets/img/shuju/command/ico/ps_vaccine.png"),
|
|
|
|
gr_czw: require("@/assets/img/shuju/command/ico/gr_czw.png"),
|
|
ep_cycs: require("@/assets/img/shuju/command/ico/ep_cycs.png"),
|
|
dc_jyz: require("@/assets/img/shuju/command/ico/dc_jyz.png"),
|
|
ep_gwylcs: require("@/assets/img/shuju/command/ico/ep_gwylcs.png"),
|
|
dc_jqz: require("@/assets/img/shuju/command/ico/dc_jqz.png"),
|
|
dc_whpdw: require("@/assets/img/shuju/command/ico/dc_whpdw.png"),
|
|
ep_wb: require("@/assets/img/shuju/command/ico/ep_wb.png"),
|
|
ep_mrxycs: require("@/assets/img/shuju/command/ico/ep_mrxycs.png"),
|
|
dc_yqhjz: require("@/assets/img/shuju/command/ico/dc_yqhjz.png"),
|
|
dc_jzgd: require("@/assets/img/shuju/command/ico/dc_jzgd.png"),
|
|
ep_scjgqy: require("@/assets/img/shuju/command/ico/ep_scjgqy.png"),
|
|
|
|
cm_nmsc: require("@/assets/img/shuju/command/ico/cm_nmsc.png"),
|
|
event_tdnd: require("@/assets/img/shuju/command/ico/event_tdnd.png"),
|
|
cm_bhsc: require("@/assets/img/shuju/command/ico/cm_bhsc.png"),
|
|
cm_cjsc: require("@/assets/img/shuju/command/ico/cm_cjsc.png"),
|
|
ep_lssd: require("@/assets/img/shuju/command/ico/ep_lssd.png"),
|
|
|
|
resi_szry: require("@/assets/img/shuju/command/ico/resi_szry.png"),
|
|
ps_lyy: require("@/assets/img/shuju/command/ico/ps_lyy.png"),
|
|
resi_snry: require("@/assets/img/shuju/command/ico/resi_snry.png"),
|
|
ps_mzb: require("@/assets/img/shuju/command/ico/ps_mzb.png"),
|
|
ps_zs: require("@/assets/img/shuju/command/ico/ps_zs.png"),
|
|
ps_wss: require("@/assets/img/shuju/command/ico/ps_wss.png"),
|
|
ps_jjz: require("@/assets/img/shuju/command/ico/ps_jjz.png"),
|
|
ep_xx: require("@/assets/img/shuju/command/ico/ep_xx.png"),
|
|
ep_yy: require("@/assets/img/shuju/command/ico/ep_yy.png"),
|
|
|
|
volunteer_nengrendaren: require("@/assets/img/shuju/command/ico/volunteer_nengrendaren.png"),
|
|
volunteer_daibanyuan: require("@/assets/img/shuju/command/ico/volunteer_daibanyuan.png"),
|
|
volunteer_tiaojieyuan: require("@/assets/img/shuju/command/ico/volunteer_tiaojieyuan.png"),
|
|
volunteer_caijiyuan: require("@/assets/img/shuju/command/ico/volunteer_caijiyuan.png"),
|
|
volunteer_zhianxunluo: require("@/assets/img/shuju/command/ico/volunteer_zhianxunluo.png"),
|
|
volunteer_others: require("@/assets/img/shuju/command/ico/volunteer_others.png"),
|
|
volunteer_dangyuanzhongxinhu: require("@/assets/img/shuju/command/ico/volunteer_dangyuanzhongxinhu.png"),
|
|
|
|
pu_0: require("@/assets/img/shuju/command/ico/pu_0.png"),
|
|
pu_1: require("@/assets/img/shuju/command/ico/pu_1.png"),
|
|
pu_2: require("@/assets/img/shuju/command/ico/pu_2.png"),
|
|
pu_3: require("@/assets/img/shuju/command/ico/pu_3.png"),
|
|
pu_4: require("@/assets/img/shuju/command/ico/pu_4.png"),
|
|
pu_5: require("@/assets/img/shuju/command/ico/pu_5.png"),
|
|
pu_6: require("@/assets/img/shuju/command/ico/pu_6.png"),
|
|
pu_7: require("@/assets/img/shuju/command/ico/pu_7.png"),
|
|
},
|
|
|
|
gridCountData: [],
|
|
dotList2: [],
|
|
categoryKeys2: [],
|
|
coverageTypes2: [],
|
|
dotIcoList2: {
|
|
event_tdnd: require("@/assets/img/shuju/command/ico3/event_tdnd.png"),
|
|
enterprise_patrol_unqualified: require("@/assets/img/shuju/command/ico3/enterprise_patrol_unqualified.png"),
|
|
resi_xfry: require("@/assets/img/shuju/command/ico3/resi_xfry.png"),
|
|
xiejiaorenyuan: require("@/assets/img/shuju/command/ico3/xiejiaorenyuan.png"),
|
|
zhaoshizhaohuojingshenbing: require("@/assets/img/shuju/command/ico3/zhaoshizhaohuojingshenbing.png"),
|
|
buliangqingshaonian: require("@/assets/img/shuju/command/ico3/buliangqingshaonian.png"),
|
|
shequjiaozheng: require("@/assets/img/shuju/command/ico3/shequjiaozheng.png"),
|
|
xidurenyuan: require("@/assets/img/shuju/command/ico3/xidurenyuan.png"),
|
|
IS_DBH: require("@/assets/img/shuju/command/ico3/IS_DBH.png"),
|
|
IS_YLFN: require("@/assets/img/shuju/command/ico3/IS_YLFN.png"),
|
|
IS_OLD_PEOPLE: require("@/assets/img/shuju/command/ico3/IS_OLD_PEOPLE.png"),
|
|
IS_UNEMPLOYED: require("@/assets/img/shuju/command/ico3/IS_UNEMPLOYED.png"),
|
|
IS_DB: require("@/assets/img/shuju/command/ico3/IS_DB.png"),
|
|
IS_MB: require("@/assets/img/shuju/command/ico3/IS_MB.png"),
|
|
anzhibangjiao: require("@/assets/img/shuju/command/ico3/anzhibangjiao.png"),
|
|
IS_KC: require("@/assets/img/shuju/command/ico3/IS_KC.png"),
|
|
IS_XFRY: require("@/assets/img/shuju/command/ico3/IS_XFRY.png"),
|
|
IS_SD: require("@/assets/img/shuju/command/ico3/IS_SD.png"),
|
|
IS_SN: require("@/assets/img/shuju/command/ico3/IS_SN.png"),
|
|
IS_SZ: require("@/assets/img/shuju/command/ico3/IS_SZ.png"),
|
|
IS_SPECIAL: require("@/assets/img/shuju/command/ico3/IS_SPECIAL.png"),
|
|
IS_UNITED_FRONT: require("@/assets/img/shuju/command/ico3/IS_UNITED_FRONT.png"),
|
|
IS_VOLUNTEER: require("@/assets/img/shuju/command/ico3/IS_VOLUNTEER.png"),
|
|
IS_VETERANS: require("@/assets/img/shuju/command/ico3/IS_VETERANS.png"),
|
|
IS_ENSURE_HOUSE: require("@/assets/img/shuju/command/ico3/IS_ENSURE_HOUSE.png"),
|
|
IS_CJ: require("@/assets/img/shuju/command/ico3/IS_CJ.png"),
|
|
IS_PARTY: require("@/assets/img/shuju/command/ico3/IS_PARTY.png"),
|
|
},
|
|
|
|
searchName: "",
|
|
showedSearchResult: false,
|
|
searchResult: iniSearchResult(),
|
|
|
|
pageType: "",
|
|
icResiUserId: "",
|
|
selGridId: "",
|
|
eventId: "",
|
|
enterpriseId: "",
|
|
};
|
|
},
|
|
|
|
watch: {
|
|
categoryKeys() {
|
|
this.requestMapDot();
|
|
},
|
|
categoryKeys2() {
|
|
this.requestMapDot2();
|
|
},
|
|
searchName() {
|
|
this.showedSearchResult = false;
|
|
this.searchResult = iniSearchResult();
|
|
},
|
|
},
|
|
|
|
async mounted() {
|
|
//加载组织数据
|
|
await this.loadOrgData();
|
|
await this.requestMapDot();
|
|
await this.requestMapDot2();
|
|
},
|
|
|
|
methods: {
|
|
handleClickDotBtn(type, info) {
|
|
this.pageType = type;
|
|
if (type == "create-service") {
|
|
// 点击网格发起服务
|
|
} else if (type == "watch-resi") {
|
|
this.toSubAgency("people", info.icResiUserId);
|
|
this.icResiUserId = info.icResiUserId;
|
|
// 查看居民详情
|
|
} else if (type == "watch-event") {
|
|
// 查看事件
|
|
this.eventId = info.icEventId;
|
|
} else if (type == "create-demand") {
|
|
// 发起需求
|
|
this.icResiUserId = info.icResiUserId;
|
|
this.selGridId = info.gridId;
|
|
} else if (type == "watch-xuncha") {
|
|
this.enterpriseId = info.enterpriseId;
|
|
}
|
|
},
|
|
|
|
handleClose() {
|
|
this.pageType = "";
|
|
},
|
|
|
|
handleClickMapBox() {
|
|
this.showedSearchResult = false;
|
|
},
|
|
|
|
handleTo(item) {
|
|
this.$router.push({
|
|
path: `/main-shuju/visual-basicinfo-people-list`,
|
|
query: {
|
|
columnName: item.columnName,
|
|
label: item.label,
|
|
id: this.orgId,
|
|
level: this.orgLevel,
|
|
},
|
|
});
|
|
},
|
|
hideAgencyList() {
|
|
this.showAgencyList = !this.showAgencyList;
|
|
},
|
|
|
|
//加载组织数据
|
|
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.orgData.id;
|
|
this.orgLevel = this.orgData.level;
|
|
if (data.children && data.children.length > 0) {
|
|
this.subAgencyArray = data.children;
|
|
} else {
|
|
this.subAgencyArray = [];
|
|
}
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
handleChangeMenuLeft(obj) {
|
|
this.coverageTypes2 = [obj.coverageType];
|
|
this.categoryKeys2 = [obj.categoryKey];
|
|
this.placeType2 = obj.placeType;
|
|
},
|
|
|
|
handleChangeMenu(list) {
|
|
console.log("handleChangeMenu", list);
|
|
let categoryKeys = [];
|
|
let coverageTypes = [];
|
|
list.forEach((item) => {
|
|
if (item.selected) {
|
|
coverageTypes.push(item.coverageType);
|
|
}
|
|
item.categories.forEach((subitem) => {
|
|
if (subitem.selected) {
|
|
coverageTypes.push(item.coverageType);
|
|
categoryKeys.push(subitem.categoryKey);
|
|
}
|
|
});
|
|
|
|
item.placeTypesInAnalysis.forEach((subitem) => {
|
|
subitem.categories.forEach((subitem2) => {
|
|
if (subitem2.selected) {
|
|
categoryKeys.push(subitem2.categoryKey);
|
|
coverageTypes.push(subitem2.coverageType);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
this.categoryKeys = [...new Set(categoryKeys)];
|
|
this.coverageTypes = [...new Set(coverageTypes)];
|
|
this.requestMapDot();
|
|
},
|
|
|
|
async requestMapDot() {
|
|
if (!this.orgId) return;
|
|
const url = "/data/aggregator/coverage/dataList";
|
|
let params = {
|
|
orgId: this.orgId,
|
|
orgType: "agency",
|
|
coverageTypes: this.coverageTypes,
|
|
categoryKeys: this.categoryKeys,
|
|
isPage: false,
|
|
};
|
|
|
|
const { data, code, msg } = await requestPost(url, params);
|
|
|
|
if (code === 0) {
|
|
this.dotList = data.list;
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
async requestMapDot2() {
|
|
if (!this.orgId) return;
|
|
this.requestMapDot2Count();
|
|
const url = "/data/aggregator/coverage/dataList-left";
|
|
let params = {
|
|
orgId: this.orgId,
|
|
orgType: "agency",
|
|
coverageTypes: this.coverageTypes2,
|
|
categoryKeys: this.categoryKeys2,
|
|
isPage: false,
|
|
};
|
|
|
|
const { data, code, msg } = await requestPost(url, params);
|
|
|
|
if (code === 0) {
|
|
this.dotList2 = data.list.map((item) => {
|
|
item.categoryKey = this.categoryKeys2[0];
|
|
return item;
|
|
});
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
async requestMapDot2Count() {
|
|
const url = "/data/aggregator/coverage/dataList-left-subtotal";
|
|
let params = {
|
|
orgId: this.orgId,
|
|
orgType: "agency",
|
|
coverageType: this.coverageTypes2[0],
|
|
categoryKey: this.categoryKeys2[0],
|
|
placeType: this.placeType2,
|
|
};
|
|
|
|
const { data, code, msg } = await requestPost(url, params);
|
|
|
|
if (code === 0) {
|
|
this.gridCountData = [...data];
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
//子组件点击房间，刷新右侧list
|
|
refreshInfoList(selId, type) {
|
|
this.orgId = selId;
|
|
this.level = "";
|
|
},
|
|
|
|
//返回所选组织
|
|
handleClickAgency(index) {
|
|
//如果是从小区返回，清空一下小区的人员显示列表
|
|
if (this.orgLevel === "neighborHood") {
|
|
this.$nextTick(() => {
|
|
// 小区id，小区名称
|
|
this.$refs.ref_community.handleCloseAllUser();
|
|
});
|
|
}
|
|
const cutNum = this.runAgencyArray.length - index; //要减去的长度
|
|
this.runNum = this.runNum - cutNum;
|
|
|
|
this.orgData = this.runAgencyArray[index];
|
|
|
|
for (let i = 0; i < cutNum; i++) {
|
|
this.runAgencyArray.pop();
|
|
}
|
|
|
|
this.orgId = this.orgData.id;
|
|
this.orgLevel = this.orgData.level;
|
|
|
|
if (this.orgLevel === "people") {
|
|
} else if (this.orgLevel === "neighborHood") {
|
|
//显示小区
|
|
} else {
|
|
this.$nextTick(() => {
|
|
this.refreshMap(true);
|
|
this.$forceUpdate();
|
|
});
|
|
}
|
|
},
|
|
|
|
//点击组织列表数据
|
|
clickAgencyItem(item, index) {
|
|
console.log(item);
|
|
if (item.level == "grid") {
|
|
} else {
|
|
let e = {
|
|
selected: [],
|
|
};
|
|
let one = {
|
|
values_: item,
|
|
};
|
|
e.selected.push(one);
|
|
|
|
this.toSubAgency("polygon", e);
|
|
}
|
|
},
|
|
|
|
//下钻到下一级 type点击的类型:polygon 点击多边形（分为点击组织/小区） people 点击详情
|
|
async toSubAgency(type, e) {
|
|
//点击小区neighborHood显示楼栋，点击非小区，进入下一级地图
|
|
if (type === "people") {
|
|
this.runNum++;
|
|
this.runAgencyArray.push(this.orgData);
|
|
this.orgLevel = "people";
|
|
this.selUserId = e;
|
|
this.orgId = "";
|
|
this.orgData = {
|
|
id: "",
|
|
level: "people",
|
|
name: "人员档案",
|
|
};
|
|
} else {
|
|
if (!e) {
|
|
return false;
|
|
}
|
|
if (!e.selected[0]) {
|
|
return false;
|
|
}
|
|
this.runNum++;
|
|
|
|
this.runAgencyArray.push(this.orgData);
|
|
|
|
this.subAgencyArray.forEach((item) => {
|
|
if (item.id === e.selected[0].values_.id) {
|
|
this.orgId = item.id;
|
|
this.orgLevel = item.level;
|
|
this.orgData = item;
|
|
}
|
|
});
|
|
|
|
if (this.orgLevel === "neighborHood") {
|
|
this.requestMapDot();
|
|
this.$nextTick(() => {
|
|
// 小区id，小区名称
|
|
this.$refs.ref_community.initData(
|
|
this.orgData.id,
|
|
this.orgData.name
|
|
);
|
|
});
|
|
} else {
|
|
this.refreshMap(true);
|
|
}
|
|
}
|
|
},
|
|
|
|
//刷新地图
|
|
async refreshMap(isRefreshView) {
|
|
//加载组织数据
|
|
await this.loadOrgData();
|
|
|
|
await this.requestMapDot();
|
|
await this.requestMapDot2();
|
|
},
|
|
|
|
async handleSearch() {
|
|
const { searchName } = this;
|
|
if (!searchName) {
|
|
return this.$message.error("请输入搜索内容");
|
|
}
|
|
|
|
await this.searchPos();
|
|
|
|
const url = "/data/aggregator/coverage/search";
|
|
let params = {
|
|
name: searchName,
|
|
pageSize: 10,
|
|
};
|
|
|
|
const { data, code, msg } = await requestPost(url, params);
|
|
|
|
if (code === 0) {
|
|
data.userInfos.forEach((item) => {
|
|
item.placeType = "resi";
|
|
item.id = item.icUserId;
|
|
});
|
|
data.eventInfos.forEach((item) => {
|
|
item.placeType = "event";
|
|
item.id = item.eventId;
|
|
});
|
|
data.resourceInfos.forEach((item) => {
|
|
item.placeType = item.resourceType;
|
|
item.id = item.resourceId;
|
|
});
|
|
this.searchResult[1].list = data.userInfos.slice(0, 2);
|
|
this.searchResult[1].allList = data.userInfos;
|
|
this.searchResult[2].list = data.eventInfos.slice(0, 2);
|
|
this.searchResult[2].allList = data.eventInfos;
|
|
this.searchResult[3].list = data.resourceInfos.slice(0, 2);
|
|
this.searchResult[3].allList = data.resourceInfos;
|
|
console.log("检索", this.searchResult);
|
|
if (this.searchResult.every((item) => item.list.length == 0)) {
|
|
this.$message.error("未检索到相关内容");
|
|
} else {
|
|
this.showedSearchResult = true;
|
|
}
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
clearSearch() {
|
|
this.searchName = "";
|
|
this.$refs.map.removeDotMarker();
|
|
},
|
|
|
|
async searchPos() {
|
|
let data = await this.$refs.map.searchPos(this.searchName);
|
|
|
|
console.log("检索位置", data);
|
|
|
|
if (
|
|
data &&
|
|
data.poiList &&
|
|
Array.isArray(data.poiList.pois) &&
|
|
data.poiList.pois.length > 0
|
|
) {
|
|
let list = data.poiList.pois.map((item) => {
|
|
item.longitude = item.location.lng;
|
|
item.latitude = item.location.lat;
|
|
return item;
|
|
});
|
|
this.searchResult[0].list = list.slice(0, 2);
|
|
this.searchResult[0].allList = list;
|
|
}
|
|
},
|
|
|
|
handleClickSearchLi(li) {
|
|
console.log("handleClickSearchLi", li);
|
|
if (!li.longitude) {
|
|
return this.$message.error("请先设置坐标");
|
|
}
|
|
this.$refs.map.setDotMarker(li, [
|
|
parseFloat(li.longitude),
|
|
parseFloat(li.latitude),
|
|
]);
|
|
this.showedSearchResult = false;
|
|
},
|
|
|
|
handleClickSearchResultMore(item) {
|
|
console.log(item);
|
|
let res = !item.showedMore;
|
|
if (res) {
|
|
this.searchResult.forEach((item) => (item.showedMore = false));
|
|
}
|
|
item.showedMore = !item.showedMore;
|
|
},
|
|
//开启加载动画
|
|
startLoading() {
|
|
loading = Loading.service({
|
|
lock: true, //是否锁定
|
|
text: "正在加载……", //加载中需要显示的文字
|
|
background: "rgba(0,0,0,.7)", //背景颜色
|
|
});
|
|
},
|
|
|
|
//结束加载动画
|
|
endLoading() {
|
|
//clearTimeout(timer);
|
|
if (loading) {
|
|
loading.close();
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style
|
|
lang="scss"
|
|
src="@/assets/scss/modules/visual/command.scss"
|
|
scoped
|
|
></style>
|
|
|