From c32ea806b06a74edb0b8caa409e5d9b5f5b9fdef Mon Sep 17 00:00:00 2001 From: SHAOJIAHAO <55341701@qq.com> Date: Fri, 28 May 2021 10:44:40 +0800 Subject: [PATCH] =?UTF-8?q?[=E5=AE=8C=E5=96=84]gis=E6=89=93=E5=BC=80?= =?UTF-8?q?=E5=B9=B3=E9=9D=A2=E5=9B=BE=E5=AE=BD=E9=AB=98=E8=87=AA=E9=80=82?= =?UTF-8?q?=E5=BA=94=EF=BC=8C=E6=80=BB=E5=B9=B3=E9=9D=A2=E5=9B=BE=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=E5=AE=8C=E5=96=84=EF=BC=8Cgis=E5=B9=B3=E9=9D=A2?= =?UTF-8?q?=E5=9B=BE=E6=B7=BB=E5=8A=A0=E6=A0=87=E7=82=B9=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../allaround/allaround.component.html | 4 +- .../allaround/allaround.component.ts | 2 +- .../plan-list/openPlanTool.scss | 30 +-- .../plan-list/plan-list.component.ts | 7 +- src/app/pipes/boolean.pipe.ts | 47 +++-- .../wait-examineer.component.html | 89 ++++++-- .../wait-examineer.component.scss | 14 ++ .../wait-examineer.component.ts | 80 ++++--- .../plan-management/plan-management.module.ts | 103 +++++---- .../collection-tools.component.html | 67 +++++- .../collection-tools.component.scss | 3 +- .../collection-tools.component.ts | 199 ++++++++++++++---- src/main.ts | 1 + src/styles.scss | 34 +++ 14 files changed, 499 insertions(+), 181 deletions(-) diff --git a/src/app/gis-management/allaround/allaround.component.html b/src/app/gis-management/allaround/allaround.component.html index 7bf8a27..6220b74 100644 --- a/src/app/gis-management/allaround/allaround.component.html +++ b/src/app/gis-management/allaround/allaround.component.html @@ -46,7 +46,7 @@ -
+
\ No newline at end of file diff --git a/src/app/gis-management/allaround/allaround.component.ts b/src/app/gis-management/allaround/allaround.component.ts index 4f1d3e7..063ea21 100644 --- a/src/app/gis-management/allaround/allaround.component.ts +++ b/src/app/gis-management/allaround/allaround.component.ts @@ -26,7 +26,7 @@ export class AllaroundComponent implements OnInit { ngOnInit(): void { this.getAllCompany() - this.getAllBuilding() + // this.getAllBuilding() } AllAdjoining:any = []; //所有单位毗邻 diff --git a/src/app/gis-management/plan-list/openPlanTool.scss b/src/app/gis-management/plan-list/openPlanTool.scss index 9f1cb81..2952dfd 100644 --- a/src/app/gis-management/plan-list/openPlanTool.scss +++ b/src/app/gis-management/plan-list/openPlanTool.scss @@ -1,16 +1,16 @@ -.divbox{ - width: 1500px; - height:850px +.divbox { + width: 100%; + height: 100%; } -@media screen and (max-width:1400px){ - .divbox{ - width: 950px; - height: 618px; - } -} -@media screen and (min-width:1400px) and (max-width:1600px){ - .divbox{ - width: 1100px; - height: 660px; - } -} \ No newline at end of file +// @media screen and (max-width:1400px){ +// .divbox{ +// width: 100%; +// height: 618px; +// } +// } +// @media screen and (min-width:1400px) and (max-width:1600px){ +// .divbox{ +// width: 100%; +// height: 660px; +// } +// } diff --git a/src/app/gis-management/plan-list/plan-list.component.ts b/src/app/gis-management/plan-list/plan-list.component.ts index 196a60d..727bc37 100644 --- a/src/app/gis-management/plan-list/plan-list.component.ts +++ b/src/app/gis-management/plan-list/plan-list.component.ts @@ -50,9 +50,14 @@ export class PlanListComponent implements OnInit { sessionStorage.setItem("gisplan",'look') sessionStorage.setItem("companyId",this.unitId) let data = {select: item, key: index, allBuildings: this.allBuildings} + let width = Math.round(document.body.clientWidth * 0.8) + 'px' + let height = Math.round(document.body.clientHeight * 0.9) + 'px' + // console.log('宽度',width) let dialogRef = this.dialog.open(OpenPlanToolDialog,{//调用open方法打开对话框并且携带参数过去 id:'openPlanToolDialog', - data + data, + width:width, + height:height }); dialogRef.afterClosed().subscribe( (data)=>{ } ); } diff --git a/src/app/pipes/boolean.pipe.ts b/src/app/pipes/boolean.pipe.ts index 0b10a0e..3df03f5 100644 --- a/src/app/pipes/boolean.pipe.ts +++ b/src/app/pipes/boolean.pipe.ts @@ -1,62 +1,63 @@ import { Pipe, PipeTransform } from '@angular/core'; -import { isno , PlanTypeEnum , AuditStatusEnum , PlanLevelEnum} from '../interface' -@Pipe({name: 'isno'}) +import { isno, PlanTypeEnum, AuditStatusEnum, PlanLevelEnum } from '../interface' +@Pipe({ name: 'isno' }) export class IsnoPipe implements PipeTransform { transform(value: boolean): string { - if(value){ - var x = 0 - }else{ - x=1 + if (value) { + var x = 0 + } else { + x = 1 } return isno[x] } } -@Pipe({name: 'plantype'}) +@Pipe({ name: 'plantype' }) export class PlanType implements PipeTransform { transform(value: number): string { return PlanTypeEnum[value] } } -@Pipe({name: 'auditsatus'}) +@Pipe({ name: 'auditsatus' }) export class AuditSatus implements PipeTransform { transform(value: number): string { return AuditStatusEnum[value] } } -@Pipe({name: 'planlevel'}) -export class PlanLevel implements PipeTransform { +@Pipe({ name: 'planlevel' }) +export class PlanLevel implements PipeTransform { transform(value: number): string { return PlanLevelEnum[value] } } -@Pipe({name: 'state'}) -export class state implements PipeTransform { +@Pipe({ name: 'state' }) +export class state implements PipeTransform { transform(value: number): string { - if(value == 3){ + if (value == 3) { return '维护中' - }else if(value == 4){ + } else if (value == 4) { return '维护通过审核' - }else if(value == 5){ + } else if (value == 5) { return '维护驳回审核' - }else{ + } else { return '未维护' } } } -@Pipe({name: 'differentContentTitle'}) -export class differentContentTitle implements PipeTransform { +@Pipe({ name: 'differentContentTitle' }) +export class differentContentTitle implements PipeTransform { transform(value: string): string { - console.log(666,typeof(value)) - if(typeof(value) == 'boolean' && value){ + if (typeof (value) == 'boolean' && value) { return '是' - }else if(typeof(value) == 'boolean' && !value){ + } else if (typeof (value) == 'boolean' && !value) { return '否' - }else{ + } else if (!value) { + return '空' + } else { return value } - + } } diff --git a/src/app/plan-audit/wait-examineer/wait-examineer.component.html b/src/app/plan-audit/wait-examineer/wait-examineer.component.html index a331ee7..f18dbe5 100644 --- a/src/app/plan-audit/wait-examineer/wait-examineer.component.html +++ b/src/app/plan-audit/wait-examineer/wait-examineer.component.html @@ -97,11 +97,11 @@ - + + @@ -109,7 +109,7 @@
- + @@ -118,7 +118,7 @@
- + border_color @@ -131,9 +131,9 @@ - + 变更为 - + @@ -151,7 +151,7 @@
- + @@ -160,11 +160,15 @@
- + border_color - {{item.propertyName}} + {{item.propertyName}} + -修改 + 新增 + 删除 + @@ -183,7 +187,7 @@ - + @@ -191,8 +195,8 @@
- - + + border_color @@ -215,6 +219,59 @@
+ + + + 实景图 + + +
+ + + + + border_color + + 修改 + 新增 + 删除 + 文件夹 + {{- item.propertyName}} + + + + +
+ + + + +
新增图片 + +
+ + + + + + + + + + +
新增图片修改图片名称删除图片 + + + + {{i.childrens[0].oldValue}} + 变更为 + {{i.childrens[0].newValue}} +
+
+
+
+
@@ -321,4 +378,8 @@
+
+ +
+
\ No newline at end of file diff --git a/src/app/plan-audit/wait-examineer/wait-examineer.component.scss b/src/app/plan-audit/wait-examineer/wait-examineer.component.scss index 6221e8a..1469a93 100644 --- a/src/app/plan-audit/wait-examineer/wait-examineer.component.scss +++ b/src/app/plan-audit/wait-examineer/wait-examineer.component.scss @@ -2,6 +2,9 @@ height: 100%; width: 100%; display: flex; + img{ + cursor: pointer; + } .boxleft { height: 100%; width: 45%; @@ -287,6 +290,17 @@ td { } } } + .addFiles{ + tr{ + td{ + img{ + width: 150px; + height: 105px; + margin-right: 6px; + } + } + } + } .onebuilding { display: flex; margin: 5px 0; diff --git a/src/app/plan-audit/wait-examineer/wait-examineer.component.ts b/src/app/plan-audit/wait-examineer/wait-examineer.component.ts index a7d1217..909571e 100644 --- a/src/app/plan-audit/wait-examineer/wait-examineer.component.ts +++ b/src/app/plan-audit/wait-examineer/wait-examineer.component.ts @@ -13,9 +13,12 @@ import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dial import { HttpClient } from '@angular/common/http' declare var CryptoJS import { DomSanitizer } from '@angular/platform-browser'; -import { Viewer } from 'photo-sphere-viewer'; +import { Viewer as photoViewer } from 'photo-sphere-viewer'; +import Viewer from 'viewerjs'; declare var echarts: any; + + @Component({ selector: 'app-wait-examineer', templateUrl: './wait-examineer.component.html', @@ -130,7 +133,25 @@ export class WaitExamineerComponent implements OnInit { this.getAlltabledate() } - + lookImg(imgUrl){ + console.log(imgUrl) + let dom = document.getElementById(`viewerjs`) + let pObjs = dom.childNodes; + let node = document.createElement("img") + node.style.display = "none"; + node.src = "/api/Objects/PlanPlatform/" + imgUrl; + node.id = 'imgxxx' + dom.appendChild(node) + setTimeout(() => { + let viewer = new Viewer(document.getElementById(`viewerjs`), { + hidden:()=>{ + dom.removeChild(pObjs[0]); + viewer.destroy(); + } + }); + node.click(); + }, 0); + } //radio点击事件 viewer//全景图对象 waterData: any//需要传递给子组件的水源信息 @@ -146,32 +167,37 @@ export class WaitExamineerComponent implements OnInit { differentContentOfPicture: any//当前单位变更数据 之 实景图 radioClick(e, item) { this.selectedItem = item - // console.log('当前选择的单位',this.selectedItem) - // console.log('当前选择的信息',JSON.parse(this.selectedItem.differentContent) ) - let differentContent = JSON.parse(this.selectedItem.differentContent) - // 单位信息 - this.differentContentOfUnitInfo = differentContent.filter(item => item.propertyName == 'basicInfo') - - // 实景图 - this.differentContentOfPicture = differentContent.filter(item => item.propertyName == 'realityImageGroups') - //建筑信息 - this.differentContentOfBuildingsInfo = JSON.parse(JSON.stringify(differentContent.filter(item => item.propertyName == 'buildings')[0])) - this.differentContentOfBuildingsInfo.childrens.forEach(element => { - element.childrens = element.childrens.filter(item => item.isObj == false) - }); - //功能分区 - let differentContentOfFunction = JSON.parse(JSON.stringify(differentContent.filter(item => item.propertyName == 'buildings')[0])) - this.differentContentOfFunction = [] - differentContentOfFunction.childrens.forEach(item => { - item.childrens.forEach(i => { - if (i.propertyName == "buildingFunctionalDivisions") { - i.propertyName = item.propertyName - this.differentContentOfFunction.push(i) - } + // console.log('当前选择的信息',JSON.parse(this.selectedItem.differentContent) ) + if(item.contentType == 11){ + let differentContent = JSON.parse(this.selectedItem.differentContent) + // 单位信息 + this.differentContentOfUnitInfo = differentContent.filter(item => item.propertyName == 'basicInfo') + // 实景图 + this.differentContentOfPicture = differentContent.filter(item => item.propertyName == 'realityImageGroups') + + //建筑信息 + this.differentContentOfBuildingsInfo = JSON.parse(JSON.stringify(differentContent.filter(item => item.propertyName == 'buildings')[0])) + this.differentContentOfBuildingsInfo.childrens.forEach(element => { + element.childrens = element.childrens.filter(item => item.isObj == false) + }); + console.log('当前选择的单位的实景图',this.differentContentOfBuildingsInfo) + //功能分区 + let differentContentOfFunction = JSON.parse(JSON.stringify(differentContent.filter(item => item.propertyName == 'buildings')[0])) + this.differentContentOfFunction = [] + differentContentOfFunction.childrens.forEach(item => { + item.childrens.forEach(i => { + if (i.propertyName == "buildingFunctionalDivisions") { + i.propertyName = item.propertyName + this.differentContentOfFunction.push(i) + } + }); }); - }); - console.log('功能分区', this.differentContentOfFunction) + + } + + + // console.log('功能分区', this.differentContentOfFunction) @@ -236,7 +262,7 @@ export class WaitExamineerComponent implements OnInit { obj.innerHTML = '' } window.setTimeout(() => { - this.viewer = new Viewer({ + this.viewer = new photoViewer({ container: document.querySelector('#viewer'), panorama: '/api/Objects/PlanPlatform/' + this.fetchUrl, diff --git a/src/app/plan-management/plan-management.module.ts b/src/app/plan-management/plan-management.module.ts index 0abed77..9022c43 100644 --- a/src/app/plan-management/plan-management.module.ts +++ b/src/app/plan-management/plan-management.module.ts @@ -2,76 +2,75 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { PlanManagementRoutingModule } from './plan-management-routing.module'; import { ReactiveFormsModule, FormsModule } from '@angular/forms'; -import {A11yModule} from '@angular/cdk/a11y'; -import {DragDropModule} from '@angular/cdk/drag-drop'; -import {PortalModule} from '@angular/cdk/portal'; -import {ScrollingModule} from '@angular/cdk/scrolling'; -import {CdkStepperModule} from '@angular/cdk/stepper'; -import {CdkTableModule} from '@angular/cdk/table'; -import {CdkTreeModule} from '@angular/cdk/tree'; -import {MatAutocompleteModule} from '@angular/material/autocomplete'; -import {MatBadgeModule} from '@angular/material/badge'; -import {MatBottomSheetModule} from '@angular/material/bottom-sheet'; -import {MatButtonModule} from '@angular/material/button'; -import {MatButtonToggleModule} from '@angular/material/button-toggle'; -import {MatCardModule} from '@angular/material/card'; -import {MatCheckboxModule} from '@angular/material/checkbox'; -import {MatChipsModule} from '@angular/material/chips'; -import {MatStepperModule} from '@angular/material/stepper'; -import {MatDatepickerModule} from '@angular/material/datepicker'; -import {MatDialogModule} from '@angular/material/dialog'; -import {MatDividerModule} from '@angular/material/divider'; -import {MatExpansionModule} from '@angular/material/expansion'; -import {MatGridListModule} from '@angular/material/grid-list'; -import {MatIconModule} from '@angular/material/icon'; -import {MatInputModule} from '@angular/material/input'; -import {MatListModule} from '@angular/material/list'; -import {MatMenuModule} from '@angular/material/menu'; -import {MatNativeDateModule, MatRippleModule} from '@angular/material/core'; -import {MatPaginatorModule} from '@angular/material/paginator'; -import {MatProgressBarModule} from '@angular/material/progress-bar'; -import {MatProgressSpinnerModule} from '@angular/material/progress-spinner'; -import {MatRadioModule} from '@angular/material/radio'; -import {MatSelectModule} from '@angular/material/select'; -import {MatSidenavModule} from '@angular/material/sidenav'; -import {MatSliderModule} from '@angular/material/slider'; -import {MatSlideToggleModule} from '@angular/material/slide-toggle'; -import {MatSnackBarModule} from '@angular/material/snack-bar'; -import {MatSortModule} from '@angular/material/sort'; -import {MatTableModule} from '@angular/material/table'; -import {MatTabsModule} from '@angular/material/tabs'; -import {MatToolbarModule} from '@angular/material/toolbar'; -import {MatTooltipModule} from '@angular/material/tooltip'; -import {MatTreeModule} from '@angular/material/tree'; +import { A11yModule } from '@angular/cdk/a11y'; +import { DragDropModule } from '@angular/cdk/drag-drop'; +import { PortalModule } from '@angular/cdk/portal'; +import { ScrollingModule } from '@angular/cdk/scrolling'; +import { CdkStepperModule } from '@angular/cdk/stepper'; +import { CdkTableModule } from '@angular/cdk/table'; +import { CdkTreeModule } from '@angular/cdk/tree'; +import { MatAutocompleteModule } from '@angular/material/autocomplete'; +import { MatBadgeModule } from '@angular/material/badge'; +import { MatBottomSheetModule } from '@angular/material/bottom-sheet'; +import { MatButtonModule } from '@angular/material/button'; +import { MatButtonToggleModule } from '@angular/material/button-toggle'; +import { MatCardModule } from '@angular/material/card'; +import { MatCheckboxModule } from '@angular/material/checkbox'; +import { MatChipsModule } from '@angular/material/chips'; +import { MatStepperModule } from '@angular/material/stepper'; +import { MatDatepickerModule } from '@angular/material/datepicker'; +import { MatDialogModule } from '@angular/material/dialog'; +import { MatDividerModule } from '@angular/material/divider'; +import { MatExpansionModule } from '@angular/material/expansion'; +import { MatGridListModule } from '@angular/material/grid-list'; +import { MatIconModule } from '@angular/material/icon'; +import { MatInputModule } from '@angular/material/input'; +import { MatListModule } from '@angular/material/list'; +import { MatMenuModule } from '@angular/material/menu'; +import { MatNativeDateModule, MatRippleModule } from '@angular/material/core'; +import { MatPaginatorModule } from '@angular/material/paginator'; +import { MatProgressBarModule } from '@angular/material/progress-bar'; +import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; +import { MatRadioModule } from '@angular/material/radio'; +import { MatSelectModule } from '@angular/material/select'; +import { MatSidenavModule } from '@angular/material/sidenav'; +import { MatSliderModule } from '@angular/material/slider'; +import { MatSlideToggleModule } from '@angular/material/slide-toggle'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; +import { MatSortModule } from '@angular/material/sort'; +import { MatTableModule } from '@angular/material/table'; +import { MatTabsModule } from '@angular/material/tabs'; +import { MatToolbarModule } from '@angular/material/toolbar'; +import { MatTooltipModule } from '@angular/material/tooltip'; +import { MatTreeModule } from '@angular/material/tree'; import { EntryPlanComponent } from './entry-plan/entry-plan.component'; import { PassPlanComponent, UnitInfo } from './pass-plan/pass-plan.component'; import { OpenPlanComponent } from './open-plan/open-plan.component'; -import { EntryPlanLookComponent, AddPlanone, DownloadFile, AuditResult, ChangeName } from './entry-plan-look/entry-plan-look.component'; +import { EntryPlanLookComponent, AddPlanone, DownloadFile, AuditResult, ChangeName, ImgDetails } from './entry-plan-look/entry-plan-look.component'; import { PlanType, AuditSatus, PlanLevel, state } from '../pipes/boolean.pipe'; import { WebLookComponent } from './web-look/web-look.component'; import { OnetwoEntryPlanComponent } from './onetwo-entry-plan/onetwo-entry-plan.component'; -import { newunitComponent} from './onetwo-entry-plan/onetwo-entry-plan.component'; +import { newunitComponent } from './onetwo-entry-plan/onetwo-entry-plan.component'; import { MeetPlanComponent } from './meet-plan/meet-plan.component'; -import { newunitMeet }from './meet-plan/meet-plan.component'; +import { newunitMeet } from './meet-plan/meet-plan.component'; import { TypePlanComponent } from './type-plan/type-plan.component'; -import { newunitType }from './type-plan/type-plan.component'; +import { newunitType } from './type-plan/type-plan.component'; import { PsViewer } from './entry-plan-look/entry-plan-look.component' import { onetwoAuditResult } from './onetwo-entry-plan/onetwo-entry-plan.component'; -import { meetAuditResult }from './meet-plan/meet-plan.component'; +import { meetAuditResult } from './meet-plan/meet-plan.component'; import { typeAuditResult } from './type-plan/type-plan.component'; import { MaintainUpComponent } from './maintain-up/maintain-up.component' import { GkPsViewer } from './pass-plan/pass-plan.component' -import { GkhtmlPsViewer }from './open-plan/open-plan.component'; +import { GkhtmlPsViewer } from './open-plan/open-plan.component'; import { ReinforcePlanComponent } from './reinforce-plan/reinforce-plan.component' -import { ImgDetails } from './entry-plan-look/entry-plan-look.component' @NgModule({ - declarations: [EntryPlanComponent, PassPlanComponent, OpenPlanComponent, EntryPlanLookComponent,AddPlanone,PlanType,AuditSatus,PlanLevel,DownloadFile,AuditResult,ChangeName, - WebLookComponent, OnetwoEntryPlanComponent,newunitComponent, MeetPlanComponent,newunitMeet, TypePlanComponent,newunitType,PsViewer,onetwoAuditResult,meetAuditResult, - typeAuditResult, MaintainUpComponent,GkPsViewer,GkhtmlPsViewer,UnitInfo, ReinforcePlanComponent, state,ImgDetails], + declarations: [EntryPlanComponent, PassPlanComponent, OpenPlanComponent, EntryPlanLookComponent, AddPlanone, PlanType, AuditSatus, PlanLevel, DownloadFile, AuditResult, ChangeName, + WebLookComponent, OnetwoEntryPlanComponent, newunitComponent, MeetPlanComponent, newunitMeet, TypePlanComponent, newunitType, PsViewer, onetwoAuditResult, meetAuditResult, + typeAuditResult, MaintainUpComponent, GkPsViewer, GkhtmlPsViewer, UnitInfo, ReinforcePlanComponent, state, ImgDetails], imports: [ CommonModule, PlanManagementRoutingModule, @@ -120,6 +119,6 @@ import { ImgDetails } from './entry-plan-look/entry-plan-look.component' MatTooltipModule, MatTreeModule ], - exports:[PlanType, AuditSatus, PlanLevel, state] + exports: [PlanType, AuditSatus, PlanLevel, state] }) export class PlanManagementModule { } diff --git a/src/app/ui/collection-tools-plan/collection-tools.component.html b/src/app/ui/collection-tools-plan/collection-tools.component.html index 86dda45..01a15f7 100644 --- a/src/app/ui/collection-tools-plan/collection-tools.component.html +++ b/src/app/ui/collection-tools-plan/collection-tools.component.html @@ -7,7 +7,10 @@ - + + 基本信息名称 + visibility + 多选 @@ -52,7 +55,7 @@ -
+
- + photo_size_select_actual @@ -167,7 +170,7 @@ (mousedown)="rightDivMouseDown($event)">
+ style="height: 50%;background-color: white;">
属性
+ +
+ +
+ + +
消防要素
+
+
+ + visibility +
+ + + + + + + {{node.name}} + + ({{node.children.length}}) + + visibility + + + + + + + + {{node.name}} + + ({{node.children.length}}) + + visibility + + + + +
+
diff --git a/src/app/ui/collection-tools-plan/collection-tools.component.scss b/src/app/ui/collection-tools-plan/collection-tools.component.scss index b927e44..23c8479 100644 --- a/src/app/ui/collection-tools-plan/collection-tools.component.scss +++ b/src/app/ui/collection-tools-plan/collection-tools.component.scss @@ -454,4 +454,5 @@ div:focus { border-radius: 0px; } } -} \ No newline at end of file +} + diff --git a/src/app/ui/collection-tools-plan/collection-tools.component.ts b/src/app/ui/collection-tools-plan/collection-tools.component.ts index d1531e2..f3eb3d3 100644 --- a/src/app/ui/collection-tools-plan/collection-tools.component.ts +++ b/src/app/ui/collection-tools-plan/collection-tools.component.ts @@ -17,8 +17,14 @@ import { TabbarAndScoreService } from 'src/app/http-interceptors/tabbar-and-scor import { MaskLayerService } from 'src/app/mask-layer.service'; import * as ObjectID from 'bson-objectid'; import { AxMessageSystem } from 'src/app/working-area/model/axMessageSystem'; +declare var AMap: any + +declare global { + interface Window { + deleteMarker: any; + } +} -declare var AMap:any @Component({ selector: 'app-collection-tools-plan', templateUrl: './collection-tools.component.html', @@ -28,7 +34,7 @@ export class CollectionToolsPlanComponent implements OnInit { @ViewChild('canvas') canvas: WorkingAreaComponent; //父组件中获得子组件的引用 - constructor(public _ngZone: NgZone, private maskLayerService: MaskLayerService, private tabbarService: TabbarAndScoreService, private http: HttpClient, public dialog: MatDialog, public snackBar: MatSnackBar, private element: ElementRef, public canvasData: CanvasShareDataService, private router: Router, private route: ActivatedRoute) { } + constructor(public renderer2: Renderer2, public _ngZone: NgZone, private maskLayerService: MaskLayerService, private tabbarService: TabbarAndScoreService, private http: HttpClient, public dialog: MatDialog, public snackBar: MatSnackBar, private element: ElementRef, public canvasData: CanvasShareDataService, private router: Router, private route: ActivatedRoute) { } @ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent; // tree配置 private _transformer = (node, level: number) => {//要给渲染节点传那些属性参数 @@ -80,6 +86,7 @@ export class CollectionToolsPlanComponent implements OnInit { gallery//viewerJs实例 //设置属性框 setAssetsProperty(obj) { + console.log(obj) //初始化viewerJs实例 setTimeout(() => { obj.PropertyInfos.forEach(item => { @@ -465,11 +472,12 @@ export class CollectionToolsPlanComponent implements OnInit { multipleAssetData: any//当前多选的素材 firstMultipleAssetData: any//当前多选的第一个素材 ngOnInit(): void { + let _this = this AxMessageSystem.addListener('selectionChanged', () => { if (this.canvas.selection.size() == 1) {//如果是单选 this.isMultipleAsset = false - // console.log('单选',this.canvas.selection.first().assetData) + console.log('单选', this.canvas.selection.first().assetData) this.setAssetsProperty(this.canvas.selection.first().assetData) } else if (this.canvas.selection.size()) { this.isShowProperty = true @@ -1227,6 +1235,21 @@ export class CollectionToolsPlanComponent implements OnInit { } this.canvas.setHighlight(iconHighLightArr) } + hideAllTreenode: boolean = true; //全部显示/隐藏tree节点 + toggoleAllTreenode() { + this.hideAllTreenode = !this.hideAllTreenode + let list = [] + this.allFireElements.forEach(element => { + if (element.isTemplate) { this.hideAllTreenode ? element.isLook = false : element.isLook = true } + }) + this.treeControl.dataNodes.forEach(item => { + this.hideAllTreenode ? item.isLook = false : item.isLook = true + item.level === 0 ? list.push(item) : null + }) + list.forEach(item => { + this.clickLookItem(item) + }) + } //点击数节点的显示隐藏icon clickLookItem(node) { @@ -1301,7 +1324,7 @@ export class CollectionToolsPlanComponent implements OnInit { //封装 刷新 tree 数据 async renovateTreeData(isRefresh: boolean = true) { // this.allFireElements[this.allFireElements.length-1].children = [] - if(!this.selectingSitePlan.isGis){ + if (!this.selectingSitePlan.isGis) { isRefresh ? await this.canvas.refresh() : null this.canvas.setNameVisible(this.basicInfo, 0) this.canvas.setNameVisible(this.wantToWork, 1) @@ -1309,34 +1332,37 @@ export class CollectionToolsPlanComponent implements OnInit { isRefresh ? this.canvasData.isChange = false : null //服务中 数据是否改动 改为false isRefresh ? this.isShowProperty = true : null isRefresh ? this.isShowAttribute = true : null - }else{ + } else { //加载高德地图 this.toLoadGis() } - - // let beforeOneId = this.selectingSitePlan.id || '' //当前 选中 平面图 楼层/区域 id - // let companyBuildingData = JSON.parse(JSON.stringify( this.canvasData.originalcompanyBuildingData || {} )) // 当前 单位/建筑 数据 - // let storeyData = JSON.parse(JSON.stringify( this.canvasData.originaleveryStoreyData || {} )) //当前 楼层 数据 - - // for(let key in companyBuildingData.data){ - // if (companyBuildingData.data[key].FloorId === beforeOneId) { //处理 单位/建筑 数据是否归于当前楼层下 - // storeyData.data[key] = companyBuildingData.data[key] - // } - // } - // for(let key in storeyData.data){ //筛选数据 没有匹配全部放入到 其他 数组 - // let noMatch = this.allFireElements.find( every=> every.id===storeyData.data[key].FireElementId ) - // if (!noMatch && storeyData.data[key].Id != "图例") { - // this.allFireElements[this.allFireElements.length-1].children.push(storeyData.data[key]) - // } - // } - // this.handleTreeData(storeyData) //处理tree数据结构 - } - map:any - toLoadGis(){ - this.map = new AMap.Map('container', { + + let beforeOneId = this.selectingSitePlan.id || '' //当前 选中 平面图 楼层/区域 id + let companyBuildingData = JSON.parse(JSON.stringify( this.canvasData.originalcompanyBuildingData || {} )) // 当前 单位/建筑 数据 + let storeyData = JSON.parse(JSON.stringify( this.canvasData.originaleveryStoreyData || {} )) //当前 楼层 数据 + + for(let key in companyBuildingData.data){ + if (companyBuildingData.data[key].FloorId === beforeOneId) { //处理 单位/建筑 数据是否归于当前楼层下 + storeyData.data[key] = companyBuildingData.data[key] + } + } + for(let key in storeyData.data){ //筛选数据 没有匹配全部放入到 其他 数组 + let noMatch = this.allFireElements.find( every=> every.id===storeyData.data[key].FireElementId ) + if (!noMatch && storeyData.data[key].Id != "图例") { + this.allFireElements[this.allFireElements.length-1].children.push(storeyData.data[key]) + } + } + this.handleTreeData(storeyData) //处理tree数据结构 + } + map: any + toLoadGis() { + this.map = new AMap.Map('planContainer', { viewMode: '2D', // 默认使用 2D 模式,如果希望使用带有俯仰角的 3D 模式,请设置 viewMode: '3D', - zoom:11, //初始化地图层级 - center: [116.397428, 39.90923] //初始化地图中心点 + zoom: 11, //初始化地图层级 + }); + this.map.setCity('上海市'); + this.map.on('click', (e) => { + this.showInfoClick(e) }); } @@ -1388,15 +1414,15 @@ export class CollectionToolsPlanComponent implements OnInit { //获取总平面图 getSitePlan() { - // let fireData = this.getFireElements(sessionStorage.getItem('buildingTypeId')) //获取单位下 消防要素 + let fireData = this.getFireElements(sessionStorage.getItem('buildingTypeId')) //获取单位下 消防要素 let planData = this.getSitePlanCompanyData() //获取 单位 数据 this.http.get('/api/SitePlans', { params: this.params }).subscribe(data => { this.sitePlanData = data this.selectingSitePlan = this.sitePlanData[0] || {} this.canvasData.selectStorey = this.sitePlanData[0] || {} //服务中 存一份数据 - if(this.sitePlanData.length != 0 && this.sitePlanData[0].isGis){ + if (this.sitePlanData.length != 0 && this.sitePlanData[0].isGis) { this.isGis = true - }else{ + } else { this.isGis = false } this.selectSitePlanIndex = 0 @@ -1411,7 +1437,7 @@ export class CollectionToolsPlanComponent implements OnInit { //获取建筑 楼层/区域 废弃 getBuildingSitePlan(item) { let params = { buildingId: item.id } - // let fireData = this.getFireElements(item.buildingTypes[0].id || '') //获取建筑下 消防要素 + let fireData = this.getFireElements(item.buildingTypes[0].id || '') //获取建筑下 消防要素 let planData = this.getBuildingData(params) //获取 建筑 数据 this.http.get('/api/BuildingAreas', { params }).subscribe(data => { this.sitePlanData = data @@ -1452,6 +1478,7 @@ export class CollectionToolsPlanComponent implements OnInit { getSitePlanCompanyData() { return new Promise((resolve, reject) => { this.http.get('/api/CompanyData', { params: this.params }).subscribe((data: any) => { + console.log('单位数据', data) this.canvasData.originalcompanyBuildingData = data || {} // 单位原数据 this.canvasData.originalcompanyBuildingData.data ? this.canvasData.originalcompanyBuildingData.data = JSON.parse(this.canvasData.originalcompanyBuildingData.data) : this.canvasData.originalcompanyBuildingData.data = {} this.canvasData.originalcompanyBuildingData.version = "2.0" @@ -1465,6 +1492,7 @@ export class CollectionToolsPlanComponent implements OnInit { getSitePlanStorey(e) { let params = { sitePlanId: e.id } this.http.get(`/api/SitePlanData`, { params }).subscribe((data: any) => { + console.log('平面图数据', data) this.canvasData.originaleveryStoreyData = data || {} // 楼层原数据 this.canvasData.originaleveryStoreyData.data ? this.canvasData.originaleveryStoreyData.data = JSON.parse(this.canvasData.originaleveryStoreyData.data) : this.canvasData.originaleveryStoreyData.data = {} this.canvasData.originaleveryStoreyData.version = "2.0" @@ -1499,12 +1527,12 @@ export class CollectionToolsPlanComponent implements OnInit { } //点击选中 平面图 楼层/区域 时 - isGis:boolean + isGis: boolean selectSitePlan(item, index) { - console.log('点击楼层',item) - if(item.isGis){ + console.log('点击楼层', item) + if (item.isGis) { this.isGis = true - }else{ + } else { this.isGis = false } @@ -1654,7 +1682,7 @@ export class CollectionToolsPlanComponent implements OnInit { //旋转底图 revolveImg(item) { - if(item.isGis){ + if (item.isGis) { const config = new MatSnackBarConfig(); config.verticalPosition = 'top'; config.duration = 3000 @@ -1744,7 +1772,7 @@ export class CollectionToolsPlanComponent implements OnInit { //复制图层 平面图 楼层/区域 duplicateLayer(item) { - if(item.isGis){ + if (item.isGis) { const config = new MatSnackBarConfig(); config.verticalPosition = 'top'; config.duration = 3000 @@ -1938,11 +1966,102 @@ export class CollectionToolsPlanComponent implements OnInit { //点击选中素材库图片时 selectImg(item, items, index) { + //如果是gis this.selectLibrary = item.name this.selectImage = items + // console.log('选中图片',this.selectImage) this.selectImageIndex = index - this.canvasData.selectTemplateData = items - this.canvas.beginPaint() + if (this.isGis) { + console.log(this.map) + + } else { + this.canvasData.selectTemplateData = items + this.canvas.beginPaint() + } + } + + //存储当前gis平面图的所有图标信息 + planData = [] + //存储当前gis平面图的所有marker信息 + planDataMarkers = [] + + //地图单击事件 + clickId + showInfoClick(e) { + if (!this.selectImage.imageUrl) { + return + } + let id = ObjectID.default.generate() + // console.log('点击了地图', e) + + // 新增点标记 + // 点标记显示内容,HTML要素字符串 + let markerContent = '' + + '
' + + `` + + `
X
` + + '
'; + + // 将 icon 传入 marker + let startMarker = new AMap.Marker({ + position: new AMap.LngLat(e.lnglat.lng, e.lnglat.lat), + // 将 html 传给 content + content: markerContent, + // 以 icon 的 [center bottom] 为原点 + offset: new AMap.Pixel(-13, -30), + draggable: true, + }); + + startMarker.id = id + startMarker.on('click', (e) => { + this.clickId = e.target.id + for (let index = 0; index < this.planData.length; index++) { + const item = this.planData[index]; + if (item.id == e.target.id) { + this.setAssetsProperty(item) + return + } + } + }); + startMarker.on('dragend', (e) => { + console.log('拖拽完成', e) + this.clickId = e.target.id + for (let index = 0; index < this.planData.length; index++) { + const item = this.planData[index]; + if (item.id == e.target.id) { + //修改最终坐标数据 + item.point = { x: e.lnglat.lng, y: e.lnglat.lat } + return + } + } + }); + + //将图标数据添加 + let itemData = JSON.parse(JSON.stringify(this.selectImage)) + itemData.id = id + itemData.point = { x: e.lnglat.lng, y: e.lnglat.lat } + this.planData.push(itemData) + //将marker点添加 + this.planDataMarkers.push(startMarker) + this.map.add(startMarker); + //点击关闭按钮 + window.deleteMarker = () => { + //清除地图标点 + this.planDataMarkers.forEach((element, index) => { + if (element.id == this.clickId) { + this.planDataMarkers[index].setMap(null); + } + }); + //删除指定数据 + for (let index = 0; index < this.planData.length; index++) { + const item = this.planData[index]; + if (item.id == this.clickId) { + this.planData.splice(index, 1) + return + } + } + + } } diff --git a/src/main.ts b/src/main.ts index eafe5e6..611c343 100644 --- a/src/main.ts +++ b/src/main.ts @@ -3,6 +3,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { AppModule } from './app/app.module'; import { environment } from './environments/environment'; + if (environment.production) { enableProdMode(); } diff --git a/src/styles.scss b/src/styles.scss index 45e5225..70aaa0a 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -117,6 +117,9 @@ table td.mat-footer-cell:last-of-type{ .mat-expansion-indicator::after { color: #fff; } + mat-expansion-panel{ + box-shadow: 0 0 black;border: 1px solid #EEF1F5; + } } //gis标点弹出框样式 #gispopupbox{ @@ -232,4 +235,35 @@ td{ height: auto!important; } +} +#planContainer{ + .custom-content-marker { + position: relative; + width: 28px; + height: 28px; + } + + .custom-content-marker img { + width: 100%; + height: 100%; + } + + .custom-content-marker .close-btn { + position: absolute; + top: -6px; + right: -8px; + width: 15px; + height: 15px; + font-size: 12px; + background: #ccc; + border-radius: 50%; + color: #fff; + text-align: center; + line-height: 15px; + box-shadow: -1px 1px 1px rgba(10, 10, 10, .2); + } + + .custom-content-marker .close-btn:hover{ + background: #666; + } } \ No newline at end of file