apply/applylist/submitlist

This commit is contained in:
以说 2022-06-17 11:17:04 +08:00
parent bbe0595f7e
commit b761f3724a
3 changed files with 613 additions and 6 deletions

View File

@ -374,7 +374,7 @@ export default {
padding: 8px 0 30px 30px;
text-align: left;
}
.el-form-item__label {
.apply-form >>> .el-form-item__label {
padding-bottom: 0px;
}
.apply-form-item {

View File

@ -1,14 +1,371 @@
<template>
<div class="content">报名列表</div>
<div class="content">
<div class="white"></div>
<div class="card">
<div class="card-title">{{ comp_name }}报名列表</div>
<div class="applyList-header">
<div class="applyList-header-input">
<!-- 输入框 双向绑定数据 自带清空 -->
<el-input v-model="searchInfo.keyWords" suffix-icon="el-icon-edit" clearable placeholder="输入单位/电话/负责人搜索">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
<!-- 下拉选框 -->
<span>&nbsp;&nbsp;&nbsp;&nbsp;赛区</span>
<el-select v-model="searchInfo.division" clearable filterable placeholder="请选择">
<el-option v-for="item in division_info_all"
:key="item.division_name"
:label="item.division_name"
:value="item.division_name"></el-option>
</el-select>
<!-- 下拉选框 -->
<span>&nbsp;&nbsp;&nbsp;&nbsp;赛项</span>
<el-select v-model="searchInfo.kind" clearable filterable placeholder="请选择">
<el-option v-for="item in kind_info_all"
:key="item.kind_name"
:label="item.kind_name"
:value="item.kind_name"></el-option>
</el-select>
</div>
<div class="applyList-header-buttton">
<!-- 导出报名信息 -->
<el-button type="primary" icon="el-icon-download" @click="exportInfoExcel()">导出报名信息</el-button>
<!-- 导出报名附件 -->
<el-button type="primary" icon="el-icon-download" @click="exportFileExcel()">导出报名附件</el-button>
</div>
</div>
<!-- 表格界面显示 -->
<!-- 分页设置 表格条纹 保存勾选数据-->
<el-table v-loading="loading"
:element-loading-text="loading_text"
element-loading-spinner="el-icon-loading"
element-loading-custom-class="loading_style"
empty-text="没有记录哦~"
:data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)"
stripe
ref="table"
@expand-change="memberTable"
class="applyList-table"
>
<el-table-column type="index" label="序号" align="center" width="50"> </el-table-column> <!-- -->
<el-table-column prop="company" label="参赛单位" align="center" width="120"></el-table-column>
<el-table-column prop="charge" label="参赛负责人" align="center" width="120"></el-table-column>
<el-table-column prop="telephone" label="电话" align="center" width="120"></el-table-column>
<el-table-column prop="division" label="赛区" align="center" width="100"></el-table-column>
<el-table-column prop="kind" label="赛项" align="center" width="100"></el-table-column>
<el-table-column prop="member" label="成员" align="center" width="100">
<template slot-scope="scope">
<div>
<el-button type="text" @click="toogleExpand(scope.row)" :icon="expandIcon">
{{ scope.row.expansion ? '收起' : '查看成员' }}
</el-button>
</div>
</template>
</el-table-column>
<el-table-column type="expand" width="1" style="display: none;">
<template slot-scope="scope">
<el-table v-loading="loading"
:element-loading-text="loading_text"
element-loading-spinner="el-icon-loading"
element-loading-custom-class="loading_style"
empty-text="没有记录哦~"
:data="scope.row.memberData"
class="member-table"
>
<el-table-column type="index" label="序号" align="center" width="50"></el-table-column> <!-- -->
<el-table-column prop="memberName" label="成员姓名" align="center" width="120"></el-table-column>
<el-table-column prop="memberCompany" label="成员单位" align="center" width="200"></el-table-column>
<el-table-column prop="memberDuty" label="成员职务" align="center" width="120"></el-table-column>
<el-table-column prop="memberArmyRank" label="成员军衔" align="center" width="120"></el-table-column>
</el-table>
</template>
</el-table-column>
<el-table-column prop="file" label="报名文件" align="center" width="150">
<template slot-scope="scope">
<el-tooltip effect="dark" :content="scope.row.file" placement="top-start">
<a :href="applyFilterUrl" class="apply-file-url">{{ scope.row.file }}</a>
</el-tooltip>
</template>
</el-table-column>
<el-table-column label="操作" width="150" align="center" >
<template slot-scope="scope"> <!-- 作用域插槽 -->
<el-button @click="rejectRow(scope.$index)" size="small">驳回</el-button>
<el-button @click.native.prevent="deleteRow(scope.$index, scope.row);" type="danger" size="small">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页底部 -->
<!-- 分页器 在每页数据的个数发生改变时触发 在页数发生改变时触发 绑定属性页数 页数导航布局 总数表格数据个数-->
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-size="pagesize"
layout="total,prev,jumper,next"
:total="tableData.length">
</el-pagination>
</div>
</div>
</template>
<script>
export default {
name: "ApplyList"
}
name: "ApplyList",
data(){
return{
//
comp_name: "",
//
searchInfo:{
keyWords:"",
division:"",
kind:"",
},
// res []""
// res.data []
division_info_all:[],
kind_info_all:[],
loading: "",
loading_text: "",
tableData:[],
currentPage: 1,
pagesize: 10,
//
expandIcon: "el-icon-zoom-in",
//
applyFilterUrl: "",
}
},
methods:{
//
handleSizeChange: function (size) {
this.pagesize = size;
},
handleCurrentChange: function (currentPage) {
this.currentPage = currentPage;
},
//
exportInfoExcel(){
alert("下载信息");
/* window.location.href = "http://localhost:8088/graduate_evaluate/exportPoint_esti?point_estiYear=" + this.searchInfo.point_estiYear
+ "&point_estiMajor=" + this.searchInfo.point_estiMajor
+ "&point_estiClass=" + this.searchInfo.point_estiClass
+ "&point_estiStandardId=" + this.searchInfo.point_estiStandardId
+ "&point_estiPointId=" + this.searchInfo.point_estiPointId ; */
},
//
exportFileExcel(){
alert("下载附件");
/* window.location.href = "http://localhost:8088/graduate_evaluate/exportPoint_esti?point_estiYear=" + this.searchInfo.point_estiYear
+ "&point_estiMajor=" + this.searchInfo.point_estiMajor
+ "&point_estiClass=" + this.searchInfo.point_estiClass
+ "&point_estiStandardId=" + this.searchInfo.point_estiStandardId
+ "&point_estiPointId=" + this.searchInfo.point_estiPointId ; */
},
//
rejectRow(index) {
alert(index);
},
//
deleteRow(index, row) {
alert(index);
alert(row);
},
//
/* toogleExpand(row) {
let $table = this.$refs.table;
this.tableData.map((item) => {
if (row.id != item.id) {
$table.toggleRowExpansion(item, false)
}
})
$table.toggleRowExpansion(row)
}, */
toogleExpand(row) {
let $table = this.$refs.table;
this.tableData.map(item => {
//
if (row.num == item.num) {
item.expansion = !item.expansion;
}
if (item.expansion == true) {
this.expandIcon = "el-icon-zoom-out";
}
if (item.expansion == false) {
this.expandIcon = "el-icon-zoom-in";
}
/* // 只展开一个
if (row.num != item.num) {
$table.toggleRowExpansion(item, false)
item.expansion = false
} else {
item.expansion = !item.expansion
} */
})
$table.toggleRowExpansion(row);
},
//
memberTable(row,expandedRows) {
//
if (expandedRows.length > 0){
/* rule.itemSelectByRuleID({ examruleid: row.id }).then(res => { */
this.tableData.forEach((temp, index) => {
//
if (temp.num === row.num) {
this.tableData[index].memberData = [{
memberName: 'eeee',
memberCompany: 'yy吃撒初三y',
memberDuty: 'jjjjj',
memberArmyRank: 'kkkkk',
},{
memberName: 'vvvv',
memberCompany: 'y阿萨擦擦斯yy',
memberDuty: 'j擦手j',
memberArmyRank: 'kkkkk',
},];
}
});
/* }); */
}
},
},
mounted() {
this.comp_name = "启智2022";
this.tableData = [{
num: 207,
company: '北京理工大学',
charge: '啊啊啊啊',
telephone: '15145166666',
division: '地方分赛区',
kind: '战略方向',
member: '查看成员',
file: '北京理工大学宇航学院啊啊啊啊',
},{
num: 909,
company: 'wwwww',
charge: '柔柔弱弱若',
telephone: '18233122128',
division: '地方分赛区',
kind: '前沿技术',
member: '查看成员',
file: 'yyyyy',
},{
num: 888,
company: '额鹅鹅鹅',
charge: '飒飒飒飒是',
telephone: '1823833201',
division: '地方分赛区',
kind: '先进技术',
member: '查看成员',
file: 'rrr',
},];
this.applyFilterUrl = "https://forge.osredm.com/api/attachments/4114";
},
};
</script>
<style scoped>
.white {
height: 66px;
}
.card-title {
border-bottom: 1px solid #eee;
padding: 1.2vw 2vw;
text-align: left;
}
.applyList-header {
display: flex;
justify-content: space-between;
margin: 1.2vw;
}
.applyList-header-input {
float: left;
}
.el-input {
width: 17rem;
}
.el-select {
width: 8rem;
}
.applyList-table {
width: 100%;
height: 700px;
}
.applyList-table >>> .el-table__expand-icon {
display: none;
}
.applyList-table >>> td.el-table__cell div {
overflow: hidden;
text-overflow: ellipsis; /* 省略号 */
white-space: nowrap; /* 不换行 */
}
.member-table {
width: 100%;
height: auto;
margin: -0.5vw 1vw 1.5vw;
}
.el-pagination {
margin: 1vw 0vw;
}
::v-deep .el-pagination__jump {
margin-left: 0px;
}
.apply-file-url {
text-decoration: none;
}
</style>
<style src="@/assets/css/common.css" scoped/>

View File

@ -1,14 +1,264 @@
<template>
<div class="content">作品列表</div>
<div class="content">
<div class="white"></div>
<div class="card">
<div class="card-title">{{ comp_name }}报名列表</div>
<div class="applyList-header">
<div class="applyList-header-input">
<!-- 输入框 双向绑定数据 自带清空 -->
<el-input v-model="searchInfo.keyWords" suffix-icon="el-icon-edit" clearable placeholder="输入单位/电话/负责人搜索">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
<!-- 下拉选框 -->
<span>&nbsp;&nbsp;&nbsp;&nbsp;赛区</span>
<el-select v-model="searchInfo.division" clearable filterable placeholder="请选择">
<el-option v-for="item in division_info_all"
:key="item.division_name"
:label="item.division_name"
:value="item.division_name"></el-option>
</el-select>
<!-- 下拉选框 -->
<span>&nbsp;&nbsp;&nbsp;&nbsp;赛项</span>
<el-select v-model="searchInfo.kind" clearable filterable placeholder="请选择">
<el-option v-for="item in kind_info_all"
:key="item.kind_name"
:label="item.kind_name"
:value="item.kind_name"></el-option>
</el-select>
</div>
<div class="applyList-header-buttton">
<!-- 导出报名信息 -->
<el-button type="primary" icon="el-icon-download" @click="exportInfoExcel()">导出报名信息</el-button>
<!-- 导出报名附件 -->
<el-button type="primary" icon="el-icon-download" @click="exportFileExcel()">导出报名附件</el-button>
</div>
</div>
<!-- 表格界面显示 -->
<!-- 分页设置 表格条纹 保存勾选数据-->
<el-table v-loading="loading"
:element-loading-text="loading_text"
element-loading-spinner="el-icon-loading"
element-loading-custom-class="loading_style"
empty-text="没有记录哦~"
:data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)"
stripe
class="applyList-table"
>
<el-table-column type="index" label="序号" align="center" width="50"> </el-table-column> <!-- -->
<el-table-column prop="company" label="参赛单位" align="center" width="120"></el-table-column>
<el-table-column prop="charge" label="参赛负责人" align="center" width="120"></el-table-column>
<el-table-column prop="telephone" label="电话" align="center" width="120"></el-table-column>
<el-table-column prop="division" label="赛区" align="center" width="100"></el-table-column>
<el-table-column prop="kind" label="赛项" align="center" width="100"></el-table-column>
<el-table-column prop="file" label="作品文件" align="center" width="250">
<template slot-scope="scope">
<el-tooltip effect="dark" :content="scope.row.file" placement="top-start">
<a :href="submitFilterUrl" class="apply-file-url">{{ scope.row.file }}</a>
</el-tooltip>
</template>
</el-table-column>
<el-table-column label="操作" width="150" align="center" >
<template slot-scope="scope"> <!-- 作用域插槽 -->
<el-button @click="rejectRow(scope.$index)" size="small">驳回</el-button>
<el-button @click.native.prevent="deleteRow(scope.$index, scope.row);" type="danger" size="small">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页底部 -->
<!-- 分页器 在每页数据的个数发生改变时触发 在页数发生改变时触发 绑定属性页数 页数导航布局 总数表格数据个数-->
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-size="pagesize"
layout="total,prev,jumper,next"
:total="tableData.length">
</el-pagination>
</div>
</div>
</template>
<script>
export default {
name: "SubmitList"
name: "SubmitList",
data(){
return{
//
comp_name: "",
//
searchInfo:{
keyWords:"",
division:"",
kind:"",
},
//res []""
//res.data []
division_info_all:[],
kind_info_all:[],
loading: "",
loading_text: "",
tableData:[],
currentPage: 1,
pagesize: 10,
//
submitFilterUrl: "",
}
},
methods:{
//
handleSizeChange: function (size) {
this.pagesize = size;
},
handleCurrentChange: function (currentPage) {
this.currentPage = currentPage;
},
//
exportInfoExcel(){
alert("下载信息");
/* window.location.href = "http://localhost:8088/graduate_evaluate/exportPoint_esti?point_estiYear=" + this.searchInfo.point_estiYear
+ "&point_estiMajor=" + this.searchInfo.point_estiMajor
+ "&point_estiClass=" + this.searchInfo.point_estiClass
+ "&point_estiStandardId=" + this.searchInfo.point_estiStandardId
+ "&point_estiPointId=" + this.searchInfo.point_estiPointId ; */
},
//
exportFileExcel(){
alert("下载附件");
/* window.location.href = "http://localhost:8088/graduate_evaluate/exportPoint_esti?point_estiYear=" + this.searchInfo.point_estiYear
+ "&point_estiMajor=" + this.searchInfo.point_estiMajor
+ "&point_estiClass=" + this.searchInfo.point_estiClass
+ "&point_estiStandardId=" + this.searchInfo.point_estiStandardId
+ "&point_estiPointId=" + this.searchInfo.point_estiPointId ; */
},
//
rejectRow(index) {
alert(index);
},
//
deleteRow(index, row) {
alert(index);
alert(row);
},
},
mounted() {
this.comp_name = "启智2022";
this.tableData = [{
num: 207,
company: '北京理工大学',
charge: '啊啊啊啊',
telephone: '15145166666',
division: '地方分赛区',
kind: '战略方向',
member: '查看成员',
file: '北京理工大学宇航学院啊啊啊啊',
},{
num: 909,
company: 'wwwww',
charge: '柔柔弱弱若',
telephone: '18233122128',
division: '地方分赛区',
kind: '前沿技术',
member: '查看成员',
file: 'yyyyy',
},{
num: 888,
company: '额鹅鹅鹅',
charge: '飒飒飒飒是',
telephone: '1823833201',
division: '地方分赛区',
kind: '先进技术',
member: '查看成员',
file: 'rrr',
},];
this.submitFilterUrl = "https://forge.osredm.com/api/attachments/4114";
},
}
</script>
<style scoped>
.white {
height: 66px;
}
.card-title {
border-bottom: 1px solid #eee;
padding: 1.2vw 2vw;
text-align: left;
}
.applyList-header {
display: flex;
justify-content: space-between;
margin: 1.2vw;
}
.applyList-header-input {
float: left;
}
.el-input {
width: 17rem;
}
.el-select {
width: 8rem;
}
.applyList-table {
width: 100%;
height: 700px;
}
.applyList-table >>> td.el-table__cell div {
overflow: hidden;
text-overflow: ellipsis; /* 省略号 */
white-space: nowrap; /* 不换行 */
}
.el-pagination {
margin: 1vw 0vw;
}
::v-deep .el-pagination__jump {
margin-left: 0px;
}
.apply-file-url {
text-decoration: none;
}
</style>
<style src="@/assets/css/common.css" scoped/>