|
|
@@ -10,7 +10,13 @@
|
|
|
@update:visible="updateVisible"
|
|
|
:maxable="true"
|
|
|
>
|
|
|
- <el-form ref="form" :autoComplete="false" :model="form" :rules="rules" label-width="100px">
|
|
|
+ <el-form
|
|
|
+ ref="form"
|
|
|
+ :autoComplete="false"
|
|
|
+ :model="form"
|
|
|
+ :rules="rules"
|
|
|
+ label-width="100px"
|
|
|
+ >
|
|
|
<el-row>
|
|
|
<el-col :span="12">
|
|
|
<el-form-item label="用户账号:" prop="loginName">
|
|
|
@@ -43,6 +49,17 @@
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="岗位:" prop="postName">
|
|
|
+ <DictSelection
|
|
|
+ dictName="岗位"
|
|
|
+ placeholder=" "
|
|
|
+ v-model="userInfo.postName"
|
|
|
+ :isProhibit="true"
|
|
|
+ >
|
|
|
+ </DictSelection>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
<el-col :span="12">
|
|
|
<el-form-item label="启用状态:" prop="enable">
|
|
|
<el-switch
|
|
|
@@ -112,212 +129,219 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-// import { emailReg, phoneReg } from 'ele-admin';
|
|
|
-import RoleSelect from './role-select.vue';
|
|
|
-import add from './add.vue';
|
|
|
-import { addUsers, putUsers, getById } from '@/api/system/user';
|
|
|
-
|
|
|
-export default {
|
|
|
- components: { RoleSelect, add },
|
|
|
- props: {
|
|
|
- // 弹窗是否打开
|
|
|
- visible: Boolean,
|
|
|
- // isUpdate: Boolean,
|
|
|
- // 修改回显的数据
|
|
|
- data: Object,
|
|
|
- organizationList: {
|
|
|
- type: Array,
|
|
|
- default: () => {
|
|
|
- return [];
|
|
|
+ // import { emailReg, phoneReg } from 'ele-admin';
|
|
|
+ import RoleSelect from './role-select.vue';
|
|
|
+ import add from './add.vue';
|
|
|
+ import { addUsers, putUsers, getById } from '@/api/system/user';
|
|
|
+ import { getUserDetail } from '@/api/system/organization';
|
|
|
+ export default {
|
|
|
+ components: { RoleSelect, add },
|
|
|
+ props: {
|
|
|
+ // 弹窗是否打开
|
|
|
+ visible: Boolean,
|
|
|
+ // isUpdate: Boolean,
|
|
|
+ // 修改回显的数据
|
|
|
+ data: Object,
|
|
|
+ organizationList: {
|
|
|
+ type: Array,
|
|
|
+ default: () => {
|
|
|
+ return [];
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- },
|
|
|
- data() {
|
|
|
- const defaultForm = {
|
|
|
- id: null,
|
|
|
- loginName: '',
|
|
|
- mainUserId: '',
|
|
|
- name: '',
|
|
|
- loginPwd: 123456,
|
|
|
- enable: 1,
|
|
|
- groupRolePOList: [],
|
|
|
- jobNumber: '',
|
|
|
- phone: ''
|
|
|
- };
|
|
|
- return {
|
|
|
- defaultForm,
|
|
|
- defaultProps: {
|
|
|
- multiple: true,
|
|
|
- checkStrictly: true,
|
|
|
- emitPath: false,
|
|
|
- children: 'children',
|
|
|
- value: 'id',
|
|
|
- label: 'name'
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ const defaultForm = {
|
|
|
+ id: null,
|
|
|
+ loginName: '',
|
|
|
+ mainUserId: '',
|
|
|
+ name: '',
|
|
|
+ loginPwd: 123456,
|
|
|
+ enable: 1,
|
|
|
+ groupRolePOList: [],
|
|
|
+ jobNumber: '',
|
|
|
+ phone: ''
|
|
|
+ };
|
|
|
+ return {
|
|
|
+ defaultForm,
|
|
|
+ defaultProps: {
|
|
|
+ multiple: true,
|
|
|
+ checkStrictly: true,
|
|
|
+ emitPath: false,
|
|
|
+ children: 'children',
|
|
|
+ value: 'id',
|
|
|
+ label: 'name'
|
|
|
+ },
|
|
|
+ // 表单数据
|
|
|
+ form: { ...defaultForm },
|
|
|
+ // 表单验证规则
|
|
|
+ rules: {
|
|
|
+ loginName: [
|
|
|
+ { required: true, message: '请输入用户账号', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ name: [{ required: true, message: '请选择员工', trigger: 'change' }],
|
|
|
+ loginPwd: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ pattern: /^[\S]{5,18}$/,
|
|
|
+ message: '密码必须为5-18位非空白字符',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ // 提交状态
|
|
|
+ loading: false,
|
|
|
+ // 是否是修改
|
|
|
+ isUpdate: false,
|
|
|
+ userInfo: {
|
|
|
+ postName: ''
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ // 是否开启响应式布局
|
|
|
+ styleResponsive() {
|
|
|
+ return this.$store.state.theme.styleResponsive;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ setUsers() {
|
|
|
+ this.$refs.addREf.open('0');
|
|
|
+ },
|
|
|
+ async getUserDetail() {
|
|
|
+ this.userInfo = await getUserDetail(this.form.mainUserId);
|
|
|
},
|
|
|
- // 表单数据
|
|
|
- form: { ...defaultForm },
|
|
|
- // 表单验证规则
|
|
|
- rules: {
|
|
|
- loginName: [
|
|
|
- { required: true, message: '请输入用户账号', trigger: 'blur' }
|
|
|
- ],
|
|
|
- name: [{ required: true, message: '请选择员工', trigger: 'change' }],
|
|
|
- loginPwd: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- pattern: /^[\S]{5,18}$/,
|
|
|
- message: '密码必须为5-18位非空白字符',
|
|
|
- trigger: 'blur'
|
|
|
+ userBk(data) {
|
|
|
+ if (data) {
|
|
|
+ this.form.name = data.name;
|
|
|
+ this.form.mainUserId = data.id;
|
|
|
+ this.getUserDetail();
|
|
|
+ this.form.jobNumber = data.jobNumber;
|
|
|
+ this.form.phone = data.phone;
|
|
|
+ this.form.groupRolePOList = [];
|
|
|
+ if (!data.deptIds.includes(data.groupId)) {
|
|
|
+ this.form.groupRolePOList.push({
|
|
|
+ groupName: data.groupName,
|
|
|
+ groupId: data.groupId,
|
|
|
+ roleIds: []
|
|
|
+ });
|
|
|
}
|
|
|
- ]
|
|
|
+
|
|
|
+ if (data.deptIds.length > 0) {
|
|
|
+ const deptNames = data.deptName.split('/');
|
|
|
+ data.deptIds.forEach((item, index) => {
|
|
|
+ this.form.groupRolePOList.push({
|
|
|
+ groupName: deptNames[index],
|
|
|
+ groupId: item,
|
|
|
+ roleIds: []
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.$forceUpdate();
|
|
|
+ }
|
|
|
},
|
|
|
- // 提交状态
|
|
|
- loading: false,
|
|
|
- // 是否是修改
|
|
|
- isUpdate: false
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {
|
|
|
- // 是否开启响应式布局
|
|
|
- styleResponsive() {
|
|
|
- return this.$store.state.theme.styleResponsive;
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- setUsers() {
|
|
|
- this.$refs.addREf.open('0');
|
|
|
- },
|
|
|
- userBk(data) {
|
|
|
- if (data) {
|
|
|
- this.form.name = data.name;
|
|
|
- this.form.mainUserId = data.id;
|
|
|
- this.form.jobNumber = data.jobNumber;
|
|
|
- this.form.phone = data.phone;
|
|
|
- this.form.groupRolePOList = [];
|
|
|
- if (!data.deptIds.includes(data.groupId)) {
|
|
|
- this.form.groupRolePOList.push({
|
|
|
- groupName: data.groupName,
|
|
|
- groupId: data.groupId,
|
|
|
- roleIds: []
|
|
|
+ /* 保存编辑 */
|
|
|
+ save() {
|
|
|
+ this.$refs.form.validate((valid) => {
|
|
|
+ let isRole = true;
|
|
|
+ if (!valid) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ this.form.groupRolePOList.forEach((item) => {
|
|
|
+ if (item.roleIds.length == 0) {
|
|
|
+ isRole = false;
|
|
|
+ }
|
|
|
});
|
|
|
- }
|
|
|
+ if (!isRole) {
|
|
|
+ this.$message.warning('请选择角色!');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.loading = true;
|
|
|
+ if (!this.isUpdate) {
|
|
|
+ delete this.form.id;
|
|
|
+ }
|
|
|
|
|
|
- if (data.deptIds.length > 0) {
|
|
|
- const deptNames = data.deptName.split('/');
|
|
|
- data.deptIds.forEach((item, index) => {
|
|
|
+ const data = {
|
|
|
+ ...this.form
|
|
|
+ // roleId: this.form.roleIds.map((d) => {
|
|
|
+ // return { roleId: d };
|
|
|
+ // })
|
|
|
+ };
|
|
|
+ const saveOrUpdate = this.isUpdate ? putUsers : addUsers;
|
|
|
+ saveOrUpdate(data)
|
|
|
+ .then((msg) => {
|
|
|
+ this.loading = false;
|
|
|
+ this.$message.success(msg);
|
|
|
+ this.updateVisible(false);
|
|
|
+ this.$emit('done');
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
+ this.loading = false;
|
|
|
+ // this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /* 更新visible */
|
|
|
+ updateVisible(value) {
|
|
|
+ this.$emit('update:visible', value);
|
|
|
+ },
|
|
|
+ getByData(userRow, currentRow) {
|
|
|
+ let id = this.data?.id || userRow?.id;
|
|
|
+ getById(id).then((res) => {
|
|
|
+ this.form = res.data;
|
|
|
+ this.getUserDetail();
|
|
|
+ this.form.groupRolePOList = [];
|
|
|
+ res.data.groupRoleList.forEach((item) => {
|
|
|
this.form.groupRolePOList.push({
|
|
|
- groupName: deptNames[index],
|
|
|
- groupId: item,
|
|
|
- roleIds: []
|
|
|
+ groupName: item.groupName,
|
|
|
+ groupId: item.groupId,
|
|
|
+ roleIds: item.roleVOList.map((ids) => ids.id)
|
|
|
});
|
|
|
});
|
|
|
- }
|
|
|
- this.$forceUpdate();
|
|
|
- }
|
|
|
- },
|
|
|
- /* 保存编辑 */
|
|
|
- save() {
|
|
|
- this.$refs.form.validate((valid) => {
|
|
|
- let isRole = true;
|
|
|
- if (!valid) {
|
|
|
- return false;
|
|
|
- }
|
|
|
- this.form.groupRolePOList.forEach((item) => {
|
|
|
- if (item.roleIds.length == 0) {
|
|
|
- isRole = false;
|
|
|
+ if (currentRow) {
|
|
|
+ this.isUpdate = true;
|
|
|
+ this.userBk(currentRow);
|
|
|
}
|
|
|
});
|
|
|
- if (!isRole) {
|
|
|
- this.$message.warning('请选择角色!');
|
|
|
- return;
|
|
|
- }
|
|
|
- this.loading = true;
|
|
|
- if (!this.isUpdate) {
|
|
|
- delete this.form.id;
|
|
|
- }
|
|
|
-
|
|
|
- const data = {
|
|
|
- ...this.form
|
|
|
- // roleId: this.form.roleIds.map((d) => {
|
|
|
- // return { roleId: d };
|
|
|
- // })
|
|
|
- };
|
|
|
- const saveOrUpdate = this.isUpdate ? putUsers : addUsers;
|
|
|
- saveOrUpdate(data)
|
|
|
- .then((msg) => {
|
|
|
- this.loading = false;
|
|
|
- this.$message.success(msg);
|
|
|
- this.updateVisible(false);
|
|
|
- this.$emit('done');
|
|
|
- })
|
|
|
- .catch((e) => {
|
|
|
- this.loading = false;
|
|
|
- // this.$message.error(e.message);
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- /* 更新visible */
|
|
|
- updateVisible(value) {
|
|
|
- this.$emit('update:visible', value);
|
|
|
+ }
|
|
|
},
|
|
|
- getByData(userRow, currentRow) {
|
|
|
- let id = this.data?.id || userRow?.id;
|
|
|
- getById(id).then((res) => {
|
|
|
- this.form = res.data;
|
|
|
- this.form.groupRolePOList = [];
|
|
|
- res.data.groupRoleList.forEach((item) => {
|
|
|
- this.form.groupRolePOList.push({
|
|
|
- groupName: item.groupName,
|
|
|
- groupId: item.groupId,
|
|
|
- roleIds: item.roleVOList.map((ids) => ids.id)
|
|
|
- });
|
|
|
- });
|
|
|
- if (currentRow) {
|
|
|
- this.isUpdate = true;
|
|
|
- this.userBk(currentRow);
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- visible(visible) {
|
|
|
- if (visible) {
|
|
|
- if (this.data) {
|
|
|
- this.getByData(this.data);
|
|
|
- // this.isUpdate = true;
|
|
|
+ watch: {
|
|
|
+ visible(visible) {
|
|
|
+ if (visible) {
|
|
|
+ if (this.data) {
|
|
|
+ this.getByData(this.data);
|
|
|
+ // this.isUpdate = true;
|
|
|
+ } else {
|
|
|
+ // this.isUpdate = false;
|
|
|
+ }
|
|
|
} else {
|
|
|
- // this.isUpdate = false;
|
|
|
+ this.$refs.form.clearValidate();
|
|
|
+ this.form = { ...this.defaultForm };
|
|
|
}
|
|
|
- } else {
|
|
|
- this.$refs.form.clearValidate();
|
|
|
- this.form = { ...this.defaultForm };
|
|
|
}
|
|
|
- },
|
|
|
- // isUpdate(v){
|
|
|
- // console.log(v,66666);
|
|
|
- // this.isUpdate = v;
|
|
|
- // }
|
|
|
- }
|
|
|
-};
|
|
|
+ // isUpdate(v){
|
|
|
+ // console.log(v,66666);
|
|
|
+ // this.isUpdate = v;
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ };
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
-:deep(.el-input--medium .el-input__inner) {
|
|
|
- height: auto !important;
|
|
|
-}
|
|
|
-:deep(.el-table) {
|
|
|
- .el-form-item {
|
|
|
- margin-bottom: 0;
|
|
|
+ :deep(.el-input--medium .el-input__inner) {
|
|
|
+ height: auto !important;
|
|
|
+ }
|
|
|
+ :deep(.el-table) {
|
|
|
+ .el-form-item {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ :deep(.organizationList .el-input__inner) {
|
|
|
+ border: 0;
|
|
|
+ background: none;
|
|
|
+ }
|
|
|
+ :deep(.organizationList .el-input__suffix) {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ :deep(.organizationList .el-tag) {
|
|
|
+ background: none;
|
|
|
}
|
|
|
-}
|
|
|
-:deep(.organizationList .el-input__inner) {
|
|
|
- border: 0;
|
|
|
- background: none;
|
|
|
-}
|
|
|
-:deep(.organizationList .el-input__suffix) {
|
|
|
- display: none;
|
|
|
-}
|
|
|
-:deep(.organizationList .el-tag) {
|
|
|
- background: none;
|
|
|
-}
|
|
|
-
|
|
|
</style>
|