salary
qsh
6 months ago
parent
4e104166af
commit
1e0ba3b619
@ -1,94 +0,0 @@ |
|||||||
<template> |
|
||||||
<Dialog v-model="dialogVisible" title="分配角色"> |
|
||||||
<el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="80px"> |
|
||||||
<el-form-item label="用户名称"> |
|
||||||
<el-input v-model="formData.username" :disabled="true" /> |
|
||||||
</el-form-item> |
|
||||||
<el-form-item label="用户昵称"> |
|
||||||
<el-input v-model="formData.nickname" :disabled="true" /> |
|
||||||
</el-form-item> |
|
||||||
<el-form-item label="角色"> |
|
||||||
<el-select v-model="formData.roleIds" multiple placeholder="请选择角色"> |
|
||||||
<el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id" /> |
|
||||||
</el-select> |
|
||||||
</el-form-item> |
|
||||||
</el-form> |
|
||||||
<template #footer> |
|
||||||
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button> |
|
||||||
<el-button @click="dialogVisible = false">取 消</el-button> |
|
||||||
</template> |
|
||||||
</Dialog> |
|
||||||
</template> |
|
||||||
<script lang="ts" name="SystemUserAssignRoleForm" setup> |
|
||||||
import * as PermissionApi from '@/api/system/permission' |
|
||||||
import * as UserApi from '@/api/system/user' |
|
||||||
import * as RoleApi from '@/api/system/role' |
|
||||||
|
|
||||||
const { t } = useI18n() // 国际化 |
|
||||||
const message = useMessage() // 消息弹窗 |
|
||||||
|
|
||||||
const dialogVisible = ref(false) // 弹窗的是否展示 |
|
||||||
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 |
|
||||||
const formData = ref({ |
|
||||||
id: undefined, |
|
||||||
nickname: '', |
|
||||||
username: '', |
|
||||||
roleIds: [] |
|
||||||
}) |
|
||||||
const formRef = ref() // 表单 Ref |
|
||||||
const roleList = ref<any>([]) // 角色的列表 |
|
||||||
|
|
||||||
/** 打开弹窗 */ |
|
||||||
const open = async (row: UserApi.UserVO) => { |
|
||||||
dialogVisible.value = true |
|
||||||
resetForm() |
|
||||||
// 设置数据 |
|
||||||
formData.value.id = row.id |
|
||||||
formData.value.username = row.username |
|
||||||
formData.value.nickname = row.nickname |
|
||||||
// 获得角色拥有的菜单集合 |
|
||||||
formLoading.value = true |
|
||||||
try { |
|
||||||
formData.value.roleIds = await PermissionApi.getUserRoleList(row.id) |
|
||||||
} finally { |
|
||||||
formLoading.value = false |
|
||||||
} |
|
||||||
// 获得角色列表 |
|
||||||
roleList.value = await RoleApi.getSimpleRoleList() |
|
||||||
} |
|
||||||
defineExpose({ open }) // 提供 open 方法，用于打开弹窗 |
|
||||||
|
|
||||||
/** 提交表单 */ |
|
||||||
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调 |
|
||||||
const submitForm = async () => { |
|
||||||
// 校验表单 |
|
||||||
if (!formRef.value) return |
|
||||||
const valid = await formRef.value.validate() |
|
||||||
if (!valid) return |
|
||||||
// 提交请求 |
|
||||||
formLoading.value = true |
|
||||||
try { |
|
||||||
await PermissionApi.assignUserRole({ |
|
||||||
userId: formData.value.id, |
|
||||||
roleIds: formData.value.roleIds |
|
||||||
}) |
|
||||||
message.success(t('common.updateSuccess')) |
|
||||||
dialogVisible.value = false |
|
||||||
// 发送操作成功的事件 |
|
||||||
emit('success', true) |
|
||||||
} finally { |
|
||||||
formLoading.value = false |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
/** 重置表单 */ |
|
||||||
const resetForm = () => { |
|
||||||
formData.value = { |
|
||||||
id: undefined, |
|
||||||
nickname: '', |
|
||||||
username: '', |
|
||||||
roleIds: [] |
|
||||||
} |
|
||||||
formRef.value?.resetFields() |
|
||||||
} |
|
||||||
</script> |
|
||||||
Loading…
Reference in new issue