mky-vent-base/src/views/vent/monitorManager/alarmMonitor/common/warnTargetFire.vue

<template>
    <div class="warnTargetFire">
        <a-table :columns="columns" :data-source="tableData" bordered :pagination="false" :scroll="{ y: 720 }">
            <template #bodyCell="{ column, text }">
                <template v-if="column.dataIndex === 'name'">
                    <a href="javascript:;">{{ text }}</a>
                </template>
            </template>
        </a-table>
    </div>
</template>

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

let tableData = ref<any[]>([
    {
        key: '1',
        one: '回风测氧化带CO浓度',
        two: '一级预警',
        three: 'CO>60ppm',
    },
    {
        key: '2',
        one: '回风测氧化带CO浓度',
        two: '二级预警',
        three: '240ppm>CO>60ppm',

    },
    {
        key: '3',
        one: '回风测氧化带CO浓度',
        two: '三级预警',
        three: 'CO>240ppm',
    },
    {
        key: '4',
        one: '回风测氧化带CO浓度',
        two: '四级预警',
        three: 'CO>1000ppm',
    },
    {
        key: '5',
        one: '回风测氧化带氧温度',
        two: '一级预警',
        three: '温度>40℃',
    },
    {
        key: '6',
        one: '回风测氧化带氧温度',
        two: '二级预警',
        three: '70℃<温度<40℃',
    },
    {
        key: '7',
        one: '回风测氧化带氧温度',
        two: '三级预警',
        three: '70℃<温度<210℃',
    },
    {
        key: '8',
        one: '回风测氧化带氧温度',
        two: '四级预警',
        three: '温度>210℃',
    },
    {
        key: '9',
        one: '回风隅角CO浓度',
        two: '一级预警',
        three: 'CO>24ppm',
    },
    {
        key: '10',
        one: '回风隅角CO浓度',
        two: '二级预警',
        three: 'CO>100ppm',
    },
    {
        key: '11',
        one: '回风隅角CO浓度',
        two: '三级预警',
        three: 'CO>160ppm',
    },
    {
        key: '12',
        one: '回风隅角CO浓度',
        two: '四级预警',
        three: 'CO>200ppm',
    },
    {
        key: '13',
        one: '回风隅角气体温度',
        two: '一级预警',
        three: '温度>33℃',
    },
    {
        key: '14',
        one: '回风隅角气体温度',
        two: '二级预警',
        three: '温度>40℃',
    },
    {
        key: '15',
        one: '回风隅角气体温度',
        two: '三级预警',
        three: '温度>50℃',
    },
    {
        key: '16',
        one: '回风隅角气体温度',
        two: '四级预警',
        three: '温度>60℃',
    },
    {
        key: '17',
        one: '回风流CO浓度',
        two: '一级预警',
        three: 'CO>12ppm',
    },
    {
        key: '18',
        one: '回风流CO浓度',
        two: '二级预警',
        three: 'CO>24ppm',
    },
    {
        key: '19',
        one: '回风流CO浓度',
        two: '三级预警',
        three: 'CO>40ppm',
    },
    {
        key: '20',
        one: '回风流CO浓度',
        two: '四级预警',
        three: 'CO>70ppm',
    },
    {
        key: '21',
        one: '回风流巷道气体温度',
        two: '一级预警',
        three: '温度>30℃',
    },
    {
        key: '22',
        one: '回风流巷道气体温度',
        two: '二级预警',
        three: '温度>35℃',
    },
    {
        key: '23',
        one: '回风流巷道气体温度',
        two: '三级预警',
        three: '温度>45℃',
    },
    {
        key: '24',
        one: '回风流巷道气体温度',
        two: '四级预警',
        three: '温度>70℃',
    },
    {
        key: '25',
        one: '回风测氧化带C2H4浓度',
        two: '三级预警',
        three: 'C2H4>0pmm',
    },
    {
        key: '26',
        one: '回风测氧化带C2H2浓度',
        two: '四级预警',
        three: 'C2H2>0pmm',
    },
    {
        key: '27',
        one: '回风测氧化带100*CO/O2',
        two: '一级预警',
        three: '0.2~0.5',
    },
    {
        key: '28',
        one: '回风测氧化带100*CO/O2',
        two: '二级预警',
        three: '>0.5',
    },
    {
        key: '29',
        one: '回风测氧化带100*CO/O2',
        two: '三级预警',
        three: '无限大，出现C2H4',
    },
    {
        key: '30',
        one: '回风测氧化带100*CO/O2',
        two: '四级预警',
        three: '无限大，出现C2H2',
    },
    {
        key: '31',
        one: '回风测氧化带O2浓度',
        two: '一级预警',
        three: '7%>CO>5%',
    },
    {
        key: '32',
        one: '回风测氧化带O2浓度',
        two: '二级预警',
        three: '10%>CO>7%',
    },
    {
        key: '33',
        one: '回风测氧化带O2浓度',
        two: '三级预警',
        three: '18%>CO>12%',
    },
    {
        key: '34',
        one: '回风测氧化带O2浓度',
        two: '四级预警',
        three: 'CO>18%',
    },
    {
        key: '35',
        one: '月推进度',
        two: '一级预警',
        three: 'LS<0.95LX',
    },
    {
        key: '36',
        one: '月推进度',
        two: '二级预警',
        three: 'LS<0.9LX',
    },
    {
        key: '37',
        one: '月推进度',
        two: '三级预警',
        three: 'LS<0.85LX',
    },
    {
        key: '38',
        one: '月推进度',
        two: '四级预警',
        three: 'LS<0.8LX',
    },
    {
        key: '39',
        one: '皮带最高火灾温度',
        two: '一级预警',
        three: '3.5Rp>Rs>1.5Rp',
    },
    {
        key: '40',
        one: '皮带最高火灾温度',
        two: '二级预警',
        three: '6Rp>Rs>3.5Rp',
    },
    {
        key: '41',
        one: '皮带最高火灾温度',
        two: '三级预警',
        three: 'Rs>Rr>6Rp',
    },
    {
        key: '42',
        one: '皮带最高火灾温度',
        two: '四级预警',
        three: 'Rs>Rs',
    },
    {
        key: '43',
        one: '电缆火灾最高温度',
        two: '一级预警',
        three: '有烟雾',
    },
    {
        key: '44',
        one: '电缆火灾最高温度',
        two: '二级预警',
        three: 'Rs>1.5Rp',
    },
    {
        key: '45',
        one: '电缆火灾最高温度',
        two: '三级预警',
        three: 'Rs>Rr>6Rp',
    },
    {
        key: '46',
        one: '电缆火灾最高温度',
        two: '四级预警',
        three: 'Rs>3.5Rp',
    },

])

let columns = reactive([
    {
        title: '序号',
        width: 60,
        align: 'center',
        customRender: ({ index }: { index: number }) =>{
          if(index>=0 && index<=3){
            return 1
          }else if(index>=4 && index<=7){
            return 2
          }else if(index>=8 && index<=11){
            return 3
          }else if(index>=12 && index<=15){
            return 4
          }else if(index>=16 && index<=19){
            return 5
          }else if(index>=20 && index<=23){
            return 6
          }else if(index==24){
            return 7
          }else if(index==25){
            return 8
          }else if(index>=26 && index<=29){
            return 9
          }else if(index>=30 && index<=33){
            return 10
          }else if(index>=34 && index<=37){
            return 11
          }else if(index>=38 && index<=41){
            return 12
          }else if(index>=42 && index<=45){
            return 13
          }
        },
        customCell: (_, index) => {
            if (index == 0) {
                return { rowSpan: 4 };
            } else if (index > 0 && index <= 3) {
                return { rowSpan: 0 };
            }
            if (index == 4) {
                return { rowSpan: 4 };
            } else if (index > 4 && index <= 7) {
                return { rowSpan: 0 };
            }
            if (index == 8) {
                return { rowSpan: 4 };
            } else if (index > 8 && index <= 11) {
                return { rowSpan: 0 };
            }
            if (index == 12) {
                return { rowSpan: 4 };
            } else if (index > 12 && index <= 15) {
                return { rowSpan: 0 };
            }
            if (index == 16) {
                return { rowSpan: 4 };
            } else if (index > 16 && index <= 19) {
                return { rowSpan: 0 };
            }
            if (index == 20) {
                return { rowSpan: 4 };
            } else if (index > 20 && index <= 23) {
                return { rowSpan: 0 };
            }
            if (index == 26) {
                return { rowSpan: 4 };
            } else if (index > 26 && index <= 29) {
                return { rowSpan: 0 };
            }
            if (index == 30) {
                return { rowSpan: 4 };
            } else if (index > 30 && index <= 33) {
                return { rowSpan: 0 };
            }
            if (index == 34) {
                return { rowSpan: 4 };
            } else if (index > 34 && index <= 37) {
                return { rowSpan: 0 };
            }
            if (index == 38) {
                return { rowSpan: 4 };
            } else if (index > 38 && index <= 41) {
                return { rowSpan: 0 };
            }
            if (index == 42) {
                return { rowSpan: 4 };
            } else if (index > 42 && index <= 45) {
                return { rowSpan: 0 };
            }
        },
    },
    {
        title: '指标',
        dataIndex: 'one',
        align: 'center',
        customCell: (_, index) => {
            if (index == 0) {
                return { rowSpan: 4 };
            } else if (index > 0 && index <= 3) {
                return { rowSpan: 0 };
            }
            if (index == 4) {
                return { rowSpan: 4 };
            } else if (index > 4 && index <= 7) {
                return { rowSpan: 0 };
            }
            if (index == 8) {
                return { rowSpan: 4 };
            } else if (index > 8 && index <= 11) {
                return { rowSpan: 0 };
            }
            if (index == 12) {
                return { rowSpan: 4 };
            } else if (index > 12 && index <= 15) {
                return { rowSpan: 0 };
            }
            if (index == 16) {
                return { rowSpan: 4 };
            } else if (index > 16 && index <= 19) {
                return { rowSpan: 0 };
            }
            if (index == 20) {
                return { rowSpan: 4 };
            } else if (index > 20 && index <= 23) {
                return { rowSpan: 0 };
            }
            if (index == 26) {
                return { rowSpan: 4 };
            } else if (index > 26 && index <= 29) {
                return { rowSpan: 0 };
            }
            if (index == 30) {
                return { rowSpan: 4 };
            } else if (index > 30 && index <= 33) {
                return { rowSpan: 0 };
            }
            if (index == 34) {
                return { rowSpan: 4 };
            } else if (index > 34 && index <= 37) {
                return { rowSpan: 0 };
            }
            if (index == 38) {
                return { rowSpan: 4 };
            } else if (index > 38 && index <= 41) {
                return { rowSpan: 0 };
            }
            if (index == 42) {
                return { rowSpan: 4 };
            } else if (index > 42 && index <= 45) {
                return { rowSpan: 0 };
            }
        },
    },
    {
        title: '预警级别',
        dataIndex: 'two',
        align: 'center',
    },
    {
        title: '阈值',
        align: 'center',
        dataIndex: 'three',

    },
])

</script>

<style lang="less" scoped>
.warnTargetFire {
    width: 100%;
    height: 100%;
    padding: 20px;
    box-sizing: border-box;
}
</style>