UnisKB/ui/src/views/workspace/component/AddMemberDrawer.vue

132 lines
3.6 KiB
Vue

<template>
<el-drawer v-model="visible" size="600" :destroy-on-close="true" :before-close="handleCancel">
<template #header>
<h4>{{ $t('views.role.member.add') }}</h4>
</template>
<template #default>
<MemberFormContent ref="memberFormContentRef" :models="formItemModel" v-model:form="list"
v-loading="memberFormContentLoading" />
</template>
<template #footer>
<div style="flex: auto">
<el-button @click="handleCancel">{{ $t('common.cancel') }}</el-button>
<el-button type="primary" @click="handleAdd()" :loading="loading">
{{ $t('common.add') }}
</el-button>
</div>
</template>
</el-drawer>
</template>
<script setup lang="ts">
import { onBeforeMount, ref } from 'vue'
import UserApi from '@/api/user/user'
import WorkspaceApi from '@/api/workspace/workspace'
import MemberFormContent from '@/views/role/component/MemberFormContent.vue'
import { t } from '@/locales'
import { MsgSuccess } from '@/utils/message'
import type { CreateWorkspaceMemberParamsItem, WorkspaceItem } from '@/api/type/workspace'
import type { FormItemModel } from '@/api/type/role'
const props = defineProps<{
currentWorkspace?: WorkspaceItem
}>()
const emit = defineEmits<{
(e: 'refresh'): void;
}>();
const loading = ref(false)
const visible = ref(false)
const list = ref<CreateWorkspaceMemberParamsItem[]>([]);
const memberFormContentLoading = ref(false);
const formItemModel = ref<FormItemModel[]>([]);
const userFormItem = ref<FormItemModel[]>([]);
const roleFormItem = ref<FormItemModel[]>([]);
async function getUserFormItem() {
try {
const res = await UserApi.getUserList(memberFormContentLoading);
userFormItem.value = [{
path: 'user_ids',
label: t('views.role.member.title'),
rules: [
{
required: true,
message: `${t('common.selectPlaceholder')}${t('views.role.member.title')}`,
},
],
selectProps: {
options: res.data?.map(item => ({
label: item.nick_name,
value: item.id
})) || [],
placeholder: `${t('common.selectPlaceholder')}${t('views.role.member.title')}`
}
}];
} catch (e) {
console.error(e);
}
}
async function getRoleFormItem() {
try {
const res = await WorkspaceApi.getWorkspaceRoleList(memberFormContentLoading);
roleFormItem.value = [{
path: 'role_ids',
label: t('views.role.member.role'),
rules: [
{
required: true,
message: `${t('common.selectPlaceholder')}${t('views.role.member.role')}`,
},
],
selectProps: {
options: res.data?.map(item => ({
label: item.name,
value: item.id
})) || [],
placeholder: `${t('common.selectPlaceholder')}${t('views.role.member.role')}`
}
}]
} catch (e) {
console.error(e);
}
}
function init() {
formItemModel.value = [...userFormItem.value, ...roleFormItem.value]
list.value = [{ user_ids: [], role_ids: [] }]
}
onBeforeMount(async () => {
await getUserFormItem();
await getRoleFormItem();
init()
})
function open() {
init();
visible.value = true
}
function handleCancel() {
visible.value = false
}
const memberFormContentRef = ref<InstanceType<typeof MemberFormContent>>()
function handleAdd() {
// memberFormContentRef.value?.validate().then(async (valid) => {
// if (valid) {
// await WorkspaceApi.CreateWorkspaceMember(props.currentWorkspace?.id as string, list.value, loading)
// MsgSuccess(t('common.addSuccess'))
// handleCancel();
// emit('refresh')
// }
// })
}
defineExpose({ open })
</script>