Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
89928441 by 杨威
Options

缓冲区分析功能实现

1 parent 9a157f24
Inline Side-by-side
Showing 4 changed files with 180 additions and 26 deletions
......@@ -87,6 +87,65 @@
<div class="changeMap">
<ChangeMap :viewId="viewId"></ChangeMap>
</div>
<!-- 底部数据展示区域 -->
<div class="bottomResult" v-if="bottomResultDialog">
<div class="closeButn" @click="closeBufferDialog">
<i class="el-icon-close"></i>
</div>
<el-tabs v-model="activeName" >
<el-tab-pane v-for="(item,index) in results" :label="item.label+'('+item.features.length+')个'" :name="'tab'+index" :key="index">
<el-table
:data="item.features"
stripe
border
highlight-current-row
@row-click="resultTabClick"
style="width: 100%">
<el-table-column
label="序号"
type="index"
width="50">
</el-table-column>
<el-table-column
label="宗地代码">
<template slot-scope="scope">
<span>{{ scope.row.attributes['宗地代码'] == 'Null'?'':scope.row.attributes['宗地代码'] }}</span>
</template>
</el-table-column>
<el-table-column
label="不动产单元号">
<template slot-scope="scope">
<span>{{ scope.row.attributes['不动产单元号'] == 'Null'?'':scope.row.attributes['不动产单元号'] }}</span>
</template>
</el-table-column>
<el-table-column
label="项目名称">
<template slot-scope="scope">
<span>{{ scope.row.attributes['项目名称'] == 'Null'?'':scope.row.attributes['项目名称'] }}</span>
</template>
</el-table-column>
<el-table-column
label="不动产权证号">
<template slot-scope="scope">
<span>{{ scope.row.attributes['不动产权证号'] == 'Null'?'':scope.row.attributes['不动产权证号'] }}</span>
</template>
</el-table-column>
<el-table-column
label="权利人">
<template slot-scope="scope">
<span>{{ scope.row.attributes['权利人'] == 'Null'?'':scope.row.attributes['权利人'] }}</span>
</template>
</el-table-column>
<el-table-column
label="坐落">
<template slot-scope="scope">
<span>{{ scope.row.attributes['坐落'] == 'Null'?'':scope.row.attributes['坐落'] }}</span>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</div>
</div>
</template>
<script>
......@@ -122,7 +181,9 @@ export default {
fieldName:"BDCDYH",
heighGraphic:null,
isShowCondition:false,
totalResults:0
totalResults:0,
activeName:"tab0",
bottomResultDialog:false
}
},
mixins:[mapLayerManager,findTask],
......@@ -195,6 +256,16 @@ export default {
}
},
resultTabClick(row,column,evt){
var self = this;
if(row.geometry){
this.extentToGraphic(row,this.heighGraphic,this.viewId,function () {
self.heighGraphic = row;
});
}else {
this.$message.warning("没有图形信息!!")
}
},
//图层选择事件
selectLayerChange(){
var self = this;
......@@ -256,6 +327,18 @@ export default {
this.clearSearchLayer(this.viewId);
this.dialogVisible = false;
},
closeBufferDialog(){
//关闭时清除查询结果 清除数据
this.results = [];
this.selectResLayerId =null;
this.features = [];
this.resultLayers = [];
this.heighGraphic = null;
//清除查询图层
this.clearSearchLayer(this.viewId);
this.clearBufferLayer(this.viewId);
this.bottomResultDialog = false;
},
//处理数据
delIdentifyData(data){
var self = this;
......@@ -291,7 +374,8 @@ export default {
})
var layerAndResult = {
layerId:layerId,
features:[]
features:[],
label:layer.layerLabel
}
var feature = data[i].feature,
attributes = {},
......@@ -302,6 +386,7 @@ export default {
}
}
layerAndResult.features.push(feature);
debugger
self.results.push(layerAndResult);
}
}
......@@ -432,13 +517,13 @@ export default {
align-items: center;
font-weight: 400;
.key{
width: 30%;
margin: 5px 3px;
width: 100px;
margin: 3px 0px;
text-align: right;
color: #505050;
}
.value{
width: 70%;
width: calc(100% - 100px);
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
......@@ -467,5 +552,32 @@ export default {
/deep/ .esri-ui-bottom-right{
bottom: -17px;
}
.bottomResult{
position: absolute;
bottom: 0px;
height: 26%;
overflow: auto;
width: 96%;
background-color: #ffffff;
margin: 10px;
border-radius: 4px;
padding: 5px;
.closeButn{
position: relative;
float: right;
font-size: 20px;
color: #9B9B9B;
z-index: 16;
}
.closeButn :hover{
cursor:pointer;
}
/deep/ .el-tabs__header{
margin: 0 0 0px;
}
/deep/ .el-table td, .el-table th.is-leaf {
text-align: center;
}
}
}
</style>
\ No newline at end of file
......
<template>
<template>
<div>
<ul class="uploadDiv" v-if="!resultDialog && !txtResultDialog">
<li>
<el-upload
<el-upload
class="avatar-uploader"
action="#"
accept=".txt"
:auto-upload="false"
:on-change="txtFileChange"
:show-file-list="false"
>
<i class="el-icon-upload"></i>
<div class="title">TXT文本格式</div>
......@@ -332,12 +331,10 @@ export default {
.uploadDiv{
display: flex;
justify-content:center;
align-content:center;
li{
margin: 5px;
width: 20%;
/deep/ .el-upload--picture-card{
width: 100%;
}
.title{
line-height: 1;
margin-top: -57px;
......@@ -346,7 +343,28 @@ export default {
.templateDowload{
line-height: 1;
margin-top: 7px;
}
}
}
/deep/ .avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
width: 100%;
height: 178px;
line-height: 178px;
}
/deep/ .avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
/deep/ .el-icon-upload {
font-size: 28px;
color: #8c939d;
width:100%;
text-align: center;
}
</style>
\ No newline at end of file
......
......@@ -5,10 +5,10 @@
<i class="iconfont iconhangzhengqudaohang"></i>
<span>行政区导航</span>
</li>
<li>
<!-- <li>
<i class="iconfont iconkongjianchaxun"></i>
<span>空间查询</span>
</li>
</li> -->
<li>
<i class="iconfont iconzuobiaodingwei"></i>
<span>定位</span>
......@@ -103,6 +103,7 @@ export default {
self.$parent.dialogVisible = true;
}else{
self.$message.success("暂无数据!!!");
self.$parent.closeResultDialog();
}
},true,'all',3,view.extent);
});
......
......@@ -43,9 +43,15 @@
<div class="contentItem">
<span>绘制范围：</span>
<div class="drawTypes">
<el-button type="text" @click="bufferParams.drawType = 'point'">点</el-button>
<el-button type="text" @click="bufferParams.drawType = 'circle'">圆</el-button>
<el-button type="text" @click="bufferParams.drawType = 'polygon'">任意多边形</el-button>
<span :class="bufferParams.drawType == 'rectangle'?'active':''">
<i class="iconfont iconhuizhifangshi1" @click="bufferParams.drawType = 'rectangle'"></i>
</span>
<span :class="bufferParams.drawType == 'circle'?'active':''">
<i class="iconfont iconhuizhifangshi2" @click="bufferParams.drawType = 'circle'"></i>
</span>
<span :class="bufferParams.drawType == 'polygon'?'active':''">
<i class="iconfont iconhuizhifangshi3" @click="bufferParams.drawType = 'polygon'"></i>
</span>
</div>
</div>
<div class="contentItem">
......@@ -154,6 +160,7 @@
import layerTree from '@/assets/json/layerTreeData.json'
import mapLayerManager from './js/mapLayerManager.js'
import importGeometry from './importGeometry'
import mapTools from "./js/mapTools";
export default{
props:{
viewId:{
......@@ -161,7 +168,7 @@
default:""
}
},
mixins:[mapLayerManager],
mixins:[draw,identifyUtils,mapLayerManager,mapTools],
components:{
importGeometry
},
......@@ -292,13 +299,15 @@
}
this.initDraw(this.bufferParams.drawType,this.viewId,null,function(geo){
self.createBuffer(geo,self.bufferParams.distance,self.viewId,function (bufGeo) {
self.identify(self.url,self.bufferParams.layerId,bufGeo,function(res){
self.identify(self.layerUrl,self.bufferParams.layerId,bufGeo,function(res){
var resultes = res.results;
if(resultes && resultes.length > 0){
self.$parent.delIdentifyData(resultes);
self.$parent.dialogVisible = true;
self.$parent.bottomResultDialog = true;
}else{
self.$message.success("暂无数据!!!");
//清除上次的结果 关闭上次的结果 清除地图数据
self.$parent.closeBufferDialog();
}
},true,'all',3,view.extent);
})
......@@ -330,14 +339,14 @@
type = 'djq';
dm = this.bufferParams.selectDjq;
}
this.queryDjqByDm(this.url+"/"+layer.id,type,dm,function (features) {
this.queryDjqByDm(this.layerUrl+"/"+layer.id,type,dm,function (features) {
if(features.length > 0){
self.createBuffer(features[0].geometry,self.bufferParams.distance,self.viewId,function (bufGeo) {
self.identify(self.url,self.bufferParams.layerId,bufGeo,function(res){
self.identify(self.layerUrl,self.bufferParams.layerId,bufGeo,function(res){
var resultes = res.results;
if(resultes && resultes.length > 0){
self.$parent.delIdentifyData(resultes);
self.$parent.dialogVisible = true;
self.$parent.bottomResultDialog = true;
}else{
self.$message.success("暂无数据!!!");
}
......@@ -365,11 +374,11 @@
}
}
self.createBuffer(this.importGeo,self.bufferParams.distance,self.viewId,function (bufGeo) {
self.identify(self.url,self.bufferParams.layerId,bufGeo,function(res){
self.identify(self.layerUrl,self.bufferParams.layerId,bufGeo,function(res){
var resultes = res.results;
if(resultes && resultes.length > 0){
self.$parent.delIdentifyData(resultes);
self.$parent.dialogVisible = true;
self.$parent.bottomResultDialog = true;
}else{
self.$message.success("暂无数据!!!");
}
......@@ -396,7 +405,7 @@
getDjqList(){
var self = this;
var djqLayer = this.getLayerByName("DJQ");
this.queryAttributes(this.url+"/"+djqLayer.id,"",function (features) {
this.queryAttributes(this.layerUrl+"/"+djqLayer.id,"",function (features) {
//self.djqAndDjzq.concat = features;
if(features != null){
for(var i = 0;i < features.length;i++){
......@@ -416,7 +425,7 @@
var self = this,
djzqLayer= this.getLayerByName("DJZQ");
self.djzqList = [];
this.queryAttributes(this.url+"/"+djzqLayer.id,{"DJZQDM":this.bufferParams.selectDjq},function (features) {
this.queryAttributes(this.layerUrl+"/"+djzqLayer.id,{"DJZQDM":this.bufferParams.selectDjq},function (features) {
if(features != null){
for(var i = 0;i < features.length;i++){
var obj = {
......@@ -503,8 +512,22 @@
}
.contentItem{
margin: 8px 5px;
line-height: 28px;
.drawTypes{
display: contents;
span{
margin: 0px 5px;
i{
color: #6D7278;
font-size: 20px;
}
}
.active>i{
color: #0091FF;
}
span :hover{
cursor:pointer
}
}
}
.buttonDiv{
......