Browse Source

[修改]审核记录页面二三维预案显示格式

zhuzhou
chenjingyu 4 years ago
parent
commit
2509adf893
  1. 5
      src/app/plan-audit/plan-audit.module.ts
  2. 25
      src/app/plan-audit/plan-record/plan-record.component.html
  3. 12
      src/app/plan-audit/plan-record/plan-record.component.scss
  4. 141
      src/app/plan-audit/plan-record/plan-record.component.ts
  5. 11
      src/app/plan-audit/plan-record/show3D.html

5
src/app/plan-audit/plan-audit.module.ts

@ -70,10 +70,13 @@ import { CadDrawComponent } from './cad-draw/cad-draw.component'
import { RealisticPictureLookComponent }from './realistic-picture-look/realistic-picture.component' import { RealisticPictureLookComponent }from './realistic-picture-look/realistic-picture.component'
import { previewImg3 } from './realistic-picture-look/realistic-picture.component' import { previewImg3 } from './realistic-picture-look/realistic-picture.component'
import { show3D } from './wait-examineer/wait-examineer.component'; import { show3D } from './wait-examineer/wait-examineer.component';
import { recordshow3D } from './plan-record/plan-record.component'
import { ViewDetailsComponent } from './view-details/view-details.component' import { ViewDetailsComponent } from './view-details/view-details.component'
@NgModule({ @NgModule({
declarations: [DetachmentLevelComponent, PlanAuditComponent, PlanPassComponent,PlanOpen, PlanRecordComponent, BasicInfoComponent, declarations: [DetachmentLevelComponent, PlanAuditComponent, PlanPassComponent,PlanOpen, PlanRecordComponent, BasicInfoComponent,
WaitExamineerComponent,AllaroundComponent,ImgDetails,FireFacilitiesComponent,ImagesData2,previewBigImg2,PlanListComponent,OpenPlanToolDialog,KeySiteLookComponent,KeySiteImgs2,FunctionPartitionComponent,CadDrawComponent,RealisticPictureLookComponent,previewImg3,show3D, WaterAuditComponent, FireforceAuditComponent, LinkageforcesAuditComponent, ViewDetailsComponent], WaitExamineerComponent,AllaroundComponent,ImgDetails,FireFacilitiesComponent,ImagesData2,previewBigImg2,PlanListComponent,OpenPlanToolDialog,
KeySiteLookComponent,KeySiteImgs2,FunctionPartitionComponent,CadDrawComponent,RealisticPictureLookComponent,previewImg3,show3D, WaterAuditComponent,
FireforceAuditComponent, LinkageforcesAuditComponent, ViewDetailsComponent,recordshow3D],
imports: [ imports: [
CommonModule, CommonModule,
PlanAuditRoutingModule, PlanAuditRoutingModule,

25
src/app/plan-audit/plan-record/plan-record.component.html

@ -4,7 +4,7 @@
* @Author: sueRimn * @Author: sueRimn
* @Date: 2020-12-25 10:19:31 * @Date: 2020-12-25 10:19:31
* @LastEditors: sueRimn * @LastEditors: sueRimn
* @LastEditTime: 2021-02-02 15:58:22 * @LastEditTime: 2021-02-20 10:40:25
--> -->
<div class="box"> <div class="box">
<div class="boxleft"> <div class="boxleft">
@ -172,9 +172,30 @@
</mat-tab> --> </mat-tab> -->
</mat-tab-group> </mat-tab-group>
<div class="word" *ngIf="showtype==0||showtype==2"> <div class="word" *ngIf="showtype==0">
<iframe [src]='iframeSrc'></iframe> <iframe [src]='iframeSrc'></iframe>
</div> </div>
<div id="viewer" *ngIf="showtype==1"></div> <div id="viewer" *ngIf="showtype==1"></div>
<div class="twoD" *ngIf="showtype==2">
<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 class="planBox">
<span style="color: #2196F3;cursor:pointer;" (click)='oopen3Dshow()'>查看详情</span>
</div>
</div>
</div> </div>
</div> </div>

12
src/app/plan-audit/plan-record/plan-record.component.scss

@ -92,6 +92,18 @@ th,td{
.green{color: #00C756;} .green{color: #00C756;}
.red{color: #FF4D4D;} .red{color: #FF4D4D;}
.blue{color: #2196F3;} .blue{color: #2196F3;}
.twoD {
width: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: left;
.planBox {
margin: 30px 30px;
color: black;
:first-child {margin-right: 10px;}
}
}
//滚动条样式 //滚动条样式
::-webkit-scrollbar{ ::-webkit-scrollbar{

141
src/app/plan-audit/plan-record/plan-record.component.ts

@ -4,11 +4,12 @@
* @Author: sueRimn * @Author: sueRimn
* @Date: 2020-12-25 10:19:31 * @Date: 2020-12-25 10:19:31
* @LastEditors: sueRimn * @LastEditors: sueRimn
* @LastEditTime: 2021-02-06 10:15:00 * @LastEditTime: 2021-02-20 10:39:50
*/ */
import { Component, OnInit } from '@angular/core'; import { Component, OnInit,Inject } from '@angular/core';
import { FormControl } from '@angular/forms'; import { FormControl } from '@angular/forms';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
import { HttpClient } from '@angular/common/http' import { HttpClient } from '@angular/common/http'
import { DomSanitizer } from '@angular/platform-browser'; import { DomSanitizer } from '@angular/platform-browser';
import { Viewer } from 'photo-sphere-viewer'; import { Viewer } from 'photo-sphere-viewer';
@ -21,7 +22,7 @@ declare var CryptoJS
}) })
export class PlanRecordComponent implements OnInit { export class PlanRecordComponent implements OnInit {
constructor(private http:HttpClient,public snackBar: MatSnackBar,private sanitizer: DomSanitizer) { } constructor(private http:HttpClient,public snackBar: MatSnackBar,private sanitizer: DomSanitizer,public dialog: MatDialog) { }
ngOnInit(): void { ngOnInit(): void {
let level = sessionStorage.getItem("level"); let level = sessionStorage.getItem("level");
@ -73,7 +74,17 @@ export class PlanRecordComponent implements OnInit {
count//一共多少条 count//一共多少条
tableDate tableDate
showPvt=false//全景图是否显示 showPvt=false//全景图是否显示
shenheTable=[]//选中要审核的对象
chuorzhong//判断初审还是终审
radioid//选中的id
showtype=0//0:word,1:全景图,2:二维三维,3:重点单位 showtype=0//0:word,1:全景图,2:二维三维,3:重点单位
compantData={name:'',buildingTypes:[],address:''}
organizationName
planData
id
companyId
fetchUrl
companyName
//获取表格数据 //获取表格数据
getAlltabledate(){ getAlltabledate(){
@ -120,34 +131,75 @@ export class PlanRecordComponent implements OnInit {
this.getAlltabledate() this.getAlltabledate()
} }
//表格点击事件 //表格点击事件
viewer//全景图对象
tableClick(e,item){ tableClick(e,item){
//e.target.parentElement.bgColor='#2196F3' //e.target.parentElement.bgColor='#2196F3'
let filename:string console.log(e,item)
let fetchUrl this.organizationName=''
this.id=item.id
this.fetchUrl=''
this.viewer={}
this.http.get(`/api/PlanComponents/${item.itemId}`).subscribe((data:any)=>{ this.http.get(`/api/PlanComponents/${item.itemId}`).subscribe((data:any)=>{
console.log(data)
this.companyId=data.companyId
this.companyName=data.companyName
if(data.planType!=2&&data.planType!=1){ if(data.planType!=2&&data.planType!=1){
fetchUrl=data.attachmentUrls[0] this.fetchUrl=data.attachmentUrls[0]
var index=fetchUrl.indexOf("\/") var index=this.fetchUrl.indexOf("\/")
if(fetchUrl.substr(0,index)=='psw'){ if(this.fetchUrl.substr(0,index)=='psw'){
this.showtype=1 this.showtype=1
window.setTimeout(()=>{ window.setTimeout(()=>{
const viewer = new Viewer({ this.viewer = new Viewer({
container: document.querySelector('#viewer'), container: document.querySelector('#viewer'),
panorama:'/api/Objects/PlanPlatform/'+ fetchUrl, panorama:'/api/Objects/PlanPlatform/'+ this.fetchUrl,
}); });
}) })
}else{ }else{
this.lookWord()
}
}else{
this.organizationName=item.organizationName
this.planData = data
this.handleData()
return
//this.src=`/planAudit/planpass?id=${data.companyId}&companyName=${data.companyName}&auditPlanId=${data.id}&auditStatus=${data.auditStatus}&planType=1`
//this.iframeSrc=this.sanitizer.bypassSecurityTrustResourceUrl(this.src);
//window.open(`/planAudit/planpass?id=${data.companyId}&companyName=${data.companyName}&auditPlanId=${data.id}&auditStatus=${data.auditStatus}&planType=1`)
}
})
if(e.checked){
this.shenheTable.push(item)
}
else{
for(var i=0;i<this.shenheTable.length;i++ ){
if(this.shenheTable[i].id==item.id){
this.shenheTable.splice(i,1)
}
}
}
this.radioid=item.itemId
/* this.chuorzhong=item.verifyState
this.radioid=item.itemId */
}
//毕升
lookWord(){
this.showtype=0 this.showtype=0
this.http.get(`/api/ObjectMetadata/PlanPlatform/${fetchUrl}`).subscribe((data:any)=>{ let filename:string
this.http.get(`/api/ObjectMetadata/PlanPlatform/${this.fetchUrl}`).subscribe((data:any)=>{
filename=data.fileName filename=data.fileName
let json={ let json={
doc: { doc: {
docId: item.id, docId: this.id,
title: filename, title: filename,
//title: filename, //title: filename,
fetchUrl: `http://${location.host}/api/Objects/PlanPlatform/`+fetchUrl fetchUrl: `http://${location.host}/api/Objects/PlanPlatform/`+this.fetchUrl
}, },
user: { user: {
uid: "test", uid: "test",
@ -166,14 +218,67 @@ export class PlanRecordComponent implements OnInit {
//window.open(`http://121.5.10.84/apps/editor/openPreview?data=${base64}`) //window.open(`http://121.5.10.84/apps/editor/openPreview?data=${base64}`)
}) })
} }
}else{
this.showtype=2
this.src=`/planAudit/planpass?id=${data.companyId}&companyName=${data.companyName}&auditPlanId=${data.id}&auditStatus=${data.auditStatus}&planType=1` //查看二维三维预案
this.iframeSrc=this.sanitizer.bypassSecurityTrustResourceUrl(this.src); thirdPartyURL
//window.open(`/planAudit/planpass?id=${data.companyId}&companyName=${data.companyName}&auditPlanId=${data.id}&auditStatus=${data.auditStatus}&planType=1`) planType
twoOrthree
handleData () {
this.compantData={name:'',buildingTypes:[],address:''}
this.planType = this.planData.planMode
let data = this.planData
console.log(data)
if(data.planType==1){
this.twoOrthree=2
}else if(data.planType==2){
this.twoOrthree=3
} }
if (this.planData.planMode==0) { //预案planMode=0时, 查看word
//this.lookWord()
} else if (this.planData.planMode==1) { //预案planMode=1时, 解析文档
} else if (this.planData.planMode==2) { //预案planMode=2时, 跳查看页面组件
this.showtype=2
this.http.get(`/api/Plans/${data.companyId}`).subscribe((data:any)=>{
data && data.company? this.compantData = data.company : null
}) })
sessionStorage.setItem("buildingTypeId", this.compantData.buildingTypes.length? this.compantData.buildingTypes[0].id: undefined);
sessionStorage.setItem("companyId",this.companyId);
sessionStorage.setItem("planId",this.id);
sessionStorage.setItem("editable",'0');
sessionStorage.setItem("planName",data.name)
let companyId = sessionStorage.getItem("companyId")
this.thirdPartyURL=this.sanitizer.bypassSecurityTrustResourceUrl(`/planAudit/planpass?id=${this.companyId}&companyName=${data.companyName}&auditPlanId=${data.id}&auditStatus=${data.auditStatus}&planType=1`);
//window.open(`/keyUnit/viewunitinfoplan?id=${companyId}`)
} else if (this.planData.planMode==3) { //预案planMode=3时, 第三方网址'
this.showtype=2
this.http.get(`/api/Plans/${data.companyId}`).subscribe((data:any)=>{
data && data.company? this.compantData = data.company : null
})
//this.dialog.open(show3D,{width:'1350px',height:'700px',data:{url:data.url}}); //打开图片弹窗
this.thirdPartyURL = this.sanitizer.bypassSecurityTrustResourceUrl(data.url)
}
} }
//打开三维预案弹窗
oopen3Dshow(){
this.dialog.open(recordshow3D,{width:'1650px',height:'850px',data:{url:this.thirdPartyURL,twoOrthree:this.twoOrthree}});
}
}
@Component({
selector: 'app-wait-examineer-show3D',
templateUrl: './show3D.html',
styleUrls: ['./plan-record.component.scss']
})
export class recordshow3D{
constructor(private sanitizer: DomSanitizer,public dialogRef: MatDialogRef<recordshow3D>,@Inject(MAT_DIALOG_DATA) public data,public dialog: MatDialog) {}
ngOnInit(): void {
console.log(this.data)
this.threedUrl=this.sanitizer.bypassSecurityTrustResourceUrl(this.data.url.changingThisBreaksApplicationSecurity)
}
threedUrl
} }

11
src/app/plan-audit/plan-record/show3D.html

@ -0,0 +1,11 @@
<!--
* @Descripttion:
* @version:
* @Author: sueRimn
* @Date: 2021-02-04 16:03:00
* @LastEditors: sueRimn
* @LastEditTime: 2021-02-05 09:41:49
-->
<div style="width:100%;height: 100%;">
<iframe style="width:100%;height: 100%;border: none;" [src]='threedUrl'></iframe>
</div>
Loading…
Cancel
Save