import { AfterViewInit, Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core';
import { STColumn, STComponent } from '@delon/abc/st';
import { SFSchema } from '@delon/form';
import { ModalHelper, _HttpClient } from '@delon/theme';
import { SHARED_IMPORTS } from '@shared';
import { AgGridAngular } from 'ag-grid-angular'; // AG Grid Component
import { ColDef } from 'ag-grid-community'; // Column Definition Type Interface
import { DataVCardComponent } from '../card/card.component';
import { DataVTitleComponent } from '../title/title.component';
import { GridButtonValueRenderer } from './grid-button/grid-button';
import {
  GridApi,
} from 'ag-grid-community';
@Component({
  selector: 'app-data-v-workstation',
  standalone: true,
  imports: [AgGridAngular, DataVCardComponent, GridButtonValueRenderer, DataVTitleComponent, ...SHARED_IMPORTS],
  templateUrl: './workstation.component.html',
  styleUrls: ['./workstation.component.less']
})
export class DataVWorkstationComponent implements OnInit, AfterViewInit {
  private readonly http = inject(_HttpClient);
  private readonly modal = inject(ModalHelper);
  private readonly elementRef = inject(ElementRef);
  private gridApi!: GridApi;
  public defaultColDef: ColDef = {
    width: 130,
    editable: false,
  };
  dataSet: any;

  rowData = [
    {
      rwmc: "任务1", rwms: "任务描述1", kssj: "2024-1-1", jhwcsj: "2024-1-2", sfcq: '否', dqzt: "正常", dqjd: "节点1", sjwcsj: "2024-1-2",
      bjmc: "报警1", bjms: "报警描述1", bjsj: "2024-1-1", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务2", rwms: "任务描述2", kssj: "2024-1-2", jhwcsj: "2024-1-3", sfcq: '否', dqzt: "正常", dqjd: "节点2", sjwcsj: "2024-1-2",
      bjmc: "报警2", bjms: "报警描述2", bjsj: "2024-1-2", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务3", rwms: "任务描述3", kssj: "2024-1-3", jhwcsj: "2024-1-4", sfcq: '否', dqzt: "正常", dqjd: "节点3", sjwcsj: "2024-1-2",
      bjmc: "报警3", bjms: "报警描述3", bjsj: "2024-1-3", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务4", rwms: "任务描述4", kssj: "2024-1-4", jhwcsj: "2024-1-5", sfcq: '否', dqzt: "正常", dqjd: "节点4", sjwcsj: "2024-1-2",
      bjmc: "报警4", bjms: "报警描述4", bjsj: "2024-1-4", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务5", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务6", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务7", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务8", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务9", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务10", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务11", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
    {
      rwmc: "任务12", rwms: "任务描述5", kssj: "2024-1-5", jhwcsj: "2024-1-6", sfcq: '否', dqzt: "正常", dqjd: "节点5", sjwcsj: "2024-1-2",
      bjmc: "报警5", bjms: "报警描述5", bjsj: "2024-1-5", gzyy: "-", clff: "-", tzsj: "2024-1-2", zycd: "一般", tzmc: '系统提示',
      tznr: '账户登录', fj: "-", cz: "操作"
    },
  ];

  colDefs1: ColDef[] = [
    {
      headerName: '序号',
      cellRenderer: function (params: any) {
        return parseInt(params.node.id) + 1
      }, width: 100,
      unSortIcon: true, field: "xh",
    },
    { headerName: '任务名称', unSortIcon: true, field: "rwmc", },
    { headerName: '任务描述', unSortIcon: true, field: "rwms", },
    { headerName: '开始时间', unSortIcon: true, field: "kssj", },
    { headerName: '计划完成时间', unSortIcon: true, field: "jhwcsj", },
    { headerName: '超期', width: 80, field: "sfcq", },
    { headerName: '操作', autoHeight: true, width: 110, field: "cz", cellRenderer: GridButtonValueRenderer, },
  ];

  colDefs2: ColDef[] = [
    {
      headerName: '序号', cellRenderer: function (params: any) {
        return parseInt(params.node.id) + 1
      }, width: 100, unSortIcon: true, field: "xh",
    },
    { headerName: '任务名称', unSortIcon: true, field: "rwmc", },
    { headerName: '任务描述', unSortIcon: true, field: "rwms", },
    { headerName: '开始时间', unSortIcon: true, field: "kssj", },
    { headerName: '当前状态', field: "dqzt", },
    { headerName: '当前节点', field: "dqjd", },
    { headerName: '实际完成时间', field: "sjwcsj", },
    { headerName: '操作', autoHeight: true, width: 110, field: "cz", cellRenderer: GridButtonValueRenderer, },
  ];

  colDefs3: ColDef[] = [
    {
      headerName: '序号', cellRenderer: function (params: any) {
        return parseInt(params.node.id) + 1
      }, width: 100, unSortIcon: true, field: "xh",
    },
    { headerName: '报警名称', unSortIcon: true, field: "bjmc", },
    { headerName: '报警等级', unSortIcon: true, field: "bjdg", },
    { headerName: '报警描述', unSortIcon: true, field: "bjms", },
    { headerName: '报警时间', unSortIcon: true, field: "bjsj", },
    { headerName: '操作', autoHeight: true, width: 110, field: "cz", cellRenderer: GridButtonValueRenderer, },

    { headerName: '故障原因', field: "gzyy", },
    { headerName: '处理方法', field: "clff", },
    { headerName: '注意事项', field: "clff", },
  ];

  // Column Definitions: Defines the columns to be displayed.
  colDefs4: ColDef[] = [
    {
      headerName: '序号', cellRenderer: function (params: any) {
        return parseInt(params.node.id) + 1
      }, width: 100, unSortIcon: true, field: "xh",
    },
    { headerName: '通知时间', unSortIcon: true, field: "tzsj", },
    { headerName: '重要程度', unSortIcon: true, field: "zycd", },
    { headerName: '通知名称', unSortIcon: true, field: "tzmc", },
    { headerName: '通知内容', unSortIcon: true, field: "tznr", },
    { headerName: '附件', field: "fj", },
    { headerName: '操作', autoHeight: true, width: 110, field: "cz", cellRenderer: GridButtonValueRenderer, },
  ];

  ngOnInit(): void {
    console.log('ngOnInit');
    // this.gridApi.addEventListener("resize", (event: any) => {
    //   console.log("addEventListener");
    // });
    //this.gridApi.sizeColumnsToFit();
  }

  ngAfterViewInit(): void {
    // 获取 ag-grid 元素
    const gridDiv = this.elementRef.nativeElement.querySelector('.ag-theme-datav');
    // 获取 ag-grid 内部滚动容器元素
    const scrollContainer = gridDiv.querySelector('.ag-body-viewport');
    // 获取滚动条元素
    const scrollBar = gridDiv.querySelector('.ag-scroller');
  }

  add(): void {
    // this.modal
    //   .createStatic(FormEditComponent, { i: { id: 0 } })
    //   .subscribe(() => this.st.reload());
  }
  //页面尺寸改变
  onPaginationChanged($event: any) {
    console.log('onPaginationChanged{}');

  }
}
