nd_admin/src/view/import/visit/components/IUploadVisit.vue

<template>
  <div>
    <upload-excel-component :on-success="handleSuccess" :before-upload="beforeUpload" :range="1"/>
	<div style="width: 220px; margin: 20px auto; ">
		<el-button @click="onSubmit" type="primary" class="p10" style="width: 200px;padding: 10px 20px;"> 提交</el-button>
	</div>
	<span>必须列 【姓名,职务,行程概要,陪同情况,机关单位,来文日期,莅临时间,返程时间,拟办意见】 </span>
    <el-table :data="tableData.slice( page*size-size, page*size)" border highlight-current-row style="width: 100%;margin-top:20px;">
	  <el-table-column prop="username"   label="姓名"></el-table-column>
	  <el-table-column prop="post"     	label="职务"></el-table-column>
	  <el-table-column prop="tripSummary"     label="行程概要"></el-table-column>
	  <el-table-column prop="accompany"      label="陪同情况"></el-table-column>
	  <el-table-column prop="organUnit"  label="机关单位"></el-table-column>
	  <el-table-column prop="recvDate"    label="来文日期"></el-table-column>
	  <el-table-column prop="fromDate" 	label="莅临时间"></el-table-column>
	  <el-table-column prop="toDate" 	 label="返程时间"></el-table-column>
	  <el-table-column prop="proposed" 	label="拟办意见" ></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="primary"
	  	    size="small"
	  	    icon="el-icon-edit"
	  	    @click="deleteRow($index)"
	  	  >删除</el-button>  
	    </template>
	  </el-table-column>
    </el-table>
	<el-pagination :current-page="page" 
	:page-size="size" 
	:page-sizes="[10,20,  50, 100]" 
	:style="{ float: 'right', padding: '20px' }"
	 :total="tableData.length" 
	 @current-change="(page)=>{this.page= page}" 
	 @size-change="(size)=>{this.size= size}" 
	 layout="total, sizes, prev, pager, next, jumper">
	</el-pagination>
	
  </div>
</template>

<script>
import UploadExcelComponent from '@/components/UploadExcel/index.vue'
import { importVisitList } from "@/api/importVisit.js";
import {excelDate} from "@/utils/date.js"
export default {
  name: 'UploadExcel',
  components: { UploadExcelComponent },
  data() {
    return {
	  page:1,
	  size:10,
	  name:'',
      tableData: [],
      tableHeader: []
    }
  },
  methods: {
    beforeUpload(file) {
	  this.name = file.name;
      const isLt1M = file.size / 1024 / 1024 < 1
      if (isLt1M) {
        return true
      }
	  alert( "文件必须小于1M" )
      return false
    },
	onSubmit(){
		let that = this;
		for( let i in this.tableData){
			let item = this.tableData[i];
			let errmsg = that.checkData(item)
			if( errmsg ){
				alert( errmsg )
				return;
			}
		}
		if( this.tableData.length < 1){
			alert( "excel无内容" )
			return
		}
		let param = {}
		param.name = this.name
		param.list = this.tableData
		importVisitList( param ).then( res=>{
			if(res.code == 200){
				let logId = res.data.id;
				this.$router.push( {name:'import-visit-info', query:{logId}})
			}
		})	
	},
	checkData( data ){
		
		return false
	},
	deleteRow(index){
		this.tableData.splice(index,1);
	},
    handleSuccess({ results }) {
      this.tableData = results.filter( (item) =>{
		  return !!item["姓名"];
		  }
	  ).map( item=>{
		  // 姓名,职务,行程概要,陪同情况,机关单位,来文日期,莅临时间,返程时间,拟办意见
		return {
			username: 	(''+item["姓名"]||'').trim(),
			post: 	(''+item["职务"]||'').trim(),
			tripSummary: 		(''+item["行程概要"]||'').trim(),
			accompany: 		(''+item["陪同情况"]||'').trim(),
			organUnit: 		(''+item["机关单位"]||'').trim(),
			recvDate: 	excelDate(item["来文日期"]),
			fromDate: 	excelDate(item["莅临时间"]),
			toDate: 	excelDate(item["返程时间"]),
			proposed: (''+(item["拟办意见"]||'')).trim(),
			edit: false,
		}
	  })
	  this.page =1;
	  this.size = 10;
    }
  }
}
</script>
<style scoped=""></style>
<style>
	.message{ z-index: 1000 !important;}
</style>