import { Component, Renderer2, OnDestroy, AfterViewInit, ElementRef, OnInit, ViewChild } from '@angular/core'; import { CustomReuseStrategy } from 'src/app/CustomReuseStrategy'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; 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 fb: FormBuilder, private renderer: Renderer2, private el: ElementRef) { this.validateForm = this.fb.group({ userName: [''], email: [''], password: [''], confirm: [''], comment: [''] }); } 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:"", alarm:false, spray:false, broadcast:false, smoke:false, hydrantsNumber:"", hydrantsPosition:"", pumpNumber:"", pumpRange:"", pumpFlow:"", pumpAdapter:"", SprayPumpNumber:"", SprayPumpRange:"", SprayPumpFlow:"", SprayPumpAdapter:"", elevator:"", stairs:"", Export:"", indoorHydrant:"", standardIndoorHydrant:"" }, tips:"" } aaa = true validateForm!: FormGroup; ngOnInit(): void { console.log(666,this.datas); } submitForm(value: { userName: string; email: string; password: string; confirm: string; comment: string }): void { for (const key in this.validateForm.controls) { this.validateForm.controls[key].markAsDirty(); this.validateForm.controls[key].updateValueAndValidity(); } console.log(value); } resetForm(e: MouseEvent): void { e.preventDefault(); this.validateForm.reset(); for (const key in this.validateForm.controls) { this.validateForm.controls[key].markAsPristine(); this.validateForm.controls[key].updateValueAndValidity(); } } validateConfirmPassword(): void { setTimeout(() => this.validateForm.controls.confirm.updateValueAndValidity()); } exportClick() { let alarm="" let spray="" let broadcast="" let smoke="" if(this.datas.facilities.alarm){ alarm="有" }else{ alarm="无" } if(this.datas.facilities.spray){ spray="有" }else{ spray="无" } if(this.datas.facilities.broadcast){ broadcast="有" }else{ broadcast="无" } if(this.datas.facilities.smoke){ smoke="有" }else{ smoke="无" } let box=`
单位基本情况 |
单位名称 |
`+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 = `