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

feat: add source selection option in user search and improve code formatting

Browse Source
This commit is contained in:
wxg0103 2025-08-04 15:21:12 +08:00
parent 6e1fb1d4ce
commit b5fe64d619
2 changed files with 92 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -67,8 +67,12 @@
style="width: 120px" style="width: 120px"
@change="search_type_change" @change="search_type_change"
> >
<el-option :label="$t('views.login.loginForm.username.label')" value="username" /> <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.userManage.userForm.nick_name.label')" value="nick_name"/>
<el-option
:label="$t('views.userManage.source.label')"
value="source"
/>
</el-select> </el-select>
<el-input <el-input
v-if="search_type === 'username'" v-if="search_type === 'username'"
@ -84,6 +88,23 @@
style="width: 220px" style="width: 220px"
clearable clearable
/> />
<el-select
v-else-if="search_type === 'source'"
v-model="search_form.source"
@change="getList"
style="width: 220px"
clearable
:placeholder="$t('common.inputPlaceholder')"
>
<el-option :label="$t('views.userManage.source.local')" value="LOCAL"/>
<el-option label="CAS" value="CAS"/>
<el-option label="LDAP" value="LDAP"/>
<el-option label="OIDC" value="OIDC"/>
<el-option label="OAuth2" value="OAuth2"/>
<el-option :label="$t('views.userManage.source.wecom')" value="wecom"/>
<el-option :label="$t('views.userManage.source.lark')" value="lark"/>
<el-option :label="$t('views.userManage.source.dingtalk')" value="dingtalk"/>
</el-select>
</div> </div>
</div> </div>
<app-table <app-table
@ -97,7 +118,7 @@
@sort-change="handleSortChange" @sort-change="handleSortChange"
:maxTableHeight="270" :maxTableHeight="270"
> >
<el-table-column type="selection" width="55" /> <el-table-column type="selection" width="55"/>
<el-table-column <el-table-column
prop="nick_name" prop="nick_name"
:label="$t('views.userManage.userForm.nick_name.label')" :label="$t('views.userManage.userForm.nick_name.label')"
@ -114,7 +135,7 @@
<template #default="{ row }"> <template #default="{ row }">
<div v-if="row.is_active" class="flex align-center"> <div v-if="row.is_active" class="flex align-center">
<el-icon class="color-success mr-8" style="font-size: 16px"> <el-icon class="color-success mr-8" style="font-size: 16px">
<SuccessFilled /> <SuccessFilled/>
</el-icon> </el-icon>
<span class="color-secondary"> <span class="color-secondary">
{{ $t('common.status.enabled') }} {{ $t('common.status.enabled') }}
@ -154,7 +175,7 @@
min-width="150" min-width="150"
> >
<template #default="{ row }"> <template #default="{ row }">
<TagGroup :tags="row.user_group_names" /> <TagGroup :tags="row.user_group_names"/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="source" :label="$t('views.userManage.source.label')"> <el-table-column prop="source" :label="$t('views.userManage.source.label')">
@ -201,7 +222,7 @@
" "
/> />
</span> </span>
<el-divider direction="vertical" /> <el-divider direction="vertical"/>
<span class="mr-8"> <span class="mr-8">
<el-button <el-button
type="primary" type="primary"
@ -243,7 +264,7 @@
" "
> >
<el-icon> <el-icon>
<Lock /> <Lock/>
</el-icon> </el-icon>
</el-button> </el-button>
</span> </span>
@ -284,45 +305,47 @@
ref="UserDrawerRef" ref="UserDrawerRef"
@refresh="refresh" @refresh="refresh"
/> />
<UserPwdDialog ref="UserPwdDialogRef" @refresh="refresh" /> <UserPwdDialog ref="UserPwdDialogRef" @refresh="refresh"/>
<SetUserGroupsDialog <SetUserGroupsDialog
:optionLoading="optionLoading" :optionLoading="optionLoading"
:chatGroupList="chatGroupList" :chatGroupList="chatGroupList"
ref="setUserGroupsRef" ref="setUserGroupsRef"
@refresh="refresh" @refresh="refresh"
/> />
<SyncUsersDialog ref="syncUsersDialogRef" @refresh="refresh" /> <SyncUsersDialog ref="syncUsersDialogRef" @refresh="refresh"/>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, ref, reactive } from 'vue' import {onMounted, ref, reactive} from 'vue'
import UserDrawer from './component/UserDrawer.vue' import UserDrawer from './component/UserDrawer.vue'
import UserPwdDialog from './component/UserPwdDialog.vue' import UserPwdDialog from './component/UserPwdDialog.vue'
import SetUserGroupsDialog from './component/SetUserGroupsDialog.vue' import SetUserGroupsDialog from './component/SetUserGroupsDialog.vue'
import SyncUsersDialog from './component/SyncUsersDialog.vue' import SyncUsersDialog from './component/SyncUsersDialog.vue'
import userManageApi from '@/api/system/chat-user' import userManageApi from '@/api/system/chat-user'
import { datetimeFormat } from '@/utils/time' import {datetimeFormat} from '@/utils/time'
import { MsgSuccess, MsgConfirm } from '@/utils/message' import {MsgSuccess, MsgConfirm} from '@/utils/message'
import { t } from '@/locales' import {t} from '@/locales'
import type { ChatUserItem } from '@/api/type/systemChatUser' import type {ChatUserItem} from '@/api/type/systemChatUser'
import SystemGroupApi from '@/api/system/user-group' import SystemGroupApi from '@/api/system/user-group'
import type { ListItem } from '@/api/type/common' import type {ListItem} from '@/api/type/common'
import { PermissionConst, RoleConst } from '@/utils/permission/data' import {PermissionConst, RoleConst} from '@/utils/permission/data'
import { ComplexPermission } from '@/utils/permission/type' import {ComplexPermission} from '@/utils/permission/type'
import { hasPermission } from '@/utils/permission' import {hasPermission} from '@/utils/permission'
import { loadPermissionApi } from '@/utils/dynamics-api/permission-api.ts' import {loadPermissionApi} from '@/utils/dynamics-api/permission-api.ts'
const search_type = ref('username') const search_type = ref('username')
const search_form = ref<{ const search_form = ref<{
username: string username: string
nick_name?: string nick_name?: string
source?: string
}>({ }>({
username: '', username: '',
nick_name: '', nick_name: '',
source: '',
}) })
const search_type_change = () => { const search_type_change = () => {
search_form.value = { username: '', nick_name: '' } search_form.value = {username: '', nick_name: '', source: ''}
} }
const loading = ref(false) const loading = ref(false)
@ -357,7 +380,7 @@ function getList() {
const orderBy = ref<string>('') const orderBy = ref<string>('')
function handleSortChange({ prop, order }: { prop: string; order: string }) { function handleSortChange({prop, order}: { prop: string; order: string }) {
orderBy.value = order === 'ascending' ? prop : `-${prop}` orderBy.value = order === 'ascending' ? prop : `-${prop}`
getList() getList()
} }
@ -412,7 +435,8 @@ function deleteUserManage(row: ChatUserItem) {
getList() getList()
}) })
}) })
.catch(() => {}) .catch(() => {
})
} }
const UserPwdDialogRef = ref() const UserPwdDialogRef = ref()
@ -443,7 +467,7 @@ async function getChatGroupList() {
} }
function handleBatchDelete() { function handleBatchDelete() {
MsgConfirm(t('views.chatUser.batchDeleteUser', { count: multipleSelection.value.length }), '', { MsgConfirm(t('views.chatUser.batchDeleteUser', {count: multipleSelection.value.length}), '', {
confirmButtonText: t('common.confirm'), confirmButtonText: t('common.confirm'),
confirmButtonClass: 'danger', confirmButtonClass: 'danger',
}) })
@ -458,7 +482,8 @@ function handleBatchDelete() {
await getList() await getList()
}) })
}) })
.catch(() => {}) .catch(() => {
})
} }
const setUserGroupsRef = ref<InstanceType<typeof SetUserGroupsDialog>>() const setUserGroupsRef = ref<InstanceType<typeof SetUserGroupsDialog>>()

62
ui/src/views/system-chat-user/group/index.vue
View File

@ -34,7 +34,7 @@
" "
> >
<el-icon :size="18"> <el-icon :size="18">
<Plus /> <Plus/>
</el-icon> </el-icon>
</el-button> </el-button>
</el-tooltip> </el-tooltip>
@ -108,7 +108,7 @@
<div class="user-right" v-loading="rightLoading"> <div class="user-right" v-loading="rightLoading">
<div class="flex align-center"> <div class="flex align-center">
<h4 class="medium ellipsis" :title="current?.name">{{ current?.name }}</h4> <h4 class="medium ellipsis" :title="current?.name">{{ current?.name }}</h4>
<el-divider direction="vertical" class="mr-8 ml-8" /> <el-divider direction="vertical" class="mr-8 ml-8"/>
<AppIcon <AppIcon
iconName="app-workspace" iconName="app-workspace"
style="font-size: 16px" style="font-size: 16px"
@ -158,11 +158,15 @@
</div> </div>
<div class="flex-between complex-search"> <div class="flex-between complex-search">
<el-select class="complex-search__left" v-model="searchType" style="width: 120px"> <el-select class="complex-search__left" v-model="searchType" style="width: 120px">
<el-option :label="$t('views.login.loginForm.username.label')" value="username" /> <el-option :label="$t('views.login.loginForm.username.label')" value="username"/>
<el-option <el-option
:label="$t('views.userManage.userForm.nick_name.label')" :label="$t('views.userManage.userForm.nick_name.label')"
value="nick_name" value="nick_name"
/> />
<el-option
:label="$t('views.userManage.source.label')"
value="source"
/>
</el-select> </el-select>
<el-input <el-input
v-if="searchType === 'username'" v-if="searchType === 'username'"
@ -180,6 +184,23 @@
style="width: 220px" style="width: 220px"
clearable clearable
/> />
<el-select
v-else-if="searchType === 'source'"
v-model="searchForm.source"
@change="getList"
style="width: 220px"
clearable
:placeholder="$t('common.inputPlaceholder')"
>
<el-option :label="$t('views.userManage.source.local')" value="LOCAL"/>
<el-option label="CAS" value="CAS"/>
<el-option label="LDAP" value="LDAP"/>
<el-option label="OIDC" value="OIDC"/>
<el-option label="OAuth2" value="OAuth2"/>
<el-option :label="$t('views.userManage.source.wecom')" value="wecom"/>
<el-option :label="$t('views.userManage.source.lark')" value="lark"/>
<el-option :label="$t('views.userManage.source.dingtalk')" value="dingtalk"/>
</el-select>
</div> </div>
</div> </div>
@ -191,13 +212,13 @@
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
:maxTableHeight="330" :maxTableHeight="330"
> >
<el-table-column type="selection" width="55" /> <el-table-column type="selection" width="55"/>
<el-table-column <el-table-column
prop="nick_name" prop="nick_name"
:label="$t('views.userManage.userForm.nick_name.label')" :label="$t('views.userManage.userForm.nick_name.label')"
show-overflow-tooltip show-overflow-tooltip
/> />
<el-table-column prop="username" :label="$t('views.login.loginForm.username.label')" /> <el-table-column prop="username" :label="$t('views.login.loginForm.username.label')"/>
<el-table-column prop="source" :label="$t('views.userManage.source.label')"> <el-table-column prop="source" :label="$t('views.userManage.source.label')">
<template #default="{ row }"> <template #default="{ row }">
{{ {{
@ -244,24 +265,24 @@
</div> </div>
</el-card> </el-card>
<CreateOrUpdateGroupDialog ref="createOrUpdateGroupDialogRef" @refresh="refresh" /> <CreateOrUpdateGroupDialog ref="createOrUpdateGroupDialogRef" @refresh="refresh"/>
<CreateGroupUserDialog ref="createGroupUserDialogRef" @refresh="getList" /> <CreateGroupUserDialog ref="createGroupUserDialogRef" @refresh="getList"/>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, ref, watch, reactive } from 'vue' import {onMounted, ref, watch, reactive} from 'vue'
import SystemGroupApi from '@/api/system/user-group' import SystemGroupApi from '@/api/system/user-group'
import { t } from '@/locales' import {t} from '@/locales'
import type { ChatUserGroupUserItem } from '@/api/type/systemChatUser' import type {ChatUserGroupUserItem} from '@/api/type/systemChatUser'
import CreateOrUpdateGroupDialog from './component/CreateOrUpdateGroupDialog.vue' import CreateOrUpdateGroupDialog from './component/CreateOrUpdateGroupDialog.vue'
import CreateGroupUserDialog from './component/CreateGroupUserDialog.vue' import CreateGroupUserDialog from './component/CreateGroupUserDialog.vue'
import type { ListItem } from '@/api/type/common' import type {ListItem} from '@/api/type/common'
import { MsgSuccess, MsgConfirm } from '@/utils/message' import {MsgSuccess, MsgConfirm} from '@/utils/message'
import { PermissionConst, RoleConst } from '@/utils/permission/data' import {PermissionConst, RoleConst} from '@/utils/permission/data'
import { ComplexPermission } from '@/utils/permission/type' import {ComplexPermission} from '@/utils/permission/type'
import { hasPermission } from '@/utils/permission/index' import {hasPermission} from '@/utils/permission/index'
import { loadPermissionApi } from '@/utils/dynamics-api/permission-api.ts' import {loadPermissionApi} from '@/utils/dynamics-api/permission-api.ts'
const filterText = ref('') const filterText = ref('')
const loading = ref(false) const loading = ref(false)
@ -347,7 +368,8 @@ function deleteGroup(item: ListItem) {
current.value = item.id === current.value?.id ? list.value[0] : current.value current.value = item.id === current.value?.id ? list.value[0] : current.value
}) })
}) })
.catch(() => {}) .catch(() => {
})
} }
async function refresh(group?: ListItem) { async function refresh(group?: ListItem) {
@ -366,6 +388,7 @@ const searchType = ref('username')
const searchForm = ref<Record<string, any>>({ const searchForm = ref<Record<string, any>>({
username: '', username: '',
nick_name: '', nick_name: '',
source: '',
}) })
const paginationConfig = reactive({ const paginationConfig = reactive({
current_page: 1, current_page: 1,
@ -422,7 +445,7 @@ function handleDeleteUser(item?: ChatUserGroupUserItem) {
MsgConfirm( MsgConfirm(
item item
? `${t('views.workspace.member.delete.confirmTitle')}${item.nick_name} ?` ? `${t('views.workspace.member.delete.confirmTitle')}${item.nick_name} ?`
: t('views.chatUser.group.batchDeleteMember', { count: multipleSelection.value.length }), : t('views.chatUser.group.batchDeleteMember', {count: multipleSelection.value.length}),
'', '',
{ {
confirmButtonText: t('common.confirm'), confirmButtonText: t('common.confirm'),
@ -445,7 +468,8 @@ function handleDeleteUser(item?: ChatUserGroupUserItem) {
await getList() await getList()
}) })
}) })
.catch(() => {}) .catch(() => {
})
} }
const mouseId = ref('') const mouseId = ref('')