保存

src/app/routes/data-v/s1/s1.component.ts

@@ -20,7 +20,17 @@ import { NzListModule } from 'ng-zorro-antd/list';
   standalone: true,
   templateUrl: './s1.component.html',
   styleUrls: ['./s1.component.less'],
-  imports: [CommonModule, NzBadgeModule, NzProgressModule, AgGridAngular, DataVCardComponent, DataVTitleComponent, NzListModule, ...SHARED_IMPORTS, ChartComponentComponent]
+  imports: [
+    CommonModule,
+    NzBadgeModule,
+    NzProgressModule,
+    AgGridAngular,
+    DataVCardComponent,
+    DataVTitleComponent,
+    NzListModule,
+    ...SHARED_IMPORTS,
+    ChartComponentComponent
+  ]
 })
 export class DataVS1Component implements OnInit {
   private readonly http = inject(_HttpClient);
@@ -35,20 +45,46 @@ export class DataVS1Component implements OnInit {
       { label: '全硫', options: {}, checked: false },
       { label: '内水', options: {}, checked: false },
       { label: '灰分', options: {}, checked: false },
-      { label: '挥发分', options: {}, checked: false },
+      { label: '挥发分', options: {}, checked: false }
     ],
     //底部
-    optionBottomList: [{}]
+    optionBottomList: [{}],
+    //左边表格option
+    optionsList: [
+      { label: '全水', options: {}, checked: true },
+      { label: '热值', options: {}, checked: true }
+    ],
+    //左边table
+    tableList: [
+      {
+        coldef: [
+          { headerName: '时间', field: 'rwmc', unSortIcon: true, minWidth: undefined, flex: 1 },
+          { headerName: '系统/设备', field: 'rwms', unSortIcon: true, minWidth: undefined, flex: 1 },
+          { headerName: '操作描述', field: 'kssj', unSortIcon: true, minWidth: undefined, flex: 1 },
+          { headerName: '操作人员', field: 'jhwcsj', unSortIcon: true, minWidth: undefined, flex: 1 }
+        ],
+        rowData: []
+      },
+      {
+        coldef: [
+          { headerName: '序号', field: 'rwmc', unSortIcon: true, minWidth: undefined, flex: 1 },
+          { headerName: '时间', field: 'kssj', unSortIcon: true, minWidth: undefined, flex: 1 },
+          { headerName: '任务描述', field: 'rwms', unSortIcon: true, minWidth: undefined, flex: 1 },
+          { headerName: '等级', field: 'dqzt', unSortIcon: true, minWidth: undefined, flex: 1 }
+        ],
+        rowData: []
+      }
+    ]
   };
-  handleCheckedItems(checkedItems: { label: string, checked: boolean }[]) {
+  handleCheckedItems(checkedItems: { label: string; checked: boolean }[]) {
     console.log('当前选中的项目:', checkedItems);
   }
-  chart_options = {}
-  chart_options0 = {}
-  chart_options1 = {}
-  chart_options2 = {}
-  chart_options3 = {}
-  chart_options4 = {}
+  chart_options = {};
+  chart_options0 = {};
+  chart_options1 = {};
+  chart_options2 = {};
+  chart_options3 = {};
+  chart_options4 = {};
   rowData: object[] = [];
   colDefs1: ColDef[] = [
     { headerName: '时间', field: 'rwmc', flex: 1 },
@@ -75,9 +111,25 @@ export class DataVS1Component implements OnInit {
     this.getServerConfig();
     for (var i = 1; i < 30; i++) {
       this.rowData.push({
-        rwmc: '任务' + i, rwms: '任务描述' + i, kssj: '2024-1-' + i + ' 13:38:' + i * 11, jhwcsj: '2024-1-' + i + ' 13:38:' + i * 10, sfcq: '否',
-        dqzt: "正常", dqjd: "节点" + i, sjwcsj: '2024-1-' + i + ' 13:38:' + i * 27, bjmc: "报警5", bjms: "报警描述5", bjsj: '2024-1-' + i + ' 13:38:' + i * 12,
-        gzyy: "-", clff: "-", tzsj: '2024-1-' + i + ' 13:38:' + i * 19, zycd: "一般", tzmc: '系统提示', tznr: '账户登录', fj: "-", cz: "操作"
+        rwmc: '任务' + i,
+        rwms: '任务描述' + i,
+        kssj: '2024-1-' + i + ' 13:38:' + i * 11,
+        jhwcsj: '2024-1-' + i + ' 13:38:' + i * 10,
+        sfcq: '否',
+        dqzt: '正常',
+        dqjd: '节点' + i,
+        sjwcsj: '2024-1-' + i + ' 13:38:' + i * 27,
+        bjmc: '报警5',
+        bjms: '报警描述5',
+        bjsj: '2024-1-' + i + ' 13:38:' + i * 12,
+        gzyy: '-',
+        clff: '-',
+        tzsj: '2024-1-' + i + ' 13:38:' + i * 19,
+        zycd: '一般',
+        tzmc: '系统提示',
+        tznr: '账户登录',
+        fj: '-',
+        cz: '操作'
       });
     }
     var errorData = [];
@@ -87,11 +139,7 @@ export class DataVS1Component implements OnInit {
     for (var i = 0; i < dataCount; i++) {
       var val = Math.random() * 1000;
       categoryData.push('category' + i);
-      errorData.push([
-        i,
-        echarts.number.round(Math.max(0, val - Math.random() * 100)),
-        echarts.number.round(val + Math.random() * 80)
-      ]);
+      errorData.push([i, echarts.number.round(Math.max(0, val - Math.random() * 100)), echarts.number.round(val + Math.random() * 80)]);
       barData.push(echarts.number.round(val, 2));
     }
     this.chart_options = {
@@ -269,13 +317,13 @@ export class DataVS1Component implements OnInit {
     this.chart_options1 = {
       title: {
         textStyle: {
-          color: "#ffffff"
+          color: '#ffffff'
         },
         text: '全水',
-        subtext: '(kg/kg)',
+        subtext: '(kg/kg)'
       },
       legend: {
-        data: ['测量值', '上限值', '下限值',]
+        data: ['测量值', '上限值', '下限值']
       },
       calculable: true,
       xAxis: [
@@ -442,12 +490,11 @@ export class DataVS1Component implements OnInit {
           saveAsImage: { show: true }
         }
       },
-      calculable: true,
-
+      calculable: true
     };
     this.chart_options3 = {
       title: {
-        text: '煤样超差率',
+        text: '煤样超差率'
       },
 
       grid: {
@@ -464,22 +511,24 @@ export class DataVS1Component implements OnInit {
       yAxis: {
         type: 'value'
       },
-      series: [{
-        data: [3, 16],
-        label: {
-          show: true,
-          position: 'top',
-          formatter: function (data: { value: string; }) {
-            return data.value
-          }
-        },
-        type: 'bar'
-      }]
+      series: [
+        {
+          data: [3, 16],
+          label: {
+            show: true,
+            position: 'top',
+            formatter: function (data: { value: string }) {
+              return data.value;
+            }
+          },
+          type: 'bar'
+        }
+      ]
     };
     this.chart_options4 = {
       title: {
         text: '煤样合格率',
-        left: 'center',
+        left: 'center'
       },
       grid: {
         top: '10%',
@@ -495,19 +544,21 @@ export class DataVS1Component implements OnInit {
       yAxis: {
         type: 'value'
       },
-      series: [{
-        data: [15, 16],
-        type: 'bar',
-        label: {
-          show: true,
-          position: 'top',
-          formatter: function (data: { value: string; }) {
-            return data.value
+      series: [
+        {
+          data: [15, 16],
+          type: 'bar',
+          label: {
+            show: true,
+            position: 'top',
+            formatter: function (data: { value: string }) {
+              return data.value;
+            }
           }
-        },
-      }]
+        }
+      ]
     };
-    this.chartConfig.optionsCheckList[0].options = this.chart_options1;
+    //this.chartConfig.optionsCheckList[0].options = this.chart_options1;
     this.chartConfig.optionsCheckList[1].options = this.chart_options2;
     this.chartConfig.optionsCheckList[2].options = this.chart_options3;
     this.chartConfig.optionsCheckList[3].options = this.chart_options4;
@@ -520,17 +571,13 @@ export class DataVS1Component implements OnInit {
   ngOnDestroy(): void {
     this.subscription.unsubscribe();
   }
-
   /**
    * 服务器获取配置
    */
   getServerConfig() {
-    this.http
-      .get('s1/',)
-      .subscribe(res => {
-        this.chartConfig = res['data'];
-      });
-
+    this.http.get('http://localhost:5006/api/config/s1').subscribe(res => {
+      this.chartConfig.optionsCheckList[0].options = res['data'];
+      console.log(res);
+    });
   }
-
 }