<template>
|
<div class="params-container">
|
<el-form
|
class="params-dialog formDataBox bg-white"
|
:model="formData"
|
:rules="rules"
|
ref="formDataBox"
|
label-width="80px"
|
>
|
<div class="staff">
|
<p><span class="iconfont el-icon-duoyonghu"></span> 员工基本信息</p>
|
<div class="table-row">
|
<el-form-item label="维护区:" class="table-cell">
|
<el-select
|
v-model="formData.udepartment"
|
size="mini"
|
placeholder="请选择维护区"
|
class="width_140"
|
>
|
<el-option
|
v-for="(item, key) in udepartmentList"
|
:key="'key' + key"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="姓名:" class="table-cell" prop="uname">
|
<el-input
|
class="width_140"
|
v-model="formData.uname"
|
size="mini"
|
placeholder="请输入姓名"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
label="密码:"
|
class="table-cell"
|
prop="upassword"
|
v-if="status == 'add'"
|
>
|
<el-input
|
class="width_140"
|
v-model="formData.upassword"
|
type="password"
|
size="mini"
|
placeholder="请输入密码"
|
></el-input>
|
</el-form-item>
|
<div class="clear" v-if="status == 'add'"></div>
|
<el-form-item label="性别:" class="table-cell">
|
<el-select
|
class="width_140"
|
v-model="formData.usex"
|
size="mini"
|
placeholder="请选择性别"
|
>
|
<el-option label="男" value="男"></el-option>
|
<el-option label="女" value="女"></el-option>
|
</el-select>
|
</el-form-item>
|
<div class="clear" v-if="status == 'edit'"></div>
|
<el-form-item label="手机:" class="table-cell" prop="umobilephone">
|
<el-input
|
class="width_140"
|
v-model="formData.umobilephone"
|
size="mini"
|
placeholder="请输入手机"
|
>
|
</el-input>
|
</el-form-item>
|
|
<el-form-item label="邮箱:" class="table-cell">
|
<el-input
|
class="width_140"
|
v-model="formData.uemail"
|
size="mini"
|
placeholder="请输入邮箱"
|
>
|
</el-input>
|
</el-form-item>
|
<div class="clear" v-if="status == 'add'"></div>
|
<el-form-item label="工作班组:" class="table-cell">
|
<el-select
|
v-model="formData.ujobGroup"
|
size="mini"
|
placeholder="请选择工作班组"
|
class="width_140"
|
>
|
<el-option
|
v-for="(item, key) in ujobGroupList"
|
:key="'key' + key"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<div class="clear"></div>
|
<el-form-item label="用户角色:" class="table-cell">
|
<el-select
|
v-model="formData.urole"
|
size="mini"
|
placeholder="请选择用户角色"
|
@change="changeRole"
|
class="width_140"
|
>
|
<el-option
|
v-for="(item, key) in uroleList"
|
:key="'key' + key"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="用户类型:" class="table-cell">
|
<el-select
|
v-model="formData.type"
|
size="mini"
|
placeholder="请选择用户类型"
|
class="width_140"
|
>
|
<el-option
|
v-for="(item, key) in type"
|
:key="'key' + key"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item
|
label="过期时间:"
|
class="table-cell"
|
v-if="formData.type == 2"
|
>
|
<el-date-picker
|
v-model="expirationTime"
|
type="datetime"
|
size="mini"
|
:start-placeholder="startTime"
|
placeholder="选择日期时间"
|
>
|
</el-date-picker>
|
</el-form-item>
|
<div class="clear" v-if="formData.type == 2"></div>
|
<el-form-item
|
label="用户权限:"
|
class="table-cell"
|
prop="permitGroupId"
|
v-if="status == 'add'"
|
>
|
<el-select
|
v-model="formData.permitGroupId"
|
size="mini"
|
placeholder="请选择用户权限组"
|
class="width_140"
|
@change="changePermitGroup"
|
:disabled="!isCanChangePower"
|
>
|
<el-option
|
v-for="(item, key) in groupList"
|
:key="'key' + key"
|
:label="item.txt"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<div class="clear"></div>
|
<el-form-item
|
label="访问控制时间:"
|
class="table-cell"
|
prop="visitTime"
|
v-if="isSysAdmin"
|
>
|
<el-time-picker
|
popper-class="white-bg"
|
is-range
|
size="mini"
|
arrow-control
|
v-model="rangeTime"
|
range-separator="至"
|
start-placeholder="开始时间"
|
end-placeholder="结束时间"
|
placeholder="选择时间范围"
|
@change="timeChange"
|
>
|
</el-time-picker>
|
</el-form-item>
|
<el-form-item label="IP白名单:" prop="visitIp" v-if="isSysAdmin">
|
<el-input
|
type="textarea"
|
:rows="6"
|
placeholder="请输入内容"
|
resize="none"
|
v-model="formData.visitIp"
|
>
|
</el-input>
|
</el-form-item>
|
</div>
|
<!-- <div class="clear" v-if="status == 'edit'"></div> -->
|
<!-- <el-form-item label="身份证号:" class="table-cell">
|
<el-input class="width_140" v-model="formData.ushenFenId" size="mini" placeholder="请输入身份证号"></el-input>
|
</el-form-item> -->
|
<!-- <el-form-item label="员工编号:" class="table-cell">
|
<el-input class="width_140" v-model="formData.uemployeeId" size="mini" placeholder="请输入员工编号"></el-input>
|
</el-form-item> -->
|
<!-- <div class="clear" style="clear:both" v-if="status == 'add'"></div> -->
|
<!-- <el-form-item label="出生日期:" class="table-cell" prop="ubirthDay">
|
<el-date-picker class="width_140" v-model="formData.ubirthDay" size="mini" type="date" placeholder="选择日期"> </el-date-picker>
|
</el-form-item> -->
|
</div>
|
<!-- <div class="staff">
|
<p> <span class="iconfont el-icon-icon-sms"></span> 员工联系方式</p>
|
<div class="table-row">
|
<el-form-item label="电话:" class="table-cell">
|
<el-input class="width_140" v-model="formData.utelephone" size="mini" placeholder="请输入电话"></el-input>
|
</el-form-item>
|
<el-form-item label="手机:" class="table-cell" prop="umobilephone">
|
<el-input class="width_140" v-model="formData.umobilephone" size="mini" placeholder="请输入手机"></el-input>
|
</el-form-item>
|
<el-form-item label="邮箱:" class="table-cell">
|
<el-input class="width_140" v-model="formData.uemail" size="mini" placeholder="请输入邮箱"></el-input>
|
</el-form-item>
|
<div class="clear" style="clear:both"></div>
|
<el-form-item label="地址:" class="table-cell">
|
<el-input class="width_140" v-model="formData.uaddr" size="mini" placeholder="请输入地址"></el-input>
|
</el-form-item>
|
</div>
|
</div> -->
|
<!-- <div class="staff">
|
<p> <span class="iconfont el-icon-yanjiangzhe"></span> 员工工作内容</p>
|
<div class="table-row">
|
<el-form-item label="职称:" class="table-cell">
|
<el-input class="width_140" v-model="formData.uproTitle" size="mini" placeholder="请输入职称"></el-input>
|
</el-form-item>
|
|
<el-form-item label="备注:" class="table-cell">
|
<el-input class="width_140" v-model="formData.unote" size="mini" placeholder="请输入备注"></el-input>
|
</el-form-item>
|
|
<el-form-item label="工作内容:" class="table-cell">
|
<el-input class="width_140" v-model="formData.utasks" size="mini" placeholder="请输入工作内容"></el-input>
|
</el-form-item>
|
<div class="clear:both"></div>
|
<el-form-item label="工作职责:" class="table-cell">
|
<el-input class="width_140" v-model="formData.uduties" size="mini" placeholder="请输入工作职责"></el-input>
|
</el-form-item>
|
<el-form-item label="权限描述:" class="table-cell">
|
<el-input class="width_140" v-model="formData.uauthority" size="mini" placeholder="请输入权限描述"></el-input>
|
</el-form-item>
|
|
<el-form-item label="工作班组:" class="table-cell">
|
<el-select v-model="formData.ujobGroup" size="mini" placeholder="请选择工作班组" class="width_140">
|
<el-option
|
v-for="item in ujobGroupList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<div class="clear:both"></div>
|
<el-form-item label="是否包机人:" class="table-cell">
|
<el-select v-model="formData.ubaojiusr" size="mini" placeholder="请选择是否包机人" class="width_140">
|
<el-option label="是" :value="1"></el-option>
|
<el-option label="否" :value="0"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="入职日期:" class="table-cell" prop="UAccessionDay">
|
<el-date-picker class="width_140" v-model="formData.UAccessionDay" size="mini" type="date" placeholder="选择入职日期"> </el-date-picker>
|
</el-form-item>
|
</div>
|
</div> -->
|
<div class="btn_box">
|
<el-button size="small" @click="cancelOpen">取 消</el-button>
|
<el-button size="small" type="primary" @click="confirmOpen"
|
>确 定</el-button
|
>
|
<!-- <el-button size="small" v-if="status == 'edit'" type="primary" @click="updateLicense">更新license</el-button> -->
|
</div>
|
</el-form>
|
<el-dialog :visible.sync="dialog"> </el-dialog>
|
</div>
|
</template>
|
<script>
|
import { searchProvince } from "../../assets/js/api";
|
import {
|
groupAndUserListOfCurrentUser,
|
user,
|
getPermitGroupList,
|
} from "./apis/apis";
|
import { testVal } from "@/assets/js/tools";
|
import RSA from "@/assets/js/tools/RSA";
|
import const_user from "@/assets/js/const/const_user";
|
import const_rules from "@/assets/js/const/const_rules";
|
import formatPassword from "@/assets/js/tools/formatPassword";
|
import { isHasPermit, getLabelByValue } from "@/assets/js/tools";
|
|
export default {
|
name: "addEdit",
|
props: ["status", "opt", "index", "seft"],
|
data() {
|
let userId = sessionStorage.getItem("userPowerGroup");
|
let constRules = const_rules;
|
let permits = this.$store.state.user.permits;
|
let isCanChangePower = isHasPermit("permit_edit_permit", permits);
|
return {
|
permitGroupBakup: '',
|
isCanChangePower,
|
expirationTime: new Date(),
|
startTime: new Date().format("yyyy-MM-dd hh:mm:ss"),
|
userId: userId,
|
dialog: false,
|
udepartmentList: [],
|
ujobGroupList: [],
|
uroleList: const_user.roleList,
|
type: const_user.type,
|
formData: {
|
uid: this.opt.uid || 0,
|
upassword: this.opt.upassword || "",
|
usnId: this.opt.usnId || "",
|
uname: this.opt.uname || "",
|
ushenFenId: this.opt.ushenFenId || "",
|
utelephone: this.opt.utelephone || "",
|
uemail: this.opt.uemail || "",
|
uaddr: this.opt.uaddr || "",
|
// ubirthDay:
|
// this.opt.ubirthDay || new Date().format("yyyy-MM-dd hh:mm:ss"),
|
// uaccessionDay:
|
// this.opt.uaccessionDay || new Date().format("yyyy-MM-dd hh:mm:ss"),
|
usex: this.opt.usex || "",
|
udepartment: this.opt.udepartment || "",
|
uproTitle: this.opt.uproTitle || "",
|
ujobGroup: this.opt.ujobGroup || "",
|
uduties: this.opt.uduties || "",
|
utasks: this.opt.utasks || "",
|
ubaojiusr: this.opt.ubaojiusr || 0,
|
unote: this.opt.unote || "",
|
uauthority: this.opt.uauthority || "",
|
umobilephone: this.opt.umobilephone || "",
|
uemployeeId: this.opt.uemployeeId || "",
|
type: this.opt.type || 1,
|
status: this.opt.status || 1,
|
urole: 0,
|
expirationTime: this.opt.expirationTime || null,
|
permitGroupId: this.opt.permitGroupId || "", // 用户所在权限组
|
visitTime: this.opt.visitTime || "00:00:01~23:59:59", // 默认值 全天
|
visitIp: this.opt.visitIp || "*", // 允许访问的IP * 代表全部
|
},
|
groupList: [],
|
rangeTime: ["2016-10-1 00:00:01", "2016-10-1 23:59:59"],
|
rules: {
|
uname: [
|
{
|
required: true,
|
message: "请输入姓名",
|
trigger: "blur",
|
},
|
],
|
upassword: [
|
{
|
required: true,
|
message: "请输入密码",
|
trigger: "blur",
|
},
|
],
|
ubirthDay: [
|
{
|
required: true,
|
message: "请选择出生日期",
|
trigger: "blur",
|
},
|
],
|
umobilephone: [
|
{
|
required: true,
|
message: "请输入手机",
|
trigger: "blur",
|
},
|
{
|
min: 11,
|
max: 11,
|
message: "请输入正确的手机号",
|
trigger: "blur",
|
},
|
],
|
uaccessionDay: [
|
{
|
required: true,
|
message: "请选择入职日期",
|
trigger: "blur",
|
},
|
],
|
visitIp: [
|
{
|
validator(rule, value, callback) {
|
testVal(rule, value, callback, constRules.isWhiteIp);
|
},
|
trigger: "change",
|
},
|
],
|
permitGroupId: [
|
{
|
required: true,
|
message: "请选择用户权限组",
|
trigger: "blur",
|
},
|
],
|
},
|
};
|
},
|
computed: {
|
isSysAdmin() {
|
return this.userId == 1 ? true : false;
|
},
|
isSxty() {
|
return this.$CFG.clientName.name === "sxty";
|
}
|
},
|
mounted() {
|
this.queryWhq(); //维护区
|
this.queryGzbz(); //工作班组
|
this.searchGroup(); // 查询权限组
|
if (this.status == "add") {
|
this.formData.urole = 2;
|
if (this.isSxty) {
|
this.formData.permitGroupId = 210002;
|
this.permitGroupBakup = 210002;
|
}
|
} else {
|
this.formData.urole = this.opt.urole;
|
this.formData.visitTime = this.opt.visitTime;
|
this.formData.visitIp = this.opt.visitIp;
|
this.formData.permitGroupId = 100;
|
let times = this.opt.visitTime.split("~");
|
this.rangeTime = [
|
new Date("2016-10-1 " + times[0]),
|
new Date("2016-10-1 " + times[1]),
|
];
|
}
|
},
|
methods: {
|
searchGroup() {
|
// 查询用户权限
|
getPermitGroupList()
|
.then((res) => {
|
const permitGroupId = sessionStorage.getItem("userPowerGroup") * 1;
|
|
console.log(permitGroupId);
|
let rs = res.data;
|
let data = [];
|
if (rs.code === 1) {
|
data = rs.data.map((item) => {
|
item.txt = item.permitGroupName;
|
item.value = item.permitGroupId;
|
item.key = item.permitGroupName;
|
return item;
|
});
|
}
|
// 设置权限组
|
this.groupList = data.filter((item) => {
|
if (item.value !== 100002) {
|
return true;
|
}
|
});
|
if (!this.isSxty) {
|
this.formData.permitGroupId = permitGroupId;
|
}
|
})
|
.catch((error) => {
|
console.log(error);
|
});
|
},
|
timeChange(time) {
|
let time1 = time[0].format("hh:mm:ss");
|
let time2 = time[1].format("hh:mm:ss");
|
this.formData.visitTime = time1 + "~" + time2;
|
},
|
// 查询工作班组
|
queryGzbz: function () {
|
let vm = this;
|
groupAndUserListOfCurrentUser()
|
.then((res) => {
|
let re = res.data;
|
let params = [];
|
if (re.code == 1) {
|
re.data.forEach((list) => {
|
let objs = {
|
label: list.baoJiGroupName,
|
value: list.baoJiGroupName, //list.baoJiGroupId,
|
};
|
params.push(objs);
|
});
|
vm.ujobGroupList = params;
|
}
|
if (vm.formData.ujobGroup == "" && params.length > 0) {
|
vm.formData.ujobGroup = vm.ujobGroupList[0].value;
|
}
|
})
|
.catch((error) => {});
|
},
|
// 查询维护区
|
queryWhq: function () {
|
let vm = this;
|
searchProvince()
|
.then((res) => {
|
let rs = res.data;
|
let params = [];
|
if (rs.code == 1) {
|
rs.data.forEach((list) => {
|
let obj = {
|
label: list,
|
value: list,
|
};
|
params.push(obj);
|
});
|
vm.udepartmentList = params;
|
}
|
|
if (vm.formData.udepartment == "") {
|
vm.formData.udepartment = vm.udepartmentList[0].value;
|
}
|
})
|
.catch((err) => {});
|
},
|
// 取消隐藏弹框
|
cancelOpen: function () {
|
let vm = this;
|
vm.$emit("onClose");
|
},
|
// 确定
|
confirmOpen: function () {
|
let vm = this;
|
vm.$refs.formDataBox.validate((valid) => {
|
if (valid) {
|
let data = vm.formData;
|
if (data.type == 1) {
|
data.expirationTime = null;
|
} else {
|
data.expirationTime = new Date(this.expirationTime).format(
|
"yyyy-MM-dd hh:mm:ss"
|
);
|
}
|
switch (vm.status) {
|
case "add": //新增
|
// vm.updateLicense();
|
// let psw = RSA.encrypt(vm.formData.upassword);
|
// debugger
|
let psw = vm.formData.upassword;
|
vm.formData.upassword = encodeURIComponent(formatPassword(psw));
|
vm.addUser(vm.formData);
|
break;
|
case "edit": //修改
|
user(data, "PUT")
|
.then((res) => {
|
let result = res.data;
|
if (result.code == 1) {
|
if (result.data === false) {
|
vm.$layer.msg(result.msg);
|
} else {
|
vm.$emit("success", result);
|
}
|
} else {
|
vm.$layer.msg(result.msg);
|
}
|
})
|
.catch((error) => {
|
vm.$layer.msg("修改失败,请仔细核对信息!");
|
});
|
break;
|
default:
|
break;
|
}
|
}
|
});
|
},
|
// 新增用户
|
addUser(data) {
|
let vm = this;
|
data.usnId = data.upassword;
|
user(data, "POST")
|
.then((res) => {
|
let result = res.data;
|
vm.formData.upassword = "";
|
if (result.code == 1) {
|
if (result.data === false) {
|
vm.$layer.msg(result.msg);
|
} else {
|
vm.$emit("success", result);
|
}
|
} else {
|
vm.$layer.msg(result.msg);
|
}
|
})
|
.catch((error) => {
|
vm.$layer.msg("新增失败,请仔细核对信息!");
|
});
|
},
|
// 添加/更新license
|
updateLicense: function () {
|
let vm = this;
|
vm.$layer.prompt(
|
{
|
title: "请输入license",
|
// value:'',
|
formType: 3,
|
},
|
(value, index) => {
|
if (!value) {
|
vm.$layer.msg("未输入license");
|
return false;
|
}
|
// 校验license
|
vm.$axios({
|
method: "post",
|
url: "LicenseAction!checkLicense",
|
data: "json=" + value,
|
})
|
.then((res) => {
|
let result = JSON.parse(res.data.result);
|
if (result.code == 1) {
|
// 关闭弹窗
|
vm.$layer.close(index);
|
// 添加license参数
|
vm.formData.license = value;
|
if (vm.status == "add") {
|
vm.addUser(vm.formData);
|
} else {
|
vm.$layer.msg("已添加license,保存后生效!");
|
}
|
} else {
|
vm.$layer.msg(result.msg);
|
}
|
})
|
.catch((err) => {
|
vm.$layer.msg("license验证失败!");
|
});
|
}
|
);
|
},
|
changeRole() {
|
// 如果是太供 需要做处理 用户权限组需自动变更成对应的
|
// label: "领导层", 10 对应权限组ID 管理员组的permit_group_id 210001
|
// label: "管理员", 0 对应权限组ID 管理员组的permit_group_id 210001
|
// label: "维护组长", 1 对应权限组ID 运维权限组的permit_group_id 210002
|
// label: "维护组员", 2 对应权限组ID 运维权限组的permit_group_id 210002
|
// label: "监控层" , 12 对应权限组ID 监视权限组的permit_group_id 210003
|
if (this.isSxty && this.status == 'add') {
|
switch(this.formData.urole) {
|
case 10:
|
this.formData.permitGroupId = 210001;
|
break;
|
case 0:
|
this.formData.permitGroupId = 210001;
|
break;
|
case 1:
|
this.formData.permitGroupId = 210002;
|
break;
|
case 2:
|
this.formData.permitGroupId = 210002;
|
break;
|
case 12:
|
this.formData.permitGroupId = 210003;
|
break;
|
}
|
this.permitGroupBakup = this.formData.permitGroupId;
|
}
|
|
},
|
changePermitGroup(val) {
|
// console.log('val', val, this.formData.permitGroupId, '=============');
|
|
if (this.isSxty) {
|
this.$layer.confirm('当前选择的权限组与用户角色不匹配,继续修改可能会丢失当前角色的部分权限,确认更改用户权限吗?', {
|
icon: 3
|
}, (index) => {
|
this.$layer.close(index);
|
this.permitGroupBakup = val;
|
}, (index) => {
|
this.$layer.close(index);
|
this.formData.permitGroupId = this.permitGroupBakup;
|
});
|
}
|
},
|
},
|
};
|
</script>
|
<style scoped>
|
.staff .width_140 {
|
width: 140px;
|
}
|
|
.table-row {
|
padding: 2px 10px;
|
}
|
|
.staff {
|
margin-bottom: 6px;
|
}
|
|
.staff > p {
|
padding: 6px 5px;
|
background: #c9dcfa;
|
margin-bottom: 8px;
|
}
|
|
.btn_box {
|
padding: 10px 0;
|
text-align: center;
|
}
|
</style>
|