<template>
  <el-table :data="listData" v-loading="loading" border style="margin-top:10px" max-height="450" @selection-change="handleSelectionChange">
    <el-table-column type="selection" width="55" align="center" v-if="selection"/>
    <el-table-column label="对象类型" width="200">
      <template #default="scope">
        {{biz_type.find(p=>p.value == scope.row.bizObj.objType).label}}
      </template>
    </el-table-column>
    <el-table-column label="业务对象">
      <template #default="scope">
        {{scope.row.bizObj.objName}}
      </template>
    </el-table-column>
    <el-table-column label="对象地址" width="200">
      <template #default="scope">
        {{scope.row.bizObj.objAddr}}:{{scope.row.bizObj.objPort}}
      </template>
    </el-table-column>
    <el-table-column label="操作" width="100" align="center">
      <template #default="scope">
        <slot name="action" :row="scope.row"/>
      </template>
    </el-table-column>
  </el-table>
</template>
<script setup lang="ts">
const {proxy} = getCurrentInstance()
const {biz_type} = proxy.useDict('biz_type');
const props = defineProps(['listData', 'loading','selection'])

// 多选框选中数据
function handleSelectionChange(selection) {
  let ids = selection.map(item => item.bizObj.objId);
  proxy.$emit('selectObj',ids)
}

</script>
<style scoped lang="scss">
</style>
