<template>
	<div class="app-container"> 
		<el-form :model="queryParams" ref="queryForm" size="small" :inline="true"
			label-width="90px">
			<el-form-item label="期次" prop="qi">
				<el-cascader v-model="queryParams.qi" placeholder="请选择期次" :props="prop" :options="options" @change="handleChange">
					<template slot-scope="{ node, data }">
					    <span v-if="data.children != null">{{ data.year+'年' }}</span>
					    <span v-else> {{ '第 '+data.year+' 期' }} </span>
					</template>
				</el-cascader>
			</el-form-item>
			<el-form-item label="姓名" prop="UserName" >
				<el-input v-model="queryParams.UserName" placeholder="请输入姓名" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="身份证号" prop="UserCord" >
				<el-input v-model="queryParams.UserCord" placeholder="请输入身份证号" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			
			<el-form-item>
				<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
				<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
			</el-form-item>
		</el-form>
		<el-row class="m-b-10">
			<el-col :span="1.5">
				<el-button icon="el-icon-download" type="warning" size="mini" @click="handleExport">导出</el-button>
			</el-col>
		</el-row>
		<el-table :data="tableData"  style="width: 100%" v-loading="loading">
			<!-- <el-table-column type="selection" width="55"  align="center" ></el-table-column> -->
			<el-table-column type="index" label="序号" align="center" :index="indexMethod"></el-table-column>
			<el-table-column label="期次" align="center">
				<template slot-scope="scope">
					{{scope.row.qiciYear+"第"+scope.row.qiCi+"期"}}
				</template>
			</el-table-column> 
			<el-table-column prop="UserName" label="姓名" align="center" >
			</el-table-column>
			<el-table-column prop="UserSex" label="性别" align="center"></el-table-column>
			<el-table-column prop="UserCord" label="身份证号" width="200" align="center" >
			</el-table-column>
			<el-table-column prop="sex" label="培训类别" align="center">
				<template slot-scope="scope">
					{{scope.row.zhuanYeType === ""?scope.row.zcsZhuanYe:scope.row.zcsZhuanYe+"（"+scope.row.zhuanYeType+"）"}}
				</template>
			</el-table-column>
			<el-table-column prop="Undef1" label="证书编号" align="center"></el-table-column>
			<el-table-column prop="AddDate" label="报名时间"  align="center"></el-table-column>
			<el-table-column prop="EndTime" label="考试通过时间"  align="center"></el-table-column>
			<el-table-column prop="TotalMark" label="考试分数" align="center" >
			</el-table-column>
			<el-table-column prop="yxsj" label="证书打印" align="center">
				<template slot-scope="scope"> 
					<el-button type="text" icon="el-icon-printer" @click="xiazai(scope.row)">打印</el-button>
				</template>
			</el-table-column>
		</el-table>
		<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />  
	</div>
</template>

<script>
	import { getTgallList } from "@/api/qiye/jxjy"
	import { searchQici } from "@/api/xiehui/jxjy/Training"
	import finishSj from "../../components/shijuan/finishSj" 
	export default {
		name: "Chengji",
		components:{
			finishSj
		},
		data() {
			return {
				tableData: [],
				queryParams:{
					pageSize:10,
					pageNum:1,
					UserName:null,
					UserCord:null,
					QiciYear:null,
					QiCi:null,
					PassState:null,
					BMdept:null,
					qi:null
				},
				total:0,
				loading:false,
				ksShow:false, 
				sjContent:null,
				sjConfig:null,
				title:null,
				zsShow:false,
				iframeUrl:null,
				options:[],
				prop:{
					label:"year",
					value:"year"
				}
				
			}
		},
		created() {
			this.qiciSearch()
			this.queryParams.BMdept = this.$store.getters.userInfo.id
			this.getList()
		},
		methods: {
			qiciSearch(){
				searchQici().then(res=>{
					this.options = res.data
				})
			},
			//选择期次
			handleChange(e){ 
				this.queryParams.QiciYear = e[0]
				this.queryParams.QiCi = e[1]
			},
			getList(){
				this.loading = true
				getTgallList(this.queryParams).then(res=>{
					this.loading = false
					this.total = res.total
					this.tableData = res.rows
				})
			},
			//搜索
			handleQuery(){ 
				this.queryParams.pageNum = 1
				this.getList()
			},
			//重置
			resetQuery(){
				this.queryParams.QiCi = null
				this.queryParams.QiciYear = null
				this.resetForm("queryForm");
				this.handleQuery(); 
			}, 
			back(){
				this.ksShow = false
			},
			changeYear(){
				if(this.queryParams.QiciYear == null){
					this.queryParams.QiCi = null
				}
			},
			//下载
			xiazai(row){
				this.download('common/download', {
					fileName:row.pdfpath,delete:false
				}, `资格证书.pdf`)
			},
			indexMethod(index){
				return (this.queryParams.pageNum - 1)*this.queryParams.pageSize + 1 + index
			},
			/** 导出按钮操作 */
			handleExport() {
				this.download('system/PaperInfo/exportQyPaperSuccessList', {
					...this.queryParams
				}, `通过人员汇总表.xlsx`)
			}, 
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .shijuan .el-dialog__body{
		padding: 0 20px;
	}
	::v-deep .shijuan .el-dialog__header{
		display: none!important;
	}
</style>