<template>
|
<div class="userInfo_box">
|
<My-bread
|
:list="[
|
`${$t('operatManage.operatManage')}`,
|
`${$t('userManage.userManage')}`,
|
]"
|
></My-bread>
|
<el-divider />
|
|
<div class="inquire subpage_Div" ref="container">
|
<el-form ref="queryForm" :model="queryForm" :inline="true">
|
<div class="flex_box">
|
<div style="margin-right: auto">
|
<el-form-item
|
prop="depid"
|
:label="$t('userManage.userInfoObj.depName')"
|
>
|
<el-select
|
:popper-append-to-body="false"
|
v-model="queryForm.depName"
|
size="small"
|
placeholder="请选择"
|
style="width: 200px"
|
ref="treeSelect"
|
>
|
<el-option
|
:value="queryForm.depid"
|
:label="queryForm.depName"
|
style="height: auto"
|
>
|
<el-tree
|
ref="tree"
|
:data="treeOptions"
|
node-key="id"
|
:props="props"
|
@node-click="handleNodeClickto"
|
/>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
prop="uname"
|
:label="$t('userManage.userInfoObj.uname')"
|
>
|
<el-input
|
v-model="queryForm.uname"
|
size="small"
|
:placeholder="$t('userManage.userInfoObj.unamePlaceholder')"
|
style="width: 200px"
|
>
|
<i slot="suffix" class="el-icon-search" @click="queryInfo"></i>
|
</el-input>
|
</el-form-item>
|
</div>
|
<div>
|
<!-- <el-form-item>-->
|
<!-- <el-button-->
|
<!-- type="primary"-->
|
<!-- size="small"-->
|
<!-- @click="queryInfo('queryForm')"-->
|
<!-- icon="el-icon-search"-->
|
<!-- >-->
|
<!-- {{ $t("operatManage.ELM.search") }}-->
|
<!-- </el-button>-->
|
<!-- </el-form-item>-->
|
<el-form-item>
|
<el-button
|
v-if="menuStatus.insert"
|
type="success"
|
size="small"
|
@click="showAddDialog"
|
icon="el-icon-plus"
|
>
|
{{ $t("common.append") }}
|
</el-button>
|
</el-form-item>
|
<el-form-item v-show="setbatchFlag">
|
<el-button
|
v-if="menuStatus.update"
|
size="small"
|
@click="editPwd"
|
type="warning"
|
icon="el-icon-unlock"
|
>{{ $t("common.changepassWord") }}
|
</el-button>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
v-if="menuStatus.delete"
|
type="danger"
|
size="small"
|
@click="deleteUserInfo"
|
icon="el-icon-delete"
|
>
|
{{ $t("common.delete") }}
|
</el-button>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
type="info"
|
size="small"
|
@click="resetInfo('queryForm')"
|
icon="el-icon-refresh"
|
>
|
{{ $t("operatManage.ELM.reset") }}
|
</el-button>
|
</el-form-item>
|
</div>
|
</div>
|
</el-form>
|
</div>
|
<div class="dividing-line"></div>
|
<div class="table_box" :style="styleVar">
|
<el-table
|
ref="filterTable"
|
:data="tableData"
|
style="width: 100%"
|
border
|
class="table_height"
|
height="calc(100% - 45px)"
|
@selection-change="handleSelectionChange"
|
>
|
<el-table-column type="selection" width="55" />
|
<el-table-column
|
align="center"
|
type="index"
|
:label="$t('common.index')"
|
width="70px"
|
/>
|
|
<el-table-column
|
align="center"
|
prop="uname"
|
width="150px"
|
:label="$t('userManage.userInfoObj.uname')"
|
/>
|
<el-table-column
|
align="center"
|
prop="uid"
|
width="150px"
|
:label="$t('userManage.userInfoObj.uid')"
|
/>
|
<el-table-column
|
align="center"
|
prop="sex"
|
width="80px"
|
: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"
|
width="100px"
|
:label="$t('userManage.userInfoObj.natives')"
|
/>
|
<el-table-column
|
align="center"
|
prop="depName"
|
width="200px"
|
: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')"
|
width="80px"
|
v-if="menuStatus.update"
|
>
|
<template slot-scope="scope">
|
<el-button
|
type="warning"
|
plain
|
@click="editInfo(scope.row)"
|
size="small"
|
>{{ $t("common.update") }}</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div style="margin-top: 10px" class="pagination_box">
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page="currentPage"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="count"
|
>
|
</el-pagination>
|
</div>
|
</div>
|
|
<el-dialog
|
width="910px"
|
:title="
|
behavior == '新增用户'
|
? `${$t('common.append')}`
|
: `${$t('common.update')}`
|
"
|
:visible.sync="dialogFormVisible"
|
:before-close="handleClose"
|
:close-on-click-modal="false"
|
>
|
<div style="height: 500px; overflow: auto">
|
<el-form
|
:model="editForm"
|
ref="editForm"
|
:rules="rules"
|
style="display: flex"
|
>
|
<div>
|
<el-form-item
|
prop="uid"
|
:label="$t('userManage.userInfoObj.uid')"
|
v-if="behavior == '新增用户'"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.uid"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.uid')
|
"
|
></el-input>
|
<div class="isNewUser" v-if="isNewUser">
|
<img src="../../assets/img/success.png" />
|
{{ $t("userManage.userInfoObj.uid") }}
|
</div>
|
</el-form-item>
|
<el-form-item
|
v-if="behavior == '修改信息'"
|
:label="$t('userManage.userInfoObj.uid')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.uid"
|
autocomplete="off"
|
disabled
|
></el-input>
|
</el-form-item>
|
<!-- <el-form-item
|
v-if="behavior == '修改信息'"
|
prop="oldPwd"
|
:label="$t('userManage.userInfoObj.origpassword')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
type="password"
|
v-model="editForm.oldPwd"
|
autocomplete="off"
|
show-password
|
></el-input>
|
</el-form-item> -->
|
<!-- <el-form-item
|
prop="pwd"
|
v-if="behavior == '新增用户'"
|
:label="$t('userManage.userInfoObj.pwd')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
type="password"
|
v-model="editForm.pwd"
|
autocomplete="off"
|
show-password
|
></el-input>
|
</el-form-item> -->
|
<!-- <el-form-item
|
prop="checkPass"
|
v-if="behavior == '新增用户'"
|
:label="$t('userManage.userInfoObj.confirmPassword')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
type="password"
|
show-password
|
v-model="editForm.checkPass"
|
autocomplete="off"
|
></el-input>
|
</el-form-item> -->
|
<el-form-item
|
prop="uname"
|
:label="$t('userManage.userInfoObj.username')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.uname"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.username')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="sex"
|
:label="$t('userManage.userInfoObj.sex')"
|
:label-width="formLabelWidth"
|
>
|
<el-select
|
:popper-append-to-body="false"
|
v-model="editForm.sex"
|
clearable
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetree') +
|
$t('userManage.userInfoObj.sex')
|
"
|
>
|
<el-option
|
v-for="item in sexOpt"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
prop="natives"
|
:label="$t('userManage.userInfoObj.nativePlace')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.natives"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.nativePlace')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="depid"
|
:label-width="formLabelWidth"
|
:label="$t('userManage.userInfoObj.depName')"
|
>
|
<el-select
|
:popper-append-to-body="false"
|
v-model="editForm.depid"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetree') +
|
$t('userManage.userInfoObj.depName')
|
"
|
@focus="setOptionWidth"
|
>
|
<el-option
|
:value="editForm.depid"
|
:label="editForm.depName"
|
:style="{ width: selectOptionWidth, height: selectheight }"
|
>
|
<el-tree
|
ref="editcaderHandle"
|
:data="treeOptions"
|
:default-expand-all="defaultexpand"
|
node-key="id"
|
:props="defaultProps"
|
@node-click="handeditChange"
|
/>
|
</el-option>
|
</el-select>
|
<!-- <el-cascader
|
v-model="editForm.depid"
|
:options="treeOptions"
|
filterable
|
clearable
|
ref="editcaderHandle"
|
@change="editChange"
|
:show-all-levels="false"
|
:props="{
|
label: 'name',
|
value: 'id',
|
children: 'children',
|
checkStrictly: true,
|
emitPath: false,
|
}"
|
>
|
</el-cascader> -->
|
</el-form-item>
|
<el-form-item
|
prop="idcard"
|
:label="$t('userManage.userInfoObj.identityCard')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.idcard"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.identityCard')
|
"
|
></el-input>
|
</el-form-item>
|
</div>
|
<div style="width: 45%">
|
<el-form-item
|
prop="job"
|
:label="$t('userManage.userInfoObj.job')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.job"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.job')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="edu"
|
:label="$t('userManage.userInfoObj.edu')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.edu"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.edu')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="addr"
|
:label="$t('userManage.userInfoObj.addr')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.addr"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.addr')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="email"
|
:label="$t('userManage.userInfoObj.email')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.email"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.email')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="contact"
|
:label="$t('userManage.userInfoObj.contact')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.contact"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.contact')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="status"
|
:label="$t('userManage.userInfoObj.status')"
|
:label-width="formLabelWidth"
|
>
|
<el-select
|
:popper-append-to-body="false"
|
v-model="editForm.status"
|
clearable
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetree') +
|
$t('userManage.userInfoObj.status')
|
"
|
>
|
<el-option
|
v-for="item in statusOpt"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
prop="bak"
|
:label="$t('userManage.userInfoObj.remarks')"
|
:label-width="formLabelWidth"
|
>
|
<el-input
|
v-model="editForm.bak"
|
autocomplete="off"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('userManage.userInfoObj.remarks')
|
"
|
></el-input>
|
</el-form-item>
|
</div>
|
</el-form>
|
</div>
|
<div v-if="behavior == '修改信息'" slot="footer" class="dialog-footer">
|
<el-button size="small" type="info" @click="cancelEdit()">{{
|
$t("common.reset")
|
}}</el-button>
|
<el-button
|
size="small"
|
type="primary"
|
@click="sendEdit('editForm')"
|
v-loading.fullscreen.lock="fullscreenLoading"
|
>{{ $t("common.submit") }}</el-button
|
>
|
</div>
|
<div v-else slot="footer" class="dialog-footer">
|
<el-button size="small" type="info" @click="cancelAdd('editForm')">{{
|
$t("common.reset")
|
}}</el-button>
|
<el-button
|
size="small"
|
type="primary"
|
@click="sendAdd('editForm')"
|
v-loading.fullscreen.lock="fullscreenLoading"
|
>{{ $t("common.submit") }}</el-button
|
>
|
</div>
|
</el-dialog>
|
<el-dialog
|
:title="$t('common.changepassWord')"
|
:visible.sync="resetPwd"
|
:before-close="handleClose"
|
:close-on-click-modal="false"
|
>
|
<el-form
|
:model="pwdForm"
|
ref="pwdForm"
|
:rules="rules"
|
label-position="top"
|
>
|
<el-form-item
|
prop="adminPwd"
|
:label="$t('common.AdminPassword')"
|
label-width="140px"
|
>
|
<el-input
|
type="password"
|
v-model="pwdForm.adminPwd"
|
autocomplete="off"
|
show-password
|
style="width: 85%"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') +
|
$t('common.AdminPassword')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="newPwd"
|
:label="$t('common.NPassword')"
|
label-width="140px"
|
>
|
<el-input
|
type="password"
|
v-model="pwdForm.newPwd"
|
autocomplete="off"
|
show-password
|
style="width: 85%"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') + $t('common.NPassword')
|
"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
prop="checkPwd"
|
:label="$t('common.SPassword')"
|
label-width="140px"
|
>
|
<el-input
|
type="password"
|
v-model="pwdForm.checkPwd"
|
autocomplete="off"
|
show-password
|
style="width: 85%"
|
:placeholder="
|
$t('shuJuGuanLi.shuJuJianSuo.valuetwo') + $t('common.SPassword')
|
"
|
></el-input>
|
</el-form-item>
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
<el-button size="small" type="info" @click="cancelReset - 'pwdForm'">{{
|
$t("common.reset")
|
}}</el-button>
|
<el-button
|
size="small"
|
type="primary"
|
@click="sendReset('pwdForm')"
|
v-loading.fullscreen.lock="fullscreenLoading"
|
>{{ $t("common.submit") }}</el-button
|
>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
var encrypt = new JSEncrypt();
|
import { mapActions } from "vuex";
|
import MyBread from "../../components/MyBread.vue";
|
import {
|
queryDepTree,
|
queryPageUser,
|
insertUser,
|
deleteUser,
|
updateUser,
|
updatePwd,
|
selectByUserid,
|
userSelectForIsAdmin,
|
} from "../../api/api";
|
export default {
|
//import引入的组件需要注入到对象中才能使用
|
components: {
|
MyBread,
|
},
|
data() {
|
let validName = (rule, value, callback) => {
|
if (value === "" || value === null || value === undefined) {
|
return callback(new Error("请输入密码"));
|
} else {
|
callback();
|
}
|
};
|
let validatePass = (rule, value, callback) => {
|
if (value === "" || value === undefined) {
|
callback(new Error("请再次输入密码"));
|
} else if (value !== this.editForm.pwd) {
|
callback(new Error("两次输入密码不一致!"));
|
} else {
|
callback();
|
}
|
};
|
let resetPass = (rule, value, callback) => {
|
if (value === "" || value === undefined) {
|
callback(new Error("请再次输入密码"));
|
} else if (value !== this.pwdForm.newPwd) {
|
callback(new Error("两次输入密码不一致!"));
|
} else {
|
callback();
|
}
|
};
|
return {
|
props: {
|
label: "name",
|
value: "id",
|
children: "children",
|
checkStrictly: true,
|
emitPath: false,
|
},
|
setbatchFlag: false,
|
menuStatus: {
|
delete: false,
|
insert: false,
|
update: false,
|
},
|
isNewUser: false,
|
currentPage: 1,
|
pageSize: 10,
|
pageIndex: 1,
|
defaultProps: {
|
children: "children",
|
label: "name",
|
},
|
queryForm: {
|
uname: "",
|
depid: null,
|
depName: "",
|
},
|
tableData: [],
|
fullscreenLoading: false,
|
count: 0,
|
formLabelWidth: "100px",
|
dialogFormVisible: false,
|
initialForm: "",
|
behavior: "",
|
multipleSelection: [],
|
resetPwd: false,
|
editForm: {
|
uid: "",
|
uname: "",
|
oldPwd: "",
|
pwd: "",
|
checkPass: "",
|
sex: null,
|
natives: "",
|
depid: null,
|
idcard: "",
|
job: "",
|
edu: "",
|
addr: "",
|
email: "",
|
contact: "",
|
status: null,
|
bak: "",
|
salt: "",
|
},
|
pwdForm: {
|
adminPwd: "",
|
newPwd: "",
|
checkPwd: "",
|
ids: [],
|
},
|
treeOptions: [],
|
statusOpt: [
|
{
|
value: 0,
|
label: "正常",
|
},
|
{
|
value: 1,
|
label: "禁用",
|
},
|
{
|
value: 2,
|
label: "删除",
|
},
|
{
|
value: 3,
|
label: "申请",
|
},
|
{
|
value: 4,
|
label: "拒批",
|
},
|
],
|
depList: [],
|
sexOpt: [
|
{
|
value: 0,
|
label: "女",
|
},
|
{
|
value: 1,
|
label: "男",
|
},
|
{
|
value: -1,
|
label: "未知",
|
},
|
],
|
rules: {
|
uid: [
|
{ required: true, validator: validName, trigger: "blur" },
|
{
|
trigger: "blur",
|
validator: (rule, value, callback) => {
|
// var reg = new RegExp(/^[a-zA-Z0-9_]{0,15}$/); //字符串正则表达式 4到14位（字母，数字，下划线，减号）
|
// if (!reg.test(value)) {
|
// callback(
|
// new Error("账号必须由字母，数字或下划线,长度不得超过16位")
|
// );
|
// } else {
|
// selectByUserid({ uid: value }).then((res) => {
|
// if (res.result != null) {
|
// this.isNewUser = false;
|
// callback(new Error("账号已存在"));
|
// } else {
|
// this.isNewUser = true;
|
// callback();
|
// }
|
// });
|
// }
|
},
|
},
|
],
|
pwd: [
|
{
|
required: true,
|
message: "请输入密码",
|
transform: (value) => value,
|
trigger: "blur",
|
},
|
{
|
type: "string",
|
message: "请输入不包含空格的字符",
|
trigger: "blur",
|
transform(value) {
|
if (value && value.indexOf(" ") === -1) {
|
return value;
|
} else {
|
return false;
|
}
|
},
|
},
|
{
|
trigger: "blur",
|
validator: (rule, value, callback) => {
|
var regex = new RegExp("");
|
var passwordreg =
|
/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W!@#$%^&*`~()\\-_+=,.?;<>]+$)(?![a-z0-9]+$)(?![a-z\W!@#$%^&*`~()\\-_+=,.?;<>]+$)(?![0-9\W!@#$%^&*`~()\\-_+=,.?;<>]+$)[a-zA-Z0-9\W!@#$%^&*`~()\\-_+=,.?;<>]{13,20}$/;
|
// if (!passwordreg.test(value)) {
|
// callback(
|
// new Error("密码必须由数字、字母、特殊字符组合,请输入13-20位")
|
// );
|
// } else {
|
// callback();
|
// }
|
callback();
|
},
|
},
|
],
|
checkPass: [
|
{ required: true, validator: validatePass, trigger: "blur" },
|
],
|
adminPwd: [{ validator: validName, trigger: "blur" }],
|
newPwd: [
|
{
|
message: "请输入密码",
|
transform: (value) => value,
|
trigger: "blur",
|
},
|
{
|
type: "string",
|
message: "请输入不包含空格的字符",
|
trigger: "blur",
|
transform(value) {
|
if (value && value.indexOf(" ") === -1) {
|
return value;
|
} else {
|
return false;
|
}
|
},
|
},
|
{
|
trigger: "blur",
|
validator: (rule, value, callback) => {
|
var regex = new RegExp("");
|
var passwordreg =
|
/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W!@#$%^&*`~()\\-_+=,.?;<>]+$)(?![a-z0-9]+$)(?![a-z\W!@#$%^&*`~()\\-_+=,.?;<>]+$)(?![0-9\W!@#$%^&*`~()\\-_+=,.?;<>]+$)[a-zA-Z0-9\W!@#$%^&*`~()\\-_+=,.?;<>]{8,20}$/;
|
// if (!passwordreg.test(value)) {
|
// callback(
|
// new Error("密码必须由数字、字母、特殊字符组合,请输入8-20位")
|
// );
|
// } else {
|
// callback();
|
// }
|
callback();
|
},
|
},
|
],
|
checkPwd: [{ validator: resetPass, trigger: "blur" }],
|
},
|
defaultProps: {
|
children: "children",
|
label: "name",
|
},
|
selectOptionWidth: "",
|
selectheight: "auto",
|
defaultexpand: false,
|
tableHeight: 0,
|
timer: 0,
|
styleVar: {
|
height: "calc(100% - 109px)",
|
},
|
};
|
},
|
watch: {
|
"queryForm.depName"() {
|
this.$refs.treeSelect.visible = false;
|
},
|
},
|
beforeDestroy() {
|
this.timer && clearTimeout(this.timer);
|
window.removeEventListener("resize", this.onResize);
|
},
|
methods: {
|
onResize() {
|
this.timer && clearTimeout(this.timer);
|
this.timer = setTimeout(() => {
|
this.calHeight();
|
}, 500);
|
},
|
calHeight() {
|
this.$nextTick(() => {
|
const rect = this.$refs.container.getBoundingClientRect();
|
this.tableHeight = `${rect.height + 97}px`;
|
this.styleVar["height"] = `calc(100% - ${rect.height + 30}px)`;
|
});
|
},
|
...mapActions(["login", "getpublickey"]),
|
getUserInfo() {
|
this.pageSize = 10;
|
this.currentPage = 1;
|
queryDepTree()
|
.then((res) => {
|
if (res.code == 200) {
|
this.depList = this.treeData(res.result);
|
this.treeOptions = this.treeData(res.result);
|
this.queryForm.depName = this.depList[0].name;
|
this.queryInfo.depid = this.depList[0].id;
|
this.queryInfo();
|
} else {
|
this.$notify.error({
|
title: res.code,
|
message: res.result,
|
});
|
}
|
})
|
.catch((res) => {});
|
|
queryPageUser({
|
pageIndex: 1,
|
pageSize: 10,
|
})
|
.then((res) => {
|
if (res.code == 200) {
|
this.tableData = res.result;
|
this.count = res.count;
|
} else {
|
this.$notify.error({
|
title: res.code,
|
message: res.result,
|
});
|
}
|
})
|
.catch((res) => {});
|
},
|
treeData(source) {
|
let cloneData = JSON.parse(JSON.stringify(source)); // 对源数据深度克隆
|
return cloneData.filter((father) => {
|
// 循环所有项
|
let branchArr = cloneData.filter((child) => father.id == child.pid); // 对比ID，分别上下级菜单，并返回数据
|
branchArr.length > 0 ? (father.children = branchArr) : ""; // 给父级添加一个children属性，并赋值
|
return father.pid == 0; // 返回一级菜单
|
});
|
},
|
|
handleNodeClickto(data, node, nodeData) {
|
this.queryForm.depid = data.code;
|
this.queryForm.depName = data.name;
|
},
|
//搜索按钮
|
queryInfo() {
|
let searchData = {
|
uname: this.queryForm.uname.trim(),
|
depcode: this.queryForm.depid,
|
pageIndex: this.pageIndex,
|
pageSize: this.pageSize,
|
};
|
queryPageUser(searchData).then((res) => {
|
if (res.code == 200) {
|
this.tableData = res.result;
|
this.count = res.count;
|
} else {
|
this.$notify.error({
|
title: res.code,
|
message: res.result,
|
});
|
}
|
});
|
},
|
//重置按钮
|
resetInfo(formName) {
|
this.$refs[formName].resetFields();
|
this.queryForm.depName = this.depList[0].name;
|
this.queryInfo.depid = this.depList[0].id;
|
this.queryInfo();
|
},
|
//新增按钮
|
showAddDialog() {
|
this.behavior = "新增用户";
|
this.editForm = {};
|
this.dialogFormVisible = true;
|
},
|
cancelAdd(formName) {
|
this.editForm = {};
|
this.isNewUser = false;
|
this.$refs[formName].resetFields();
|
},
|
sendAdd(formName) {
|
this.$refs[formName].validate((valid) => {
|
if (valid) {
|
// console.log(this.$store.state.key);
|
encrypt.setPublicKey(this.$store.state.key);
|
this.editForm.uid = encrypt.encrypt(this.editForm.uid);
|
this.editForm.pwd = encrypt.encrypt(this.editForm.pwd);
|
this.fullscreenLoading = true;
|
delete this.editForm.checkPass;
|
delete this.editForm.oldPwd;
|
insertUser(this.editForm)
|
.then((res) => {
|
setTimeout(() => {
|
this.fullscreenLoading = false;
|
if (res.code == 200) {
|
this.getUserInfo();
|
this.$message({
|
message: "添加成功",
|
type: "success",
|
});
|
this.editForm = {};
|
this.dialogFormVisible = false;
|
}
|
}, 500);
|
})
|
.catch((res) => {
|
this.fullscreenLoading = false;
|
});
|
} else {
|
return false;
|
}
|
});
|
},
|
//多选
|
handleSelectionChange(val) {
|
this.multipleSelection = val;
|
},
|
//删除按钮
|
deleteUserInfo() {
|
var blackTheme;
|
if (this.$store.state.themeflag == true) {
|
blackTheme = {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
customClass: "Black_theme",
|
};
|
} else {
|
blackTheme = {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
};
|
}
|
this.$confirm("此操作将删除已选中的用户, 是否继续?", "提示", blackTheme)
|
.then(() => {
|
var std = [];
|
for (var i in this.multipleSelection) {
|
std.push(this.multipleSelection[i].id);
|
}
|
deleteUser({ ids: std.toString() })
|
.then((res) => {
|
if (res.code == 200) {
|
this.$message({
|
type: "success",
|
message: "删除成功!",
|
});
|
this.multipleSelection = [];
|
this.getUserInfo();
|
} else {
|
this.$message.error("删除失败");
|
}
|
})
|
.catch(() => {
|
this.$message.error("删除失败");
|
this.multipleSelection = [];
|
});
|
})
|
.catch(() => {
|
this.$message("已取消删除");
|
});
|
},
|
//重置密码
|
editPwd() {
|
var std = [];
|
for (var i in this.multipleSelection) {
|
std.push(this.multipleSelection[i].id);
|
}
|
|
if (std.length == 0) {
|
alert("请先选择用户");
|
return;
|
}
|
this.pwdForm.ids = std;
|
this.resetPwd = true;
|
},
|
cancelReset(formName) {
|
this.$refs[formName].resetFields();
|
this.pwdForm.ids = [];
|
},
|
sendReset(formName) {
|
this.$refs[formName].validate((valid) => {
|
if (valid) {
|
encrypt.setPublicKey(this.$store.state.key);
|
var data = {
|
adminPwd: encrypt.encrypt(this.pwdForm.adminPwd),
|
newPwd: encrypt.encrypt(this.pwdForm.newPwd),
|
ids: this.pwdForm.ids,
|
};
|
this.fullscreenLoading = true;
|
updatePwd(data)
|
.then((res) => {
|
setTimeout(() => {
|
this.fullscreenLoading = false;
|
if (res.code == 200) {
|
this.$message({
|
message: "修改成功",
|
type: "success",
|
});
|
this.pwdForm = {
|
adminPwd: "",
|
newPwd: "",
|
checkPwd: "",
|
ids: [],
|
};
|
this.multipleSelection = [];
|
this.resetPwd = false;
|
|
this.getUserInfo();
|
} else {
|
this.$message({
|
message: res.msg,
|
type: "error",
|
});
|
}
|
}, 500);
|
})
|
.catch((res) => {
|
alert("修改失败，请重试！");
|
this.fullscreenLoading = false;
|
});
|
} else {
|
return false;
|
}
|
});
|
},
|
//编辑按钮
|
editInfo(row) {
|
delete row.updateTime;
|
delete row.updateUser;
|
|
this.initialForm = JSON.stringify(row);
|
this.behavior = "修改信息";
|
this.editForm = JSON.parse(JSON.stringify(row));
|
this.dialogFormVisible = true;
|
},
|
//编辑选择单位
|
editChange(value) {
|
this.editForm.depid = value;
|
this.$refs.editcaderHandle.dropDownVisible = false;
|
},
|
handeditChange(data, node, nodeData) {
|
this.$set(this.editForm, "depid", data.id);
|
this.$set(this.editForm, "depName", data.name);
|
this.$set(this.editForm, "depcode", data.code);
|
this.$refs.editcaderHandle.dropDownVisible = false;
|
},
|
//关闭弹出框
|
handleClose(done) {
|
var blackTheme;
|
if (this.$store.state.themeflag == true) {
|
blackTheme = {
|
customClass: "Black_theme",
|
};
|
}
|
|
this.$confirm("确认关闭？", blackTheme)
|
.then((_) => {
|
this.editForm = {
|
uid: "",
|
uname: "",
|
oldPwd: "",
|
pwd: "",
|
checkPass: "",
|
sex: null,
|
natives: "",
|
depid: null,
|
idcard: "",
|
job: "",
|
edu: "",
|
addr: "",
|
email: "",
|
contact: "",
|
status: null,
|
bak: "",
|
salt: "",
|
};
|
this.pwdForm = {
|
adminPwd: "",
|
newPwd: "",
|
checkPwd: "",
|
ids: [],
|
};
|
|
done();
|
})
|
.catch((_) => {});
|
},
|
//提交编辑
|
sendEdit(formName) {
|
this.$refs[formName].validate((valid) => {
|
if (valid) {
|
// encrypt.setPublicKey(this.$store.state.key);
|
// this.editForm.uid = this.editForm.uid;
|
// this.editForm.salt = null;
|
// this.editForm.pwd = null;
|
// this.editForm.salt = encrypt.encrypt(this.editForm.pwd);
|
// // this.editForm.pwd = encrypt.encrypt(this.editForm.oldPwd);
|
// this.fullscreenLoading = true;
|
// delete this.editForm.checkPass;
|
// delete this.editForm.oldPwd;
|
// this.editForm.salt = this.editForm.pwd;
|
|
updateUser(this.editForm)
|
.then((res) => {
|
setTimeout(() => {
|
this.fullscreenLoading = false;
|
if (res.code == 200) {
|
this.getUserInfo();
|
this.$message({
|
message: "修改成功",
|
type: "success",
|
});
|
this.editForm = {};
|
this.dialogFormVisible = false;
|
}
|
}, 500);
|
})
|
.catch((res) => {
|
alert("修改失败，请重试！");
|
this.fullscreenLoading = false;
|
});
|
} else {
|
console.log("error submit!!");
|
return false;
|
}
|
});
|
},
|
cancelEdit() {
|
this.$nextTick(() => {
|
this.editForm = JSON.parse(this.initialForm);
|
});
|
},
|
|
handleSizeChange(val) {
|
// console.log(`每页 ${val} 条`);
|
this.pageSize = val;
|
this.queryInfo();
|
},
|
handleCurrentChange(val) {
|
// console.log(`当前页: ${val}`);
|
this.pageIndex = val;
|
this.currentPage = val;
|
this.queryInfo();
|
},
|
showPermsMenu(res) {
|
switch (res.tag) {
|
case "/delete":
|
this.menuStatus.delete = true;
|
break;
|
case "/insert":
|
this.menuStatus.insert = true;
|
break;
|
case "/update":
|
this.menuStatus.update = true;
|
break;
|
}
|
},
|
async getIsAdmin() {
|
const data = await userSelectForIsAdmin();
|
if (data.code != 200) {
|
this.setbatchFlag = false;
|
return;
|
}
|
this.setbatchFlag = data.result;
|
},
|
setOptionWidth(event) {
|
// 下拉框聚焦，设置弹框的宽度
|
this.$nextTick(() => {
|
this.selectOptionWidth = event.srcElement.offsetWidth + "px";
|
});
|
},
|
},
|
|
mounted() {
|
this.getIsAdmin();
|
this.getUserInfo();
|
this.getpublickey();
|
window.addEventListener("resize", this.onResize);
|
this.calHeight();
|
},
|
created() {
|
var val = this.$store.state.currentPerms;
|
var permsEntity = this.$store.state.permsEntity;
|
for (var i = 0; i < permsEntity.length; i++) {
|
if (permsEntity[i].perms == val) {
|
this.showPermsMenu(permsEntity[i]);
|
}
|
}
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
//@import url(); 引入公共css类
|
.userInfo_box {
|
height: 98%;
|
width: 98%;
|
padding: 0.5%;
|
|
.el-input {
|
width: 300px;
|
}
|
.inquire {
|
position: relative;
|
height: auto;
|
|
//padding: 10px;
|
//margin-top: 20px;
|
|
border-radius: 5px;
|
|
//margin-bottom: 20px;
|
.el-form-item {
|
margin: 5px;
|
}
|
}
|
|
// .table_height{
|
// // max-height: 80%;
|
|
// min-height:70%;
|
// }
|
.el-dialog {
|
.el-form-item {
|
margin-bottom: 20px;
|
// width: 48%;
|
/deep/.el-form-item__error {
|
width: 300px;
|
}
|
.isNewUser {
|
display: inline-block;
|
width: 75px;
|
margin-left: 5px;
|
img {
|
width: 1em;
|
}
|
}
|
.el-cascader,
|
.el-select {
|
width: 300px;
|
}
|
}
|
}
|
}
|
</style>
|
