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'; @Component({ selector: 'app-data-v-workstation', standalone: true, imports: [AgGridAngular, DataVCardComponent, 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); 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, { 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: "-" }, ]; colDefs1: ColDef[] = [ { headerName: '任务名称', field: "rwmc", flex: 1 }, { headerName: '任务描述', field: "rwms", flex: 2 }, { headerName: '开始时间', field: "kssj", flex: 1 }, { headerName: '计划完成时间', field: "jhwcsj", flex: 1.5 }, { headerName: '是否超期', field: "sfcq", flex: 1 }, ]; colDefs2: ColDef[] = [ { headerName: '任务名称', field: "rwmc", flex: 1 }, { headerName: '任务描述', field: "rwms", flex: 1 }, { headerName: '开始时间', field: "kssj", flex: 1 }, { headerName: '当前状态', field: "dqzt", flex: 1 }, { headerName: '当前节点', field: "dqjd", flex: 1 }, { headerName: '实际完成时间', field: "sjwcsj", flex: 1 }, ]; colDefs3: ColDef[] = [ { headerName: '报警名称', field: "bjmc", flex: 1 }, { headerName: '报警描述', field: "bjms", flex: 1 }, { headerName: '报警时间', field: "bjsj", flex: 1 }, { headerName: '故障原因', field: "gzyy", flex: 1.5 }, { headerName: '处理方法', field: "clff", flex: 1 }, ]; // Column Definitions: Defines the columns to be displayed. colDefs4: ColDef[] = [ { headerName: '通知时间', field: "tzsj", flex: 1 }, { headerName: '重要程度', field: "zycd", flex: 1 }, { headerName: '通知名称', field: "tzmc", flex: 1 }, { headerName: '通知内容', field: "tznr", flex: 1 }, { headerName: '附件', field: "fj", flex: 1 } ]; ngOnInit(): void { } 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()); } }