|
|
@ -1,52 +1,104 @@ |
|
|
<template> |
|
|
<template> |
|
|
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false"> |
|
|
<el-dialog :visible.sync="visible" |
|
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" label-width="120px"> |
|
|
:title="!dataForm.id ? $t('add') : $t('update')" |
|
|
<el-form-item prop="username" :label="$t('user.username')"> |
|
|
:close-on-click-modal="false" |
|
|
<el-input v-model="dataForm.username" :placeholder="$t('user.username')"></el-input> |
|
|
:close-on-press-escape="false"> |
|
|
|
|
|
<el-form :model="dataForm" |
|
|
|
|
|
:rules="dataRule" |
|
|
|
|
|
ref="dataForm" |
|
|
|
|
|
@keyup.enter.native="dataFormSubmitHandle()" |
|
|
|
|
|
label-width="120px"> |
|
|
|
|
|
<el-form-item prop="username" |
|
|
|
|
|
:label="$t('user.username')"> |
|
|
|
|
|
<el-input v-model="dataForm.username" |
|
|
|
|
|
:placeholder="$t('user.username')"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="deptName" :label="$t('user.deptName')" class="dept-list"> |
|
|
<el-form-item prop="deptName" |
|
|
<el-popover v-model="deptListVisible" ref="deptListPopover" placement="bottom-start" trigger="click"> |
|
|
:label="$t('user.deptName')" |
|
|
<el-tree |
|
|
class="dept-list"> |
|
|
:data="deptList" |
|
|
<el-popover v-model="deptListVisible" |
|
|
:props="{ label: 'name', children: 'children' }" |
|
|
ref="deptListPopover" |
|
|
node-key="id" |
|
|
placement="bottom-start" |
|
|
ref="deptListTree" |
|
|
trigger="click"> |
|
|
:highlight-current="true" |
|
|
<el-tree :data="deptList" |
|
|
:expand-on-click-node="false" |
|
|
:props="{ label: 'name', children: 'children' }" |
|
|
accordion |
|
|
node-key="id" |
|
|
@current-change="deptListTreeCurrentChangeHandle"> |
|
|
ref="deptListTree" |
|
|
|
|
|
:highlight-current="true" |
|
|
|
|
|
:expand-on-click-node="false" |
|
|
|
|
|
accordion |
|
|
|
|
|
@current-change="deptListTreeCurrentChangeHandle"> |
|
|
</el-tree> |
|
|
</el-tree> |
|
|
</el-popover> |
|
|
</el-popover> |
|
|
<el-input v-model="dataForm.deptName" v-popover:deptListPopover :readonly="true" :placeholder="$t('user.deptName')"></el-input> |
|
|
<el-input v-model="dataForm.deptName" |
|
|
|
|
|
v-popover:deptListPopover |
|
|
|
|
|
:readonly="true" |
|
|
|
|
|
:placeholder="$t('user.deptName')"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="password" :label="$t('user.password')" :class="{ 'is-required': !dataForm.id }"> |
|
|
<el-form-item label="用户类型" |
|
|
<el-input v-model="dataForm.password" type="password" :placeholder="$t('user.password')"></el-input> |
|
|
prop="userTagKey"> |
|
|
|
|
|
<el-select v-model="dataForm.userTagKey" |
|
|
|
|
|
placeholder="用户类型"> |
|
|
|
|
|
<el-option v-for="item in userTagDictList" |
|
|
|
|
|
:key="item.dictValue" |
|
|
|
|
|
:label="item.dictName" |
|
|
|
|
|
:value="item.dictValue"> |
|
|
|
|
|
</el-option> |
|
|
|
|
|
</el-select> |
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
<el-form-item prop="password" |
|
|
|
|
|
:label="$t('user.password')" |
|
|
|
|
|
:class="{ 'is-required': !dataForm.id }"> |
|
|
|
|
|
<el-input v-model="dataForm.password" |
|
|
|
|
|
type="password" |
|
|
|
|
|
:placeholder="$t('user.password')"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="comfirmPassword" :label="$t('user.comfirmPassword')" :class="{ 'is-required': !dataForm.id }"> |
|
|
<el-form-item prop="comfirmPassword" |
|
|
<el-input v-model="dataForm.comfirmPassword" type="password" :placeholder="$t('user.comfirmPassword')"></el-input> |
|
|
:label="$t('user.comfirmPassword')" |
|
|
|
|
|
:class="{ 'is-required': !dataForm.id }"> |
|
|
|
|
|
<el-input v-model="dataForm.comfirmPassword" |
|
|
|
|
|
type="password" |
|
|
|
|
|
:placeholder="$t('user.comfirmPassword')"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="realName" :label="$t('user.realName')"> |
|
|
<el-form-item prop="realName" |
|
|
<el-input v-model="dataForm.realName" :placeholder="$t('user.realName')"></el-input> |
|
|
:label="$t('user.realName')"> |
|
|
|
|
|
<el-input v-model="dataForm.realName" |
|
|
|
|
|
:placeholder="$t('user.realName')"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="gender" :label="$t('user.gender')" size="mini"> |
|
|
<el-form-item prop="gender" |
|
|
|
|
|
:label="$t('user.gender')" |
|
|
|
|
|
size="mini"> |
|
|
<el-radio-group v-model="dataForm.gender"> |
|
|
<el-radio-group v-model="dataForm.gender"> |
|
|
<el-radio :label="0">{{ $t('user.gender0') }}</el-radio> |
|
|
<el-radio :label="0">{{ $t('user.gender0') }}</el-radio> |
|
|
<el-radio :label="1">{{ $t('user.gender1') }}</el-radio> |
|
|
<el-radio :label="1">{{ $t('user.gender1') }}</el-radio> |
|
|
<el-radio :label="2">{{ $t('user.gender2') }}</el-radio> |
|
|
<el-radio :label="2">{{ $t('user.gender2') }}</el-radio> |
|
|
</el-radio-group> |
|
|
</el-radio-group> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="email" :label="$t('user.email')"> |
|
|
<el-form-item prop="email" |
|
|
<el-input v-model="dataForm.email" :placeholder="$t('user.email')"></el-input> |
|
|
:label="$t('user.email')"> |
|
|
|
|
|
<el-input v-model="dataForm.email" |
|
|
|
|
|
:placeholder="$t('user.email')"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="mobile" :label="$t('user.mobile')"> |
|
|
<el-form-item prop="mobile" |
|
|
<el-input v-model="dataForm.mobile" :placeholder="$t('user.mobile')"></el-input> |
|
|
:label="$t('user.mobile')"> |
|
|
|
|
|
<el-input v-model="dataForm.mobile" |
|
|
|
|
|
:placeholder="$t('user.mobile')"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="roleIdList" :label="$t('user.roleIdList')" class="role-list"> |
|
|
<el-form-item prop="roleIdList" |
|
|
<el-select v-model="dataForm.roleIdList" multiple :placeholder="$t('user.roleIdList')"> |
|
|
:label="$t('user.roleIdList')" |
|
|
<el-option v-for="role in roleList" :key="role.id" :label="role.name" :value="role.id"></el-option> |
|
|
class="role-list"> |
|
|
|
|
|
<el-select v-model="dataForm.roleIdList" |
|
|
|
|
|
multiple |
|
|
|
|
|
:placeholder="$t('user.roleIdList')"> |
|
|
|
|
|
<el-option v-for="role in roleList" |
|
|
|
|
|
:key="role.id" |
|
|
|
|
|
:label="role.name" |
|
|
|
|
|
:value="role.id"></el-option> |
|
|
</el-select> |
|
|
</el-select> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="status" :label="$t('user.status')" size="mini"> |
|
|
<el-form-item prop="status" |
|
|
|
|
|
:label="$t('user.status')" |
|
|
|
|
|
size="mini"> |
|
|
<el-radio-group v-model="dataForm.status"> |
|
|
<el-radio-group v-model="dataForm.status"> |
|
|
<el-radio :label="0">{{ $t('user.status0') }}</el-radio> |
|
|
<el-radio :label="0">{{ $t('user.status0') }}</el-radio> |
|
|
<el-radio :label="1">{{ $t('user.status1') }}</el-radio> |
|
|
<el-radio :label="1">{{ $t('user.status1') }}</el-radio> |
|
|
@ -55,7 +107,8 @@ |
|
|
</el-form> |
|
|
</el-form> |
|
|
<template slot="footer"> |
|
|
<template slot="footer"> |
|
|
<el-button @click="visible = false">{{ $t('cancel') }}</el-button> |
|
|
<el-button @click="visible = false">{{ $t('cancel') }}</el-button> |
|
|
<el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button> |
|
|
<el-button type="primary" |
|
|
|
|
|
@click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button> |
|
|
</template> |
|
|
</template> |
|
|
</el-dialog> |
|
|
</el-dialog> |
|
|
</template> |
|
|
</template> |
|
|
@ -83,8 +136,10 @@ export default { |
|
|
email: '', |
|
|
email: '', |
|
|
mobile: '', |
|
|
mobile: '', |
|
|
roleIdList: [], |
|
|
roleIdList: [], |
|
|
status: 1 |
|
|
status: 1, |
|
|
} |
|
|
userTagKey: '' |
|
|
|
|
|
}, |
|
|
|
|
|
userTagDictList: [] |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
computed: { |
|
|
computed: { |
|
|
@ -139,6 +194,9 @@ export default { |
|
|
mobile: [ |
|
|
mobile: [ |
|
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, |
|
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, |
|
|
{ validator: validateMobile, trigger: 'blur' } |
|
|
{ validator: validateMobile, trigger: 'blur' } |
|
|
|
|
|
], |
|
|
|
|
|
userTagKey: [ |
|
|
|
|
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
|
|
] |
|
|
] |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
@ -158,6 +216,7 @@ export default { |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
}) |
|
|
}) |
|
|
|
|
|
this.getUserTagDicList() |
|
|
}, |
|
|
}, |
|
|
// 获取部门列表 |
|
|
// 获取部门列表 |
|
|
getDeptList () { |
|
|
getDeptList () { |
|
|
@ -166,7 +225,7 @@ export default { |
|
|
return this.$message.error(res.msg) |
|
|
return this.$message.error(res.msg) |
|
|
} |
|
|
} |
|
|
this.deptList = res.data |
|
|
this.deptList = res.data |
|
|
}).catch(() => {}) |
|
|
}).catch(() => { }) |
|
|
}, |
|
|
}, |
|
|
// 获取角色列表 |
|
|
// 获取角色列表 |
|
|
getRoleList () { |
|
|
getRoleList () { |
|
|
@ -175,7 +234,16 @@ export default { |
|
|
return this.$message.error(res.msg) |
|
|
return this.$message.error(res.msg) |
|
|
} |
|
|
} |
|
|
this.roleList = res.data |
|
|
this.roleList = res.data |
|
|
}).catch(() => {}) |
|
|
}).catch(() => { }) |
|
|
|
|
|
}, |
|
|
|
|
|
// 获取用户标签字典列表 |
|
|
|
|
|
getUserTagDicList () { |
|
|
|
|
|
this.$http.get(`/sys/dict/listSimple/user_tag`).then(({ data: res }) => { |
|
|
|
|
|
if (res.code !== 0) { |
|
|
|
|
|
return this.$message.error(res.msg) |
|
|
|
|
|
} |
|
|
|
|
|
this.userTagDictList = res.data |
|
|
|
|
|
}).catch(() => { }) |
|
|
}, |
|
|
}, |
|
|
// 获取信息 |
|
|
// 获取信息 |
|
|
getInfo () { |
|
|
getInfo () { |
|
|
@ -197,7 +265,7 @@ export default { |
|
|
} |
|
|
} |
|
|
this.roleIdListDefault.push(res.data.roleIdList[i]) |
|
|
this.roleIdListDefault.push(res.data.roleIdList[i]) |
|
|
} |
|
|
} |
|
|
}).catch(() => {}) |
|
|
}).catch(() => { }) |
|
|
}, |
|
|
}, |
|
|
// 所属部门树, 选中 |
|
|
// 所属部门树, 选中 |
|
|
deptListTreeCurrentChangeHandle (data, node) { |
|
|
deptListTreeCurrentChangeHandle (data, node) { |
|
|
@ -230,7 +298,7 @@ export default { |
|
|
this.$emit('refreshDataList') |
|
|
this.$emit('refreshDataList') |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
}).catch(() => {}) |
|
|
}).catch(() => { }) |
|
|
}) |
|
|
}) |
|
|
}, 1000, { 'leading': true, 'trailing': false }) |
|
|
}, 1000, { 'leading': true, 'trailing': false }) |
|
|
} |
|
|
} |
|
|
|
王金鹏
6 years ago