Sinopec-Anxin/src/app/pages/today-warning/today-warning.component.ts

import { Component, OnInit, ViewContainerRef } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { HttpClient } from '@angular/common/http';
import { NzModalService } from 'ng-zorro-antd/modal';
import { GetOutOfLineDetailsComponent } from './get-out-of-line-details/get-out-of-line-details.component';
import { TreeService } from 'src/app/service/tree.service';
@Component({
  selector: 'app-today-warning',
  templateUrl: './today-warning.component.html',
  styleUrls: ['./today-warning.component.scss']
})
export class TodayWarningComponent implements OnInit {
  validateForm!: FormGroup;
  constructor(private http: HttpClient, private fb: FormBuilder, private toTree: TreeService, private modal: NzModalService, private viewContainerRef: ViewContainerRef) { }

  ngOnInit(): void {
    this.validateForm = this.fb.group({
      level: [null],
      type: [null],
      site: [null],
      datePicker: [null]
    });
    this.yujingType()
    //this.getAllOrganization()
  }

  //预警类型接口
  yujingTypes: any //预警接口数据
  yujingType() {
    this.http.get('/api/services/app/Violation/GetAllList').subscribe((data: any) => {
      this.yujingTypes = data.result
    }
    )
  }


  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 = [
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 2, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 3, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' },
    { level: 1, type: '加油区预警', content: '工作人员倚靠加油机或者立柱', site: '加油区2号摄像头', time: '2021-10-12  09:28:13' }
  ]






  showModal(): void {
    const modal = this.modal.create({
      nzContent: GetOutOfLineDetailsComponent,
      nzViewContainerRef: this.viewContainerRef,
      nzWidth: 1200,
      nzBodyStyle: {
        'border': '1px solid #6d9cc7',
        'border-radius': '0px',
        'padding': '0px',
        'box-shadow': '0 0 8px 0 #fff',
        'background': '#000D21',
      },
      nzComponentParams: {
        data: {
          type: 1
        }
      },
      nzFooter: null,
      nzOnOk: async () => {

      }
    });
    const instance = modal.getContentComponent();
  }

}