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,
}
}
aaa = "山东小满园"
validateForm!: FormGroup;
ngOnInit(): void {
setTimeout(() => {
console.log(666,this.datas);
}, 0);
}
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() {
console.log(this.box);
// return
const htmlString = `
Document
`+ this.box.nativeElement.innerHTML + `
`
const fileData = asBlob(htmlString).then((data: any) => {
saveAs(data, 'file.docx') // 保存为docx文件
})
}
back() {
window.history.back()
}
}