diff --git a/src/app/plan-audit/allaround/allaround.component.html b/src/app/plan-audit/allaround/allaround.component.html new file mode 100644 index 0000000..c3ae6b3 --- /dev/null +++ b/src/app/plan-audit/allaround/allaround.component.html @@ -0,0 +1,177 @@ + +
+ + +
+ + + + + 单位毗邻 + + + +
+
+
+ +
+
+
+ 建筑名称：{{item.name}} +
+
+ 建筑方向： + + 东 + 西 + 南 + 北 + 东南 + 西南 + 东北 + 西北 + +
+
+ 图片数量： + {{item.imageUrls.length}}张 + 0张 +
+
+
+
+ + + + + +
+
+ + + + + {{item.name}} + + +
+
+
+ +
+
+
+ 建筑名称：{{items.name}} +
+
+ 建筑方向： + + 东 + 西 + 南 + 北 + 东南 + 西南 + 东北 + 西北 + +
+
+ 图片数量： + {{items.imageUrls.length}}张 + 0张 +
+
+
+
+ + + + + +
+ +
\ No newline at end of file diff --git a/src/app/plan-audit/allaround/allaround.component.scss b/src/app/plan-audit/allaround/allaround.component.scss new file mode 100644 index 0000000..87171e1 --- /dev/null +++ b/src/app/plan-audit/allaround/allaround.component.scss @@ -0,0 +1,116 @@ +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} +.content { + width: 100%; + height: 760px; + //padding: 10px; + overflow-y: auto; +} +.tableContent{ + width: 100%; + height: 760px; + .panelhead{ + //position: relative; + height: 44px; + background-color: #F2F9FF; + } + .columall{ + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + .colum{ + width: 300px; + margin-top: 1%; + display: flex; + flex-direction: row; + .left{ + width: 140px; + margin-left: 5%; + img{ + width: 140px; + height: 100px; + //margin-left: 13%; + cursor:pointer; + } + } + .right{ + margin-left: 5%; + width:150px; + margin-top: 1%; + display: flex; + flex-direction: column; + .rightone{ + width: 150px; + } + .righttwo{ + width: 150px; + margin-top: 3%; + } + .righthree{ + width: 150px; + margin-top: 3%; + } + } + } + } + +} + +//图片外部div +.allImgs { + display: flex; + overflow-y: auto; + flex-direction: row; + flex-wrap: wrap; + .imgBox{ + width: 300px; + height: 250px; + margin: 25px 35px 35px 35px; + display: inline-block; + position: relative; + .fixedImg { + width: 100%; + height: 170px; + text-align: center; + margin-bottom: 3px; + img { + width: auto; + height: auto; + max-width: 100%; + height: 100%; + cursor:pointer;} + } + } +} + +//预览图片 +.previewImgBox { + width: 1500px; + height: 700px; + text-align: center; + img{ + width: auto; + height: auto; + max-width: 100%; + height: 100%;} +} +.previewImgBottom { + text-align: center; + height: 30px; + margin: 20px auto; +} +//预览图片旋转角度 +.rotateA {transform: rotate(90deg) scale(0.75);} +.rotateB {transform: rotate(180deg)} +.rotateC {transform: rotate(270deg) scale(0.75);} \ No newline at end of file diff --git a/src/app/plan-audit/allaround/allaround.component.spec.ts b/src/app/plan-audit/allaround/allaround.component.spec.ts new file mode 100644 index 0000000..7849804 --- /dev/null +++ b/src/app/plan-audit/allaround/allaround.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AllaroundComponent } from './allaround.component'; + +describe('AllaroundComponent', () => { + let component: AllaroundComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ AllaroundComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(AllaroundComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/plan-audit/allaround/allaround.component.ts b/src/app/plan-audit/allaround/allaround.component.ts new file mode 100644 index 0000000..65160a8 --- /dev/null +++ b/src/app/plan-audit/allaround/allaround.component.ts @@ -0,0 +1,91 @@ +/* + * @Descripttion: + * @version: + * @Author: sueRimn + * @Date: 2020-11-26 17:10:54 + * @LastEditors: sueRimn + * @LastEditTime: 2021-02-03 15:29:11 + */ +import { Component, OnInit, Inject } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog'; +import { ImgDetails } from './imgdetails.component' +import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; +import { Router, ActivatedRoute } from '@angular/router'; + + + +@Component({ + selector: 'app-allaround', + templateUrl: './allaround.component.html', + styleUrls: ['./allaround.component.scss'] +}) +export class AllaroundComponent implements OnInit { + + constructor(private http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,private route:ActivatedRoute,) { } + + ngOnInit(): void { + this.getAllCompany() + this.getAllBuilding() + } + + AllAdjoining:any = []; //所有单位毗邻 + AllBuilding:any = []; //所有建筑 + 建筑毗邻图片 + //单位相关数据 + unitId:string = '5e9964caa760a059e84512e9' + //5ee19fe06f91049f5e23e937 + //5fb78554919f2b44e464017e + //获取所有单位毗邻图片 + getAllCompany () { + let id = {companyId:this.unitId} + this.http.get('/api/CompanyAdjoins',{params:id}).subscribe(data=>{ + this.AllAdjoining = data + this.AllAdjoining.forEach(element => {element.imgURL = element.imageUrls[0] +'?x-oss-process=image/resize,m_fill,h_170,w_299'}) + }) + } + + //获取所有建筑 + getAllBuilding () { + let id = {companyId:this.unitId} + this.http.get('/api/Buildings',{params:id}).subscribe((data:any)=>{ + if (data.length) { + this.AllBuilding = data + this.AllBuilding.forEach(element => { + element.allImgs = [] + }); + this.getAllArchitecture()} + }) + } + + //获取所有建筑毗邻图片 + getAllArchitecture () { + this.AllBuilding.forEach(element => { + let id = {buildingId:element.id} + this.http.get('/api/BuildingAdjoins',{params:id}).subscribe(data=>{ + element.allImgs = data + /* console.log(element) + console.log(element.allImgs) */ + element.allImgs.forEach(element => {element.imgURL = element.imageUrls[0] +'?x-oss-process=image/resize,m_fill,h_170,w_299'}); + }) + }); + } + + //预览图片 + imgdetails(e){ + if (e.length && e!=null) { + let data = e + const dialogRef = this.dialog.open(ImgDetails, {//调用open方法打开对话框并且携带参数过去 + width: '1600px', + height:'900px',data}); + dialogRef.afterClosed().subscribe(); + } else{ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); + } + } + + + +} diff --git a/src/app/plan-audit/allaround/imgdetails.component.html b/src/app/plan-audit/allaround/imgdetails.component.html new file mode 100644 index 0000000..b341979 --- /dev/null +++ b/src/app/plan-audit/allaround/imgdetails.component.html @@ -0,0 +1,18 @@ +
图片详情
+
+
+
+ +
+
+
+ + +
+
+
+ +
+ +
\ No newline at end of file diff --git a/src/app/plan-audit/allaround/imgdetails.component.ts b/src/app/plan-audit/allaround/imgdetails.component.ts new file mode 100644 index 0000000..0bc8d65 --- /dev/null +++ b/src/app/plan-audit/allaround/imgdetails.component.ts @@ -0,0 +1,54 @@ +import { Component, OnInit, Inject, ɵConsole } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog'; +import { MatSnackBar } from '@angular/material/snack-bar'; +import Swiper from 'swiper'; + + + +@Component({ + selector: 'imgdetails', + templateUrl: './imgdetails.component.html', + styleUrls: ['./allaround.component.scss'] + }) + export class ImgDetails { + + constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data) { } + testSwiper: Swiper; + + ngOnInit(): void { + this.allImages = [] + this.data.forEach(element => { + element = `${element}?x-oss-process=image/auto-orient,1` + this.allImages.push(element) + }); + } + + ngAfterViewInit() { + this.testSwiper = new Swiper('.swiper-container', { + lazy: true, + direction: 'horizontal', + loop: false, + + // 如果需要前进后退按钮 + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + } + }); + } + + allImages:any; //展示所有的图片 + rotationAngle:number=0; //旋转角度 + + //旋转图片 + rotate () { + this.rotationAngle = this.rotationAngle+90 + if (this.rotationAngle === 360) {this.rotationAngle = 0} + } + + + +} + \ No newline at end of file diff --git a/src/app/plan-audit/basic-info/basic-info.component.html b/src/app/plan-audit/basic-info/basic-info.component.html index 55932d6..571ffae 100644 --- a/src/app/plan-audit/basic-info/basic-info.component.html +++ b/src/app/plan-audit/basic-info/basic-info.component.html @@ -4,87 +4,88 @@ * @Author: sueRimn * @Date: 2020-12-25 15:29:42 * @LastEditors: sueRimn - * @LastEditTime: 2020-12-27 14:10:41 + * @LastEditTime: 2021-02-03 09:10:26 --> -
- -
- - - - - 单位信息 - - -
-
-
- * - 统一社会信用代码： - - - -
-
- * - 单位类型： - - - 石油化工类 - - -
-
- * - 联系人： - - - -
-
- * - 联系电话： - - - +
+
+

单位照片

+
+ +
+
+
+

单位信息

+ + + + + + + + + + + + + + + + + + + + + + + + + +
统一社会信用代码{{unitInfo.usci}}
单位类型{{unitInfo.buildingTypes ? unitInfo.buildingTypes[0].name : ''}}
联系人{{unitInfo.contacts}}
联系电话{{unitInfo.phone}}
辖区中队{{unitInfo.organizationName}}
单位地址{{unitInfo.address}}
+
+
+

建筑信息

+ + + + + {{item.name}} + + + +
+
+

{{key+1 + '.' +n.name}}

+ +
+ + + + + +
{{p.propertyName}}({{p.physicalUnit}}){{p.propertyValue}}
-
- * - 辖区中队： - - - + +
+ + + + + +
{{p.propertyName}}({{p.physicalUnit}}){{o.propertyValue}}
- -
- * - 单位地址： - - - -
-
- 单位照片： -
- -
- -
+ +
+

{{i.buildingBasicGroups.length + 1}}.自定义信息

+
+ + + + + +
{{c.name}}{{c.value}}
-
- - - - +
+ +
-
diff --git a/src/app/plan-audit/basic-info/basic-info.component.scss b/src/app/plan-audit/basic-info/basic-info.component.scss index cfab8c8..c44b0de 100644 --- a/src/app/plan-audit/basic-info/basic-info.component.scss +++ b/src/app/plan-audit/basic-info/basic-info.component.scss @@ -1,106 +1,97 @@ -.content{ + +table,table tr th, table tr td { border: 1px solid #EEF1F5; } +table { text-align: center; border-collapse: collapse; padding:2px;} +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} + +.box{ width: 100%; - height: 100%; - .tableContent{ - width: 100%; - } + height: 760px; + overflow-y: auto; + // font-family: Source Han Sans CN; + color: #333333; + padding: 10px; + box-sizing: border-box; + font-size: 14px; + font-weight: 400; } -.mainbox{ - height: 100%; - position: relative; - .mainleft{ - width:800px; - height: 100%; - // background-color: yellow; - float: left; - .inputbox{ - width: 343px; - height: 58px; - margin:2px 6px; - float: left; - text-align: end; +//头部单位照片 +.unitPhotographBox{ + width: 100%; + p{ + height: 14px; + font-size: 14px; + // font-family: Source Han Sans CN; + font-weight: 400; + line-height: 14px; + color: #333333; + opacity: 1; + margin: 10px 0 ; + } + .imgbox{ + width: 180px; + height: 140px; + img{ + width: 100%; + height: 100%; + cursor: pointer; } - .organizationbox{ - width:538px; - height: 200px; - background: white; - position: absolute; - top: 164px; - left:166px; - z-index: 100; - border: 1px solid grey; - overflow: auto; - li{ - list-style: none; - - } - mat-tree-node{ - cursor: pointer; - } - mat-tree-node:hover{ - background: rgba(225, 225, 225, 0.8); + } +} +//单位信息 +.unitInfoBox{ + width: 100%; + p{ + height: 14px; + font-size: 14px; + // font-family: Source Han Sans CN; + font-weight: 400; + line-height: 14px; + color: #333333; + opacity: 1; + margin: 10px 0; + } + table{ + width: 100%; + tr{ + height: 35px; + td:nth-child(1){ + width: 40%; } } - .addbtn{ - width: 695px; - position: absolute; - bottom: -495px; - text-align: center; - margin-bottom:20px; - button{ - margin: 0 4px; - } + tr:nth-child(odd){ + background: #F2F9FF; } - .uploadimg{ - width: 400px; - height: 200px; - float: left; - margin-top:12px; - position: relative; - margin-left: 80px; - cursor: pointer; - span{ - float: left; - } - // img{ - // float: left; - // } - .uploadingimg{ - width: 299px; - height: 170px; - // background: url('../../../assets/images/upload2.png') no-repeat center center; - - position: absolute; - top: 0px; - left: 79px; - border: 1px dashed gray; - border-radius:3px; + } +} +//建筑信息 +.buildingsBox{ + p{ + margin: 10px 0; + } + table{ + width: 100%; + tr{ + height: 35px; + td:nth-child(1){ + width: 40%; } - } - .image{ - // position: absolute; - // top: 199px; - // left: 160px; - // width: 299px; - // height: 170px; - input{ - // width: 299px; - // height: 170px; - width: 190px; - margin-top: 160px; - cursor: pointer; - } - // opacity:0; - + tr:nth-child(odd){ + background: #F2F9FF; } } - .mainright{ - float: left; - width: 600px; - height: 400px; - // position: absolute; - // right: 170px; - - } -} \ No newline at end of file +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} diff --git a/src/app/plan-audit/basic-info/basic-info.component.ts b/src/app/plan-audit/basic-info/basic-info.component.ts index e24cc22..485ad67 100644 --- a/src/app/plan-audit/basic-info/basic-info.component.ts +++ b/src/app/plan-audit/basic-info/basic-info.component.ts @@ -1,4 +1,25 @@ +import { HttpClient } from '@angular/common/http'; import { Component, OnInit } from '@angular/core'; +import Viewer from 'viewerjs'; +class unitInfo { + id: string; + name: string; //单位信息名字 + usci: string; //单位信用代码 + contacts: string; //联系人 + phone: string; //联系电话 + address: string; //单位地址 + imageUrl: string; //图片地址 + location: string; //单位地理位置 + modifiedTime: string; //信息修改时间 + organizationId: string; //所属组织机构 + organizationName: string; //组织机构名称 + buildingTypes: [ + { + id:string; + name:string; + } + ] +} @Component({ selector: 'app-basic-info', @@ -7,9 +28,142 @@ import { Component, OnInit } from '@angular/core'; }) export class BasicInfoComponent implements OnInit { - constructor() { } + constructor(private http: HttpClient) { } + unitId:string;//单位相关数据 + + unitInfo:unitInfo = { + id: '', + name: '', //单位信息名字 + usci: '', //单位信用代码 + contacts: '', //联系人 + phone: '', //联系电话 + address: '', //单位地址 + imageUrl: '', //图片地址 + location: '', //单位地理位置 + modifiedTime: '', //信息修改时间 + organizationId: '', //所属组织机构 + organizationName: '', //组织机构名称 + buildingTypes: [ + { + id:'', + name:'' + } + ] + } + noImg:string = '../../../assets/images/noImg.png' + gallery:any //Viewer实例 ngOnInit(): void { + this.everyInin() + } + //每次初始化 加载 组件调用方法 + everyInin () { + //this.unitId = sessionStorage.getItem('unitId') + this.unitId='5e9964caa760a059e84512e9' + if (this.unitId) { + this.getUnitInfo().then(()=>{ + setTimeout(() => { + this.gallery = new Viewer(document.getElementById('viewerjs'),{ url: 'data-original' }); + },0); + }); + this.getAllBuildingsInfo() + } + } + + //获得单位信息 + async getUnitInfo(){ + let result = await new Promise((resolve, reject) => { + this.http.get(`/api/Companies/${this.unitId}`).subscribe((data:any)=>{ + resolve('获取单位信息成功') + this.unitInfo = data + }) + }) + } + + buildingsData:any + //获得所有建筑信息 + getAllBuildingsInfo(){ + this.http.get("/api/Buildings",{ + params:{ + companyId:this.unitId + } + }).subscribe(async (data:any)=>{ + this.buildingsData = data + for (let i = 0, length = data.length; i < length; i++){ + const result = await new Promise((resolve) =>{ + this.http.get("/api/BuildingBasicInfos",{ // 循环请求当前单位建筑每一个建筑的信息保存到数组中 + params:{ + companyId :this.unitId, + buildingId:data[i].id, + buildingType:data[i].buildingTypes[0].id + } + }).subscribe((buildingsData:any)=>{ + //获得当前建筑自定义信息并且添加到item自定义属性上 + let _data = buildingsData + _data[0].buildingCustomData = {} + _data[0].buildingCustomData.customProperties = [] + this.http.get("/api/BuildingCustomData",{params:{ + buildingId:data[i].id + }}).subscribe((data:any)=>{ + _data[0].buildingCustomData = data + if(data && data.customProperties.length != 0){ + _data[0].isCustomData = true + }else{ + _data[0].isCustomData = false + _data[0].buildingCustomData ={ + id: "", + customProperties: [ + { + name: "", + value: "" + } + ], + buildingId: _data[0].buildingId + } + } + }) + + //如果是表格类需要处理数据 + // console.log(i,buildingsData) + buildingsData[0].buildingBasicGroups.forEach(element => { + if(element.type == 1){ + + var map = {}, + dest:any = []; + for(var i = 0; i < element.propertyInfos.length; i++){ + var ai = element.propertyInfos[i]; + if(!map[ai.propertyName]){ + dest.push({ + propertyName: ai.propertyName, + data: [ai] + }); + map[ai.propertyName] = ai; + }else{ + for(var j = 0; j < dest.length; j++){ + var dj = dest[j]; + if(dj.propertyName == ai.propertyName){ + dj.data.push(ai); + break; + } + } + } + } + //根据行数确定在循环数组中的index + dest.forEach(item => { + item.data.sort(function(a,b){ + return Number(a.tag) - Number(b.tag) + }) + }) + + element.tabledata = dest + } + }); + this.buildingsData[i].details = buildingsData + resolve(i) + }) + }) + } + }) } } diff --git a/src/app/plan-audit/cad-draw/cad-draw.component.html b/src/app/plan-audit/cad-draw/cad-draw.component.html new file mode 100644 index 0000000..bf42630 --- /dev/null +++ b/src/app/plan-audit/cad-draw/cad-draw.component.html @@ -0,0 +1,25 @@ + +
+
+
+
+ {{item.name}} +
+
+ + 下载 +
+
+
+ 日期:{{item.creationTime|date:'yyyy-MM-dd'}} + 大小：{{item.fileLength}}M +
+
+
diff --git a/src/app/plan-audit/cad-draw/cad-draw.component.scss b/src/app/plan-audit/cad-draw/cad-draw.component.scss new file mode 100644 index 0000000..e86625f --- /dev/null +++ b/src/app/plan-audit/cad-draw/cad-draw.component.scss @@ -0,0 +1,51 @@ +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} +.content{ + width: 100%; + height: 100%; + overflow-y: auto; + overflow-x: hidden; + display: flex; + flex-direction: column; + font-size: 14px; + .center{ + width: 100%; + border: 1px solid #EEF1F5; + display: flex; + flex-direction: column; + .up{ + width: 100%; + display: flex; + margin-top: 2%; + span{ + color: #0080FF; + font-size: 15px; + } + .left{ + width: 70%; + span{ + margin-left: 7.5%; + margin-top: 5%; + } + } + .right{ + width: 30%; + text-align: center; + cursor: pointer; + } + } + .down{ + margin: 2% 0 3% 5%; + } + } +} \ No newline at end of file diff --git a/src/app/plan-audit/cad-draw/cad-draw.component.spec.ts b/src/app/plan-audit/cad-draw/cad-draw.component.spec.ts new file mode 100644 index 0000000..028f9f2 --- /dev/null +++ b/src/app/plan-audit/cad-draw/cad-draw.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CadDrawComponent } from './cad-draw.component'; + +describe('CadDrawComponent', () => { + let component: CadDrawComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CadDrawComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CadDrawComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/plan-audit/cad-draw/cad-draw.component.ts b/src/app/plan-audit/cad-draw/cad-draw.component.ts new file mode 100644 index 0000000..288f7b1 --- /dev/null +++ b/src/app/plan-audit/cad-draw/cad-draw.component.ts @@ -0,0 +1,308 @@ +import { Component, OnInit, Inject } from '@angular/core'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; +import { MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; +import { ActivatedRoute } from '@angular/router'; + +@Component({ + selector: 'app-cad-draw', + templateUrl: './cad-draw.component.html', + styleUrls: ['./cad-draw.component.scss'] +}) +export class CadDrawComponent implements OnInit { + + constructor(private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,private route:ActivatedRoute,) { } + + ngOnInit(): void { + this.companyId = this.unitId + this.getAllCAD() + } + unitId:any = '5e9964caa760a059e84512e9' + + displayedColumns: string[] = ['checked', 'name', 'time', 'state','size']; + + companyId:any; //单位编号 + CADList:any=[]; //所有CAD图 + selectCAD:any = []; //选中的CAD图 + + //获取所有CAD图 + getAllCAD () { + let id = {companyId:this.unitId} + this.http.get('/api/CadData',{params:id}).subscribe(data=>{ + this.CADList = data + this.selectCAD = [] + this.CADList.forEach(element => { + element.loading = false + element.suffix = element.cadUrl.substring(element.cadUrl.lastIndexOf("."),element.cadUrl.length); //图名后缀 + element.fileLength = (element.fileLength/1024/1024).toFixed(2)}); + }) + } + + //change CAD图checked + checkedCAD (e,element) { + /* if (e.checked) { + this.selectCAD.push(element) + } else { + this.selectCAD.splice(this.selectCAD.findIndex(item => item.id === element.id), 1)} */ + this.selectCAD.splice(this.selectCAD.findIndex(item => item.id === element.id), 1) + this.selectCAD.push(element) + this.readFile() + } + + //打开上传文件窗口 + openReadFile() { + + } + + //打开编辑文件窗口 + editFile () { + + } + + //删除CAD图 + deleteCAD () { + if (this.selectCAD.length) { + let isDelete = confirm('您确定要删除吗') + let arr = [] + if (isDelete) { + this.selectCAD.forEach( async (element,index) => { + let result = await new Promise((result,reject)=>{ + this.http.delete(`/api/CadData/${element.id}`).subscribe(data=>{result(index)}) + this.http.delete(`/api/Objects/PlanPlatform/${element.cadUrl}`).subscribe(data=>{}) + }) + arr.push(result) + if (arr.length == this.selectCAD.length) { + this.getAllCAD() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('删除CAD图纸成功','确定',config);} + }); + } + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择CAD图纸','确定',config); + } + } + + + + + + //上传文件↓ + file:any; //上传的文件 + fileName:any; //上传文件name + uploadisLoading:boolean = false; //进度条loading加载 + uploadProgress:number=0; //进度条进度 + objectName:any; //上传对象名 + uploadId:any; //上传分块上传事件编号 + + //上传文件 + startUploading () { + let file = this.file || null //获取上传的文件 + let fileSize = file.size || null //上传文件的总大小 + let shardSize = 5 * 1024 * 1024 //5MB一个分片 + + if (file && fileSize<=shardSize) { //上传文件<=5MB时 + let formData = new FormData() + formData.append("file",file) + this.http.post(`/api/Objects/PlanPlatform/${this.companyId}/CAD`,formData).subscribe((data:any)=>{ + this.objectName = data.objectName + this.addCADData() + }) + } else if (file && fileSize>shardSize) { //上传文件>5MB时,分块上传 + let data = {filename: file.name} + this.uploadisLoading = true + this.http.post(`/api/NewMultipartUpload/PlanPlatform/${this.companyId}/CAD`,{},{params:data}).subscribe((data:any)=>{ //初始化分段上传 + this.objectName = data.objectName + this.uploadId = data.uploadId + this.subsectionUploading() + }) + } + + } + + PartNumberETag:any=[]; //每次返回需要保存的信息 + //开始分段上传 + async subsectionUploading () { + let file = this.file || null //获取上传的文件 + let fileSize = file.size || null //上传文件的总大小 + let shardSize = 5 * 1024 * 1024 //5MB一个分片 + let allSlice = Math.ceil(fileSize / shardSize) //总文件/5MB===共分多少段 + + for (let i = 0;i < allSlice;i++) { //循环分段上传 + let start = i * shardSize //切割文件开始位置 + let end = Math.min(fileSize, start + shardSize); //切割文件结束位置 + let formData = new FormData() + formData.append("file",file.slice(start, end)) + + //同步写法实现异步调用 + let result = await new Promise((resolve, reject) => { + // await 需要后面返回一个 promise 对象 + this.http.post(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}&partNumber=${i+1}`,formData).subscribe((data:any)=>{ + let msg = { + "partNumber":data.partNumber || null, + "eTag": data.eTag || null} + resolve(msg) // 调用 promise 内置方法处理成功 + }) + }); + this.PartNumberETag.push(result) + this.uploadProgress = Number((i/allSlice).toFixed(2))*100 + + if (this.PartNumberETag.length === allSlice) { + this.uploadProgress = 100 + this.endUploading()} + }//for循环 + + } + + //完成分块上传 + endUploading () { + let data = this.PartNumberETag + let paramsData = {uploadId:this.uploadId} + this.http.post(`/api/CompleteMultipartUpload/PlanPlatform/${this.objectName}`,data,{params:paramsData}).subscribe(data=>{ + this.addCADData() + this.uploadProgress = 0; + this.uploadisLoading = false + this.PartNumberETag =[] //清空保存返回的信息 + }) + } + + //取消分块上传 + cancel () { + this.http.delete(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}`).subscribe(data=>{ + this.uploadProgress = 0; + this.uploadisLoading= false + this.PartNumberETag =[] //清空保存返回的信息 + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('取消上传成功!','确定',config); + }) + } + + //上传成功创建CAD + addCADData () { + let data = { + name: this.fileName, + cadUrl: this.objectName, + fileLength: this.file.size, + creationTime: new Date(), + companyId: this.companyId + } + this.http.post('/api/CadData',data).subscribe(data=>{ + this.getAllCAD() + }) + } + + + + + + //下载↓ + selectDownloadFile:any; //选择下载的文件 + download:any; //下载文件元数据 + downloadisLoading:boolean = false; //进度条loading加载 + downloadProgress:number=0; //进度条进度 + + //读取下载文件信息 + readFile () { + if (this.selectCAD.length===1) { + this.selectDownloadFile = this.selectCAD[0] + this.http.get('/api/ObjectMetadata/PlanPlatform/'+this.selectDownloadFile.cadUrl).subscribe(data=>{ + this.download = data + this.downloadFile() + }) + } else if (this.selectCAD.length>1) { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂时不支持批量下载','确定',config) + } else if (!this.selectCAD.length) { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择CAD图纸','确定',config); + } + } + + //初始化下载 + downloadFile () { + let file = this.download + let fileSize = file.fileLength//下载文件的总大小 + let shardSize = 10 * 1024 * 1024 //文件大小是否大于10MB + + if (file && fileSize<=shardSize) { //<=10MB时直接下载 + this.downloadisLoading = true + this.setFileLoading() + this.http.get(`/api/Objects/PlanPlatform/${file.objectName}`,{responseType: 'blob'},).subscribe(data=>{ + + let url = window.URL.createObjectURL(new Blob([data])); //createObjectURL创建一个下载Blob的url地址 + let link = document.createElement("a"); + link.style.display = "none"; + link.href = url; + link.setAttribute("download", this.selectDownloadFile.name+this.selectDownloadFile.suffix); + document.body.appendChild(link); + link.click(); + this.downloadisLoading = false + this.setFileLoading() + }) + } else if (file && fileSize>shardSize) { //>10MB时分块下载 + this.blockingDownload() //分段下载 + this.downloadisLoading = true + this.setFileLoading() + } + + } + + //分段下载并合并 + async blockingDownload () { + let file = this.download + let fileSize = file.fileLength //下载文件的总大小 + let shardSize = 3 * 1024 * 1024 //3MB一个分片 + let allSlice = Math.ceil(fileSize / shardSize) //总文件/3MB===共分多少段 + let allFile:any = [] //所有的file分段 + + for (let i=0;i{ + this.http.get(`/api/Objects/PlanPlatform/${file.objectName}`,{headers:{'range':`bytes= ${start}-${end}`},responseType:'blob'}).subscribe(data=>{ + result(data) }) + }) + allFile.push(result) + this.downloadProgress = Number((i/allSlice).toFixed(2))*100 + + if (allFile.length === allSlice) { //合并文件输出给浏览器 + let url = window.URL.createObjectURL(new Blob(allFile)); //createObjectURL创建一个下载Blob的url地址 + let link = document.createElement("a"); + link.style.display = "none"; + link.href = url; + link.setAttribute("download", this.selectDownloadFile.name+this.selectDownloadFile.suffix); + document.body.appendChild(link); + link.click(); + this.downloadProgress = 0 + this.downloadisLoading = false + this.setFileLoading() + } + + } //for循环 + + } + + //取消分块下载 + cancelDowload () { + + } + + //封装函数设置当前文件loading状态 + setFileLoading () { + let id = this.selectDownloadFile.id + this.CADList.forEach(element => { + if (element.id === id) { element.loading = !element.loading } + }); + } +} diff --git a/src/app/plan-audit/fire-facilities/fire-facilities.component.html b/src/app/plan-audit/fire-facilities/fire-facilities.component.html new file mode 100644 index 0000000..9623bec --- /dev/null +++ b/src/app/plan-audit/fire-facilities/fire-facilities.component.html @@ -0,0 +1,64 @@ + +
+ +
+ + + + + {{item.name}} + + +
+
+
+ 项目：{{items.name}} +
+
+ {{items.total ? items.total : '总数: 0'}} +
+
+
+ 主要情况：{{items.details}} +
+
+ 查看图片 + + +
+
+
+ + + + + +
{{header}}{{body[header]? body[header] : '暂无数据'}}
+
+
+

楼层/区域名称: {{tableMsg.name? tableMsg.name: '暂无名称'}}

+ + + + + +
{{header}}{{body[header]? body[header] : '暂无数据'}}
+
+
+ +
+ + + + + +
+ +
diff --git a/src/app/plan-audit/fire-facilities/fire-facilities.component.scss b/src/app/plan-audit/fire-facilities/fire-facilities.component.scss new file mode 100644 index 0000000..4603c4f --- /dev/null +++ b/src/app/plan-audit/fire-facilities/fire-facilities.component.scss @@ -0,0 +1,222 @@ +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} +.content { + width: 100%; + height: 760px; + //box-sizing: border-box; + //padding: 10px; + overflow-y: auto; + .contentBox { + width: 100%; + height: 100%; + margin: 0 auto; + overflow-y: auto; + } + .tableContent{ + width: 100%; + height: 100%; + .panelhead{ + //height: 24px; + background-color: #F2F9FF; + } + .column{ + width: 100%; + display: flex; + flex-direction: column; + border-bottom: 8px solid #EEF1F5; + .up{ + width: 100%; + margin-top: 3%; + display: flex; + flex-direction: row; + .left{ + width: 40%; + } + .centernum{ + //width: 25%; + color: black; + text-align: center; + white-space: pre-line; + max-height: 48px; + overflow-y: auto; + } + } + .down{ + width: 100%; + /* display: flex; + justify-content: space-around; */ + span{ + display: inline-block; + } + } + .downtable{ + width: 100%; + } + .imgdown{ + margin-top: 3%; + span{ + color: #0080FF; + } + input{ + border:none; + outline: none; + text-align: right; + color: #0080FF; + } + img{ + height: 8px; + width: 10px; + } + } + } + } + } + .mat-icon { + color: black; + cursor:pointer; + } + + + + //可展开面板每一行css + .mat-expansion-panel-header { + padding: 3px 24px; + } + + .firstContent { + width: 3%; + } + .textContent { + width: 12%; + color: black; + text-align: center; + overflow: hidden; + text-overflow:ellipsis; + white-space: nowrap; + } + .totalContent { + width: 25%; + color: black; + text-align: center; + white-space: pre-line; + max-height: 48px; + overflow-y: auto; + } + .lastTextContent { //textarea多行文本 + width: 45%; + color: black; + text-align: center; + } + input { + height: 22px; + line-height: 22px; + padding-left: 5px; + border-radius: 3px; + } + a { + color: #0000ff; + } + + + + //bottom用户输入框 + .InputField { + display: inline-block; + width: 40%; + text-align: right; + margin: 10px 25px; + input {width: 60%;} + label {margin-right: 10px;} + } + textarea { + vertical-align: middle; + border-radius: 5px; + padding: 5px; + width: 60%; + height: 36px; + resize: none; + } + + + + //表格样式 + .overflowTable { + width: 95%; + margin: 0 auto; + max-height: 300px; + overflow-y: auto; + } + .detailsTable { + margin: 10px 0; + table { + width: 100%; + text-align: center; + border-collapse:collapse; + word-break:break-all; + word-wrap:break-all; + table-layout:fixed; + th { + height: 35px; + //border: 1px solid #999; + } + td { + height: 35px; + //border: 1px solid #999; + } + tr:nth-child(odd){ + background: #F2F9FF; + } + } + } + + + + //滚动条样式 + ::-webkit-scrollbar{ + width: 5px; + background-color: white; + } + ::-webkit-scrollbar-thumb{ + background-color: #999; + } + + + + //img图片列表页面 + .imageList { + width: 100%; + height: 100%; + overflow-y: auto; + .imageListBox { + width: 100%; + height: 90%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + .imagesBox { + width: 300px; + height: 200px; + margin: 0 11px 0 11px; + display: inline-block; + img { + border: 1px solid #999; + width: auto; + height: auto; + max-width: 100%; + height: 170px; + cursor:pointer; + } + } + } + } + \ No newline at end of file diff --git a/src/app/plan-audit/fire-facilities/fire-facilities.component.spec.ts b/src/app/plan-audit/fire-facilities/fire-facilities.component.spec.ts new file mode 100644 index 0000000..60c9bef --- /dev/null +++ b/src/app/plan-audit/fire-facilities/fire-facilities.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { FireFacilitiesComponent } from './fire-facilities.component'; + +describe('FireFacilitiesComponent', () => { + let component: FireFacilitiesComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ FireFacilitiesComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(FireFacilitiesComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/plan-audit/fire-facilities/fire-facilities.component.ts b/src/app/plan-audit/fire-facilities/fire-facilities.component.ts new file mode 100644 index 0000000..0c6d5de --- /dev/null +++ b/src/app/plan-audit/fire-facilities/fire-facilities.component.ts @@ -0,0 +1,529 @@ +/* + * @Descripttion: + * @version: + * @Author: sueRimn + * @Date: 2020-11-23 09:28:54 + * @LastEditors: sueRimn + * @LastEditTime: 2021-02-03 10:12:45 + */ +import { Component, OnInit, ViewChild, Inject } from '@angular/core'; +import {HttpClient, HttpHeaders} from '@angular/common/http' +import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material/dialog'; +//import { ImgsDataDetail2 } from './addGrouping.component' +import { MatSnackBarConfig, MatSnackBar } from '@angular/material/snack-bar'; +import { ImagesData2 } from './imagesdata.component' +import { Router,ActivatedRoute } from '@angular/router' +export interface Food { + value: string; + name: string; +} + +@Component({ + selector: 'app-fire-facilities', + templateUrl: './fire-facilities.component.html', + styleUrls: ['./fire-facilities.component.scss'] +}) +export class FireFacilitiesComponent implements OnInit { + + constructor(private router:Router,private route:ActivatedRoute,public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { } + + ngOnInit(): void { + this.getCompanyInformation() + this.getAllBuilding() + + } + unitId:any = '5e9964caa760a059e84512e9' + //定义属性数据 + singleElection:Food[]=[ + {value:'true', name: '有'}, + {value:'false', name: '无'}] + + companyBuiltInGrouping:any = []; //单位消防设施内置分组 + companyDetails:any = []; //单位详情 + companyEachDetails:any = [] //单位每层详情 + companyOptionalGrouping:any = []; //单位消防设施可选分组 + open="详情" + down="收起" + imgsrcopen="../../../assets/images/routdown2.png" + imgsrcdown="../../../assets/images/routup2.png" + tableshow=true + + //获得单位基本信息 + getCompanyInformation () { + //let companyId = this.route.snapshot.queryParams.id + let companyId = this.unitId + this.http.get(`/api/Companies/${companyId}`).subscribe((data:any)=>{ + if (data.buildingTypes.length) { + let newData = {buildingType: data.buildingTypes[0].id,companyId : companyId} + this.http.get('/api/CompanyFacilities',{params:newData}).subscribe((data:any)=>{ //获得单位的消防设施 + this.companyBuiltInGrouping = data[0].summary.companyFacilityGroups + this.companyOptionalGrouping = data[0].summary.companyOptionalGroups + this.companyDetails = data[0].details + this.companyEachDetails = data[0].eachDetails + this.companyBuiltInGrouping.forEach(element => { //循环单位内置分组项 + element.selectBuiltInGrouping = [] + element.facilityItems.forEach((elements,index) => { + elements.total = element.facilityCount[index] + elements.expanded = false}); + }); + if(sessionStorage.getItem("tabsindex") == "4"){ + this.companyBuiltInGrouping = [this.companyBuiltInGrouping[1]] + this.companyOptionalGrouping = [] + } + if(sessionStorage.getItem("tabsindex") == "5"){ + this.companyBuiltInGrouping.splice(1,1) + } + }) //http + } //if + + }) + } + + //创建单位消防设施内置分组项 + addCompanyGrouping (e) { + let data = e + let dialogRef = this.dialog.open(ImagesData2,{data}); + dialogRef.afterClosed().subscribe(data=>{ + if (data) { e.facilityItems.push(data) } }); + } + + //保存单位消防设施内置分组项 + editCompanyGrouping(e) { + let header = {groupId:e.id} + let data = [] + e.facilityItems.forEach((element,index) => { + let msg = { + isBuiltin: element.isBuiltin, + details: element.details, + name: element.name, + isEachFloor: element.isEachFloor, + order: element.order} + data.push(msg) + if (index==e.facilityItems.length-1) { + this.http.post('/api/CompanyFacilityItems/Batch',data,{params:header}).subscribe(data=>{ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据更新成功','确定',config); + }) } + }); //forEach + + } + + //checked单位消防设施内置分组项时 + checkedCompany (e,item,items) { + if (e.checked) { + item.selectBuiltInGrouping.push(items) + } else { + item.selectBuiltInGrouping.splice(item.selectBuiltInGrouping.findIndex(oldItem => oldItem == items), 1) + } + } + + //删除消防设施内置分组项 + deleteCompanyGrouping (e) { + if (e.selectBuiltInGrouping.length) { + let isDelete = confirm('您确定要删除吗') + if (isDelete) { + let msg:any = `?groupId=${e.id}` + e.selectBuiltInGrouping.forEach((element,index) => { + let data = `&name=${element.name}` + msg = msg + data + if (index === e.selectBuiltInGrouping.length-1) { + this.http.delete('/api/CompanyFacilityItems/Batch' + msg).subscribe(data=>{ + let deleteMsg = e.selectBuiltInGrouping + deleteMsg.forEach(deleteElement => { + e.facilityItems.splice(e.facilityItems.findIndex(item=>item.name==deleteElement.name),1) + }); + e.selectBuiltInGrouping = [] + + }) //http + } //if + }); //forEach + } + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择内置分组项','确定',config); + } + } + + //保存单位消防设施可选分组 + editCompanyOptional (e,item) { + e.stopPropagation() //阻止冒泡 + item.propertyInfos.forEach((element,index) => { + element.propertyValue = String(element.propertyValue) + if (index == item.propertyInfos.length-1 ) { + this.http.post('/api/CompanyOptionalGroups',item).subscribe(data=>{ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据更新成功','确定',config); + }) + } //if + }); + } + + //单位消防设施切换展开面板 + SwitchBoard (e) { + e.expanded = !e.expanded + if (e.expanded) { //展开面板展开时 + if (e.isEachFloor) { //逐层统计时 + let data = this.companyEachDetails[e.name] + if (data) { + e.loopTable = [] + data.forEach(item => { + let tableMsg = {name:item.name, header:[], body:[]} + item.assets[0].propertyInfos.forEach(element => { //表头 + if (element.propertyType!=3) { + let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位 + tableMsg.header.push(element.propertyName+unit)} + }); + item.assets.forEach(element => { //表格内容 + let everyBody = {} + element.propertyInfos.forEach((elements,index) => { + if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue } + if (elements.propertyType==6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' } + if (elements.propertyType!=3 && elements.propertyName=='图片') { + let imgLength = [] + element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} }) + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = String(imgLength.length) } + + }); //propertyInfos + tableMsg.body.push(everyBody) + }); //assets + e.loopTable.push(tableMsg) + }); + + } //data有数据时 + } else { //非逐层统计时 + let data = this.companyDetails[e.name] + if (data) { + e.header = [] + e.body = [] + data[0].propertyInfos.forEach(element => { //表头 + if (element.propertyType!=3) { + let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位 + e.header.push(element.propertyName+unit)} + }); + data.forEach(element => { //表格内容 + let everyBody = {} + element.propertyInfos.forEach((elements,index) => { + if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue } + if (elements.propertyType==6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' } + if (elements.propertyType!=3 && elements.propertyName=='图片') { + let imgLength = [] + element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} }) + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = String(imgLength.length) } + + }); + e.body.push(everyBody) + }); + + } + } //非逐层统计时 + + + } + } + + + + allBuildingGrouping:any; //所有建筑的消防设施 内置分组+可选分组 + //获取所有建筑 + getAllBuilding () { + let companyId = this.unitId + this.http.get('/api/Buildings',{params:{ + companyId:companyId + }}).subscribe((data:any)=>{ + this.allBuildingGrouping = data + if (this.allBuildingGrouping.length) { this.getAllBuildingFacilities() } + }) + } + + //获取所有建筑的消防设施 + getAllBuildingFacilities () { + let companyId = this.unitId + this.allBuildingGrouping.forEach(element => { + let header = {buildingId: element.id, buildingType: element.buildingTypes[0].id,companyId:companyId} + this.http.get('/api/BuildingFacilities',{params:header}).subscribe(data=>{ + element.buildingFacilityGroups = data[0].summary.buildingFacilityGroups + element.buildingOptionalGroups = data[0].summary.buildingOptionalGroups + element.buildingDetails = data[0].details + element.buildingEachDetails = data[0].eachDetails + element.buildingFacilityGroups.forEach((elements) => { //循环每个建筑内置分组项 + elements.selectBuiltInGrouping = [] + elements.facilityItems.forEach((newElement,index) => { + newElement.total = elements.facilityCount[index] + newElement.expanded = false }); + }); + + if(sessionStorage.getItem("tabsindex") == "4"){ + element.buildingFacilityGroups = [element.buildingFacilityGroups[1]] + element.buildingOptionalGroups = [] + } + if(sessionStorage.getItem("tabsindex") == "5"){ + element.buildingFacilityGroups.splice(1,1) + } + }) + + }); + + } + + + + //保存建筑消防设施内置分组项 + editBuildingGrouping (e,item) { + let companyId = this.unitId + let header = {companyId:companyId,buildingId:e.id, groupId:item.id} + let data = [] + item.facilityItems.forEach((element,index) => { + let msg = { + isBuiltin: element.isBuiltin, + details: element.details, + name: element.name, + isEachFloor: element.isEachFloor, + order: element.order} + data.push(msg) + if (index==item.facilityItems.length-1) { + this.http.post('/api/BuildingFacilityItems/Batch',data,{params:header}).subscribe(data=>{ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据更新成功','确定',config); + }) } + }); //forEach + + } + + + + //保存建筑消防设施可选分组 + editBuildingOptional (e,item) { + let companyId = this.unitId + e.stopPropagation() //阻止冒泡 + item.propertyInfos.forEach((element,index) => { + element.propertyValue = String(element.propertyValue) + if (index == item.propertyInfos.length-1 ) { + this.http.post('/api/BuildingOptionalGroups',item,{params:{ + companyId :companyId + }}).subscribe(data=>{ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据更新成功','确定',config); + }) + } //if + }); + } + + //建筑消防设施切换展开面板 + SwitchBuildingBoard (item,e) { + e.expanded = !e.expanded + if (e.expanded) { //展开面板展开时 + if (e.isEachFloor) { //逐层统计时 + let data = item.buildingEachDetails[e.name] + if (data) { + e.loopTable = [] + data.forEach(item => { + let tableMsg = {name:item.name, header:[], body:[]} + item.assets[0].propertyInfos.forEach(element => { //表头 + if (element.propertyType!=3) { + let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位 + tableMsg.header.push(element.propertyName+unit)} + }); + item.assets.forEach(element => { //表格内容 + let everyBody = {} + element.propertyInfos.forEach((elements,index) => { + if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue } + if (elements.propertyType==6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' } + if (elements.propertyType!=3 && elements.propertyName=='图片') { + let imgLength = [] + element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} }) + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = String(imgLength.length) } + + }); //propertyInfos + tableMsg.body.push(everyBody) + }); //assets + e.loopTable.push(tableMsg) + }); + + } //data有数据时 + } else { //非逐层统计时 + let data = item.buildingDetails[e.name] + if (data) { + e.header = [] + e.body = [] + data[0].propertyInfos.forEach(element => { //表头 + if (element.propertyType!=3) { + let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位 + e.header.push(element.propertyName+unit)} + }); + data.forEach(element => { //表格内容 + let everyBody = {} + element.propertyInfos.forEach((elements,index) => { + if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue } + if (elements.propertyType==6) { + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' } + if (elements.propertyType!=3 && elements.propertyName=='图片') { + let imgLength = [] + element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} }) + let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位 + everyBody[elements.propertyName+unit] = String(imgLength.length) } + + }); + e.body.push(everyBody) + }); + + } + } //非逐层统计时 + + + + } + } + + //单位消防设施预览图片 + previewImg (e) { + if (e.isEachFloor) { //逐层统计时 + let newData = this.companyEachDetails[e.name] + if (newData) { + let data = {name:e.name, images:[]} + let imgName + newData.forEach(item => { + item.assets.forEach(element => { + element.propertyInfos.forEach( elements => { + if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue} + if (elements.propertyType===3) { + elements.propertyName = imgName + data.images.push(elements)} }); + }); + }); //newDate + + if (data.images.length) { + let dialogRef = this.dialog.open(ImagesData2,{width:'1350px',height:'700px',data}); //打开图片弹窗 + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); + } + + } else{ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); } + } else { //非逐层统计时 + let newData = this.companyDetails[e.name] + let imgName + if (newData) { + let data = {name:e.name, images:[]} + newData.forEach(element => { + element.propertyInfos.forEach(elements => { + if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue} + if (elements.propertyType===3) { + elements.propertyName = imgName + data.images.push(elements)} }); + }); + if (data.images.length) { + let dialogRef = this.dialog.open(ImagesData2,{width:'1350px',height:'700px',data}); //打开图片弹窗 + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); + } + + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); } + } + + } + + //建筑消防设施预览图片 + previewBuildingImg (item,e) { + if (e.isEachFloor) { //逐层统计时 + let newData = item.buildingEachDetails[e.name] + if (newData) { + let data = {name:e.name, images:[]} + let imgName + newData.forEach(item => { + item.assets.forEach(element => { + element.propertyInfos.forEach( elements => { + if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue} + if (elements.propertyType===3) { + elements.propertyName = imgName + data.images.push(elements)} }); + }); + }); //newDate + + if (data.images.length) { + let dialogRef = this.dialog.open(ImagesData2,{width:'1350px',height:'700px',data}); //打开图片弹窗 + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); + } + + } else{ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); } + } else { //非逐层统计时 + let newData = item.buildingDetails[e.name] + let imgName + if (newData) { + let data = {name:e.name, images:[]} + newData.forEach(element => { + element.propertyInfos.forEach(elements => { + if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue} + if (elements.propertyType===3) { + elements.propertyName = imgName + data.images.push(elements)} + }); + }); + if (data.images.length) { + let dialogRef = this.dialog.open(ImagesData2,{width:'1350px',height:'700px',data}); //打开图片弹窗 + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); + } + + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); } + } + + } + + +} diff --git a/src/app/plan-audit/fire-facilities/imagesdata.component.html b/src/app/plan-audit/fire-facilities/imagesdata.component.html new file mode 100644 index 0000000..534df3e --- /dev/null +++ b/src/app/plan-audit/fire-facilities/imagesdata.component.html @@ -0,0 +1,9 @@ +
+
{{data.name}}
+
+
+ + +
+
+
\ No newline at end of file diff --git a/src/app/plan-audit/fire-facilities/imagesdata.component.ts b/src/app/plan-audit/fire-facilities/imagesdata.component.ts new file mode 100644 index 0000000..d82be4e --- /dev/null +++ b/src/app/plan-audit/fire-facilities/imagesdata.component.ts @@ -0,0 +1,90 @@ +/* + * @Descripttion: + * @version: + * @Author: sueRimn + * @Date: 2020-11-23 09:46:16 + * @LastEditors: sueRimn + * @LastEditTime: 2020-11-23 09:53:45 + */ +import { Component, OnInit, Inject } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog'; +import Swiper from 'swiper'; + + + +@Component({ + selector: 'imagesdata', + templateUrl: './imagesdata.component.html', + styleUrls: ['./fire-facilities.component.scss'] + }) +export class ImagesData2 { + + constructor(private http: HttpClient,public dialogRef: MatDialogRef,@Inject(MAT_DIALOG_DATA) public data,public dialog: MatDialog) {} + + ngOnInit(): void { + this.data.images.forEach(element => { + element.newImageUrl = `${element.propertyValue}?x-oss-process=image/resize,m_fill,h_170,w_299` + }); + } + + //查看大图 + seeImage (index) { + let data = { + allImages:this.data.images, + imgIndex: index} + let dialogRef = this.dialog.open(previewBigImg2, + {width: '1600px', + height:'900px',data}); + } + +} + + + +@Component({ + selector: 'previewBigImg', + templateUrl: './previewImg.html', + styleUrls: ['./realistic-picture.component.scss'] +}) +export class previewBigImg2 { + + constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data) { } + testSwiper: Swiper; + + ngOnInit(): void { + this.allImages = this.data.allImages + this.allImages.forEach(element => { + element.previewImageUrl = `${element.propertyValue}?x-oss-process=image/auto-orient,1` //处理图片URL地址 + }); + } + + ngAfterViewInit() { + this.testSwiper = new Swiper('.swiper-container', { + lazy: true, + initialSlide: this.data.imgIndex, + direction: 'horizontal', + loop: false, + + + + // 如果需要前进后退按钮 + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + } + }); + } + + allImages:any; //展示所有的图片 + rotationAngle:number=0; //旋转角度 + + //旋转图片 + rotate () { + this.rotationAngle = this.rotationAngle+90 + if (this.rotationAngle === 360) {this.rotationAngle = 0} + } + +} + \ No newline at end of file diff --git a/src/app/plan-audit/fire-facilities/previewImg.html b/src/app/plan-audit/fire-facilities/previewImg.html new file mode 100644 index 0000000..109fba0 --- /dev/null +++ b/src/app/plan-audit/fire-facilities/previewImg.html @@ -0,0 +1,25 @@ + +
图片详情
+
+
+
+ +
+
+
+ + +
+
+
+ +
+ +
\ No newline at end of file diff --git a/src/app/plan-audit/fire-facilities/realistic-picture.component.scss b/src/app/plan-audit/fire-facilities/realistic-picture.component.scss new file mode 100644 index 0000000..075375c --- /dev/null +++ b/src/app/plan-audit/fire-facilities/realistic-picture.component.scss @@ -0,0 +1,174 @@ +.content { + margin: 0 0 0 10px; + width: 100%; + height: 100%; + overflow-y: auto; + display: flex; + .leftBox { + flex: 15%; + padding-top: 10px; + .bank { + display: flex; + padding-left: 10px; + .mat-icon {margin-right: 15px;} + } + } + .rightBox { + border-left: 1px solid #999; + flex: 85%; + display: flex; + flex-direction: column; + .topBox { + flex: 5%; padding: 10px; + display: flex; + :first-child {flex: 85%;}; + :last-child {flex: 15%;} + } + .bottomBox { + flex: 95%; + padding: 5px 0 0 25px; + overflow: auto; + .imgsBoxflex { + display: flex; + flex-direction: row; + flex-wrap: wrap; + } + } + } +} + +//icon统一样式 +.mat-icon { + cursor:pointer; + width: 18px; + height: 18px; + vertical-align:top; + margin-right: 10px; +} +.title {margin-right: 30px;font-weight: 500; font-size: 18px;} + +.material { + cursor:pointer; + height: 30px; + font-size: 16px; + margin-top: 10px; + padding-left: 15px; + span { + max-width: 200px; + display: inline-block; + overflow: hidden; + text-overflow:ellipsis; + white-space: nowrap; + } + .btn { + color: #FFC122; + } +} +.imgBox{ + width: 300px; + height: 200px; + margin: 0 35px 35px 0; + display: inline-block; + position: relative; + .fixedImg { + width: 100%; + height: 170px; + text-align: center; + margin-bottom: 3px; + img { + width: auto; + height: auto; + max-width: 100%; + height: 100%; + cursor:pointer; + } + } + input{ + font-size:12px; + width: 100px; + height:18px; + border-radius:3px; + border:1px solid #c8cccf; + outline:0; + text-align:left; + padding-left: 5px; + display:inline-block; + cursor: pointer;} + input::-webkit-input-placeholder{ + color: #986655; + font-size: 12px; + } + a {display: inline-block; + width: 45px; + height: 24px; + line-height: 24px; + text-align: center; + border-radius: 3px; + background-color: #2196F3; + font-size: 14px; + color: #fff;} +} +.uploadFileFixed { + position: relative; + .uploadFile { + opacity:0; + display: inline-block; + width: 88px; + height: 36px; + position: absolute; + top: 0px; + left: 0px; + } +} +//分页 +.mat-paginator { + background-color: rgba(255,255,255,0); + padding-right: 10%; +} +.isLoading{ + display: inline-block; + margin-left: 15px; + top: 8px; +} + +//左侧实景图文件样式 +.leftFile { + background-color: rgba(225,225,225,0.8); +} +//选中图片样式 +.selectImg { + -webkit-filter: drop-shadow(0px 0px 5px #000); + filter: drop-shadow(0px 0px 5px #000); + border: 1px solid red; +} +.checkedImg { + position: absolute; + top: 1px; + right: 1px; + color:#00FF00; + font-size: 30px; + z-index: 999; +} +//预览图片旋转角度 +.rotateA {transform: rotate(90deg) scale(0.75);} +.rotateB {transform: rotate(180deg)} +.rotateC {transform: rotate(270deg) scale(0.75);} + + + +//预览图片 +.previewImgBox { + width: 1500px; + height: 700px; + text-align: center; + img{ + width: auto; + height: auto; + max-width: 100%; + height: 100%;} +} +.previewImgBottom { + text-align: center; + height: 30px; + margin: 20px auto; +} diff --git a/src/app/plan-audit/function-partition/function-partition.component.html b/src/app/plan-audit/function-partition/function-partition.component.html new file mode 100644 index 0000000..ffe3698 --- /dev/null +++ b/src/app/plan-audit/function-partition/function-partition.component.html @@ -0,0 +1,64 @@ + +
+ + +
+
+ + + + + 单位功能分区 + + + +
+
+ 区域：{{item.region}} +
+
+ 面积：{{item.area}} +
+
+ 基本情况：{{item.details}} +
+
+ + +
+ +
+ + + + + {{item.name}} + + + +
+
+ 区域：{{item.region}} +
+
+ 面积：{{item.area}} +
+
+ 基本情况：{{item.details}} +
+
+ + +
+ +
+ +
+ diff --git a/src/app/plan-audit/function-partition/function-partition.component.scss b/src/app/plan-audit/function-partition/function-partition.component.scss new file mode 100644 index 0000000..ae374e8 --- /dev/null +++ b/src/app/plan-audit/function-partition/function-partition.component.scss @@ -0,0 +1,81 @@ +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} +.content { + width: 100%; + height: 760px; + overflow-y: auto; + //padding: 10px 0 0 10px; + display: flex; + .column{ + width: 100%; + display: flex; + flex-direction: column; + border-bottom: 1px solid #EEF1F5; + .up{ + width: 100%; + margin-top: 3%; + } + .areacenter{ + margin-top: 1%; + } + .down{ + margin-top: 1%; + margin-bottom: 2%; + } + span{ + margin-left: 8%; + //@at-root: 5%; + } + } +} +.center{ + width: 100%; + height: 100%; + display: flex; + flex-direction: column; +} +.tableContent { + //margin-left: 10px; + width: 100%; + height: 100%; + .panelhead{ + height: 44px; + background-color: #F2F9FF; + } + table { + border:1px solid #0094ff; + border-collapse:collapse; + td,th{ + border:1px solid #0094ff; + } + 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; + scrollbar-base-color:#0080FF; + } + } +} + +//icon统一样式 +.mat-icon { + cursor:pointer; +} \ No newline at end of file diff --git a/src/app/plan-audit/function-partition/function-partition.component.spec.ts b/src/app/plan-audit/function-partition/function-partition.component.spec.ts new file mode 100644 index 0000000..9dd9485 --- /dev/null +++ b/src/app/plan-audit/function-partition/function-partition.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { FunctionPartitionComponent } from './function-partition.component'; + +describe('FunctionPartitionComponent', () => { + let component: FunctionPartitionComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ FunctionPartitionComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(FunctionPartitionComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/plan-audit/function-partition/function-partition.component.ts b/src/app/plan-audit/function-partition/function-partition.component.ts new file mode 100644 index 0000000..9e8c35a --- /dev/null +++ b/src/app/plan-audit/function-partition/function-partition.component.ts @@ -0,0 +1,219 @@ +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-partition', + templateUrl: './function-partition.component.html', + styleUrls: ['./function-partition.component.scss'] +}) +export class FunctionPartitionComponent implements OnInit { + + constructor(private router:Router,private route:ActivatedRoute,private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { } + + ngOnInit(): void { + this.companyId = this.unitId + this.getAllCompany() + this.getAllBuilding() + } + + displayedColumns: string[] = ['checked', 'region', 'measure', 'situation']; + unitId:any = '5e9964caa760a059e84512e9' + + companyId:any; //单位编号 + companyFunctionalZoning:any=[]; //所有单位功能分区属性 + selectFunctionalZoning:any=[]; //选中的单位功能分区属性 + + //获得所有单位功能分区属性 + getAllCompany () { + let companyId = this.unitId + 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.unitId + 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.unitId + 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.unitId + 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); + } + } + +} diff --git a/src/app/plan-audit/key-site-look/key-site.component.html b/src/app/plan-audit/key-site-look/key-site.component.html new file mode 100644 index 0000000..cd96981 --- /dev/null +++ b/src/app/plan-audit/key-site-look/key-site.component.html @@ -0,0 +1,101 @@ + +
+
+ + + + + 单位重点部位 + + +
+
+
+ +
+
+
+ {{element.name}} +
+
+ 所在地址：{{element.position}} +
+
+ 建筑结构：{{element.structure}} +
+
+ 使用性质：{{element.nature}} +
+
+ 主要危险：{{element.hazards}} +
+
+ + +
+
+ +
+ +
+ + + + + +
+ +
+ + + + + {{item.name}} + + + +
+
+
+ +
+
+
+ {{element.name}} +
+
+ 所在地址：{{element.position}} +
+
+ 建筑结构：{{element.structure}} +
+
+ 使用性质：{{element.nature}} +
+
+ 主要危险：{{element.hazards}} +
+
+ + +
+
+ +
+ +
+ + + + + +
+ +
\ No newline at end of file diff --git a/src/app/plan-audit/key-site-look/key-site.component.scss b/src/app/plan-audit/key-site-look/key-site.component.scss new file mode 100644 index 0000000..0a53cc5 --- /dev/null +++ b/src/app/plan-audit/key-site-look/key-site.component.scss @@ -0,0 +1,148 @@ +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} +.mat-expansion-panel-body{ + display: flex; +} +.content { + width: 100%; + height: 760px; + //padding: 10px; + overflow-y: auto; + + .contentBox{ + width: 100%; + height: 100%; + overflow-y: auto; + text-align: center; + margin: 0 auto; + } +} +.tableContent{ + width: 100%; + height: 100%; + .contat{ + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + .colum{ + width: 280px; + display: flex; + margin: 10px 0 0 25px; + //flex-direction: column; + .left{ + width: 140px; + height: 120px; + + //margin-left: 4%; + img{ + //float: right; + width: 140px; + height: 120px; + cursor: pointer; + //padding-left: 7%; + //margin-right: 3%; + } + } + .right{ + width: 140px; + //margin-top: 4%; + margin-left: 3%; + display: flex; + flex-direction: column; + .rightone{ + width: 100%; + } + .righttwo{ + margin-top: 1%; + } + .righthree{ + margin-top: 1%; + } + .rightfour{ + margin-top: 1%; + } + .rightfive{ + margin-top: 1%; + } + } + + } + } + + .panelhead{ + //height: 44px; + background-color: #F2F9FF; + } + + .down{ + width: 100%; + height: 150px; + //margin-top: 5%; + textarea{ + width: 95%; + height: 70%; + margin: 3%; + border: none; + background-color: #EEF1F5; + scrollbar-base-color:#0080FF; + } + + } +} + +table { + width: 90%; + margin: 15px auto; + text-align: center; + .cdk-header-cell { + text-align: center; + } +} + +//重点提示 +.tips{ + width: 75%; + height: 150px; + border: 1px solid black; + border-radius: 5px; + margin: 15px auto; + text-align: center; + padding: 25px; + textarea { + resize: none; + width: 100%; + height: 100%; + } +} + +//预览图片旋转角度 +.rotateA {transform: rotate(90deg) scale(0.75);} +.rotateB {transform: rotate(180deg)} +.rotateC {transform: rotate(270deg) scale(0.75);} +//预览图片 +.previewImgBox { + width: 1500px; + height: 700px; + text-align: center; + img{ + width: auto; + height: auto; + max-width: 100%; + height: 100%;} +} +.previewImgBottom { + text-align: center; + height: 30px; + margin: 20px auto; +} diff --git a/src/app/plan-audit/key-site-look/key-site.component.ts b/src/app/plan-audit/key-site-look/key-site.component.ts new file mode 100644 index 0000000..653a08c --- /dev/null +++ b/src/app/plan-audit/key-site-look/key-site.component.ts @@ -0,0 +1,195 @@ +import { Component, OnInit, ViewChild, Inject } from '@angular/core'; +import {HttpClient} from '@angular/common/http' +import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; +import { KeySiteImgs2 } from './keysiteimgs.component' +import { ActivatedRoute } from '@angular/router'; + + + +@Component({ + selector: 'app-key-site-look', + templateUrl: './key-site.component.html', + styleUrls: ['./key-site.component.scss'] +}) +export class KeySiteLookComponent implements OnInit { + + constructor(public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,private route:ActivatedRoute,) { } + + displayedColumns: string[] = ['mainname', 'position', 'construction', 'nature', 'danger', 'img']; + + ngOnInit(): void { + this.getCompanyPostion() + this.getCompanyTips() + this.getAllBuilding() + } + unitId:any = '5e9964caa760a059e84512e9' + + allCompanyPosition:any = []; //所有单位重点部位 + companyTips:any; //所有单位重点提示 + companyInput:any; //单位重点提示数据 + allBuilding:any = []; //所有建筑 + 建筑重点部位 + 建筑重点提示 + + //获取单位重点部位 + getCompanyPostion () { + let id = {companyId:this.unitId} + this.http.get('/api/CompanyImportantLocations',{params:id}).subscribe(data=>{ + this.allCompanyPosition = data + this.allCompanyPosition.forEach(element => { + if(element.imageUrls[0]!=undefined){ + element.imageUrls[0]+= '?x-oss-process=image/resize,m_fill,h_140,w_120' + } + + }); + }) + + } + + //获取单位重点提示 + getCompanyTips () { + let id = {companyId:this.unitId} + this.http.get('/api/CompanyImportantTips',{params:id}).subscribe((data:any)=>{ + if (data) { + this.companyTips = data + this.companyInput = data.details} + }) + } + + //获取所有建筑 + getAllBuilding () { + let id = {companyId:this.unitId} + this.http.get('/api/Buildings',{params:id}).subscribe((data:any)=>{ + if (data.length) { + this.allBuilding = data + this.allBuilding.forEach(element => { + element.position = [] //建筑重点部位 + element.tips = null //建筑重点提示 + element.companyInput = null }) //建筑重点提示数据 + this.getAllBuildingPositon() + this.getAllBuildingTips() + } + }) + } + + //获取所有建筑重点部位 + getAllBuildingPositon () { + this.allBuilding.forEach(element => { + let id = {buildingId:element.id} + this.http.get('/api/BuildingImportantLocations',{params:id}).subscribe(data=>{ + element.position = data + element.position.forEach(element => { + if(element.imageUrls[0]!=undefined){ + element.imageUrls[0]+= '?x-oss-process=image/resize,m_fill,h_140,w_120' + } + }); + }) + }); + } + + //获取所有建筑重点提示 + getAllBuildingTips () { + this.allBuilding.forEach(element => { + let id = {buildingId:element.id} + this.http.get('/api/BuildingImportantTips',{params:id}).subscribe((data:any)=>{ + if (data) { + element.tips = data + element.companyInput = data.details} + }) + }); + } + + //保存单位重点提示 + Preservation () { + if (this.companyTips) { //编辑单位重点提示 + let data = { + companyId: this.companyTips.companyId, + id: this.companyTips.id, + details: this.companyInput} + this.http.put(`/api/CompanyImportantTips/${this.companyTips.id}`,data).subscribe(data=>{ + this.getCompanyTips() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据修改成功','确定',config); + }) + } else { //新增单位重点提示 + let data = { + companyId: this.unitId, + id : "", + details: this.companyInput || ""} + this.http.post('/api/CompanyImportantTips',data).subscribe(data=>{ + this.getCompanyTips() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据修改成功','确定',config); + }) + } + } + + //保存建筑重点提示 + PreservationBuilding (e) { + if (e.tips) { //编辑建筑重点提示 + let data = { + buildingId: e.id, + id: e.tips.id, + details: e.companyInput} + this.http.put(`/api/BuildingImportantTips/${e.tips.id}`,data).subscribe(data=>{ + this.toUpdate(e) + }) + } else { //新增重点单位提示 + let data = { + buildingId: e.id, + details: e.companyInput || ""} + this.http.post('/api/BuildingImportantTips',data).subscribe(data=>{ + this.toUpdate(e) + }) + } + } + + //查看图片 + seeImg (e) { + if(e.length>0){ + var index=e[0].lastIndexOf("\?"); + if(index!=-1){ + e[0]=e[0].substring(0,index) + } + + } + if (e.length) { + let data = e + const dialogRef = this.dialog.open(KeySiteImgs2, {//调用open方法打开对话框并且携带参数过去 + width: '1600px', + height:'900px',data}); + dialogRef.afterClosed().subscribe(); + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('暂无图片数据','确定',config); + } + this.getCompanyPostion() + this.getAllBuildingPositon() + } + + //封装方法获取更新当前tab页重点提示 + toUpdate (e) { + let id = {buildingId:e.id} + this.http.get('/api/BuildingImportantTips',{params:id}).subscribe((data:any)=>{ + if (data) { + this.allBuilding.forEach(element => { + if (element.id === e.id) { + element.tips = data + element.companyInput = data.details} + }); + } // if + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('数据修改成功','确定',config); + }) + } + + + +} diff --git a/src/app/plan-audit/key-site-look/keysiteimgs.component.html b/src/app/plan-audit/key-site-look/keysiteimgs.component.html new file mode 100644 index 0000000..992faec --- /dev/null +++ b/src/app/plan-audit/key-site-look/keysiteimgs.component.html @@ -0,0 +1,18 @@ +
图片详情
+
+
+
+ +
+
+
+ + +
+
+
+ +
+ +
\ No newline at end of file diff --git a/src/app/plan-audit/key-site-look/keysiteimgs.component.ts b/src/app/plan-audit/key-site-look/keysiteimgs.component.ts new file mode 100644 index 0000000..fb90d71 --- /dev/null +++ b/src/app/plan-audit/key-site-look/keysiteimgs.component.ts @@ -0,0 +1,55 @@ +import { Component, OnInit, Inject ,ViewChild} from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import Swiper from 'swiper'; + + + +@Component({ + selector: 'keysiteimgs', + templateUrl: './keysiteimgs.component.html', + styleUrls: ['./key-site.component.scss'] + }) + +export class KeySiteImgs2 { + + constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data) { } + testSwiper: Swiper; + + ngOnInit(): void { + this.allImages = [] + this.data.forEach(element => { + element = `${element}?x-oss-process=image/auto-orient,1` + this.allImages.push(element) + }); + } + + ngAfterViewInit() { + + this.testSwiper = new Swiper('.swiper-container', { + direction: 'horizontal', + loop: false, + lazy: true, + // 如果需要前进后退按钮 + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + } + }); + + } + + allImages:any; //展示所有的图片 + rotationAngle:number=0; //旋转角度 + + //旋转图片 + rotate () { + this.rotationAngle = this.rotationAngle+90 + if (this.rotationAngle === 360) {this.rotationAngle = 0} + } + + + +} + \ No newline at end of file diff --git a/src/app/plan-audit/plan-audit.module.ts b/src/app/plan-audit/plan-audit.module.ts index 0ee43c1..8128f39 100644 --- a/src/app/plan-audit/plan-audit.module.ts +++ b/src/app/plan-audit/plan-audit.module.ts @@ -52,9 +52,25 @@ import {KeyUnitModule} from '../key-unit/key-unit.module'; import { PlanRecordComponent } from './plan-record/plan-record.component'; import { BasicInfoComponent } from './basic-info/basic-info.component'; import { WaitExamineerComponent } from './wait-examineer/wait-examineer.component' +import { AllaroundComponent } from './allaround/allaround.component' +import { ImgDetails } from './allaround/imgdetails.component' +import { FireFacilitiesComponent } from './fire-facilities/fire-facilities.component' +import { ImagesData2 } from './fire-facilities/imagesdata.component' +import { previewBigImg2 } from './fire-facilities/imagesdata.component' +import { PlanListComponent } from './plan-list/plan-list.component' +import { OpenPlanToolDialog } from './plan-list/plan-list.component' +import { UiModule } from '../ui/ui.module'; +import { KeySiteLookComponent }from './key-site-look/key-site.component' +import { KeySiteImgs2 } from './key-site-look/keysiteimgs.component' +import { FunctionPartitionComponent } from './function-partition/function-partition.component' +import { CadDrawComponent } from './cad-draw/cad-draw.component' +import { RealisticPictureLookComponent }from './realistic-picture-look/realistic-picture.component' +import { previewImg3 } from './realistic-picture-look/realistic-picture.component' @NgModule({ - declarations: [DetachmentLevelComponent, PlanAuditComponent, PlanPassComponent,PlanOpen, PlanRecordComponent, BasicInfoComponent, WaitExamineerComponent,], + declarations: [DetachmentLevelComponent, PlanAuditComponent, PlanPassComponent,PlanOpen, PlanRecordComponent, BasicInfoComponent, + WaitExamineerComponent,AllaroundComponent,ImgDetails,FireFacilitiesComponent,ImagesData2,previewBigImg2,PlanListComponent,OpenPlanToolDialog, + KeySiteLookComponent,KeySiteImgs2,FunctionPartitionComponent,CadDrawComponent,RealisticPictureLookComponent,previewImg3], imports: [ CommonModule, PlanAuditRoutingModule, @@ -101,7 +117,8 @@ import { WaitExamineerComponent } from './wait-examineer/wait-examineer.componen PortalModule, ScrollingModule, FormsModule, - KeyUnitModule + KeyUnitModule, + UiModule ] }) export class PlanAuditModule { } diff --git a/src/app/plan-audit/plan-list/openPlanTool.html b/src/app/plan-audit/plan-list/openPlanTool.html new file mode 100644 index 0000000..9c385b7 --- /dev/null +++ b/src/app/plan-audit/plan-list/openPlanTool.html @@ -0,0 +1,3 @@ +
+ +
\ No newline at end of file diff --git a/src/app/plan-audit/plan-list/openPlanTool.scss b/src/app/plan-audit/plan-list/openPlanTool.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/plan-audit/plan-list/plan-list.component.html b/src/app/plan-audit/plan-list/plan-list.component.html new file mode 100644 index 0000000..55ea6a8 --- /dev/null +++ b/src/app/plan-audit/plan-list/plan-list.component.html @@ -0,0 +1,42 @@ +
+
+ + + + + 总平面图 + + +
+
+
+ +
+

{{item.name}}

+
+
+ + +
+
+ + + + + {{item.name}} + + + +
+
+
+ +
+

{{i.name}}

+
+
+ + + +
+
\ No newline at end of file diff --git a/src/app/plan-audit/plan-list/plan-list.component.scss b/src/app/plan-audit/plan-list/plan-list.component.scss new file mode 100644 index 0000000..a1939e9 --- /dev/null +++ b/src/app/plan-audit/plan-list/plan-list.component.scss @@ -0,0 +1,42 @@ +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} + +.planlist{ + width: 100%; + height: 100%; + overflow-y: auto; +} +.contant{ + box-sizing: border-box; + padding: 20px; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + .contantitem{ + div{ + width: 110px; + height: 110px; + img{ + width: 100%; + height: 100%; + cursor: pointer; + } + } + p{ + text-align: center; + font-size: 14px; + margin: 2px 0; + width: 110px; + } + } +} \ No newline at end of file diff --git a/src/app/plan-audit/plan-list/plan-list.component.spec.ts b/src/app/plan-audit/plan-list/plan-list.component.spec.ts new file mode 100644 index 0000000..9a93192 --- /dev/null +++ b/src/app/plan-audit/plan-list/plan-list.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PlanListComponent } from './plan-list.component'; + +describe('PlanListComponent', () => { + let component: PlanListComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ PlanListComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PlanListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/plan-audit/plan-list/plan-list.component.ts b/src/app/plan-audit/plan-list/plan-list.component.ts new file mode 100644 index 0000000..5dacf04 --- /dev/null +++ b/src/app/plan-audit/plan-list/plan-list.component.ts @@ -0,0 +1,102 @@ +import { HttpClient } from '@angular/common/http'; +import { Component, Inject, OnInit, Renderer2, ViewChild } from '@angular/core'; +import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { MatSnackBar } from '@angular/material/snack-bar'; + +@Component({ + selector: 'app-plan-list', + templateUrl: './plan-list.component.html', + styleUrls: ['./plan-list.component.scss'] +}) +export class PlanListComponent implements OnInit { + constructor(private http: HttpClient,public snackBar: MatSnackBar,public dialog: MatDialog) { } + + //单位相关数据 + unitId:any = '5e9964caa760a059e84512e9' + + ngOnInit(): void { + this.getAllBuildings() + this.getSitePlan() + } + + //获得所有的建筑物 + allBuildings:any + getAllBuildings(){ + this.http.get("/api/Buildings",{ + params:{ + companyId : this.unitId + } + }).subscribe((data:any)=>{ + data.forEach((item,index) => { + let params = { buildingId: item.id } + item.plandata = [] + this.http.get('/api/BuildingAreas',{params}).subscribe(data=>{ + item.plandata = data + }) + }) + this.allBuildings = data + }) + } + //获取总平面图 + sitePlanItems:any + getSitePlan () { + let params = {companyId: this.unitId} + this.http.get('/api/SitePlans',{params:params}).subscribe(data=>{ + this.sitePlanItems = data + }) + } + //打开采集工具 + openPlan(item,index){ + sessionStorage.setItem("gisplan",'look') + sessionStorage.setItem("companyId",this.unitId) + let data = {select: item, key: index, allBuildings: this.allBuildings} + let dialogRef = this.dialog.open(OpenPlanToolDialog,{//调用open方法打开对话框并且携带参数过去 + width: '1500px', + height:'850px', + id:'openPlanToolDialog', + data + }); + dialogRef.afterClosed().subscribe( (data)=>{ } ); + } +} + + + +//查看预案 +@Component({ + selector: 'lookPlan-dialog', + templateUrl: './openPlanTool.html', + styleUrls: ['./openPlanTool.scss'] +}) +export class OpenPlanToolDialog { + + constructor(public http: HttpClient,public snackBar: MatSnackBar,public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data,private render2: Renderer2,public dialog: MatDialog) {} + + @ViewChild( 'plan',{static: false} ) plan:any //子组件 + + ngOnInit() { + } + + ngAfterViewInit(): void { + this.noticePlan() + } + + //通知 子组件 传递参数 + noticePlan () { + let parameter = { //查询 节点 对应 建筑/楼层 index,id + buildingIndex: this.data.key, //总平面图/建筑 index + storeyId: this.data.select.id + } + this.http.get("/api/Buildings",{params:{companyId : sessionStorage.getItem('unitId')} }).subscribe((data:any)=>{ + this.plan.allBuildings = data + this.plan.seekPanelPoint(parameter) + }) + } + + //关闭弹窗 + closeDiv(){ + this.dialogRef.close() + } + +} \ No newline at end of file diff --git a/src/app/plan-audit/plan-pass/plan-pass.component.html b/src/app/plan-audit/plan-pass/plan-pass.component.html index d584782..e5130c0 100644 --- a/src/app/plan-audit/plan-pass/plan-pass.component.html +++ b/src/app/plan-audit/plan-pass/plan-pass.component.html @@ -4,7 +4,7 @@ * @Author: sueRimn * @Date: 2021-01-18 11:13:26 * @LastEditors: sueRimn - * @LastEditTime: 2021-02-02 10:43:42 + * @LastEditTime: 2021-02-03 16:56:24 -->
diff --git a/src/app/plan-audit/realistic-picture-look/previewImg.html b/src/app/plan-audit/realistic-picture-look/previewImg.html new file mode 100644 index 0000000..1cde6b9 --- /dev/null +++ b/src/app/plan-audit/realistic-picture-look/previewImg.html @@ -0,0 +1,17 @@ +
图片详情
+
+
+
+ +
+
+
+ + +
+
+
+ +
+ +
\ No newline at end of file diff --git a/src/app/plan-audit/realistic-picture-look/realistic-picture.component.html b/src/app/plan-audit/realistic-picture-look/realistic-picture.component.html new file mode 100644 index 0000000..920eb22 --- /dev/null +++ b/src/app/plan-audit/realistic-picture-look/realistic-picture.component.html @@ -0,0 +1,32 @@ + +
+ + + + + + {{item.name}} + + +
+
+
+ + +
+
+ 暂无数据 +
+
+ + + + +
diff --git a/src/app/plan-audit/realistic-picture-look/realistic-picture.component.scss b/src/app/plan-audit/realistic-picture-look/realistic-picture.component.scss new file mode 100644 index 0000000..9eed8fb --- /dev/null +++ b/src/app/plan-audit/realistic-picture-look/realistic-picture.component.scss @@ -0,0 +1,236 @@ +*{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + scrollbar-width: none; /* Firefox */ +} +::-webkit-scrollbar { + display: none; /* Chrome Safari */ +} +.content { + //margin: 0 0 0 10px; + width: 100%; + height: 760px; + overflow-y: auto; + margin-top: 10px; + .leftBox { + flex: 15%; + padding-top: 10px; + .bank { + display: flex; + padding-left: 10px; + .mat-icon {margin-right: 15px;} + } + } + .rightBox { + border-left: 1px solid #999; + flex: 85%; + display: flex; + flex-direction: column; + .topBox { + flex: 5%; padding: 10px; + display: flex; + :first-child {flex: 85%;}; + :last-child {flex: 15%;} + } + .bottomBox { + flex: 95%; + padding: 5px 0 0 25px; + overflow: auto; + .imgsBoxflex { + display: flex; + flex-direction: row; + flex-wrap: wrap; + } + } + } +} +.tableContent{ + width: 100%; + height: 100%; + .panelhead{ + height: 44px; + background-color: #F2F9FF; + margin-top: 10px; + } + .colum{ + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + .zanwu{ + width: 100%; + height: 30px; + margin-top: 10px; + span{ + height: 40px; + margin-top: 15px; + margin-left: 5%; + font-size: 16px; + } + } + .imghe{ + width: 25%; + display: flex; + flex-direction: column; + cursor: pointer; + } + img{ + width: 140px; + height: 100px; + margin-left: 9%; + margin-top: 7%; + } + label{ + width: 140px; + margin-left: 9%; + text-align: center; + font-size: 14px; + } + input{ + width: 80%; + border: none; + outline: none; + } + } +} + +//icon统一样式 +.mat-icon { + cursor:pointer; + width: 18px; + height: 18px; + vertical-align:top; + margin-right: 10px; +} +.title {margin-right: 30px;font-weight: 500; font-size: 18px;} + +.material { + cursor:pointer; + height: 30px; + font-size: 16px; + margin-top: 10px; + padding-left: 15px; + span { + max-width: 200px; + display: inline-block; + overflow: hidden; + text-overflow:ellipsis; + white-space: nowrap; + } + .btn { + color: #FFC122; + } +} +.imgBox{ + width: 300px; + height: 200px; + margin: 0 35px 35px 0; + display: inline-block; + position: relative; + .fixedImg { + width: 100%; + height: 170px; + text-align: center; + margin-bottom: 3px; + img { + width: auto; + height: auto; + max-width: 100%; + height: 100%; + cursor:pointer; + } + } + input{ + font-size:12px; + width: 100px; + height:18px; + border-radius:3px; + border:1px solid #c8cccf; + outline:0; + text-align:left; + padding-left: 5px; + display:inline-block; + cursor: pointer;} + input::-webkit-input-placeholder{ + color: #986655; + font-size: 12px; + } + a {display: inline-block; + width: 45px; + height: 24px; + line-height: 24px; + text-align: center; + border-radius: 3px; + background-color: #2196F3; + font-size: 14px; + color: #fff;} +} +.uploadFileFixed { + position: relative; + .uploadFile { + opacity:0; + display: inline-block; + width: 88px; + height: 36px; + position: absolute; + top: 0px; + left: 0px; + } +} +//分页 +.mat-paginator { + background-color: rgba(255,255,255,0); + padding-right: 10%; +} +.isLoading{ + display: inline-block; + margin-left: 15px; + top: 8px; +} + +//左侧实景图文件样式 +.leftFile { + background-color: rgba(225,225,225,0.8); +} +//选中图片样式 +.selectImg { + -webkit-filter: drop-shadow(0px 0px 5px #000); + filter: drop-shadow(0px 0px 5px #000); + border: 1px solid red; +} +.checkedImg { + position: absolute; + top: 1px; + right: 1px; + color:#00FF00; + font-size: 30px; + z-index: 999; +} +//预览图片旋转角度 +.rotateA {transform: rotate(90deg) scale(0.75);} +.rotateB {transform: rotate(180deg)} +.rotateC {transform: rotate(270deg) scale(0.75);} + + + +//预览图片 +.previewImgBox { + width: 1500px; + height: 700px; + text-align: center; + img{ + width: auto; + height: auto; + max-width: 100%; + height: 100%;} +} +.previewImgBottom { + text-align: center; + height: 30px; + margin: 20px auto; +} diff --git a/src/app/plan-audit/realistic-picture-look/realistic-picture.component.ts b/src/app/plan-audit/realistic-picture-look/realistic-picture.component.ts new file mode 100644 index 0000000..a75ae55 --- /dev/null +++ b/src/app/plan-audit/realistic-picture-look/realistic-picture.component.ts @@ -0,0 +1,417 @@ +import { Component, OnInit, Inject, ViewChild } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { FileUploader } from 'ng2-file-upload'; +import { MatPaginator } from '@angular/material/paginator'; +import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; +import Swiper from 'swiper'; +import { Router,ActivatedRoute } from '@angular/router' + +@Component({ + selector: 'app-realistic-picture-look', + templateUrl: './realistic-picture.component.html', + styleUrls: ['./realistic-picture.component.scss'] +}) +export class RealisticPictureLookComponent implements OnInit { + uploader:FileUploader = new FileUploader({ //初始化上传文件 + url: `/api/Objects/PlanPlatform/${this.route.snapshot.queryParams.id}/RealImgs`, + method: "POST", + itemAlias: "uploadedfile", + autoUpload: false, + removeAfterUpload:true, + }); + + constructor(private router:Router,private route:ActivatedRoute,private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { } + + ngOnInit(): void { + let companyId = this.unitId + this.http.get('/api/RealityImageGroups',{params:{ + companyId : companyId + }}).subscribe((data:any)=>{ + this.allRealPicture = data + this.selectReal = data[0] + this.getAllRealPicture() + }) + + } + + unitId:any = '5e9964caa760a059e84512e9' + + companyId:any; //单位编号 + allRealPicture:any=[]; //所有实景图文件 + selectReal:any; //选中的实景图文件 + selectRealIndex:number=0; //选中的实景图文件下标 + allImages:any=[]; //实景图文件对应所有的实景图 + isDownload:boolean = false; //是否批量下载 + downloadList:any = []; //选中需要下载的图片 + + //分页 + @ViewChild(MatPaginator, {static: true}) + paginator: MatPaginator; + length:any; //共多少条数据 + pageSize:any = '12'; //每页条数 + pageSizeOptions: number[] = [12] //设置每页条数 + PageNumber:any; //第几页 + + //分页切换 + chagePage (e) { + this.PageNumber = e.pageIndex+1 + this.getAllRealPicture() + } + + //获取所有实景图分组 + getAllGrouping () { + let companyId = this.unitId + this.http.get('/api/RealityImageGroups',{params:{ + companyId : companyId + }}).subscribe((data:any)=>{ + this.allRealPicture = data + this.selectReal = data[this.selectRealIndex] + }) + } + + //获取实景图分组对应实景图 + getAllRealPicture () { + if (this.selectReal) { + let data ={ + groupId: this.selectReal.id, + PageNumber: this.PageNumber || 1, + pageSize: this.pageSize, + } + this.http.get('/api/RealityImages',{params:data}).subscribe((data:any)=>{ + this.allImages = data.items + // console.log(789,this.allImages) + this.length = data.totalCount + this.pageSize = data.pageSize + this.downloadList = [] + //console.log(this.allImages) + this.allImages.forEach(element => { //每张图片设置选中状态为false + element.newImageUrl = `/api/Objects/PlanPlatform/${element.imageUrl}?x-oss-process=image/resize,m_fill,h_170,w_299` //处理图片URL地址 + element.checked = false //图片是否选中布尔值 + element.nameStart = element.name.substring(0,element.name.lastIndexOf(".")); //图片名称前缀 + element.nameEnd = element.name.substring(element.name.lastIndexOf("."),element.name.length); //图片名称后缀 + }); + + }) + } + } + + //切换左侧实景图文件 + changeReal (e,index) { + //this.allImages=[] + if (this.selectRealIndex != index) { + this.selectReal = e + this.selectRealIndex = index + this.isDownload = false + this.downloadList = [] + this.getAllRealPicture() + } + + } + + //选择批量下载 + download () { + this.isDownload = !this.isDownload + if (!this.isDownload) { //取消批量下载时数组清空 + this.allImages.forEach(element => {element.checked = false}); + this.downloadList = [] + } + } + + // 预览图片---批量选择图片 + operation (e,index) { + if (this.isDownload) { //批量选择图片 + e.checked = !e.checked + if (e.checked==true) {this.downloadList.push(e)} + else {this.downloadList.splice(this.downloadList.findIndex(item => item.id === e.id), 1)} + } else { //预览图片 + let data = { + allImages:this.allImages, + imgIndex: index} + let dialogRef = this.dialog.open(previewImg3, + {width: '1600px', + height:'900px',data}); + dialogRef.afterClosed().subscribe(); + } + + } + + //新建实景图文件 + addReal () { + + } + + //编辑实景图文件 + editReal () { + + } + + //删除实景图文件 + delete () { + let companyId = this.unitId + if (this.selectReal) { + let isDelete = confirm('您确定要删除吗') + if (isDelete) { + this.http.delete(`/api/RealityImageGroups/${this.selectReal.id}`).subscribe(data=>{ + this.http.get('/api/RealityImageGroups',{params:{ + companyId : companyId + }}).subscribe((data:any)=>{ + this.allRealPicture = data + this.selectReal = data[this.selectRealIndex] + this.allImages = [] + this.getAllRealPicture() + }) + }) + } + } + } + + + + //实景图修改 + preservationImg (e) { + let data = { + id:e.id, + name:e.nameStart+e.nameEnd, + imageUrl:e.imageUrl, + realityImageGroupId:e.realityImageGroupId + } + this.http.put(`/api/RealityImages/${e.id}`,data).subscribe(data=>{ + this.getAllRealPicture() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('图片修改成功','确定',config); + }) + } + + //实景图删除 + deleteImg (e) { + let isDelete = confirm('您确定要删除吗') + if (isDelete) { + this.http.delete(`/api/RealityImages/${e.id}`).subscribe(data=>{ + this.getAllRealPicture() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('图片删除成功','确定',config); + }) + this.http.delete(`/api/Objects/PlanPlatform/${e.imageUrl}`).subscribe(data=>{}) + } + } + + + + + + isLoading:boolean = false; //loading加载 + //上传文件↓ + file:any; //上传的文件 + objectName:any; //上传对象名 + uploadId:any; //上传分块上传事件编号 + + //change选择文件 + uploadFile (e) { + if (this.selectReal) { + this.file = e.target.files[0] || null //上传的文件 + let URL = window.URL.createObjectURL(this.file) + var img = new Image() + img.src = URL + let that = this + img.onload = function () { + if(img.width>=4096 || img.height>=5000 ){ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + that.snackBar.open('请选择分辨率小于4096*5000的图片','确定',config); + that.uploader.clearQueue(); //清空input控件文件 + (document.getElementById('uploadFile')).value = null //清空input框缓存 + }else{ that.startUploading() } + } //onload + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择或创建实景图文件夹','确定',config); + this.uploader.clearQueue(); //清空input控件文件 + (document.getElementById('uploadFile')).value = null //清空input框缓存 + } + } + + //上传文件 + startUploading () { + let file = this.file || null //获取上传的文件 + let fileSize = file.size || null //上传文件的总大小 + let shardSize = 5 * 1024 * 1024 //5MB一个分片 + let maxdSize = 20 * 1024 * 1024 //限制20MB + + if (file && fileSize<=shardSize) { //上传文件<=5MB时 + this.uploader.queue[0].upload();//开始上传 + this.uploader.queue[0].onSuccess = (response, status, headers) => { + if (status == 201) { // 上传文件成功,上传文件后获取服务器返回的数据 + let tempRes = JSON.parse(response); + this.objectName = tempRes.objectName + this.addRealImg() + }else { // 上传文件后获取服务器返回的数据错误 + let tempRes = JSON.parse(response); + }}; + } else if (file && fileSize>shardSize && fileSize5MB时,分块上传 + let data = {filename: file.name} + this.isLoading = true + this.http.post(`/api/NewMultipartUpload/PlanPlatform/${this.companyId}/RealImgs`,{},{params:data}).subscribe((data:any)=>{ //初始化分段上传 + this.objectName = data.objectName + this.uploadId = data.uploadId + this.subsectionUploading() + }) + } + + } + + PartNumberETag:any=[]; //每次返回需要保存的信息 + //开始分段上传 + async subsectionUploading () { + let file = this.file || null //获取上传的文件 + let fileSize = file.size || null //上传文件的总大小 + let shardSize = 5 * 1024 * 1024 //5MB一个分片 + let allSlice = Math.ceil(fileSize / shardSize) //总文件/5MB===共分多少段 + + for (let i = 0;i < allSlice;i++) { //循环分段上传 + let start = i * shardSize //切割文件开始位置 + let end = Math.min(fileSize, start + shardSize); //切割文件结束位置 + let formData = new FormData() + formData.append("file",file.slice(start, end)) + + //同步写法实现异步调用 + let result = await new Promise((resolve, reject) => { + // await 需要后面返回一个 promise 对象 + this.http.post(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}&partNumber=${i+1}`,formData).subscribe((data:any)=>{ + let msg = { + "partNumber":data.partNumber || null, + "eTag": data.eTag || null} + resolve(msg) // 调用 promise 内置方法处理成功 + }) + }); + this.PartNumberETag.push(result) + if (this.PartNumberETag.length === allSlice) {this.endUploading()} + }//for循环 + + } + + //完成分块上传 + endUploading () { + let data = this.PartNumberETag + let paramsData = {uploadId:this.uploadId} + this.http.post(`/api/CompleteMultipartUpload/PlanPlatform/${this.objectName}`,data,{params:paramsData}).subscribe(data=>{ + this.addRealImg() //上传完成后,发送请求创建实景图 + this.isLoading = false + this.uploader.clearQueue(); //清空input控件文件 + this.PartNumberETag =[] //清空保存返回的信息 + }) + } + + //上传图片成功后获取url地址发送请求创建实景图 + addRealImg () { + let data = { + name: this.file.name, + imageUrl:this.objectName, + realityImageGroupId: this.selectReal.id, + } + this.http.post('/api/RealityImages',data).subscribe(data=>{ + (document.getElementById('uploadFile')).value = null //清空input框缓存 + this.getAllRealPicture() + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('图片上传成功','确定',config); + }) + } + + + + //批量下载↓ + //开始下载 + async batchDownload () { + if (this.downloadList.length) { //开始批量循环下载 + this.isLoading = true + for (let i=0;i{ + this.http.get(`/api/Objects/PlanPlatform/${this.downloadList[i].imageUrl}`,{responseType: 'blob'},).subscribe(data=>{ + let url = window.URL.createObjectURL(new Blob([data])); //createObjectURL创建一个下载Blob的url地址 + let link = document.createElement("a"); + link.style.display = "none"; + link.href = url; + link.setAttribute("download", this.downloadList[i].name); + document.body.appendChild(link); + link.click(); + result('success')}) + }) + if(i == this.downloadList.length-1) { //判断是否下载完毕 + this.isLoading = false + this.isDownload = false + this.allImages.forEach(element => {element.checked = false}); + this.downloadList = []} + + } //for循环 + } else { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请选择图片','确定',config);} + } + + + + + +} + + + +//预览图片组件 +@Component({ + selector: 'app-previewImg', + templateUrl: './previewImg.html', + styleUrls: ['./realistic-picture.component.scss'] +}) +export class previewImg3 { + + constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data) { } + testSwiper: Swiper; + + ngOnInit(): void { + this.allImages = this.data.allImages + this.allImages.forEach(element => { + element.previewImageUrl = `/api/Objects/PlanPlatform/${element.imageUrl}?x-oss-process=image/auto-orient,1` //处理图片URL地址 + }); + } + + ngAfterViewInit() { + this.testSwiper = new Swiper('.swiper-container', { + lazy: true, + initialSlide: this.data.imgIndex, + direction: 'horizontal', + loop: false, + + + + // 如果需要前进后退按钮 + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + } + }); + } + + allImages:any; //展示所有的图片 + rotationAngle:number=0; //旋转角度 + + //旋转图片 + rotate () { + this.rotationAngle = this.rotationAngle+90 + if (this.rotationAngle === 360) {this.rotationAngle = 0} + } + +} + + 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 25fc4c6..abde6ee 100644 --- a/src/app/plan-audit/wait-examineer/wait-examineer.component.html +++ b/src/app/plan-audit/wait-examineer/wait-examineer.component.html @@ -98,37 +98,37 @@ - 平面图 + - 四周毗邻 + - 消防设施 + - 重点部位 + - 功能分区 + - 实景图 + - cad + -
+
@@ -249,7 +249,7 @@
-
+
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 2bbe878..68b06df 100644 --- a/src/app/plan-audit/wait-examineer/wait-examineer.component.ts +++ b/src/app/plan-audit/wait-examineer/wait-examineer.component.ts @@ -4,7 +4,7 @@ * @Author: sueRimn * @Date: 2020-12-25 16:13:50 * @LastEditors: sueRimn - * @LastEditTime: 2021-02-02 15:05:56 + * @LastEditTime: 2021-02-03 16:24:16 */ import { Component, OnInit } from '@angular/core'; import { FormControl } from '@angular/forms'; @@ -101,7 +101,7 @@ export class WaitExamineerComponent implements OnInit { chuorzhong//判断初审还是终审 radioid//选中的id shenheTable=[]//选中要审核的对象 - showtype=0//0:word,1:全景图，2:二维三维，3:重点单位 + showtype=2//0:word,1:全景图，2:二维三维，3:重点单位 //获取表格数据 getAlltabledate(){ @@ -149,8 +149,6 @@ export class WaitExamineerComponent implements OnInit { let filename:string let fetchUrl this.http.get(`/api/PlanComponents/${item.itemId}`).subscribe((data:any)=>{ - console.log(data) - if(data.planType!=2&&data.planType!=1){ fetchUrl=data.attachmentUrls[0] var index=fetchUrl.indexOf("\/")