<template>
|
<div class="logLog_box">
|
<My-bread
|
:list="[
|
`${$t('userManage.userManage')}`,
|
`${$t('userManage.userInfoManage')}`,
|
]"
|
></My-bread>
|
<el-divider />
|
<div class="inquire">
|
<el-form ref="ruleForm" :model="form" :inline="true">
|
<el-form-item :label="$t('operatManage.ELM.username')" prop="name">
|
<el-input
|
v-model="form.name"
|
:placeholder="$t('operatManage.ELM.usernameInfo')"
|
/>
|
</el-form-item>
|
<!-- <el-form-item
|
:label="$t('userManage.userInfoObj.userStatus')"
|
prop="userStatus"
|
>
|
<el-select
|
v-model="form.userStatus"
|
:placeholder="$t('userManage.userInfoObj.userStatus')"
|
>
|
<el-option :label="$t('userManage.userInfoObj.all')" value="all" />
|
<el-option
|
:label="$t('userManage.userInfoObj.normal')"
|
value="normal"
|
/>
|
<el-option
|
:label="$t('userManage.userInfoObj.disable')"
|
value="disable"
|
/>
|
<el-option
|
:label="$t('userManage.userInfoObj.delete')"
|
value="delete"
|
/>
|
<el-option
|
:label="$t('userManage.userInfoObj.apply')"
|
value="apply"
|
/>
|
<el-option
|
:label="$t('userManage.userInfoObj.rejection')"
|
value="rejection"
|
/>
|
</el-select>
|
</el-form-item> -->
|
<el-form-item
|
:label="$t('userManage.userInfoObj.depName')"
|
prop="depName"
|
>
|
<el-input
|
v-model="form.depName"
|
:placeholder="$t('common.pleaseInput')"
|
/>
|
</el-form-item>
|
<br />
|
<el-form-item>
|
<el-button type="success" size="small" @click="showAddDialog"
|
><i class="el-icon-plus"></i> {{
|
$t("common.append")
|
}}</el-button
|
>
|
</el-form-item>
|
<el-form-item style="margin-left: 60%">
|
<el-button @click="onSubmit" size="mini"
|
><i class="el-icon-search"></i> {{
|
$t("operatManage.ELM.search")
|
}}</el-button
|
>
|
</el-form-item>
|
<el-form-item>
|
<el-button @click="resetForm('ruleForm')" size="mini"
|
><i class="el-icon-delete"></i> {{
|
$t("operatManage.ELM.reset")
|
}}</el-button
|
>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div class="table_box">
|
<el-table
|
:data="tableData"
|
stripe
|
border
|
style="width: 100%"
|
max-height="99%"
|
>
|
<el-table-column
|
align="center"
|
type="index"
|
:label="$t('common.index')"
|
fixed
|
/>
|
<el-table-column
|
align="center"
|
prop="uname"
|
:label="$t('userManage.userInfoObj.uname')"
|
fixed
|
/>
|
<el-table-column
|
align="center"
|
prop="pwd"
|
:label="$t('userManage.userInfoObj.pwd')"
|
/>
|
|
<el-table-column
|
align="center"
|
prop="sex"
|
:label="$t('userManage.userInfoObj.sex')"
|
>
|
<template slot-scope="scope">
|
<span v-if="scope.row.sex == 1"> 男 </span>
|
<span v-else-if="scope.row.sex == 0">女</span>
|
<span v-else>未知</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="natives"
|
:label="$t('userManage.userInfoObj.natives')"
|
/>
|
<el-table-column
|
align="center"
|
prop="depName"
|
:label="$t('userManage.userInfoObj.depName')"
|
/>
|
<el-table-column
|
align="center"
|
prop="idcard"
|
:label="$t('userManage.userInfoObj.idcard')"
|
/><el-table-column
|
align="center"
|
prop="job"
|
:label="$t('userManage.userInfoObj.job')"
|
/>
|
<el-table-column
|
align="center"
|
prop="edu"
|
:label="$t('userManage.userInfoObj.edu')"
|
/>
|
<el-table-column
|
align="center"
|
prop="addr"
|
:label="$t('userManage.userInfoObj.addr')"
|
/>
|
<el-table-column
|
align="center"
|
prop="email"
|
:label="$t('userManage.userInfoObj.email')"
|
/>
|
<el-table-column
|
align="center"
|
prop="contact"
|
:label="$t('userManage.userInfoObj.contact')"
|
/>
|
|
<el-table-column
|
align="center"
|
prop="largeModuleName"
|
:label="$t('userManage.userInfoObj.status')"
|
>
|
<template slot-scope="scope">
|
<el-tag v-if="scope.row.status == 0" type="success">正常</el-tag>
|
<el-tag v-if="scope.row.status == 1" type="info">禁用</el-tag>
|
<el-tag v-if="scope.row.status == 2" type="warning">删除</el-tag>
|
<el-tag v-if="scope.row.status == 3">申请</el-tag>
|
<el-tag v-if="scope.row.status == 4" type="danger">拒批</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="bak"
|
:label="$t('userManage.userInfoObj.bak')"
|
/>
|
<el-table-column :label="$t('common.operate')" fixed="right">
|
<template #default>
|
<!-- <el-button type="primary" size="small">修改</el-button> -->
|
|
<el-button type="warning" size="mini">{{
|
$t("common.edit")
|
}}</el-button>
|
<el-button type="danger" size="mini">{{
|
$t("common.delete")
|
}}</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div style="margin-top: 40px" class="pagination_box">
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page="currentPage"
|
:page-sizes="[10, 20, 30, 40]"
|
:page-size="10"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="1"
|
>
|
</el-pagination>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import MyBread from "../../components/MyBread.vue";
|
import { queryPageUser } from "../../api/api";
|
export default {
|
//import引入的组件需要注入到对象中才能使用
|
components: {
|
MyBread,
|
},
|
data() {
|
let validName = (rule, value, callback) => {
|
if (value === "") {
|
return callback(new Error("目录名称不能为空"));
|
} else {
|
callback();
|
}
|
};
|
return {
|
currentPage: 1,
|
form: {
|
username: "",
|
userStatus: "all",
|
requestIp: "",
|
},
|
tableData: [],
|
fullscreenLoading: false,
|
itemdetail: {},
|
formLabelWidth: "170px",
|
dialogFormVisible: false,
|
ruleForm: {
|
level: null,
|
orderNum: null,
|
pid: null,
|
name: "",
|
descr: "",
|
bak: "",
|
},
|
rules: {
|
name: [{ validator: validName, trigger: "blur" }],
|
},
|
};
|
},
|
methods: {
|
getUserInfo(params) {
|
// queryMaxId().then((res) => {
|
// this.id = res.data;
|
// });
|
queryPageUser({
|
pageIndex: 1,
|
pageSize: 10,
|
}).then((res) => {
|
if (res.code == 200) {
|
this.tableData = res.result;
|
} else {
|
console.log("接口报错");
|
}
|
});
|
},
|
// getUserInfo() {
|
// //获取目录树最大ID，新建节点使用
|
// // queryMaxId().then((res) => {
|
// // this.id = res.data;
|
// // });
|
// queryDepTree().then((res) => {
|
// if (res.status == 200) {
|
// this.depList = this.treeData(res.data.result);
|
// this.oriData = res.data.result;
|
// this.newData = res.data.result;
|
// } else {
|
// console.log("接口报错");
|
// }
|
// });
|
// },
|
|
handleSizeChange(val) {
|
console.log(`每页 ${val} 条`);
|
},
|
handleCurrentChange(val) {
|
console.log(`当前页: ${val}`);
|
},
|
onSubmit() {
|
console.log("submit!");
|
},
|
resetForm(formName) {
|
this.$refs[formName].resetFields();
|
},
|
showAddDialog() {
|
this.dialogTableVisible = true;
|
},
|
},
|
mounted() {
|
this.getUserInfo(1, 10);
|
},
|
};
|
</script>
|
<style>
|
/deep/ .el-table__fixed-right {
|
height: 100% !important;
|
}
|
</style>
|
<style lang="less" scoped>
|
//@import url(); 引入公共css类
|
.logLog_box {
|
background: rgb(240, 242, 245);
|
border-radius: 10px;
|
height: 100%;
|
padding: 10px;
|
box-sizing: border-box;
|
.el-input {
|
width: 300px;
|
}
|
.inquire {
|
height: 110px;
|
overflow: auto;
|
padding: 8px;
|
margin-top: 20px;
|
background: #fff;
|
border-radius: 5px;
|
border: 1px solid rgb(202, 201, 204);
|
margin-bottom: 20px;
|
.el-form-item {
|
margin: 5px;
|
}
|
}
|
.table_box {
|
height: 65%;
|
padding: 10px;
|
background: #fff;
|
border-radius: 5px;
|
border: 1px solid rgb(202, 201, 204);
|
}
|
.text-center {
|
text-align: center;
|
}
|
.select {
|
width: 300px;
|
}
|
}
|
/deep/ .el-card__header {
|
padding: 10px 10px !important;
|
}
|
/deep/ .el-dialog {
|
margin-top: 2vh !important;
|
}
|
/deep/ .el-dialog__wrapper {
|
overflow: hidden !important;
|
}
|
</style>
|
