diff --git a/src/app/data-collection/data-collection.module.ts b/src/app/data-collection/data-collection.module.ts index fe8089e..e901e7e 100644 --- a/src/app/data-collection/data-collection.module.ts +++ b/src/app/data-collection/data-collection.module.ts @@ -43,12 +43,13 @@ import {MatTooltipModule} from '@angular/material/tooltip'; import {MatTreeModule} from '@angular/material/tree'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { DataCollectionRoutingModule } from './data-collection.routing'; -import { WaterCollectionComponent } from './water-collection/water-collection.component'; -import { FireForceComponent } from './fire-force/fire-force.component'; +import { AddWater, WaterCollectionComponent } from './water-collection/water-collection.component'; +import { AddFireForce, FireForceComponent } from './fire-force/fire-force.component'; import { LinkageForcesComponent } from './linkage-forces/linkage-forces.component'; +import { NzTreeModule } from 'ng-zorro-antd/tree'; @NgModule({ - declarations: [WaterCollectionComponent, FireForceComponent, LinkageForcesComponent], + declarations: [WaterCollectionComponent, FireForceComponent, LinkageForcesComponent,AddWater,AddFireForce], imports: [ CommonModule, A11yModule, @@ -95,7 +96,8 @@ import { LinkageForcesComponent } from './linkage-forces/linkage-forces.componen ScrollingModule, FormsModule, ReactiveFormsModule, - DataCollectionRoutingModule + DataCollectionRoutingModule, + NzTreeModule ] }) export class DataCollectionModule { } diff --git a/src/app/data-collection/fire-force/addFireForce.html b/src/app/data-collection/fire-force/addFireForce.html new file mode 100644 index 0000000..f99788e --- /dev/null +++ b/src/app/data-collection/fire-force/addFireForce.html @@ -0,0 +1,15 @@ +
+
+ 新增消防力量 +
+
+
+ + {{item.name}} +
+
+
+ + +
+
\ No newline at end of file diff --git a/src/app/data-collection/fire-force/fire-force.component.html b/src/app/data-collection/fire-force/fire-force.component.html index a89a269..70d1cde 100644 --- a/src/app/data-collection/fire-force/fire-force.component.html +++ b/src/app/data-collection/fire-force/fire-force.component.html @@ -1,4 +1,4 @@ -
+
@@ -6,7 +6,7 @@ 列表过滤
- +
+
+ + + + + {{node.name}} + +
+ +
+
highlight_off
+
+ + + + + {{node.name}} +
+ +
+
highlight_off
+
+
+
{{item.name}}
-
- +
+
+
-
+
-
{{item.name}}
+
+ 详情 +
+
+ 车辆装备 +
+
+ 相关资料 +
- save保存 + save保存 open_in_browser提交审核
-
-
+ +
+ +

基本信息

- - -
- - - - * - 队伍类型: - - - - - - * - 队伍名称: - - - - - - - 值班电话: - - - - - - 辖区面积: - - - - - - - - 备注: - - - - - -
+ + + + * + 队站名称: + + + + + + 联系电话: + + + + + + 传真: + + + + + + 辖区面积: + + + + + + 备注: + + + +

位置信息

+ + + + 地址: + + + + + + 经度: + + + + 纬度: + + + + + +

人员数量

+ + + + 现役官兵人数: + + + + + + 政府专职消防员数: + + + + + + 消防文员数: + + + +

联系方式

+ + + + 总队长名称: + + + + + + 总队长联系方式: + + + + + + 总队政委姓名: + + + + + + 总队政委联系方式: + + + + + + + + 支队长姓名: + + + + + + 支队长联系方式: + + + + + + 支队政委姓名: + + + + + + 支队政委联系方式: + + + + +
+ +
+

基本信息

+ + + + * + 队站名称: + + + + + + 值班电话: + + + + + + 辖区面积: + + + + + + 备注: + + + + +

位置信息

+ + + + 地址: + + + + + + 经度: + + + + 纬度: + + + + + + +

人员数量

+ + + + 现役人数: + + + + + + 政府专职消防员数: + + + + + + 每日执勤人数: + + + + +

联系方式

+ + + + 站长姓名: + + + + + + 站长联系方式: + + + + + + 指导员姓名: + + + + + + 指导员联系方式: + + + + + + 副指导员姓名: + + + + + + 副指导员联系方式: + + + + + + 副站长一姓名: + + + + + + 副站长一联系方式: + + + + + + 副站长二姓名: + + + + + + 副站长二联系方式: + + + + + + 副站长三姓名: + + + + + + 副站长三联系方式: + + + + +
+ +
+

基本信息

+ + + + * + 队伍类型: + + + + + + * + 队伍名称: + + + + + + 管辖单位: + + + + + + + 队长: + + + + + + + 值班电话: + + + + + + 传真: + + + + + + 备注: + + + + +

位置信息

+ + + + 地址: + + + + + + 经度: + + + + 纬度: + + + + + + +

人员数量

+ + + + + 每日执勤人数: + + + + + + 消防队员总人数: + + + + + + 执勤车辆数: + +
+ + +
+
+ + + 灭火剂总量: + +
+ + +
+
+
+
+
+
-
- 车辆装备 + +
+ 车辆
-
+ +
相关资料
diff --git a/src/app/data-collection/fire-force/fire-force.component.scss b/src/app/data-collection/fire-force/fire-force.component.scss index bddd39c..4463fe4 100644 --- a/src/app/data-collection/fire-force/fire-force.component.scss +++ b/src/app/data-collection/fire-force/fire-force.component.scss @@ -14,7 +14,10 @@ width: 400px; height: 100%; background-color: #fff; + display: flex; + flex-direction: column; .topbox{ + max-height: 200px; box-sizing: border-box; padding: 10px 22px 22px; .add{ @@ -60,12 +63,16 @@ } } .contantbox{ + flex: 1; + overflow-y: auto; + display: flex; + flex-direction: column; .title{ display: flex; justify-content: space-between; width: 100%; box-sizing: border-box; - padding: 0 22px; + padding: 0 33px 0 22px; height: 36px; line-height: 36px; span{ @@ -73,6 +80,49 @@ font-weight: 500; } } + .fireForceTree{ + flex: 1; + overflow-y: auto; + .nodename{ + flex: 1; + overflow: hidden; + text-overflow:ellipsis + } + .integrity{ + width: 100px; + height: 16px; + background-color: green; + + } + .mat-tree-node{ + cursor: pointer; + } + .selectedTreeNode{ + background-color: #d2eafd; + } + .mat-tree-node:hover{ + background-color: #d2eafd; + } + .deletebtn{ + width: 26px; + text-align: center; + mat-icon{ + width: 20px; + height: 20px; + cursor: pointer; + font-size: 20px; + vertical-align: text-top; + color: rgba(49, 46, 46, 0.144); + } + mat-icon:hover{ + color: #000; + } + } + } + .paginator{ + height: 56px; + width: 100%; + } } } .mapbox{ @@ -95,10 +145,54 @@ } #map{ flex: 1; + position: relative; + #container{ + width: 100%; + height: 100%; + } + .gistopbox{ + position: absolute; + box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16); + border-radius: 5px; + top: 3px; + width: 30%; + height:40px; + background: #FFFFFF; + display: flex; + align-items: center; + cursor: default;; + .inputBox{ + width: 100%; + display: flex; + align-items: center; + justify-content: center; + box-sizing: border-box; + font-size: 14px; + .positionInput{ + border: 0; + border-radius: 6px; + width: 80%; + height: 28px; + background: #F2F2F2; + margin-left: 8px; + box-sizing: border-box; + padding-left: 10px; + } + } + + } + .hidden{ + opacity: 0; + z-index: -1; + } + .show{ + opacity: 1; + z-index: 1; + } } .detailsbox{ width: 100%; - height:520px; + height:500px; .tabsbox{ width: 100%; height: 40px; @@ -162,19 +256,100 @@ line-height: 30px; box-sizing: border-box; padding: 0 12px; - width: 63%; + width: 60%; margin-left: 5px; border: 1px solid #EBEBEB; border-radius: 5px; } textarea{ - width: 90%; + width: 89%; margin-left: 5px; height: 85%; border: 1px solid #EBEBEB; border-radius: 5px; } + .longinput{ + width: 74%; + } + .unitDiv{ + width: 60%; + position: relative; + input,select{ + width: 100%; + box-sizing: border-box; + padding-right: 50px; + } + .unit{ + position: absolute; + right: 13px; + top: 4px; + color: #000000; + opacity: 0.4; + } + } + .smallwidth{ + width: 30%; + } + } + } +} +.addWaterBox{ + width: 260px; + height: 284px; + display: flex; + flex-direction: column; + .topbox{ + width: 100%; + height: 40px; + line-height: 40px; + background-color: #2196F3; + text-align: center; + color: #FFFFFF; + font-size: 15px; + } + .contant{ + flex: 1; + box-sizing: border-box; + padding: 0 30px; + display: flex; + flex-direction: column; + justify-content: space-around; + div{ + width: 100%; + height: 36px; + line-height: 36px; + text-align: center; + background-color: #F2F4F6; + font-size: 14px; + cursor: pointer; + border: 1px solid #fff; + border-radius: 4px; + display: flex; + justify-content: center; + align-items: center; + img{ + margin-right: 3px; + } + } + .selectedDiv{ + background-color: #2196F3; + color: #fff; + border: 1px solid #2196F3; + } + } + .btnbox{ + width: 100%; + height: 50px; + box-sizing: border-box; + padding: 0px 30px; + display: flex; + align-items: flex-start;; + justify-content: space-between; + button{ + width: 80px; + height: 36px; + line-height: 36px; } } } \ No newline at end of file diff --git a/src/app/data-collection/fire-force/fire-force.component.ts b/src/app/data-collection/fire-force/fire-force.component.ts index faeb044..2e2b582 100644 --- a/src/app/data-collection/fire-force/fire-force.component.ts +++ b/src/app/data-collection/fire-force/fire-force.component.ts @@ -1,4 +1,13 @@ +import { FlatTreeControl } from '@angular/cdk/tree'; +import { HttpClient } from '@angular/common/http'; +import { Inject, Renderer2 } from '@angular/core'; +import { ElementRef } from '@angular/core'; import { Component, OnInit } from '@angular/core'; +import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; +import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree'; +import { NzTreeNode } from 'ng-zorro-antd/tree'; +import { TreeService } from 'src/app/http-interceptors/tree.service'; declare var AMap: any; @Component({ @@ -8,7 +17,7 @@ declare var AMap: any; }) export class FireForceComponent implements OnInit { - constructor() { } + constructor(private tree: TreeService,public snackBar: MatSnackBar,private http:HttpClient,private elementRef: ElementRef,public renderer2: Renderer2,public dialog: MatDialog) { } isCheckedOfSearchDiv:boolean = true//列表过滤滑块 slideChange(e){ @@ -19,6 +28,7 @@ export class FireForceComponent implements OnInit { integrityNum:'' } listIntegrityNum:any[] = [ + {id:-1,name:'全部'}, {id:0,name:'<=50%'}, {id:1,name:'50%-60%'}, {id:2,name:'60%-70%'}, @@ -30,34 +40,595 @@ export class FireForceComponent implements OnInit { {id:0,name:'总队'}, {id:1,name:'支队'}, {id:2,name:'大队'}, - {id:3,name:'中队 (消防站)'}, + {id:3,name:'中队(消防站)'}, {id:4,name:'其他消防队伍'} ] - ngOnInit(): void { + ngOnInit(): void { + this.getAllFireForce() setTimeout(() => { this.createMap() }, 0); } + //获得所有消防力量 + getAllFireForce(){ + this.http.get('/api/CustomFireForce').subscribe((data:any) => { +   this.dataSource.data = this.tree.toTree(data) + const nodes = this.treeControl.dataNodes; + const expandNodes = []; + nodes.forEach((item) => { + if(item.expandable && this.treeControl.isExpanded(item)){ + expandNodes.push(item.id); + } + }); + // this.dataSource.data = this.newdata; + let newNodes = this.treeControl.dataNodes; + newNodes = newNodes.filter(n => { + return expandNodes.indexOf(n.id) >= 0; + }); + console.log(newNodes) + newNodes.forEach(item => { + this.treeControl.expand(item); + }); + console.log('所有消防力量',data) + }) + } + private _transformer = (node, level: number) => {//要给渲染节点传那些属性参数 + return { + expandable: !!node.children && node.children.length > 0, + name: node.name, + level: level, + id: node.id, + parentId: node.parentId, + enabled:node.enabled, + order:node.order, + children:node.children, + code:node.code, + division:node.division, + fireForceDetailId:node.fireForceDetailId, + forceType:node.forceType + }; + } + treeControl = new FlatTreeControl(node => node.level, node => node.expandable); + treeFlattener = new MatTreeFlattener(this._transformer, node => node.level, node => node.expandable, node => node.children); + dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); + hasChild = (_: number, node: any) => node.expandable; + selectedFireForceId:any + selectedFireForceLevel:any + selectedFireForce:any + //选择要显示的消防力量 + selectTreeNode(node){ + console.log(node) + if(this.selectedFireForceId != node.id){ + this.clearData() + + this.selectedFireForce = node + this.selectedFireForceId = node.id + this.selectedFireForceLevel = node.level + this.FireForceDetailInfo.stationName = node.name + if(this.newPositionMarker){ + this.map.remove(this.newPositionMarker); + } + if(node.fireForceDetailId ){ + this.isPost = false//是否走post创建接口 + let type + if(node.forceType == 0){ + type = 0 + }else{ + type = 1 + } + this.http.get(`/api/FireForceDetail/${type}/${node.id}`).subscribe((data:any) => { + console.log('当前详情',data) + this.FireForceDetailInfo = data + + if(data.location && data.location.x){//如果已经标注单位坐标 + console.log('开始标注') + this.positionLngLat = data.location + this.map.setCenter([data.location.x,data.location.y]); + this.newPositionMarker = new AMap.Marker({ + position: [data.location.x,data.location.y], + content: this.newPositionMarkerContent, + offset: new AMap.Pixel(-15, -18) + }) + // 将 markers 添加到地图 + this.map.add(this.newPositionMarker); + } + if(this.selectedFireForceLevel == 0){ + this.ZongpersonCountData = JSON.parse(data.personCountData) + this.ZongcontactData = JSON.parse(data.contactData) + } + }) + }else{ + } + } + } //搜索 searchList(){ console.log(this.searchForm) + this.getAllFireForce() + } + + //js乘法 + accMul(arg1,arg2,fix) { + if(!parseInt(fix)==fix) + { + return; + } + var m=0,s1=arg1.toString(),s2=arg2.toString(); + try{m+=s1.split(".")[1].length}catch(e){} + try{m+=s2.split(".")[1].length}catch(e){} + if(m>fix){ + return (Math.round(Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m-fix))/Math.pow(10,fix)); + }else if(m<=fix){ + return (Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)).toFixed(fix); + }else{ + return (arg1*arg2).toFixed(fix).toString(); + } + } + //点击水源列表 + selectedLiIndex:any + clickWaterLi(item,index){ + // console.log(item) + // if(this.selectedLiIndex != index){ + // this.selectedLiIndex = index + // this.clearData() + // // this.selectedWaterTypeIndex = item.waterSourceType//点击的水源类型 + // this.waterData = item + // item.waterSourceType == 0 && item.detailData ? this.fireCockData = JSON.parse(item.detailData) : null + // item.waterSourceType == 1 && item.detailData ? this.poolData = JSON.parse(item.detailData) : null + // item.waterSourceType == 2 && item.detailData ? this.naturalWaterData = JSON.parse(item.detailData) : null + // this.positionLngLat = item.location + // if(this.newPositionMarker){ + // this.map.remove(this.newPositionMarker); + // } + // if(item.location.x){//如果已经标注单位坐标 + // console.log('开始标注') + + // this.map.setCenter([item.location.x,item.location.y]); + // this.newPositionMarker = new AMap.Marker({ + // position: [item.location.x,item.location.y], + // content: this.newPositionMarkerContent, + // offset: new AMap.Pixel(-15, -18) + // }) + // // 将 markers 添加到地图 + // this.map.add(this.newPositionMarker); + // } + // } + } + //完整度颜色 + integrity(width){ + let _this = this + let style:any = {} + style.width = width +'%'; + if(width < 30){ + style.background = '#FF5D4A' + } + if(width >= 30 && width < 60){ + style.background = '#FFDD00' + } + if(width >= 60){ + style.background = '#5CD64E' + } + return style + } + //删除某条消防队 + deleteWater(item,e){ + e.stopPropagation() + let isDelete = window.confirm(`确定要删除${item.name}吗`) + if(isDelete){ + // this.http.delete(`/api/WaterSources/${item.id}`).subscribe(data => { + // const config = new MatSnackBarConfig(); + // config.verticalPosition = 'top'; + // config.duration = 3000 + // this.snackBar.open('删除成功','确定',config); + // }) + } + } + //当前点击tab页面第几个 + tabIndex:any = 1 + selectedTab(index){ + this.tabIndex = index + } + + //消防力量详情提交信息 + FireForceDetailInfo:any = { + // id:'',//编号 + stationName:'',//队站名称 + isIndependentAlarm:true,//是否独立报警 + phoneNumber:'',//联系电话 + faxNumber:'',//传真 + jurisdictionArea:null,//辖区面积 + remark:'',//备注 + address:'',//地址 + location:null, + personCountData:[],//人员数量自定义 + contactData:[],//联系方式自定义 + dutyForceData:[]//执勤力量自定义 + } + //总队支队人员数量 + ZongpersonCountData:any=[ + {PropertyName :'现役官兵人数',PropertyValue:''}, + {PropertyName :'政府专职消防员数',PropertyValue:''}, + {PropertyName :'消防文员数',PropertyValue:''} + ] + //总队联系方式 + ZongcontactData:any=[ + {PropertyName :'总队长名称',PropertyValue:''}, + {PropertyName :'总队长联系方式',PropertyValue:''}, + {PropertyName :'总队政委名称',PropertyValue:''}, + {PropertyName :'总队政委联系方式',PropertyValue:''} + ] + //支队联系方式 + ZhicontactData:any=[ + {PropertyName :'支队长名称',PropertyValue:''}, + {PropertyName :'支队长联系方式',PropertyValue:''}, + {PropertyName :'支队政委名称',PropertyValue:''}, + {PropertyName :'支队政委联系方式',PropertyValue:''} + ] + //大队中队人员数量 + DaZhongpersonCountData:any=[ + {PropertyName :'现役人员',PropertyValue:''}, + {PropertyName :'政府专职消防员数',PropertyValue:''}, + {PropertyName :'每日执勤人数',PropertyValue:''} + ] + //大队中队联系方式 + DaZhongcontactData:any=[ + {PropertyName :'站长姓名',PropertyValue:''}, + {PropertyName :'站长联系方式',PropertyValue:''}, + {PropertyName :'指导员姓名',PropertyValue:''}, + {PropertyName :'指导员联系方式',PropertyValue:''}, + {PropertyName :'副指导员姓名',PropertyValue:''}, + {PropertyName :'副指导员联系方式',PropertyValue:''}, + {PropertyName :'副站长一姓名',PropertyValue:''}, + {PropertyName :'副站长一联系方式',PropertyValue:''}, + {PropertyName :'副站长二姓名',PropertyValue:''}, + {PropertyName :'副站长二联系方式',PropertyValue:''}, + {PropertyName :'副站长三姓名',PropertyValue:''}, + {PropertyName :'副站长三联系方式',PropertyValue:''} + ] + //其他消防力量联系方式 + othercontactData:any = [ + {PropertyName :'队长',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''} + ] + //其他消防力量人员数量 + otherpersonCountData:any = [ + {PropertyName :'每日执勤人数',PropertyValue:''}, + {PropertyName :'消防队员总人数',PropertyValue:''}, + {PropertyName :'执勤车辆数',PropertyValue:''}, + {PropertyName :'灭火剂总量',PropertyValue:''} + ] + //清空表单数据 + clearData(){ + this.positionLngLat = {x:'',y:''} + this.FireForceDetailInfo = { + // id:'',//编号 + stationName:'',//队站名称 + isIndependentAlarm:null,//是否独立报警 + phoneNumber:'',//联系电话 + faxNumber:'',//传真 + jurisdictionArea:null,//辖区面积 + remark:'',//备注 + address:'',//地址 + location:null, + personCountData:[],//人员数量自定义 + contactData:[],//联系方式自定义 + dutyForceData:[]//执勤力量自定义 + } + this.ZongpersonCountData = [ + {PropertyName :'现役官兵人数',PropertyValue:''}, + {PropertyName :'政府专职消防员数',PropertyValue:''}, + {PropertyName :'消防文员数',PropertyValue:''} + ] + this.ZongcontactData = [ + {PropertyName :'总队长名称',PropertyValue:''}, + {PropertyName :'总队长联系方式',PropertyValue:''}, + {PropertyName :'总队政委名称',PropertyValue:''}, + {PropertyName :'总队政委联系方式',PropertyValue:''} + ] + this.ZhicontactData = [ + {PropertyName :'支队长名称',PropertyValue:''}, + {PropertyName :'支队长联系方式',PropertyValue:''}, + {PropertyName :'支队政委名称',PropertyValue:''}, + {PropertyName :'支队政委联系方式',PropertyValue:''} + ] + this.DaZhongpersonCountData = [ + {PropertyName :'现役人员',PropertyValue:''}, + {PropertyName :'政府专职消防员数',PropertyValue:''}, + {PropertyName :'每日执勤人数',PropertyValue:''} + ] + this.DaZhongcontactData = [ + {PropertyName :'站长姓名',PropertyValue:''}, + {PropertyName :'站长联系方式',PropertyValue:''}, + {PropertyName :'指导员姓名',PropertyValue:''}, + {PropertyName :'指导员联系方式',PropertyValue:''}, + {PropertyName :'副指导员姓名',PropertyValue:''}, + {PropertyName :'副指导员联系方式',PropertyValue:''}, + {PropertyName :'副站长一姓名',PropertyValue:''}, + {PropertyName :'副站长一联系方式',PropertyValue:''}, + {PropertyName :'副站长二姓名',PropertyValue:''}, + {PropertyName :'副站长二联系方式',PropertyValue:''}, + {PropertyName :'副站长三姓名',PropertyValue:''}, + {PropertyName :'副站长三联系方式',PropertyValue:''} + ] + this.othercontactData = [ + {PropertyName :'队长',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''} + ] + this.otherpersonCountData = [ + {PropertyName :'每日执勤人数',PropertyValue:''}, + {PropertyName :'消防队员总人数',PropertyValue:''}, + {PropertyName :'执勤车辆数',PropertyValue:''}, + {PropertyName :'灭火剂总量',PropertyValue:''} + ] + } + //新增水源 + selectedFireForceTypeIndex:any//新增消防力量名称 + addFireForce(){ + if(this.selectedFireForceId){ + const dialogRef = this.dialog.open(AddFireForce, { + data: {}, + id:'addWater' + }); + dialogRef.afterClosed().subscribe( + data=>{ + if(typeof data === 'number' && !isNaN(data)){ + this.isPost = true + this.selectedFireForceTypeIndex = data + this.selectedFireForceLevel = data + // this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null + // this.positionLngLat.x = 0 + // this.positionLngLat.y = 0 + // this.map.setCity('上海市'); + this.clearData() + } + } + ); + }else{ + let config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('请先从左侧列表选择一个组织机构','确定',config); + } + } + //保存 + isPost:boolean = false//是否走post创建接口 + save(){ + if(!this.FireForceDetailInfo.stationName){ + alert('名称必填') + return + } + this.FireForceDetailInfo.jurisdictionArea = Number(this.FireForceDetailInfo.jurisdictionArea) + //如果是总支大中 + if(this.selectedFireForce.forceType == 0&&(this.selectedFireForceLevel == 0 || this.selectedFireForceLevel == 1 || this.selectedFireForceLevel == 2 || this.selectedFireForceLevel == 3)){//如果是总队 + let body = this.FireForceDetailInfo + if(this.atLastPositionLngLat.x){ + this.FireForceDetailInfo.location.x = this.atLastPositionLngLat.x + this.FireForceDetailInfo.location.y = this.atLastPositionLngLat.y + } + if(this.selectedFireForceLevel == 0){//总队 + this.FireForceDetailInfo.personCountData = JSON.stringify(this.ZongpersonCountData) + this.FireForceDetailInfo.contactData = JSON.stringify(this.ZongcontactData) + this.FireForceDetailInfo.dutyForceData = null + } + if(this.selectedFireForceLevel == 1){//支队 + this.FireForceDetailInfo.personCountData = JSON.stringify(this.ZongpersonCountData) + this.FireForceDetailInfo.contactData = JSON.stringify(this.ZhicontactData) + this.FireForceDetailInfo.dutyForceData = null + } + if(this.selectedFireForceLevel == 2 || this.selectedFireForceLevel == 3){//大队 中队 + this.FireForceDetailInfo.personCountData = JSON.stringify(this.DaZhongpersonCountData) + this.FireForceDetailInfo.contactData = JSON.stringify(this.DaZhongcontactData) + this.FireForceDetailInfo.dutyForceData = null + } + this.http.put(`/api/FireForceDetail/0/${this.selectedFireForce.id}`,body).subscribe(data => { + let config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('保存成功','确定',config); + console.log(123,data) + }) + } + //如果是其他消防力量 + else{ + if(!this.isPost){ + let body = this.FireForceDetailInfo + body.personCountData = JSON.stringify(this.otherpersonCountData) + body.contactData = JSON.stringify(this.othercontactData) + body.dutyForceData = null + this.http.put(`/api/FireForceDetail/1/${this.selectedFireForce.id}`,body).subscribe(data => { + let config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('保存成功','确定',config); + console.log(123,data) + }) + }else{ + let forceType + this.selectedFireForceTypeIndex == 4 ? forceType = 1 : null + this.selectedFireForceTypeIndex == 5 ? forceType = 2 : null + this.selectedFireForceTypeIndex == 6 ? forceType = 4 : null + let body = { + organizationId:this.selectedFireForce.id, + name:this.FireForceDetailInfo.stationName, + createTime:new Date(), + forceType:forceType + } + let params = { + organizationId : this.selectedFireForce.id + } + this.http.post('/api/CustomFireForce',body,{params:params}).subscribe((data:any) => { + console.log('创建其他消防力量成功',data) + this.getAllFireForce() + let body = this.FireForceDetailInfo + body.personCountData = JSON.stringify(this.otherpersonCountData) + body.contactData = JSON.stringify(this.othercontactData) + body.dutyForceData = null + this.http.put(`/api/FireForceDetail/1/${data.id}`,body).subscribe(data => { + this.isPost = false + let config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('保存成功','确定',config); + console.log(123,data) + }) + }) + } + + + } + + + } + map:any + placeSearch:any//构造地点查询类 + isMapLabel:boolean = false //是否已经标记坐标 + newPositionMarkerContent:any = + '
' + + ' ' + + '
' + newPositionMarkerContentBtn:any = + '
' + + ' ' + + '
|
' + + '
' //创建地图 + newPositionMarker:any//坐标实例 createMap(){ - this.map = new AMap.Map('map', { + this.map = new AMap.Map('container', { zoom:12 }) this.map.setCity('上海市'); + //输入提示 + var autoOptions = { + input: "tipinput" + }; + AMap.plugin(['AMap.PlaceSearch','AMap.AutoComplete'], ()=>{ + let auto = new AMap.AutoComplete(autoOptions); + this.placeSearch = new AMap.PlaceSearch(); //构造地点查询类 + auto.on("select", (e)=>{ + this.newPositionMarker.setPosition([e.poi.location.lng,e.poi.location.lat]) + this.positionLngLat = {x: e.poi.location.lng, y: e.poi.location.lat} + this.map.setCenter([e.poi.location.lng,e.poi.location.lat]); //设置地图中心点 + });//注册监听,当选中某条记录时会触发 + + }); + + if(this.isMapLabel){//如果已经标注单位坐标 + console.log('已标注单位位置') + // this.map.setCenter([this.unitinfo.location.x,this.unitinfo.location.y]); + // this.oldPositionMarker = new AMap.Marker({ + // position: [this.unitinfo.location.x,this.unitinfo.location.y], + // content: this.newPositionMarkerContent, + // offset: new AMap.Pixel(-15, -18) + // }) + // // 将 markers 添加到地图 + // this.map.add(this.oldPositionMarker); + }else{ + console.log('未标注单位位置') + // this.map.setCity('上海市'); + } } + //点击位置 + isGisTopBox:boolean = false // + searchTitle:any = ''// - tabsList:any[] = [ - {type:0,name:'详情'}, - {type:1,name:'车辆装备'}, - {type:2,name:'相关资料'}, - ] - selectedBtn:number = 0//选择的tabs - clickTab(typeNum){ - this.selectedBtn = typeNum + positionLngLat:any = {}//临时坐标点 + atLastPositionLngLat:any = {}//最终坐标点 + setPosition(){ + if(!this.isGisTopBox){ + this.isGisTopBox = true + this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null + let center + console.log() + if(this.newPositionMarker && this.atLastPositionLngLat.x){//如果已经标注单位坐标 + console.log(1) + center = [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y] + }else if(this.newPositionMarker && !this.atLastPositionLngLat.x && this.FireForceDetailInfo.location.x){ + console.log(2) + center = [this.FireForceDetailInfo.location.x, this.FireForceDetailInfo.location.y] + }else{ + console.log(3) + center = this.map.getCenter(); //获取当前地图中心位置 + } + this.newPositionMarker = new AMap.Marker({ + draggable: true, + position: center, + content: this.newPositionMarkerContentBtn, + offset: new AMap.Pixel(-15, -18) + }); + this.positionLngLat = {x: center.lng || center[0], y: center.lat || center[1]} + this.map.add(this.newPositionMarker); + this.isMapLabel = true + this.newPositionMarker.on('dragend', (e)=>{ + this.positionLngLat = {x: e.lnglat.lng, y: e.lnglat.lat} + }) + //点击确定 + this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionOk'),'click',(event)=>{ + this.isGisTopBox = false + this.map.remove(this.newPositionMarker) + this.newPositionMarker = new AMap.Marker({ + position: [this.positionLngLat.x,this.positionLngLat.y], + content: this.newPositionMarkerContent, + offset: new AMap.Pixel(-15, -18) + }); + this.atLastPositionLngLat = JSON.parse(JSON.stringify(this.positionLngLat)) + this.map.add(this.newPositionMarker); + this.positionLngLat = this.atLastPositionLngLat + }) + this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionClose'),'click',(event)=>{ + this.isGisTopBox = false + this.map.remove(this.newPositionMarker) + if(this.positionLngLat.x && this.positionLngLat.x != 0 && !this.atLastPositionLngLat.x){//直接取消 + this.map.remove(this.newPositionMarker) + this.positionLngLat = {} + this.atLastPositionLngLat = {} + }else{ + this.newPositionMarker = new AMap.Marker({ + position: [this.atLastPositionLngLat.x,this.atLastPositionLngLat.y], + content: this.newPositionMarkerContent, + offset: new AMap.Pixel(-15, -18) + }); + this.map.setCenter([this.atLastPositionLngLat.x,this.atLastPositionLngLat.y]); //设置地图中心点 + this.map.add(this.newPositionMarker); + this.positionLngLat = this.atLastPositionLngLat + } + })//取消 + } + } } + + + +//新增水源弹出框 +@Component({ + selector: 'addwater', + templateUrl: './addFireForce.html', + styleUrls: ['./fire-force.component.scss'] +}) +export class AddFireForce { + + constructor(private http: HttpClient,public dialogRef: MatDialogRef,@Inject(MAT_DIALOG_DATA) public data,public snackBar: MatSnackBar) {} + + + addList:any = [ + {id:4, name:'微型消防站'}, + {id:5, name:'企业专职消防站'}, + {id:6, name:'义务(志愿)消防站'} + ] + selectedFireForceTypeIndex:any = 4 + selecteAddType(item,key){ + this.selectedFireForceTypeIndex = item.id + + } + ngOnInit(): void { + + } + + confirm(){ + this.dialogRef.close(this.selectedFireForceTypeIndex) + } + +} \ No newline at end of file diff --git a/src/app/data-collection/water-collection/addWater.html b/src/app/data-collection/water-collection/addWater.html new file mode 100644 index 0000000..03099b1 --- /dev/null +++ b/src/app/data-collection/water-collection/addWater.html @@ -0,0 +1,12 @@ +
+
+ 新增水源 +
+
+
{{item.name}}
+
+
+ + +
+
\ No newline at end of file diff --git a/src/app/data-collection/water-collection/water-collection.component.html b/src/app/data-collection/water-collection/water-collection.component.html index c3e7cc6..542ed80 100644 --- a/src/app/data-collection/water-collection/water-collection.component.html +++ b/src/app/data-collection/water-collection/water-collection.component.html @@ -6,7 +6,7 @@ 列表过滤
- +
@@ -51,18 +69,21 @@
-
+
-
消火栓
+
+ 消火栓 + 消防水池 + 天然水源 +
- save保存 + save保存 open_in_browser提交审核
-

基本信息

@@ -70,21 +91,19 @@ * 名称: - + - - 行政区: - + 水源归属: - @@ -93,7 +112,7 @@ 所属单位(小区): - +

位置信息

@@ -102,7 +121,7 @@ 地址: - + @@ -120,12 +139,13 @@

详细信息

- + + 可用状态: - @@ -135,16 +155,16 @@ 放置形式: - - 管网状态: + 管网形式: - @@ -155,20 +175,23 @@ 管网直径: - +
+ + mm +
管网压力类型: - @@ -178,13 +201,16 @@ 管网压力范围: - +
+ + Mpa +
接口形式: - @@ -194,36 +220,214 @@ 接口口径: - +
+ + mm +
+
最大流量: - +
+ + L/s +
+
+ + + 供水单位: + + + + + + 联系方式: + + + + + + 备注: + + + +
+ + + + + 可用状态: + + + + + + 储水量: + +
+ + +
+
+ + + 取水最大流量: + +
+ + L/s +
+
+ + + 进水流量: + +
+ + L/s +
+
+ + + 同时取水车辆数: + + + + + + 水源标高差: + +
+ + m +
+
+ + + 补水时间: + + + + + + 管网形式: + + + + + + 供水单位: + + + + + + 联系方式: + + + + + + 备注: + + + +
+ + + + + 可用状态: + + + + + + 天然水源类型: + + + + + + 有无消防码头: + + + + + + 水质: + + + + + + 同时取水车辆数: + + + + + + 水源标高差: + +
+ + m +
+
+ + + 有无枯水期: + + + + + + 枯水期时间: + + 供水单位: - + 联系方式: - + 备注: - +
diff --git a/src/app/data-collection/water-collection/water-collection.component.scss b/src/app/data-collection/water-collection/water-collection.component.scss index 4dc2a6c..debc2c4 100644 --- a/src/app/data-collection/water-collection/water-collection.component.scss +++ b/src/app/data-collection/water-collection/water-collection.component.scss @@ -14,7 +14,10 @@ width: 400px; height: 100%; background-color: #fff; + display: flex; + flex-direction: column; .topbox{ + max-height: 200px; box-sizing: border-box; padding: 10px 22px 22px; .add{ @@ -60,12 +63,16 @@ } } .contantbox{ + flex: 1; + overflow-y: auto; + display: flex; + flex-direction: column; .title{ display: flex; justify-content: space-between; width: 100%; box-sizing: border-box; - padding: 0 22px; + padding: 0 33px 0 22px; height: 36px; line-height: 36px; span{ @@ -73,6 +80,74 @@ font-weight: 500; } } + .waterList{ + flex: 1; + overflow-y: auto; + li{ + cursor: pointer; + width: 100%; + height: 36px; + line-height: 36px; + display: flex; + align-items: center; + font-size: 14px; + div{ + float: left; + box-sizing: border-box; + } + .address{ + text-align: left; + width: 60%; + padding-left: 22px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + .integrity{ + height: 58%; + width: 32%; + position: relative; + background-color: #F2F4F6; + .integrityNum{ + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + color: black; + font-size: 13px; + cursor: default; + } + .integrityColorDiv{ + height: 100%; + } + } + .deletebtn{ + flex: 1; + text-align: center; + mat-icon{ + width: 20px; + height: 20px; + cursor: pointer; + font-size: 20px; + vertical-align: text-top; + color: rgba(49, 46, 46, 0.144); + } + mat-icon:hover{ + color: #000; + } + } + } + li:hover{ + background-color: #b3d3ee; + } + .selectedLi{ + background-color: #b3d3ee; + } + } + .paginator{ + height: 56px; + width: 100%; + } } } .mapbox{ @@ -218,7 +293,85 @@ border: 1px solid #EBEBEB; border-radius: 5px; } + .longinput{ + width: 74%; + } + .unitDiv{ + width: 60%; + position: relative; + input,select{ + width: 100%; + box-sizing: border-box; + padding-right: 50px; + } + .unit{ + position: absolute; + right: 13px; + top: 4px; + color: #000000; + opacity: 0.4; + } + } + } + } +} +.addWaterBox{ + width: 260px; + height: 284px; + display: flex; + flex-direction: column; + .topbox{ + width: 100%; + height: 40px; + line-height: 40px; + background-color: #2196F3; + text-align: center; + color: #FFFFFF; + font-size: 15px; + } + .contant{ + flex: 1; + box-sizing: border-box; + padding: 0 30px; + display: flex; + flex-direction: column; + justify-content: space-around; + div{ + width: 100%; + height: 36px; + line-height: 36px; + text-align: center; + background-color: #F2F4F6; + font-size: 14px; + cursor: pointer; + border: 1px solid #fff; + border-radius: 4px; + display: flex; + justify-content: center; + align-items: center; + img{ + margin-right: 3px; + } + } + .selectedDiv{ + background-color: #2196F3; + color: #fff; + border: 1px solid #2196F3; + } + } + .btnbox{ + width: 100%; + height: 50px; + box-sizing: border-box; + padding: 0px 30px; + display: flex; + align-items: flex-start;; + justify-content: space-between; + button{ + width: 80px; + height: 36px; + line-height: 36px; } } } \ No newline at end of file diff --git a/src/app/data-collection/water-collection/water-collection.component.ts b/src/app/data-collection/water-collection/water-collection.component.ts index d013c7d..17dd475 100644 --- a/src/app/data-collection/water-collection/water-collection.component.ts +++ b/src/app/data-collection/water-collection/water-collection.component.ts @@ -1,6 +1,9 @@ -import { Renderer2 } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { Inject, Renderer2 } from '@angular/core'; import { ElementRef } from '@angular/core'; import { Component, OnInit } from '@angular/core'; +import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; declare var AMap: any; @Component({ @@ -10,7 +13,7 @@ declare var AMap: any; }) export class WaterCollectionComponent implements OnInit { - constructor(private elementRef: ElementRef,public renderer2: Renderer2) { } + constructor(public snackBar: MatSnackBar,private http:HttpClient,private elementRef: ElementRef,public renderer2: Renderer2,public dialog: MatDialog) { } isCheckedOfSearchDiv:boolean = true//列表过滤滑块 slideChange(e){ @@ -21,6 +24,7 @@ export class WaterCollectionComponent implements OnInit { integrityNum:'' } listIntegrityNum:any[] = [ + {id:-1,name:'全部'}, {id:0,name:'<=50%'}, {id:1,name:'50%-60%'}, {id:2,name:'60%-70%'}, @@ -34,24 +38,328 @@ export class WaterCollectionComponent implements OnInit { {id:2,name:'天然水源'} ] ngOnInit(): void { + this.getAllWaterData() setTimeout(() => { this.createMap() }, 0); } + //获得所有水源 + addWaterListData:any + dataLength:any //获取的数据一共多少条 + PageNumber:any = 1 //当前第几页 + getAllWaterData(){ + let MinIntegrity = 0 + let MaxIntegrity = 1.1 + if(this.searchForm.integrityNum == '0'){ + MinIntegrity = 0 + MaxIntegrity = 0.5 + }else if(this.searchForm.integrityNum == '1'){ + MinIntegrity = 0.5 + MaxIntegrity = 0.6 + }else if(this.searchForm.integrityNum == '2'){ + MinIntegrity = 0.6 + MaxIntegrity = 0.7 + }else if(this.searchForm.integrityNum == '3'){ + MinIntegrity = 0.7 + MaxIntegrity = 0.8 + }else if(this.searchForm.integrityNum == '4'){ + MinIntegrity = 0.8 + MaxIntegrity = 0.9 + }else if(this.searchForm.integrityNum == '5'){ + MinIntegrity = 0.9 + MaxIntegrity = 1.1 + }else if(this.searchForm.integrityNum == '-1'){ + MinIntegrity = 0 + MaxIntegrity = 1.1 + } + let params:any = { + Keyword : this.searchForm.name, + PageSize : 30, + PageNumber : this.PageNumber, + MinIntegrity : MinIntegrity, + MaxIntegrity : MaxIntegrity + } + this.http.get('/api/WaterSources',{params:params}).subscribe((data:any) => { + this.addWaterListData = data + this.dataLength = data.totalCount + console.log('所有水源',data) + }) + } //搜索 searchList(){ console.log(this.searchForm) + this.getAllWaterData() + } + //分页事件 + chagePage(e){ + this.PageNumber = e.pageIndex+1 + this.getAllWaterData() + } + //js乘法 + accMul(arg1,arg2,fix) { + if(!parseInt(fix)==fix) + { + return; + } + var m=0,s1=arg1.toString(),s2=arg2.toString(); + try{m+=s1.split(".")[1].length}catch(e){} + try{m+=s2.split(".")[1].length}catch(e){} + if(m>fix){ + return (Math.round(Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m-fix))/Math.pow(10,fix)); + }else if(m<=fix){ + return (Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)).toFixed(fix); + }else{ + return (arg1*arg2).toFixed(fix).toString(); + } + } + //点击水源列表 + selectedLiIndex:any + clickWaterLi(item,index){ + console.log(item) + if(this.selectedLiIndex != index){ + this.selectedLiIndex = index + this.clearData() + this.selectedWaterTypeIndex = item.waterSourceType//点击的水源类型 + this.waterData = item + item.waterSourceType == 0 && item.detailData ? this.fireCockData = JSON.parse(item.detailData) : null + item.waterSourceType == 1 && item.detailData ? this.poolData = JSON.parse(item.detailData) : null + item.waterSourceType == 2 && item.detailData ? this.naturalWaterData = JSON.parse(item.detailData) : null + this.positionLngLat = item.location + if(this.newPositionMarker){ + this.map.remove(this.newPositionMarker); + } + if(item.location.x){//如果已经标注单位坐标 + console.log('开始标注') + + this.map.setCenter([item.location.x,item.location.y]); + this.newPositionMarker = new AMap.Marker({ + position: [item.location.x,item.location.y], + content: this.newPositionMarkerContent, + offset: new AMap.Pixel(-15, -18) + }) + // 将 markers 添加到地图 + this.map.add(this.newPositionMarker); + } + } + } + //完整度颜色 + integrity(width){ + let _this = this + let style:any = {} + style.width = width +'%'; + if(width < 30){ + style.background = '#FF5D4A' + } + if(width >= 30 && width < 60){ + style.background = '#FFDD00' + } + if(width >= 60){ + style.background = '#5CD64E' + } + return style + } + //删除某条水源 + deleteWater(item,e){ + e.stopPropagation() + let isDelete = window.confirm('确定要删除此条水源信息吗') + if(isDelete){ + this.http.delete(`/api/WaterSources/${item.id}`).subscribe(data => { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.addWaterListData.items = this.addWaterListData.items.filter(x => { + return item.id != x.id + }) + this.dataLength = this.dataLength - 1 + // this.getAllWaterData() + this.snackBar.open('删除成功','确定',config); + }) + } + } + waterData:any = { + id:null, + name:'', + administrativeRegion:'',//行政区 + governmentLevel:'',//水源归属 + village:'',//所属单位(小区) + address:'', + location:{x:'',y:''}, + detailData:'',//详细信息 + createTime:'', + creatorId:'' } + //消火栓详细信息 + fireCockData:any = [ + {PropertyName :'可用状态',PropertyValue:''}, + {PropertyName :'放置形式',PropertyValue:''}, + {PropertyName :'管网形式',PropertyValue:''}, + {PropertyName :'管网直径',PropertyValue:''}, + {PropertyName :'管网压力类型',PropertyValue:''}, + {PropertyName :'管网压力范围',PropertyValue:''}, + {PropertyName :'接口形式',PropertyValue:''}, + {PropertyName :'接口口径',PropertyValue:''}, + {PropertyName :'最大流量',PropertyValue:''}, + {PropertyName :'供水单位',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''}, + {PropertyName :'备注',PropertyValue:''} + ] + //消防水池详细信息 + poolData:any = [ + {PropertyName :'可用状态',PropertyValue:''}, + {PropertyName :'储水量',PropertyValue:''}, + {PropertyName :'取水最大流量',PropertyValue:''}, + {PropertyName :'进水流量',PropertyValue:''}, + {PropertyName :'同时取水车辆数',PropertyValue:''}, + {PropertyName :'水源标高差',PropertyValue:''}, + {PropertyName :'补水时间',PropertyValue:''}, + {PropertyName :'管网形式',PropertyValue:''}, + {PropertyName :'供水单位',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''}, + {PropertyName :'备注',PropertyValue:''} + ] + //天然水源详细信息 + naturalWaterData:any = [ + {PropertyName :'可用状态',PropertyValue:''}, + {PropertyName :'天然水源类型',PropertyValue:''}, + {PropertyName :'有无消防码头',PropertyValue:''}, + {PropertyName :'水质',PropertyValue:''}, + {PropertyName :'同时取水车辆数',PropertyValue:''}, + {PropertyName :'水源标高差',PropertyValue:''}, + {PropertyName :'有无枯水期',PropertyValue:''}, + {PropertyName :'枯水期时间',PropertyValue:''}, + {PropertyName :'供水单位',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''}, + {PropertyName :'备注',PropertyValue:''} + ] + //清空表单数据 + clearData(){ + this.waterData = { + id:null, + name:'', + administrativeRegion:'',//行政区 + governmentLevel:'',//水源归属 + village:'',//所属单位(小区) + address:'', + location:{x:'',y:''}, + detailData:'',//详细信息 + createTime:'', + creatorId:'' + } + this.fireCockData = [ + {PropertyName :'可用状态',PropertyValue:''}, + {PropertyName :'放置形式',PropertyValue:''}, + {PropertyName :'管网形式',PropertyValue:''}, + {PropertyName :'管网直径',PropertyValue:''}, + {PropertyName :'管网压力类型',PropertyValue:''}, + {PropertyName :'管网压力范围',PropertyValue:''}, + {PropertyName :'接口形式',PropertyValue:''}, + {PropertyName :'接口口径',PropertyValue:''}, + {PropertyName :'最大流量',PropertyValue:''}, + {PropertyName :'供水单位',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''}, + {PropertyName :'备注',PropertyValue:''} + ] + + this.poolData = [ + {PropertyName :'可用状态',PropertyValue:''}, + {PropertyName :'储水量',PropertyValue:''}, + {PropertyName :'取水最大流量',PropertyValue:''}, + {PropertyName :'进水流量',PropertyValue:''}, + {PropertyName :'同时取水车辆数',PropertyValue:''}, + {PropertyName :'水源标高差',PropertyValue:''}, + {PropertyName :'补水时间',PropertyValue:''}, + {PropertyName :'管网形式',PropertyValue:''}, + {PropertyName :'供水单位',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''}, + {PropertyName :'备注',PropertyValue:''} + ] + this.naturalWaterData = [ + {PropertyName :'可用状态',PropertyValue:''}, + {PropertyName :'天然水源类型',PropertyValue:''}, + {PropertyName :'有无消防码头',PropertyValue:''}, + {PropertyName :'水质',PropertyValue:''}, + {PropertyName :'同时取水车辆数',PropertyValue:''}, + {PropertyName :'水源标高差',PropertyValue:''}, + {PropertyName :'有无枯水期',PropertyValue:''}, + {PropertyName :'枯水期时间',PropertyValue:''}, + {PropertyName :'供水单位',PropertyValue:''}, + {PropertyName :'联系方式',PropertyValue:''}, + {PropertyName :'备注',PropertyValue:''} + ] + } + //新增水源 + selectedWaterTypeIndex:any//新增水源类型 + addWater(){ + const dialogRef = this.dialog.open(AddWater, { + data: {}, + id:'addWater' + }); + dialogRef.afterClosed().subscribe( + data=>{ + if(typeof data === 'number' && !isNaN(data)){ + this.selectedWaterTypeIndex = data + this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null + this.positionLngLat.x = 0 + this.positionLngLat.y = 0 + this.map.setCity('上海市'); + this.clearData() + } + } + ); + } + //保存水源 + save(){ + if(!this.waterData.name){ + alert('名称必填') + return + } + this.selectedWaterTypeIndex == '0' ? this.waterData.detailData = JSON.stringify(this.fireCockData) : null + this.selectedWaterTypeIndex == '1' ? this.waterData.detailData = JSON.stringify(this.poolData) : null + this.selectedWaterTypeIndex == '2' ? this.waterData.detailData = JSON.stringify(this.naturalWaterData) : null + this.waterData.waterSourceType = Number(this.selectedWaterTypeIndex) + + this.waterData.createTime = new Date() + + + if(this.waterData.id){ + if(this.atLastPositionLngLat.x){ + this.waterData.location.x = this.atLastPositionLngLat.x + this.waterData.location.y = this.atLastPositionLngLat.y + } + this.http.put(`/api/WaterSources/${this.waterData.id}`,this.waterData).subscribe(data => { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('修改成功','确定',config); + this.selectedLiIndex = 0 + this.getAllWaterData() + }) + }else{ + this.waterData.location.x = this.atLastPositionLngLat.x + this.waterData.location.y = this.atLastPositionLngLat.y + this.http.post('/api/WaterSources',this.waterData).subscribe(data => { + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('保存成功','确定',config); + this.selectedLiIndex = 0 + this.waterData = data + this.getAllWaterData() + }) + } + + } + map:any placeSearch:any//构造地点查询类 isMapLabel:boolean = false //是否已经标记坐标 newPositionMarkerContent:any = '
' + - ' ' + + ' ' + '
' newPositionMarkerContentBtn:any = '
' + - ' ' + + ' ' + '
|
' + '
' //创建地图 @@ -97,17 +405,19 @@ export class WaterCollectionComponent implements OnInit { positionLngLat:any = {}//临时坐标点 atLastPositionLngLat:any = {}//最终坐标点 - - - setPosition(){ if(!this.isGisTopBox){ this.isGisTopBox = true this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null let center if(this.newPositionMarker && this.atLastPositionLngLat.x){//如果已经标注单位坐标 + console.log(1) center = [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y] + }else if(this.newPositionMarker && !this.atLastPositionLngLat.x && this.waterData.location.x){ + console.log(2) + center = [this.waterData.location.x, this.waterData.location.y] }else{ + console.log(3) center = this.map.getCenter(); //获取当前地图中心位置 } this.newPositionMarker = new AMap.Marker({ @@ -157,3 +467,35 @@ export class WaterCollectionComponent implements OnInit { } } + + +//新增水源弹出框 +@Component({ + selector: 'addwater', + templateUrl: './addWater.html', + styleUrls: ['./water-collection.component.scss'] +}) +export class AddWater { + + constructor(private http: HttpClient,public dialogRef: MatDialogRef,@Inject(MAT_DIALOG_DATA) public data,public snackBar: MatSnackBar) {} + + + addList:any = [ + {name:'消火栓',src:'/assets/images/市政消火栓.png'}, + {name:'消防水池',src:'/assets/images/方形储水池.png'}, + {name:'天然水源',src:'/assets/images/天然水源.png'} + ] + selectedWaterTypeIndex:any = 0 + selecteAddType(item,key){ + this.selectedWaterTypeIndex = key + } + ngOnInit(): void { + + } + + confirm(){ + console.log(this.selectedWaterTypeIndex) + this.dialogRef.close(this.selectedWaterTypeIndex) + } + +} diff --git a/src/app/pages/login/login.component.ts b/src/app/pages/login/login.component.ts index 1a38a1d..2f7db1f 100644 --- a/src/app/pages/login/login.component.ts +++ b/src/app/pages/login/login.component.ts @@ -30,7 +30,6 @@ export class LoginComponent implements OnInit { sessionStorage.setItem("level",data.level); sessionStorage.setItem("token",data.token); sessionStorage.setItem("refreshToken",data.refreshToken); - // this.router.navigate([`/home`]) this.http.get('/api/Account/NavMenus').subscribe((data:any)=>{ let isHave = data.find(item=>{ return item.url == "/home"}) diff --git a/src/app/plan-management/entry-plan/entry-plan.component.html b/src/app/plan-management/entry-plan/entry-plan.component.html index 81cd56c..6cd5933 100644 --- a/src/app/plan-management/entry-plan/entry-plan.component.html +++ b/src/app/plan-management/entry-plan/entry-plan.component.html @@ -254,7 +254,7 @@ 操作 - 查看预案 + 查看预案 diff --git a/src/assets/images/天然水源.png b/src/assets/images/天然水源.png new file mode 100644 index 0000000..7186250 Binary files /dev/null and b/src/assets/images/天然水源.png differ diff --git a/src/assets/images/定位.png b/src/assets/images/定位.png new file mode 100644 index 0000000..db62e86 Binary files /dev/null and b/src/assets/images/定位.png differ diff --git a/src/assets/images/市政消火栓.png b/src/assets/images/市政消火栓.png new file mode 100644 index 0000000..2abf272 Binary files /dev/null and b/src/assets/images/市政消火栓.png differ diff --git a/src/assets/images/方形储水池.png b/src/assets/images/方形储水池.png new file mode 100644 index 0000000..1f97e3e Binary files /dev/null and b/src/assets/images/方形储水池.png differ diff --git a/src/styles.scss b/src/styles.scss index b3a6905..607f9ff 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -129,7 +129,7 @@ table td.mat-footer-cell:last-of-type{ } //弹出框样式取消padding -#shareDialog,#lookPlanDialog,#openPlanToolDialog{ +#shareDialog,#lookPlanDialog,#openPlanToolDialog,#addWater{ padding: 0; } @@ -169,4 +169,16 @@ table td.mat-footer-cell:last-of-type{ .custom-content-marker .close-btn:hover{ background: #666; } -} \ No newline at end of file +} +#fireForceTree{ + .mat-tree-node{ + min-height: 40px; + flex: none; + box-sizing: border-box; + } + .mat-icon-button{ + width: 30px; + height: 30px; + line-height: 30px; + } +}