import { Component, Input, Renderer2, OnDestroy, AfterViewInit, ElementRef, OnInit, ViewChild } from '@angular/core'; import { CustomReuseStrategy } from 'src/app/CustomReuseStrategy'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { NzMessageService } from 'ng-zorro-antd/message'; import { Router } from '@angular/router'; import { TreeService } from 'src/app/service/tree.service'; import { HttpClient } from '@angular/common/http'; import { asBlob } from 'html-docx-js-typescript' // 要保存这个docx文件推荐引入file-saver哦,你可以用npm i -D file-saver来安装 import { saveAs } from 'file-saver' @Component({ selector: 'app-unit-details', templateUrl: './unit-details.component.html', styleUrls: ['./unit-details.component.scss'] }) export class UnitDetailsComponent implements OnInit { @ViewChild('box') box: ElementRef; constructor(private message:NzMessageService, private router: Router, private toTree: TreeService, private fb: FormBuilder, private http: HttpClient, private renderer: Renderer2, private el: ElementRef) { } datas = { basicInfo: { name: "", addr: "", phone: "", total: "", height: "", layer: "", structure: "", coveredArea: "", builtUpArea: "", nature: "", east: "", south: "", west: "", north: "", routeAndTime: "", }, facilities: { controlPosition: "", poolNumbe: "", poolPosition: "", poolCapacity: "", supplyMode: "", waterSources: "", waterSourcesPosition: "", system:{ alarm: false, spray: false, broadcast: false, smoke: false, }, hydrantsNumber: "", hydrantsPosition: "", pumpNumber: "", pumpRange: "", pumpFlow: "", pumpAdapter: "", SprayPumpNumber: "", SprayPumpRange: "", SprayPumpFlow: "", SprayPumpAdapter: "", elevator: "", stairs: "", Export: "", indoorHydrant: "", standardIndoorHydrant: "" }, KeyParts: [ { keyparts: "", keypartsposition: "", buildingstructure: "", useNature: "", danger: "" }, { keyparts: "", keypartsposition: "", buildingstructure: "", useNature: "", danger: "" } ], tips: "" } aaa = true list = {} validateForm!: FormGroup; zhidui = [] dadui = [] jiuyuanzhan = [] id = "" item = false integrity = 0 ngOnInit(): void { this.item = true this.id = this.router['browserUrlTree'].queryParams.id this.validateForm = this.fb.group({ directorName: [null], organizationId: [null, [Validators.required]], relatedOrganizationId: [null], buildingTypeId: [null] }); console.log(this.validateForm); this.getAllOrganization() this.getCompanies() this.getBuildingTypes() } listOfData: any[] = []; listOfData2: any[] = []; exportClick() { let alarm = "" let spray = "" let broadcast = "" let smoke = "" if (this.datas.facilities.system.alarm) { alarm = "有" } else { alarm = "无" } if (this.datas.facilities.system.spray) { spray = "有" } else { spray = "无" } if (this.datas.facilities.system.broadcast) { broadcast = "有" } else { broadcast = "无" } if (this.datas.facilities.system.smoke) { smoke = "有" } else { smoke = "无" } let box = `

`+ this.datas.basicInfo.name + `基本情况

单位基本情况

单位名称

`+ this.datas.basicInfo.name + `

单位地址

`+ this.datas.basicInfo.addr + `

联系电话

`+ this.datas.basicInfo.phone + `

人员总数

`+ this.datas.basicInfo.total + `

建筑高度

`+ this.datas.basicInfo.height + `

层数

`+ this.datas.basicInfo.layer + `

建筑结构

`+ this.datas.basicInfo.structure + `

占地面积

`+ this.datas.basicInfo.coveredArea + `

总建筑面积

`+ this.datas.basicInfo.builtUpArea + `

主要使用性质

`+ this.datas.basicInfo.nature + `

毗邻建筑

东:`+ this.datas.basicInfo.east + `

南:`+ this.datas.basicInfo.south + `

西:`+ this.datas.basicInfo.west + `

北:`+ this.datas.basicInfo.north + `

辖区中队行驶路线及时间

`+ this.datas.basicInfo.routeAndTime + `

单位内部主要消防设施

消防控制室

位置

`+ this.datas.facilities.controlPosition + `

消防水源

消防水池数量

`+ this.datas.facilities.poolNumbe + `

位置

`+ this.datas.facilities.poolPosition + `

总容量

`+ this.datas.facilities.poolCapacity + `

补给方式

室外其他水源

`+ this.datas.facilities.waterSources + `

位置

`+ this.datas.facilities.waterSourcesPosition + `

自动报警系统

`+ alarm + `

自动喷水系统

`+ spray + `

应急广播系统

`+ broadcast + `

防排烟系统

`+ smoke + `

室外消火栓数量

`+ this.datas.facilities.hydrantsNumber + `

室外消火栓位置分布

`+ this.datas.facilities.hydrantsPosition + `

消防泵

消火栓泵

数量:`+ this.datas.facilities.pumpNumber + `

扬程:`+ this.datas.facilities.pumpRange + `m

流量`+ this.datas.facilities.pumpFlow + `L/S

水泵接合器

数量:

`+ this.datas.facilities.pumpAdapter + `

喷淋泵

数量:`+ this.datas.facilities.SprayPumpNumber + `

扬程:`+ this.datas.facilities.SprayPumpRange + `m

流量:`+ this.datas.facilities.SprayPumpFlow + `L/S

水泵接合器

数量:

`+ this.datas.facilities.SprayPumpAdapter + `

消防电梯

数量及位置

`+ this.datas.facilities.elevator + `

疏散楼梯

数量及位置

`+ this.datas.facilities.stairs + `

安全出口

数量及位置

`+ this.datas.facilities.Export + `

室内消火栓数量

`+ this.datas.facilities.indoorHydrant + `

标准层室内消火栓数量及位置

`+ this.datas.facilities.standardIndoorHydrant + `

重点部位情况(一)

重点部位名称

物质存储仓库

重点部位所在位置

厂区东侧厂房

建筑结构

钢结构

使用性质

存储漆类,油类

主要危险性

油类,漆类易燃,有毒

重点部位情况(二)

重点部位名称

淬火油池

重点部位所在位置

厂区中部

建筑结构

钢结构

使用性质

淬火

主要危险性

高温

重点

提示

`+ this.datas.tips + `

 

` const htmlString = ` Document `+ box + ` ` const fileData = asBlob(htmlString).then((data: any) => { saveAs(data, 'file.docx') // 保存为docx文件 }) } back() { window.history.back() } edit() { let num = 0 let num2 = 0 let num3 = 0 console.log(this.validateForm.value); for (const key in this.validateForm.value) { if (Object.prototype.hasOwnProperty.call(this.validateForm.value, key)) { const element = this.validateForm.value[key]; if (element) { num3 += 1 } } } for (const key in this.datas) { if (Object.prototype.hasOwnProperty.call(this.datas, key)) { const element = this.datas[key]; for (const key in element) { if (Object.prototype.hasOwnProperty.call(element, key)) { const element2 = element[key]; if (element2) { // console.log(element2); num += 1 } } } } } for (const key in this.datas.KeyParts) { if (Object.prototype.hasOwnProperty.call(this.datas.KeyParts, key)) { const element = this.datas.KeyParts[key] for (const key in element) { if (Object.prototype.hasOwnProperty.call(element, key)) { const element2 = element[key] // console.log(element2); if (element2) { num2 += 1 } } } } } let num4=(num+num2+num3+1)/56 this.integrity = Math.floor(num4*100)/100 let body = { id: this.id, companyName: this.datas.basicInfo.name, directorName: this.validateForm.value.directorName, directorPhone: this.datas.basicInfo.phone, address: this.datas.basicInfo.addr, organizationId: this.validateForm.value.organizationId, relatedOrganizationId: this.validateForm.value.relatedOrganizationId, useNature: this.datas.basicInfo.nature, buildingTypeId: this.validateForm.value.buildingTypeId, integrity: this.integrity, data:JSON.stringify(this.datas) } this.http.patch('/api/Companies/' + this.id, body).subscribe(data => { console.log(data); this.message.create('success', '保存成功!'); this.getCompanies() }) } BuildingTypes getBuildingTypes() { this.http.get('/api/BuildingTypes').subscribe((data: any) => { console.log(data); this.BuildingTypes = data }) } getCompanies() { this.http.get('/api/Companies/' + this.id).subscribe((data: any) => { console.log(data); if(data.data){ this.datas=JSON.parse(data.data) } this.datas.basicInfo.name = data.companyName this.datas.basicInfo.addr = data.address this.datas.basicInfo.phone = data.directorPhone this.datas.basicInfo.nature = data.useNature this.integrity = data.integrity this.validateForm.patchValue({ directorName: data.directorName, organizationId: data.organizationId, relatedOrganizationId: data.relatedOrganizationId, buildingTypeId: data.buildingTypeId }) }) } nodes: any = [] getAllOrganization() { let organizationId = JSON.parse(sessionStorage.getItem('userData')).organizationId let params = { OrganizationId: organizationId || '', ContainsChildren: "true", PageNumber: 1, PageSize: 9999 } this.http.get('/api/Organizations', { params: params }).subscribe((data: any) => { data.items.forEach(element => { if (element.id == organizationId) { element.parentId = null } element.key = element.id element.title = element.name }); this.nodes = [...this.toTree.toTree(data.items)] }) } }