zhuchaowe/maxkb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: user manage add filter

Browse Source
This commit is contained in:
wxg0103 2025-06-25 18:39:06 +08:00
parent a26c4320dd
commit c4bf19c92b
4 changed files with 123 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
ui/src/api/system/chat-user.ts
View File

@ -3,6 +3,7 @@ import { get, put, post, del } from '@/request/index'
import type {pageRequest, PageList} from '@/api/type/common'
import type {ChatUserItem} from '@/api/type/systemChatUser'
import type {Ref} from 'vue'
const prefix = '/system/chat_user'
@ -20,12 +21,12 @@ const getChatUserList: (loading?: Ref<boolean>) => Promise<Result<ChatUserItem[]
*/
const getUserManage: (
page: pageRequest,
username_or_nickname: string,
params?: any,
loading?: Ref<boolean>,
) => Promise<Result<PageList<ChatUserItem[]>>> = (page, username_or_nickname, loading) => {
) => Promise<Result<PageList<ChatUserItem[]>>> = (page, params, loading) => {
return get(
`${prefix}/user_manage/${page.current_page}/${page.page_size}`,
username_or_nickname ? { username_or_nickname } : undefined,
params ? params : undefined,
loading,
)
}

6
ui/src/api/system/user-manage.ts
View File

@ -12,12 +12,12 @@ const prefix = '/user_manage'
*/
const getUserManage: (
page: pageRequest,
email_or_username: string,
params?: any,
loading?: Ref<boolean>,
) => Promise<Result<any>> = (page, email_or_username, loading) => {
) => Promise<Result<any>> = (page, params, loading) => {
return get(
`${prefix}/${page.current_page}/${page.page_size}`,
email_or_username ? {email_or_username} : undefined,
params ? params : undefined,
loading,
)
}

57
ui/src/views/system-chat-user/user-manage/index.vue
View File

@ -38,17 +38,25 @@
<div class="flex-between complex-search">
<el-select class="complex-search__left" v-model="search_type" style="width: 120px"
@change="search_type_change">
<el-option :label="$t('views.login.loginForm.username.label')" value="name" />
<el-option :label="$t('views.login.loginForm.username.label')" value="username"/>
<el-option :label="$t('views.userManage.userForm.nick_name.label')"
value="nick_name"/>
</el-select>
<el-input v-if="search_type === 'name'" v-model="search_form.name" @change="getList"
:placeholder="$t('common.searchBar.placeholder')" style="width: 220px" clearable />
<el-input v-if="search_type === 'username'" v-model="search_form.username"
@change="getList"
style="width: 220px"
clearable/>
<el-input v-if="search_type === 'nick_name'" v-model="search_form.nick_name"
@change="getList"
style="width: 220px" clearable/>
</div>
</div>
<app-table class="mt-16" :data="userTableData" :pagination-config="paginationConfig"
@sizeChange="handleSizeChange" @changePage="getList" v-loading="loading"
@selection-change="handleSelectionChange" @sort-change="handleSortChange">
<el-table-column type="selection" width="55"/>
<el-table-column prop="nick_name" :label="$t('views.userManage.userForm.nick_name.label')" />
<el-table-column prop="nick_name"
:label="$t('views.userManage.userForm.nick_name.label')"/>
<el-table-column prop="username" :label="$t('common.username')"/>
<el-table-column prop="is_active" :label="$t('common.status.label')">
<template #default="{ row }">
@ -69,7 +77,8 @@
</template>
</el-table-column>
<el-table-column prop="email" :label="$t('views.login.loginForm.email.label')" show-overflow-tooltip>
<el-table-column prop="email" :label="$t('views.login.loginForm.email.label')"
show-overflow-tooltip>
<template #default="{ row }">
{{ row.email || '-' }}
</template>
@ -79,7 +88,8 @@
{{ row.phone || '-' }}
</template>
</el-table-column>
<el-table-column prop="user_group_names" :label="$t('views.chatUser.group.title')" min-width="100">
<el-table-column prop="user_group_names" :label="$t('views.chatUser.group.title')"
min-width="100">
<template #default="{ row }">
<TagGroup :tags="row.user_group_names"/>
</template>
@ -111,11 +121,13 @@
<el-table-column :label="$t('common.operation')" width="160" align="left" fixed="right">
<template #default="{ row }">
<span @click.stop>
<el-switch size="small" v-model="row.is_active" :before-change="() => changeState(row)" />
<el-switch size="small" v-model="row.is_active"
:before-change="() => changeState(row)"/>
</span>
<el-divider direction="vertical"/>
<span class="mr-8">
<el-button type="primary" text @click.stop="editUser(row)" :title="$t('common.edit')"
<el-button type="primary" text @click.stop="editUser(row)"
:title="$t('common.edit')"
v-hasPermission="new ComplexPermission([RoleConst.ADMIN, RoleConst.WORKSPACE_MANAGE.getWorkspaceRole, RoleConst.USER.getWorkspaceRole,],
[PermissionConst.WORKSPACE_CHAT_USER_EDIT.getWorkspacePermission],[],'OR')"
>
@ -137,7 +149,8 @@
</el-button>
</span>
<span>
<el-button :disabled="row.role === 'ADMIN'" type="primary" text @click.stop="deleteUserManage(row)"
<el-button :disabled="row.role === 'ADMIN'" type="primary" text
@click.stop="deleteUserManage(row)"
:title="$t('common.delete')"
v-hasPermission="new ComplexPermission([RoleConst.ADMIN, RoleConst.WORKSPACE_MANAGE.getWorkspaceRole, RoleConst.USER.getWorkspaceRole,],
[PermissionConst.WORKSPACE_CHAT_USER_DELETE.getWorkspacePermission],[],'OR')"
@ -153,10 +166,12 @@
</el-card>
</ContentContainer>
<UserDrawer :title="title" :optionLoading="optionLoading" :chatGroupList="chatGroupList" ref="UserDrawerRef"
<UserDrawer :title="title" :optionLoading="optionLoading" :chatGroupList="chatGroupList"
ref="UserDrawerRef"
@refresh="refresh"/>
<UserPwdDialog ref="UserPwdDialogRef" @refresh="refresh"/>
<SetUserGroupsDialog :optionLoading="optionLoading" :chatGroupList="chatGroupList" ref="setUserGroupsRef"
<SetUserGroupsDialog :optionLoading="optionLoading" :chatGroupList="chatGroupList"
ref="setUserGroupsRef"
@refresh="refresh"/>
<SyncUsersDialog ref="syncUsersDialogRef" @refresh="refresh"/>
</div>
@ -183,17 +198,20 @@ const rightOutlined = iconMap['right-outlined'].iconReader()
const search_type = ref('name')
const search_form = ref<{
name: string
username: string,
nick_name?: string,
}>({
name: '',
username: '',
nick_name: '',
})
const search_type_change = () => {
search_form.value = { name: '' }
search_form.value = {username: '', nick_name: ''}
}
const loading = ref(false)
const multipleSelection = ref<any[]>([])
function handleSelectionChange(val: any[]) {
multipleSelection.value = val
}
@ -207,8 +225,11 @@ const paginationConfig = reactive({
const userTableData = ref<ChatUserItem[]>([])
function getList() {
const params = {
[search_type.value]: search_form.value[search_type.value as keyof typeof search_form.value],
}
return userManageApi
.getUserManage(paginationConfig, search_form.value.name, loading)
.getUserManage(paginationConfig, params, loading)
.then((res) => {
userTableData.value = res.data.records
paginationConfig.total = res.data.total
@ -216,6 +237,7 @@ function getList() {
}
const orderBy = ref<string>('')
function handleSortChange({prop, order}: { prop: string; order: string }) {
orderBy.value = order === 'ascending' ? prop : `-${prop}`
getList()
@ -246,6 +268,7 @@ function changeState(row: ChatUserItem) {
const title = ref('')
const UserDrawerRef = ref()
function editUser(row: ChatUserItem) {
title.value = t('views.userManage.editUser')
UserDrawerRef.value.open(row)
@ -277,6 +300,7 @@ function deleteUserManage(row: ChatUserItem) {
}
const UserPwdDialogRef = ref()
function editPwdUser(row: ChatUserItem) {
UserPwdDialogRef.value.open(row)
}
@ -292,6 +316,7 @@ onMounted(() => {
const optionLoading = ref(false)
const chatGroupList = ref<ListItem[]>([])
async function getChatGroupList() {
try {
const res = await SystemGroupApi.getUserGroup(optionLoading)
@ -321,11 +346,13 @@ function handleBatchDelete() {
}
const setUserGroupsRef = ref<InstanceType<typeof SetUserGroupsDialog>>()
function setUserGroups() {
setUserGroupsRef.value?.open(multipleSelection.value.map(item => (item.id)))
}
const syncUsersDialogRef = ref<InstanceType<typeof SyncUsersDialog>>()
function syncUsers() {
syncUsersDialogRef.value?.open()
}

44
ui/src/views/system/user-manage/index.vue
View File

@ -14,13 +14,28 @@
style="width: 120px"
@change="search_type_change"
>
<el-option :label="$t('views.login.loginForm.username.label')" value="name"/>
<el-option :label="$t('views.login.loginForm.username.label')" value="username"/>
<el-option :label="$t('views.userManage.userForm.nick_name.label')" value="nick_name"/>
<el-option :label="$t('views.login.loginForm.email.label')" value="email"/>
</el-select>
<el-input
v-if="search_type === 'name'"
v-model="search_form.name"
v-if="search_type === 'username'"
v-model="search_form.username"
@change="getList"
style="width: 220px"
clearable
/>
<el-input
v-else-if="search_type === 'nick_name'"
v-model="search_form.nick_name"
@change="getList"
style="width: 220px"
clearable
/>
<el-input
v-else-if="search_type === 'email'"
v-model="search_form.email"
@change="getList"
:placeholder="$t('common.searchBar.placeholder')"
style="width: 220px"
clearable
/>
@ -71,7 +86,8 @@
{{ row.phone || '-' }}
</template>
</el-table-column>
<el-table-column prop="role" :label="$t('views.role.member.role')" min-width="100" v-if="user.isEE()">
<el-table-column prop="role" :label="$t('views.role.member.role')" min-width="100"
v-if="user.isEE()">
<template #default="{ row }">
<TagGroup :tags="row.role"/>
</template>
@ -157,12 +173,17 @@ import {MsgSuccess, MsgConfirm} from '@/utils/message'
import {t} from '@/locales'
import {ValidCount, ValidType} from "@/enums/common.ts";
import useStore from "@/stores";
const {user, common} = useStore()
const search_type = ref('name')
const search_type = ref('username')
const search_form = ref<{
name: string
username: string,
nick_name?: string,
email?: string
}>({
name: '',
username: '',
nick_name: '',
email: ''
})
const UserDrawerRef = ref()
@ -178,7 +199,7 @@ const paginationConfig = reactive({
const userTableData = ref<any[]>([])
const search_type_change = () => {
search_form.value = {name: ''}
search_form.value = {username: '', nick_name: '', email: ''}
}
function handleSizeChange() {
@ -187,8 +208,11 @@ function handleSizeChange() {
}
function getList() {
const params = {
[search_type.value]: search_form.value[search_type.value as keyof typeof search_form.value],
}
return userManageApi
.getUserManage(paginationConfig, search_form.value.name, loading)
.getUserManage(paginationConfig, params, loading)
.then((res) => {
userTableData.value = res.data.records
paginationConfig.total = res.data.total