import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@Component({
  selector: 'app-criminal-records',
  templateUrl: './criminal-records.component.html',
  styleUrls: ['./criminal-records.component.scss']
})
export class CriminalRecordsComponent implements OnInit {
  validateForm!: FormGroup;
  constructor(private fb: FormBuilder) { }

  ngOnInit(): void {
    this.validateForm = this.fb.group({
      level: [null],
      type: [null],
      site: [null],
      datePicker: [null]
    });
  }
  submitForm(): void {
    for (const i in this.validateForm.controls) {
      this.validateForm.controls[i].markAsDirty();
      this.validateForm.controls[i].updateValueAndValidity();
    }

    console.log(this.validateForm)
  }
  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();
    }
  }


  list: any = [
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'},
    {id:'SDFFDCDC484C8DCCCDGG',level:'Ⅰ级',type:'工作人员倚靠加油机或立柱',name:'中化山东省淄博市第6加油站',site:'加油区2号摄像头',time:'2021-10-12  09:28:13'}
  ]
}