<template>
  <el-dialog
    title="sample结果详情"
    :visible.sync="innerVisible"
    width="520px"
  >
    <div class="dialog-body">
      <span class="label"><span class="required">*</span> sample 结果</span>
      <el-table :data="rows" border stripe size="small" style="margin-top: 8px">
        <el-table-column prop="index" label="序号" width="100" align="center" />
        <el-table-column prop="customerId" label="客户号" align="center" />
      </el-table>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="innerVisible = false">返 回</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'SampleDetailDialog',
  props: {
    visible: { type: Boolean, default: false },
    rows: { type: Array, default: () => [] }
  },
  computed: {
    innerVisible: {
      get() { return this.visible },
      set(v) { this.$emit('update:visible', v) }
    }
  }
}
</script>

<style scoped>
.dialog-body .label { font-weight: 600; color: #303133; }
.required { color: #F56C6C; margin-right: 4px; }
.dialog-footer { text-align: center; }
</style>
