Browse Source

[新增]重点部位添加图片 消防设施手动输入框

zhuzhou
邵佳豪 4 years ago
parent
commit
26ae2a5bc6
  1. 2
      src/app/key-unit/edit-plan-info/edit-plan-info.component.html
  2. 2
      src/app/key-unit/edit-unit-info/edit-unit-info.component.html
  3. 109
      src/app/key-unit/fire-fighting-device/fire-fighting-device.component.html
  4. 88
      src/app/key-unit/fire-fighting-device/fire-fighting-device.component.ts
  5. 5
      src/app/key-unit/key-site/key-site.component.html
  6. 30
      src/app/key-unit/key-site/key-site.component.scss
  7. 52
      src/app/key-unit/key-site/key-site.component.ts
  8. 9
      src/app/key-unit/key-site/keysiteimgs.component.html
  9. 47
      src/app/key-unit/key-site/keysiteimgs.component.ts
  10. 2
      src/app/key-unit/view-unit-details-plan/view-unit-details-plan.component.html
  11. 2
      src/app/key-unit/view-unit-details/view-unit-details.component.html
  12. 69
      src/app/key-unit/water-road/water-road.component.ts
  13. 31
      src/app/statistic-analysis/home/home.component.html
  14. 8
      src/app/statistic-analysis/home/home.component.scss
  15. 10
      src/app/statistic-analysis/home/home.component.ts
  16. 1
      src/assets/css/newStyle.css

2
src/app/key-unit/edit-plan-info/edit-plan-info.component.html

@ -50,7 +50,7 @@
<app-router-gis></app-router-gis>
</ng-template>
</mat-tab>
<mat-tab label="9.周边水源">
<mat-tab label="9.周边水源及力量">
<ng-template matTabContent>
<app-water-road></app-water-road>
</ng-template>

2
src/app/key-unit/edit-unit-info/edit-unit-info.component.html

@ -36,7 +36,7 @@
<app-router-gis></app-router-gis>
</ng-template>
</mat-tab>
<mat-tab label="7.周边水源">
<mat-tab label="7.周边水源及力量">
<ng-template matTabContent>
<app-water-road></app-water-road>
</ng-template>

109
src/app/key-unit/fire-fighting-device/fire-fighting-device.component.html

@ -125,10 +125,115 @@
</label>
<label class="textContent">{{items.name}}</label>
<label class="textContent"><a href="javascript:void(0)" (click)='previewBuildingImg(newItem,items)'>查看图片</a></label>
<label class="totalContent">{{items.total ? items.total : '总数: 0'}}</label>
<label class="totalContent">
<span *ngIf="item.name == '消防水系统' && items.name == '供水管网'">
<input type="text" value="" [(ngModel)]="fireProtectionWaterSystem.waterSupplyNetwork.total">
</span>
<span *ngIf="item.name == '消防水系统' && items.name == '自动喷水灭火系统'">
<input type="text" value="" [(ngModel)]="fireProtectionWaterSystem.sprinklerSystem.total">
</span>
<span *ngIf="item.name == '消防灭火给水系统' && items.name == '自动喷水灭火系统'">
<input type="text" value="" [(ngModel)]="FireExtinguishingWaterSupplySystem.sprinklerSystem.total">
</span>
<span *ngIf="item.name == '消防灭火给水系统' && items.name == '气体自动灭火系统'">
<input type="text" value="" [(ngModel)]="FireExtinguishingWaterSupplySystem.AutomaticGasFireExtinguishingSystem.total">
</span>
<span *ngIf="item.name == '消防灭火给水系统' && items.name == '消防泵房'">
<input type="text" value="" [(ngModel)]="FireExtinguishingWaterSupplySystem.firePumpRoom.total">
</span>
<span *ngIf="item.name == '其它' && items.name == '排烟系统'">
<input type="text" value="" [(ngModel)]="other.purgingSystem.total">
</span>
<span *ngIf="item.name == '其它' && items.name == '灭火器'">
<input type="text" value="" [(ngModel)]="other.fireExtinguisher.total">
</span>
<span *ngIf="item.name == '其它' && items.name == '气体灭火'">
<input type="text" value="" [(ngModel)]="other.extinctionUsingGas.total">
</span>
<span *ngIf="item.name == '其它' && items.name == '消防通信'">
<input type="text" value="" [(ngModel)]="other.fireControlCommunication.total">
</span>
<span *ngIf="item.name == '消防设施' && items.name == '自动报警系统'">
<input type="text" value="" [(ngModel)]="fireFightingEquipment.automaticAlarmSystem.total">
</span>
<span *ngIf="item.name == '消防设施' && items.name == '消防泵'">
<input type="text" value="" [(ngModel)]="fireFightingEquipment.firePump.total">
</span>
<span *ngIf="item.name == '消火栓系统' && items.name == '灭火剂'">
<input type="text" value="" [(ngModel)]="hydrantSystem.fireExtinguishingAgent.total">
</span>
<span *ngIf="item.name == '消火栓系统' && items.name == '报警设施'">
<input type="text" value="" [(ngModel)]="hydrantSystem.AlarmFacilities.total">
</span>
<span *ngIf="item.name == '消火栓系统' && items.name == '消防管网'">
<input type="text" value="" [(ngModel)]="hydrantSystem.FireControlPipeNetwork.total">
</span>
<span *ngIf="item.name == '其它设施' && items.name == '优先广播'">
<input type="text" value="" [(ngModel)]="otherFacilities.givePriorityToBroadcast.total">
</span>
<span *ngIf="item.name == '其它设施' && items.name == 'VI检测仪'">
<input type="text" value="" [(ngModel)]="otherFacilities.VIdetector.total">
</span>
<span *ngIf="item.name == '其它设施' && items.name == '泡沫水喷雾系统'">
<input type="text" value="" [(ngModel)]="otherFacilities.foamWaterSpraySystem.total">
</span>
<span *ngIf="item.name == '自动消防设施' && items.name == '喷水灭火系统'">
<input type="text" value="" [(ngModel)]="automaticFireProtectionFacility.fireSprinklingSystem.total">
</span>
<span *ngIf="item.name == '自动消防设施' && items.name == '自动报警系统'">
<input type="text" value="" [(ngModel)]="automaticFireProtectionFacility.automaticAlarmSystem.total">
</span>
<span *ngIf="item.name == '自动消防设施' && items.name == '防排烟系统'">
<input type="text" value="" [(ngModel)]="automaticFireProtectionFacility.smokeControlAndExhaustSystem.total">
</span>
<span *ngIf="item.name == '自动消防设施' && items.name == '水幕系统'">
<input type="text" value="" [(ngModel)]="automaticFireProtectionFacility.waterCurtainSystem.total">
</span>
<span *ngIf="item.name == '自动消防设施' && items.name == '消防泵'">
<input type="text" value="" [(ngModel)]="automaticFireProtectionFacility.firePump.total">
</span>
<span *ngIf="item.name == '消防水源' && items.name == '消防水池'">
<input type="text" value="" [(ngModel)]="fireWaterSupply.firePool.total">
</span>
<span *ngIf="!((item.name == '消防水系统' && items.name == '供水管网') || (item.name == '消防水系统' && items.name == '自动喷水灭火系统') || (item.name == '消防灭火给水系统' && items.name == '自动喷水灭火系统') || (item.name == '消防灭火给水系统' && items.name == '气体自动灭火系统') || (item.name == '消防灭火给水系统' && items.name == '消防泵房') || (item.name == '其它' && items.name == '排烟系统') || (item.name == '其它' && items.name == '灭火器') || (item.name == '其它' && items.name == '气体灭火') || (item.name == '其它' && items.name == '消防通信') || (item.name == '消防设施' && items.name == '自动报警系统') || (item.name == '消防设施' && items.name == '消防泵') || (item.name == '消火栓系统' && items.name == '灭火剂') || (item.name == '消火栓系统' && items.name == '报警设施') || (item.name == '消火栓系统' && items.name == '消防管网') || (item.name == '其它设施' && items.name == '优先广播') || (item.name == '其它设施' && items.name == 'VI检测仪') || (item.name == '其它设施' && items.name == '泡沫水喷雾系统') || (item.name == '自动消防设施' && items.name == '喷水灭火系统') || (item.name == '自动消防设施' && items.name == '自动报警系统') || (item.name == '自动消防设施' && items.name == '防排烟系统') || (item.name == '自动消防设施' && items.name == '水幕系统') || (item.name == '自动消防设施' && items.name == '消防泵') || (item.name == '消防水源' && items.name == '消防水池'))">
{{items.total ? items.total : '总数: 0'}}
</span>
</label>
<label class="lastTextContent">
<textarea maxlength="250" [(ngModel)]="items.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防水系统' && items.name == '供水管网'" maxlength="250" [(ngModel)]="fireProtectionWaterSystem.waterSupplyNetwork.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防水系统' && items.name == '自动喷水灭火系统'" maxlength="250" [(ngModel)]="fireProtectionWaterSystem.sprinklerSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防灭火给水系统' && items.name == '自动喷水灭火系统'" maxlength="250" [(ngModel)]="FireExtinguishingWaterSupplySystem.sprinklerSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防灭火给水系统' && items.name == '气体自动灭火系统'" maxlength="250" [(ngModel)]="FireExtinguishingWaterSupplySystem.AutomaticGasFireExtinguishingSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防灭火给水系统' && items.name == '消防泵房'" maxlength="250" [(ngModel)]="FireExtinguishingWaterSupplySystem.firePumpRoom.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '其它' && items.name == '排烟系统'" maxlength="250" [(ngModel)]="other.purgingSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '其它' && items.name == '灭火器'" maxlength="250" [(ngModel)]="other.fireExtinguisher.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '其它' && items.name == '气体灭火'" maxlength="250" [(ngModel)]="other.extinctionUsingGas.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '其它' && items.name == '消防通信'" maxlength="250" [(ngModel)]="other.fireControlCommunication.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防设施' && items.name == '自动报警系统'" maxlength="250" [(ngModel)]="fireFightingEquipment.automaticAlarmSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防设施' && items.name == '消防泵'" maxlength="250" [(ngModel)]="fireFightingEquipment.firePump.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消火栓系统' && items.name == '灭火剂'" maxlength="250" [(ngModel)]="hydrantSystem.fireExtinguishingAgent.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消火栓系统' && items.name == '报警设施'" maxlength="250" [(ngModel)]="hydrantSystem.AlarmFacilities.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消火栓系统' && items.name == '消防管网'" maxlength="250" [(ngModel)]="hydrantSystem.FireControlPipeNetwork.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '其它设施' && items.name == '优先广播'" maxlength="250" [(ngModel)]="otherFacilities.givePriorityToBroadcast.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '其它设施' && items.name == 'VI检测仪'" maxlength="250" [(ngModel)]="otherFacilities.VIdetector.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '其它设施' && items.name == '泡沫水喷雾系统'" maxlength="250" [(ngModel)]="otherFacilities.foamWaterSpraySystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '自动消防设施' && items.name == '喷水灭火系统'" maxlength="250" [(ngModel)]="automaticFireProtectionFacility.fireSprinklingSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '自动消防设施' && items.name == '自动报警系统'" maxlength="250" [(ngModel)]="automaticFireProtectionFacility.automaticAlarmSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '自动消防设施' && items.name == '防排烟系统'" maxlength="250" [(ngModel)]="automaticFireProtectionFacility.smokeControlAndExhaustSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '自动消防设施' && items.name == '水幕系统'" maxlength="250" [(ngModel)]="automaticFireProtectionFacility.waterCurtainSystem.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '自动消防设施' && items.name == '消防泵'" maxlength="250" [(ngModel)]="automaticFireProtectionFacility.firePump.details" style="width: 80%;"></textarea>
<textarea *ngIf="item.name == '消防水源' && items.name == '消防水池'" maxlength="250" [(ngModel)]="fireWaterSupply.firePool.details" style="width: 80%;"></textarea>
<textarea maxlength="250" [(ngModel)]="items.details" style="width: 80%;" *ngIf="!((item.name == '消防水系统' && items.name == '供水管网') || (item.name == '消防水系统' && items.name == '自动喷水灭火系统') || (item.name == '消防灭火给水系统' && items.name == '自动喷水灭火系统') || (item.name == '消防灭火给水系统' && items.name == '气体自动灭火系统') || (item.name == '消防灭火给水系统' && items.name == '消防泵房') || (item.name == '其它' && items.name == '排烟系统') || (item.name == '其它' && items.name == '灭火器') || (item.name == '其它' && items.name == '气体灭火') || (item.name == '其它' && items.name == '消防通信') || (item.name == '消防设施' && items.name == '自动报警系统') || (item.name == '消防设施' && items.name == '消防泵') || (item.name == '消火栓系统' && items.name == '灭火剂') || (item.name == '消火栓系统' && items.name == '报警设施') || (item.name == '消火栓系统' && items.name == '消防管网') || (item.name == '其它设施' && items.name == '优先广播') || (item.name == '其它设施' && items.name == 'VI检测仪') || (item.name == '其它设施' && items.name == '泡沫水喷雾系统') || (item.name == '自动消防设施' && items.name == '喷水灭火系统') || (item.name == '自动消防设施' && items.name == '自动报警系统') || (item.name == '自动消防设施' && items.name == '防排烟系统') || (item.name == '自动消防设施' && items.name == '水幕系统') || (item.name == '自动消防设施' && items.name == '消防泵') || (item.name == '消防水源' && items.name == '消防水池'))"></textarea>
</label>
<label><mat-icon (click)='SwitchBuildingBoard(newItem,items)' *ngIf="items.isBuiltin">keyboard_arrow_down</mat-icon></label>

88
src/app/key-unit/fire-fighting-device/fire-fighting-device.component.ts

@ -233,6 +233,7 @@ export class FireFightingDeviceComponent implements OnInit {
companyId:companyId
}}).subscribe((data:any)=>{
this.allBuildingGrouping = data
console.log(888,data)
if (this.allBuildingGrouping.length) {
this.getAllBuildingFacilities()
} else {
@ -244,6 +245,55 @@ export class FireFightingDeviceComponent implements OnInit {
})
}
//消防水系统
fireProtectionWaterSystem = {
waterSupplyNetwork:{total:'666',details:'999'},//供水管网
sprinklerSystem:{total:'666',details:'999'}//自动喷水灭火系统
}
//消防灭火给水系统
FireExtinguishingWaterSupplySystem = {
sprinklerSystem:{total:'666',details:'999'},//供水管网
AutomaticGasFireExtinguishingSystem:{total:'666',details:'999'},//自动喷水灭火系统
firePumpRoom:{total:'666',details:'999'}//消防泵房
}
//其他
other = {
purgingSystem:{total:'666',details:'999'},//排烟系统
fireExtinguisher:{total:'666',details:'999'},//灭火器
extinctionUsingGas:{total:'666',details:'999'},//气体灭火
fireControlCommunication:{total:'666',details:'999'}//消防通信
}
//消防设施
fireFightingEquipment = {
automaticAlarmSystem:{total:'666',details:'999'},//自动报警系统
firePump:{total:'666',details:'999'}//消防泵
}
//消火栓系统
hydrantSystem = {
fireExtinguishingAgent:{total:'666',details:'999'},//灭火剂
AlarmFacilities:{total:'666',details:'999'},//报警设施
FireControlPipeNetwork:{total:'666',details:'999'}//消防管网
}
//其它设施
otherFacilities = {
givePriorityToBroadcast:{total:'666',details:'999'},//优先广播
VIdetector:{total:'666',details:'999'},//VI检测仪
foamWaterSpraySystem:{total:'666',details:'999'},//泡沫水喷雾系统
}
//自动消防设施
automaticFireProtectionFacility = {
fireSprinklingSystem:{total:'666',details:'999'},//喷水灭火系统
automaticAlarmSystem:{total:'666',details:'999'},//自动报警系统
smokeControlAndExhaustSystem:{total:'666',details:'999'},//防排烟系统
waterCurtainSystem:{total:'666',details:'999'},//水幕系统
firePump:{total:'666',details:'999'}//消防泵
}
//消防水源
fireWaterSupply = {
firePool:{total:'666',details:'999'}//消防水池
}
//获取所有建筑的消防设施
getAllBuildingFacilities () {
let companyId = this.route.snapshot.queryParams.id
@ -275,28 +325,32 @@ export class FireFightingDeviceComponent implements OnInit {
});
}
//保存建筑消防设施内置分组项
editBuildingGrouping (e,item) {
console.log(111,e)
console.log(222,item)
let companyId = this.route.snapshot.queryParams.id
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);
this.tabbarService.sendMessage('changeScore');//通知服务改变分数
}) }
}); //forEach
// 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);
// this.tabbarService.sendMessage('changeScore');//通知服务改变分数
// }) }
// }); //forEach
}

5
src/app/key-unit/key-site/key-site.component.html

@ -40,7 +40,10 @@
<ng-container matColumnDef="img">
<th mat-header-cell *matHeaderCellDef>图片</th>
<td mat-cell *matCellDef="let element">
<a href="javascript:void(0);" (click)='seeImg(element.imageUrls)' style="color: blue;">查看图片</a>
<a href="javascript:void(0);" (click)='seeImg(element)' style="color: blue;">查看图片</a>
<a href="javascript:;" class="file">
<input type="file" name="" id="" (change)="selectFile(element,$event)" >上传图片
</a>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>

30
src/app/key-unit/key-site/key-site.component.scss

@ -20,6 +20,35 @@ table {
}
}
.file {
position: relative;
display: inline-block;
background: #D0EEFF;
border: 1px solid #99D3F5;
border-radius: 4px;
padding: 4px 12px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
line-height: 20px;
vertical-align: middle;
margin-left: 3px;
}
.file input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
}
.file:hover {
background: #AADFFD;
border-color: #78C3F3;
color: #004974;
text-decoration: none;
}
//重点提示
.tips{
width: 75%;
@ -44,6 +73,7 @@ table {
.imgDiaLogBox{
width: 1450px;
height: 810px;
position: relative;
//预览图片
.previewImgBox {
width: 1350px;

52
src/app/key-unit/key-site/key-site.component.ts

@ -147,7 +147,7 @@ export class KeySiteComponent implements OnInit {
//查看图片
seeImg (e) {
if (e.length) {
if (e.imageUrls.length != 0) {
let data = e
const dialogRef = this.dialog.open(KeySiteImgs, {//调用open方法打开对话框并且携带参数过去
data});
@ -160,6 +160,56 @@ export class KeySiteComponent implements OnInit {
}
}
objectName:any //上传对象名
keySiteItem:any
keySiteItemImgList:any //重点部位图片集合
//上传素材图片
selectFile(element,e){
let imgFile = e.target.files[0] || null //上传的文件
this.keySiteItemImgList = element.imageUrls ? element.imageUrls : []
this.keySiteItem = element
console.log(this.keySiteItem)
this.startUploading(imgFile)
}
startUploading (imgFile) {
let _this = this
let file = imgFile || null //获取上传的文件
let fileSize = file.size || null //上传文件的总大小
let shardSize = 5 * 1024 * 1024 //5MB一个分片
let companyId = sessionStorage.getItem("companyId")
if (file && fileSize <= shardSize) { //上传文件<=5MB时
let formData = new FormData()
formData.append("file",file)
this.http.post(`api/Objects/WebPlan2D/${companyId}`,formData).subscribe((data:any)=>{
this.objectName = data.objectName
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('上传成功','确定',config)
this.keySiteItemImgList.push("/api/Objects/WebPlan2D/" + this.objectName)
this.keySiteItem.imageUrls = this.keySiteItemImgList
this.http.put(`/api/BuildingImportantLocations/${this.keySiteItem.id}`,this.keySiteItem,{
params:{
companyId : companyId
}
}).subscribe((data)=>{
// console.log(666,'修改成功')
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('修改成功','确定',config)
})
})
} else if (file && fileSize > shardSize) { //上传文件>5MB时,分块上传
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('上传图片文件不允许大于5mb','确定',config);
}
}
//封装方法获取更新当前tab页重点提示
toUpdate (e) {
let id = {buildingId:e.id}

9
src/app/key-unit/key-site/keysiteimgs.component.html

@ -1,12 +1,15 @@
<div class="imgDiaLogBox">
<div mat-dialog-title>图片详情</div>
<span *ngIf="allImages.length != 0" style="position: absolute;right: 2px;top: 2px;cursor: pointer;z-index: 200;">
<mat-icon class="hoverred" (click)="deleteImg()">delete</mat-icon>
</span>
<div class="swiper-container">
<div class="swiper-wrapper">
<div *ngFor="let item of allImages" class="swiper-slide previewImgBox">
<img [ngClass]="{'rotateA':rotationAngle==90,'rotateB':rotationAngle==180,'rotateC':rotationAngle==270} " class="swiper-lazy"
[attr.data-src]="item">
<div class="swiper-lazy-preloader"></div>
[src]="item">
<!-- <div class="swiper-lazy-preloader"></div> -->
</div>
</div>
@ -15,7 +18,7 @@
<div class="swiper-button-next"></div>
</div>
<div class="previewImgBottom">
<div class="previewImgBottom" *ngIf="allImages.length != 0">
<button type="button" mat-icon-button (click)='rotate()'><mat-icon>refresh</mat-icon></button>
</div>
</div>

47
src/app/key-unit/key-site/keysiteimgs.component.ts

@ -2,7 +2,7 @@ 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';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
@Component({
@ -14,19 +14,16 @@ import Swiper from 'swiper';
export class KeySiteImgs {
constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef<KeySiteImgs>,
@Inject(MAT_DIALOG_DATA) public data) { }
@Inject(MAT_DIALOG_DATA) public data,public snackBar: MatSnackBar) { }
testSwiper: Swiper;
ngOnInit(): void {
this.allImages = []
this.data.forEach(element => {
element = `${element}?x-oss-process=image/auto-orient,1`
this.data.imageUrls.forEach(element => {
element = `${element}`
this.allImages.push(element)
});
}
ngAfterViewInit() {
setTimeout(() => {
this.testSwiper = new Swiper('.swiper-container', {
direction: 'horizontal',
loop: false,
@ -37,6 +34,12 @@ export class KeySiteImgs {
prevEl: '.swiper-button-prev',
}
});
}, 0);
}
ngAfterViewInit() {
}
@ -49,7 +52,35 @@ export class KeySiteImgs {
if (this.rotationAngle === 360) {this.rotationAngle = 0}
}
deleteImg(){
if(this.allImages.legth != 0){
let isTrue = window.confirm('您确定要删除该图片吗?')
if(isTrue){
// this.allImages = [...this.allImages.filter((item)=>{
// return item != this.allImages[this.testSwiper.activeIndex]
// })]
//在图片循环数组中将图片去掉
this.allImages.splice(this.testSwiper.activeIndex, 1);
//更新swiper视图
setTimeout(() => {
this.testSwiper.update()
}, 0);
this.data.imageUrls = this.allImages
this.http.put(`/api/BuildingImportantLocations/${this.data.id}`,this.data,{
params:{
companyId : sessionStorage.getItem("companyId")
}
}).subscribe((data)=>{
// console.log(666,'修改成功')
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('删除成功','确定',config)
})
}
}
}
}

2
src/app/key-unit/view-unit-details-plan/view-unit-details-plan.component.html

@ -29,7 +29,7 @@
<app-router-gis></app-router-gis>
</ng-template>
</mat-tab>
<mat-tab label="7.周边水源">
<mat-tab label="7.周边水源及力量">
<ng-template matTabContent>
<app-water-road></app-water-road>
</ng-template>

2
src/app/key-unit/view-unit-details/view-unit-details.component.html

@ -49,7 +49,7 @@
<app-router-gis></app-router-gis>
</ng-template>
</mat-tab>
<mat-tab label="9.周边水源">
<mat-tab label="9.周边水源及力量">
<ng-template matTabContent>
<app-water-road></app-water-road>
</ng-template>

69
src/app/key-unit/water-road/water-road.component.ts

@ -128,20 +128,51 @@ export class WaterRoadComponent implements OnInit {
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('请选择水源类型','确定',config);
this.snackBar.open('请选择要显示的类型','确定',config);
}else{
let paramsdata:any = {
console.log('选中的内容',this.selectedWaterList)
function checkAdult(item) {
return item <= 2;
}
function checkAdult2(item) {
return item >= 3;
}
const water = this.selectedWaterList.filter(checkAdult);
const power = this.selectedWaterList.filter(checkAdult2);
console.log('water',water)
console.log('power',power)
let waterparamsdata:any = {
PageSize:99999,
Lon : this.unitData.location.x,
Lat : this.unitData.location.y,
Distance : Distance,
WaterSourceTypes :water
}
let powerparamsdata:any = {
PageSize:99999,
Lon : this.unitData.location.x,
Lat : this.unitData.location.y,
Distance : Distance,
WaterSourceTypes :this.selectedWaterList
WaterSourceTypes :power
}
// console.log('paramsdata',paramsdata)
this.http.get("/api/WaterSources",{params:paramsdata}).subscribe((data:any) => {
// console.log('所有水源',data)
if( water.length == 0 ){
this.http.get("/api/CustomFireForce",{params:powerparamsdata}).subscribe((data2:any) => {
this.createwaterMarker(data2)
})
}else if( power.length == 0 ){
this.http.get("/api/WaterSources",{params:waterparamsdata}).subscribe((data:any) => {
this.createwaterMarker(data.items)
})
}else{
this.http.get("/api/WaterSources",{params:waterparamsdata}).subscribe((data:any) => {
this.http.get("/api/CustomFireForce",{params:powerparamsdata}).subscribe((data2:any) => {
let allData = [...data.items,...data2]
this.createwaterMarker(allData)
})
})
}
}
}
@ -154,6 +185,7 @@ export class WaterRoadComponent implements OnInit {
this.waterCluster ? this.waterCluster.setData([]) : null
list.forEach((item) => {
let image
if(item.waterSourceType == 0 || item.waterSourceType == 1 || item.waterSourceType == 2){
if(item.waterSourceType == 0){//消火栓
image = '/assets/waterMarkers/市政消火栓.png'
}else if(item.waterSourceType == 1){//消防水池
@ -162,11 +194,32 @@ export class WaterRoadComponent implements OnInit {
image = '/assets/waterMarkers/天然水源.png'
}
// 用于点集合的数组
waterMarkerArrcluster.push({
item.location ? waterMarkerArrcluster.push({
lnglat : [item.location.x,item.location.y],
image : image,
data : item
})
}) : null
}else{
if(item.forceType == 2){
image = '/assets/fireForcesMarkers/其他.png'
}else if(item.level == 0){
image = '/assets/fireForcesMarkers/总队.png'
}else if(item.level == 1){
image = '/assets/fireForcesMarkers/支队.png'
}else if(item.level == 2){
image = '/assets/fireForcesMarkers/大队.png'
}else if(item.level == 3){
image = '/assets/fireForcesMarkers/中队.png'
}
// 用于点集合的数组
item.fireForceDetailInfo.location ?
waterMarkerArrcluster.push({
lnglat : [item.fireForceDetailInfo.location.x,item.fireForceDetailInfo.location.y],
image : image,
data : item
}) : null
}
})
this.map.plugin(["AMap.MarkerClusterer"],() => {
var gridSize = 60

31
src/app/statistic-analysis/home/home.component.html

@ -77,9 +77,12 @@
</div>
<!-- 右侧 -->
<div class="main-right">
<div class="box-wrap planNum" style="flex: 0.7">
<div class="box-wrap planNum" style="flex: 0.7;position: relative;">
<span style="position: absolute;right: 3px;top: 3px;color: white;cursor: pointer;" (click)="changeNumList()">
<mat-icon>autorenew</mat-icon>
</span>
<div class="panel-bd" style="padding-top: 13px;">
<div class="total-box">
<div class="total-box" *ngIf="isNumList">
<div class="total-item" (click)="threePlan()">
<div class="total-name">三维预案总数</div>
<div class="total-num">{{threePlanNum}}</div>
@ -97,6 +100,28 @@
<div class="total-num">{{otherPlanNum}}</div>
</div>
</div>
<div class="total-box" *ngIf="!isNumList">
<div class="total-item xxx">
<div class="total-name">一级预案总数</div>
<div class="total-num">{{aPlan}}</div>
</div>
<div class="total-item xxx">
<div class="total-name">二级预案总数</div>
<div class="total-num">{{bPlan}}</div>
</div>
<div class="total-item xxx">
<div class="total-name">三级预案总数</div>
<div class="total-num">{{cPlan}}</div>
</div>
<div class="total-item xxx">
<div class="total-name">四级预案总数</div>
<div class="total-num">{{dPlan}}</div>
</div>
<div class="total-item xxx">
<div class="total-name">五级预案总数</div>
<div class="total-num">{{ePlan}}</div>
</div>
</div>
</div>
</div>
<div class="box-wrap mt" style="flex: 2.3; max-height: 410px;">
@ -113,4 +138,4 @@
</div>
</div>
</div>
</div>
</div>

8
src/app/statistic-analysis/home/home.component.scss

@ -16,6 +16,10 @@
cursor: pointer;
}
.total-item div{
height: 25px!important;
line-height: 25px!important;
height: 23px!important;
line-height: 23px!important;
}
.xxx div{
height: 20px!important;
line-height: 20px!important;
}

10
src/app/statistic-analysis/home/home.component.ts

@ -292,6 +292,12 @@ export class HomeComponent implements OnInit {
cardPlanNum = "6403"
otherPlanNum = "2208"
aPlan = '328'
bPlan = '219'
cPlan = '168'
dPlan = '254'
ePlan = '116'
ngAfterViewInit(): void {
}
@ -736,4 +742,8 @@ export class HomeComponent implements OnInit {
})
}
isNumList:boolean = true
changeNumList(){
this.isNumList = !this.isNumList
}
}

1
src/assets/css/newStyle.css

@ -529,7 +529,6 @@ iframe { display: block; }
z-index:
*/
/*# sourceMappingURL=style.css.map */
@media screen and (max-width:1200px){
.main-left{

Loading…
Cancel
Save