shaojiahao
/
ShangHaiYuan-AnXin
2
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'master' of http://39.106.78.171:3000/shaojiahao/ShangHaiYuan-AnXin

dev
chenjingyu 4 years ago
parent
529c7e4bf9 5786ca80d8
commit
c163259b79
45 changed files with 3232 additions and 590 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 10
      src/app/data-collection/data-collection.module.ts
  2. 15
      src/app/data-collection/fire-force/addFireForce.html
  3. 512
      src/app/data-collection/fire-force/fire-force.component.html
  4. 337
      src/app/data-collection/fire-force/fire-force.component.scss
  5. 623
      src/app/data-collection/fire-force/fire-force.component.ts
  6. 12
      src/app/data-collection/water-collection/addWater.html
  7. 434
      src/app/data-collection/water-collection/water-collection.component.html
  8. 359
      src/app/data-collection/water-collection/water-collection.component.scss
  9. 488
      src/app/data-collection/water-collection/water-collection.component.ts
  10. 29
      src/app/gis-management/gis-labeling/gis-labeling.component.ts
  11. 37
      src/app/key-unit/allaround/allaround.component.html
  12. 9
      src/app/key-unit/allaround/allaround.component.ts
  13. 94
      src/app/key-unit/fire-fighting-device-look/fire-fighting-device.component.html
  14. 10
      src/app/key-unit/fire-fighting-device-look/fire-fighting-device.component.ts
  15. 94
      src/app/key-unit/fire-fighting-device/fire-fighting-device.component.html
  16. 10
      src/app/key-unit/fire-fighting-device/fire-fighting-device.component.ts
  17. 53
      src/app/key-unit/function-division-look/function-division.component.html
  18. 6
      src/app/key-unit/function-division-look/function-division.component.ts
  19. 51
      src/app/key-unit/function-division/function-division.component.html
  20. 7
      src/app/key-unit/function-division/function-division.component.ts
  21. 57
      src/app/key-unit/key-site-look/key-site.component.html
  22. 7
      src/app/key-unit/key-site-look/key-site.component.ts
  23. 57
      src/app/key-unit/key-site/key-site.component.html
  24. 7
      src/app/key-unit/key-site/key-site.component.ts
  25. 3
      src/app/key-unit/key-unit-management/key-unit-management.component.html
  26. 1
      src/app/pages/login/login.component.ts
  27. 58
      src/app/plan-audit/plan-pass/plan-pass.component.html
  28. 2
      src/app/plan-management/entry-plan/entry-plan.component.html
  29. 13
      src/app/ui/organization/addOffices.html
  30. 11
      src/app/ui/organization/createorganization.component.html
  31. 13
      src/app/ui/organization/editOffices.html
  32. 94
      src/app/ui/organization/organization.component.html
  33. 38
      src/app/ui/organization/organization.component.scss
  34. 124
      src/app/ui/organization/organization.component.ts
  35. 4
      src/app/ui/ui.module.ts
  36. 14
      src/app/ui/usermanagement/createUser.html
  37. 14
      src/app/ui/usermanagement/editUser.html
  38. 5
      src/app/ui/usermanagement/usermanagement.component.html
  39. 21
      src/app/ui/usermanagement/usermanagement.component.scss
  40. 53
      src/app/ui/usermanagement/usermanagement.component.ts
  41. BIN
      src/assets/images/天然水源.png
  42. BIN
      src/assets/images/定位.png
  43. BIN
      src/assets/images/市政消火栓.png
  44. BIN
      src/assets/images/方形储水池.png
  45. 36
      src/styles.scss

10
src/app/data-collection/data-collection.module.ts
Unescape View File

@ -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 { }

15
src/app/data-collection/fire-force/addFireForce.html
Unescape View File

@ -0,0 +1,15 @@
<div class="addWaterBox">
<div class="topbox">
<span>新增消防力量</span>
</div>
<div class="contant">
<div (click)="selecteAddType(item,key)" *ngFor="let item of addList;let key = index" [ngClass]="{selectedDiv: item.id == selectedFireForceTypeIndex}">
<!-- <img [src]="item.src" alt=""> -->
{{item.name}}
</div>
</div>
<div class="btnbox">
<button mat-flat-button color="primary" (click)="confirm()">确定</button>
<button mat-flat-button style="background-color: #F2F4F6;" mat-dialog-close>取消</button>
</div>
</div>

512
src/app/data-collection/fire-force/fire-force.component.html
Unescape View File

@ -1,8 +1,516 @@
<div class="box">
<div class="box" style="width: 100%;height: 100%;overflow: hidden;">
<div class="listbox">
<div class="topbox">
<div class="add">
<div>
<mat-slide-toggle color="primary" (change)='slideChange($event)' checked labelPosition='before'>列表过滤</mat-slide-toggle>
</div>
<div>
<button (click)="addFireForce()" style="width: 68px;" mat-flat-button color="primary">新增</button>
</div>
</div>
<div class="searchbox" *ngIf="isCheckedOfSearchDiv">
<div class="inputbox">
<span>
关键字:
</span>
<input type="text" placeholder="请输入名称/类别" [(ngModel)]="searchForm.name"/>
</div>
<div class="inputbox">
<span>
完整度:
</span>
<select [(ngModel)]="searchForm.integrityNum" [ngClass]="{'gray': searchForm.integrityNum == ''}">
<option value='' selected disabled style='display:none;'>请选择</option>
<option *ngFor="let item of listIntegrityNum" [value]="item.id">{{item.name}}</option>
</select>
</div>
<div class="searchbtn">
<button (click)="searchList()" style="width: 100%;" mat-flat-button color="primary"><mat-icon style="width: 20px;height: 20px;font-size: 20px;">search</mat-icon>搜索</button>
</div>
</div>
</div>
<div style="height: 1px;width: 100%;background-color: #F2F4F6;"></div>
<div class="contantbox">
<div class="title">
<span>消防队</span>
<span>完整度</span>
</div>
<div class="fireForceTree" id="fireForceTree">
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl" >
<mat-tree-node (click)="selectTreeNode(node)" [ngClass]="{'selectedTreeNode': node.id == selectedFireForceId}" *matTreeNodeDef="let node;" matTreeNodePadding matTreeNodePaddingIndent='10px'>
<button mat-icon-button disabled ></button>
<span class="nodename">{{node.name}}</span>
<div class="integrity">
</div>
<div class="deletebtn" (click)="deleteWater(node,$event)"><mat-icon>highlight_off</mat-icon></div>
</mat-tree-node>
<mat-tree-node (click)="selectTreeNode(node)" [ngClass]="{'selectedTreeNode': node.id == selectedFireForceId}" *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding matTreeNodePaddingIndent='10px'>
<button mat-icon-button
matTreeNodeToggle
[attr.aria-label]="'toggle ' + node.name">
<mat-icon class="mat-icon-rtl-mirror">
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
<span class="nodename">{{node.name}}</span>
<div class="integrity">
</div>
<div class="deletebtn" (click)="deleteWater(node,$event)"><mat-icon>highlight_off</mat-icon></div>
</mat-tree-node>
</mat-tree>
</div>
</div>
</div>
<div class="mapbox">
<div class="mapcheckbox">
<mat-checkbox color="primary" *ngFor="let item of checkBoxList">{{item.name}}</mat-checkbox>
</div>
<div id="map" class="map" style="overflow: hidden;">
<div id="container"></div>
<div class="gistopbox hidden" [ngClass]="{'show': isGisTopBox}">
<div class="inputBox">
<span>搜索: </span>
<input name="position" [(ngModel)]="searchTitle" id="tipinput" class="positionInput" type="text" autocomplete="off">
</div>
</div>
</div>
<div class="detailsbox" *ngIf="selectedFireForceLevel != null">
<div class="tabsbox">
<div class="tabs">
<div (click)="selectedTab(1)" [ngClass]="{'selectedBtn': tabIndex == 1}">
<span>详情</span>
</div>
<div (click)="selectedTab(2)" [ngClass]="{'selectedBtn': tabIndex == 2}">
<span>车辆装备</span>
</div>
<div (click)="selectedTab(3)" [ngClass]="{'selectedBtn': tabIndex == 3}">
<span>相关资料</span>
</div>
</div>
<div class="btnbox">
<span class="save" (click)="save()"><mat-icon>save</mat-icon>保存</span>
<span class="submitAudit"><mat-icon>open_in_browser</mat-icon>提交审核</span>
</div>
</div>
<!-- 详情 -->
<div class="contant" *ngIf="tabIndex == 1">
<!-- 总队 支队 联系方式不同-->
<div *ngIf="selectedFireForceLevel == 0 || selectedFireForceLevel == 1">
<p>基本信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='6' rowspan='1'>
<span>
<span style="color: red;">*</span>
队站名称:
</span>
<input [(ngModel)]="FireForceDetailInfo.stationName" type="text" style="width:88%;">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
联系电话:
</span>
<input [(ngModel)]="FireForceDetailInfo.phoneNumber" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
传真:
</span>
<input [(ngModel)]="FireForceDetailInfo.faxNumber" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
辖区面积:
</span>
<input [(ngModel)]="FireForceDetailInfo.jurisdictionArea" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='6' rowspan='2'>
<span>
备注:
</span>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 84%;" name="" id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<p>位置信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
地址:
</span>
<input [(ngModel)]="FireForceDetailInfo.address" type="text" style="width:76%;">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
经度:
</span>
<input [(ngModel)]="positionLngLat.x" disabled type="text" style="width: 26%;margin-right: 6%;">
<span>
纬度:
</span>
<input [(ngModel)]="positionLngLat.y" disabled type="text" style="width: 26%;margin-right: 6%;">
<button (click)="setPosition()" style="width:85px;text-align: center;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">place</mat-icon>位置
</button>
</mat-grid-tile>
</mat-grid-list>
<p>人员数量</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='2' rowspan='1'>
<span>
现役官兵人数:
</span>
<input [(ngModel)]="ZongpersonCountData[0].PropertyValue" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
政府专职消防员数:
</span>
<input [(ngModel)]="ZongpersonCountData[1].PropertyValue" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
消防文员数:
</span>
<input [(ngModel)]="ZongpersonCountData[2].PropertyValue" type="text">
</mat-grid-tile>
</mat-grid-list>
<p>联系方式</p>
<mat-grid-list cols="6" rowHeight="40px" *ngIf="selectedFireForceLevel == 0">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
总队长名称:
</span>
<input type="text" [(ngModel)]="ZongcontactData[0].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
总队长联系方式:
</span>
<input type="text" [(ngModel)]="ZongcontactData[1].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
总队政委姓名:
</span>
<input type="text" [(ngModel)]="ZongcontactData[2].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
总队政委联系方式:
</span>
<input type="text" [(ngModel)]="ZongcontactData[3].PropertyValue">
</mat-grid-tile>
</mat-grid-list>
<mat-grid-list cols="6" rowHeight="40px" *ngIf="selectedFireForceLevel == 1">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
支队长姓名:
</span>
<input type="text" [(ngModel)]="ZhicontactData[0].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
支队长联系方式:
</span>
<input type="text" [(ngModel)]="ZhicontactData[1].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
支队政委姓名:
</span>
<input type="text" [(ngModel)]="ZhicontactData[2].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
支队政委联系方式:
</span>
<input type="text" [(ngModel)]="ZhicontactData[3].PropertyValue">
</mat-grid-tile>
</mat-grid-list>
</div>
<!-- 大队 中队-->
<div *ngIf="selectedFireForceLevel == 2 || selectedFireForceLevel == 3">
<p>基本信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='6' rowspan='1'>
<span>
<span style="color: red;">*</span>
队站名称:
</span>
<input type="text" style="width:81%;" [(ngModel)]="FireForceDetailInfo.stationName">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
值班电话:
</span>
<input type="text" [(ngModel)]="FireForceDetailInfo.phoneNumber">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
辖区面积:
</span>
<input type="text" [(ngModel)]="FireForceDetailInfo.jurisdictionArea">
</mat-grid-tile>
<mat-grid-tile colspan='6' rowspan='2'>
<span>
备注:
</span>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 84%;" name="" id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<p>位置信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
地址:
</span>
<input [(ngModel)]="FireForceDetailInfo.address" type="text" style="width:76%;">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
经度:
</span>
<input [(ngModel)]="positionLngLat.x" disabled type="text" style="width: 26%;margin-right: 6%;">
<span>
纬度:
</span>
<input [(ngModel)]="positionLngLat.y" disabled type="text" style="width: 26%;margin-right: 6%;">
<button (click)="setPosition()" style="width:85px;text-align: center;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">place</mat-icon>位置
</button>
</mat-grid-tile>
</mat-grid-list>
<p>人员数量</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='2' rowspan='1'>
<span>
现役人数:
</span>
<input type="text" [(ngModel)]="DaZhongpersonCountData[0].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
政府专职消防员数:
</span>
<input type="text" [(ngModel)]="DaZhongpersonCountData[1].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
每日执勤人数:
</span>
<input type="text" [(ngModel)]="DaZhongpersonCountData[2].PropertyValue">
</mat-grid-tile>
</mat-grid-list>
<p>联系方式</p>
<mat-grid-list cols="6" rowHeight="40px" >
<mat-grid-tile colspan='3' rowspan='1'>
<span>
站长姓名:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[0].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
站长联系方式:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[1].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
指导员姓名:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[2].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
指导员联系方式:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[3].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副指导员姓名:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[4].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副指导员联系方式:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[5].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副站长一姓名:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[6].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副站长一联系方式:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[7].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副站长二姓名:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[8].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副站长二联系方式:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[9].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副站长三姓名:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[10].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
副站长三联系方式:
</span>
<input type="text" [(ngModel)]="DaZhongcontactData[11].PropertyValue">
</mat-grid-tile>
</mat-grid-list>
</div>
<!-- 其他消防力量 -->
<div *ngIf="selectedFireForceLevel == 4 || selectedFireForceLevel == 5 || selectedFireForceLevel == 6">
<p>基本信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
<span style="color: red;">*</span>
队伍类型:
</span>
<select disabled [(ngModel)]="selectedFireForceLevel">
<option value="4">微型消防站</option>
<option value="5">企业专职消防队</option>
<option value="6">义务(志愿)消防队</option>
<!-- <option value="3">其他</option> -->
</select>
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
<span style="color: red;">*</span>
队伍名称:
</span>
<input type="text" [(ngModel)]="FireForceDetailInfo.stationName">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
管辖单位:
</span>
<input disabled [(ngModel)]="selectedFireForce.name" class="smallwidth" type="text" placeholder="名称">
<input disabled [(ngModel)]="selectedFireForce.code" class="smallwidth" type="text" placeholder="编号">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
队长:
</span>
<input [(ngModel)]="othercontactData[0].PropertyValue" class="smallwidth" type="text" placeholder="姓名">
<input [(ngModel)]="othercontactData[1].PropertyValue" class="smallwidth" type="text" placeholder="联系方式">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
值班电话:
</span>
<input [(ngModel)]="FireForceDetailInfo.phoneNumber" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
传真:
</span>
<input [(ngModel)]="FireForceDetailInfo.faxNumber" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='6' rowspan='2'>
<span>
备注:
</span>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 82%;" name="" id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<p>位置信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
地址:
</span>
<input [(ngModel)]="FireForceDetailInfo.address" type="text" style="width:76%;">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
经度:
</span>
<input [(ngModel)]="positionLngLat.x" disabled type="text" style="width: 26%;margin-right: 6%;">
<span>
纬度:
</span>
<input [(ngModel)]="positionLngLat.y" disabled type="text" style="width: 26%;margin-right: 6%;">
<button (click)="setPosition()" style="width:85px;text-align: center;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">place</mat-icon>位置
</button>
</mat-grid-tile>
</mat-grid-list>
<p>人员数量</p>
<!-- 其他消防力量 -->
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
每日执勤人数:
</span>
<input type="text" [(ngModel)]="otherpersonCountData[0].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
消防队员总人数:
</span>
<input type="text" [(ngModel)]="otherpersonCountData[1].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
执勤车辆数:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="otherpersonCountData[2].PropertyValue">
<span class="unit">辆</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
灭火剂总量:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="otherpersonCountData[3].PropertyValue">
<span class="unit">个</span>
</div>
</mat-grid-tile>
</mat-grid-list>
</div>
<div style="width: 100%;height: 22px;">
</div>
</div>
<!-- 车辆 -->
<div class="contant" *ngIf="tabIndex == 2">
车辆
</div>
<!-- 相关资料 -->
<div class="contant" *ngIf="tabIndex == 3">
相关资料
</div>
</div>
</div>
</div>

337
src/app/data-collection/fire-force/fire-force.component.scss
Unescape View File

@ -5,14 +5,351 @@
display: flex;
box-sizing: border-box;
padding: 10px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #000000;
}
.listbox{
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{
height: 36px;
line-height: 36px;
display: flex;
justify-content: space-between;
}
.searchbox{
.inputbox{
width: 100%;
height: 36px;
font-size: 14px;
line-height: 36px;
margin: 10px 0;
display: flex;
span{
margin-right: 5px;
}
select,input{
flex: 1;
background-color: #F2F4F6;
border: 0;
border-radius: 5px;
box-sizing: border-box;
padding:0 8px;
}
.gray{
color: gray;
}
// input::-moz-placeholder {
// color: rgba(90, 83, 83, 0.89);
// opacity: 1;
// }
// input:-ms-input-placeholder {
// color: rgba(90, 83, 83, 0.89);;
// }
// input::-webkit-input-placeholder {
// color: rgba(90, 83, 83, 0.89);;
// }
}
}
}
.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 33px 0 22px;
height: 36px;
line-height: 36px;
span{
font-size: 14px;
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{
flex: 1;
margin-left: 10px;
background-color: #fff;
display: flex;
flex-direction: column;
.mapcheckbox{
width: 100%;
height: 50px;
line-height: 50px;
mat-checkbox{
margin-right:60px;
font-size: 15px;
}
mat-checkbox:nth-child(1){
margin-left: 20px;
}
}
#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:500px;
.tabsbox{
width: 100%;
height: 40px;
line-height: 40px;
display: flex;
justify-content: space-between;
font-size: 15px;
.tabs{
div{
float: left;
width: 120px;
text-align: center;
cursor: pointer;
color: #000000;
opacity: 0.4;
border-right: 1px solid #F2F4F6;
}
.selectedBtn{
background-color: #2196F3;
color: #fff;
opacity: 1;
}
}
.btnbox{
span{
cursor: pointer;
color: #2196F3;
mat-icon{
vertical-align: text-top;
font-size: 20px;
width: 20px;
height: 20px;
}
}
span:hover{
text-decoration: underline;
}
.submitAudit{
margin: 0 30px;
}
}
}
.contant{
width: 100%;
height:480px;
overflow-y: auto;
p{
color: #2196F3;
background-color: #F2F4F6;
height: 33px;
line-height: 33px;
box-sizing: border-box;
padding-left: 20px;
font-size: 15px;
}
span{
font-size: 15px;
}
input,select{
height: 30px;
line-height: 30px;
box-sizing: border-box;
padding: 0 12px;
width: 60%;
margin-left: 5px;
border: 1px solid #EBEBEB;
border-radius: 5px;
}
textarea{
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;
}
}
}

623
src/app/data-collection/fire-force/fire-force.component.ts
Unescape View File

@ -1,4 +1,14 @@
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({
selector: 'app-fire-force',
@ -7,9 +17,618 @@ import { Component, OnInit } from '@angular/core';
})
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) { }
ngOnInit(): void {
isCheckedOfSearchDiv:boolean = true//列表过滤滑块
slideChange(e){
this.isCheckedOfSearchDiv = e.checked
}
searchForm:any = {
name:'',
integrityNum:''
}
listIntegrityNum:any[] = [
{id:-1,name:'全部'},
{id:0,name:'<=50%'},
{id:1,name:'50%-60%'},
{id:2,name:'60%-70%'},
{id:3,name:'70%-80%'},
{id:4,name:'80%-90%'},
{id:5,name:'90%-100%'}
]
checkBoxList:any[] = [
{id:0,name:'总队'},
{id:1,name:'支队'},
{id:2,name:'大队'},
{id:3,name:'中队(消防站)'},
{id:4,name:'其他消防队伍'}
]
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<any>(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 =
'<div class="custom-content-marker">' +
' <img src="/assets/images/定位.png">' +
'</div>'
newPositionMarkerContentBtn:any =
'<div class="custom-content-marker">' +
' <img src="/assets/images/定位.png">' +
' <div class="btnbox"><img id="setPositionOk" src="/assets/images/ok.png"><span>|</span><img id="setPositionClose" src="/assets/images/close.png"></div>' +
'</div>'
//创建地图
newPositionMarker:any//坐标实例
createMap(){
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 = ''//
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<AddFireForce>,@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)
}
}

12
src/app/data-collection/water-collection/addWater.html
Unescape View File

@ -0,0 +1,12 @@
<div class="addWaterBox">
<div class="topbox">
<span>新增水源</span>
</div>
<div class="contant">
<div (click)="selecteAddType(item,key)" *ngFor="let item of addList;let key = index" [ngClass]="{selectedDiv: key == selectedWaterTypeIndex}"><img [src]="item.src" alt="">{{item.name}}</div>
</div>
<div class="btnbox">
<button mat-flat-button color="primary" (click)="confirm()">确定</button>
<button mat-flat-button style="background-color: #F2F4F6;" mat-dialog-close>取消</button>
</div>
</div>

434
src/app/data-collection/water-collection/water-collection.component.html
Unescape View File

@ -1,8 +1,436 @@
<div class="box">
<div class="box" style="width: 100%;height: 100%;overflow: hidden;">
<div class="listbox">
<div class="topbox">
<div class="add">
<div>
<mat-slide-toggle color="primary" (change)='slideChange($event)' checked labelPosition='before'>列表过滤</mat-slide-toggle>
</div>
<div>
<button (click)="addWater()" style="width: 68px;" mat-flat-button color="primary">新增</button>
</div>
</div>
<div class="searchbox" *ngIf="isCheckedOfSearchDiv">
<div class="inputbox">
<span>
关键字:
</span>
<input type="text" placeholder="请输入名称/编码/类别" [(ngModel)]="searchForm.name"/>
</div>
<div class="inputbox">
<span>
完整度:
</span>
<select [(ngModel)]="searchForm.integrityNum" [ngClass]="{'gray': searchForm.integrityNum == ''}">
<option value='' selected disabled style='display:none;'>请选择</option>
<option *ngFor="let item of listIntegrityNum" [value]="item.id">{{item.name}}</option>
</select>
</div>
<div class="searchbtn">
<button (click)="searchList()" style="width: 100%;" mat-flat-button color="primary"><mat-icon style="width: 20px;height: 20px;font-size: 20px;">search</mat-icon>搜索</button>
</div>
</div>
</div>
<div style="height: 1px;width: 100%;background-color: #F2F4F6;"></div>
<div class="contantbox">
<div class="title">
<span>地址</span>
<span>完整度</span>
</div>
<div class="waterList">
<ul *ngIf="addWaterListData && addWaterListData.items" >
<li [ngClass]="{'selectedLi': key == selectedLiIndex}" *ngFor="let item of addWaterListData.items;let key = index" (click)="clickWaterLi(item,key)">
<div class="address" [title]="item.address">{{item.address}}</div>
<div class="integrity">
<span class="integrityNum">
{{accMul(item.integrityScore.toFixed(3),100,1)}}%
</span>
<div class="integrityColorDiv" [style]="integrity((item.integrityScore.toFixed(2) * 100).toFixed())">
</div>
</div>
<div class="deletebtn" (click)="deleteWater(item,$event)"><mat-icon>highlight_off</mat-icon></div>
</li>
</ul>
</div>
<div class="paginator">
<mat-paginator [length]="dataLength" [pageSize]="30" (page)="chagePage($event)"></mat-paginator>
</div>
</div>
</div>
<div class="mapbox">
<div class="mapcheckbox">
<mat-checkbox color="primary" *ngFor="let item of checkBoxList">{{item.name}}</mat-checkbox>
</div>
<div id="map" class="map" style="overflow: hidden;">
<div id="container"></div>
<div class="gistopbox hidden" [ngClass]="{'show': isGisTopBox}">
<div class="inputBox">
<span>搜索: </span>
<input name="position" [(ngModel)]="searchTitle" id="tipinput" class="positionInput" type="text" autocomplete="off">
</div>
</div>
</div>
<div class="detailsbox" *ngIf="selectedWaterTypeIndex != null">
<div class="tabsbox">
<div class="tabs">
<div class="selectedBtn">
<span *ngIf="selectedWaterTypeIndex == 0">消火栓</span>
<span *ngIf="selectedWaterTypeIndex == 1">消防水池</span>
<span *ngIf="selectedWaterTypeIndex == 2">天然水源</span>
</div>
</div>
<div class="btnbox">
<span class="save" (click)="save()"><mat-icon>save</mat-icon>保存</span>
<span class="submitAudit"><mat-icon>open_in_browser</mat-icon>提交审核</span>
</div>
</div>
<div class="contant" >
<p>基本信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='6' rowspan='1'>
<span>
<span style="color: red;">*</span>
名称:
</span>
<input [(ngModel)]="waterData.name" type="text" style="width: 88.6%;">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
行政区:
</span>
<input [(ngModel)]="waterData.administrativeRegion" type="text">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
水源归属:
</span>
<select [(ngModel)]="waterData.governmentLevel">
<option value="0">市政</option>
<option value="1">单位(小区)</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
所属单位(小区):
</span>
<input [(ngModel)]="waterData.village" type="text">
</mat-grid-tile>
</mat-grid-list>
<p>位置信息</p>
<mat-grid-list cols="6" rowHeight="40px">
<mat-grid-tile colspan='3' rowspan='1'>
<span>
地址:
</span>
<input [(ngModel)]="waterData.address" type="text" style="width:76%;">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
经度:
</span>
<input [(ngModel)]="positionLngLat.x" disabled type="text" style="width: 26%;margin-right: 6%;">
<span>
纬度:
</span>
<input [(ngModel)]="positionLngLat.y" disabled type="text" style="width: 26%;margin-right: 6%;">
<button (click)="setPosition()" style="width:85px;text-align: center;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">place</mat-icon>位置
</button>
</mat-grid-tile>
</mat-grid-list>
<p>详细信息</p>
<!-- 消火栓 -->
<mat-grid-list cols="6" rowHeight="40px" *ngIf="selectedWaterTypeIndex == 0">
<mat-grid-tile colspan='2' rowspan='1'>
<span>
可用状态:
</span>
<select [(ngModel)]="fireCockData[0].PropertyValue">
<option value="0">可用</option>
<option value="1">维护</option>
<option value="2">损坏</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
放置形式:
</span>
<select [(ngModel)]="fireCockData[1].PropertyValue">
<option value="0">地上</option>
<option value="1">地下</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
管网形式:
</span>
<select [(ngModel)]="fireCockData[2].PropertyValue">
<option value="0">枝状管网</option>
<option value="1">环状管网</option>
<option value="2">混合状管网</option>
<option value="3">其他</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
管网直径:
</span>
<div class="unitDiv">
<select [(ngModel)]="fireCockData[3].PropertyValue">
<option value="0">100</option>
<option value="1">150</option>
<option value="2">200</option>
<option value="3">300</option>
<option value="4">350</option>
<option value="5">400</option>
</select>
<span class="unit">mm</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
管网压力类型:
</span>
<select [(ngModel)]="fireCockData[4].PropertyValue">
<option value="0">高压管网</option>
<option value="1">临时高压管网</option>
<option value="2">低压管网</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
管网压力范围:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="fireCockData[5].PropertyValue">
<span class="unit">Mpa</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
接口形式:
</span>
<select [(ngModel)]="fireCockData[6].PropertyValue">
<option value="0">内扣式</option>
<option value="1">卡式</option>
<option value="2">螺纹式</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
接口口径:
</span>
<div class="unitDiv">
<select [(ngModel)]="fireCockData[7].PropertyValue">
<option value="0">65</option>
<option value="1">80</option>
<option value="2">100</option>
<option value="3">150</option>
</select>
<span class="unit">mm</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
最大流量:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="fireCockData[8].PropertyValue">
<span class="unit">L/s</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
供水单位:
</span>
<input style="width: 74%;" type="text" [(ngModel)]="fireCockData[9].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
联系方式:
</span>
<input style="width: 74%;" type="text" [(ngModel)]="fireCockData[10].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='6' rowspan='2'>
<span>
备注:
</span>
<textarea [(ngModel)]="fireCockData[11].PropertyValue" style="height: 80%;" name="" id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<!-- 消防水池 -->
<mat-grid-list cols="6" rowHeight="40px" *ngIf="selectedWaterTypeIndex == 1">
<mat-grid-tile colspan='2' rowspan='1'>
<span>
可用状态:
</span>
<select [(ngModel)]="poolData[0].PropertyValue">
<option value="0">可用</option>
<option value="1">维护</option>
<option value="2">损坏</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
储水量:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="poolData[1].PropertyValue">
<span class="unit">m³</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
取水最大流量:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="poolData[2].PropertyValue">
<span class="unit">L/s</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
进水流量:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="poolData[3].PropertyValue">
<span class="unit">L/s</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
同时取水车辆数:
</span>
<input type="text" [(ngModel)]="poolData[4].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
水源标高差:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="poolData[5].PropertyValue">
<span class="unit">m</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
补水时间:
</span>
<input class="longinput" type="text" [(ngModel)]="poolData[6].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
管网形式:
</span>
<input class="longinput" type="text" [(ngModel)]="poolData[7].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
供水单位:
</span>
<input class="longinput" type="text" [(ngModel)]="poolData[8].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
联系方式:
</span>
<input class="longinput" type="text" [(ngModel)]="poolData[9].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='6' rowspan='2'>
<span>
备注:
</span>
<textarea [(ngModel)]="poolData[10].PropertyValue" style="height: 80%;" name="" id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<!-- 天然水源 -->
<mat-grid-list cols="6" rowHeight="40px" *ngIf="selectedWaterTypeIndex == 2">
<mat-grid-tile colspan='2' rowspan='1'>
<span>
可用状态:
</span>
<select [(ngModel)]="naturalWaterData[0].PropertyValue">
<option value="0">可用</option>
<option value="1">维护</option>
<option value="2">损坏</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
天然水源类型:
</span>
<input type="text" [(ngModel)]="naturalWaterData[1].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
有无消防码头:
</span>
<select [(ngModel)]="naturalWaterData[2].PropertyValue">
<option value="0">有</option>
<option value="1">无</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
水质:
</span>
<select [(ngModel)]="naturalWaterData[3].PropertyValue">
<option value="0">淡水</option>
<option value="1">海水</option>
<option value="2">中水</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
同时取水车辆数:
</span>
<input type="text" [(ngModel)]="naturalWaterData[4].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='2' rowspan='1'>
<span>
水源标高差:
</span>
<div class="unitDiv">
<input type="text" [(ngModel)]="naturalWaterData[5].PropertyValue">
<span class="unit">m</span>
</div>
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
有无枯水期:
</span>
<select class="longinput" [(ngModel)]="naturalWaterData[6].PropertyValue">
<option value="0">有</option>
<option value="1">无</option>
</select>
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
枯水期时间:
</span>
<input class="longinput" type="text" [(ngModel)]="naturalWaterData[7].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
供水单位:
</span>
<input class="longinput" type="text" [(ngModel)]="naturalWaterData[8].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
联系方式:
</span>
<input class="longinput" type="text" [(ngModel)]="naturalWaterData[9].PropertyValue">
</mat-grid-tile>
<mat-grid-tile colspan='6' rowspan='2'>
<span>
备注:
</span>
<textarea [(ngModel)]="naturalWaterData[10].PropertyValue" style="height: 80%;" name="" id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
</div>
</div>
</div>
</div>

359
src/app/data-collection/water-collection/water-collection.component.scss
Unescape View File

@ -5,14 +5,373 @@
display: flex;
box-sizing: border-box;
padding: 10px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #000000;
}
.listbox{
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{
height: 36px;
line-height: 36px;
display: flex;
justify-content: space-between;
}
.searchbox{
.inputbox{
width: 100%;
height: 36px;
font-size: 14px;
line-height: 36px;
margin: 10px 0;
display: flex;
span{
margin-right: 5px;
}
select,input{
flex: 1;
background-color: #F2F4F6;
border: 0;
border-radius: 5px;
box-sizing: border-box;
padding:0 8px;
}
.gray{
color: gray;
}
// input::-moz-placeholder {
// color: rgba(90, 83, 83, 0.89);
// opacity: 1;
// }
// input:-ms-input-placeholder {
// color: rgba(90, 83, 83, 0.89);;
// }
// input::-webkit-input-placeholder {
// color: rgba(90, 83, 83, 0.89);;
// }
}
}
}
.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 33px 0 22px;
height: 36px;
line-height: 36px;
span{
font-size: 14px;
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{
flex: 1;
margin-left: 10px;
background-color: #fff;
display: flex;
flex-direction: column;
.mapcheckbox{
width: 100%;
height: 50px;
line-height: 50px;
mat-checkbox{
margin-right:60px;
font-size: 15px;
}
mat-checkbox:nth-child(1){
margin-left: 20px;
}
}
#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:500px;
.tabsbox{
width: 100%;
height: 40px;
line-height: 40px;
display: flex;
justify-content: space-between;
font-size: 15px;
.tabs{
div{
float: left;
width: 120px;
text-align: center;
cursor: pointer;
color: #000000;
opacity: 0.4;
border-right: 1px solid #F2F4F6;
}
.selectedBtn{
background-color: #2196F3;
color: #fff;
opacity: 1;
}
}
.btnbox{
span{
cursor: pointer;
color: #2196F3;
mat-icon{
vertical-align: text-top;
font-size: 20px;
width: 20px;
height: 20px;
}
}
span:hover{
text-decoration: underline;
}
.submitAudit{
margin: 0 30px;
}
}
}
.contant{
width: 100%;
height:480px;
overflow-y: auto;
p{
color: #2196F3;
background-color: #F2F4F6;
height: 33px;
line-height: 33px;
box-sizing: border-box;
padding-left: 20px;
font-size: 15px;
}
span{
font-size: 15px;
}
input,select{
height: 30px;
line-height: 30px;
box-sizing: border-box;
padding: 0 12px;
width: 60%;
margin-left: 5px;
border: 1px solid #EBEBEB;
border-radius: 5px;
}
textarea{
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;
}
}
}
}
}
.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;
}
}
}

488
src/app/data-collection/water-collection/water-collection.component.ts
Unescape View File

@ -1,4 +1,10 @@
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({
selector: 'app-water-collection',
@ -7,9 +13,489 @@ import { Component, OnInit } from '@angular/core';
})
export class WaterCollectionComponent implements OnInit {
constructor() { }
constructor(public snackBar: MatSnackBar,private http:HttpClient,private elementRef: ElementRef,public renderer2: Renderer2,public dialog: MatDialog) { }
isCheckedOfSearchDiv:boolean = true//列表过滤滑块
slideChange(e){
this.isCheckedOfSearchDiv = e.checked
}
searchForm:any = {
name:'',
integrityNum:''
}
listIntegrityNum:any[] = [
{id:-1,name:'全部'},
{id:0,name:'<=50%'},
{id:1,name:'50%-60%'},
{id:2,name:'60%-70%'},
{id:3,name:'70%-80%'},
{id:4,name:'80%-90%'},
{id:5,name:'90%-100%'}
]
checkBoxList:any[] = [
{id:0,name:'消火栓'},
{id:1,name:'消防水池'},
{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 =
'<div class="custom-content-marker">' +
' <img src="/assets/images/定位.png">' +
'</div>'
newPositionMarkerContentBtn:any =
'<div class="custom-content-marker">' +
' <img src="/assets/images/定位.png">' +
' <div class="btnbox"><img id="setPositionOk" src="/assets/images/ok.png"><span>|</span><img id="setPositionClose" src="/assets/images/close.png"></div>' +
'</div>'
//创建地图
newPositionMarker:any//坐标实例
createMap(){
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 = ''//
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({
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: './addWater.html',
styleUrls: ['./water-collection.component.scss']
})
export class AddWater {
constructor(private http: HttpClient,public dialogRef: MatDialogRef<AddWater>,@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)
}
}

29
src/app/gis-management/gis-labeling/gis-labeling.component.ts
Unescape View File

@ -20,8 +20,8 @@ export class GisLabelingComponent implements OnInit {
titleList = [ {name:'重点单位',iconImg:'/assets/images/uniticon.png'},
{name:'水源',iconImg:'/assets/images/watericon.png'},
{name:'测量工具',iconImg:'/assets/images/distanceicon.png'},
/* {name:'测面积',iconImg:'/assets/images/areaicon.png'}, */
{name:'图层选择',iconImg:'/assets/images/coverageicon.png'}]
{name:'图层选择',iconImg:'/assets/images/coverageicon.png'}
]
keyUnitList:any = []
waterList = [
{id:'0',name:'消火栓',selected:false},
@ -312,7 +312,7 @@ export class GisLabelingComponent implements OnInit {
<div class="btn" id="route"><img src="../../../assets/images/navicon.png" alt="">导航</div>
<div class="btn" id="fullViewNavigation"><img src="../../../assets/images/panoramaicon.png" alt="">全景漫游</div>
<div class="btn" id="threeeScene"><img src="../../../assets/images/3dicon.png" alt="">三维场景</div>
<div class="btn" id="seePlan"><img src="../../../assets/images/planicon.png" alt="">查看预案</div>
<div class="btn" id="seePlan"><img src="../../../assets/images/planicon.png" alt="">查看预案</div>
<div class="btn" id="share"><img src="../../../assets/images/shareicon.png" alt="">分享</div>
</div>
</div>`
@ -327,7 +327,7 @@ export class GisLabelingComponent implements OnInit {
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#route'),'click',(event)=>{ this.route(item) })//导航点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#fullViewNavigation'),'click',(event)=>{ this.fullViewNavigation(item) })//全景漫游点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#threeeScene'),'click',(event)=>{ this.threeeScene(item) })//三维场景点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#seePlan'),'click',(event)=>{ this.seePlan(item) })//查看预案点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#seePlan'),'click',(event)=>{ this.seePlan(item) })//查看预案点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#share'),'click',(event)=>{ this.share(item) })//分享点击事件
});
markerArr.push(labelMarker)
@ -712,7 +712,7 @@ export class GisLabelingComponent implements OnInit {
let markerContent = `<div style="font-size: 14px" id="gispopupbox">
<div style="color: #0080FF;"><span style="margin-left:8px">${e.name}</span><label style="font-size: 12px; color: #999; margin-left: 10px">${e.address}</label> </div>
<div style="display: flex; margin-top: 10px;margin-left:8px">
<div style="width:240px; overflow: hidden;">单位性质: <label style="margin-left: 10px;font-size: 12px;">${e.buildingTypes[0].name || "暂无数据"}</label></div>
<div style="width:240px; overflow: hidden;">单位性质: <label style="margin-left: 10px;font-size: 12px;">${e.buildingTypes.length? e.buildingTypes[0].name : "暂无数据"}</label></div>
<div style="flex: 1; margin-left: 25px;">消防负责人: <label style="margin-left: 10px;font-size: 12px;">${e.contacts || "暂无数据"}</label></div>
</div>
<div style="display: flex; margin-top: 10px;margin-left:8px"">
@ -739,7 +739,7 @@ export class GisLabelingComponent implements OnInit {
<div class="btn" id="route"><img src="../../../assets/images/navicon.png" alt="">导航</div>
<div class="btn" id="fullViewNavigation"><img src="../../../assets/images/panoramaicon.png" alt="">全景漫游</div>
<div class="btn" id="threeeScene"><img src="../../../assets/images/3dicon.png" alt="">三维场景</div>
<div class="btn" id="seePlan"><img src="../../../assets/images/planicon.png" alt="">查看预案</div>
<div class="btn" id="seePlan"><img src="../../../assets/images/planicon.png" alt="">查看预案</div>
<div class="btn" id="share"><img src="../../../assets/images/shareicon.png" alt="">分享</div>
</div>
</div>`
@ -754,7 +754,7 @@ export class GisLabelingComponent implements OnInit {
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#route'),'click',(event)=>{ this.route(e) })//导航点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#fullViewNavigation'),'click',(event)=>{ this.fullViewNavigation(e) })//全景漫游点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#threeeScene'),'click',(event)=>{ this.threeeScene(e) })//三维场景点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#seePlan'),'click',(event)=>{ this.seePlan(e) })//查看预案点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#seePlan'),'click',(event)=>{ this.seePlan(e) })//查看预案点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#share'),'click',(event)=>{ this.share(e) })//分享点击事件
marker.on('click', (ev) => { //marker点击事件
this.infoWindow = new AMap.InfoWindow({
@ -767,7 +767,7 @@ export class GisLabelingComponent implements OnInit {
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#route'),'click',(event)=>{ this.route(e) })//导航点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#fullViewNavigation'),'click',(event)=>{ this.fullViewNavigation(e) })//全景漫游点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#threeeScene'),'click',(event)=>{ this.threeeScene(e) })//三维场景点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#seePlan'),'click',(event)=>{ this.seePlan(e) })//查看预案点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#seePlan'),'click',(event)=>{ this.seePlan(e) })//查看预案点击事件
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#share'),'click',(event)=>{ this.share(e) })//分享点击事件
})
@ -793,7 +793,6 @@ export class GisLabelingComponent implements OnInit {
this.leftDivState = false
this.showLeftDiv = false
this.isShowRouteGIS = true
// console.log(1,e)
this.routeEnd = e.name
this.endCoordinate = new AMap.LngLat(e.location.x, e.location.y)
}
@ -868,20 +867,18 @@ export class GisLabelingComponent implements OnInit {
var autoComplete = new AMap.Autocomplete(autoOptions);
autoComplete.search(keywords, function(status, result) {
if (result && result.tips && result.tips.length) { //搜索到数据时
that._ngZone.run(()=>{
if(e == 0){
that.routeStartList = result.tips
that.startCoordinate = new AMap.LngLat(result.tips[0].location.lng, result.tips[0].location.lat)
// console.log(666,result)
}else{
that.routeEndList = result.tips
that.endCoordinate = new AMap.LngLat(result.tips[0].location.lng, result.tips[0].location.lat)
}
});
}
} //if
})
})
}); //获取当前 city
@ -912,7 +909,6 @@ export class GisLabelingComponent implements OnInit {
this.endCoordinate = null
this.routeGIS? this.routeGIS.clear() : null
this.routes = { distance: 0, time: 0, steps: [], }
// console.log(this.selectedUnit)
this.map.setZoomAndCenter(13,[this.selectedUnit.location.x,this.selectedUnit.location.y]); //设置地图中心点
}
@ -941,10 +937,7 @@ export class GisLabelingComponent implements OnInit {
this.routeGIS? this.routeGIS.clear() : null
this.routeGIS = new AMap.Driving({
map: this.map,
});
// console.log(1,this.startCoordinate)
// console.log(2,this.endCoordinate)
// 根据起终点名称规划驾车导航路线
});
this.routeGIS.search(this.startCoordinate,this.endCoordinate,
function(status, result) {
if (status === 'complete') {

37
src/app/key-unit/allaround/allaround.component.html
Unescape View File

@ -1,42 +1,5 @@
<div class="content">
<mat-tab-group style="height: 100%;">
<mat-tab label="单位毗邻">
<div class="allImgs">
<div class="imgBox" *ngFor="let item of AllAdjoining" >
<div class="fixedImg" *ngIf="item.imageUrls.length">
<img [src]="item.imgURL" onerror="javascript:this.src='../../../assets/images/upload.png'" (click)='imgdetails(item.imageUrls)'>
</div>
<div class="fixedImg" *ngIf="!item.imageUrls.length">
<img src="../../../assets/images/upload.png" (click)='imgdetails(item.imageUrls)'>
</div>
<div style="margin-top: 5px;">
<label style="margin-left: 25px;">建筑物名称:</label>
<label style="margin-left: 25px;">{{item.name}}</label>
</div>
<div style="margin-top: 5px;">
<label style="margin-left: 25px;">建筑物方向:</label>
<label style="margin-left: 25px;">
<label *ngIf="item.direction==0">东</label>
<label *ngIf="item.direction==1">西</label>
<label *ngIf="item.direction==2">南</label>
<label *ngIf="item.direction==3">北</label>
<label *ngIf="item.direction==4">东南</label>
<label *ngIf="item.direction==5">西南</label>
<label *ngIf="item.direction==6">东北</label>
<label *ngIf="item.direction==7">西北</label>
</label>
</div>
<div style="margin-top: 5px;">
<label style="margin-left: 25px;">图片数量:</label>
<label style="margin-left: 25px;" *ngIf="item.imageUrls.length">{{item.imageUrls.length}}张</label>
<label style="margin-left: 25px;" *ngIf="!item.imageUrls.length">0张</label>
</div>
</div>
<p style="width: 100%;text-align: center;margin-top: 25px;" *ngIf="!AllAdjoining.length">暂无数据,请前往平面图进行相关数据录入</p>
</div>
</mat-tab>
<mat-tab label="{{item.name}}" *ngFor="let item of AllBuilding">
<div class="allImgs">

9
src/app/key-unit/allaround/allaround.component.ts
Unescape View File

@ -17,7 +17,6 @@ export class AllaroundComponent implements OnInit {
constructor(private http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,private route:ActivatedRoute,) { }
ngOnInit(): void {
this.getAllCompany()
this.getAllBuilding()
}
@ -42,7 +41,13 @@ export class AllaroundComponent implements OnInit {
this.AllBuilding.forEach(element => {
element.allImgs = []
});
this.getAllArchitecture()}
this.getAllArchitecture()
} else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('暂无建筑数据','确定',config);
}
})
}

94
src/app/key-unit/fire-fighting-device-look/fire-fighting-device.component.html
Unescape View File

@ -1,99 +1,5 @@
<div class="content">
<mat-tab-group>
<mat-tab label="单位消防设施">
<div class="contentBox">
<p style="width: 100%; margin: 30px auto; text-align: center;" *ngIf="!companyBuiltInGrouping.length">暂无数据,请完善单位基本信息</p>
<div style="width: 100%;margin-top: 25px;" *ngFor="let item of companyBuiltInGrouping;let key = index">
<h3 style="text-align: center;font-weight: 550;">{{item.name}}</h3>
<div style="margin-bottom: 10px;">
<!-- <mat-icon title="创建" (click)='addCompanyGrouping(item)'>add_circle_outline</mat-icon>
<mat-icon title="保存" style="margin-left: 25px;" (click)='editCompanyGrouping(item)'>description</mat-icon>
<mat-icon title="删除" style="margin-left: 25px;" (click)='deleteCompanyGrouping(item)'>delete</mat-icon> -->
</div>
<div>
<mat-accordion multi>
<mat-expansion-panel disabled>
<mat-expansion-panel-header>
<label class="firstContent"></label>
<label class="textContent">项目</label>
<label class="textContent">照片</label>
<label class="totalContent">总数</label>
<label class="lastTextContent">主要情况</label>
</mat-expansion-panel-header>
</mat-expansion-panel>
<mat-expansion-panel *ngFor="let items of item.facilityItems" disabled [expanded]=items.expanded>
<mat-expansion-panel-header>
<label class="firstContent">
<mat-checkbox (change)='checkedCompany($event,item,items)' [disabled]='items.isBuiltin'></mat-checkbox>
</label>
<label class="textContent">{{items.name}}</label>
<label class="textContent"><a href="javascript:void(0)" (click)='previewImg(items)'>查看图片</a></label>
<label class="totalContent">{{items.total ? items.total : '总数: 0'}}</label>
<label class="lastTextContent">
<textarea readonly maxlength="250" [(ngModel)]="items.details" style="width: 80%;"></textarea>
</label>
<label><mat-icon (click)='SwitchBoard(items)' *ngIf="items.isBuiltin">keyboard_arrow_down</mat-icon></label>
</mat-expansion-panel-header>
<div class="overflowTable">
<div class="detailsTable">
<table>
<tr>
<th *ngFor="let header of items.header">{{header}}</th>
</tr>
<tr *ngFor="let body of items.body">
<td *ngFor="let header of items.header">{{body[header]? body[header] : '暂无数据'}}</td>
</tr>
</table>
</div>
<div *ngFor="let tableMsg of items.loopTable" class="detailsTable">
<p style="text-align: center; font-size: 16px; margin: 5px 0;">楼层/区域名称: {{tableMsg.name? tableMsg.name: '暂无名称'}}</p>
<table>
<tr>
<th *ngFor="let header of tableMsg.header">{{header}}</th>
</tr>
<tr *ngFor="let body of tableMsg.body">
<td *ngFor="let header of tableMsg.header">{{body[header]? body[header] : '暂无数据'}}</td>
</tr>
</table>
</div>
</div>
</mat-expansion-panel>
</mat-accordion>
</div>
</div>
<div style="width: 100%;margin-top: 25px;" *ngFor="let item of companyOptionalGrouping;let key = index">
<mat-accordion multi>
<mat-expansion-panel>
<mat-expansion-panel-header>
<h3 style="text-align: center;font-weight: 550;">{{item.name}}</h3>
<!-- <mat-icon title="保存" style="margin-left: 25px;" (click)='editCompanyOptional($event,item)'>description</mat-icon> -->
</mat-expansion-panel-header>
<div *ngFor="let items of item.propertyInfos" class="InputField">
<label>{{items.propertyName}}:</label>
<input readonly type="text" *ngIf="items.propertyType!=1&&items.propertyType!=2&&items.propertyType!=4&&items.propertyType!=6"
[(ngModel)]="items.propertyValue" name="propertyValue">
<textarea readonly maxlength="250" *ngIf="items.propertyType==1" [(ngModel)]="items.propertyValue" name="propertyValue"></textarea>
<input readonly type="number" *ngIf="items.propertyType==2 ||items.propertyType==4" [(ngModel)]="items.propertyValue" name="propertyValue">
<mat-radio-group *ngIf="items.propertyType==6" [(ngModel)]="items.propertyValue" name="propertyValue">
<mat-radio-button style="margin-left: 5px;" [value]='radio.value' *ngFor="let radio of singleElection">{{radio.name}}</mat-radio-button>
</mat-radio-group>
</div>
</mat-expansion-panel>
</mat-accordion>
</div>
</div>
</mat-tab>
<mat-tab label="{{newItem.name}}" *ngFor="let newItem of allBuildingGrouping">
<div class="contentBox">

10
src/app/key-unit/fire-fighting-device-look/fire-fighting-device.component.ts
Unescape View File

@ -21,7 +21,6 @@ export class FireFightingDeviceLookComponent implements OnInit {
constructor(private router:Router,private route:ActivatedRoute,public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { }
ngOnInit(): void {
this.getCompanyInformation()
this.getAllBuilding()
}
@ -234,7 +233,14 @@ export class FireFightingDeviceLookComponent implements OnInit {
companyId:companyId
}}).subscribe((data:any)=>{
this.allBuildingGrouping = data
if (this.allBuildingGrouping.length) { this.getAllBuildingFacilities() }
if (this.allBuildingGrouping.length) {
this.getAllBuildingFacilities()
} else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('暂无建筑数据','确定',config);
}
})
}

94
src/app/key-unit/fire-fighting-device/fire-fighting-device.component.html
Unescape View File

@ -1,99 +1,5 @@
<div class="content">
<mat-tab-group>
<mat-tab label="单位消防设施">
<div class="contentBox">
<p style="width: 100%; margin: 30px auto; text-align: center;" *ngIf="!companyBuiltInGrouping.length">暂无数据,请完善单位基本信息</p>
<div style="width: 100%;margin-top: 25px;" *ngFor="let item of companyBuiltInGrouping;let key = index">
<h3 style="text-align: center;font-weight: 550;">{{item.name}}</h3>
<div style="margin-bottom: 10px;">
<mat-icon title="创建" (click)='addCompanyGrouping(item)'>add_circle_outline</mat-icon>
<mat-icon title="保存" style="margin-left: 25px;" (click)='editCompanyGrouping(item)'>description</mat-icon>
<mat-icon title="删除" style="margin-left: 25px;" (click)='deleteCompanyGrouping(item)'>delete</mat-icon>
</div>
<div>
<mat-accordion multi>
<mat-expansion-panel disabled>
<mat-expansion-panel-header>
<label class="firstContent"></label>
<label class="textContent">项目</label>
<label class="textContent">照片</label>
<label class="totalContent">总数</label>
<label class="lastTextContent">主要情况</label>
</mat-expansion-panel-header>
</mat-expansion-panel>
<mat-expansion-panel *ngFor="let items of item.facilityItems" disabled [expanded]=items.expanded>
<mat-expansion-panel-header>
<label class="firstContent">
<mat-checkbox (change)='checkedCompany($event,item,items)' [disabled]='items.isBuiltin'></mat-checkbox>
</label>
<label class="textContent">{{items.name}}</label>
<label class="textContent"><a href="javascript:void(0)" (click)='previewImg(items)'>查看图片</a></label>
<label class="totalContent">{{items.total ? items.total : '总数: 0'}}</label>
<label class="lastTextContent">
<textarea maxlength="250" [(ngModel)]="items.details" style="width: 80%;"></textarea>
</label>
<label><mat-icon (click)='SwitchBoard(items)' *ngIf="items.isBuiltin">keyboard_arrow_down</mat-icon></label>
</mat-expansion-panel-header>
<div class="overflowTable">
<div class="detailsTable">
<table>
<tr>
<th *ngFor="let header of items.header">{{header}}</th>
</tr>
<tr *ngFor="let body of items.body">
<td *ngFor="let header of items.header">{{body[header]? body[header] : '暂无数据'}}</td>
</tr>
</table>
</div>
<div *ngFor="let tableMsg of items.loopTable" class="detailsTable">
<p style="text-align: center; font-size: 16px; margin: 5px 0;">楼层/区域名称: {{tableMsg.name? tableMsg.name: '暂无名称'}}</p>
<table>
<tr>
<th *ngFor="let header of tableMsg.header">{{header}}</th>
</tr>
<tr *ngFor="let body of tableMsg.body">
<td *ngFor="let header of tableMsg.header">{{body[header]? body[header] : '暂无数据'}}</td>
</tr>
</table>
</div>
</div>
</mat-expansion-panel>
</mat-accordion>
</div>
</div>
<div style="width: 100%;margin-top: 25px;" *ngFor="let item of companyOptionalGrouping;let key = index">
<mat-accordion multi>
<mat-expansion-panel>
<mat-expansion-panel-header>
<h3 style="text-align: center;font-weight: 550;">{{item.name}}</h3>
<mat-icon title="保存" style="margin-left: 25px;" (click)='editCompanyOptional($event,item)'>description</mat-icon>
</mat-expansion-panel-header>
<div *ngFor="let items of item.propertyInfos" class="InputField">
<label>{{items.propertyName}}:</label>
<input type="text" *ngIf="items.propertyType!=1&&items.propertyType!=2&&items.propertyType!=4&&items.propertyType!=6"
[(ngModel)]="items.propertyValue" name="propertyValue">
<textarea maxlength="250" *ngIf="items.propertyType==1" [(ngModel)]="items.propertyValue" name="propertyValue"></textarea>
<input type="number" *ngIf="items.propertyType==2 ||items.propertyType==4" [(ngModel)]="items.propertyValue" name="propertyValue">
<mat-radio-group *ngIf="items.propertyType==6" [(ngModel)]="items.propertyValue" name="propertyValue">
<mat-radio-button style="margin-left: 5px;" [value]='radio.value' *ngFor="let radio of singleElection">{{radio.name}}</mat-radio-button>
</mat-radio-group>
</div>
</mat-expansion-panel>
</mat-accordion>
</div>
</div>
</mat-tab>
<mat-tab label="{{newItem.name}}" *ngFor="let newItem of allBuildingGrouping">
<div class="contentBox">

10
src/app/key-unit/fire-fighting-device/fire-fighting-device.component.ts
Unescape View File

@ -22,7 +22,6 @@ export class FireFightingDeviceComponent implements OnInit {
constructor(private tabbarService: TabbarAndScoreService,private router:Router,private route:ActivatedRoute,public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { }
ngOnInit(): void {
this.getCompanyInformation()
this.getAllBuilding()
}
@ -233,7 +232,14 @@ export class FireFightingDeviceComponent implements OnInit {
companyId:companyId
}}).subscribe((data:any)=>{
this.allBuildingGrouping = data
if (this.allBuildingGrouping.length) { this.getAllBuildingFacilities() }
if (this.allBuildingGrouping.length) {
this.getAllBuildingFacilities()
} else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('暂无建筑数据','确定',config);
}
})
}

53
src/app/key-unit/function-division-look/function-division.component.html
Unescape View File

@ -1,59 +1,6 @@
<div class="content">
<div style="margin-top:16px">
<!-- <mat-icon title="创建" (click)='addPartition()'>add_circle_outline</mat-icon> -->
</div>
<mat-tab-group class="tableContent">
<mat-tab label="单位功能分区">
<div style="overflow: auto; height: 100%;">
<div style="margin: 30px 0 25px 5%;">
<!-- <mat-icon title="创建" (click)='addCompany()'>add_circle_outline</mat-icon>
<mat-icon title="保存" style="margin-left: 25px;" (click)='preservation()'>description</mat-icon>
<mat-icon title="删除" style="margin-left: 25px;" (click)='delete()'>delete</mat-icon> -->
</div>
<table mat-table [dataSource]="companyFunctionalZoning">
<ng-container matColumnDef="checked">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element">
<mat-checkbox disabled (change)='changeCompany(element,$event)'></mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="region">
<th mat-header-cell *matHeaderCellDef>区域</th>
<td mat-cell *matCellDef="let element">
<mat-form-field class="example-full-width">
<input readonly matInput [(ngModel)]="element.region" type="text" maxlength="20">
</mat-form-field>
</td>
</ng-container>
<ng-container matColumnDef="measure">
<th mat-header-cell *matHeaderCellDef>面积</th>
<td mat-cell *matCellDef="let element">
<mat-form-field class="example-full-width">
<input readonly matInput type="number" [(ngModel)]="element.area" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" placeholder="请输入数字">
</mat-form-field>
<label style="margin-left: 5px;">m²</label>
</td>
</ng-container>
<ng-container matColumnDef="situation">
<th mat-header-cell *matHeaderCellDef>基本情况</th>
<td mat-cell *matCellDef="let element">
<textarea readonly [(ngModel)]="element.details" maxlength="250"></textarea>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<p style="width: 100%; margin-top: 30px; text-align: center;" *ngIf="!companyFunctionalZoning.length">暂无数据</p>
</div>
</mat-tab>
<mat-tab label="{{item.name}}" *ngFor="let item of allBuildingFunctionalZoning;let key = index">
<div style="overflow: auto; height: 100%;">
<div style="margin: 30px 0 25px 5%;">

6
src/app/key-unit/function-division-look/function-division.component.ts
Unescape View File

@ -16,7 +16,6 @@ export class FunctionDivisionLookComponent implements OnInit {
ngOnInit(): void {
this.companyId = this.route.snapshot.queryParams.id
this.getAllCompany()
this.getAllBuilding()
}
@ -121,6 +120,11 @@ export class FunctionDivisionLookComponent implements OnInit {
element.functionalZoning = null
});
this.getAllBuildingFunctionalZoning()
} else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('暂无建筑数据','确定',config);
}
})
}

51
src/app/key-unit/function-division/function-division.component.html
Unescape View File

@ -1,59 +1,10 @@
<div class="content">
<div style="margin-top:16px">
<div style="margin-top:16px" *ngIf="allBuilding.length">
<mat-icon title="创建" (click)='addPartition()'>add_circle_outline</mat-icon>
</div>
<mat-tab-group class="tableContent">
<mat-tab label="单位功能分区">
<div style="overflow: auto; height: 100%;">
<div style="margin: 30px 0 25px 5%;">
<mat-icon title="创建" (click)='addCompany()'>add_circle_outline</mat-icon>
<mat-icon title="保存" style="margin-left: 25px;" (click)='preservation()'>description</mat-icon>
<mat-icon title="删除" style="margin-left: 25px;" (click)='delete()'>delete</mat-icon>
</div>
<table mat-table [dataSource]="companyFunctionalZoning">
<ng-container matColumnDef="checked">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element">
<mat-checkbox (change)='changeCompany(element,$event)'></mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="region">
<th mat-header-cell *matHeaderCellDef>区域</th>
<td mat-cell *matCellDef="let element">
<mat-form-field class="example-full-width">
<input matInput [(ngModel)]="element.region" type="text" maxlength="20">
</mat-form-field>
</td>
</ng-container>
<ng-container matColumnDef="measure">
<th mat-header-cell *matHeaderCellDef>面积</th>
<td mat-cell *matCellDef="let element">
<mat-form-field class="example-full-width">
<input matInput type="number" [(ngModel)]="element.area" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" placeholder="请输入数字">
</mat-form-field>
<label style="margin-left: 5px;">m²</label>
</td>
</ng-container>
<ng-container matColumnDef="situation">
<th mat-header-cell *matHeaderCellDef>基本情况</th>
<td mat-cell *matCellDef="let element">
<textarea [(ngModel)]="element.details" maxlength="250"></textarea>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<p style="width: 100%; margin-top: 30px; text-align: center;" *ngIf="!companyFunctionalZoning.length">暂无数据</p>
</div>
</mat-tab>
<mat-tab label="{{item.name}}" *ngFor="let item of allBuildingFunctionalZoning;let key = index">
<div style="overflow: auto; height: 100%;">
<div style="margin: 30px 0 25px 5%;">

7
src/app/key-unit/function-division/function-division.component.ts
Unescape View File

@ -17,7 +17,6 @@ export class FunctionDivisionComponent implements OnInit {
ngOnInit(): void {
this.companyId = this.route.snapshot.queryParams.id
this.getAllCompany()
this.getAllBuilding()
}
@ -49,7 +48,6 @@ export class FunctionDivisionComponent implements OnInit {
//保存单位功能分区属性
preservation () {
let companyId = this.route.snapshot.queryParams.id
// console.log(123,companyId)
if (this.companyFunctionalZoning.length) {
this.http.post('/api/CompanyFunctionalDivisions/Batch',this.companyFunctionalZoning,{params:{
companyId:companyId
@ -124,6 +122,11 @@ export class FunctionDivisionComponent implements OnInit {
element.functionalZoning = null
});
this.getAllBuildingFunctionalZoning()
} else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('暂无建筑数据','确定',config);
}
})
}

57
src/app/key-unit/key-site-look/key-site.component.html
Unescape View File

@ -1,62 +1,5 @@
<div class="content">
<mat-tab-group style="height: 100%;">
<mat-tab label="单位重点部位">
<div class="contentBox">
<div style="margin-top: 25px;">
<h3 style="text-align: center;font-weight: 550;">重点部位情况</h3>
<table mat-table [dataSource]="allCompanyPosition">
<ng-container matColumnDef="mainname">
<th mat-header-cell *matHeaderCellDef>重点部位名称</th>
<td mat-cell *matCellDef="let element">
{{element.name}}
</td>
</ng-container>
<ng-container matColumnDef="position">
<th mat-header-cell *matHeaderCellDef>重点部位所在位置</th>
<td mat-cell *matCellDef="let element">
{{element.position}}
</td>
</ng-container>
<ng-container matColumnDef="construction">
<th mat-header-cell *matHeaderCellDef>建筑结构</th>
<td mat-cell *matCellDef="let element">
{{element.structure}}
</td>
</ng-container>
<ng-container matColumnDef="nature">
<th mat-header-cell *matHeaderCellDef>使用性质</th>
<td mat-cell *matCellDef="let element">
{{element.nature}}
</td>
</ng-container>
<ng-container matColumnDef="danger">
<th mat-header-cell *matHeaderCellDef>主要危险性</th>
<td mat-cell *matCellDef="let element">
{{element.hazards}}
</td>
</ng-container>
<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>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<p style="text-align: center;" *ngIf="!allCompanyPosition.length">暂无数据,请前往平面图进行相关数据录入</p>
</div>
<div style="margin-top: 25px; text-align: left;">
<h3 style="text-align: center;font-weight: 550;">重点提示</h3>
<!-- <mat-icon title="保存" style="margin-left: 11%; cursor: pointer;" (click)='Preservation()'>description</mat-icon> -->
<p class="tips">
<textarea readonly [(ngModel)]="companyInput" maxlength="500"></textarea>
</p>
</div>
</div>
</mat-tab>
<mat-tab label="{{item.name}}" *ngFor="let item of allBuilding">
<div class="contentBox">

7
src/app/key-unit/key-site-look/key-site.component.ts
Unescape View File

@ -19,8 +19,6 @@ export class KeySiteLookComponent implements OnInit {
displayedColumns: string[] = ['mainname', 'position', 'construction', 'nature', 'danger', 'img'];
ngOnInit(): void {
this.getCompanyPostion()
this.getCompanyTips()
this.getAllBuilding()
}
@ -59,6 +57,11 @@ export class KeySiteLookComponent implements OnInit {
element.companyInput = null }) //建筑重点提示数据
this.getAllBuildingPositon()
this.getAllBuildingTips()
} else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('暂无建筑数据','确定',config);
}
})
}

57
src/app/key-unit/key-site/key-site.component.html
Unescape View File

@ -1,62 +1,5 @@
<div class="content">
<mat-tab-group style="height: 100%;">
<mat-tab label="单位重点部位">
<div class="contentBox">
<div style="margin-top: 25px;">
<h3 style="text-align: center;font-weight: 550;">重点部位情况</h3>
<table mat-table [dataSource]="allCompanyPosition">
<ng-container matColumnDef="mainname">
<th mat-header-cell *matHeaderCellDef>重点部位名称</th>
<td mat-cell *matCellDef="let element">
{{element.name}}
</td>
</ng-container>
<ng-container matColumnDef="position">
<th mat-header-cell *matHeaderCellDef>重点部位所在位置</th>
<td mat-cell *matCellDef="let element">
{{element.position}}
</td>
</ng-container>
<ng-container matColumnDef="construction">
<th mat-header-cell *matHeaderCellDef>建筑结构</th>
<td mat-cell *matCellDef="let element">
{{element.structure}}
</td>
</ng-container>
<ng-container matColumnDef="nature">
<th mat-header-cell *matHeaderCellDef>使用性质</th>
<td mat-cell *matCellDef="let element">
{{element.nature}}
</td>
</ng-container>
<ng-container matColumnDef="danger">
<th mat-header-cell *matHeaderCellDef>主要危险性</th>
<td mat-cell *matCellDef="let element">
{{element.hazards}}
</td>
</ng-container>
<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>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<p style="text-align: center;" *ngIf="!allCompanyPosition.length">暂无数据,请前往平面图进行相关数据录入</p>
</div>
<div style="margin-top: 25px; text-align: left;">
<h3 style="text-align: center;font-weight: 550;">重点提示</h3>
<mat-icon title="保存" style="margin-left: 11%; cursor: pointer;" (click)='Preservation()'>description</mat-icon>
<p class="tips">
<textarea [(ngModel)]="companyInput" maxlength="5000"></textarea>
</p>
</div>
</div>
</mat-tab>
<mat-tab label="{{item.name}}" *ngFor="let item of allBuilding">
<div class="contentBox">

7
src/app/key-unit/key-site/key-site.component.ts
Unescape View File

@ -20,8 +20,6 @@ export class KeySiteComponent implements OnInit {
displayedColumns: string[] = ['mainname', 'position', 'construction', 'nature', 'danger', 'img'];
ngOnInit(): void {
this.getCompanyPostion()
this.getCompanyTips()
this.getAllBuilding()
}
@ -60,6 +58,11 @@ export class KeySiteComponent implements OnInit {
element.companyInput = null }) //建筑重点提示数据
this.getAllBuildingPositon()
this.getAllBuildingTips()
} else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('暂无建筑数据','确定',config);
}
})
}

3
src/app/key-unit/key-unit-management/key-unit-management.component.html
Unescape View File

@ -1,5 +1,4 @@
<div style="height: 100%;overflow: hidden">
<div style="height: 100%;overflow-y: auto">
<div id="header" class="header" (click)="bigclosediv($event)">
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm">
<div class="queryBox">

1
src/app/pages/login/login.component.ts
Unescape View File

@ -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"})

58
src/app/plan-audit/plan-pass/plan-pass.component.html
Unescape View File

@ -1,36 +1,36 @@
<div style="height: 100%; overflow: hidden;">
<div style="height: 100%; overflow: hidden; display: flex; flex-direction: column;">
<mat-accordion>
<mat-expansion-panel disabled>
<mat-expansion-panel-header>
<div class="planHeader">
<mat-accordion>
<mat-expansion-panel disabled>
<mat-expansion-panel-header>
<div class="planHeader">
<div class="planBox">
<span>单位名称: </span>
<span>{{compantData.name?compantData.name : '暂无数据'}}</span>
<div class="planBox">
<span>单位名称: </span>
<span>{{compantData.name?compantData.name : '暂无数据'}}</span>
</div>
<div class="planBox">
<span>消防救援站: </span>
<span>{{organizationName}}</span>
</div>
<div class="planBox">
<span>单位类型: </span>
<span>{{compantData.buildingTypes.length?compantData.buildingTypes[0].name : '暂无数据'}}</span>
</div>
<div class="planBox">
<span>单位地址: </span>
<span>{{compantData.address?compantData.address : '暂无数据'}}</span>
</div>
<div>
<button mat-raised-button color="primary" (click)='toExamine()' *ngIf="type != 6">审核</button>
</div>
</div>
<div class="planBox">
<span>消防救援站: </span>
<span>{{organizationName}}</span>
</div>
<div class="planBox">
<span>单位类型: </span>
<span>{{compantData.buildingTypes.length?compantData.buildingTypes[0].name : '暂无数据'}}</span>
</div>
<div class="planBox">
<span>单位地址: </span>
<span>{{compantData.address?compantData.address : '暂无数据'}}</span>
</div>
<div>
<button mat-raised-button color="primary" (click)='toExamine()' *ngIf="type != 6">审核</button>
</div>
</div>
</mat-expansion-panel-header>
</mat-expansion-panel>
</mat-accordion>
</mat-expansion-panel-header>
</mat-expansion-panel>
</mat-accordion>
<div class="planBody" style="width: 100%;height: 100%;padding: 10px;box-sizing: border-box;overflow-y: auto;">
<div class="planBody" style="flex: 1; overflow: hidden;">
<div class="table" style="width: 100%;" *ngIf="planType==0">
<table mat-table [dataSource]="allFile">

2
src/app/plan-management/entry-plan/entry-plan.component.html
Unescape View File

@ -254,7 +254,7 @@
<ng-container matColumnDef="operation">
<th mat-header-cell *matHeaderCellDef>操作</th>
<td mat-cell *matCellDef="let element">
<span (click)='routerTo(element)' style="color: blue;">查看预案</span>
<span style="color: blue;" (click)="routerTo(element)">查看预案</span>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>

13
src/app/ui/organization/addOffices.html
Unescape View File

@ -0,0 +1,13 @@
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
<mat-form-field>
<input matInput id="name" name="name" type='text'
required ngModel #name="ngModel" placeholder="请输入下属机关名称">
</mat-form-field>
<div class="btn">
<button type="submit" class="savebtn" mat-raised-button color="primary" [disabled]='form.invalid'>确定</button>
<button type="button" mat-button (click)="onNoClick()" mat-raised-button>取消</button>
</div>
</form>

11
src/app/ui/organization/createorganization.component.html
Unescape View File

@ -15,19 +15,10 @@
<input matInput id="division" name="division" type='text'
ngModel #division="ngModel" placeholder="请输入区划">
</mat-form-field>
<!-- <mat-form-field class="example-full-width">
<input type="text" placeholder="是否拥有权限" aria-label="Number" matInput [matAutocomplete]="auto1" name="enabled" ngModel #enabled="ngModel">
<mat-autocomplete #auto1="matAutocomplete">
<mat-option *ngFor="let option of options2" [value]="option">
{{option}}
</mat-option>
</mat-autocomplete>
</mat-form-field> -->
<div class="btn">
<button type="submit" class="savebtn" mat-raised-button color="primary" [disabled]='form.invalid'>确定</button>
<button type="button" mat-button (click)="onNoClick()" mat-raised-button>取消</button>
</div>
</form>
</form>

13
src/app/ui/organization/editOffices.html
Unescape View File

@ -0,0 +1,13 @@
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
<mat-form-field>
<input matInput id="name" name="name" type='text'
required [(ngModel)]="officeName" placeholder="请输入下属机关名称">
</mat-form-field>
<div class="btn">
<button type="submit" class="savebtn" mat-raised-button color="primary" [disabled]='form.invalid'>确定</button>
<button type="button" mat-button (click)="onNoClick()" mat-raised-button>取消</button>
</div>
</form>

94
src/app/ui/organization/organization.component.html
Unescape View File

@ -1,39 +1,65 @@
<div style="height: 100%; overflow-y: auto;position: relative">
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl" >
<mat-tree-node *matTreeNodeDef="let node;" matTreeNodePadding>
<button mat-icon-button disabled ></button>
{{node.name}}
<button mat-icon-button class="create" (click)="create(node)"><mat-icon>add_circle_outline</mat-icon></button>
<button mat-icon-button class="edit" (click)="edit(node)"><mat-icon>create</mat-icon></button>
<button mat-icon-button class="up" (click)="up(node)" [disabled]="!node.isTop?false:true"><mat-icon>arrow_upward</mat-icon></button>
<button mat-icon-button class="down" (click)="down(node)" [disabled]="!node.isBottom?false:true"><mat-icon>arrow_downward</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="node.enabled" color="warn"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="!node.enabled"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="deleted" (click)="delete(node)"><mat-icon>delete</mat-icon></button>
<div class="box" style="height: 100%; overflow-y: auto;position: relative">
<div>
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl" >
<mat-tree-node *matTreeNodeDef="let node;" matTreeNodePadding (click)="getOffices(node)">
<button mat-icon-button disabled ></button>
{{node.name}}
<button mat-icon-button class="create" (click)="create(node)"><mat-icon>add_circle_outline</mat-icon></button>
<button mat-icon-button class="edit" (click)="edit(node)"><mat-icon>create</mat-icon></button>
<button mat-icon-button class="up" (click)="up(node)" [disabled]="!node.isTop?false:true"><mat-icon>arrow_upward</mat-icon></button>
<button mat-icon-button class="down" (click)="down(node)" [disabled]="!node.isBottom?false:true"><mat-icon>arrow_downward</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="node.enabled" color="warn"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="!node.enabled"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="deleted" (click)="delete(node)"><mat-icon>delete</mat-icon></button>
</mat-tree-node>
<mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding (click)="getOffices(node)">
<button mat-icon-button
matTreeNodeToggle
[attr.aria-label]="'toggle ' + node.name">
<mat-icon class="mat-icon-rtl-mirror">
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
{{node.name}}
<button mat-icon-button class="create" (click)="create(node)"><mat-icon>add_circle_outline</mat-icon></button>
<button mat-icon-button class="edit" (click)="edit(node)"><mat-icon>create</mat-icon></button>
<button mat-icon-button class="up" (click)="up(node)" [disabled]="!node.isTop?false:true"><mat-icon>arrow_upward</mat-icon></button>
<button mat-icon-button class="down" (click)="down(node)" [disabled]="!node.isBottom?false:true"><mat-icon>arrow_downward</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="node.enabled" color="warn"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="!node.enabled"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="deleted" (click)="delete(node)"><mat-icon>delete</mat-icon></button>
</mat-tree-node>
</mat-tree-node>
<mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding>
<button mat-icon-button
matTreeNodeToggle
[attr.aria-label]="'toggle ' + node.name">
<mat-icon class="mat-icon-rtl-mirror">
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
{{node.name}}
<button mat-icon-button class="create" (click)="create(node)"><mat-icon>add_circle_outline</mat-icon></button>
<button mat-icon-button class="edit" (click)="edit(node)"><mat-icon>create</mat-icon></button>
<button mat-icon-button class="up" (click)="up(node)" [disabled]="!node.isTop?false:true"><mat-icon>arrow_upward</mat-icon></button>
<button mat-icon-button class="down" (click)="down(node)" [disabled]="!node.isBottom?false:true"><mat-icon>arrow_downward</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="node.enabled" color="warn"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="disabled" (click)="disable(node)" *ngIf="!node.enabled"><mat-icon>block</mat-icon></button>
<button mat-icon-button class="deleted" (click)="delete(node)"><mat-icon>delete</mat-icon></button>
</mat-tree>
</div>
</mat-tree-node>
</mat-tree>
<!-- 组织机构下属机关 -->
<div class="rightDiv" *ngIf="selectedOrg">
<div class="topbox">
({{selectedOrg.name}})组织机构下属机关
<button style="width: 68px;margin: 0 12px;" mat-flat-button color="primary" (click)="addOffices()">新增</button>
</div>
<div class="listBox">
<ul>
<li *ngFor="let item of OfficesList">
<span>{{item.officeName}}</span>
<span class="btnbox">
<button mat-icon-button class="edit" (click)="editOffice(item)"><mat-icon>create</mat-icon></button>
<button mat-icon-button class="deleted" (click)="deleteOffice(item)"><mat-icon style="color: #f44336;">delete</mat-icon></button>
</span>
</li>
</ul>
<span style="text-align: center;" *ngIf="OfficesList && OfficesList.length == 0">
暂无下属机关
</span>
</div>
</div>
<div *ngIf="isloading" style="position: absolute;width: 100%;height: 100%;background-color: rgba(125, 125, 125, 0.3);z-index: 999;left: 0;top: 0;text-align: center;">
<mat-spinner style="position: fixed;top: 40%;left: 50%;transform: translate(-40%,-50%);"></mat-spinner>
<p style="position: fixed;top:53%;left: 53%;transform: translate(-53%,-50%);">努力加载中...</p>

38
src/app/ui/organization/organization.component.scss
Unescape View File

@ -68,4 +68,42 @@ form{
.orilist:hover{
cursor: pointer;
background-color: rgba(225, 225, 225, 0.8);
}
.box{
div{
float: left;
}
.rightDiv{
display: flex;
flex-direction: column;
border: 1px solid gray;
border-radius: 6px;
box-sizing: border-box;
padding: 20px;
.topbox{
display: flex;
height: 40px;
line-height: 40px;
}
.listBox{
width: 100%;
text-align: center;
li{
display: flex;
justify-content: space-between;
box-sizing: border-box;
padding: 3px 6px;
align-items: center;
.btnbox{
display: flex;
align-items: center;
button{
margin: 0 2px;
}
}
}
}
}
}

124
src/app/ui/organization/organization.component.ts
Unescape View File

@ -337,6 +337,58 @@ export class OrganizationComponent implements OnInit {
})
}
selectedOrg:any//当前选择的组织机构
OfficesList:any //获得的下级列表
//获得点击组织机构的下级机关单位
getOffices(node){
console.log(node)
this.selectedOrg = node
this.http.get(`/api/OrganizationsOffices/${node.id}`).subscribe(data => {
console.log("获取成功",data)
this.OfficesList = data
})
}
//新增下属机关
addOffices(){
const dialogRef = this.dialog.open(addOffices, {//调用open方法打开对话框并且携带参数过去
data: {selectedOrg:this.selectedOrg,OfficesList:this.OfficesList}
});
dialogRef.afterClosed().subscribe(
data=>{
if(data == '创建成功'){
this.getOffices(this.selectedOrg)
}
}
);
}
//编辑机关
editOffice(item){
const dialogRef = this.dialog.open(editOffices, {//调用open方法打开对话框并且携带参数过去
data: {item:item}
});
dialogRef.afterClosed().subscribe(
data=>{
if(data == '修改成功'){
this.getOffices(this.selectedOrg)
}
}
);
}
//删除机关
deleteOffice(item){
let isDelete = window.confirm('确定要删除此机关吗?')
if(isDelete){
this.http.delete(`/api/OrganizationsOffices/${item.id}`).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('删除成功','确定',config);
this.getOffices(this.selectedOrg)
})
}
}
}
@ -555,4 +607,76 @@ export class EditOrganization {
}
}
}
//增加下属机关
@Component({
selector: 'addOffices',
templateUrl: './addOffices.html',
styleUrls: ['./organization.component.scss']
})
export class addOffices {
constructor(private http: HttpClient,public dialogRef: MatDialogRef<addOffices>,@Inject(MAT_DIALOG_DATA) public data,public snackBar: MatSnackBar) {}
onNoClick(): void {
this.dialogRef.close();
}
onSubmit(value){
console.log(value)
let body = {
id: null,
organizationId: this.data.selectedOrg.id,
officeName: value.name,
order: this.data.OfficesList.length == 0 ? 0 : this.data.OfficesList[this.data.OfficesList.length - 1].order,
enabled: true
}
this.http.post('/api/OrganizationsOffices',body).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('创建成功','确定',config);
this.dialogRef.close('创建成功');
})
}
}
//编辑下属机关
@Component({
selector: 'editOffices',
templateUrl: './editOffices.html',
styleUrls: ['./organization.component.scss']
})
export class editOffices {
constructor(private http: HttpClient,public dialogRef: MatDialogRef<editOffices>,@Inject(MAT_DIALOG_DATA) public data,public snackBar: MatSnackBar) {}
ngOnInit(): void {
console.log(this.data)
}
onNoClick(): void {
this.dialogRef.close();
}
officeName:any = this.data.item.officeName
onSubmit(value){
console.log(value)
let body = {
id: this.data.item.id,
organizationId: this.data.item.organizationId,
officeName: value.name,
order: this.data.item.order,
enabled: true
}
this.http.put(`/api/OrganizationsOffices/${this.data.item.id}`,body).subscribe(data => {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('修改成功','确定',config);
this.dialogRef.close('修改成功');
})
}
}

4
src/app/ui/ui.module.ts
Unescape View File

@ -62,7 +62,7 @@ import { PersonaldataComponent } from '../pages/personaldata/personaldata.compon
import { FooterComponent } from './footer/footer.component';
import { UserdataComponent, EditUser } from './userdata/userdata.component';
import { ChangepasswordComponent } from './changepassword/changepassword.component';
import { OrganizationComponent, CreateOrganization, EditOrganization } from './organization/organization.component';
import { OrganizationComponent, CreateOrganization, EditOrganization, addOffices, editOffices } from './organization/organization.component';
import { UnittypeComponent,DialogOverviewExampleDialog,editorialUnit } from './unittype/unittype.component';
import { AuthorityComponent, CreateAuthority } from './authority/authority.component';
import { RoleComponent, CreateRole, EditRole } from './role/role.component';
@ -99,7 +99,7 @@ import { CollectionToolsPlanComponent, CreateBuildingPlan, EditBuildingPlan, Vie
import { addDisposalNodeComponentPlan, editDisposalNodeComponentPlan, editPlaneFigureComponentPlan, leftFunctionalDomainComponentPlan } from './collection-tools-plan/leftFunctionalDomain';
import { saveOneDialogPlan, saveTwoDialogPlan } from './collection-tools-plan/save';
@NgModule({
declarations: [UiComponent, DateselectComponent, MenuComponent, CardComponent, ListComponent, GridComponent, StepperComponent, TabgroupComponent, ButtonComponent, BadgeComponent, ProgressComponent, SnackbarComponent,PersonaldataComponent, FooterComponent, UserdataComponent, ChangepasswordComponent, OrganizationComponent, UnittypeComponent, AuthorityComponent, RoleComponent, UsermanagementComponent,IsnoPipe,ConfirmpswDirective,DialogOverviewExampleDialog,CreateAuthority,CreateRole,TimePipe,CreateNewUser,EditNewUser,allRoles,EditRole,CreateOrganization,EditOrganization,seeInformation,EditUser,editorialUnit,FireProtectionElementsComponent,Establish,EditingFireControl,FireFightingTemplateComponent, NavmenusComponent,CreateMenus,EditMenus,NewFireFighting,EditFireClassification, MaterialBankComponent, UnitInformationComponent,AddMatLibrary,EditMatLibrary,attributeComponent,AddOriginalCopy,addAttributeComponent,editAttribute,EditOriginalCopy,SelectOriginalCopy,EditUnitInfo,AddUnitInfo,AddGroups,EditGroup, EnterpriseuserComponent,AddEnterpriserUser,addUnitAttributeComponent,editUnitAttribute,seeenterpriseuser,editenterpriseuser, FireFightingFacilitiesFormworkComponent,addFireFightingFacilitiesFormworkComponent,editFireFightingFacilitiesFormworkComponent,addBuiltInComponent,addBuiltInAttributeComponent,addOptionalComponent,addOptionalAttributeComponent,editBuiltInAttributeComponent,editOptionalAttributeComponent, CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent,CollectionToolsPlanComponent,CreateBuildingPlan,EditBuildingPlan,ViewDetailsPlan,leftFunctionalDomainComponentPlan,editPlaneFigureComponentPlan,addDisposalNodeComponentPlan,editDisposalNodeComponentPlan,saveOneDialogPlan,saveTwoDialogPlan],
declarations: [UiComponent, DateselectComponent, MenuComponent, CardComponent, ListComponent, GridComponent, StepperComponent, TabgroupComponent, ButtonComponent, BadgeComponent, ProgressComponent, SnackbarComponent,PersonaldataComponent, FooterComponent, UserdataComponent, ChangepasswordComponent, OrganizationComponent, UnittypeComponent, AuthorityComponent, RoleComponent, UsermanagementComponent,IsnoPipe,ConfirmpswDirective,DialogOverviewExampleDialog,CreateAuthority,CreateRole,TimePipe,CreateNewUser,EditNewUser,allRoles,EditRole,CreateOrganization,EditOrganization,seeInformation,EditUser,editorialUnit,FireProtectionElementsComponent,Establish,EditingFireControl,FireFightingTemplateComponent, NavmenusComponent,CreateMenus,EditMenus,NewFireFighting,EditFireClassification, MaterialBankComponent, UnitInformationComponent,AddMatLibrary,EditMatLibrary,attributeComponent,AddOriginalCopy,addAttributeComponent,editAttribute,EditOriginalCopy,SelectOriginalCopy,EditUnitInfo,AddUnitInfo,AddGroups,EditGroup, EnterpriseuserComponent,AddEnterpriserUser,addUnitAttributeComponent,editUnitAttribute,seeenterpriseuser,editenterpriseuser, FireFightingFacilitiesFormworkComponent,addFireFightingFacilitiesFormworkComponent,editFireFightingFacilitiesFormworkComponent,addBuiltInComponent,addBuiltInAttributeComponent,addOptionalComponent,addOptionalAttributeComponent,editBuiltInAttributeComponent,editOptionalAttributeComponent, CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent,CollectionToolsPlanComponent,CreateBuildingPlan,EditBuildingPlan,ViewDetailsPlan,leftFunctionalDomainComponentPlan,editPlaneFigureComponentPlan,addDisposalNodeComponentPlan,editDisposalNodeComponentPlan,saveOneDialogPlan,saveTwoDialogPlan,addOffices,editOffices],
imports: [
CommonModule,

14
src/app/ui/usermanagement/createUser.html
Unescape View File

@ -36,7 +36,11 @@
<input type="text" matInput [(ngModel)]="organizationName" disabled required name="organizationName" placeholder="所属机构">
</mat-form-field>
</div>
<div mat-dialog-content>
<mat-form-field>
<input type="text" matInput [(ngModel)]="selectedOffices.officeName" disabled name="officeName" placeholder="所属机关">
</mat-form-field>
</div>
<div mat-dialog-content *ngIf="errmsg">
<p style="font-size: 14px; color: red;">{{errmsg}}</p>
</div>
@ -67,4 +71,12 @@
<li>{{node.name}}</li>
</mat-tree-node>
</mat-tree>
</div>
<div class="officesbox">
<span>请选择机构下属机关</span>
<div class="officesList">
<ul>
<li *ngFor="let item of OfficesList" (click)="selectOffice(item)">{{item.officeName}}</li>
</ul>
</div>
</div>

14
src/app/ui/usermanagement/editUser.html
Unescape View File

@ -33,7 +33,11 @@
<input type="text" matInput [(ngModel)]="affiliateName" disabled required name="organizationName" placeholder="所属机构">
</mat-form-field>
</div>
<div mat-dialog-content>
<mat-form-field>
<input type="text" matInput [(ngModel)]="selectedOffices.officeName" disabled name="officeName" placeholder="所属机关">
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid">确定</button>
<button mat-raised-button mat-dialog-close>取消</button>
@ -60,4 +64,12 @@
<li>{{node.name}}</li>
</mat-tree-node>
</mat-tree>
</div>
<div class="officesbox">
<span>请选择机构下属机关</span>
<div class="officesList">
<ul>
<li *ngFor="let item of OfficesList" (click)="selectOffice(item)">{{item.officeName}}</li>
</ul>
</div>
</div>

5
src/app/ui/usermanagement/usermanagement.component.html
Unescape View File

@ -69,6 +69,11 @@
<td mat-cell *matCellDef="let element">{{element.organizationName}}</td>
</ng-container>
<ng-container matColumnDef="office">
<th mat-header-cell *matHeaderCellDef>所属机关</th>
<td mat-cell *matCellDef="let element">{{element.organizationOfficeName}}</td>
</ng-container>
<ng-container matColumnDef="role">
<th mat-header-cell *matHeaderCellDef>所属角色</th>
<td mat-cell *matCellDef="let element">

21
src/app/ui/usermanagement/usermanagement.component.scss
Unescape View File

@ -46,13 +46,28 @@ table {
width: 200px;
float: left;
}
.tree {
.tree,.officesbox {
width: 300px;
height: 400px;
float: right;
float: left;
overflow-y: auto;
}
.officesbox{
box-sizing: border-box;
padding-left: 12px;
}
.officesList{
ul{
li{
height: 48px;
line-height: 48px;
cursor: pointer;
}
li:hover{
background-color: rgba(225, 225, 225, 0.8);
}
}
}
//分配角色

53
src/app/ui/usermanagement/usermanagement.component.ts
Unescape View File

@ -42,7 +42,7 @@ export class UsermanagementComponent implements OnInit {
}
displayedColumns: string[] = ['loginName', 'realName', 'mechanism','role','time', 'operation'];
displayedColumns: string[] = ['loginName', 'realName', 'mechanism','office','role','time', 'operation'];
dataSource:any; //所有用户
allMechanism:any; //所有机构
@ -162,7 +162,7 @@ export class UsermanagementComponent implements OnInit {
//打开创建用户窗口
open() {
let dialogRef = this.dialog.open(CreateNewUser,{
width: '600px',
width: '850px',
});
dialogRef.afterClosed().subscribe(
(data)=>{
@ -346,8 +346,26 @@ export class CreateNewUser {
add (e) {
this.organizationId = e.id
this.organizationName = e.name
this.selectedOffices = {}
this.getOffices(e)
}
selectedOrg:any//当前选择的组织机构
OfficesList:any //获得的下级列表
//获得点击组织机构的下级机关单位
getOffices(node){
console.log(node)
this.selectedOrg = node
this.http.get(`/api/OrganizationsOffices/${node.id}`).subscribe(data => {
console.log("获取成功",data)
this.OfficesList = data
})
}
//选择机关
selectedOffices:any = {}
selectOffice(item){
this.selectedOffices = item
console.log(item)
}
errmsg:any; //捕获错误信息
//新增用户
onSubmit(e) {
@ -360,7 +378,8 @@ export class CreateNewUser {
phone:e.phone,
enabled:true,
creationTime:time,
organizationId:this.organizationId
organizationId:this.organizationId,
organizationOfficeId:this.selectedOffices.id
}).subscribe(data=> {
this.dialogRef.close('success')},
error=>{this.errmsg = error}
@ -397,6 +416,9 @@ export class EditNewUser {
this.phone=this.data.e.phone,
this.affiliate=this.data.e.organizationId
this.affiliateName=this.data.e.organizationName
this.selectedOffices.officeName = this.data.e.organizationOfficeName
this.selectedOffices.id = this.data.e.organizationOfficeId
console.log(this.data)
}
private _transformer = (node, level: number) => {
@ -440,8 +462,26 @@ export class EditNewUser {
add (e) {
this.affiliate = e.id
this.affiliateName = e.name
this.selectedOffices = {}
this.getOffices(e)
}
selectedOrg:any//当前选择的组织机构
OfficesList:any //获得的下级列表
//获得点击组织机构的下级机关单位
getOffices(node){
console.log(node)
this.selectedOrg = node
this.http.get(`/api/OrganizationsOffices/${node.id}`).subscribe(data => {
console.log("获取成功",data)
this.OfficesList = data
})
}
//选择机关
selectedOffices:any = {}
selectOffice(item){
this.selectedOffices = item
console.log(item)
}
//编辑
onSubmit (e) {
this.http.put(`/api/Users/${this.data.e.name}`,{
@ -452,7 +492,8 @@ export class EditNewUser {
roleNames:this.data.e.roleNames,
enabled: this.data.e.enabled,
creationTime:this.data.e.creationTime,
organizationId:this.affiliate
organizationId:this.affiliate,
organizationOfficeId:this.selectedOffices.id
}).subscribe(data=>{
this.dialogRef.close('success')
})

BIN
src/assets/images/天然水源.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 604 B

BIN
src/assets/images/定位.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
src/assets/images/市政消火栓.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 601 B

BIN
src/assets/images/方形储水池.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 507 B

36
src/styles.scss
Unescape View File

@ -2,10 +2,11 @@
@import './app/theme.scss';
@import "./app/ngZorroTree.css"; /* 引入组件样式 */
html,body{
width: 100%;
height: 100%;
margin:0 auto;
width: 100%;
height:100%;
margin:0 auto;
padding:0;
overflow: hidden;
}
ul,ol,dl,li,dt,dd,p,form,input,h1,h2,h3,h4,h5,h6,section,article,aside,header,footer,nav,figure,time,mark,main,canvas{
margin:0;
@ -20,7 +21,7 @@ img{
}
a{
text-decoration: none;
color:#000;
color:#000;
}
ul,ol,li{
list-style:none;
@ -85,13 +86,6 @@ table td.mat-footer-cell:last-of-type{
.mat-tab-body-content{
overflow: hidden!important;
}
.amap-logo{
display: none;
opacity:0 !important;
}
.amap-copyright {
opacity:0;
}
//gis单位信息tabs样式
#gis{
.mat-tab-label{
@ -135,11 +129,11 @@ table td.mat-footer-cell:last-of-type{
}
//弹出框样式取消padding
#shareDialog,#lookPlanDialog,#openPlanToolDialog{
#shareDialog,#lookPlanDialog,#openPlanToolDialog,#addWater{
padding: 0;
}
#setPosition{
#setPosition,#map{
.custom-content-marker {
position: relative;
width: 29px;
@ -171,8 +165,20 @@ table td.mat-footer-cell:last-of-type{
cursor: pointer;
}
}
.custom-content-marker .close-btn:hover{
background: #666;
}
}
}
#fireForceTree{
.mat-tree-node{
min-height: 40px;
flex: none;
box-sizing: border-box;
}
.mat-icon-button{
width: 30px;
height: 30px;
line-height: 30px;
}
}

Write Preview
Loading…
Cancel
Save