<template>
  <div class="app-container">
    <upload-excel-component :on-success="handleSuccess" :before-upload="beforeUpload" />
	<div class="p20 tc">
		<el-button @click="onSubmit" type="primary">确认提交</el-button>
	</div>
	
    <el-table :data="tableData" border highlight-current-row 
	style="width: 100%;margin-top:20px;">
      <el-table-column v-for="item of tableHeader" :key="item" :prop="item" :label="item" />
    </el-table>
  </div>
</template>

<script>
import UploadExcelComponent from '@/components/UploadExcel/index.vue'

export default {
  name: 'UploadExcel',
  components: { UploadExcelComponent },
  data() {
    return {
      tableData: [],
      tableHeader: []
    }
  },
  methods: {
    beforeUpload(file) {
      const isLt1M = file.size / 1024 / 1024 < 1
      if (isLt1M) {
        return true
      }

      this.$message({
        message: 'Please do not upload files larger than 1m in size.',
        type: 'warning'
      })
      return false
    },
	onSubmit(){
		let list = []
		this.tableData.forEach( v=>{
			let item = Object.assign( {}, v)
			item.answerId = +v.answer_id;
			item.type = +v.type;
			item.answer1 = ''+v.answer1;
			item.answer2 = ''+v.answer2;
			item.answer3 = ''+v.answer3;
			item.answer4 = ''+v.answer4;
			item.answer5 = ''+v.answer5;
			
			delete item["answer_id"];
			if( item.answerId ){
				list.push( item )
			}
		})
		if( list.length <1){
			this.$message.errorMsg("无内容", 2)
			return 
		}
		this.$emit("submit", list )
	},
    handleSuccess({ results, header }) {
      this.tableData = results
      this.tableHeader = header
    }
  }
}
</script>
