54 changed files with 1371 additions and 3158 deletions
@ -1,25 +0,0 @@
|
||||
<div mat-dialog-title>新增建筑</div> |
||||
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container"> |
||||
|
||||
<mat-form-field hintLabel="名字不多于20个字"> |
||||
<input matInput id="name" name="name" |
||||
required |
||||
maxlength="20" |
||||
ngModel #name="ngModel" placeholder="建筑名称" |
||||
#input |
||||
> |
||||
<mat-hint align="end">{{input.value?.length || 0}}/20</mat-hint> |
||||
</mat-form-field> |
||||
|
||||
<mat-form-field> |
||||
<mat-select required name="unittype" ngModel #unittype="ngModel" placeholder="建筑类型"> |
||||
<mat-option [value]="item.id" *ngFor="let item of allunittype" >{{item.name}}</mat-option> |
||||
</mat-select> |
||||
</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> |
||||
@ -1,77 +0,0 @@
|
||||
import { Component, OnInit, Inject } from '@angular/core'; |
||||
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree'; |
||||
import {FlatTreeControl} from '@angular/cdk/tree'; |
||||
import { HttpClient } from '@angular/common/http'; |
||||
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog'; |
||||
import {FormControl} from '@angular/forms'; |
||||
import { MatSnackBar } from '@angular/material/snack-bar'; |
||||
|
||||
@Component({ |
||||
selector: 'addhouseinfo', |
||||
templateUrl: './addhouseinfo.component.html', |
||||
styleUrls: ['./basicinfo.component.scss'] |
||||
}) |
||||
export class AddHouseInfo { |
||||
myControl = new FormControl(); |
||||
//注入MatDialogRef，可以用来关闭对话框
|
||||
//要访问对话框组件中的数据，必须使用MAT_DIALOG_DATA注入令牌
|
||||
constructor(private http: HttpClient,public dialogRef: MatDialogRef<AddHouseInfo>,@Inject(MAT_DIALOG_DATA) public data) {} |
||||
allunittype:any |
||||
onNoClick(): void { |
||||
this.dialogRef.close(); |
||||
} |
||||
ngOnInit(): void { |
||||
// console.log(this.data)
|
||||
this.getallunittype() |
||||
} |
||||
getallunittype(){ |
||||
this.http.get("/api/BuildingTypes/Simple").subscribe(data=>{ |
||||
this.allunittype = data |
||||
}) |
||||
} |
||||
onSubmit(value){ |
||||
|
||||
this.http.get("/api/Buildings",{ |
||||
params:{ |
||||
companyId:this.data.unitId |
||||
} |
||||
}).subscribe((data:any)=>{ |
||||
this.data.allBuildings = data |
||||
let order |
||||
if(data.length == 0){ |
||||
order = 0 |
||||
}else{ |
||||
order = data[data.length - 1].order + 1 |
||||
} |
||||
|
||||
let buildingTypename = "" |
||||
this.allunittype.forEach(item => { |
||||
if(item.id == value.unittype){ |
||||
buildingTypename = item.name |
||||
} |
||||
}); |
||||
|
||||
this.http.post("/api/Buildings",{ |
||||
id: "", |
||||
name: value.name, |
||||
order: order, |
||||
enabled: true, |
||||
companyId: this.data.unitinfo.id, |
||||
buildingTypes: [ |
||||
{ |
||||
id: value.unittype, |
||||
name: buildingTypename |
||||
} |
||||
] |
||||
},{params:{ |
||||
companyId : this.data.unitId |
||||
}}).subscribe(data=>{ |
||||
this.dialogRef.close(data); |
||||
}) |
||||
}) |
||||
|
||||
|
||||
|
||||
} |
||||
} |
||||
|
||||
@ -1,531 +0,0 @@
|
||||
<div style="height: 100%;display: flex; flex-direction: column;"> |
||||
<!-- header --> |
||||
<mat-accordion> |
||||
<mat-expansion-panel expanded hideToggle > |
||||
<mat-expansion-panel-header style="color: black;"> |
||||
<mat-panel-title> |
||||
单位信息 |
||||
<mat-icon style="position: absolute;right:30px;">keyboard_arrow_down</mat-icon> |
||||
</mat-panel-title> |
||||
</mat-expansion-panel-header> |
||||
<div class="topbox"> |
||||
<form (ngSubmit)="onSubmit(form.value,form.invalid,form)" #form="ngForm" class="example-container"> |
||||
<div class="mainbox" > |
||||
<div class="mainleft"> |
||||
<div class="inputbox" > |
||||
<span style="color: red;">*</span> |
||||
<span>统一社会信用代码：</span> |
||||
<mat-form-field> |
||||
<input matInput id="creditcode" name="creditcode" type='text' #usci="ngModel" |
||||
required minlength="1" maxlength="18" |
||||
[(ngModel)]="unitinfo.usci" |
||||
(focus)="closeorganizationbox()" |
||||
pattern="^[0-9A-HJ-NP-RTUW-Y]{2}\d{6}[0-9A-HJ-NP-RTUW-Y]{10}$"> |
||||
</mat-form-field> |
||||
<div *ngIf="usci.invalid && (usci.dirty || usci.touched)" class="alert-danger"> |
||||
<div *ngIf="usci.errors.pattern" class="alert-danger"> |
||||
统一社会信用代码格式不正确 |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="inputbox"> |
||||
<span style="color: red;">*</span> |
||||
<span>单位类型：</span> |
||||
<mat-form-field (click)="closeorganizationbox()"> |
||||
<mat-select required name="unittype" [(ngModel)]="defaultbuildingTypes"> |
||||
<mat-option [value]="item.id" *ngFor="let item of allunittype">{{item.name}}</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="inputbox"> |
||||
<span style="color: red;">*</span> |
||||
<span>联系人：</span> |
||||
<mat-form-field> |
||||
<input matInput id="linkman" name="linkman" type='text' |
||||
required minlength="1" |
||||
[(ngModel)]="unitinfo.contacts" |
||||
(focus)="closeorganizationbox()" |
||||
> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="inputbox"> |
||||
<span style="color: red;">*</span> |
||||
<span>联系电话：</span> |
||||
<mat-form-field> |
||||
<input matInput id="linkphone" name="linkphone" type='text' #linkphone="ngModel" |
||||
required pattern="^(?:\+?86)?1(?:3\d{3}|5[^4\D]\d{2}|8\d{3}|7(?:[35-8]\d{2}|4(?:0\d|1[0-2]|9\d))|9[0135-9]\d{2}|66\d{2})\d{6}$" |
||||
[(ngModel)]="unitinfo.phone" |
||||
(focus)="closeorganizationbox()" |
||||
> |
||||
</mat-form-field> |
||||
<div *ngIf="linkphone.invalid && (linkphone.dirty || linkphone.touched)" class="alert-danger"> |
||||
<div *ngIf="linkphone.errors.pattern" class="alert-danger"> |
||||
电话号码格式不正确 |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="inputbox" style="width: 700px;"> |
||||
<span style="color: red;">*</span> |
||||
<span>辖区中队：</span> |
||||
<mat-form-field style="width: 538px;"> |
||||
<input matInput id="organization" name="organization" type='text' |
||||
required minlength="1" |
||||
[(ngModel)]="selectedorganization" |
||||
(focus)="openorganizationbox()" |
||||
readonly="value" > |
||||
</mat-form-field> |
||||
</div> |
||||
<div id="organizationbox" class="organizationbox" *ngIf="isorganizationbox"> |
||||
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl"> |
||||
<mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding (click)='add(node)' class="organizationlist"> |
||||
<button type="button" mat-icon-button disabled ></button> |
||||
<li>{{node.name}}</li> |
||||
</mat-tree-node> |
||||
<mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding (click)='add(node)' class="organizationlist"> |
||||
<button |
||||
type="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> |
||||
<li>{{node.name}}</li> |
||||
</mat-tree-node> |
||||
</mat-tree> |
||||
</div> |
||||
<div class="inputbox" style="width: 700px;"> |
||||
<span style="color: red;">*</span> |
||||
<span>单位地址：</span> |
||||
<mat-form-field style="width: 538px;"> |
||||
<input matInput id="unitaddress" name="unitaddress" type='text' |
||||
required minlength="1" |
||||
[(ngModel)]="unitinfo.address" |
||||
(focus)="closeorganizationbox()"> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="uploadimg" (click)="lookmaster()"> |
||||
<span>单位照片：</span> |
||||
<div class="uploadingimg"> |
||||
<img [src]="imgsrc" alt="" style="width: 299px; height: 170px;" > |
||||
</div> |
||||
<mat-spinner *ngIf="isspinner" diameter= 50></mat-spinner> |
||||
</div> |
||||
<div class="image" (click)="closeorganizationbox()"> |
||||
<input id="selectedfile" type="file" (change)="filechange($event)" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> |
||||
</div> |
||||
<div class="addbtn"> |
||||
<button type="submit" color="primary" class="submit1" mat-button mat-raised-button>保存</button> |
||||
</div> |
||||
</div> |
||||
<!-- <div class="mainright" (click)="closeorganizationbox()"> --> |
||||
<!-- 地图预留位置 --> |
||||
<!-- </div> --> |
||||
</div> |
||||
</form> |
||||
</div> |
||||
</mat-expansion-panel> |
||||
</mat-accordion> |
||||
|
||||
|
||||
<!-- body --> |
||||
<div class="bottombox" style="flex: 70%;overflow-y: auto;" > |
||||
<div class="houseinfobox" style="height: 100%; overflow-y: auto;padding-bottom: 64px; box-sizing:border-box"> |
||||
<button type="button" mat-icon-button (click)="addhouseinfo()" class="addhouseinfo"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button> |
||||
<mat-tab-group style="height: 100%;;" (focusChange)="selecttab($event)" > |
||||
<mat-tab [label]="item.username" *ngFor="let item of houses;let key = index"> |
||||
<form style="height: 100%; overflow-y:auto; display: block;" (ngSubmit)="onSubmit2(form.value,item,key,form.invalid)" #form="ngForm" class="example-container"> |
||||
|
||||
<!-- 正常建筑 --> |
||||
<div class="highinfo" *ngIf="item.tongyong"> |
||||
<div class="houseinfoinput" > |
||||
<span>建筑名称：</span> |
||||
<mat-form-field> |
||||
<input matInput id="housename" name="housename" type='text' |
||||
minlength="1" [(ngModel)]="item.name" |
||||
> |
||||
</mat-form-field> |
||||
<span style="color: red;">*</span> |
||||
</div> |
||||
<div class="houseinfoinput"> |
||||
<span>建筑类型：</span> |
||||
<mat-form-field> |
||||
<mat-select name="unittype" [(ngModel)]="item.buildtype"> |
||||
<mat-option [value]="n.name" *ngFor="let n of allunittype" (click)="templatebuildtype(n,item,key)">{{n.name}}</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
<span style="color: red;">*</span> |
||||
</div> |
||||
|
||||
<div *ngFor="let item of item.buildingBasicGroups;let www = index" style="float: left;"> |
||||
<h1 style="font-size: 22px;">{{item.name}}</h1> |
||||
<div class="houseinfoinput" *ngFor="let i of item.propertyInfos" style="float: left;margin-left: 250px;position: relative;"> |
||||
<span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span> |
||||
|
||||
<!-- 如果类型是文本 --> |
||||
<mat-form-field *ngIf="i.propertyType == 0"> |
||||
<input matInput name="{{i.propertyName}}{{www}}" type='text' |
||||
required="{{ i.required==true ? 'true' : 'false' }}" |
||||
[(ngModel)]="i.propertyValue"> |
||||
</mat-form-field> |
||||
|
||||
<!-- 如果类型是数字 --> |
||||
<mat-form-field *ngIf="i.propertyType == 2"> |
||||
<input matInput name="{{i.propertyName}}{{www}}" type='number' |
||||
required="{{ i.required==true ? 'true' : 'false' }}" |
||||
[(ngModel)]="i.propertyValue" |
||||
(change)="inputchange($event,i.ruleName,i.ruleValue,i)" |
||||
> |
||||
<!-- <mat-error *ngIf="isshowrule">{{rulevalue}}</mat-error> --> |
||||
</mat-form-field> |
||||
|
||||
<!-- 如果类型是多行文本 --> |
||||
<textarea *ngIf="i.propertyType == 1" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{i.propertyName}}{{key}}"></textarea> |
||||
|
||||
<span style="color: red;" *ngIf="i.required">*</span> |
||||
<div *ngIf="i.isshowrule" style="position: absolute; |
||||
left: 205px; |
||||
top: 45px; |
||||
font-size: 11px; |
||||
color: red;"> |
||||
<span>{{i.rulevalue}}</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="CustomData" style="width: 200px;"> |
||||
<mat-checkbox (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox> |
||||
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1> |
||||
</div> |
||||
<div *ngIf="item.isCustomData" style="position: relative;"> |
||||
<button style="position: absolute;left: 0;" type="button" mat-icon-button (click)="addCustomData(item)" class="addCustomData"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button> |
||||
<button style="position: absolute;left:60px;" type="button" mat-icon-button (click)="deleteCustomData(item)" class="deleteCustomData"><mat-icon style="font-size: 38px;">remove_circle_outline</mat-icon></button> |
||||
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index"> |
||||
<mat-form-field> |
||||
<input matInput type='text' name="{{key}}1CustomData" |
||||
required |
||||
[(ngModel)]="i.name"> |
||||
</mat-form-field> |
||||
<span>:</span> |
||||
<mat-form-field> |
||||
<input matInput type='text' name="{{key}}2CustomData" |
||||
required |
||||
[(ngModel)]="i.value"> |
||||
</mat-form-field> |
||||
<span style="color: red;" *ngIf="i.required">*</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 石油化工 --> |
||||
<div class="highinfo" *ngIf="item.isshiyou;let bigkey = index"> |
||||
|
||||
<div class="basicinfobox"> |
||||
<div class="houseinfoinput"> |
||||
<span>建筑名称：</span> |
||||
<mat-form-field> |
||||
<input matInput id="housename" name="housename" type='text' |
||||
required minlength="1" [(ngModel)]="item.name" |
||||
> |
||||
</mat-form-field> |
||||
<span style="color: red;">*</span> |
||||
</div> |
||||
<div class="houseinfoinput" > |
||||
<span>建筑类型：</span> |
||||
<mat-form-field> |
||||
<mat-select required name="unittype" [(ngModel)]="item.buildtype"> |
||||
<mat-option [value]="n.name" *ngFor="let n of allunittype" (click)="templatebuildtype(n,item,key)">{{n.name}}</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
<span style="color: red;">*</span> |
||||
</div> |
||||
<h1 style="font-size: 22px;">{{item.buildingBasicGroups[0].name}}</h1> |
||||
<div class="houseinfoinput" *ngFor="let i of item.buildingBasicGroups[0].propertyInfos;let smkey = index" style="float: left;margin-left: 250px;position: relative;"> |
||||
<span>{{i.propertyName}} <span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span> ：</span> |
||||
|
||||
|
||||
<!-- 如果类型是文本 --> |
||||
<mat-form-field *ngIf="i.propertyType == 0"> |
||||
<input matInput name="{{i.propertyName}}" type='text' |
||||
required="{{ i.required==true ? 'true' : 'false' }}" |
||||
[(ngModel)]="i.propertyValue"> |
||||
</mat-form-field> |
||||
|
||||
<!-- 如果类型是数字 --> |
||||
<mat-form-field *ngIf="i.propertyType == 2"> |
||||
<input matInput name="{{i.propertyName}}" type='number' |
||||
required="{{ i.required==true ? 'true' : 'false' }}" |
||||
[(ngModel)]="i.propertyValue" |
||||
(change)="inputchange($event,i.ruleName,i.ruleValue,i)" |
||||
> |
||||
<!-- <mat-error *ngIf="isshowrule">{{rulevalue}}</mat-error> --> |
||||
</mat-form-field> |
||||
|
||||
<!-- 如果类型是多行文本 --> |
||||
<textarea *ngIf="i.propertyType == 1" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{i.propertyName}}"></textarea> |
||||
<span style="color: red;" *ngIf="i.required">*</span> |
||||
<div *ngIf="i.isshowrule" style=" position: absolute; |
||||
left: 205px; |
||||
top: 45px; |
||||
font-size: 11px; |
||||
color: red;"> |
||||
<span>{{i.rulevalue}}</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
|
||||
<div class="deviceinfo"> |
||||
<div style="width: 200px;"> |
||||
<mat-checkbox (change)="checkboxchange(item.buildingBasicGroups[1].submitted,$event)" name="item.buildingBasicGroups[1].name" *ngIf="item.buildingBasicGroups[1].isOptional" [(ngModel)]="item.buildingBasicGroups[1].submitted" style="float: left;margin-right: 10px;"></mat-checkbox> |
||||
<h1 style="font-size: 22px;width: 200px;">{{item.buildingBasicGroups[1].name}}</h1> |
||||
</div> |
||||
|
||||
<table mat-table [dataSource]="devicedataSourcebox[item.buildingId]" class="mat-elevation-z8" *ngIf="item.buildingBasicGroups[1].submitted"> |
||||
<ng-container matColumnDef="name"> |
||||
<th mat-header-cell *matHeaderCellDef> |
||||
<button style="width: 24px;" type="button" mat-icon-button class="adddeviceinfo2" (click)="adddeviceinfo(item)"><mat-icon>add_circle_outline</mat-icon></button> |
||||
<button style="width: 24px;" type="button" mat-icon-button class="removedeviceinfo" (click)="removedeviceinfo(item)"><mat-icon>remove_circle_outline</mat-icon></button> |
||||
装置区名称<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<textarea style="width: 100px;" [(ngModel)]="element.name" name="{{key}}1" required></textarea> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="flow"> |
||||
<th mat-header-cell *matHeaderCellDef>工艺流程<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<textarea [(ngModel)]="element.flow" name="{{key}}2" required></textarea> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="danger"> |
||||
<th mat-header-cell *matHeaderCellDef>火灾危险性<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<textarea [(ngModel)]="element.danger" name="{{key}}3" required></textarea> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="payattentionto"> |
||||
<th mat-header-cell *matHeaderCellDef>灭火注意事项</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<textarea style="width: 100px;" [(ngModel)]="element.payattentionto" name="{{key}}4"></textarea> |
||||
</td> |
||||
</ng-container> |
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> |
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> |
||||
</table> |
||||
</div> |
||||
|
||||
<div style="width: 200px;"> |
||||
<mat-checkbox (change)="checkboxchange(item,$event)" *ngIf="item.buildingBasicGroups[2].isOptional" name="item.buildingBasicGroups[2].name" [(ngModel)]="item.buildingBasicGroups[2].submitted" style="float: left;margin-right: 10px;"></mat-checkbox> |
||||
<h1 style="font-size: 22px;width: 200px;">储罐信息</h1> |
||||
</div> |
||||
|
||||
<button *ngIf="item.buildingBasicGroups[2].submitted" type="button" mat-raised-button color="primary" (click)="addtankbox(item,bigkey)" style="margin-top: 30px;margin-right: 5px;">添加储罐</button> |
||||
<button *ngIf="item.buildingBasicGroups[2].submitted" type="button" mat-raised-button color="warn" (click)="removetankbox(item,bigkey)" style="margin-top: 30px;" matTooltip="会将此建筑处于末尾的储罐移除">移除末尾储罐</button> |
||||
|
||||
|
||||
<div *ngIf="item.buildingBasicGroups[2].submitted" style="margin-top: 30px;"> |
||||
<div class="tankinfo" *ngFor="let x of item.bigfor;let www = index"> |
||||
<p style="font-size: 22px; width: 200px;">{{x[0].name}}</p> |
||||
<div class="basicinfobox" > |
||||
<div class="houseinfoinput" *ngFor="let i of x[0].propertyInfos;let key = index" style="line-height: 65px;"> |
||||
<span>{{i.propertyName}} {{i.physicalUnit}}：</span> |
||||
<mat-form-field *ngIf="i.propertyType == 0"> |
||||
<input matInput name="{{www+2}}-tanker-{{key}}" type='text' |
||||
required="{{ i.required==true ? 'true' : 'false' }}" |
||||
[(ngModel)]="i.propertyValue" |
||||
> |
||||
</mat-form-field> |
||||
<textarea style="width: 180px;height: 45px;" *ngIf="i.propertyType == 1" [(ngModel)]="i.propertyValue" name="{{www+2}}-tanker-{{key}}"></textarea> |
||||
<span style="color: red;" *ngIf="i.required">*</span> |
||||
</div> |
||||
|
||||
</div> |
||||
<p style="font-size: 22px; width: 200px;">{{x[1].name}}</p> |
||||
<div class="tankdetailinfo"> |
||||
<table #table mat-table [dataSource]="x[1].propertyInfos" class="mat-elevation-z8" style="position: relative;"> |
||||
<ng-container matColumnDef="tank"> |
||||
<th mat-header-cell *matHeaderCellDef> |
||||
<button type="button" mat-icon-button class="adddeviceinfo" (click)="adddeviceinfo2(www,item)" style="position: absolute;left: 0;"><mat-icon>add_circle_outline</mat-icon></button> |
||||
<button type="button" mat-icon-button class="removedeviceinfo" (click)="removedeviceinfo3(www,item)"><mat-icon>remove_circle_outline</mat-icon></button> |
||||
罐区 </th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tank}}tank{{key}}" type='text' |
||||
[(ngModel)]="element.tank"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="tankid"> |
||||
<th mat-header-cell *matHeaderCellDef>罐区编号<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankid}}tank{{key}}" type='text' |
||||
required |
||||
[(ngModel)]="element.tankid"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="tankmedium"> |
||||
<th mat-header-cell *matHeaderCellDef>储存介质<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankmedium}}tank{{key}}" type='text' |
||||
required |
||||
[(ngModel)]="element.tankmedium"> |
||||
</td> |
||||
</ng-container> |
||||
|
||||
<ng-container matColumnDef="tanktype"> |
||||
<th mat-header-cell *matHeaderCellDef>储罐类型<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktype}}tank{{key}}" type='text' |
||||
required |
||||
[(ngModel)]="element.tanktype"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="tankcapacity"> |
||||
<th mat-header-cell *matHeaderCellDef>容量(m³)<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankcapacity}}tank{{key}}" type='text' |
||||
required |
||||
[(ngModel)]="element.tankcapacity"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="tankdiameter"> |
||||
<th mat-header-cell *matHeaderCellDef>直径(m)<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankdiameter}}tank{{key}}" type='text' |
||||
required |
||||
[(ngModel)]="element.tankdiameter"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="tankheight"> |
||||
<th mat-header-cell *matHeaderCellDef>高度(m)<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankheight}}tank{{key}}" type='text' |
||||
required |
||||
[(ngModel)]="element.tankheight"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="tanktectum"> |
||||
<th mat-header-cell *matHeaderCellDef>顶盖形式</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktectum}}tank{{key}}" type='text' |
||||
[(ngModel)]="element.tanktectum"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="tanktexture"> |
||||
<th mat-header-cell *matHeaderCellDef>浮盘材质</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktexture}}tank{{key}}" type='text' |
||||
[(ngModel)]="element.tanktexture"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="platetype"> |
||||
<th mat-header-cell *matHeaderCellDef>浮盘类型</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.platetype}}tank{{key}}" type='text' |
||||
[(ngModel)]="element.platetype"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="foamgeneratorid"> |
||||
<th mat-header-cell *matHeaderCellDef>泡沫产生器型号</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.foamgeneratorid}}tank{{key}}" type='text' |
||||
[(ngModel)]="element.foamgeneratorid"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="foamgeneratortype"> |
||||
<th mat-header-cell *matHeaderCellDef>泡沫产生器形式</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.foamgeneratortype}}tank{{key}}" type='text' |
||||
[(ngModel)]="element.foamgeneratortype"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="isprotect"> |
||||
<th mat-header-cell *matHeaderCellDef>是否设置氮封惰化保护装置</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.isprotect}}tank{{key}}" type='text' |
||||
[(ngModel)]="element.isprotect"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="fendinggroyneheight"> |
||||
<th mat-header-cell *matHeaderCellDef>防护堤高度(m)<span style="color: red;">*</span></th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.fendinggroyneheight}}tank{{key}}" type='text' |
||||
required |
||||
[(ngModel)]="element.fendinggroyneheight"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="portnum"> |
||||
<th mat-header-cell *matHeaderCellDef>半固定泡沫灭火接口数量</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.portnum}}tank{{key}}" type='text' |
||||
|
||||
[(ngModel)]="element.portnum"> |
||||
</td> |
||||
</ng-container> |
||||
<ng-container matColumnDef="else"> |
||||
<th mat-header-cell *matHeaderCellDef>其它设施</th> |
||||
<td mat-cell *matCellDef="let element;let key = index"> |
||||
<input style="height:45px" class="tankinfo" name="{{www}}{{element.else}}tank{{key}}" type='text' |
||||
|
||||
[(ngModel)]="element.else"> |
||||
</td> |
||||
</ng-container> |
||||
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns2"></tr> |
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns2;"></tr> |
||||
</table> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
|
||||
<div class="CustomData" style="width: 200px;margin-top: 60px;"> |
||||
<mat-checkbox (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox> |
||||
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1> |
||||
</div> |
||||
<div *ngIf="item.isCustomData" style="position: relative;"> |
||||
<button style="position: absolute;left: 0;font-size: 11px;" type="button" mat-icon-button (click)="addCustomData(item)" class="addCustomData"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button> |
||||
<button style="position: absolute;left:60px;" type="button" mat-icon-button (click)="deleteCustomData(item)" class="deleteCustomData"><mat-icon style="font-size: 38px;">remove_circle_outline</mat-icon></button> |
||||
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index"> |
||||
<mat-form-field> |
||||
<input matInput type='text' name="{{key}}1CustomData" |
||||
required |
||||
[(ngModel)]="i.name"> |
||||
</mat-form-field> |
||||
<span>:</span> |
||||
<mat-form-field> |
||||
<input matInput type='text' name="{{key}}2CustomData" |
||||
required |
||||
[(ngModel)]="i.value"> |
||||
</mat-form-field> |
||||
<span style="color: red;" *ngIf="i.required">*</span> |
||||
</div> |
||||
</div> |
||||
|
||||
</div> |
||||
|
||||
|
||||
<div class="infobtnbox"> |
||||
<button type="submit()" mat-button mat-raised-button color="primary" >保存</button> |
||||
<button type="button" mat-raised-button (click)="deletedbuilding(item)" color="warn">删除</button> |
||||
</div> |
||||
|
||||
</form> |
||||
</mat-tab> |
||||
|
||||
</mat-tab-group> |
||||
|
||||
</div> |
||||
|
||||
</div> |
||||
|
||||
</div> |
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -1,269 +0,0 @@
|
||||
.topbox{ |
||||
height: 485px; |
||||
width: 100%; |
||||
// border-bottom: 1px solid black; |
||||
.mainbox{ |
||||
height: 100%; |
||||
position: relative; |
||||
.mainleft{ |
||||
width:800px; |
||||
height: 100%; |
||||
// background-color: yellow; |
||||
float: left; |
||||
.inputbox{ |
||||
width: 343px; |
||||
height: 58px; |
||||
margin:2px 6px; |
||||
float: left; |
||||
text-align: end; |
||||
} |
||||
.organizationbox{ |
||||
width:538px; |
||||
height: 200px; |
||||
background: white; |
||||
position: absolute; |
||||
top: 164px; |
||||
left:166px; |
||||
z-index: 100; |
||||
border: 1px solid grey; |
||||
overflow: auto; |
||||
li{ |
||||
list-style: none; |
||||
|
||||
} |
||||
mat-tree-node{ |
||||
cursor: pointer; |
||||
} |
||||
mat-tree-node:hover{ |
||||
background: rgba(225, 225, 225, 0.8); |
||||
} |
||||
} |
||||
.addbtn{ |
||||
width: 695px; |
||||
position: absolute; |
||||
bottom: -495px; |
||||
text-align: center; |
||||
margin-bottom:20px; |
||||
button{ |
||||
margin: 0 4px; |
||||
} |
||||
} |
||||
.uploadimg{ |
||||
width: 400px; |
||||
height: 200px; |
||||
float: left; |
||||
margin-top:12px; |
||||
position: relative; |
||||
margin-left: 80px; |
||||
cursor: pointer; |
||||
span{ |
||||
float: left; |
||||
} |
||||
// img{ |
||||
// float: left; |
||||
// } |
||||
.uploadingimg{ |
||||
width: 299px; |
||||
height: 170px; |
||||
// background: url('../../../assets/images/upload2.png') no-repeat center center; |
||||
|
||||
position: absolute; |
||||
top: 0px; |
||||
left: 79px; |
||||
border: 1px dashed gray; |
||||
border-radius:3px; |
||||
} |
||||
|
||||
} |
||||
.image{ |
||||
// position: absolute; |
||||
// top: 199px; |
||||
// left: 160px; |
||||
// width: 299px; |
||||
// height: 170px; |
||||
input{ |
||||
// width: 299px; |
||||
// height: 170px; |
||||
width: 190px; |
||||
margin-top: 160px; |
||||
cursor: pointer; |
||||
} |
||||
// opacity:0; |
||||
|
||||
} |
||||
} |
||||
.mainright{ |
||||
float: left; |
||||
width: 600px; |
||||
height: 400px; |
||||
// position: absolute; |
||||
// right: 170px; |
||||
|
||||
} |
||||
} |
||||
} |
||||
.bottombox{ |
||||
// height:400px; |
||||
width: 100%; |
||||
// background-color: skyblue; |
||||
|
||||
.bottomtitle{ |
||||
height: 60px; |
||||
// background-color: orange; |
||||
line-height: 60px; |
||||
border-top: 1px solid black; |
||||
border-bottom: 1px solid black; |
||||
} |
||||
.houseinfobox{ |
||||
// height:340px; |
||||
overflow: auto; |
||||
.addhouseinfo{ |
||||
float: left; |
||||
} |
||||
.infobtnbox{ |
||||
margin-left: 800px; |
||||
position: absolute; |
||||
top: 30px; |
||||
right: 75px; |
||||
button{ |
||||
width: 80px; |
||||
height: 40px; |
||||
margin: 0 12px; |
||||
margin-top: 15px; |
||||
} |
||||
} |
||||
.infotitle{ |
||||
font-size: 28px; |
||||
font-weight: 900; |
||||
margin-left: 180px; |
||||
} |
||||
.houseinfoinput{ |
||||
width: 393px; |
||||
text-align: end; |
||||
margin-left:240px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.btn{ |
||||
width: 100%; |
||||
text-align: center; |
||||
button{ |
||||
margin: 0 8px; |
||||
} |
||||
} |
||||
.mat-spinner{ |
||||
margin-top: 58px; |
||||
margin-left: 203px; |
||||
} |
||||
.mat-table{ |
||||
width: 100%; |
||||
} |
||||
|
||||
table{ |
||||
width: 1000px; |
||||
thead{ |
||||
tr{ |
||||
th{ |
||||
width: 60px; |
||||
display: block; |
||||
float: left; |
||||
|
||||
} |
||||
} |
||||
} |
||||
tbody{ |
||||
tr{ |
||||
|
||||
td{ |
||||
width: 60px; |
||||
display: block; |
||||
float: left; |
||||
text-align: center; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.deviceinfo{ |
||||
// border-bottom: 1px solid black;; |
||||
padding-bottom: 60px; |
||||
} |
||||
.tankdetailinfo{ |
||||
// border-bottom: 1px solid black;; |
||||
padding-bottom: 35px; |
||||
table{ |
||||
th{ |
||||
text-align: center; |
||||
} |
||||
} |
||||
} |
||||
.tankinfo{ |
||||
display: block; |
||||
width: 100%; |
||||
// height: 45px; |
||||
text-align: center; |
||||
} |
||||
// .adddeviceinfo{ |
||||
// // position: absolute; |
||||
// // left: 0px; |
||||
// } |
||||
.submit1{ |
||||
margin-left: -66px !important; |
||||
} |
||||
textarea { |
||||
vertical-align: middle; |
||||
border-radius: 5px; |
||||
padding: 5px; |
||||
width: 600px; |
||||
height: 110px; |
||||
resize: none; |
||||
} |
||||
//预览图片旋转角度 |
||||
.img1{ |
||||
transform:rotate(90deg) scale(0.55); |
||||
height: 100%; |
||||
} |
||||
.img2{ |
||||
transform:rotate(180deg); |
||||
// height: 100%; |
||||
} |
||||
.img3{ |
||||
transform:rotate(270deg) scale(0.55); |
||||
// height: 100%; |
||||
} |
||||
.img4{ |
||||
transform:rotate(90deg) scale(1.3); |
||||
// height: 100%; |
||||
} |
||||
.img5{ |
||||
transform:rotate(180deg); |
||||
// height: 100%; |
||||
} |
||||
.img6{ |
||||
transform:rotate(270deg) scale(1.3); |
||||
// height: 100%; |
||||
} |
||||
.imgbox{ |
||||
text-align: center; |
||||
height: 750px; |
||||
img{ |
||||
max-width: 1500px; |
||||
max-height: 740px; |
||||
} |
||||
} |
||||
.previewImgBottom{ |
||||
text-align: center; |
||||
} |
||||
.alert-danger { |
||||
margin-top: -16px; |
||||
text-align: left; |
||||
padding-left: 77px; |
||||
font-size: 12px; |
||||
color: red; |
||||
} |
||||
.mat-expansion-panel{ |
||||
span{ |
||||
color: black; |
||||
} |
||||
} |
||||
File diff suppressed because it is too large
Load Diff
@ -1,26 +0,0 @@
|
||||
<div mat-dialog-title>单位照片</div> |
||||
<div> |
||||
<div> |
||||
<ng-container *ngIf="isshowimg; else elseTemplate"> |
||||
<div class="imgbox"> |
||||
<img class="imgitemdefault" [src]="ImgUrl"> |
||||
<!-- <img class="imgitemdefault" [src]="ImgUrl" [ngClass]="{'img1': rotateA==90,'img2': rotateA==180,'img3': rotateA==270,'img4': rotateB==10,'img5': rotateB==20,'img6': rotateB==30}" > --> |
||||
</div> |
||||
</ng-container> |
||||
<ng-template #elseTemplate > |
||||
<p style="text-align: center;">暂无单位图片，请先上传</p> |
||||
</ng-template> |
||||
</div> |
||||
|
||||
|
||||
</div> |
||||
<!-- |
||||
<div class="swiper-button-prev"></div> |
||||
<div class="swiper-button-next"></div> --> |
||||
|
||||
|
||||
<!-- <div class="previewImgBottom"> |
||||
<button type="button" mat-icon-button (click)='rotate()'><mat-icon>refresh</mat-icon></button> |
||||
</div> --> |
||||
|
||||
|
||||
@ -1,66 +0,0 @@
|
||||
import { Component, OnInit, Inject } from '@angular/core'; |
||||
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree'; |
||||
import {FlatTreeControl} from '@angular/cdk/tree'; |
||||
import { HttpClient } from '@angular/common/http'; |
||||
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog'; |
||||
import {FormControl} from '@angular/forms'; |
||||
import { MatSnackBar } from '@angular/material/snack-bar'; |
||||
|
||||
@Component({ |
||||
selector: 'lookmaster', |
||||
templateUrl: './lookmaster.component.html', |
||||
styleUrls: ['./basicinfo.component.scss'] |
||||
}) |
||||
export class LookMaster { |
||||
// myControl = new FormControl();
|
||||
//注入MatDialogRef，可以用来关闭对话框
|
||||
//要访问对话框组件中的数据，必须使用MAT_DIALOG_DATA注入令牌
|
||||
constructor(private http: HttpClient,public dialogRef: MatDialogRef<LookMaster>,@Inject(MAT_DIALOG_DATA) public data) {} |
||||
allunittype:any |
||||
ImgUrl:string |
||||
rotationAngle=0 |
||||
isheng:any |
||||
isshowimg:boolean |
||||
onNoClick(): void { |
||||
this.dialogRef.close(); |
||||
} |
||||
ngOnInit(): void { |
||||
if(this.data.img.indexOf('?') == -1){ |
||||
this.isshowimg = false |
||||
}else{ |
||||
this.isshowimg = true |
||||
var imgurl = this.data.img.split("?") |
||||
this.ImgUrl = imgurl[0] |
||||
}
|
||||
|
||||
} |
||||
//点击旋转按钮时
|
||||
rotateA = 0 |
||||
rotateB = 0 |
||||
rotate(){ |
||||
var w= document.getElementsByClassName("imgitemdefault")[0]['naturalWidth']; |
||||
var h = document.getElementsByClassName("imgitemdefault")[0]['naturalHeight']; |
||||
|
||||
if(w > h){ |
||||
this.isheng = true |
||||
}else{ |
||||
this.isheng = false |
||||
} |
||||
if(this.isheng){ |
||||
this.rotateA += 90 |
||||
if(this.rotateA == 360){ |
||||
this.rotateA = 0 |
||||
} |
||||
}else{ |
||||
this.rotateB += 10 |
||||
if(this.rotateB == 40){ |
||||
this.rotateB = 0 |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
|
||||
|
||||
} |
||||
|
||||
@ -0,0 +1,36 @@
|
||||
<!-- |
||||
* @Descripttion: |
||||
* @version: |
||||
* @Author: sueRimn |
||||
* @Date: 2020-11-06 14:39:10 |
||||
* @LastEditors: sueRimn |
||||
* @LastEditTime: 2020-11-07 19:32:56 |
||||
--> |
||||
|
||||
<div class="box"> |
||||
<div class="topadd"> |
||||
<button (click)="addPermission()">新增</button> |
||||
<button (click)="savaClick()">保存</button> |
||||
</div> |
||||
<div class="center"> |
||||
<div class="one" *ngFor="let item of uploadSucced; let key=index"> |
||||
<span>{{item.name}}</span> |
||||
<div style="margin-left: 80px;width: 280px;" class="swiper-container"> |
||||
<div class="swiper-wrapper"> |
||||
<div class="swiper-slide" *ngFor="let itemx of item.src; let key=index"> |
||||
<img [src]="itemx" alt="" style="width: 200px; height: 100px;" > |
||||
<!-- <div class="swiper-lazy-preloader"></div> --> |
||||
</div> |
||||
|
||||
</div> |
||||
<!-- 如果需要导航按钮 --> |
||||
<div class="swiper-button-prev"></div> |
||||
<div class="swiper-button-next"></div> |
||||
|
||||
</div> |
||||
<input id="selectedfile" (change)="filechange($event,key)" type="file" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> |
||||
<textarea [(ngModel)]="item.text" name="" id="" cols="60" rows="6"></textarea> |
||||
<button (click)="deletePermission(key)">删除</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
@ -0,0 +1,76 @@
|
||||
.box{ |
||||
width: 100%; |
||||
height: 100%; |
||||
.topadd{ |
||||
width: 100%; |
||||
margin: 0.488281rem 0.097656rem; |
||||
button{ |
||||
background-color: #008CBA; /* Green */ |
||||
border: none; |
||||
border-radius: 8px; |
||||
color: white; |
||||
padding: 0.097656rem 0.488281rem; |
||||
text-align: center; |
||||
text-decoration: none; |
||||
display: inline-block; |
||||
font-size: 0.146484rem; |
||||
margin-left: 0.488281rem; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
.center{ |
||||
width: 100%; |
||||
height: 100%; |
||||
display: flex; |
||||
flex-direction:column; |
||||
overflow: auto; |
||||
span{ |
||||
font-size: 0.146484rem; |
||||
margin-left: 0.488281rem; |
||||
position: relative; |
||||
top: 0.488281rem; |
||||
} |
||||
textarea{ |
||||
position: relative; |
||||
left: 15%; |
||||
bottom: 0.976563rem; |
||||
} |
||||
.one{ |
||||
width: 100%; |
||||
height: 140px; |
||||
input{ |
||||
z-index: 999; |
||||
width: 1.953125rem; |
||||
height: 0.976563rem; |
||||
position: relative; |
||||
left: 0.976563rem; |
||||
bottom: 180px; |
||||
opacity: 0; |
||||
margin-top: 0.048828rem; |
||||
cursor: pointer; |
||||
} |
||||
img{ |
||||
position: relative; |
||||
margin-left: 20px; |
||||
|
||||
} |
||||
} |
||||
button{ |
||||
position: relative; |
||||
bottom: 150px; |
||||
left: 15%; |
||||
background-color: #FFFFFF; /* Green */ |
||||
border: 1px solid #000000; |
||||
border-radius: 8px; |
||||
color: #000000; |
||||
padding: 0.097656rem 0.488281rem; |
||||
text-align: center; |
||||
text-decoration: none; |
||||
display: inline-block; |
||||
font-size: 0.146484rem; |
||||
margin-left: 0.488281rem; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; |
||||
|
||||
import { FindProblemComponent } from './find-problem.component'; |
||||
|
||||
describe('FindProblemComponent', () => { |
||||
let component: FindProblemComponent; |
||||
let fixture: ComponentFixture<FindProblemComponent>; |
||||
|
||||
beforeEach(async(() => { |
||||
TestBed.configureTestingModule({ |
||||
declarations: [ FindProblemComponent ] |
||||
}) |
||||
.compileComponents(); |
||||
})); |
||||
|
||||
beforeEach(() => { |
||||
fixture = TestBed.createComponent(FindProblemComponent); |
||||
component = fixture.componentInstance; |
||||
fixture.detectChanges(); |
||||
}); |
||||
|
||||
it('should create', () => { |
||||
expect(component).toBeTruthy(); |
||||
}); |
||||
}); |
||||
@ -0,0 +1,154 @@
|
||||
/* |
||||
* @Descripttion:
|
||||
* @version:
|
||||
* @Author: sueRimn |
||||
* @Date: 2020-11-06 14:39:10 |
||||
* @LastEditors: sueRimn |
||||
* @LastEditTime: 2020-11-07 19:41:29 |
||||
*/ |
||||
import { Component, OnInit } from '@angular/core'; |
||||
import { HttpClient,HttpHeaders, HttpEventType } from '@angular/common/http'; |
||||
import { MatSnackBar ,MatSnackBarConfig} from '@angular/material/snack-bar'; |
||||
import { FileUploader, FileItem } from 'ng2-file-upload' |
||||
import Swiper from 'swiper'; |
||||
|
||||
@Component({ |
||||
selector: 'app-find-problem', |
||||
templateUrl: './find-problem.component.html', |
||||
styleUrls: ['./find-problem.component.scss'] |
||||
}) |
||||
export class FindProblemComponent implements OnInit { |
||||
|
||||
constructor(public snackBar: MatSnackBar,private http: HttpClient) { } |
||||
testSwiper: Swiper; |
||||
|
||||
ngOnInit(): void { |
||||
setTimeout(() => { |
||||
this.testSwiper = new Swiper('.swiper-container', { |
||||
direction: 'horizontal', |
||||
loop: true, |
||||
observer:true,//修改swiper自己或子元素时，自动初始化swiper
|
||||
observeParents:true,//修改swiper的父元素时，自动初始化swiper
|
||||
//lazy: true,
|
||||
// 如果需要前进后退按钮
|
||||
navigation: { |
||||
nextEl: '.swiper-button-next', |
||||
prevEl: '.swiper-button-prev', |
||||
} |
||||
}); |
||||
|
||||
}, 0); |
||||
|
||||
} |
||||
ngAfterViewInit() {
|
||||
console.log("d") |
||||
setTimeout(() => { |
||||
this.testSwiper = new Swiper('.swiper-container', { |
||||
direction: 'horizontal', |
||||
loop: true, |
||||
observer:true,//修改swiper自己或子元素时，自动初始化swiper
|
||||
observeParents:true,//修改swiper的父元素时，自动初始化swiper
|
||||
//lazy: true,
|
||||
// 如果需要前进后退按钮
|
||||
navigation: { |
||||
nextEl: '.swiper-button-next', |
||||
prevEl: '.swiper-button-prev', |
||||
} |
||||
}); |
||||
|
||||
}, 0); |
||||
|
||||
} |
||||
ceshiimg=["../../../assets/images/upload.jpg","../../../assets/images/upload2.jpg"] |
||||
inputShow=true//控制input显隐
|
||||
chooseid//key值
|
||||
textareazhi="" //备注框初始化
|
||||
imgsrc = "../../../assets/images/upload.jpg" //没有上传图片时显示的图片，当上传后就会被替换，即保存时需要传的图片地址参数
|
||||
imgUrl = ""//返回来的图片地址后缀
|
||||
file: any; //上传的文件
|
||||
isspinner:boolean=false //控制进度圈的显示隐藏
|
||||
//问题对象
|
||||
knowRoute=[{name:`问题1`,idnum:""}] |
||||
num=1 |
||||
//增加一行
|
||||
addPermission(){ |
||||
this.num++; |
||||
var nums=this.num.toString() |
||||
//this.knowRoute.push({name:"问题"+nums,idnum:""})
|
||||
this.uploadSucced.push({name:"问题"+nums,src:[],text:""}) |
||||
console.log(this.uploadSucced) |
||||
} |
||||
//删除一行
|
||||
deletePermission(key){ |
||||
this.uploadSucced.splice(key,1) |
||||
console.log(this.uploadSucced) |
||||
} |
||||
uploadSucced:any = JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"findproblem")) || [{name:"问题1",src:[],text:""}]//上传成功暂存对象
|
||||
//保存点击事件
|
||||
savaClick(){ |
||||
// this.uploadSucced[this.chooseid].text=this.textareazhi
|
||||
localStorage.setItem(sessionStorage.getItem("companyId")+"findproblem",JSON.stringify(this.uploadSucced)) |
||||
alert("保存成功") |
||||
console.log(JSON.parse(localStorage.getItem(sessionStorage.getItem("companyId")+"xxx")) ) |
||||
//this.snackBar.open('上传成功','确定',config);
|
||||
}
|
||||
//change选择文件
|
||||
filechange(e,key) { |
||||
this.chooseid=key |
||||
this.file = e.target.files[0] || null //上传的文件
|
||||
var reader = new FileReader(); |
||||
reader.readAsDataURL(this.file); |
||||
var image:any = new Image(); |
||||
reader.onload = function(){ |
||||
image.src = reader.result |
||||
} |
||||
setTimeout(() => { |
||||
if(image.width>=4096 || image.height>=5000 ){
|
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('请选择分辨率小于4096*5000的图片','确定',config); |
||||
}else{ |
||||
if(this.file){ |
||||
this.startUploading(key) |
||||
} |
||||
} |
||||
|
||||
}, 500); |
||||
}
|
||||
//上传文件
|
||||
startUploading(key) { |
||||
this.isspinner = true |
||||
let file = this.file || null //获取上传的文件
|
||||
let fileSize = file.size || null //上传文件的总大小
|
||||
let shardSize = 5 * 1024 * 1024 //5MB一个分片
|
||||
|
||||
if (file && fileSize <= shardSize) { //上传文件<=5MB时
|
||||
// this.upload()
|
||||
let formData = new FormData() |
||||
formData.append("file",file) |
||||
this.http.post(`/api/Objects/PlanPlatform/${sessionStorage.getItem('companyId')}`,formData).subscribe((data:any)=>{ |
||||
this.isspinner = false |
||||
this.imgUrl = data.objectName |
||||
this.imgsrc = `/api/Objects/PlanPlatform/${this.imgUrl}?x-oss-process=image/resize,m_fill,h_170,w_299` |
||||
console.log(this.imgsrc) |
||||
console.log(this.uploadSucced) |
||||
this.uploadSucced[key].src.push(this.imgsrc) |
||||
//this.inputShow=false
|
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('上传成功','确定',config); |
||||
}) |
||||
} else if (file && fileSize >= shardSize) { //上传文件>5MB时,分块上传
|
||||
|
||||
/* let data = { filename: file.name } |
||||
this.http.post(`/api/NewMultipartUpload/PlanPlatform/${this.unitinfo.id}`, {}, { params: data }).subscribe((data: any) => { //初始化分段上传
|
||||
this.objectName = data.objectName |
||||
this.uploadId = data.uploadId |
||||
this.subsectionUploading() |
||||
}) */ |
||||
} |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1,95 @@
|
||||
<!-- 现场照片 --> |
||||
<table > |
||||
<tr> |
||||
<td> |
||||
<div class="noImg" *ngIf="!unitImg"> |
||||
<div> |
||||
<img class="camera" src="../../../assets/images/camera.png" alt=""> |
||||
</div> |
||||
<p>熟悉单位照片</p> |
||||
<div> |
||||
<span>单位整体建筑或大门照片，要求照拍照时要求设置拍照日期</span> |
||||
</div> |
||||
</div> |
||||
<div class="input" *ngIf="!unitImg && isEditPattern"> |
||||
<input type="file" (change)="filechange1($event,'1')" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> |
||||
</div> |
||||
<div *ngIf="unitImg" id="viewerjs1"> |
||||
<img class="image" [src]="unitImg" alt="" [attr.data-original]="unitImg.split('?')[0]"> |
||||
</div> |
||||
<div *ngIf="unitImg && isEditPattern" class="deleteicon"> |
||||
<button mat-icon-button (click)="deleteimg('1')"> |
||||
<mat-icon>delete</mat-icon> |
||||
</button> |
||||
</div> |
||||
</td> |
||||
<td> |
||||
<div class="noImg" *ngIf="!lingdaoImg"> |
||||
<div> |
||||
<img src="../../../assets/images/camera.png" alt=""> |
||||
</div> |
||||
<p>领导带队现场熟悉照片</p> |
||||
<div> |
||||
<span>人员现场熟悉照片，要求有带队领导及熟悉人员现场熟悉场景，拍照时要求设置拍照日期</span> |
||||
</div> |
||||
</div> |
||||
<div class="input" *ngIf="!lingdaoImg && isEditPattern"> |
||||
<input type="file" (change)="filechange1($event,'2')" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> |
||||
</div> |
||||
<div *ngIf="lingdaoImg" id="viewerjs2"> |
||||
<img class="image" [src]="lingdaoImg" alt="" [attr.data-original]="lingdaoImg.split('?')[0]"> |
||||
</div> |
||||
<div *ngIf="lingdaoImg && isEditPattern" class="deleteicon"> |
||||
<button mat-icon-button (click)="deleteimg('2')"> |
||||
<mat-icon>delete</mat-icon> |
||||
</button> |
||||
</div> |
||||
</td> |
||||
</tr> |
||||
<tr> |
||||
<td> |
||||
<div class="noImg" *ngIf="!peopleImg"> |
||||
<div> |
||||
<img src="../../../assets/images/camera.png" alt=""> |
||||
</div> |
||||
<p>人员现场熟悉照片</p> |
||||
<div> |
||||
<span>人员现场熟悉照片，要求有熟悉人员现场熟悉场景，拍照时要求设置拍照日期</span> |
||||
</div> |
||||
</div> |
||||
<div class="input" *ngIf="!peopleImg && isEditPattern"> |
||||
<input type="file" (change)="filechange1($event,'3')" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> |
||||
</div> |
||||
<div *ngIf="peopleImg" id="viewerjs3"> |
||||
<img class="image" [src]="peopleImg" alt="" [attr.data-original]="peopleImg.split('?')[0]"> |
||||
</div> |
||||
<div *ngIf="peopleImg && isEditPattern" class="deleteicon"> |
||||
<button mat-icon-button (click)="deleteimg('3')"> |
||||
<mat-icon>delete</mat-icon> |
||||
</button> |
||||
</div> |
||||
</td> |
||||
<td> |
||||
<div class="noImg" *ngIf="!keysiteImg"> |
||||
<div> |
||||
<img src="../../../assets/images/camera.png" alt=""> |
||||
</div> |
||||
<p>单位重点部位照片</p> |
||||
<div> |
||||
<span>重点部位照片，拍照时要求设置拍照日期</span> |
||||
</div> |
||||
</div> |
||||
<div class="input" *ngIf="!keysiteImg && isEditPattern"> |
||||
<input type="file" (change)="filechange1($event,'4')" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> |
||||
</div> |
||||
<div *ngIf="keysiteImg" id="viewerjs4"> |
||||
<img class="image" [src]="keysiteImg" alt="" [attr.data-original]="keysiteImg.split('?')[0]"> |
||||
</div> |
||||
<div *ngIf="keysiteImg && isEditPattern" class="deleteicon"> |
||||
<button mat-icon-button (click)="deleteimg('4')"> |
||||
<mat-icon>delete</mat-icon> |
||||
</button> |
||||
</div> |
||||
</td> |
||||
</tr> |
||||
</table> |
||||
@ -0,0 +1,39 @@
|
||||
table{ |
||||
margin: 0 auto; |
||||
width: 85%; |
||||
height: 80%; |
||||
margin-top: 5%; |
||||
border-collapse: collapse; |
||||
td{ |
||||
position: relative; |
||||
width: 50%; |
||||
height: 2.246094rem; |
||||
p{ |
||||
font-size: 20px; |
||||
margin: 8px 0; |
||||
} |
||||
span{ |
||||
font-size: 15px; |
||||
font-weight: 500; |
||||
color: gray; |
||||
} |
||||
input{ |
||||
position: absolute; |
||||
width: 100%; |
||||
height: 2.246094rem; |
||||
left: 0; |
||||
top: 0; |
||||
opacity: 0; |
||||
} |
||||
.image{ |
||||
height: 100%; |
||||
width: 299px; |
||||
} |
||||
.deleteicon{ |
||||
position: absolute; |
||||
right: 0.058594rem; |
||||
top: 0.058594rem; |
||||
} |
||||
} |
||||
} |
||||
table,table tr th, table tr td { border:1px solid black;text-align: center; } |
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; |
||||
|
||||
import { PhotoofthesceneComponent } from './photoofthescene.component'; |
||||
|
||||
describe('PhotoofthesceneComponent', () => { |
||||
let component: PhotoofthesceneComponent; |
||||
let fixture: ComponentFixture<PhotoofthesceneComponent>; |
||||
|
||||
beforeEach(async(() => { |
||||
TestBed.configureTestingModule({ |
||||
declarations: [ PhotoofthesceneComponent ] |
||||
}) |
||||
.compileComponents(); |
||||
})); |
||||
|
||||
beforeEach(() => { |
||||
fixture = TestBed.createComponent(PhotoofthesceneComponent); |
||||
component = fixture.componentInstance; |
||||
fixture.detectChanges(); |
||||
}); |
||||
|
||||
it('should create', () => { |
||||
expect(component).toBeTruthy(); |
||||
}); |
||||
}); |
||||
@ -0,0 +1,173 @@
|
||||
import { HttpClient } from '@angular/common/http'; |
||||
import { Component, OnInit } from '@angular/core'; |
||||
import { MatSnackBar ,MatSnackBarConfig} from '@angular/material/snack-bar'; |
||||
import Viewer from 'viewerjs'; |
||||
@Component({ |
||||
selector: 'app-photoofthescene', |
||||
templateUrl: './photoofthescene.component.html', |
||||
styleUrls: ['./photoofthescene.component.scss'] |
||||
}) |
||||
export class PhotoofthesceneComponent implements OnInit { |
||||
|
||||
constructor(private http: HttpClient,public snackBar: MatSnackBar) { } |
||||
gallery//viewerJs实例
|
||||
isEditPattern = true |
||||
ngOnInit(): void { |
||||
setTimeout(() => { |
||||
if(document.getElementById('viewerjs1')){ |
||||
this.gallery = new Viewer(document.getElementById('viewerjs1'),{ |
||||
url: 'data-original' |
||||
}); |
||||
} |
||||
if(document.getElementById('viewerjs2')){ |
||||
this.gallery = new Viewer(document.getElementById('viewerjs2'),{ |
||||
url: 'data-original' |
||||
}); |
||||
} |
||||
if(document.getElementById('viewerjs3')){ |
||||
this.gallery = new Viewer(document.getElementById('viewerjs3'),{ |
||||
url: 'data-original' |
||||
}); |
||||
} |
||||
if(document.getElementById('viewerjs4')){ |
||||
this.gallery = new Viewer(document.getElementById('viewerjs4'),{ |
||||
url: 'data-original' |
||||
}); |
||||
} |
||||
}, 0); |
||||
|
||||
if(localStorage.getItem("pattern")=="edit"){ |
||||
this.isEditPattern = true |
||||
}else if(localStorage.getItem("pattern") == "look"){ |
||||
this.isEditPattern = false |
||||
} |
||||
} |
||||
|
||||
unitImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "1") || "" |
||||
lingdaoImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "2") || "" |
||||
peopleImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "3") || "" |
||||
keysiteImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "4") || "" |
||||
|
||||
//删除照片
|
||||
deleteimg(num){ |
||||
var msg = "您真的确定要删除吗？";
|
||||
if (confirm(msg)==true){
|
||||
localStorage.removeItem(sessionStorage.getItem('companyId')+num) |
||||
if(num == "1"){ |
||||
this.unitImg = "" |
||||
} |
||||
if(num == "2"){ |
||||
this.lingdaoImg = "" |
||||
} |
||||
if(num == "3"){ |
||||
this.peopleImg = "" |
||||
} |
||||
if(num == "4"){ |
||||
this.keysiteImg = "" |
||||
} |
||||
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
} |
||||
//熟悉单位照片上传
|
||||
file:any |
||||
filechange1(e,index){ |
||||
this.file = e.target.files[0] || null //上传的文件
|
||||
var reader = new FileReader(); |
||||
reader.readAsDataURL(this.file); |
||||
var image:any = new Image(); |
||||
reader.onload = function(){ |
||||
image.src = reader.result |
||||
} |
||||
setTimeout(() => { |
||||
if(image.width>=4096 || image.height>=5000 ){
|
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('请选择分辨率小于4096*5000的图片','确定',config); |
||||
}else{ |
||||
if(this.file){ |
||||
this.startUploading(index) |
||||
} |
||||
} |
||||
}, 500); |
||||
} |
||||
|
||||
|
||||
isspinner:any //进度圈
|
||||
imgUrl:any //上传后的图片地址
|
||||
imgsrc:any //上传后的缩略图地址
|
||||
|
||||
//上传文件
|
||||
startUploading(type) { |
||||
this.isspinner = true |
||||
let file = this.file || null //获取上传的文件
|
||||
let fileSize = file.size || null //上传文件的总大小
|
||||
let shardSize = 5 * 1024 * 1024 //5MB一个分片
|
||||
|
||||
if (file && fileSize <= shardSize) { //上传文件<=5MB时
|
||||
// this.upload()
|
||||
let formData = new FormData() |
||||
formData.append("file",file) |
||||
this.http.post(`/api/Objects/PlanPlatform/${sessionStorage.getItem('companyId')}`,formData).subscribe((data:any)=>{ |
||||
this.isspinner = false |
||||
this.imgUrl = data.objectName |
||||
this.imgsrc = `/api/Objects/PlanPlatform/${this.imgUrl}?x-oss-process=image/resize,m_fill,h_170,w_299` |
||||
localStorage.setItem(sessionStorage.getItem("companyId") + type, this.imgsrc) |
||||
if(type == '1'){ |
||||
this.unitImg = this.imgsrc |
||||
setTimeout(() => { |
||||
this.gallery = new Viewer(document.getElementById('viewerjs1'),{ |
||||
url: 'data-original' |
||||
}); |
||||
}, 0); |
||||
} |
||||
if(type == '2'){ |
||||
this.lingdaoImg = this.imgsrc |
||||
setTimeout(() => { |
||||
this.gallery = new Viewer(document.getElementById('viewerjs2'),{ |
||||
url: 'data-original' |
||||
}); |
||||
}, 0); |
||||
} |
||||
if(type == '3'){ |
||||
this.peopleImg = this.imgsrc |
||||
setTimeout(() => { |
||||
this.gallery = new Viewer(document.getElementById('viewerjs3'),{ |
||||
url: 'data-original' |
||||
}); |
||||
}, 0); |
||||
} |
||||
if(type == '4'){ |
||||
this.keysiteImg = this.imgsrc |
||||
setTimeout(() => { |
||||
this.gallery = new Viewer(document.getElementById('viewerjs4'),{ |
||||
url: 'data-original' |
||||
}); |
||||
}, 0); |
||||
} |
||||
|
||||
|
||||
|
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('上传成功','确定',config); |
||||
|
||||
|
||||
}) |
||||
} else if (file && fileSize >= shardSize) { //上传文件>5MB时,分块上传
|
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('请上传小于5M图片','确定',config); |
||||
// let data = { filename: file.name }
|
||||
// this.http.post(`/api/NewMultipartUpload/PlanPlatform/${this.unitinfo.id}`, {}, { params: data }).subscribe((data: any) => { //初始化分段上传
|
||||
// this.objectName = data.objectName
|
||||
// this.uploadId = data.uploadId
|
||||
// this.subsectionUploading()
|
||||
// })
|
||||
} |
||||
} |
||||
} |
||||
@ -1,3 +1,7 @@
|
||||
<div class="content"> |
||||
<div class="center" id="center"></div> |
||||
<div class="btnbox"> |
||||
<div class="btn" (click)="next()">已到达熟悉单位</div> |
||||
<div (click)="back()">取消本次任务</div> |
||||
</div> |
||||
</div> |
||||
|
||||
@ -0,0 +1,14 @@
|
||||
<div class="dialogbox"> |
||||
<div class="title"> |
||||
<span style="color: #FC7045;">说明:</span> |
||||
<span>水源情况主要包括消火栓位置、管径、外观完好情况、停车取水位置试水情况，消防水池位置、容量、停车取水位置、取水测试情况，取消码头位置、水位、停车取水位置等；道路情况主要包括道路长度、宽度、起始点、沿线重点单位、立交、桥梁、涵洞及其通车能力。</span> |
||||
<span style="color: #FC7045;">【该项主要在道路水源熟悉时填写】</span> |
||||
</div> |
||||
<div class="text"> |
||||
<textarea [disabled]="!isEditPattern" name="" id="" cols="30" rows="10" placeholder="请输入水源情况" [(ngModel)]="textcontant"></textarea> |
||||
</div> |
||||
<div class="btnbox"> |
||||
<div *ngIf="isEditPattern" (click)="ok()">确认</div> |
||||
<div (click)="cancel()">取消</div> |
||||
</div> |
||||
</div> |
||||
@ -0,0 +1,19 @@
|
||||
<div class="content"> |
||||
<div class="center" id="map"></div> |
||||
<!-- <div class="textbox"> |
||||
<div class="btn"> |
||||
<span> |
||||
<mat-icon (click)="save()">description</mat-icon> |
||||
<mat-icon (click)="clickicon()">create</mat-icon> |
||||
</span> |
||||
</div> |
||||
<div class="text" [hidden]="!isshow"> |
||||
<textarea [(ngModel)]="textcontant" name="" id="" cols="28" rows="18" placeholder="水源情况主要包括消火栓位置、管径、外观完好情况、停车取水位置试水情况，消防水池位置、容量、停车取水位置、取水测试情况，取消码头位置、水位、停车取水位置等；道路情况主要包括道路长度、宽度、起始点、沿线重点单位、立交、桥梁、涵洞及其通车能力。【该项主要在道路水源熟悉时填写】"></textarea> |
||||
</div> |
||||
</div> --> |
||||
<div class="editbtn" (click)="opendialog()"> |
||||
<p><mat-icon>create</mat-icon></p> |
||||
<p style="color: #fff;">编辑</p> |
||||
</div> |
||||
</div> |
||||
|
||||
@ -0,0 +1,82 @@
|
||||
.content { |
||||
width: 100%; |
||||
height: 100%; |
||||
box-sizing: border-box; |
||||
padding: 0.244141rem; |
||||
overflow: hidden; |
||||
position: relative; |
||||
.center { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
.textbox{ |
||||
position: absolute; |
||||
z-index: 999; |
||||
right: 0.244141rem; |
||||
top:0.244141rem; |
||||
.btn{ |
||||
text-align: right; |
||||
} |
||||
} |
||||
.editbtn{ |
||||
text-align: center; |
||||
position: absolute; |
||||
right: 0.507813rem; |
||||
bottom: 0.439453rem; |
||||
width: 0.976563rem; |
||||
height: 0.976563rem; |
||||
line-height: 0.859375rem; |
||||
background: linear-gradient(360deg, #FC7045 0%, #FF4923 100%); |
||||
box-shadow: 0px 2px 10px #D8A798; |
||||
border-radius: 50%; |
||||
opacity: 1; |
||||
p{ |
||||
height: 0.175781rem; |
||||
font-size: 0.15625rem; |
||||
color: #fff; |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
.dialogbox{ |
||||
width: 7.441406rem; |
||||
height: 5.761719rem; |
||||
.title{ |
||||
span{ |
||||
font-size: 16px; |
||||
} |
||||
} |
||||
.text{ |
||||
width: 97%; |
||||
height: 3.554688rem; |
||||
margin-top: 0.351563rem; |
||||
background: #F4F5F9; |
||||
|
||||
border-radius: 10px; |
||||
textarea{ |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
.btnbox{ |
||||
display: flex; |
||||
margin-top: 0.351563rem; |
||||
justify-content: center; |
||||
div{ |
||||
font-size: 0.15625rem; |
||||
width: 1.757813rem; |
||||
height: 0.46875rem; |
||||
line-height: 0.46875rem; |
||||
text-align: center; |
||||
background: #E9EAF3; |
||||
opacity: 1; |
||||
border-radius: 30px; |
||||
margin: 0 10px; |
||||
} |
||||
div:nth-child(1){ |
||||
color: #fff; |
||||
background: linear-gradient(337deg, #FC7045 0%, #FF4923 100%); |
||||
} |
||||
} |
||||
} |
||||
@ -1,20 +1,20 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; |
||||
|
||||
import { BasicinfoComponent } from './basicinfo.component'; |
||||
import { WaterRoadComponent } from './water-road.component'; |
||||
|
||||
describe('BasicinfoComponent', () => { |
||||
let component: BasicinfoComponent; |
||||
let fixture: ComponentFixture<BasicinfoComponent>; |
||||
describe('WaterRoadComponent', () => { |
||||
let component: WaterRoadComponent; |
||||
let fixture: ComponentFixture<WaterRoadComponent>; |
||||
|
||||
beforeEach(async(() => { |
||||
TestBed.configureTestingModule({ |
||||
declarations: [ BasicinfoComponent ] |
||||
declarations: [ WaterRoadComponent ] |
||||
}) |
||||
.compileComponents(); |
||||
})); |
||||
|
||||
beforeEach(() => { |
||||
fixture = TestBed.createComponent(BasicinfoComponent); |
||||
fixture = TestBed.createComponent(WaterRoadComponent); |
||||
component = fixture.componentInstance; |
||||
fixture.detectChanges(); |
||||
}); |
||||
@ -0,0 +1,135 @@
|
||||
import { Component, Inject, OnInit } from '@angular/core'; |
||||
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; |
||||
declare var AMap: any; |
||||
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; |
||||
|
||||
@Component({ |
||||
selector: 'app-water-road', |
||||
templateUrl: './water-road.component.html', |
||||
styleUrls: ['./water-road.component.scss'] |
||||
}) |
||||
export class WaterRoadComponent implements OnInit { |
||||
|
||||
constructor(public snackBar: MatSnackBar,public dialog: MatDialog) { } |
||||
isshow:boolean = true |
||||
textcontant:any = localStorage.getItem(sessionStorage.getItem("companyId") + "waterroad") || "" |
||||
clickicon(){ |
||||
this.isshow = !this.isshow |
||||
} |
||||
save(){ |
||||
localStorage.setItem(sessionStorage.getItem("companyId") + "waterroad",this.textcontant) |
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('保存成功','确定',config); |
||||
} |
||||
map:any //地图
|
||||
ngOnInit(): void { |
||||
setTimeout(() => { |
||||
this.creatMap() |
||||
|
||||
}, 0); |
||||
} |
||||
|
||||
|
||||
creatMap(){ |
||||
var satellite = new AMap.TileLayer.Satellite(); |
||||
var roadNet = new AMap.TileLayer.RoadNet(); |
||||
|
||||
// 创建一个 icon
|
||||
var startIcon = new AMap.Icon({ |
||||
image: '../../../assets/images/fireHydrant.png', |
||||
// // 图标所用图片大小
|
||||
imageSize: new AMap.Size(20, 20), |
||||
// // 图标取图偏移量
|
||||
// imageOffset: new AMap.Pixel(-9, -3)
|
||||
}); |
||||
let arr = [{lng:108.299405,lat: 22.894884}, |
||||
{lng:108.597409,lat: 22.80883}, |
||||
{lng:108.689419,lat: 23.061775}, |
||||
{lng:107.971188,lat: 22.950537}, |
||||
{lng:107.847592,lat: 23.090833}, |
||||
{lng:108.176374,lat: 22.790585}, |
||||
{lng:108.407087,lat: 22.671522}, |
||||
{lng:108.158521,lat: 22.61322}, |
||||
{lng:107.925062,lat: 22.565038}, |
||||
{lng:108.180494,lat: 22.501616}, |
||||
{lng:107.743222,lat: 22.535121}, |
||||
{lng:108.373809,lat: 22.764746}, |
||||
{lng:108.378895,lat: 22.761877}, |
||||
{lng:108.383337,lat: 22.766467}, |
||||
{lng:108.37647,lat: 22.763341}, |
||||
{lng:108.37662,lat: 22.767397}, |
||||
{lng:108.378916,lat: 22.758513}, |
||||
{lng:108.379045,lat: 22.765695}, |
||||
{lng:108.384731,lat: 22.760096},] |
||||
let Arr = [] |
||||
arr.forEach(item=>{ |
||||
let viaMarker = new AMap.Marker({ |
||||
position: new AMap.LngLat(item.lng, item.lat), |
||||
icon: startIcon, |
||||
offset: new AMap.Pixel(-10, -10) |
||||
}) |
||||
Arr.push(viaMarker) |
||||
}) |
||||
|
||||
this.map = new AMap.Map('map',{ |
||||
center: [108.377865, 22.763499], //初始地图中心点
|
||||
zoom: 16 |
||||
}); |
||||
|
||||
this.map.on('click', (e) => { |
||||
console.log(e.lnglat.getLng() + ',' + e.lnglat.getLat())
|
||||
}); |
||||
|
||||
// this.map.setCity('南宁市')
|
||||
this.map.add(Arr);//火源标点
|
||||
|
||||
|
||||
} |
||||
|
||||
opendialog(){ |
||||
let dialogRef = this.dialog.open(EditText); |
||||
dialogRef.afterClosed().subscribe(data=>{ |
||||
if(data){ |
||||
|
||||
} |
||||
});
|
||||
} |
||||
} |
||||
|
||||
|
||||
//编辑水源道路情况
|
||||
@Component({ |
||||
selector: 'app-editBuilding', |
||||
templateUrl: './edittext.html', |
||||
styleUrls: ['./water-road.component.scss'] |
||||
}) |
||||
export class EditText { |
||||
|
||||
constructor(public snackBar: MatSnackBar,public dialog: MatDialog,public dialogRef: MatDialogRef<EditText>,@Inject(MAT_DIALOG_DATA) public data) { } |
||||
textcontant:any = localStorage.getItem(sessionStorage.getItem("companyId") + "waterroad") || ""//输入内容
|
||||
isEditPattern = true |
||||
ngOnInit(): void { |
||||
if(localStorage.getItem("pattern")=="edit"){ |
||||
this.isEditPattern = true |
||||
}else if(localStorage.getItem("pattern") == "look"){ |
||||
this.isEditPattern = false |
||||
} |
||||
} |
||||
|
||||
|
||||
//确定
|
||||
ok(){ |
||||
localStorage.setItem(sessionStorage.getItem("companyId") + "waterroad",this.textcontant) |
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('保存成功','确定',config); |
||||
this.dialogRef.close(); |
||||
} |
||||
//取消
|
||||
cancel(){ |
||||
this.dialogRef.close(); |
||||
} |
||||
} |
||||
|
After Width: | Height: | Size: 942 B |
|
After Width: | Height: | Size: 4.5 KiB |
Loading…
Reference in new issue