gas-injection/src/views/vent/monitorManager/alarmMonitor/common/warnGradeInfo.vue

<template>
  <div class="warn-grade-info">
    <a-table :columns="columns" size="small" :data-source="tableData" :scroll="{ y: 500 }" class="tableW" :pagination="false" />
  </div>
</template>

<script setup lang="ts">
  import { ref, reactive, onMounted } from 'vue';

  let columns = ref<any[]>([
    {
      title: '序号',
      width: 60,
      align: 'center',
      customRender: ({ index }: { index: number }) => `${index + 1}`,
    },
    {
      title: '得分',
      dataIndex: 'df',
      key: 'df',
      align: 'center',
    },
    {
      title: '等级',
      dataIndex: 'grade',
      key: 'grade',
      align: 'center',
    },
  ]);
  let tableData = ref<any[]>([
    { df: '0<A<=1', grade: '低风险' },
    { df: '1<A<=2', grade: '一般风险' },
    { df: '2<A<=3', grade: '较大风险' },
    { df: '3<A<=4', grade: '重大风险' },
  ]);
</script>

<style lang="less" scoped>
  .warn-grade-info {
    position: relative;
    padding: 10px;
    box-sizing: border-box;
  }
</style>