From d7c3078cb09359c309786811672ff8c8f0587baa Mon Sep 17 00:00:00 2001 From: SHAOJIAHAO <55341701@qq.com> Date: Mon, 9 Nov 2020 16:23:06 +0800 Subject: [PATCH] =?UTF-8?q?[=E6=96=B0=E5=A2=9E]=E6=96=B0=E5=A2=9E=E6=BC=94?= =?UTF-8?q?=E7=BB=83=E8=AE=B0=E5=BD=95=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../explain-textarea.component.html | 14 ++ .../explain-textarea.component.scss | 46 +++++ .../explain-textarea.component.spec.ts | 25 +++ .../explain-textarea.component.ts | 22 +++ .../photoofthescene.component.html | 95 +++++++++ .../photoofthescene.component.scss | 40 ++++ .../photoofthescene.component.spec.ts | 25 +++ .../photoofthescene.component.ts | 180 ++++++++++++++++++ .../rehearsal-recordinfo.component.html | 26 ++- .../rehearsal-recordinfo.component.ts | 22 ++- src/app/ui/ui.module.ts | 4 +- 11 files changed, 482 insertions(+), 17 deletions(-) create mode 100644 src/app/ui/explain-textarea/explain-textarea.component.html create mode 100644 src/app/ui/explain-textarea/explain-textarea.component.scss create mode 100644 src/app/ui/explain-textarea/explain-textarea.component.spec.ts create mode 100644 src/app/ui/explain-textarea/explain-textarea.component.ts create mode 100644 src/app/ui/photoofthescene2/photoofthescene.component.html create mode 100644 src/app/ui/photoofthescene2/photoofthescene.component.scss create mode 100644 src/app/ui/photoofthescene2/photoofthescene.component.spec.ts create mode 100644 src/app/ui/photoofthescene2/photoofthescene.component.ts diff --git a/src/app/ui/explain-textarea/explain-textarea.component.html b/src/app/ui/explain-textarea/explain-textarea.component.html new file mode 100644 index 0000000..a56f26c --- /dev/null +++ b/src/app/ui/explain-textarea/explain-textarea.component.html @@ -0,0 +1,14 @@ +
+
+ 说明: + + {{explain}} + +
+
+ +
+
+
保存
+
+
\ No newline at end of file diff --git a/src/app/ui/explain-textarea/explain-textarea.component.scss b/src/app/ui/explain-textarea/explain-textarea.component.scss new file mode 100644 index 0000000..fd5c13e --- /dev/null +++ b/src/app/ui/explain-textarea/explain-textarea.component.scss @@ -0,0 +1,46 @@ +.box{ + width: 100%; + height: 100%; + font-size: 0.146484rem; + font-family: Source Han Sans CN; + display: flex; + flex-direction: column; + .topbox{ + margin: 0 auto; + width: 90%; + margin-top: 0.195313rem; + } + .textbox{ + margin: 0 auto; + flex: 1; + width: 90%; + border-radius: 10px; + padding: 0.195313rem; + textarea{ + font-family: Source Han Sans CN; + font-size: 0.146484rem; + border-radius: 10px; + background: #F4F5F9; + width: 100%; + height: 100%; + border: none; + box-sizing:border-box; + padding: 0.195313rem; + } + } + .btn{ + div{ + margin: 0 auto; + margin-bottom: 0.126953rem; + width: 0.78125rem; + height: 0.351563rem; + color: #fff; + text-align: center; + line-height: 0.351563rem; + background: linear-gradient(337deg, #FC7045 0%, #FF4923 100%); + opacity: 1; + border-radius: 0.292969rem; + } + + } +} \ No newline at end of file diff --git a/src/app/ui/explain-textarea/explain-textarea.component.spec.ts b/src/app/ui/explain-textarea/explain-textarea.component.spec.ts new file mode 100644 index 0000000..98fb40a --- /dev/null +++ b/src/app/ui/explain-textarea/explain-textarea.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ExplainTextareaComponent } from './explain-textarea.component'; + +describe('ExplainTextareaComponent', () => { + let component: ExplainTextareaComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ExplainTextareaComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ExplainTextareaComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/ui/explain-textarea/explain-textarea.component.ts b/src/app/ui/explain-textarea/explain-textarea.component.ts new file mode 100644 index 0000000..4f2e1fc --- /dev/null +++ b/src/app/ui/explain-textarea/explain-textarea.component.ts @@ -0,0 +1,22 @@ +import { Component, Input, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-explain-textarea', + templateUrl: './explain-textarea.component.html', + styleUrls: ['./explain-textarea.component.scss'] +}) +export class ExplainTextareaComponent implements OnInit { + @Input() explain:String + @Input() placeholder:String + @Input() index:String + + textcontant:string + constructor() { } + + ngOnInit(): void { + this.textcontant = localStorage.getItem(sessionStorage.getItem('companyId')+'text'+this.index) || '' + } + save(){ + localStorage.setItem(sessionStorage.getItem('companyId')+'text'+this.index,this.textcontant) + } +} diff --git a/src/app/ui/photoofthescene2/photoofthescene.component.html b/src/app/ui/photoofthescene2/photoofthescene.component.html new file mode 100644 index 0000000..1ac7e11 --- /dev/null +++ b/src/app/ui/photoofthescene2/photoofthescene.component.html @@ -0,0 +1,95 @@ + + + + + + + + + + +
+
+
+ +
+

上传演练单位照片

+
+ 单位整体建筑或大门照片，要求照拍照时要求设置拍照日期 +
+
+
+ +
+
+ +
+
+ +
+ 		+
+
+ +
+

上传演练现场照片

+
+ 拍照时要求设置拍照日期 +
+
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+

上传演练现场照片

+
+ 拍照时要求设置拍照日期 +
+
+
+ +
+
+ +
+
+ +
+ 		+
+
+ +
+

上传演练总结照片

+
+ 演练总结时的照片，照片要求能反映演练指挥员及演练全体人员，拍照时要求设置拍照日期 +
+
+
+ +
+
+ +
+
+ +
+
\ No newline at end of file diff --git a/src/app/ui/photoofthescene2/photoofthescene.component.scss b/src/app/ui/photoofthescene2/photoofthescene.component.scss new file mode 100644 index 0000000..625135f --- /dev/null +++ b/src/app/ui/photoofthescene2/photoofthescene.component.scss @@ -0,0 +1,40 @@ +table{ + margin: 0 auto; + width: 85%; + height: 80%; + margin-top: 5%; + overflow-y: auto; + 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: 2.919922rem; + } + .deleteicon{ + position: absolute; + right: 0.058594rem; + top: 0.058594rem; + } + } +} +table,table tr th, table tr td { border:1px solid black;text-align: center; } \ No newline at end of file diff --git a/src/app/ui/photoofthescene2/photoofthescene.component.spec.ts b/src/app/ui/photoofthescene2/photoofthescene.component.spec.ts new file mode 100644 index 0000000..b2b65fe --- /dev/null +++ b/src/app/ui/photoofthescene2/photoofthescene.component.spec.ts @@ -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; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ PhotoofthesceneComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PhotoofthesceneComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/ui/photoofthescene2/photoofthescene.component.ts b/src/app/ui/photoofthescene2/photoofthescene.component.ts new file mode 100644 index 0000000..9379a9f --- /dev/null +++ b/src/app/ui/photoofthescene2/photoofthescene.component.ts @@ -0,0 +1,180 @@ +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-photoofthescene2', + templateUrl: './photoofthescene.component.html', + styleUrls: ['./photoofthescene.component.scss'] +}) +export class PhotoofthesceneComponent2 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 = true + } + } + + unitImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "1" + 'rehearsal') || "" + lingdaoImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "2" + 'rehearsal') || "" + peopleImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "3" + 'rehearsal') || "" + keysiteImg:any = localStorage.getItem(sessionStorage.getItem("companyId") + "4" + 'rehearsal') || "" + + //删除照片 + 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); + } + + + // imgUrl:any //上传后的图片地址 + // imgsrc:any //上传后的缩略图地址 + + //上传文件 + startUploading(type) { + let file = this.file || null //获取上传的文件 + let fileSize = file.size || null //上传文件的总大小 + let shardSize = 5 * 1024 * 1024 //5MB一个分片 + + if (file && fileSize <= shardSize) { //上传文件<=5MB时 + + + + let formData = new FormData() + formData.append("file",file) + this.http.post(`/api/Objects/PlanPlatform/${sessionStorage.getItem('companyId')}`,formData).subscribe((data:any)=>{ + let imgsrc = `/api/Objects/PlanPlatform/${data.objectName}?x-oss-process=image/resize,m_fill,h_170,w_299` + localStorage.setItem(sessionStorage.getItem("companyId") + type + 'rehearsal', imgsrc) + if(type == '1'){ + this.unitImg = imgsrc + setTimeout(() => { + this.gallery = new Viewer(document.getElementById('viewerjs1'),{ + url: 'data-original' + }); + }, 0); + } + if(type == '2'){ + this.lingdaoImg = imgsrc + setTimeout(() => { + this.gallery = new Viewer(document.getElementById('viewerjs2'),{ + url: 'data-original' + }); + }, 0); + } + if(type == '3'){ + this.peopleImg = imgsrc + setTimeout(() => { + this.gallery = new Viewer(document.getElementById('viewerjs3'),{ + url: 'data-original' + }); + }, 0); + } + if(type == '4'){ + this.keysiteImg = 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() + // }) + } + } + dialog(){ + if(localStorage.getItem("pattern")=="look"){ + const config = new MatSnackBarConfig(); + config.verticalPosition = 'top'; + config.duration = 3000 + this.snackBar.open('查看模式无法上传','确定',config); + } + } +} diff --git a/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.html b/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.html index 3625759..b70f518 100644 --- a/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.html +++ b/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.html @@ -9,52 +9,48 @@ - + - - + - - + - - + - - + - + - + - + - - - + + + diff --git a/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.ts b/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.ts index e3120d7..6c77785 100644 --- a/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.ts +++ b/src/app/ui/rehearsal-recordinfo/rehearsal-recordinfo.component.ts @@ -10,6 +10,27 @@ export class RehearsalRecordinfoComponent implements OnInit { title:any = "演练记录信息" constructor() { } + //灾情设定 + situationexplain = "实情设定要求有灾情时间、地点、灾情范围和发展趋势、被困人员数量、消防设施损坏情况、灭火救援进程等，还可根据演练开展情况随机设置灾情况实情设定要求有灾情时间、地点、灾情范围和发展趋势、被困人员数量、消防设施损坏情况、灭火救援进程等，还可根据演练开展情况随机设置灾情" + situationplaceholder = "请输入灾情设定" + //组织指挥情况 + organizationexplain = "支队演练组织指挥主要包括力量调集、信息收集、制订作战方案、部署作战任务、落实战勤保障等情况； 大中队演练组织指挥主要 包括部署作战任务等情况" + organizationplaceholder = "请输入组织指挥情况" + //作战行动情况 + operationexplain = "主要包括火警受理、力量调派、灾情侦察、战斗展开、抢救人员、疏散物资、现场破拆、火场供水、火场排烟、现场通信等情况。通常一处战斗行动的描述主要包括作战人员、作战线路、作战技战术措施、作战任务、作战任务落实效果等" + operationplaceholder = "请输入作战行动情况" + //单位内部消防设施使用情况 + firefightingequipmentexplain = "通常包括使用人员、使用方式方法、使用目的效果等" + firefightingequipmenplaceholder = "请输入单位内部消防设施使用情况" + //好的方面 + goodexplain = "主要对接警调度、指挥决策、战斗部署、战术运用、协同作战、战勤保障、作战秩序、作战安全等方面存在问题进行归纳" + goodplaceholder = "请输入好的方面" + //存在问题及改进措施 + problemexplain = "主要对接警调度、指挥决策、战斗部署、战术运用、协同作战、战勤保障、作战秩序、作战安全等方面存在问题进行归纳" + problemplaceholder = "请输入存在问题及改进措施" + //备注 + remarkexplain = '1、时间填写到年-月-日-时；2、作战行动主要包括火警受理、力量调派、灾情侦察、战斗展开、抢救人员、疏散物资、现场破拆、火场供水、火场排烟、现场通信等情况；3、组织指挥主要包括力量调集、信息收集、制订作战方案、部署作战任务、指挥战斗行动、落实战勤保障等情况；4、演练要求有影像资料，并及时建档；5、各地可参照此卡，结合本地实际，制定演练记录卡' + remarkplaceholder = '请输入存在问题及改进措施' ngOnInit(): void { } onCustom($event){ @@ -18,6 +39,5 @@ export class RehearsalRecordinfoComponent implements OnInit { } selectedtab(e){ sessionStorage.setItem("tabsindex",e.index) - // console.log(e.index) } } diff --git a/src/app/ui/ui.module.ts b/src/app/ui/ui.module.ts index 727400c..9ecbebd 100644 --- a/src/app/ui/ui.module.ts +++ b/src/app/ui/ui.module.ts @@ -70,8 +70,10 @@ import { EditText, WaterRoadComponent } from './water-road/water-road.component' import { KnowRouteComponent } from './know-route/know-route.component'; import { FindProblemComponent } from './find-problem/find-problem.component'; import { RehearsalRecordinfoComponent } from './rehearsal-recordinfo/rehearsal-recordinfo.component'; +import { ExplainTextareaComponent } from './explain-textarea/explain-textarea.component'; +import { PhotoofthesceneComponent2 } from './photoofthescene2/photoofthescene.component'; @NgModule({ - declarations: [UiComponent, FooterComponent, UserdataComponent, ChangepasswordComponent,IsnoPipe,ConfirmpswDirective,TimePipe,EditUser,CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent,HomeComponent, AddSixFamiliarComponent, TitleComponent, SelectUnit, TrainingRecordinfoComponent,RouterGISComponent, PhotoofthesceneComponent, WaterRoadComponent,FindProblemComponent,KnowRouteComponent,EditText, RehearsalRecordinfoComponent], + declarations: [UiComponent, FooterComponent, UserdataComponent, ChangepasswordComponent,IsnoPipe,ConfirmpswDirective,TimePipe,EditUser,CollectionToolsComponent,WorkingAreaComponent,CreateBuilding,EditBuilding,leftFunctionalDomainComponent,editPlaneFigureComponent,ViewDetails,saveOneDialog,saveTwoDialog,addDisposalNodeComponent,editDisposalNodeComponent,HomeComponent, AddSixFamiliarComponent, TitleComponent, SelectUnit, TrainingRecordinfoComponent,RouterGISComponent, PhotoofthesceneComponent, WaterRoadComponent,FindProblemComponent,KnowRouteComponent,EditText, RehearsalRecordinfoComponent, ExplainTextareaComponent,PhotoofthesceneComponent2], imports: [ CommonModule,