<template>
  <div class="data-table">
    <el-table :data="tableData" border>
      <el-table-column prop="name" label="数据项" width="180" />
      <el-table-column prop="arm1" label="扫描臂1">
        <template #default="scope">
          <el-tag v-if="scope.row.type === 'status'" :type="scope.row.arm1.type">
            {{ scope.row.arm1.value }}
          </el-tag>
          <span v-else>{{ scope.row.arm1 }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="arm2" label="扫描臂2">
        <template #default="scope">
          <el-tag v-if="scope.row.type === 'status'" :type="scope.row.arm2.type">
            {{ scope.row.arm2.value }}
          </el-tag>
          <span v-else>{{ scope.row.arm2 }}</span>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup>
defineProps({
  tableData: {
    type: Array,
    required: true
  }
})
</script>