commit
8b59e9541e
|
@ -6,8 +6,8 @@
|
||||||
<span class="steps-tip"> 报名</span>
|
<span class="steps-tip"> 报名</span>
|
||||||
<el-steps :active="1" simple class="steps-steps">
|
<el-steps :active="1" simple class="steps-steps">
|
||||||
<el-step title="填写信息" icon="el-icon-edit"></el-step>
|
<el-step title="填写信息" icon="el-icon-edit"></el-step>
|
||||||
<el-step title="审核通过" icon="el-icon-upload"></el-step>
|
<el-step title="审核通过" icon="el-icon-s-check"></el-step>
|
||||||
<el-step title="报名成功" icon="el-icon-picture"></el-step>
|
<el-step title="报名成功" icon="el-icon-success"></el-step>
|
||||||
</el-steps>
|
</el-steps>
|
||||||
</div>
|
</div>
|
||||||
<!-- 提示信息 -->
|
<!-- 提示信息 -->
|
||||||
|
@ -20,74 +20,80 @@
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="chart-content">
|
<div class="chart-content">
|
||||||
<div class="apply-title">填写报名信息</div>
|
<div class="apply-title">填写报名信息</div>
|
||||||
<!-- 报名表单 -->
|
<!-- 报名表单 -->
|
||||||
<el-form
|
<el-form
|
||||||
:model="applyForm"
|
:model="applyForm"
|
||||||
:rules="rules"
|
:rules="rules"
|
||||||
ref="applyForm"
|
ref="applyForm"
|
||||||
label-position="top"
|
label-position="top"
|
||||||
label-width="100px"
|
label-width="100px"
|
||||||
class="apply-form"
|
class="apply-form"
|
||||||
>
|
>
|
||||||
<el-form-item label="参赛单位" prop="applyCompany" class="apply-form-item">
|
<el-form-item label="参赛单位" prop="applyCompany" class="apply-form-item">
|
||||||
<el-input v-model="applyForm.applyCompany" clearable placeholder="请输入参赛单位"></el-input>
|
<el-input v-model="applyForm.applyCompany" clearable placeholder="请输入参赛单位"></el-input>
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="参赛团队负责人姓名" prop="applyChargeName" class="apply-form-item">
|
|
||||||
<el-input v-model="applyForm.applyChargeName" clearable placeholder="请输入负责人姓名"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="职务" prop="applyChargeDuty" class="apply-form-item">
|
|
||||||
<el-input v-model="applyForm.applyChargeDuty" clearable placeholder="请输入负责人职务"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="军衔" prop="applyChargeArmyRank" class="apply-form-item">
|
|
||||||
<el-input v-model="applyForm.applyChargeRank" clearable placeholder="请输入负责人军衔"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="赛区" prop="applyRegion" filterable class="apply-form-item">
|
|
||||||
<el-select
|
|
||||||
v-model="applyForm.applyRegion"
|
|
||||||
placeholder="请选择参赛赛区"
|
|
||||||
class="apply-form-select"
|
|
||||||
>
|
|
||||||
<el-option label="区域一" value="shanghai"></el-option>
|
|
||||||
<el-option label="区域二" value="shanghai"></el-option>
|
|
||||||
<el-option label="区域三" value="shanghai"></el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="赛项" prop="applySort" filterable class="apply-form-item">
|
|
||||||
<el-select
|
|
||||||
placeholder="请选择参赛赛项"
|
|
||||||
v-model="applyForm.applySort"
|
|
||||||
class="apply-form-select"
|
|
||||||
>
|
|
||||||
<el-option label="战略方向" value="shanghai"></el-option>
|
|
||||||
<el-option label="前沿技术" value="shanghai"></el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="课题来源" prop="applySource" class="apply-form-item">
|
|
||||||
<el-radio-group
|
|
||||||
v-model="radioValue"
|
|
||||||
@change="radioChange"
|
|
||||||
class="apply-form-radio"
|
|
||||||
>
|
|
||||||
<el-radio :label="1">计划支持</el-radio>
|
|
||||||
<el-radio :label="2">自主提报</el-radio>
|
|
||||||
</el-radio-group>
|
|
||||||
<el-input v-model="applyForm.applySource" :disabled="inputIf" clearable placeholder="填写课题来源"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="电话" prop="applyPhone" class="apply-form-item">
|
|
||||||
<el-input v-model="applyForm.applyPhone" clearable placeholder="请输入电话"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<el-form-item label="成员">
|
|
||||||
<el-button type="primary" icon="el-icon-circle-plus-outline" @click="handleAddMember(memberList)">添加成员</el-button>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="参赛团队负责人姓名" prop="applyChargeName" class="apply-form-item">
|
||||||
|
<el-input v-model="applyForm.applyChargeName" clearable placeholder="请输入负责人姓名"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="电话" prop="applyPhone" class="apply-form-item">
|
||||||
|
<el-input v-model="applyForm.applyPhone" clearable placeholder="请输入电话"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="邮箱" prop="applyEmail" class="apply-form-item">
|
||||||
|
<el-input v-model="applyForm.applyEmail" clearable placeholder="请输入邮箱"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="职务" prop="applyChargeDuty" class="apply-form-item">
|
||||||
|
<el-input v-model="applyForm.applyChargeDuty" clearable placeholder="请输入负责人职务"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="军衔" prop="applyChargeArmyRank" class="apply-form-item">
|
||||||
|
<el-input v-model="applyForm.applyChargeRank" clearable placeholder="请输入负责人军衔"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="赛区" prop="applyRegion" filterable class="apply-form-item">
|
||||||
|
<el-select
|
||||||
|
v-model="applyForm.applyRegion"
|
||||||
|
placeholder="请选择参赛赛区"
|
||||||
|
class="apply-form-select"
|
||||||
|
>
|
||||||
|
<el-option label="区域一" value="shanghai"></el-option>
|
||||||
|
<el-option label="区域二" value="shanghai"></el-option>
|
||||||
|
<el-option label="区域三" value="shanghai"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="赛项" prop="applySort" filterable class="apply-form-item">
|
||||||
|
<el-select
|
||||||
|
placeholder="请选择参赛赛项"
|
||||||
|
v-model="applyForm.applySort"
|
||||||
|
class="apply-form-select"
|
||||||
|
>
|
||||||
|
<el-option label="战略方向" value="shanghai"></el-option>
|
||||||
|
<el-option label="前沿技术" value="shanghai"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="课题来源" prop="applySource" class="apply-form-item">
|
||||||
|
<el-radio-group
|
||||||
|
v-model="radioValue"
|
||||||
|
@change="radioChange"
|
||||||
|
class="apply-form-radio"
|
||||||
|
>
|
||||||
|
<el-radio :label="1">计划支持</el-radio>
|
||||||
|
<el-radio :label="2">自主提报</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
<el-input v-model="applyForm.applySource" :disabled="inputIf" clearable placeholder="填写课题来源"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<!-- 成员表单 -->
|
||||||
|
<div class="apply-menber">
|
||||||
|
<div class="apply-member-header">
|
||||||
|
<h4>成员</h4>
|
||||||
|
<el-button type="primary" icon="el-icon-circle-plus-outline" @click="handleAddMember(memberList)">添加成员</el-button>
|
||||||
|
</div>
|
||||||
<!-- 成员表格 -->
|
<!-- 成员表格 -->
|
||||||
<el-table v-loading="loading"
|
<el-table v-loading="loading"
|
||||||
:element-loading-text="loading_text"
|
:element-loading-text="loading_text"
|
||||||
|
@ -100,68 +106,69 @@
|
||||||
ref="applyTable"
|
ref="applyTable"
|
||||||
class="apply-table"
|
class="apply-table"
|
||||||
>
|
>
|
||||||
<el-table-column prop="memberName" label="姓名" align="center" width="150">
|
<el-table-column prop="memberName" label="姓名" align="center" width="150">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-form-item prop="memberName" class="apply-table-item">
|
<el-form-item prop="memberName" class="apply-table-item">
|
||||||
<el-input v-model="scope.row.memberName"></el-input>
|
<el-input v-model="scope.row.memberName"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="memberCompany" label="单位" align="center" width="300">
|
<el-table-column prop="memberCompany" label="单位" align="center" width="300">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-form-item prop="memberCompany" class="apply-table-item">
|
<el-form-item prop="memberCompany" class="apply-table-item">
|
||||||
<el-input v-model="scope.row.memberCompany"></el-input>
|
<el-input v-model="scope.row.memberCompany"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="memberDuty" label="职务" align="center" width="150">
|
<el-table-column prop="memberDuty" label="职务" align="center" width="150">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-form-item prop="memberCompany" class="apply-table-item">
|
<el-form-item prop="memberCompany" class="apply-table-item">
|
||||||
<el-input v-model="scope.row.memberDuty"></el-input>
|
<el-input v-model="scope.row.memberDuty"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="memberArmyRank" label="军衔" align="center" width="150">
|
<el-table-column prop="memberArmyRank" label="军衔" align="center" width="150">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-form-item prop="memberCompany" class="apply-table-item">
|
<el-form-item prop="memberCompany" class="apply-table-item">
|
||||||
<el-input v-model="scope.row.memberArmyRank"></el-input>
|
<el-input v-model="scope.row.memberArmyRank"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center">
|
<el-table-column label="操作" align="center">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button @click.native.prevent="deleteRow(scope.$index);" type="danger" size="small" class="apply-table-item">删除</el-button>
|
<el-button @click.native.prevent="deleteRow(scope.$index);" type="danger" size="small" class="apply-table-item">删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="apply-button">
|
</el-form>
|
||||||
<!-- 导入按钮 -->
|
|
||||||
<el-upload
|
<div class="apply-button">
|
||||||
name="importApplyFile"
|
<!-- 导入按钮 -->
|
||||||
:limit="1"
|
<el-upload
|
||||||
:on-exceed="handleExceed"
|
name="importApplyFile"
|
||||||
:action="uploadActionUrl"
|
:limit="1"
|
||||||
accept=".zip,.rar"
|
:on-exceed="handleExceed"
|
||||||
:before-upload="onBeforeUpload"
|
:action="uploadActionUrl"
|
||||||
:on-progress="onUpload"
|
accept=".zip,.rar"
|
||||||
:on-success="(res)=>{importSuccess(res)}"
|
:before-upload="onBeforeUpload"
|
||||||
:before-remove="beforeRemove"
|
:on-progress="onUpload"
|
||||||
:file-list="fileList"
|
:on-success="(res)=>{importSuccess(res)}"
|
||||||
class="import-apply-file"
|
:before-remove="beforeRemove"
|
||||||
>
|
:file-list="fileList"
|
||||||
<!-- 触发文件选择框的内容 -->
|
class="import-apply-file"
|
||||||
<el-button slot="trigger" type="primary" icon="el-icon-upload2">提交报名表</el-button>
|
>
|
||||||
<div slot="tip" class="import-apply-tip">请上传zip/rar格式压缩包</div>
|
<!-- 触发文件选择框的内容 -->
|
||||||
<el-link :href="applyFilterUrl" :underline="false" target="_blank" class="download-apply-file">
|
<el-button slot="trigger" type="primary" icon="el-icon-upload2">提交报名表</el-button>
|
||||||
<el-button icon="el-icon-download">下载报名表</el-button>
|
<div slot="tip" class="import-apply-tip">请上传zip/rar格式压缩包</div>
|
||||||
</el-link>
|
<el-link :href="applyFilterUrl" :underline="false" target="_blank" class="download-apply-file">
|
||||||
</el-upload>
|
<el-button icon="el-icon-download">下载报名表</el-button>
|
||||||
|
</el-link>
|
||||||
|
</el-upload>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -174,14 +181,23 @@ export default {
|
||||||
return {
|
return {
|
||||||
/* 报名表单信息 */
|
/* 报名表单信息 */
|
||||||
applyForm: {
|
applyForm: {
|
||||||
applyCompany: "",
|
applyCompId: "",
|
||||||
applyChargeName: "",
|
applyTeamId: "",
|
||||||
applyChargeDuty: "",
|
|
||||||
applyChargeArmyRank: "",
|
applyCompany: "", // unit单位
|
||||||
applyRegion: "",
|
applyChargeName: "", // name姓名
|
||||||
applySort: "",
|
applyPhone: "", // tel电话
|
||||||
applySource: "",
|
applyEmail: "", // email邮箱
|
||||||
applyPhone: "",
|
|
||||||
|
applyChargeDuty: "", // duty职务
|
||||||
|
applyChargeArmyRank: "", // army_rank军衔
|
||||||
|
|
||||||
|
applyRegion: "", // division赛区
|
||||||
|
applySort: "", // kind类别
|
||||||
|
applySource: "", // appky_source课题来源
|
||||||
|
|
||||||
|
applyFile: "", // file文件
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
radioValue: 1, /* 单选框默认 */
|
radioValue: 1, /* 单选框默认 */
|
||||||
|
@ -191,16 +207,19 @@ export default {
|
||||||
loading_text: "",
|
loading_text: "",
|
||||||
|
|
||||||
memberList: [], /* 成员列表 */
|
memberList: [], /* 成员列表 */
|
||||||
addForm: [], /* 逐个添加的表单 */
|
addForm: [], /* 临时变量:逐个添加的表单 */
|
||||||
|
|
||||||
/* 表格成员信息 */
|
/* 表格成员信息 */
|
||||||
memberName: "",
|
memberName: "",
|
||||||
memberCompany: "",
|
memberPhone: "",
|
||||||
memberDuty: "",
|
memberEmail: "",
|
||||||
memberArmyRank: "",
|
|
||||||
|
|
||||||
uploadActionUrl: "",
|
memberCompany: "", // memberUnit
|
||||||
applyFilterUrl: "",
|
memberDuty: "", // memberDuty
|
||||||
|
memberArmyRank: "", // memberArmyRank
|
||||||
|
|
||||||
|
uploadActionUrl: "", // 上传后端接口url
|
||||||
|
applyFilterUrl: "", // 下载报名表的url
|
||||||
|
|
||||||
|
|
||||||
rules: {
|
rules: {
|
||||||
|
@ -211,6 +230,14 @@ export default {
|
||||||
applyChargeName: [
|
applyChargeName: [
|
||||||
{ required: true, message: "请输入负责人姓名", trigger: "blur" },
|
{ required: true, message: "请输入负责人姓名", trigger: "blur" },
|
||||||
],
|
],
|
||||||
|
applyPhone: [
|
||||||
|
{ required: true, message: "请输入电话", trigger: "blur" },
|
||||||
|
{ pattern: /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/, message:"请输入正确的成员电话", trigger: "change"},
|
||||||
|
],
|
||||||
|
applyEmail: [
|
||||||
|
{ required: true, message: "请输入邮箱", trigger: "blur" },
|
||||||
|
{ pattern: /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/, message:"请输入正确的邮箱地址", trigger: "change"},
|
||||||
|
],
|
||||||
applyChargeDuty: [
|
applyChargeDuty: [
|
||||||
{ required: true, message: "请输入职务", trigger: "blur" },
|
{ required: true, message: "请输入职务", trigger: "blur" },
|
||||||
],
|
],
|
||||||
|
@ -226,10 +253,6 @@ export default {
|
||||||
applySource: [
|
applySource: [
|
||||||
{ required: true, message: "请填写课题来源", trigger: "change" }
|
{ required: true, message: "请填写课题来源", trigger: "change" }
|
||||||
],
|
],
|
||||||
applyPhone: [
|
|
||||||
{ required: true, message: "请输入电话", trigger: "blur" },
|
|
||||||
{ pattern: /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/, message:"请输入正确的成员电话", trigger: "change"},
|
|
||||||
],
|
|
||||||
|
|
||||||
memberName: [
|
memberName: [
|
||||||
{ required: true, message: "请输入成员姓名", trigger: "blur" },
|
{ required: true, message: "请输入成员姓名", trigger: "blur" },
|
||||||
|
@ -393,7 +416,16 @@ export default {
|
||||||
top: -1.75vw;
|
top: -1.75vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.apply-table {
|
.apply-menber {
|
||||||
|
float: left;
|
||||||
|
text-align: left;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: -1vw;
|
||||||
|
}
|
||||||
|
h4 {
|
||||||
|
margin-bottom: 1vw;
|
||||||
|
}
|
||||||
|
::v-deep .apply-table {
|
||||||
width: 95%;
|
width: 95%;
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
@ -401,7 +433,12 @@ export default {
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.apply-button {
|
||||||
|
float: left;
|
||||||
|
margin: 3vw 2vw;
|
||||||
|
}
|
||||||
.import-apply-tip {
|
.import-apply-tip {
|
||||||
|
align-items: left;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue