更新了专家库UI 新增待导出列表 优化了多选逻辑
This commit is contained in:
parent
3ab246e20e
commit
e04c5a6440
|
@ -7,60 +7,115 @@
|
|||
<el-input v-model="searchInfo.keyWords" suffix-icon="el-icon-edit" clearable placeholder="请输入专家姓名">
|
||||
<el-button slot="append" icon="el-icon-search" @click="nameSearch"></el-button>
|
||||
</el-input>
|
||||
<el-button type="primary" @click="dialogVisible = true" style="margin-left: 10px" >一键导入专家信息</el-button>
|
||||
<el-button type="primary" style="margin-left: 10px" @click="exportFile">生成专家咨询费发放表</el-button>
|
||||
|
||||
<el-button type="primary" @click="dialogVisible = true" style="margin-left: 10px" plain>一键导入专家信息</el-button>
|
||||
<el-button type="primary" style="margin-left: 10px" @click="exportFile" plain>生成专家咨询费发放表</el-button>
|
||||
<el-button type="danger" @click="clearList" plain>清除导出列表</el-button>
|
||||
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
:data="tableData"
|
||||
@selection-change="handleSelectionChange"
|
||||
ref="table"
|
||||
:row-class-name="rowClassName"
|
||||
stripe
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertId"
|
||||
label="ID"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertName"
|
||||
label="专家姓名"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertRankName"
|
||||
label="专家职称"
|
||||
width="130">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertUnit"
|
||||
label="专家单位">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertCardNum"
|
||||
label="银行卡号">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertBankName"
|
||||
label="开户行">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertIdCard"
|
||||
label="身份证">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertStandard"
|
||||
label="开支标准">
|
||||
</el-table-column>
|
||||
<div style="display: flex; justify-content: space-between; width: 100%;">
|
||||
<div style="width: 49%;">
|
||||
<h2>专家列表</h2>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
@selection-change="handleSelectionChange"
|
||||
ref="table"
|
||||
:row-class-name="rowClassName"
|
||||
stripe
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertId"
|
||||
label="ID"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertName"
|
||||
label="专家姓名"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertRankName"
|
||||
label="专家职称"
|
||||
width="130">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertUnit"
|
||||
label="专家单位">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertCardNum"
|
||||
label="银行卡号">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertBankName"
|
||||
label="开户行">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertIdCard"
|
||||
label="身份证">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertStandard"
|
||||
label="开支标准">
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<div style="width: 49%;">
|
||||
<h2>待导出列表</h2>
|
||||
<el-table
|
||||
:data="exportList"
|
||||
ref="exportTable"
|
||||
stripe
|
||||
style="width: 100%">
|
||||
|
||||
<el-table-column
|
||||
prop="expertId"
|
||||
label="ID"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertName"
|
||||
label="专家姓名"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertRankName"
|
||||
label="专家职称"
|
||||
width="130">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertUnit"
|
||||
label="专家单位">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertCardNum"
|
||||
label="银行卡号">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertBankName"
|
||||
label="开户行">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertIdCard"
|
||||
label="身份证">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="expertStandard"
|
||||
label="开支标准">
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<el-dialog
|
||||
|
@ -127,6 +182,13 @@ export default {
|
|||
},
|
||||
methods:{
|
||||
|
||||
//清除导出列表
|
||||
clearList(){
|
||||
this.exportList = []
|
||||
|
||||
//选择器的状态也需要清空
|
||||
this.$refs.table.clearSelection();
|
||||
},
|
||||
|
||||
//下载导入模板
|
||||
downloadImportTemplate(){
|
||||
|
@ -195,7 +257,15 @@ export default {
|
|||
// })
|
||||
}
|
||||
|
||||
this.exportList = val
|
||||
|
||||
val.forEach(item => {
|
||||
// 如果exportList中还没有这个项,就添加它
|
||||
if (!this.exportList.find(i => i.expertId === item.expertId)) {
|
||||
this.exportList.push(item);
|
||||
}
|
||||
});
|
||||
|
||||
// this.exportList = val
|
||||
|
||||
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue