<template>
|
<header>
|
<div class="headerContent">
|
<div class="search">
|
<span>筛选条件:</span>
|
<el-input placeholder="请输入内容" v-model="search"></el-input>
|
<div class="findBtn">
|
<el-button class="find-Btn" type="primary" @click="setSearch">查询</el-button>
|
<el-upload
|
class="department-margin-left10"
|
action=""
|
ref="uploadFile"
|
:http-request="importTable"
|
:show-file-list="false"
|
:auto-upload="true"
|
:limit="1"
|
>
|
<el-button type="primary">导入</el-button>
|
</el-upload>
|
<el-button class="department-margin-left10" type="primary" @click="exportTable()">导出</el-button>
|
</div>
|
</div>
|
<div class="addUser">
|
<!-- :before-close="handleClose" -->
|
<el-button class="addBtn button-addition" type="primary" @click="dialogCreate = true">添加用户</el-button>
|
<el-dialog :visible.sync="dialogCreate" title="新增账户" width="800px" v-if="dialogCreate"
|
:before-close="handleClose">
|
<createUser @sendDialog="sendDialog" />
|
</el-dialog>
|
</div>
|
</div>
|
</header>
|
</template>
|
<script>
|
import createUser from "../createUser";
|
import {exportTeamInfoDepartment, importTeamInfoDepartment} from "@/api/system/department";
|
import {downloadFile} from "@/utils/helper";
|
import {exportUser, importUser} from "@/api/system/user";
|
export default {
|
components: {
|
createUser,
|
},
|
data() {
|
return {
|
dialogCreate: false,
|
search: '',
|
}
|
},
|
methods: {
|
// 导出
|
exportTable() {
|
// const status = this.searchStatus === 2 ? null : this.searchStatus;
|
exportUser({
|
// current: this.currentPage,
|
// size: this.pageSize,
|
// departName: this.searchDepartment,
|
// status,
|
})
|
.then((res) => {
|
console.log(res)
|
downloadFile(res);
|
this.$message({ type: "success", message: "操作成功" });
|
})
|
.catch((err) => {
|
this.$message({ type: "error", message: err });
|
});
|
},
|
|
// 导入
|
importTable(file) {
|
const formData = new FormData();
|
formData.append("file", file.file);
|
console.log(formData)
|
console.log(file)
|
importUser(formData)
|
.then(() => {
|
this.$message({ type: "success", message: "操作成功" });
|
this.setSearch();
|
this.$refs.uploadFile.clearFiles();
|
})
|
.catch((err) => {
|
this.$message({ type: "error", message: err });
|
this.$refs.uploadFile.clearFiles();
|
});
|
},
|
|
setSearch() {
|
this.$emit('getSearch', { text: this.search })
|
},
|
sendDialog(flag) {
|
console.log(flag);
|
this.dialogCreate = flag.flag;
|
this.$emit('setDialog', { flag: true })
|
},
|
handleClose(done) {
|
this.$confirm('确认关闭?')
|
.then(_ => {
|
this.dialogCreate = false;
|
done();
|
})
|
.catch(_ => { });
|
}
|
},
|
props: ['setDialog', 'getSearch', 'flag'],
|
}
|
</script>
|
<style lang="scss" scoped>
|
.department-margin-left10{
|
margin-left: 10px;
|
}
|
header {
|
// background-color: #09152f;
|
//border: 1px solid #fff;
|
.headerContent {
|
padding: 0;
|
display: flex;
|
line-height: 100px;
|
justify-content: space-between;
|
align-items: center;
|
.search {
|
display: flex;
|
justify-content: flex-start;
|
span {
|
flex: 1;
|
}
|
.el-input {
|
flex: 2;
|
// color: #1d3f57;
|
&::v-deep .el-input__inner {
|
// background-color: #09152f;
|
// border: 1px solid #17324c;
|
}
|
}
|
}
|
.findBtn {
|
line-height: 100px;
|
margin-left: 15px;
|
display: flex;
|
align-items: center;
|
margin-top: -2px;
|
.el-button {
|
padding: 12px 25px;
|
}
|
}
|
.addBtn {
|
background-color: #409EFF;
|
border: none;
|
padding: 12px 30px;
|
}
|
}
|
}
|
</style>
|