Browse Source

[新增]新增适应缩放和重置缩放按钮

zhuzhou
邵佳豪 4 years ago
parent
commit
335e6fc7c0
  1. 24
      src/app/ui/collection-tools-building/addDisposalNode.html
  2. 38
      src/app/ui/collection-tools-building/collection-tools.component.html
  3. 9
      src/app/ui/collection-tools-building/collection-tools.component.scss
  4. 118
      src/app/ui/collection-tools-building/collection-tools.component.ts
  5. 23
      src/app/ui/collection-tools-building/editDisposalNode.html
  6. 52
      src/app/ui/collection-tools-building/leftFunctionalDomain.ts
  7. 300
      src/app/ui/collection-tools-building/save.ts
  8. 5
      src/app/ui/collection-tools-building/saveOne.html
  9. 53
      src/app/ui/collection-tools-building/saveTwo.html
  10. 24
      src/app/ui/collection-tools-building/viewdetails.html
  11. 24
      src/app/ui/collection-tools-plan/addDisposalNode.html
  12. 38
      src/app/ui/collection-tools-plan/collection-tools.component.html
  13. 9
      src/app/ui/collection-tools-plan/collection-tools.component.scss
  14. 118
      src/app/ui/collection-tools-plan/collection-tools.component.ts
  15. 23
      src/app/ui/collection-tools-plan/editDisposalNode.html
  16. 52
      src/app/ui/collection-tools-plan/leftFunctionalDomain.ts
  17. 300
      src/app/ui/collection-tools-plan/save.ts
  18. 5
      src/app/ui/collection-tools-plan/saveOne.html
  19. 53
      src/app/ui/collection-tools-plan/saveTwo.html
  20. 24
      src/app/ui/collection-tools-plan/viewdetails.html
  21. 10
      src/app/ui/collection-tools/collection-tools.component.html
  22. 9
      src/app/ui/collection-tools/collection-tools.component.scss
  23. 9
      src/app/ui/collection-tools/collection-tools.component.ts
  24. 12
      src/app/ui/ui.module.ts
  25. 2
      src/app/working-area/working-area.component.ts
  26. BIN
      src/assets/images/适应缩放.png
  27. BIN
      src/assets/images/重置缩放.png

24
src/app/ui/collection-tools-building/addDisposalNode.html

@ -1,24 +0,0 @@
<div class="functionalDomainContent">
<div mat-dialog-title>
<label *ngIf="!data.parentId">新建处置节点</label>
<label *ngIf="data.parentId">新建节点</label>
</div>
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
<div class="keyMargin">
<mat-form-field>
<input matInput name="name" required ngModel placeholder="名称">
</mat-form-field>
</div>
<div class="submitBottom">
<button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>

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

@ -20,7 +20,14 @@
<button (click)="pasteAsset()" class="copytobutn marginLeftRight" mat-button title="粘贴" *ngIf="isEditPattern">
粘贴<mat-icon>screen_share</mat-icon>
</button>
<span title="适应缩放" class="zoom" (click)="adaptZoom()">
<img src="/assets/images/适应缩放.png" alt="">
适应缩放
</span>
<span title="重置缩放" class="zoom" (click)="resetZoom()">
<img src="/assets/images/重置缩放.png" alt="">
重置缩放
</span>
<span class="rightSave">
<!-- <mat-icon title="查看/编辑模式" (click)="lookpat()" *ngIf="isEditPattern">tv</mat-icon>
<mat-icon title="查看/编辑模式" (click)="editpat()" *ngIf="!isEditPattern && isediticon">create</mat-icon> -->
@ -131,35 +138,6 @@
</div>
</div>
<!-- 素材库 -->
<!-- 处置预案 -->
<div class="handlePlan" *ngIf="!pattern">
<div class="planarGraphHeader" (click)='toggleHandlePlan()'>
<mat-icon *ngIf="toggleHandlePlans">keyboard_arrow_up</mat-icon>
<mat-icon *ngIf="!toggleHandlePlans">keyboard_arrow_down</mat-icon>
<label class="overflowText" style="font-weight: 550;">处置预案</label>
<label style="margin-left: 45px;">
<mat-icon style="color: #c2a40ce8;" title="计算差异" (click)='countValue($event)'>flash_on</mat-icon>
<mat-icon style="margin-left: 3px;" title="新建空节点" (click)='addPanelPoint($event,null,treeData)'>add</mat-icon>
</label>
</div>
<div [hidden]="!toggleHandlePlans">
<nz-tree #nzTreeComponent [nzData]="treeData" nzBlockNode nzDraggable (nzOnDrop)="nzEvent($event)" [nzTreeTemplate]="nzTreeTemplate" [nzBeforeDrop]="beforeDrop" [nzExpandedKeys]="defaultExpandedKeys"></nz-tree>
<ng-template #nzTreeTemplate let-node let-origin="origin">
<div id="terrNodePublic" (click)='selectanelPoint(node.origin)' [ngClass]="{'selectanelPoint': selectDisposalNode==node.origin.id}">
<label title="{{node.title}}" class="overflowText textNode">{{node.title}}</label>
<div class="planIconDiv">
<mat-icon *ngIf="!node.origin.sitePlanId && !node.origin.buildingAreaId" (click)='editPanelPoint($event,node)'>edit</mat-icon>
<mat-icon *ngIf="node.level===0" (click)='addPanelPoint($event,node.origin,null)'>add</mat-icon>
<mat-icon *ngIf="!node.origin.sitePlanId && !node.origin.buildingAreaId" (click)='copyPanelPoint($event,node,treeData)'>library_books</mat-icon>
<mat-icon (click)='deletePanelPoint($event,node.origin)'>delete_forever</mat-icon>
</div>
</div>
</ng-template>
</div>
</div>
<!-- 处置预案 -->
</div>

9
src/app/ui/collection-tools-building/collection-tools.component.scss

@ -25,6 +25,15 @@
align-items:center;
min-height: 40px;
background-color: #fff;
.zoom{
display: flex;
align-items: center;
margin-left: 15px;
cursor: pointer;
img{
margin-right: 3px;
}
}
.marginLeftRight {
margin: 0 8px;
font-size: 16px;

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

@ -2,14 +2,13 @@ import { Component, OnInit, Inject, ViewChild,ElementRef,Renderer2, ViewContaine
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import {leftFunctionalDomainBuildingComponent,editPlaneFigureBuildingComponent,addDisposalNodeBuildingComponent,editDisposalNodeBuildingComponent} from './leftFunctionalDomain'
import {leftFunctionalDomainBuildingComponent,editPlaneFigureBuildingComponent} from './leftFunctionalDomain'
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree';
import {FlatTreeControl} from '@angular/cdk/tree';
import {WorkingAreaComponent} from '../../working-area/working-area.component'
import {CanvasShareDataService, DisposalNodeData} from '../../canvas-share-data.service' //引入服务
import Viewer from 'viewerjs';
import Swiper from 'swiper';
import { saveOneDialogBuilding } from './save';
import { NzFormatBeforeDropEvent, NzFormatEmitEvent,NzTreeComponent } from 'ng-zorro-antd/tree';
import { Observable, of } from 'rxjs';
import { GameMode } from 'src/app/working-area/model/gameMode';
@ -172,7 +171,14 @@ export class CollectionToolsBuildingComponent implements OnInit {
this.getDisposalNode()
}
}
//适应缩放
adaptZoom(){
this.canvas.zoomFit()
}
//重置缩放
resetZoom(){
this.canvas.resetCamera2D()
}
//ngzorro tree 拖拽
nzEvent(event: NzFormatEmitEvent): void {
if(this.isDrag){
@ -457,14 +463,6 @@ export class CollectionToolsBuildingComponent implements OnInit {
this.canvas.refreshIcon(this.canvasAssetObj.Id)
}
//查看图片详情
lookImg(){
const dialogRef = this.dialog.open(ViewDetailsBuilding, {//调用open方法打开对话框并且携带参数过去
data: {imagesArr:this.imagesArr,index:this.clickedIndex}
});
dialogRef.afterClosed().subscribe(data=>{ });
}
//上传素材图片
selectFile(e){
let imgFile = e.target.files[0] || null //上传的文件
@ -1167,21 +1165,7 @@ export class CollectionToolsBuildingComponent implements OnInit {
}
}
}else{//如果是想定作业编辑模式
const dialogRef = this.dialog.open(saveOneDialogBuilding, {
data: {allDisposalNode: this.canvasData.allDisposalNode,
selectedBuildingData:this.beforeOneCheckedBuilding,
selectedSiteData:this.selectingSitePlan,
siteOrbuilding:this.checkedBuildingIndex,
disasterId: this.allFirePlan[0].id || ''
}
});
dialogRef.afterClosed().subscribe(result => {
// console.log('The dialog was closed');
});
}
} else { //if
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
@ -2237,43 +2221,6 @@ export class CollectionToolsBuildingComponent implements OnInit {
})
}
//新建 处置预案 节点
addPanelPoint (e,item,treeData) {
e.stopPropagation()
let order
if (item) {
item.children.length? order = item.children[item.children.length-1].order+1 : order = 0
} else {
treeData.length? order = treeData[treeData.length-1].order+1 : order = 0
}
let data = {
name: '',
level: item? 1 : 0,
order: order,
description: '',
disasterId: this.allFirePlan[0].id || '',
parentId: item? item.id : null,
planComponentId: sessionStorage.getItem('planId') || '',
}
let dialogRef = this.dialog.open(addDisposalNodeBuildingComponent,{data});
dialogRef.afterClosed().subscribe(data=>{
if (data) { this.refurbishTreeData() }
})
}
//编辑 处置预案 节点
editPanelPoint (e,item) {
e.stopPropagation()
let data = item.origin
let dialogRef = this.dialog.open(editDisposalNodeBuildingComponent,{data});
dialogRef.afterClosed().subscribe(data=>{
if (data) {
item.title = data
this.canvasData.allDisposalNode.forEach(element => { element.id === item.key? element.name=data : null });
}
})
}
//复制 处置预案 节点
copyPanelPoint (e,item,treeData) {
e.stopPropagation()
@ -2489,50 +2436,3 @@ export class EditBuildingBuilding {
}
}
//查看图片大图
@Component({
selector: 'viewdetails-building',
templateUrl: './viewdetails.html',
styleUrls: ['./collection-tools.component.scss']
})
export class ViewDetailsBuilding {
// myControl = new FormControl();
//注入MatDialogRef,可以用来关闭对话框
//要访问对话框组件中的数据,必须使用MAT_DIALOG_DATA注入令牌
constructor(private http: HttpClient,public dialogRef: MatDialogRef<any>,@Inject(MAT_DIALOG_DATA) public data,private element: ElementRef) {}
imagesArr = this.data.imagesArr
onNoClick(): void {
this.dialogRef.close();
}
ngOnInit(): void {
setTimeout(() => {
var mySwiper = new Swiper('.swiper-container',{
loop: false,
initialSlide :this.data.index,//默认索引
// 如果需要前进后退按钮
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
}
//其他设置
});
}, 0);
}
closeDialog(){
this.dialogRef.close();
}
count = 10
zoomimg(e) {
if(this.count != 1 || e.wheelDelta >= 120){
if(e.wheelDelta >= 120){
this.count++
}else{
this.count--
}
}
e.srcElement.style.zoom = this.count + '0%'
e.srcElement.style.maxWidth = null
e.srcElement.style.maxHeight = null
}
}

23
src/app/ui/collection-tools-building/editDisposalNode.html

@ -1,23 +0,0 @@
<div class="functionalDomainContent">
<div mat-dialog-title>
<label>修改灾情节点名称</label>
</div>
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
<div class="keyMargin">
<mat-form-field>
<input matInput name="name" required [(ngModel)]="nodeName" placeholder="名称">
</mat-form-field>
</div>
<div class="submitBottom">
<button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>

52
src/app/ui/collection-tools-building/leftFunctionalDomain.ts

@ -126,55 +126,3 @@ export class editPlaneFigureBuildingComponent implements OnInit {
}
//创建 处置预案 节点
@Component({
selector: 'app-addDisposalNode-building',
templateUrl: './addDisposalNode.html',
styleUrls: ['./panel.scss']
})
export class addDisposalNodeBuildingComponent implements OnInit {
constructor(private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,public dialogRef: MatDialogRef<any>,@Inject(MAT_DIALOG_DATA) public data) { }
ngOnInit(): void {
}
//提交表单
onSubmit (e) {
this.data.name = e.name
this.http.post('/api/DisposalNodes',this.data).subscribe(data=>{
this.dialogRef.close('success');
})
}
}
//编辑 处置预案 节点
@Component({
selector: 'app-editDisposalNode-building',
templateUrl: './editDisposalNode.html',
styleUrls: ['./panel.scss']
})
export class editDisposalNodeBuildingComponent implements OnInit {
constructor(private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,public dialogRef: MatDialogRef<any>,@Inject(MAT_DIALOG_DATA) public data) { }
ngOnInit(): void {
this.nodeName = JSON.parse(JSON.stringify( this.data.name || '' ))
}
nodeName:string;
//提交表单
onSubmit (e) {
this.data.name = e.name
this.http.put(`/api/DisposalNodes/${this.data.id}`,this.data).subscribe(data=>{
this.dialogRef.close(e.name);
})
}
}

300
src/app/ui/collection-tools-building/save.ts

@ -1,300 +0,0 @@
import { Component, OnInit, Inject } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import {CanvasShareDataService,DisposalNodeData} from '../../canvas-share-data.service' //引入服务
// 保存想定作业第一个弹窗
@Component({
selector: 'dialog-overview-example-dialog-building',
templateUrl: 'saveOne.html',
styleUrls: ['./collection-tools.component.scss']
})
export class saveOneDialogBuilding {
constructor(
private http:HttpClient,
public dialog: MatDialog,
public snackBar: MatSnackBar,
public dialogRef: MatDialogRef<any>,
@Inject(MAT_DIALOG_DATA) public data) {}
onNoClick(): void {
this.dialogRef.close()
}
allDisposalNode = this.data.allDisposalNode
saveType(type){
this.dialogRef.close()
const dialogRef = this.dialog.open(saveTwoDialogBuilding, {
data: {type: type,
allDisposalNode: this.data.allDisposalNode,
selectedBuildingData:this.data.selectedBuildingData,
selectedSiteData:this.data.selectedSiteData,
siteOrbuilding:this.data.siteOrbuilding,
disasterId:this.data.disasterId}
});
dialogRef.afterClosed().subscribe(result => {
});
}
}
// 保存想定作业第二个弹窗
@Component({
selector: 'dialog-overview-example-dialog-building',
templateUrl: 'saveTwo.html',
styleUrls: ['./collection-tools.component.scss']
})
export class saveTwoDialogBuilding {
constructor(
private http:HttpClient,
public dialogRef: MatDialogRef<any>,
public canvasData: CanvasShareDataService,
public snackBar: MatSnackBar,
@Inject(MAT_DIALOG_DATA) public data) {}
type = this.data.type
allDisposalNode = this.data.allDisposalNode
allPlanDisposalNode = []
allRootDisposalNode = [{name:"根节点",id:null}]
allDisposalNodeChild = []
ngOnInit(): void {
//所有非数据节点
this.allDisposalNode.forEach(item => {
if(!item.sitePlanId && !item.buildingAreaId){
this.allPlanDisposalNode.push(item)
}
})
//所有一级节点
this.allDisposalNode.forEach(item => {
if(!item.parentId){
this.allRootDisposalNode.push(item)
}
})
this.allDisposalNodeChild = JSON.parse(JSON.stringify(this.allDisposalNode))
this.allDisposalNodeChild.forEach(item => {
item.children = []
this.allDisposalNodeChild.forEach(i => {
if(i.parentId == item.id){
item.children.push(i)
}
})
})
// console.log(this.nodeItem.id)
}
onNoClick(): void {
this.dialogRef.close();
}
nodeItem
itemChildNum = 0 //点击处置节点子数据节点的数量
clickNode(item){
// console.log(item)
this.nodeItem = item
this.allDisposalNodeChild.forEach(item => {
if(item.id == this.nodeItem.id){
this.itemChildNum = item.children.length
}
})
}
selectedBuildingData = this.data.selectedBuildingData
selectedSiteData = this.data.selectedSiteData
onSubmit(value,type){
// console.log(type)
let name = this.selectedBuildingData.name + '-' + this.selectedSiteData.name
//如果保存到已有节点
var postdata = {
id: "",
name: name,
level: 0,
order: this.itemChildNum,
description: "",
notes: "",
weather: null,
airTemperature: null,
windDirection: null,
windScale: null,
imageNames: null,
imageUrls: null,
parentId: this.nodeItem ? this.nodeItem.id : null,
disasterId: this.data.disasterId,
planComponentId: sessionStorage.getItem('planId') || '',
companyId: this.data.siteOrbuilding == -1 ? sessionStorage.getItem('companyId') : null,
sitePlanId: this.data.siteOrbuilding==-1 ? this.selectedSiteData.id : null,
buildingId: this.selectedBuildingData.id || null,
buildingAreaId: this.data.siteOrbuilding!=-1 ? this.selectedSiteData.id : null
}
if(type == 'old'){
let istrue = this.canvasData.findDisposalNode(this.nodeItem.id,name)
let putdata = this.nodeItem
putdata.weather = this.canvasData.selectPanelPointBaseData.weather
putdata.airTemperature = Number(this.canvasData.selectPanelPointBaseData.airTemperature)
putdata.windScale = Number(this.canvasData.selectPanelPointBaseData.windScale)
putdata.windDirection = Number(this.canvasData.selectPanelPointBaseData.windDirection)
putdata.description = this.canvasData.selectPanelPointBaseData.description
putdata.notes = this.canvasData.selectPanelPointBaseData.notes
if(istrue){//如果该处置节点下已有同名数据节点 则只修改 2个接口
new Promise((resolve,reject)=>{
this.http.put(`/api/DisposalNodes/${value.nodeId}`,putdata).subscribe(data => {
resolve("更新处置节点成功,将天气 节点详情等信息保存到点击的节点")
})
}).then((values)=>{
this.canvasData.sendMessage('send a message');//发布一条消息
// 保存平面图数据到当前节点
let postdata =JSON.parse(JSON.stringify(this.canvasData.selectPanelPoint))
postdata.Data = JSON.stringify(postdata.Data)
this.http.post(`/api/DisposalNodeData`,postdata).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存成功','确定',config)
},err=>{
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存失败','确定',config)
})
this.dialogRef.close();
this.canvasData.sendMessage('send a message');//发布一条消息
})
}else{//需要3个接口
new Promise((resolve,reject)=>{
this.http.put(`/api/DisposalNodes/${value.nodeId}`,putdata).subscribe(data => {
resolve("更新处置节点成功,将天气 节点详情等信息保存到点击的节点")
})
}).then((values)=>{
// console.log(values)
postdata.level = putdata.level + 1
new Promise((resolve,reject) => {
this.http.post(`/api/DisposalNodes`,postdata).subscribe(data => {
resolve(data)
})
}).then((data:any)=>{
// console.log(7788,data)
let objData = {
id: "",
data: JSON.stringify(this.canvasData.selectPanelPoint.Data) || null,
version: this.canvasData.selectPanelPoint.Version || "2.0",
disposalNodeId: data.id,
planComponentId: sessionStorage.getItem("planId"),
}
this.http.post(`/api/DisposalNodeData`,objData).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存成功','确定',config)
},err=>{
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存失败','确定',config)
})
this.dialogRef.close();
this.canvasData.sendMessage('send a message');//发布一条消息
})
})
}
}else{//如果保存到新建节点
let dispositionNodeData //处置节点data
let order
let oneLevelNum = []
//将order赋值为所有一级节点最后一个+1
this.allDisposalNode.forEach(item => {
if(!item.parentId){
oneLevelNum.push(item)
}
})
if(oneLevelNum.length == 0){
order = 0
}else{
order = oneLevelNum[oneLevelNum.length - 1].order + 1
}
if(this.nodeItem){//如果点击了下拉选择框
if(this.nodeItem.id != null){
this.allDisposalNodeChild.forEach(item => {
if(item.id == this.nodeItem.id){
order = item.children.length
}
})
}
}
dispositionNodeData = {
id: "",
name: value.name,
level: this.nodeItem && this.nodeItem.id != null ? this.nodeItem.level + 1 : 0,
order: order,
description: "",
notes: "",
weather: null,
airTemperature: 0,
windDirection: 0,
windScale: 0,
imageNames: null,
imageUrls: null,
parentId: this.nodeItem ? this.nodeItem.id : null,
disasterId: this.data.disasterId,
planComponentId: sessionStorage.getItem('planId') || '',
companyId: null,
sitePlanId: null,
buildingId: null,
buildingAreaId: null
}
dispositionNodeData.weather = this.canvasData.selectPanelPointBaseData.weather
dispositionNodeData.airTemperature = Number(this.canvasData.selectPanelPointBaseData.airTemperature)
dispositionNodeData.windScale = Number(this.canvasData.selectPanelPointBaseData.windScale)
dispositionNodeData.windDirection = Number(this.canvasData.selectPanelPointBaseData.windDirection)
dispositionNodeData.description = this.canvasData.selectPanelPointBaseData.description
dispositionNodeData.notes = this.canvasData.selectPanelPointBaseData.notes
//1.先创建一个处置节点 然后 .then 2.创建数据节点到刚创建的处置节点 3.然后拿着创建好的数据节点的id 将平面图data保存
new Promise((resolve,reject) => {
this.http.post("/api/DisposalNodes",dispositionNodeData).subscribe((data:any) => {
resolve(data.id)
})
}).then((id) => {
let dataNodeData
new Promise((resolve,reject) => {
postdata.parentId = id
postdata.level = dispositionNodeData.level + 1
this.http.post("/api/DisposalNodes",postdata).subscribe((data:any) => {
resolve(data)
})
}).then((data:any) => {
// 保存平面图数据到当前节点
// console.log(6666,data)
// let postdata =JSON.parse(JSON.stringify(this.canvasData.selectPanelPoint))
// postdata.Data = JSON.stringify(postdata.Data)
let objData = {
id: "",
data: JSON.stringify(this.canvasData.selectPanelPoint.Data) || null,
version: this.canvasData.selectPanelPoint.Version || "2.0",
disposalNodeId: data.id,
planComponentId: sessionStorage.getItem("planId"),
}
this.http.post(`/api/DisposalNodeData`,objData).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存成功','确定',config)
},err=>{
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存失败','确定',config)
})
this.dialogRef.close();
this.canvasData.sendMessage("send a message")
})
})
}
}
}

5
src/app/ui/collection-tools-building/saveOne.html

@ -1,5 +0,0 @@
<div mat-dialog-title>处置节点保存</div>
<div style="display: flex;">
<button mat-stroked-button style="margin-right: 5px;" (click)="saveType('new')">新建节点并保存</button>
<button mat-stroked-button (click)="saveType('old')">保存到已有节点</button>
</div>

53
src/app/ui/collection-tools-building/saveTwo.html

@ -1,53 +0,0 @@
<div *ngIf="type == 'new'">
<div mat-dialog-title>新增节点</div>
<div>
<form (ngSubmit)="onSubmit(form.value,'new')" #form="ngForm" class="example-container">
<div mat-dialog-content>
<mat-form-field>
<input type="text" matInput ngModel
required name="name" placeholder="节点名称" autocomplete="off">
</mat-form-field>
</div>
<div mat-dialog-content>
<mat-form-field>
<mat-select [(value)]="allRootDisposalNode[0].name" required placeholder="父节点名称">
<mat-option *ngFor="let item of allRootDisposalNode" [value]="item.name" (click)="clickNode(item)">
{{item.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-raised-button color="primary" type="submit"
[disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>
</div>
<div *ngIf="type == 'old'">
<div mat-dialog-title>保存到已有节点</div>
<div>
<form (ngSubmit)="onSubmit(form.value,'old')" #form="ngForm" class="example-container">
<div mat-dialog-content>
<mat-form-field>
<mat-select required ngModel placeholder="父节点名称" name="nodeId">
<mat-option *ngFor="let item of allPlanDisposalNode" [value]="item.id" (click)="clickNode(item)">
{{item.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-raised-button color="primary" type="submit"
[disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>
</div>

24
src/app/ui/collection-tools-building/viewdetails.html

@ -1,24 +0,0 @@
<div style="position: relative;width: 1400px;height: 800px;line-height: 800px;" class="swiper-container">
<div style="position: absolute;right: -2px;top: -392px;cursor: pointer;z-index: 999;width: 24px;height: 24px;" (click)="closeDialog()">
<span><mat-icon>clear</mat-icon></span>
</div>
<div class="swiper-wrapper">
<div class="swiper-slide" style="text-align: center;" *ngFor="let img of imagesArr">
<img id="bigimg" (mousewheel)="zoomimg($event)" style="
max-width: 96%;
max-height: 100%;
min-width: 1px;
min-height: 1px;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;" [src]="img.PropertyValue" alt="">
</div>
</div>
<!-- 如果需要导航按钮 -->
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>

24
src/app/ui/collection-tools-plan/addDisposalNode.html

@ -1,24 +0,0 @@
<div class="functionalDomainContent">
<div mat-dialog-title>
<label *ngIf="!data.parentId">新建处置节点</label>
<label *ngIf="data.parentId">新建节点</label>
</div>
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
<div class="keyMargin">
<mat-form-field>
<input matInput name="name" required ngModel placeholder="名称">
</mat-form-field>
</div>
<div class="submitBottom">
<button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>

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

@ -20,7 +20,14 @@
<button (click)="pasteAsset()" class="copytobutn marginLeftRight" mat-button title="粘贴" *ngIf="isEditPattern">
粘贴<mat-icon>screen_share</mat-icon>
</button>
<span title="适应缩放" class="zoom" (click)="adaptZoom()">
<img src="/assets/images/适应缩放.png" alt="">
适应缩放
</span>
<span title="重置缩放" class="zoom" (click)="resetZoom()">
<img src="/assets/images/重置缩放.png" alt="">
重置缩放
</span>
<span class="rightSave">
<!-- <mat-icon title="查看/编辑模式" (click)="lookpat()" *ngIf="isEditPattern">tv</mat-icon>
<mat-icon title="查看/编辑模式" (click)="editpat()" *ngIf="!isEditPattern && isediticon">create</mat-icon> -->
@ -114,35 +121,6 @@
</div>
</div>
<!-- 素材库 -->
<!-- 处置预案 -->
<div class="handlePlan" *ngIf="!pattern">
<div class="planarGraphHeader" (click)='toggleHandlePlan()'>
<mat-icon *ngIf="toggleHandlePlans">keyboard_arrow_up</mat-icon>
<mat-icon *ngIf="!toggleHandlePlans">keyboard_arrow_down</mat-icon>
<label class="overflowText" style="font-weight: 550;">处置预案</label>
<label style="margin-left: 45px;">
<mat-icon style="color: #c2a40ce8;" title="计算差异" (click)='countValue($event)'>flash_on</mat-icon>
<mat-icon style="margin-left: 3px;" title="新建空节点" (click)='addPanelPoint($event,null,treeData)'>add</mat-icon>
</label>
</div>
<div [hidden]="!toggleHandlePlans">
<nz-tree #nzTreeComponent [nzData]="treeData" nzBlockNode nzDraggable (nzOnDrop)="nzEvent($event)" [nzTreeTemplate]="nzTreeTemplate" [nzBeforeDrop]="beforeDrop" [nzExpandedKeys]="defaultExpandedKeys"></nz-tree>
<ng-template #nzTreeTemplate let-node let-origin="origin">
<div id="terrNodePublic" (click)='selectanelPoint(node.origin)' [ngClass]="{'selectanelPoint': selectDisposalNode==node.origin.id}">
<label title="{{node.title}}" class="overflowText textNode">{{node.title}}</label>
<div class="planIconDiv">
<mat-icon *ngIf="!node.origin.sitePlanId && !node.origin.buildingAreaId" (click)='editPanelPoint($event,node)'>edit</mat-icon>
<mat-icon *ngIf="node.level===0" (click)='addPanelPoint($event,node.origin,null)'>add</mat-icon>
<mat-icon *ngIf="!node.origin.sitePlanId && !node.origin.buildingAreaId" (click)='copyPanelPoint($event,node,treeData)'>library_books</mat-icon>
<mat-icon (click)='deletePanelPoint($event,node.origin)'>delete_forever</mat-icon>
</div>
</div>
</ng-template>
</div>
</div>
<!-- 处置预案 -->
</div>

9
src/app/ui/collection-tools-plan/collection-tools.component.scss

@ -25,6 +25,15 @@
align-items:center;
min-height: 40px;
background-color: #fff;
.zoom{
display: flex;
align-items: center;
margin-left: 15px;
cursor: pointer;
img{
margin-right: 3px;
}
}
.marginLeftRight {
margin: 0 8px;
font-size: 16px;

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

@ -2,14 +2,13 @@ import { Component, OnInit, Inject, ViewChild,ElementRef,Renderer2, ViewContaine
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import {leftFunctionalDomainComponentPlan,editPlaneFigureComponentPlan,editDisposalNodeComponentPlan,addDisposalNodeComponentPlan} from './leftFunctionalDomain'
import {leftFunctionalDomainComponentPlan,editPlaneFigureComponentPlan} from './leftFunctionalDomain'
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree';
import {FlatTreeControl} from '@angular/cdk/tree';
import {WorkingAreaComponent} from '../../working-area/working-area.component'
import {CanvasShareDataService, DisposalNodeData} from '../../canvas-share-data.service' //引入服务
import Viewer from 'viewerjs';
import Swiper from 'swiper';
import { saveOneDialogPlan } from './save';
import { NzFormatBeforeDropEvent, NzFormatEmitEvent,NzTreeComponent } from 'ng-zorro-antd/tree';
import { Observable, of } from 'rxjs';
import { GameMode } from 'src/app/working-area/model/gameMode';
@ -173,6 +172,14 @@ export class CollectionToolsPlanComponent implements OnInit {
}
}
//适应缩放
adaptZoom(){
this.canvas.zoomFit()
}
//重置缩放
resetZoom(){
this.canvas.resetCamera2D()
}
//ngzorro tree 拖拽
nzEvent(event: NzFormatEmitEvent): void {
if(this.isDrag){
@ -460,14 +467,6 @@ export class CollectionToolsPlanComponent implements OnInit {
this.canvas.refreshIcon(this.canvasAssetObj.Id)
}
//查看图片详情
lookImg(){
const dialogRef = this.dialog.open(ViewDetailsPlan, {//调用open方法打开对话框并且携带参数过去
data: {imagesArr:this.imagesArr,index:this.clickedIndex}
});
dialogRef.afterClosed().subscribe(data=>{ });
}
//上传素材图片
selectFile(e){
let imgFile = e.target.files[0] || null //上传的文件
@ -1168,21 +1167,7 @@ export class CollectionToolsPlanComponent implements OnInit {
}
}
}else{//如果是想定作业编辑模式
const dialogRef = this.dialog.open(saveOneDialogPlan, {
data: {allDisposalNode: this.canvasData.allDisposalNode,
selectedBuildingData:this.beforeOneCheckedBuilding,
selectedSiteData:this.selectingSitePlan,
siteOrbuilding:this.checkedBuildingIndex,
disasterId: this.allFirePlan[0].id || ''
}
});
dialogRef.afterClosed().subscribe(result => {
// console.log('The dialog was closed');
});
}
} else { //if
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
@ -2246,43 +2231,6 @@ export class CollectionToolsPlanComponent implements OnInit {
})
}
//新建 处置预案 节点
addPanelPoint (e,item,treeData) {
e.stopPropagation()
let order
if (item) {
item.children.length? order = item.children[item.children.length-1].order+1 : order = 0
} else {
treeData.length? order = treeData[treeData.length-1].order+1 : order = 0
}
let data = {
name: '',
level: item? 1 : 0,
order: order,
description: '',
disasterId: this.allFirePlan[0].id || '',
parentId: item? item.id : null,
planComponentId: sessionStorage.getItem('planId') || '',
}
let dialogRef = this.dialog.open(addDisposalNodeComponentPlan,{data});
dialogRef.afterClosed().subscribe(data=>{
if (data) { this.refurbishTreeData() }
})
}
//编辑 处置预案 节点
editPanelPoint (e,item) {
e.stopPropagation()
let data = item.origin
let dialogRef = this.dialog.open(editDisposalNodeComponentPlan,{data});
dialogRef.afterClosed().subscribe(data=>{
if (data) {
item.title = data
this.canvasData.allDisposalNode.forEach(element => { element.id === item.key? element.name=data : null });
}
})
}
//复制 处置预案 节点
copyPanelPoint (e,item,treeData) {
e.stopPropagation()
@ -2497,51 +2445,3 @@ export class EditBuildingPlan {
})
}
}
//查看图片大图
@Component({
selector: 'viewdetails-plan',
templateUrl: './viewdetails.html',
styleUrls: ['./collection-tools.component.scss']
})
export class ViewDetailsPlan {
// myControl = new FormControl();
//注入MatDialogRef,可以用来关闭对话框
//要访问对话框组件中的数据,必须使用MAT_DIALOG_DATA注入令牌
constructor(private http: HttpClient,public dialogRef: MatDialogRef<ViewDetailsPlan>,@Inject(MAT_DIALOG_DATA) public data,private element: ElementRef) {}
imagesArr = this.data.imagesArr
onNoClick(): void {
this.dialogRef.close();
}
ngOnInit(): void {
setTimeout(() => {
var mySwiper = new Swiper('.swiper-container',{
loop: false,
initialSlide :this.data.index,//默认索引
// 如果需要前进后退按钮
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
}
//其他设置
});
}, 0);
}
closeDialog(){
this.dialogRef.close();
}
count = 10
zoomimg(e) {
if(this.count != 1 || e.wheelDelta >= 120){
if(e.wheelDelta >= 120){
this.count++
}else{
this.count--
}
}
e.srcElement.style.zoom = this.count + '0%'
e.srcElement.style.maxWidth = null
e.srcElement.style.maxHeight = null
}
}

23
src/app/ui/collection-tools-plan/editDisposalNode.html

@ -1,23 +0,0 @@
<div class="functionalDomainContent">
<div mat-dialog-title>
<label>修改灾情节点名称</label>
</div>
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
<div class="keyMargin">
<mat-form-field>
<input matInput name="name" required [(ngModel)]="nodeName" placeholder="名称">
</mat-form-field>
</div>
<div class="submitBottom">
<button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>

52
src/app/ui/collection-tools-plan/leftFunctionalDomain.ts

@ -164,55 +164,3 @@ export class editPlaneFigureComponentPlan implements OnInit {
}
//创建 处置预案 节点
@Component({
selector: 'app-addDisposalNode-plan',
templateUrl: './addDisposalNode.html',
styleUrls: ['./panel.scss']
})
export class addDisposalNodeComponentPlan implements OnInit {
constructor(private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,public dialogRef: MatDialogRef<any>,@Inject(MAT_DIALOG_DATA) public data) { }
ngOnInit(): void {
}
//提交表单
onSubmit (e) {
this.data.name = e.name
this.http.post('/api/DisposalNodes',this.data).subscribe(data=>{
this.dialogRef.close('success');
})
}
}
//编辑 处置预案 节点
@Component({
selector: 'app-editDisposalNode-plan',
templateUrl: './editDisposalNode.html',
styleUrls: ['./panel.scss']
})
export class editDisposalNodeComponentPlan implements OnInit {
constructor(private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,public dialogRef: MatDialogRef<any>,@Inject(MAT_DIALOG_DATA) public data) { }
ngOnInit(): void {
this.nodeName = JSON.parse(JSON.stringify( this.data.name || '' ))
}
nodeName:string;
//提交表单
onSubmit (e) {
this.data.name = e.name
this.http.put(`/api/DisposalNodes/${this.data.id}`,this.data).subscribe(data=>{
this.dialogRef.close(e.name);
})
}
}

300
src/app/ui/collection-tools-plan/save.ts

@ -1,300 +0,0 @@
import { Component, OnInit, Inject } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import {CanvasShareDataService,DisposalNodeData} from '../../canvas-share-data.service' //引入服务
// 保存想定作业第一个弹窗
@Component({
selector: 'dialog-overview-example-dialog',
templateUrl: 'saveOne.html',
styleUrls: ['./collection-tools.component.scss']
})
export class saveOneDialogPlan {
constructor(
private http:HttpClient,
public dialog: MatDialog,
public snackBar: MatSnackBar,
public dialogRef: MatDialogRef<saveOneDialogPlan>,
@Inject(MAT_DIALOG_DATA) public data) {}
onNoClick(): void {
this.dialogRef.close()
}
allDisposalNode = this.data.allDisposalNode
saveType(type){
this.dialogRef.close()
const dialogRef = this.dialog.open(saveTwoDialogPlan, {
data: {type: type,
allDisposalNode: this.data.allDisposalNode,
selectedBuildingData:this.data.selectedBuildingData,
selectedSiteData:this.data.selectedSiteData,
siteOrbuilding:this.data.siteOrbuilding,
disasterId:this.data.disasterId}
});
dialogRef.afterClosed().subscribe(result => {
});
}
}
// 保存想定作业第二个弹窗
@Component({
selector: 'dialog-overview-example-dialog',
templateUrl: 'saveTwo.html',
styleUrls: ['./collection-tools.component.scss']
})
export class saveTwoDialogPlan {
constructor(
private http:HttpClient,
public dialogRef: MatDialogRef<saveTwoDialogPlan>,
public canvasData: CanvasShareDataService,
public snackBar: MatSnackBar,
@Inject(MAT_DIALOG_DATA) public data) {}
type = this.data.type
allDisposalNode = this.data.allDisposalNode
allPlanDisposalNode = []
allRootDisposalNode = [{name:"根节点",id:null}]
allDisposalNodeChild = []
ngOnInit(): void {
//所有非数据节点
this.allDisposalNode.forEach(item => {
if(!item.sitePlanId && !item.buildingAreaId){
this.allPlanDisposalNode.push(item)
}
})
//所有一级节点
this.allDisposalNode.forEach(item => {
if(!item.parentId){
this.allRootDisposalNode.push(item)
}
})
this.allDisposalNodeChild = JSON.parse(JSON.stringify(this.allDisposalNode))
this.allDisposalNodeChild.forEach(item => {
item.children = []
this.allDisposalNodeChild.forEach(i => {
if(i.parentId == item.id){
item.children.push(i)
}
})
})
// console.log(this.nodeItem.id)
}
onNoClick(): void {
this.dialogRef.close();
}
nodeItem
itemChildNum = 0 //点击处置节点子数据节点的数量
clickNode(item){
// console.log(item)
this.nodeItem = item
this.allDisposalNodeChild.forEach(item => {
if(item.id == this.nodeItem.id){
this.itemChildNum = item.children.length
}
})
}
selectedBuildingData = this.data.selectedBuildingData
selectedSiteData = this.data.selectedSiteData
onSubmit(value,type){
// console.log(type)
let name = this.selectedBuildingData.name + '-' + this.selectedSiteData.name
//如果保存到已有节点
var postdata = {
id: "",
name: name,
level: 0,
order: this.itemChildNum,
description: "",
notes: "",
weather: null,
airTemperature: null,
windDirection: null,
windScale: null,
imageNames: null,
imageUrls: null,
parentId: this.nodeItem ? this.nodeItem.id : null,
disasterId: this.data.disasterId,
planComponentId: sessionStorage.getItem('planId') || '',
companyId: this.data.siteOrbuilding == -1 ? sessionStorage.getItem('companyId') : null,
sitePlanId: this.data.siteOrbuilding==-1 ? this.selectedSiteData.id : null,
buildingId: this.selectedBuildingData.id || null,
buildingAreaId: this.data.siteOrbuilding!=-1 ? this.selectedSiteData.id : null
}
if(type == 'old'){
let istrue = this.canvasData.findDisposalNode(this.nodeItem.id,name)
let putdata = this.nodeItem
putdata.weather = this.canvasData.selectPanelPointBaseData.weather
putdata.airTemperature = Number(this.canvasData.selectPanelPointBaseData.airTemperature)
putdata.windScale = Number(this.canvasData.selectPanelPointBaseData.windScale)
putdata.windDirection = Number(this.canvasData.selectPanelPointBaseData.windDirection)
putdata.description = this.canvasData.selectPanelPointBaseData.description
putdata.notes = this.canvasData.selectPanelPointBaseData.notes
if(istrue){//如果该处置节点下已有同名数据节点 则只修改 2个接口
new Promise((resolve,reject)=>{
this.http.put(`/api/DisposalNodes/${value.nodeId}`,putdata).subscribe(data => {
resolve("更新处置节点成功,将天气 节点详情等信息保存到点击的节点")
})
}).then((values)=>{
this.canvasData.sendMessage('send a message');//发布一条消息
// 保存平面图数据到当前节点
let postdata =JSON.parse(JSON.stringify(this.canvasData.selectPanelPoint))
postdata.Data = JSON.stringify(postdata.Data)
this.http.post(`/api/DisposalNodeData`,postdata).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存成功','确定',config)
},err=>{
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存失败','确定',config)
})
this.dialogRef.close();
this.canvasData.sendMessage('send a message');//发布一条消息
})
}else{//需要3个接口
new Promise((resolve,reject)=>{
this.http.put(`/api/DisposalNodes/${value.nodeId}`,putdata).subscribe(data => {
resolve("更新处置节点成功,将天气 节点详情等信息保存到点击的节点")
})
}).then((values)=>{
// console.log(values)
postdata.level = putdata.level + 1
new Promise((resolve,reject) => {
this.http.post(`/api/DisposalNodes`,postdata).subscribe(data => {
resolve(data)
})
}).then((data:any)=>{
// console.log(7788,data)
let objData = {
id: "",
data: JSON.stringify(this.canvasData.selectPanelPoint.Data) || null,
version: this.canvasData.selectPanelPoint.Version || "2.0",
disposalNodeId: data.id,
planComponentId: sessionStorage.getItem("planId"),
}
this.http.post(`/api/DisposalNodeData`,objData).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存成功','确定',config)
},err=>{
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存失败','确定',config)
})
this.dialogRef.close();
this.canvasData.sendMessage('send a message');//发布一条消息
})
})
}
}else{//如果保存到新建节点
let dispositionNodeData //处置节点data
let order
let oneLevelNum = []
//将order赋值为所有一级节点最后一个+1
this.allDisposalNode.forEach(item => {
if(!item.parentId){
oneLevelNum.push(item)
}
})
if(oneLevelNum.length == 0){
order = 0
}else{
order = oneLevelNum[oneLevelNum.length - 1].order + 1
}
if(this.nodeItem){//如果点击了下拉选择框
if(this.nodeItem.id != null){
this.allDisposalNodeChild.forEach(item => {
if(item.id == this.nodeItem.id){
order = item.children.length
}
})
}
}
dispositionNodeData = {
id: "",
name: value.name,
level: this.nodeItem && this.nodeItem.id != null ? this.nodeItem.level + 1 : 0,
order: order,
description: "",
notes: "",
weather: null,
airTemperature: 0,
windDirection: 0,
windScale: 0,
imageNames: null,
imageUrls: null,
parentId: this.nodeItem ? this.nodeItem.id : null,
disasterId: this.data.disasterId,
planComponentId: sessionStorage.getItem('planId') || '',
companyId: null,
sitePlanId: null,
buildingId: null,
buildingAreaId: null
}
dispositionNodeData.weather = this.canvasData.selectPanelPointBaseData.weather
dispositionNodeData.airTemperature = Number(this.canvasData.selectPanelPointBaseData.airTemperature)
dispositionNodeData.windScale = Number(this.canvasData.selectPanelPointBaseData.windScale)
dispositionNodeData.windDirection = Number(this.canvasData.selectPanelPointBaseData.windDirection)
dispositionNodeData.description = this.canvasData.selectPanelPointBaseData.description
dispositionNodeData.notes = this.canvasData.selectPanelPointBaseData.notes
//1.先创建一个处置节点 然后 .then 2.创建数据节点到刚创建的处置节点 3.然后拿着创建好的数据节点的id 将平面图data保存
new Promise((resolve,reject) => {
this.http.post("/api/DisposalNodes",dispositionNodeData).subscribe((data:any) => {
resolve(data.id)
})
}).then((id) => {
let dataNodeData
new Promise((resolve,reject) => {
postdata.parentId = id
postdata.level = dispositionNodeData.level + 1
this.http.post("/api/DisposalNodes",postdata).subscribe((data:any) => {
resolve(data)
})
}).then((data:any) => {
// 保存平面图数据到当前节点
// console.log(6666,data)
// let postdata =JSON.parse(JSON.stringify(this.canvasData.selectPanelPoint))
// postdata.Data = JSON.stringify(postdata.Data)
let objData = {
id: "",
data: JSON.stringify(this.canvasData.selectPanelPoint.Data) || null,
version: this.canvasData.selectPanelPoint.Version || "2.0",
disposalNodeId: data.id,
planComponentId: sessionStorage.getItem("planId"),
}
this.http.post(`/api/DisposalNodeData`,objData).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存成功','确定',config)
},err=>{
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('保存失败','确定',config)
})
this.dialogRef.close();
this.canvasData.sendMessage("send a message")
})
})
}
}
}

5
src/app/ui/collection-tools-plan/saveOne.html

@ -1,5 +0,0 @@
<div mat-dialog-title>处置节点保存</div>
<div style="display: flex;">
<button mat-stroked-button style="margin-right: 5px;" (click)="saveType('new')">新建节点并保存</button>
<button mat-stroked-button (click)="saveType('old')">保存到已有节点</button>
</div>

53
src/app/ui/collection-tools-plan/saveTwo.html

@ -1,53 +0,0 @@
<div *ngIf="type == 'new'">
<div mat-dialog-title>新增节点</div>
<div>
<form (ngSubmit)="onSubmit(form.value,'new')" #form="ngForm" class="example-container">
<div mat-dialog-content>
<mat-form-field>
<input type="text" matInput ngModel
required name="name" placeholder="节点名称" autocomplete="off">
</mat-form-field>
</div>
<div mat-dialog-content>
<mat-form-field>
<mat-select [(value)]="allRootDisposalNode[0].name" required placeholder="父节点名称">
<mat-option *ngFor="let item of allRootDisposalNode" [value]="item.name" (click)="clickNode(item)">
{{item.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-raised-button color="primary" type="submit"
[disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>
</div>
<div *ngIf="type == 'old'">
<div mat-dialog-title>保存到已有节点</div>
<div>
<form (ngSubmit)="onSubmit(form.value,'old')" #form="ngForm" class="example-container">
<div mat-dialog-content>
<mat-form-field>
<mat-select required ngModel placeholder="父节点名称" name="nodeId">
<mat-option *ngFor="let item of allPlanDisposalNode" [value]="item.id" (click)="clickNode(item)">
{{item.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-raised-button color="primary" type="submit"
[disabled]="!form.form.valid">
确定
</button>
<button mat-raised-button mat-dialog-close>取消</button>
</div>
</form>
</div>
</div>

24
src/app/ui/collection-tools-plan/viewdetails.html

@ -1,24 +0,0 @@
<div style="position: relative;width: 1400px;height: 800px;line-height: 800px;" class="swiper-container">
<div style="position: absolute;right: -2px;top: -392px;cursor: pointer;z-index: 999;width: 24px;height: 24px;" (click)="closeDialog()">
<span><mat-icon>clear</mat-icon></span>
</div>
<div class="swiper-wrapper">
<div class="swiper-slide" style="text-align: center;" *ngFor="let img of imagesArr">
<img id="bigimg" (mousewheel)="zoomimg($event)" style="
max-width: 96%;
max-height: 100%;
min-width: 1px;
min-height: 1px;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;" [src]="img.PropertyValue" alt="">
</div>
</div>
<!-- 如果需要导航按钮 -->
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>

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

@ -27,7 +27,15 @@
<button (click)="pasteAsset()" class="copytobutn marginLeftRight" mat-button title="粘贴" *ngIf="isEditPattern">
粘贴<mat-icon>screen_share</mat-icon>
</button>
<span title="适应缩放" class="zoom" (click)="adaptZoom()">
<img src="/assets/images/适应缩放.png" alt="">
适应缩放
</span>
<span title="重置缩放" class="zoom" (click)="resetZoom()">
<img src="/assets/images/重置缩放.png" alt="">
重置缩放
</span>
<div class="bigBox">
<div class="weatherBox" [ngClass]="{'opened': weatherBtn,'close': !weatherBtn}">
<span class="name">天气</span>

9
src/app/ui/collection-tools/collection-tools.component.scss

@ -25,6 +25,15 @@
align-items:center;
min-height: 40px;
background-color: #fff;
.zoom{
display: flex;
align-items: center;
margin-left: 15px;
cursor: pointer;
img{
margin-right: 3px;
}
}
.marginLeftRight {
margin: 0 8px;
font-size: 16px;

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

@ -179,7 +179,14 @@ export class CollectionToolsComponent implements OnInit {
this.getDisposalNode()
}
}
//适应缩放
adaptZoom(){
this.canvas.zoomFit()
}
//重置缩放
resetZoom(){
this.canvas.resetCamera2D()
}
//ngzorro tree 拖拽
nzEvent(event: NzFormatEmitEvent): void {
if(this.isDrag){

12
src/app/ui/ui.module.ts

@ -80,14 +80,12 @@ import { CollectionToolsComponent, CreateBuilding, EditBuilding, ViewDetails } f
import { WorkingAreaComponent } from '../working-area/working-area.component';
import {leftFunctionalDomainComponent,editPlaneFigureComponent,addDisposalNodeComponent,editDisposalNodeComponent,addBGCDisposalNodeComponent} from './collection-tools/leftFunctionalDomain'
import { saveOneDialog, saveTwoDialog } from './collection-tools/save';
import { CollectionToolsPlanComponent, CreateBuildingPlan, EditBuildingPlan, ViewDetailsPlan } from './collection-tools-plan/collection-tools.component';
import { addDisposalNodeComponentPlan, editDisposalNodeComponentPlan, editPlaneFigureComponentPlan, leftFunctionalDomainComponentPlan } from './collection-tools-plan/leftFunctionalDomain';
import { saveOneDialogPlan, saveTwoDialogPlan } from './collection-tools-plan/save';
import {CollectionToolsBuildingComponent,CreateBuildingBuilding,EditBuildingBuilding,ViewDetailsBuilding} from './collection-tools-building/collection-tools.component'
import {leftFunctionalDomainBuildingComponent,editPlaneFigureBuildingComponent,addDisposalNodeBuildingComponent,editDisposalNodeBuildingComponent} from './collection-tools-building/leftFunctionalDomain'
import {saveOneDialogBuilding,saveTwoDialogBuilding} from './collection-tools-building/save'
import { CollectionToolsPlanComponent, CreateBuildingPlan, EditBuildingPlan } from './collection-tools-plan/collection-tools.component';
import { editPlaneFigureComponentPlan, leftFunctionalDomainComponentPlan } from './collection-tools-plan/leftFunctionalDomain';
import {CollectionToolsBuildingComponent,CreateBuildingBuilding,EditBuildingBuilding} from './collection-tools-building/collection-tools.component'
import {leftFunctionalDomainBuildingComponent,editPlaneFigureBuildingComponent} from './collection-tools-building/leftFunctionalDomain'
@NgModule({
declarations: [UiComponent, UserdataComponent, ChangepasswordComponent, OrganizationComponent, UnittypeComponent, AuthorityComponent, RoleComponent, UsermanagementComponent,IsnoPipe,ConfirmpswDirective,DialogOverviewExampleDialog,CreateAuthority,CreateRole,TimePipe,CreateNewUser,EditNewUser,allRoles,EditRole,CreateOrganization,EditOrganization,seeInformation,EditUser,editorialUnit,FireProtectionElementsComponent,Establish,EditingFireControl,FireFightingTemplateComponent, NavmenusComponent,CreateMenus,EditMenus,NewFireFighting,EditFireClassification, MaterialBankComponent, UnitInformationComponent,AddMatLibrary,EditMatLibrary,attributeComponent,AddOriginalCopy,addAttributeComponent,editAttribute,EditOriginalCopy,SelectOriginalCopy,EditUnitInfo,AddUnitInfo,AddGroups,EditGroup, EnterpriseuserComponent,AddEnterpriserUser,addUnitAttributeComponent,editUnitAttribute,seeenterpriseuser,editenterpriseuser, FireFightingFacilitiesFormworkComponent,addFireFightingFacilitiesFormworkComponent,editFireFightingFacilitiesFormworkComponent,addBuiltInComponent,addBuiltInAttributeComponent,addOptionalComponent,addOptionalAttributeComponent,editBuiltInAttributeComponent,editOptionalAttributeComponent, CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent,CollectionToolsPlanComponent,CreateBuildingPlan,EditBuildingPlan,ViewDetailsPlan,leftFunctionalDomainComponentPlan,editPlaneFigureComponentPlan,addDisposalNodeComponentPlan,editDisposalNodeComponentPlan,saveOneDialogPlan,saveTwoDialogPlan,addOffices,editOffices,addBGCDisposalNodeComponent,CollectionToolsBuildingComponent,CreateBuildingBuilding,EditBuildingBuilding,ViewDetailsBuilding,leftFunctionalDomainBuildingComponent,editPlaneFigureBuildingComponent,addDisposalNodeBuildingComponent,editDisposalNodeBuildingComponent,saveOneDialogBuilding,saveTwoDialogBuilding],
declarations: [UiComponent, UserdataComponent, ChangepasswordComponent, OrganizationComponent, UnittypeComponent, AuthorityComponent, RoleComponent, UsermanagementComponent,IsnoPipe,ConfirmpswDirective,DialogOverviewExampleDialog,CreateAuthority,CreateRole,TimePipe,CreateNewUser,EditNewUser,allRoles,EditRole,CreateOrganization,EditOrganization,seeInformation,EditUser,editorialUnit,FireProtectionElementsComponent,Establish,EditingFireControl,FireFightingTemplateComponent, NavmenusComponent,CreateMenus,EditMenus,NewFireFighting,EditFireClassification, MaterialBankComponent, UnitInformationComponent,AddMatLibrary,EditMatLibrary,attributeComponent,AddOriginalCopy,addAttributeComponent,editAttribute,EditOriginalCopy,SelectOriginalCopy,EditUnitInfo,AddUnitInfo,AddGroups,EditGroup, EnterpriseuserComponent,AddEnterpriserUser,addUnitAttributeComponent,editUnitAttribute,seeenterpriseuser,editenterpriseuser, FireFightingFacilitiesFormworkComponent,addFireFightingFacilitiesFormworkComponent,editFireFightingFacilitiesFormworkComponent,addBuiltInComponent,addBuiltInAttributeComponent,addOptionalComponent,addOptionalAttributeComponent,editBuiltInAttributeComponent,editOptionalAttributeComponent, CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent,CollectionToolsPlanComponent,CreateBuildingPlan,EditBuildingPlan,leftFunctionalDomainComponentPlan,editPlaneFigureComponentPlan,addOffices,editOffices,addBGCDisposalNodeComponent,CollectionToolsBuildingComponent,CreateBuildingBuilding,EditBuildingBuilding,leftFunctionalDomainBuildingComponent,editPlaneFigureBuildingComponent],
imports: [
CommonModule,

2
src/app/working-area/working-area.component.ts

@ -458,7 +458,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
/**
*
*/
private resetCamera2D() {
public resetCamera2D() {
this.camera2D.scale.set(1);
this.camera2D.x = (this.app.view.width - this.backgroundImage.width) / 2;
this.camera2D.y = (this.app.view.height - this.backgroundImage.height) / 2;

BIN
src/assets/images/适应缩放.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 268 B

BIN
src/assets/images/重置缩放.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 506 B

Loading…
Cancel
Save