<template>
  <div>
    <el-table :data="datalist"  border stripe>
	   
      <el-table-column label="ID" width="70" prop="answerId">
      </el-table-column>
	  <el-table-column label="题型" width="70" prop="type">
		<template slot-scope="{row}">
		    <span>{{typeOption[row.type]}}</span>
		 </template>
	  </el-table-column>
	  
      <el-table-column label="题目"  prop="name">
        <template slot-scope="{row}">  
          <span>{{row.title}}</span>
        </template>
      </el-table-column>
      
      <el-table-column
        align="center"
        width="160px"
        label="操作"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="{row, $index}">
            <el-button 
              type="success"
              size="small"
              icon="el-icon-circle-check"
              @click="deleteRow(row, $index)"
            >移除题库</el-button>
          </template>
      </el-table-column>
    </el-table>

  </div>
</template>

<script>
export default {
  name: "Api",
  data() {
    return {
	  list:[],
      typeOption: { 1: "单选", 2: "多选", 3: "判断" },
    };
  },
  props: {
    datalist: {
      type: Array,
      default: () =>[]
    },
  },
  methods: {
    deleteRow(row, index) {
	  row.index = index
      this.$emit("deleteRow", row);
    },
  }
};
</script>
<style scoped lang="scss">
.el-tag--mini {
  margin-left: 5px;
}
.warning {
  color: #dc143c;
}
</style>
