[新增]新增单位坐标标注gis;[完善]完善采集工具bug

src/app/ui/basicinfo/basicinfo.component.html

@@ -104,10 +104,10 @@
                                     (focus)="closeorganizationbox()">
                                 </mat-form-field>
                             </div>     
-                            <div class="uploadimg" (click)="lookmaster()">
+                            <div class="uploadimg">
                                 <span>单位照片：</span>
-                                <div class="uploadingimg">
+                                <div class="uploadingimg"  (click)="lookmaster()">
-                                    <img [src]="imgsrc" alt="" style="width: 299px; height: 170px;" >
+                                    <img [src]="imgsrc ? imgsrc : noImg" alt="" style="width: 299px; height: 170px;" >
                                 </div>
                                 <mat-spinner *ngIf="isspinner"  diameter= 50></mat-spinner>
                             </div>           
@@ -118,9 +118,17 @@
                                 <button type="submit" color="primary"  class="submit1" mat-button mat-raised-button>保存</button>
                             </div>
                         </div>
-                        <!-- <div class="mainright" (click)="closeorganizationbox()"> -->
+                        <div class="mainright">
-                            <!-- 地图预留位置 -->
+                            <div style="width: 100%;height: 100%;" id="container">
-                        <!-- </div> -->
+
+                            </div>
+                            <div class="searchinput">
+                                <p>请输入单位名称:</p>
+                                <input id='tipinput' type="text" autocomplete="off">
+                                <p *ngIf="isMapLabel" style="color: red;">(已标注)</p>
+                                <p *ngIf="!isMapLabel" style="color: red;">(未标注)</p>
+                            </div>
+                        </div>
                     </div>
                 </form>
             </div>

src/app/ui/basicinfo/basicinfo.component.scss

@@ -1,14 +1,14 @@
 .topbox{
     height: 485px;
     width: 100%;
-    // border-bottom: 1px solid black;
+    padding-bottom: 20px;
     .mainbox{
         height: 100%;
         position: relative;
+        display: flex;
         .mainleft{
             width:800px;
             height: 100%;
-            // background-color: yellow;
             float: left;
             .inputbox{
                 width: 343px;
@@ -40,13 +40,8 @@
             }
             .addbtn{
                 width: 695px;
-                position: absolute;
+                margin:20px 0;
-                bottom: -495px;
+                padding-bottom: 20px;
-                text-align: center;
-                margin-bottom:20px;
-                button{
-                    margin: 0 4px;
-                }
             }
             .uploadimg{
                 width: 400px;
@@ -55,18 +50,13 @@
                 margin-top:12px;
                 position: relative;
                 margin-left: 80px;
-                cursor: pointer;
                 span{
                     float: left;
                 }
-                // img{
-                //     float: left;
-                // }
                 .uploadingimg{
                     width: 299px;
                     height: 170px;
-                    // background: url('../../../assets/images/upload2.png') no-repeat center center;
+                    cursor: pointer;
-     
                     position: absolute;
                     top: 0px;
                     left: 79px;
@@ -76,29 +66,28 @@
                
             }
             .image{
-                // position: absolute;
-                // top: 199px;
-                // left: 160px;
-                // width: 299px;
-                // height: 170px;
                 input{
-                    // width: 299px;
-                    // height: 170px;
                     width: 190px;
                     margin-top: 160px;
                     cursor: pointer;
                 }
-                // opacity:0;
-                
             }
         }
         .mainright{
             float: left;
-            width: 600px;
+            flex: 1;
-            height: 400px;
+            height: 430px;
-            // position: absolute;
+            margin-right: 100px; 
-            // right: 170px;
+            position: relative;
-            
+            .searchinput{
+                display: flex;
+                position: absolute;
+                left: 0;
+                top: 0;
+                p{
+                    
+                }
+            }    
         }
     }
 }

src/app/ui/basicinfo/basicinfo.component.ts

@@ -19,7 +19,7 @@ import { isNgTemplate } from '@angular/compiler';
 import * as _ from 'lodash';
 import Swiper from 'swiper';
 import { LookMaster } from './lookmaster.component'
-
+declare var AMap: any;
 
 @Component({
   selector: 'app-basicinfo',
@@ -86,13 +86,72 @@ export class BasicinfoComponent implements OnInit {
   allorganizing:any = [] //所有组织机构
   constructor(private http: HttpClient, private tree: TreeService, private sanitizer: DomSanitizer, public dialog: MatDialog,public snackBar: MatSnackBar) { }
 
+  isMapLabel:boolean
   ngOnInit(): void {
     this.getallunittype()
     this.getorganization()
     // this.getunitinfo()
     this.getunitallbuilding()
+   
+
+  }
+
+  //地图标注位置
+  marker:any//单位点标记
+  markerPosition:any = {x: 0, y: 0}//单位坐标
+  labelGis(){
+    var map = new AMap.Map('container', {
+      zoom:12
+    })
+    if(this.isMapLabel){
+      this.marker = new AMap.Marker({
+        position: [this.unitinfo.location.x,this.unitinfo.location.y],   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
+        draggable: true
+      });
+      map.add(this.marker);
+      map.setFitView();
+      this.marker.on('dragging', (e)=>{
+        this.markerPosition = {x: e.lnglat.lng, y: e.lnglat.lat}
+      })
+    }
+    
+    //输入提示
+    var autoOptions = {
+      input: "tipinput"
+    };
+    AMap.plugin(['AMap.PlaceSearch','AMap.AutoComplete'], () =>{
+      var auto = new AMap.AutoComplete(autoOptions);
+      var placeSearch = new AMap.PlaceSearch({
+          // map: map
+          // pageSize: 5, // 单页显示结果条数
+          //   pageIndex: 1 // 页码
+      });  //构造地点查询类
+      auto.on("select", (e)=>{
+        placeSearch.search(e.poi.name,  (status, result) => {
+          if(this.marker){
+            map.remove(this.marker);
+          }
+          this.isMapLabel = true
+          // 查询成功时，result即对应匹配的POI信息
+          var poi = result.poiList.pois[0];
+          this.markerPosition = {x: poi.location.lng, y: poi.location.lat}
+          this.marker = new AMap.Marker({
+            position: poi.location,   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
+            title: poi.name,
+            draggable: true
+          });
+          map.add(this.marker);
+          map.setFitView();
+          this.marker.on('dragend', (e)=>{
+            this.markerPosition = {x: e.lnglat.lng, y: e.lnglat.lat}
+          })
+        });
+      });//注册监听，当选中某条记录时会触发
 
+    });
+    
   }
+
   //获得所有单位类型
   getallunittype() {
     this.http.get("/api/BuildingTypes/Simple").subscribe(data => {
@@ -105,57 +164,73 @@ export class BasicinfoComponent implements OnInit {
       (data: any) => {
         this.allorganizing = data;
         this.dataSource.data = this.tree.toTree(data);
-        this.getunitinfo();
+        let _this = this
+        this.getunitinfo().then((e)=>{
+          if(this.unitinfo.location && (this.unitinfo.location.x != 0 && this.unitinfo.location.y != 0) ){//已标注
+            _this.isMapLabel = true
+            _this.markerPosition = _this.unitinfo.location
+          }else{//未标注
+            _this.isMapLabel = false
+          }
+          this.labelGis()
+        })
       }
     )
   }
   //获得当前单位的基本信息
-  getunitinfo(){
+  async getunitinfo(){
-    this.http.get("/api/CompanyAccount/Company").subscribe((data:any)=>{
+    let result = await new Promise((resolve, reject) => {
-      if(data.buildingTypes.length){
+      this.http.get("/api/CompanyAccount/Company").subscribe((data:any)=>{
-        sessionStorage.setItem('buildingTypeId',data.buildingTypes[0].id)
+        if(data.buildingTypes.length){
-      }else{
+          sessionStorage.setItem('buildingTypeId',data.buildingTypes[0].id)
-        sessionStorage.setItem('buildingTypeId',"")
-      }
-      let node
-      this.allorganizing.forEach(item => {
-        if(item.id == data.organizationId){
-          node = item
-        }
-      });
-      if(node){
-        if(!node.parentId){
-          this.selectedorganization = node.name
         }else{
-          let namearr = [node.name]
+          sessionStorage.setItem('buildingTypeId',"")
-          let targetId = node.parentId; // 临时变量
+        }
-          for(let i = 0; i < node.level ; i++){
+        let node
-            this.allorganizing.forEach(item => {
+        this.allorganizing.forEach(item => {
-              if(item.id == targetId ){
+          if(item.id == data.organizationId){
-                namearr.push(item.name) 
+            node = item
-                targetId = item.parentId; // 临时变量更新没有副作用
+          }
-              }
+        });
-            });
+        if(node){
+          if(!node.parentId){
+            this.selectedorganization = node.name
+          }else{
+            let namearr = [node.name]
+            let targetId = node.parentId; // 临时变量
+            for(let i = 0; i < node.level ; i++){
+              this.allorganizing.forEach(item => {
+                if(item.id == targetId ){
+                  namearr.push(item.name) 
+                  targetId = item.parentId; // 临时变量更新没有副作用
+                }
+              });
+            }
+            namearr.reverse()
+            let str = ''
+            namearr.forEach(item=>{
+              str += '/' + item
+            })
+            this.selectedorganization = str.substr(1)
           }
-          namearr.reverse()
-          let str = ''
-          namearr.forEach(item=>{
-            str += '/' + item
-          })
-          this.selectedorganization = str.substr(1)
         }
-      }
+        
-      
+       
-      this.unitinfo = data
+        this.unitinfo = data
-      this.selectedorganizationid = data.organizationId
+        
-      if(data.imageUrl){
+        resolve(this.unitinfo)
-        this.imgsrc = data.imageUrl
+        console.log(456789,this.unitinfo)
-      }
+        this.selectedorganizationid = data.organizationId
-      if(data.buildingTypes[0]){
+        if(data.imageUrl){
-        this.defaultbuildingTypes = data.buildingTypes[0].id
+          this.imgsrc = data.imageUrl
-        this.buildingTypesname = data.buildingTypes[0].name
+        }
-      }
+        if(data.buildingTypes[0]){
-    }) 
+          this.defaultbuildingTypes = data.buildingTypes[0].id
+          this.buildingTypesname = data.buildingTypes[0].name
+        }
+      }) 
+    })
+    
   }
   //获得建筑自定义信息
   getbuildingCustomData(){
@@ -848,7 +923,8 @@ export class BasicinfoComponent implements OnInit {
 
   hasChild = (_: number, node: any) => node.expandable;
   
-  imgsrc = "../../../assets/images/upload.jpg" //没有上传图片时显示的图片，当上传后就会被替换，即保存时需要传的图片地址参数
+  imgsrc = "" //没有上传图片时显示的图片，当上传后就会被替换，即保存时需要传的图片地址参数
+  noImg = '../../../assets/images/upload.jpg'
   imgUrl = ""//返回来的图片地址后缀
   file: any; //上传的文件
   objectName: any; //上传对象名
@@ -1027,10 +1103,7 @@ export class BasicinfoComponent implements OnInit {
         phone: value.linkphone,
         address: value.unitaddress,
         imageUrl: this.imgsrc,
-        location: {
+        location: this.markerPosition,
-          x: 0,
-          y: 0
-        },
         modifiedTime: time,
         organizationId: this.selectedorganizationid,
         organizationName: null,

src/app/ui/collection-tools/collection-tools.component.html

@@ -234,7 +234,7 @@
                 <div style="position: relative;width: 100%;height: 21px;margin: 1px 0;">
                   <p style="width: 40%;display: inline-block;">{{item.PropertyName}}</p>
                   <span style="width: 26%;text-align:right;font-size: 13px;">{{imagesArr.length ? imagesArr.length : 0}} / {{item.PropertyValue}}</span>
-                  <input  [disabled]="!isEditPattern" *ngIf="isImgNumCss" accept="image/*" (change)="selectFile($event)" type="file" style="width: 33%;position: absolute;right: 10px;top: 1px;opacity: 0;z-index: 100;cursor: pointer;height: 21px;">
+                  <input id="inputimg" [disabled]="!isEditPattern" *ngIf="isImgNumCss" accept="image/*" (change)="selectFile($event)" type="file" style="width: 33%;position: absolute;right: 10px;top: 1px;opacity: 0;z-index: 100;cursor: pointer;height: 21px;">
                   <div style="width: 33%;height: 21px;line-height: 21px;text-align: center;position: absolute;right: 10px;top: 1px;z-index: 99;border: 1px solid rgb(208, 211, 214);border-radius: 2px;font-size: 13px;cursor: pointer;" (click)="imgNumBeyond()">添加</div>
                   
                   

src/app/ui/collection-tools/collection-tools.component.ts

@@ -382,8 +382,15 @@ export class CollectionToolsComponent implements OnInit {
         this.mySwiper.update();
         this.gallery.update()
       }, 0);
-
+      this.canvasData.isChange = true;
-      this.canvasData.isChange = true
+      
+      //将上传的input框显示出来
+      this.isImgNumCss = true;
+      //清除图片缓存
+      if((<HTMLInputElement>document.getElementById('inputimg'))){
+        (<HTMLInputElement>document.getElementById('inputimg')).value = null //清空input框缓存
+      }
+      
     }
   }
 
@@ -918,9 +925,23 @@ export class CollectionToolsComponent implements OnInit {
       })
      }
 
-
+    const nodes = this.treeControl.dataNodes;
+    const expandNodes = [];
+    nodes.forEach((item) => {
+      if(item.expandable && this.treeControl.isExpanded(item)){
+        expandNodes.push(item.id);
+      }
+    });
+    
     this.dataSource.data = [...this.dataSource.data]
-    this.treeControl.expandAll()
+    
+    let newNodes = this.treeControl.dataNodes;
+    newNodes = newNodes.filter(n => {
+      return expandNodes.indexOf(n.id) >= 0;
+    });
+    newNodes.forEach(item => {
+      this.treeControl.expand(item);
+    });
 
     //canvas上的素材显隐
     let iconVisibleArr:any = []

src/index.html

@@ -11,4 +11,6 @@
 <body>
   <app-root></app-root>
 </body>
+<script src='https://webapi.amap.com/maps?v=2.0&key=e4b359dc7b03f9418b7497f807131346'></script>
+<!-- <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script> -->
 </html>