From 4beee25224a7c90d58291192b6be740f3022e29c Mon Sep 17 00:00:00 2001 From: chenjingyu Date: Sun, 27 Sep 2020 19:20:03 +0800 Subject: [PATCH] =?UTF-8?q?[=E5=8A=9F=E8=83=BD=E5=88=86=E5=8C=BA]=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2=E6=8B=B7=E8=B4=9D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 61 +++-- package.json | 6 +- .../function-division-look/addPartition.html | 23 ++ .../addPartitionAttribute.html | 0 .../function-division.component.html | 106 ++++++++ .../function-division.component.scss | 32 +++ .../function-division.component.ts | 248 ++++++++++++++++++ src/app/ui/ui-routing.module.ts | 11 + src/app/ui/ui.module.ts | 4 +- 9 files changed, 467 insertions(+), 24 deletions(-) create mode 100644 src/app/ui/function-division-look/addPartition.html create mode 100644 src/app/ui/function-division-look/addPartitionAttribute.html create mode 100644 src/app/ui/function-division-look/function-division.component.html create mode 100644 src/app/ui/function-division-look/function-division.component.scss create mode 100644 src/app/ui/function-division-look/function-division.component.ts diff --git a/package-lock.json b/package-lock.json index a2bec11..30ebda3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -236,14 +236,14 @@ } }, "@angular/animations": { - "version": "9.0.0", - "resolved": "https://registry.npm.taobao.org/@angular/animations/download/@angular/animations-9.0.0.tgz", - "integrity": "sha1-jSuFLFJzvMFh0T+C+q81ZqtWKVE=" + "version": "9.1.12", + "resolved": "https://registry.npm.taobao.org/@angular/animations/download/@angular/animations-9.1.12.tgz", + "integrity": "sha1-HJwaeSvktSsZbKseXIi9MZtgcW0=" }, "@angular/cdk": { - "version": "9.0.0", - "resolved": "https://registry.npm.taobao.org/@angular/cdk/download/@angular/cdk-9.0.0.tgz", - "integrity": "sha1-VzSBeulwRPkNME+g8lycGn+gv5Y=", + "version": "9.2.4", + "resolved": "https://registry.npm.taobao.org/@angular/cdk/download/@angular/cdk-9.2.4.tgz", + "integrity": "sha1-hBOVi9J15MNL47lvVkRGcd0wupM=", "requires": { "parse5": "^5.0.0" }, @@ -444,9 +444,9 @@ "dev": true }, "@angular/material": { - "version": "9.0.0", - "resolved": "https://registry.npm.taobao.org/@angular/material/download/@angular/material-9.0.0.tgz", - "integrity": "sha1-ZVv9TUBHM36ESAufkr6Oga83W5I=" + "version": "9.2.4", + "resolved": "https://registry.npm.taobao.org/@angular/material/download/@angular/material-9.2.4.tgz", + "integrity": "sha1-JmbvYG+7iNYPji8YxeT5Sj3Vctg=" }, "@angular/platform-browser": { "version": "9.0.0", @@ -16640,7 +16640,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -16683,7 +16684,8 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "concat-map": { "version": "0.0.1", @@ -16694,7 +16696,8 @@ "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -16811,7 +16814,8 @@ "inherits": { "version": "2.0.4", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -16823,6 +16827,7 @@ "version": "1.0.0", "bundled": true, "dev": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -16852,6 +16857,7 @@ "version": "2.9.0", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -16870,6 +16876,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -16972,6 +16979,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -17057,7 +17065,8 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -17093,6 +17102,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -17112,6 +17122,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -17155,12 +17166,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, @@ -17598,7 +17611,8 @@ "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -17758,6 +17772,7 @@ "version": "2.9.0", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -17776,6 +17791,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -17878,6 +17894,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -17963,7 +17980,8 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -17999,6 +18017,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -18062,12 +18081,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, diff --git a/package.json b/package.json index 6c9be3c..3fce73c 100644 --- a/package.json +++ b/package.json @@ -11,14 +11,14 @@ }, "private": true, "dependencies": { - "@angular/animations": "^9.0.0", - "@angular/cdk": "^9.0.0", + "@angular/animations": "^9.1.12", + "@angular/cdk": "^9.2.4", "@angular/common": "~9.0.0", "@angular/compiler": "~9.0.0", "@angular/core": "~9.0.0", "@angular/fire": "^5.3.0", "@angular/forms": "~9.0.0", - "@angular/material": "^9.0.0", + "@angular/material": "^9.2.4", "@angular/platform-browser": "~9.0.0", "@angular/platform-browser-dynamic": "~9.0.0", "@angular/router": "~9.0.0", diff --git a/src/app/ui/function-division-look/addPartition.html b/src/app/ui/function-division-look/addPartition.html new file mode 100644 index 0000000..80b063c --- /dev/null +++ b/src/app/ui/function-division-look/addPartition.html @@ -0,0 +1,23 @@ +
创建建筑功能分区
+
+
+ + + + + {{item.name}} + + + +

暂无数据,请您创建基本信息建筑模块

+ +
+ + +
+ +
+
\ No newline at end of file diff --git a/src/app/ui/function-division-look/addPartitionAttribute.html b/src/app/ui/function-division-look/addPartitionAttribute.html new file mode 100644 index 0000000..e69de29 diff --git a/src/app/ui/function-division-look/function-division.component.html b/src/app/ui/function-division-look/function-division.component.html new file mode 100644 index 0000000..21de153 --- /dev/null +++ b/src/app/ui/function-division-look/function-division.component.html @@ -0,0 +1,106 @@ +
+
+ +
+ + + + +
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + 区域 + + + + 面积 + + + + + 基本情况 + +
+

暂无数据

+
+ + + +
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + 区域 + + + + 面积 + + + + + 基本情况 + +
+
+ + + +
\ No newline at end of file diff --git a/src/app/ui/function-division-look/function-division.component.scss b/src/app/ui/function-division-look/function-division.component.scss new file mode 100644 index 0000000..e74bcf1 --- /dev/null +++ b/src/app/ui/function-division-look/function-division.component.scss @@ -0,0 +1,32 @@ +.content { + width: 100%; + height: 90%; + overflow-y: auto; + padding: 10px 0 0 10px; + display: flex; +} +.tableContent { + margin-left: 10px; + width: 100%; + height: 100%; + table { + width: 90%; + text-align: center; + margin: 0 auto; + .cdk-header-cell { + text-align: center; + } + textarea { + border-radius: 5px; + padding: 5px; + width: 80%; + height: 36px; + resize: none; + } + } +} + +//icon统一样式 +.mat-icon { + cursor:pointer; +} \ No newline at end of file diff --git a/src/app/ui/function-division-look/function-division.component.ts b/src/app/ui/function-division-look/function-division.component.ts new file mode 100644 index 0000000..808d6d9 --- /dev/null +++ b/src/app/ui/function-division-look/function-division.component.ts @@ -0,0 +1,248 @@ +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 { Router,ActivatedRoute } from '@angular/router'; + + + +@Component({ + selector: 'app-function-division-look', + templateUrl: './function-division.component.html', + styleUrls: ['./function-division.component.scss'] +}) +export class FunctionDivisionLookComponent implements OnInit { + + constructor(private router:Router,private route:ActivatedRoute,private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { } + + ngOnInit(): void { + this.companyId = this.route.snapshot.queryParams.id + this.getAllCompany() + this.getAllBuilding() + } + + displayedColumns: string[] = ['checked', 'region', 'measure', 'situation']; + + companyId:any; //单位编号 + companyFunctionalZoning:any=[]; //所有单位功能分区属性 + selectFunctionalZoning:any=[]; //选中的单位功能分区属性 + + //获得所有单位功能分区属性 + getAllCompany () { + let companyId = this.route.snapshot.queryParams.id + this.http.get('/api/CompanyFunctionalDivisions',{params:{ + companyId:companyId + }}).subscribe((data:any)=>{ + this.companyFunctionalZoning = data + this.selectFunctionalZoning = [] + }) + } + + //新建单位功能分区属性 + addCompany () { + let companyId = this.route.snapshot.queryParams.id + let data = {companyId:companyId, region:'', area:0, details:''} + this.companyFunctionalZoning.push(data) + this.preservation() + } + + //保存单位功能分区属性 + preservation () { + let companyId = this.route.snapshot.queryParams.id + // console.log(123,companyId) + if (this.companyFunctionalZoning.length) { + this.http.post('/api/CompanyFunctionalDivisions/Batch',this.companyFunctionalZoning,{params:{ + companyId:companyId + }}).subscribe(data=>{ + this.getAllCompany() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据更新成功','确定',config); + }) + } + } + + //单位功能分区checked选择 + changeCompany (ele,e) { + if (e.checked) { + this.selectFunctionalZoning.push(ele.id) + } else { + this.selectFunctionalZoning.splice(this.selectFunctionalZoning.findIndex(item => item === ele.id), 1) + } + } + + //删除单位功能分区属性 + delete () { + let companyId = this.route.snapshot.queryParams.id + if (this.selectFunctionalZoning.length) { + let isDelete = confirm('您确定要删除吗') + if (isDelete) { + this.http.post('/api/CompanyFunctionalDivisions/Batch',this.companyFunctionalZoning,{params:{ + companyId:companyId + }}).subscribe(data=>{ + const options = { + headers: new HttpHeaders({'Content-Type': 'application/json',}), + body:this.selectFunctionalZoning} + this.http.delete(`/api/CompanyFunctionalDivisions/Batch`,options).subscribe(data=>{ + this.getAllCompany() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据更新成功','确定',config); + }) + }) + } + } else if (!this.selectFunctionalZoning.length) { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择单位功能分区','确定',config); + } + } + + + + + + //建筑功能分区↓ + allBuilding:any = []; //所有建筑 + allBuildingFunctionalZoning:any = []; //所有建筑的功能分区 + selectBuildingFunctionalZoning:any = []; //选中的建筑的功能分区 + + //获得所有建筑 + getAllBuilding () { + let companyId = this.route.snapshot.queryParams.id + this.http.get(`/api/Buildings`,{params:{ + companyId:companyId + }}).subscribe((data:any)=>{ + if (data.length) { + this.allBuilding = data + this.allBuilding.forEach(element => { //为每个建筑添加一个 功能分区对象 + element.functionalZoning = null + }); + this.getAllBuildingFunctionalZoning() + } + }) + } + + //获得所有建筑的功能分区 + getAllBuildingFunctionalZoning () { + this.selectBuildingFunctionalZoning = [] + this.allBuildingFunctionalZoning = [] + this.allBuilding.forEach(element => { + let data={buildingId: element.id} + this.http.get(`/api/BuildingFunctionalDivisions`,{params:data}).subscribe((data:any)=>{ + if (data.length) { + element.functionalZoning = data + this.selectBuildingFunctionalZoning.push([]) //拥有建筑功能分区的提前push空数组 + this.allBuildingFunctionalZoning.push(element) } + }) + }); + } + + //封装函数刷新当前建筑功能分区 + updateCurrent (e,index) { + let data= {buildingId: e.id} + this.http.get(`/api/BuildingFunctionalDivisions`,{params:data}).subscribe((data:any)=>{ + this.selectBuildingFunctionalZoning[index] = [] + this.allBuildingFunctionalZoning[index].functionalZoning = data + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据更新成功','确定',config); + }) + } + + //创建建筑功能分区 + addPartition () { + } + + //创建建筑功能分区属性 + addBuilding (e,index) { + let data = {buildingId:e.id, region:'', area:0, details:''} + this.http.post('/api/BuildingFunctionalDivisions',data).subscribe(data=>{ + this.preservationBuilding(e,index) + }) + } + + //保存建筑功能分区属性 + preservationBuilding (e,index) { + let data ={buildingId:e.id} + this.http.post(`/api/BuildingFunctionalDivisions/Batch`,this.allBuildingFunctionalZoning[index].functionalZoning,{params:data}).subscribe(data=>{ + this.updateCurrent(e,index) + }) + } + + //建筑功能分区checked选择 + changeBuilding (ele,e,index) { + if (e.checked) { + this.selectBuildingFunctionalZoning[index].push(ele.id) + } else { + this.selectBuildingFunctionalZoning[index].splice(this.selectBuildingFunctionalZoning[index].findIndex(item => item === ele.id), 1) + } + } + + //删除建筑功能分区 + deleteBuilding (e,index) { + if (this.selectBuildingFunctionalZoning[index].length) { + let isDelete = confirm('您确定要删除吗') + if (isDelete) { + let data ={buildingId:e.id} + this.http.post(`/api/BuildingFunctionalDivisions/Batch`,this.allBuildingFunctionalZoning[index].functionalZoning,{params:data}).subscribe(data=>{ + const options = { + headers: new HttpHeaders({'Content-Type': 'application/json',}), + body:this.selectBuildingFunctionalZoning[index], + params:{buildingId:e.id}} + this.http.delete(`/api/BuildingFunctionalDivisions/Batch`,options).subscribe(data=>{ + this.selectBuildingFunctionalZoning[index].forEach((element,newIndex) => { + this.allBuildingFunctionalZoning[index].functionalZoning.splice(this.allBuildingFunctionalZoning[index].functionalZoning.findIndex(item=>item.id==element),1) + if (newIndex==this.selectBuildingFunctionalZoning[index].length-1) { + if (this.allBuildingFunctionalZoning[index].functionalZoning.length) { + this.updateCurrent(e,index) + } else { + this.selectBuildingFunctionalZoning.splice(index,1) + this.allBuildingFunctionalZoning.splice(index,1)} + } + }); + + + }) + }) + } + } else if (!this.selectBuildingFunctionalZoning[index].length) { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择建筑功能分区','确定',config); + } + } + + + + + +} + + + + + +//暂时无用 +@Component({ + selector: 'app-addPartitionAttribute', + templateUrl: './addPartitionAttribute.html', + styleUrls: ['./function-division.component.scss'] +}) +export class addPartitionAttribute2 { + + constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data) { } + + ngOnInit(): void { + + } + + + +} diff --git a/src/app/ui/ui-routing.module.ts b/src/app/ui/ui-routing.module.ts index 9dadb2e..df90d9d 100644 --- a/src/app/ui/ui-routing.module.ts +++ b/src/app/ui/ui-routing.module.ts @@ -1,3 +1,11 @@ +/* + * @Descripttion: + * @version: + * @Author: sueRimn + * @Date: 2020-09-27 18:06:29 + * @LastEditors: sueRimn + * @LastEditTime: 2020-09-27 18:27:40 + */ import { Routes, RouterModule } from '@angular/router'; import { NgModule } from '@angular/core'; import { CollectionToolsComponent } from './collection-tools/collection-tools.component'; @@ -8,6 +16,8 @@ import { PlanAssistanceComponent } from './plan-assistance/plan-assistance.compo import { RealCasesComponent } from './real-cases/real-cases.component'; import { SimilarPlansComponent } from './similar-plans/similar-plans.component'; import { DataPushComponent } from './data-push/data-push.component'; +import { FunctionDivisionLookComponent } from './function-division-look/function-division.component' + @@ -15,6 +25,7 @@ const routes: Routes = [ { path: 'plan', component:DataPushComponent, //子级路由 children:[ { path: 'planarGraph', component:planComponent}, + {path:'FunctionDivisionLookComponent', component:FunctionDivisionLookComponent} ]}, { path: 'collectionTools', component:CollectionToolsComponent}, { path: 'dangerous', component:DangerousComponent}, diff --git a/src/app/ui/ui.module.ts b/src/app/ui/ui.module.ts index 20f6ea7..dc26871 100644 --- a/src/app/ui/ui.module.ts +++ b/src/app/ui/ui.module.ts @@ -64,9 +64,11 @@ import { RealCasesComponent } from './real-cases/real-cases.component'; import { PlanAssistanceComponent } from './plan-assistance/plan-assistance.component'; import { CountdownModule } from 'ngx-countdown'; import { DataPushComponent } from './data-push/data-push.component'; +import { FunctionDivisionLookComponent} from './function-division-look/function-division.component' +import { from } from 'rxjs'; @NgModule({ - declarations: [SafeHtmlPipe,GisComponent,UiComponent,PersonaldataComponent, ChangepasswordComponent,IsnoPipe,ConfirmpswDirective,TimePipe, CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent, DisposalNodeComponent, DangerousComponent, SimilarPlansComponent, RealCasesComponent, PlanAssistanceComponent,planComponent, DataPushComponent], + declarations: [SafeHtmlPipe,GisComponent,UiComponent,PersonaldataComponent, ChangepasswordComponent,IsnoPipe,ConfirmpswDirective,TimePipe, CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent, DisposalNodeComponent, DangerousComponent, SimilarPlansComponent, RealCasesComponent, PlanAssistanceComponent,planComponent, DataPushComponent,FunctionDivisionLookComponent], imports: [ CommonModule,