|
<template>
<div class="pay">
<div v-show="showMain">
<p>考试缴费</p>
<el-table
ref="multipleTable"
border
:header-cell-style="headStyle"
:data="tableData"
>
<el-table-column prop="place_name" label="序号" width="150">
</el-table-column>
<el-table-column prop="place_code" label="考试名称" width="120">
</el-table-column>
<el-table-column prop="place_name" label="考试系列" width="150">
</el-table-column>
<el-table-column prop="place_code" label="考试级别" width="120">
</el-table-column>
<el-table-column prop="place_name" label="考试科目" width="150">
</el-table-column>
<el-table-column prop="place_code" label="申请日期" width="120">
</el-table-column>
<el-table-column prop="place_name" label="缴费状态" width="150">
</el-table-column>
<el-table-column label="操作" width="120">
<template>
<el-button size="mini" type="primary" @click="showMain = false">
查看
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div v-show="!showMain">
<el-form ref="form" :model="form" label-width="180px" status-icon>
<el-form-item label="姓名：">
<el-input></el-input>
</el-form-item>
<el-form-item label="身份证号：">
<el-input></el-input>
</el-form-item>
<el-form-item label="考试名称：">
<el-input></el-input>
</el-form-item>
<el-form-item label="考试系列：">
<el-input></el-input>
</el-form-item>
<el-form-item label="考试级别：">
<el-input></el-input>
</el-form-item>
<el-form-item label="考试科目：">
<el-input></el-input>
</el-form-item>
<el-form-item label="考试时间：">
<el-input></el-input>
</el-form-item>
<el-form-item label="申请时间：">
<el-input></el-input>
</el-form-item>
<el-form-item label="拟报考点：">
<el-input></el-input>
</el-form-item>
<el-form-item label="缴费方式：">
<el-select v-model="form.year" placeholder="请选择">
<el-option label="11" value="11"></el-option>
</el-select>
</el-form-item>
</el-form>
<img src="../../assets/logo.png" style="width:50px;height:50px;display:flex;">
<el-button type="primary" @click="printChange">已完成缴费</el-button>
</div>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [
{'考试':1}
],
form: {},
showMain: true,
}
},
methods: {
// 表格头部样式回调
headStyle() {
return "backgroundColor:#ddd;fontSize:14px;color:#666;fontWeight:700";
},
printChange() {
this.$emit('print',true)
}
}
}
</script>
<style lang="less" scoped>
.pay {
.el-table::before {
height: 0;
}
.el-table--border, .el-table--group {
border: 0;
}
.el-table--border::after, .el-table--group::after {
height: 0;
}
p{
font-size: 18px;
margin: 0 0 20px 0;
}
}
</style>
|