12
This commit is contained in:
198
src/components/page/reviewerImport.vue
Normal file
198
src/components/page/reviewerImport.vue
Normal file
@@ -0,0 +1,198 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-user-solid"></i> Import reviewer
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container">
|
||||
<el-form
|
||||
ref="import"
|
||||
:model="upform"
|
||||
label-width="120px"
|
||||
v-loading="fullscreenLoading"
|
||||
element-loading-spinner="el-icon-loading"
|
||||
element-loading-background="rgba(0, 0, 0, 0.8)">
|
||||
<el-form-item label="Journal">
|
||||
<el-select v-model="upform.journal" placeholder="Please select journal">
|
||||
<el-option
|
||||
v-for="item in items"
|
||||
:key="item.journal_id"
|
||||
:label="item.title"
|
||||
:value="item.journal_id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Template">
|
||||
<el-link icon="el-icon-download" type="text" :href="getlinkurl">Download template</el-link>
|
||||
<div>please delete demo message before you import</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="File">
|
||||
<el-upload
|
||||
:action="up_url"
|
||||
name="importExcel"
|
||||
:on-remove="handleRemove"
|
||||
accept=".xls, .xlsx"
|
||||
:before-upload="checkfile"
|
||||
:limit="1"
|
||||
:on-exceed="handleExceed"
|
||||
:on-success="upSuccess"
|
||||
:on-error="uperror"
|
||||
>
|
||||
<el-button size="small" type="text">upload excel</el-button>
|
||||
<div
|
||||
slot="tip"
|
||||
class="el-upload__tip"
|
||||
>Only excel files can be uploaded(.xls,.xlsx)</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="onsubmit"
|
||||
>Import</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-divider></el-divider>
|
||||
<el-table :data="tabledata" border>
|
||||
<el-table-column prop="username" label="username" align="center"></el-table-column>
|
||||
<el-table-column prop="realname" label="realname" align="center"></el-table-column>
|
||||
<el-table-column prop="email" label="email" align="center"></el-table-column>
|
||||
<el-table-column prop="gender" label="gender" align="center"></el-table-column>
|
||||
<el-table-column prop="technical" label="technical" align="center"></el-table-column>
|
||||
<el-table-column prop="country" label="country" align="center"></el-table-column>
|
||||
<el-table-column prop="major" label="major" align="center"></el-table-column>
|
||||
<el-table-column prop="field" label="field" align="center"></el-table-column>
|
||||
<el-table-column prop="company" label="company" align="center"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog title="Import results" :visible.sync="dialogFormVisible">
|
||||
<h3 v-show="erdata.lenght>0">error list</h3>
|
||||
<el-table :data="erdata" row-class-name="warning-row">
|
||||
<el-table-column type="index" label="No." align="center"></el-table-column>
|
||||
<el-table-column prop="username" label="Username" align="center"></el-table-column>
|
||||
<el-table-column prop="realname" label="Realname" align="center"></el-table-column>
|
||||
<el-table-column prop="email" label="Email" align="center"></el-table-column>
|
||||
<el-table-column prop="reason" label="reason" align="center"></el-table-column>
|
||||
</el-table>
|
||||
<el-divider></el-divider>
|
||||
<h3 v-show="sudata.lenght>0">success list</h3>
|
||||
<el-table :data="sudata" row-class-name="success-row">
|
||||
<el-table-column type="index" label="No." align="center"></el-table-column>
|
||||
<el-table-column prop="username" label="Username" align="center"></el-table-column>
|
||||
<el-table-column prop="realname" label="Realname" align="center"></el-table-column>
|
||||
<el-table-column prop="email" label="Email" align="center"></el-table-column>
|
||||
<el-table-column prop="reason" label="result" align="center"></el-table-column>
|
||||
</el-table>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mediaUrl:this.Common.mediaUrl,
|
||||
baseUrl: this.Common.baseUrl,
|
||||
fullscreenLoading: false,
|
||||
username: localStorage.getItem('ms_username'),
|
||||
upform: {
|
||||
journal: '',
|
||||
url: ''
|
||||
},
|
||||
items: [],
|
||||
tabledata: [],
|
||||
sudata: [],
|
||||
erdata: [],
|
||||
dialogFormVisible:false
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.initselect();
|
||||
},
|
||||
computed: {
|
||||
up_url: function () {
|
||||
return this.baseUrl + 'api/Admin/up_import';
|
||||
},
|
||||
getlinkurl:function(){
|
||||
return this.mediaUrl+'static/import.xlsx'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onsubmit() {
|
||||
if (this.upform.journal == '' || this.upform.url == '') {
|
||||
this.$message.error('please select journal and upload a excel');
|
||||
return false;
|
||||
}
|
||||
this.fullscreenLoading = true;
|
||||
this.$api.post('api/Admin/reviewerImport', this.upform).then((res) => {
|
||||
this.fullscreenLoading = false;
|
||||
this.sudata = res.sudata;
|
||||
this.erdata = res.erdata;
|
||||
this.dialogFormVisible = true;
|
||||
console.log(res);
|
||||
});
|
||||
},
|
||||
//初始化期刊选项
|
||||
initselect() {
|
||||
this.$api
|
||||
.post('api/Article/getJournal', { username: this.username })
|
||||
.then((res) => {
|
||||
this.items = res;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
//移除文件
|
||||
handleRemove() {},
|
||||
//审查文件
|
||||
checkfile(file) {
|
||||
// let isslx =
|
||||
// file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' ||
|
||||
// file.type === 'application/vnd.ms-excel';
|
||||
// if (!isslx) {
|
||||
// this.$message.error('Only excel files can be uploaded(.xls,.xlsx)');
|
||||
// }
|
||||
// return isslx;
|
||||
},
|
||||
uperror(err) {
|
||||
this.$message.error(err);
|
||||
},
|
||||
handleExceed() {
|
||||
this.$message.error('limit one file');
|
||||
},
|
||||
//文件上传成功后的操作
|
||||
upSuccess(res, file) {
|
||||
if (res.code == 0) {
|
||||
this.upform.url = 'reviewer/import/' + res.upurl;
|
||||
this.gettables();
|
||||
} else {
|
||||
this.$message.error('service error' + res.msg);
|
||||
}
|
||||
},
|
||||
//获取table数据
|
||||
gettables() {
|
||||
this.$api.post('api/Admin/getExcelData', this.upform).then((res) => {
|
||||
this.tabledata = res;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-table .warning-row {
|
||||
background: rgb(252, 158, 158);
|
||||
}
|
||||
|
||||
.el-table .success-row {
|
||||
background: #d7f1c8;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user