<template>
  <div class="alarm-code">
    <div class="alarm-item-box">
        <div class="radio-box">
            <el-radio-group v-model="radioValue" @change="radioChange">
                <el-radio-button label="fixed">固定条目</el-radio-button>
                <el-radio-button label="customed">自定义条目</el-radio-button>                
            </el-radio-group>
        </div>
        <div class="table-box">
            <el-table
            ref="multipleTable"
            :loading="loading"
            :data="data"
            tooltip-effect="dark"
            style="width: 100%"
            border
            @selection-change="handleSelectionChange">                
                <el-table-column
                prop="code"
                align="center"
                label="报警条目编码"
                width="130">                
                </el-table-column>
                <el-table-column
                header-align="center"
                prop="name"
                label="报警条目名称">
                </el-table-column>
                <el-table-column
                type="selection"
                >
                </el-table-column>
            </el-table>
        </div>
    </div>   
  </div>
</template>

<script>
export default {
  components: {

  },

  mixins: [],

  props: {

  },

  data () {
    return {
      data:[
        {name:'集水坑超高液位报警',code:2003},
        {name:'集水坑超低液位污水泵未停止报警',code:2004},
        {name:'冷冻水泵电源电压过高',code:1024},
        {name:'新风机组测试报警',code:100001},
        {name:'潜污泵断电报警',code:2001},
        {name:'集水坑超高液位潜污泵未启动报警',code:2002},
      ],
       radioValue: 'fixed', //默认固定
    }
  },

  computed: {

  },

  mounted() {

  },

  methods: {
     // radio改变事件
        radioChange(val) {
            this.multipleSelection = [];
            this.alarmItemArr = [];
            this.getAlarmItem();
        },
         handleSelectionChange(val,index) {
            this.multipleSelection = val;
        },
  },

}
</script>

<style scoped lang="less" >
.alarm-code{
  .radio-box{
      text-align: center;
  }
  .table-box{
      height: 500px;
      overflow-y: auto;
      margin-top: 10px;
  }
}
</style>
