|
|
|
@ -21,7 +21,7 @@ |
|
|
|
color: #3e8ef7; |
|
|
|
cursor: pointer; |
|
|
|
" |
|
|
|
icon="el-icon-edit">修改</el-link> |
|
|
|
icon="el-icon-edit">编辑</el-link> |
|
|
|
</el-breadcrumb-item> |
|
|
|
</el-breadcrumb> |
|
|
|
</el-col> |
|
|
|
@ -275,7 +275,7 @@ |
|
|
|
<el-dialog title="新增部门" |
|
|
|
:visible.sync="dialogVisible" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px" |
|
|
|
:rules="rules"> |
|
|
|
<el-form-item label="部门名称" |
|
|
|
@ -311,7 +311,7 @@ |
|
|
|
<el-dialog title="新增网格" |
|
|
|
:visible.sync="dialogVisibleGrid" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px" |
|
|
|
:rules="rules"> |
|
|
|
<el-form-item label="网格名称" |
|
|
|
@ -351,9 +351,35 @@ |
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
<!-- 组织位置 --> |
|
|
|
<el-form-item label="坐标"> |
|
|
|
<div id="con"></div> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item |
|
|
|
label="坐标" |
|
|
|
prop="longitude" |
|
|
|
label-width="120px" |
|
|
|
style="display: block" |
|
|
|
> |
|
|
|
<div style="width: 500px"> |
|
|
|
<el-select |
|
|
|
v-model="searchValue" |
|
|
|
filterable |
|
|
|
style="width: 500px" |
|
|
|
remote |
|
|
|
:reserve-keyword="true" |
|
|
|
placeholder="请输入关键词" |
|
|
|
:remote-method="remoteMethod" |
|
|
|
:loading="loading" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="(item, index) in searchOptions" |
|
|
|
@click.native="handleClickKey(index)" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<div id="wangge" class="div_map"></div> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
|
|
|
|
<div slot="footer"> |
|
|
|
@ -369,7 +395,7 @@ |
|
|
|
<el-dialog title="新增人员" |
|
|
|
:visible.sync="dialogVisiblePeo" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form :model="peoForm" |
|
|
|
label-width="120px" |
|
|
|
ref="addPeoForm" |
|
|
|
@ -456,7 +482,7 @@ |
|
|
|
title="人员修改" |
|
|
|
:visible.sync="modifyPeo" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form :model="peoForm" |
|
|
|
label-width="120px" |
|
|
|
ref="editPeoForm" |
|
|
|
@ -552,7 +578,7 @@ |
|
|
|
title="人员详情" |
|
|
|
:visible.sync="details" |
|
|
|
width="850" |
|
|
|
:before-close="handleClosePeoView"> |
|
|
|
:before-close="handleClosePeoView" destroy-on-close> |
|
|
|
<el-form label-width="120px"> |
|
|
|
<el-form-item label="姓名"> |
|
|
|
<el-input v-model="peoForm.name" |
|
|
|
@ -602,7 +628,7 @@ |
|
|
|
title="人员调动" |
|
|
|
:visible.sync="transferPeo" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px" |
|
|
|
:model="agencyForm"> |
|
|
|
<el-form-item label="姓名"> |
|
|
|
@ -646,7 +672,7 @@ |
|
|
|
title="新增组织" |
|
|
|
:visible.sync="createAgencyDialogFlag" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px"> |
|
|
|
<el-form-item label="组织名称"> |
|
|
|
<el-input v-model="agencyForm.agencyName" |
|
|
|
@ -678,8 +704,34 @@ |
|
|
|
<el-input v-model="agencyForm.mobile" |
|
|
|
placeholder="请输入联系电话"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="坐标"> |
|
|
|
<div id="con"></div> |
|
|
|
<el-form-item |
|
|
|
label="坐标" |
|
|
|
prop="longitude" |
|
|
|
label-width="120px" |
|
|
|
style="display: block" |
|
|
|
> |
|
|
|
<div style="width: 500px"> |
|
|
|
<el-select |
|
|
|
v-model="searchValue" |
|
|
|
filterable |
|
|
|
style="width: 500px" |
|
|
|
remote |
|
|
|
:reserve-keyword="true" |
|
|
|
placeholder="请输入关键词" |
|
|
|
:remote-method="remoteMethod" |
|
|
|
:loading="loading" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="(item, index) in searchOptions" |
|
|
|
@click.native="handleClickKey(index)" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<div id="jiedao" class="div_map"></div> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<div slot="footer"> |
|
|
|
@ -694,7 +746,7 @@ |
|
|
|
title="修改组织" |
|
|
|
:visible.sync="modifyCityOrgPop" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px"> |
|
|
|
<el-form-item label="组织名称"> |
|
|
|
<el-input v-model="OrgDetailsForm.agencyName" |
|
|
|
@ -713,8 +765,34 @@ |
|
|
|
<el-input v-model="OrgDetailsForm.mobile" |
|
|
|
placeholder="请输入联系电话"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="坐标"> |
|
|
|
<div id="con"></div> |
|
|
|
<el-form-item |
|
|
|
label="坐标" |
|
|
|
prop="longitude" |
|
|
|
label-width="120px" |
|
|
|
style="display: block" |
|
|
|
> |
|
|
|
<div style="width: 500px"> |
|
|
|
<el-select |
|
|
|
v-model="searchValue" |
|
|
|
filterable |
|
|
|
style="width: 500px" |
|
|
|
remote |
|
|
|
:reserve-keyword="true" |
|
|
|
placeholder="请输入关键词" |
|
|
|
:remote-method="remoteMethod" |
|
|
|
:loading="loading" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="(item, index) in searchOptions" |
|
|
|
@click.native="handleClickKey(index)" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<div id="shiqu" class="div_map"></div> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<div slot="footer"> |
|
|
|
@ -729,7 +807,7 @@ |
|
|
|
title="修改组织" |
|
|
|
:visible.sync="streetOrCommunity" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px"> |
|
|
|
<el-form-item label="组织名称"> |
|
|
|
<el-input v-model="OrgDetailsForm.agencyName" |
|
|
|
@ -761,8 +839,34 @@ |
|
|
|
<el-input v-model="OrgDetailsForm.mobile" |
|
|
|
placeholder="请输入联系电话"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="坐标"> |
|
|
|
<div id="con"></div> |
|
|
|
<el-form-item |
|
|
|
label="坐标" |
|
|
|
prop="longitude" |
|
|
|
label-width="120px" |
|
|
|
style="display: block" |
|
|
|
> |
|
|
|
<div style="width: 500px"> |
|
|
|
<el-select |
|
|
|
v-model="searchValue" |
|
|
|
filterable |
|
|
|
style="width: 500px" |
|
|
|
remote |
|
|
|
:reserve-keyword="true" |
|
|
|
placeholder="请输入关键词" |
|
|
|
:remote-method="remoteMethod" |
|
|
|
:loading="loading" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="(item, index) in searchOptions" |
|
|
|
@click.native="handleClickKey(index)" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<div id="jiedao" class="div_map"></div> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<div slot="footer"> |
|
|
|
@ -777,7 +881,7 @@ |
|
|
|
title="修改部门" |
|
|
|
:visible.sync="OrgUnitPop" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px"> |
|
|
|
<el-form-item label="部门名称"> |
|
|
|
<el-input v-model="OrgUnitDetailsForm.departmentName" |
|
|
|
@ -809,7 +913,7 @@ |
|
|
|
title="修改网格" |
|
|
|
:visible.sync="modifyGridPop" |
|
|
|
width="850" |
|
|
|
:before-close="handleClose"> |
|
|
|
:before-close="handleClose" destroy-on-close> |
|
|
|
<el-form label-width="120px"> |
|
|
|
<el-form-item label="网格名称"> |
|
|
|
<el-input v-model="modifyGridFrom.gridName" |
|
|
|
@ -852,8 +956,34 @@ |
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
<!-- 组织位置,地图 --> |
|
|
|
<el-form-item label="坐标"> |
|
|
|
<div id="con"></div> |
|
|
|
<el-form-item |
|
|
|
label="坐标" |
|
|
|
prop="longitude" |
|
|
|
label-width="120px" |
|
|
|
style="display: block" |
|
|
|
> |
|
|
|
<div style="width: 500px"> |
|
|
|
<el-select |
|
|
|
v-model="searchValue" |
|
|
|
filterable |
|
|
|
style="width: 500px" |
|
|
|
remote |
|
|
|
:reserve-keyword="true" |
|
|
|
placeholder="请输入关键词" |
|
|
|
:remote-method="remoteMethod" |
|
|
|
:loading="loading" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="(item, index) in searchOptions" |
|
|
|
@click.native="handleClickKey(index)" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<div id="wangge" class="div_map"></div> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<div slot="footer"> |
|
|
|
@ -868,7 +998,7 @@ |
|
|
|
<script> |
|
|
|
import { requestPost, requestGet } from "@/js/dai/request"; |
|
|
|
import daiMap from "@/utils/dai-map"; |
|
|
|
|
|
|
|
var map |
|
|
|
export default { |
|
|
|
data () { |
|
|
|
return { |
|
|
|
@ -934,6 +1064,9 @@ export default { |
|
|
|
latitude: "", |
|
|
|
longitude: "", |
|
|
|
Navigation: "", |
|
|
|
searchValue:"", |
|
|
|
searchOptions:[], |
|
|
|
resultList:[], |
|
|
|
// 查询参数 |
|
|
|
queryParams: { |
|
|
|
deptName: undefined, |
|
|
|
@ -1133,41 +1266,43 @@ export default { |
|
|
|
dialogVisibleGrid (val) { |
|
|
|
if (val) { |
|
|
|
setTimeout(() => { |
|
|
|
this.createMap(); |
|
|
|
this.initMap('wangge'); |
|
|
|
}, 1000); |
|
|
|
} |
|
|
|
}, |
|
|
|
createAgencyDialogFlag (val) { |
|
|
|
if (val) { |
|
|
|
setTimeout(() => { |
|
|
|
this.createMap(); |
|
|
|
this.initMap('jiedao'); |
|
|
|
}, 1000); |
|
|
|
} |
|
|
|
}, |
|
|
|
modifyCityOrgPop (val) { |
|
|
|
if (val) { |
|
|
|
setTimeout(() => { |
|
|
|
this.createMap(); |
|
|
|
this.initMap('shiqu'); |
|
|
|
}, 1000); |
|
|
|
} |
|
|
|
}, |
|
|
|
streetOrCommunity (val) { |
|
|
|
if (val) { |
|
|
|
setTimeout(() => { |
|
|
|
this.createMap(); |
|
|
|
this.initMap('jiedao'); |
|
|
|
}, 1000); |
|
|
|
} |
|
|
|
}, |
|
|
|
modifyGridPop (val) { |
|
|
|
if (val) { |
|
|
|
setTimeout(() => { |
|
|
|
this.createMap(); |
|
|
|
this.initMap('wangge'); |
|
|
|
}, 1000); |
|
|
|
} |
|
|
|
}, |
|
|
|
"latitude":function(val){ |
|
|
|
console.log(val); |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted () { |
|
|
|
// this.initMap() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 点击后获取id |
|
|
|
@ -2326,6 +2461,7 @@ export default { |
|
|
|
modifyOrgInfo () { |
|
|
|
this.judgeOrgInfoLevel = |
|
|
|
this.breadcrumbArr[this.breadcrumbArr.length - 1]; |
|
|
|
console.log(this.judgeOrgInfoLevel.type); |
|
|
|
if (this.judgeOrgInfoLevel.type === "agency") { |
|
|
|
this.getOrgDetailsById(); |
|
|
|
setTimeout(() => { |
|
|
|
@ -2519,108 +2655,90 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
/** 地图初始化 */ |
|
|
|
createMap () { |
|
|
|
// 地图初始化函数，本例取名为init，开发者可根据实际情况定义 |
|
|
|
initMap(id) { |
|
|
|
let { latitude, longitude } = this; |
|
|
|
if ( |
|
|
|
latitude === null || |
|
|
|
latitude === "" || |
|
|
|
longitude === null || |
|
|
|
longitude === "" |
|
|
|
) { |
|
|
|
let { latitude: latitude2, longitude: longitude2 } = |
|
|
|
this.$store.state.user; |
|
|
|
if (!latitude2 || latitude2 == "" || latitude2 == "0") { |
|
|
|
latitude = 39.9088810666821; |
|
|
|
longitude = 116.39743841556731; |
|
|
|
} else { |
|
|
|
latitude = latitude2; |
|
|
|
longitude = longitude2; |
|
|
|
} |
|
|
|
} |
|
|
|
// var center = new window.TMap.LatLng(latitude, longitude); //设置中心点坐标 |
|
|
|
var map = new daiMap( |
|
|
|
document.getElementById("con"), |
|
|
|
{ latitude, longitude }, |
|
|
|
console.log(latitude,longitude); |
|
|
|
let storeLatitude = this.$store.state.user.latitude |
|
|
|
let storeLongitude = this.$store.state.user.longitude |
|
|
|
let lat = latitude || storeLatitude |
|
|
|
let lng = longitude || storeLongitude |
|
|
|
console.log( document.getElementById(id)); |
|
|
|
console.log(lat,lng); |
|
|
|
map = new daiMap( |
|
|
|
document.getElementById(id), |
|
|
|
{ lat , lng }, |
|
|
|
{ |
|
|
|
zoom: 16.2, // 设置地图缩放级别 |
|
|
|
pitch: 43.5, // 设置俯仰角 |
|
|
|
rotation: 45, // 设置地图旋转角度 |
|
|
|
} |
|
|
|
); |
|
|
|
// //初始化地图 |
|
|
|
// var map = new window.TMap.Map("con", { |
|
|
|
// center: center, |
|
|
|
// zoom: 13, // 设置地图缩放级别 |
|
|
|
// pitch: 43.5, // 设置俯仰角 |
|
|
|
// rotation: 45, // 设置地图旋转角度 |
|
|
|
// }); |
|
|
|
|
|
|
|
// // 新建一个地点搜索类 |
|
|
|
// let markers = new window.TMap.MultiMarker({ |
|
|
|
// map: map, |
|
|
|
// geometries: [], |
|
|
|
// }); |
|
|
|
|
|
|
|
// map.on("panend", (e) => { |
|
|
|
// handleMoveCenter(e); |
|
|
|
// }); |
|
|
|
|
|
|
|
// 监听地图平移结束 |
|
|
|
map.on("dragend", (e) => { |
|
|
|
handleMoveCenter(e, (lng, lat) => { |
|
|
|
this.longitude = lng; |
|
|
|
this.latitude = lat; |
|
|
|
}); |
|
|
|
this.handleMoveCenter(e); |
|
|
|
}); |
|
|
|
|
|
|
|
// map.setCenter(latitude, longitude); |
|
|
|
map.setCenter(latitude, longitude); |
|
|
|
map.setMarker(latitude, longitude); |
|
|
|
}, |
|
|
|
|
|
|
|
async handleMoveCenter() { |
|
|
|
//修改地图中心点 |
|
|
|
const { lat, lng } = map.getCenter(); |
|
|
|
this.latitude = lat; |
|
|
|
this.longitude = lng; |
|
|
|
map.setMarker(lat, lng); |
|
|
|
|
|
|
|
let { msg, data } = await map.getAddress(lat, lng); |
|
|
|
if (msg == "success") { |
|
|
|
this.address = data.address; |
|
|
|
this.searchValue = data.address; |
|
|
|
this.searchOptions = []; |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
// setMarker(latitude, longitude); |
|
|
|
|
|
|
|
// function setMarker(lat, lng) { |
|
|
|
// console.log("setMarker", lat, lng); |
|
|
|
// markers.setGeometries([]); |
|
|
|
|
|
|
|
// markers.add([ |
|
|
|
// { |
|
|
|
// id: "4", |
|
|
|
// styleId: "marker", |
|
|
|
// position: new window.TMap.LatLng(lat, lng), |
|
|
|
// properties: { |
|
|
|
// title: "marker4", |
|
|
|
// }, |
|
|
|
// }, |
|
|
|
// ]); |
|
|
|
// } |
|
|
|
|
|
|
|
function handleMoveCenter (e, callback) { |
|
|
|
//修改地图中心点 |
|
|
|
const { lat, lng } = map.getCenter(); |
|
|
|
// const lat = lat; |
|
|
|
// const lng = lng; |
|
|
|
map.setMarker(lat, lng); |
|
|
|
|
|
|
|
// 因为这里不能直接用this，采用回调函数的方式。 |
|
|
|
callback(lng, lat) |
|
|
|
|
|
|
|
// let { msg, data } = await map.getAddress(lat, lng); |
|
|
|
// if (msg == "success") { |
|
|
|
// this.formData.address = data.address |
|
|
|
// this.searchValue = data.address |
|
|
|
// this.searchOptions = [] |
|
|
|
|
|
|
|
// } |
|
|
|
|
|
|
|
//修改地图中心点 |
|
|
|
// const center = map.getCenter(); |
|
|
|
// const lat = center.getLat(); |
|
|
|
// const lng = center.getLng(); |
|
|
|
|
|
|
|
// setMarker(lat, lng); |
|
|
|
async remoteMethod(query) { |
|
|
|
console.log(query); |
|
|
|
if (query !== "") { |
|
|
|
this.loading = true; |
|
|
|
|
|
|
|
const { msg, data } = await map.searchNearby(query); |
|
|
|
this.loading = false; |
|
|
|
this.resultList = []; |
|
|
|
|
|
|
|
if (msg == "success" && data.resultList && data.resultList.length > 0) { |
|
|
|
if (data.resultList && data.resultList.length > 0) { |
|
|
|
this.resultList = data.resultList; |
|
|
|
this.searchOptions = this.resultList.map((item) => { |
|
|
|
return { |
|
|
|
value: `${item.hotPointID}`, |
|
|
|
label: `${item.address + item.name}`, |
|
|
|
}; |
|
|
|
}); |
|
|
|
} |
|
|
|
} else { |
|
|
|
this.searchOptions = [ |
|
|
|
{ |
|
|
|
value: "0", |
|
|
|
label: "未检索到结果", |
|
|
|
}, |
|
|
|
]; |
|
|
|
} |
|
|
|
} else { |
|
|
|
this.searchOptions = []; |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
handleClickKey(index) { |
|
|
|
let selPosition = this.resultList[index]; |
|
|
|
let lonlat = selPosition.lonlat.split(" "); |
|
|
|
map.setCenter(lonlat[1], lonlat[0]); |
|
|
|
map.setMarker(lonlat[1], lonlat[0]); |
|
|
|
this.latitude = lonlat[1]; |
|
|
|
this.longitude = lonlat[0]; |
|
|
|
// this.formData.address = selPosition.address + selPosition.name; |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
