osredm_test
/
osredm-comp-custom
3
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity

!23 6 

Merge pull request !23 from Sky_ID/zql
This commit is contained in:
Sky_ID 2022-06-23 07:15:22 +00:00 committed by Gitee
parent 59d9a56020 a107392153
commit 8b59e9541e
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
1 changed files with 186 additions and 149 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

335
src/pages/Apply/Apply.vue
View File

@ -6,8 +6,8 @@
<span class="steps-tip">&nbsp;&nbsp;报名</span>
<el-steps :active="1" simple class="steps-steps">
<el-step title="填写信息" icon="el-icon-edit"></el-step>
<el-step title="审核通过" icon="el-icon-upload"></el-step>
<el-step title="报名成功" icon="el-icon-picture"></el-step>
<el-step title="审核通过" icon="el-icon-s-check"></el-step>
<el-step title="报名成功" icon="el-icon-success"></el-step>
</el-steps>
</div>
<!-- 提示信息 -->
@ -20,74 +20,80 @@
<div class="card">
<div class="chart-content">
<div class="apply-title">填写报名信息</div>
<!-- 报名表单 -->
<el-form
:model="applyForm"
:rules="rules"
ref="applyForm"
label-position="top"
label-width="100px"
class="apply-form"
>
<el-form-item label="参赛单位" prop="applyCompany" class="apply-form-item">
<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
:model="applyForm"
:rules="rules"
ref="applyForm"
label-position="top"
label-width="100px"
class="apply-form"
>
<el-form-item label="参赛单位" prop="applyCompany" class="apply-form-item">
<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="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"
:element-loading-text="loading_text"
@ -100,68 +106,69 @@
ref="applyTable"
class="apply-table"
>
<el-table-column prop="memberName" label="姓名" align="center" width="150">
<template slot-scope="scope">
<el-form-item prop="memberName" class="apply-table-item">
<el-input v-model="scope.row.memberName"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column prop="memberCompany" label="单位" align="center" width="300">
<template slot-scope="scope">
<el-form-item prop="memberCompany" class="apply-table-item">
<el-input v-model="scope.row.memberCompany"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column prop="memberDuty" label="职务" align="center" width="150">
<template slot-scope="scope">
<el-form-item prop="memberCompany" class="apply-table-item">
<el-input v-model="scope.row.memberDuty"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column prop="memberArmyRank" label="军衔" align="center" width="150">
<template slot-scope="scope">
<el-form-item prop="memberCompany" class="apply-table-item">
<el-input v-model="scope.row.memberArmyRank"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button @click.native.prevent="deleteRow(scope.$index);" type="danger" size="small" class="apply-table-item">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-table-column prop="memberName" label="姓名" align="center" width="150">
<template slot-scope="scope">
<el-form-item prop="memberName" class="apply-table-item">
<el-input v-model="scope.row.memberName"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column prop="memberCompany" label="单位" align="center" width="300">
<template slot-scope="scope">
<el-form-item prop="memberCompany" class="apply-table-item">
<el-input v-model="scope.row.memberCompany"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column prop="memberDuty" label="职务" align="center" width="150">
<template slot-scope="scope">
<el-form-item prop="memberCompany" class="apply-table-item">
<el-input v-model="scope.row.memberDuty"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column prop="memberArmyRank" label="军衔" align="center" width="150">
<template slot-scope="scope">
<el-form-item prop="memberCompany" class="apply-table-item">
<el-input v-model="scope.row.memberArmyRank"></el-input>
</el-form-item>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button @click.native.prevent="deleteRow(scope.$index);" type="danger" size="small" class="apply-table-item">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-form>
</div>
</div>
<div class="apply-button">
<!-- 导入按钮 -->
<el-upload
name="importApplyFile"
:limit="1"
:on-exceed="handleExceed"
:action="uploadActionUrl"
accept=".zip,.rar"
:before-upload="onBeforeUpload"
:on-progress="onUpload"
:on-success="(res)=>{importSuccess(res)}"
: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 icon="el-icon-download">下载报名表</el-button>
</el-link>
</el-upload>
</el-form>
<div class="apply-button">
<!-- 导入按钮 -->
<el-upload
name="importApplyFile"
:limit="1"
:on-exceed="handleExceed"
:action="uploadActionUrl"
accept=".zip,.rar"
:before-upload="onBeforeUpload"
:on-progress="onUpload"
:on-success="(res)=>{importSuccess(res)}"
: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 icon="el-icon-download">下载报名表</el-button>
</el-link>
</el-upload>
</div>
</div>
</div>
</div>
</template>
@ -174,14 +181,23 @@ export default {
return {
/* 报名表单信息 */
applyForm: {
applyCompany: "",
applyChargeName: "",
applyChargeDuty: "",
applyChargeArmyRank: "",
applyRegion: "",
applySort: "",
applySource: "",
applyPhone: "",
applyCompId: "",
applyTeamId: "",
applyCompany: "", // unit单位
applyChargeName: "", // name姓名
applyPhone: "", // tel电话
applyEmail: "", // email邮箱
applyChargeDuty: "", // duty职务
applyChargeArmyRank: "", // army_rank军衔
applyRegion: "", // division赛区
applySort: "", // kind类别
applySource: "", // appky_source课题来源
applyFile: "", // file文件
},
radioValue: 1, /* 单选框默认 */
@ -191,16 +207,19 @@ export default {
loading_text: "",
memberList: [], /* 成员列表 */
addForm: [], /* 逐个添加的表单 */
addForm: [], /* 临时变量：逐个添加的表单 */
/* 表格成员信息 */
memberName: "",
memberCompany: "",
memberDuty: "",
memberArmyRank: "",
memberName: "",
memberPhone: "",
memberEmail: "",
uploadActionUrl: "",
applyFilterUrl: "",
memberCompany: "", // memberUnit
memberDuty: "", // memberDuty
memberArmyRank: "", // memberArmyRank
uploadActionUrl: "", // 上传后端接口url
applyFilterUrl: "", // 下载报名表的url
rules: {
@ -211,6 +230,14 @@ export default {
applyChargeName: [
{ 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: [
{ required: true, message: "请输入职务", trigger: "blur" },
],
@ -226,10 +253,6 @@ export default {
applySource: [
{ 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: [
{ required: true, message: "请输入成员姓名", trigger: "blur" },
@ -393,7 +416,16 @@ export default {
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%;
height: auto;
}
@ -401,7 +433,12 @@ export default {
margin-bottom: 16px;
}
.apply-button {
float: left;
margin: 3vw 2vw;
}
.import-apply-tip {
align-items: left;
text-align: left;
font-size: 11px;
}