@@ -23,7 +23,7 @@ import {
import { getSimpleDeptList } from '#/api/system/dept' ;
import { getSimpleDeptList } from '#/api/system/dept' ;
import { getUserPage } from '#/api/system/user' ;
import { getUserPage } from '#/api/system/user' ;
/ / 部 门 树 节 点 接 口
/** 部门树节点接口 */
interface DeptTreeNode {
interface DeptTreeNode {
key : string ;
key : string ;
title : string ;
title : string ;
@@ -67,7 +67,6 @@ const deptSearchKeys = ref('');
const userList = ref < SystemUserApi .User [ ] > ( [ ] ) ; / / 存 储 所 有 已 知 用 户
const userList = ref < SystemUserApi .User [ ] > ( [ ] ) ; / / 存 储 所 有 已 知 用 户
const selectedUserIds = ref < string [ ] > ( [ ] ) ;
const selectedUserIds = ref < string [ ] > ( [ ] ) ;
/ / 弹 窗 配 置
const [ Modal , modalApi ] = useVbenModal ( {
const [ Modal , modalApi ] = useVbenModal ( {
onCancel : handleCancel ,
onCancel : handleCancel ,
onClosed : handleClosed ,
onClosed : handleClosed ,
@@ -121,7 +120,6 @@ const [Modal, modalApi] = useVbenModal({
destroyOnClose : true ,
destroyOnClose : true ,
} ) ;
} ) ;
/ / 左 侧 列 表 状 态
const leftListState = ref ( {
const leftListState = ref ( {
searchValue : '' ,
searchValue : '' ,
dataSource : [ ] as SystemUserApi . User [ ] ,
dataSource : [ ] as SystemUserApi . User [ ] ,
@@ -130,9 +128,8 @@ const leftListState = ref({
pageSize : 10 ,
pageSize : 10 ,
total : 0 ,
total : 0 ,
} ,
} ,
} ) ;
} ) ; / / 左 侧 列 表 状 态
/ / 右 侧 列 表 状 态
const rightListState = ref ( {
const rightListState = ref ( {
searchValue : '' ,
searchValue : '' ,
dataSource : [ ] as SystemUserApi . User [ ] ,
dataSource : [ ] as SystemUserApi . User [ ] ,
@@ -141,17 +138,15 @@ const rightListState = ref({
pageSize : 10 ,
pageSize : 10 ,
total : 0 ,
total : 0 ,
} ,
} ,
} ) ;
} ) ; / / 右 侧 列 表 状 态
/ / 计 算 属 性 : T r a n s f e r 数 据 源
const transferDataSource = computed ( ( ) => {
const transferDataSource = computed ( ( ) => {
return [
return [
... leftListState . value . dataSource ,
... leftListState . value . dataSource ,
... rightListState . value . dataSource ,
... rightListState . value . dataSource ,
] ;
] ;
} ) ;
} ) ; / / 计 算 属 性 : T r a n s f e r 数 据 源
/ / 过 滤 部 门 树 数 据
const filteredDeptTree = computed ( ( ) => {
const filteredDeptTree = computed ( ( ) => {
if ( ! deptSearchKeys . value ) return deptTree . value ;
if ( ! deptSearchKeys . value ) return deptTree . value ;
@@ -189,9 +184,9 @@ const filteredDeptTree = computed(() => {
} ;
} ;
return deptTree . value . map ( ( node : any ) => filterNode ( node ) ) . filter ( Boolean ) ;
return deptTree . value . map ( ( node : any ) => filterNode ( node ) ) . filter ( Boolean ) ;
} ) ;
} ) ; / / 过 滤 部 门 树 数 据
/ / 加 载 用 户 数 据
/** 加载用户数据 */
async function loadUserData ( pageNo : number , pageSize : number ) {
async function loadUserData ( pageNo : number , pageSize : number ) {
try {
try {
const { list , total } = await getUserPage ( {
const { list , total } = await getUserPage ( {
@@ -218,9 +213,9 @@ async function loadUserData(pageNo: number, pageSize: number) {
}
}
}
}
/ / 更 新 右 侧 列 表 数 据
/** 更新右侧列表数据 */
function updateRightListData ( ) {
function updateRightListData ( ) {
/ / 使 用 S e t 来 去 重 选 中 的 用 户 I D
/ / 使 用 S e t 来 去 重 选 中 的 用 户 ID
const uniqueSelectedIds = new Set ( selectedUserIds . value ) ;
const uniqueSelectedIds = new Set ( selectedUserIds . value ) ;
/ / 获 取 选 中 的 用 户 , 确 保 不 重 复
/ / 获 取 选 中 的 用 户 , 确 保 不 重 复
@@ -250,19 +245,19 @@ function updateRightListData() {
rightListState . value . dataSource = filteredUsers . slice ( startIndex , endIndex ) ;
rightListState . value . dataSource = filteredUsers . slice ( startIndex , endIndex ) ;
}
}
/ / 处 理 左 侧 分 页 变 化
/** 处理左侧分页变化 */
async function handleLeftPaginationChange ( page : number , pageSize : number ) {
async function handleLeftPaginationChange ( page : number , pageSize : number ) {
await loadUserData ( page , pageSize ) ;
await loadUserData ( page , pageSize ) ;
}
}
/ / 处 理 右 侧 分 页 变 化
/** 处理右侧分页变化 */
function handleRightPaginationChange ( page : number , pageSize : number ) {
function handleRightPaginationChange ( page : number , pageSize : number ) {
rightListState . value . pagination . current = page ;
rightListState . value . pagination . current = page ;
rightListState . value . pagination . pageSize = pageSize ;
rightListState . value . pagination . pageSize = pageSize ;
updateRightListData ( ) ;
updateRightListData ( ) ;
}
}
/ / 处 理 用 户 搜 索
/** 处理用户搜索 */
async function handleUserSearch ( direction : string , value : string ) {
async function handleUserSearch ( direction : string , value : string ) {
if ( direction === 'left' ) {
if ( direction === 'left' ) {
leftListState . value . searchValue = value ;
leftListState . value . searchValue = value ;
@@ -275,7 +270,7 @@ async function handleUserSearch(direction: string, value: string) {
}
}
}
}
/ / 处 理 用 户 选 择 变 化
/** 处理用户选择变化 */
function handleUserChange ( targetKeys : string [ ] ) {
function handleUserChange ( targetKeys : string [ ] ) {
/ / 使 用 S e t 来 去 重 选 中 的 用 户 I D
/ / 使 用 S e t 来 去 重 选 中 的 用 户 I D
selectedUserIds . value = [ ... new Set ( targetKeys ) ] ;
selectedUserIds . value = [ ... new Set ( targetKeys ) ] ;
@@ -283,14 +278,13 @@ function handleUserChange(targetKeys: string[]) {
updateRightListData ( ) ;
updateRightListData ( ) ;
}
}
/ / 重 置 数 据
/** 重置数据 */
function resetData ( ) {
function resetData ( ) {
userList . value = [ ] ;
userList . value = [ ] ;
selectedUserIds . value = [ ] ;
selectedUserIds . value = [ ] ;
/ / 取 消 部 门 选 中
/ / 取 消 部 门 选 中
selectedDeptId . value = undefined ;
selectedDeptId . value = undefined ;
/ / 取 消 选 中 的 用 户
/ / 取 消 选 中 的 用 户
selectedUserIds . value = [ ] ;
selectedUserIds . value = [ ] ;
@@ -320,12 +314,12 @@ function filterOption(inputValue: string, option: any) {
return option . username . toLowerCase ( ) . includes ( inputValue . toLowerCase ( ) ) ;
return option . username . toLowerCase ( ) . includes ( inputValue . toLowerCase ( ) ) ;
}
}
/ / 处 理 部 门 树 展 开 / 折 叠
/** 处理部门树展开/折叠 */
function handleExpand ( keys : Key [ ] ) {
function handleExpand ( keys : Key [ ] ) {
expandedKeys . value = keys ;
expandedKeys . value = keys ;
}
}
/ / 处 理 部 门 搜 索
/** 处理部门搜索 */
function handleDeptSearch ( value : string ) {
function handleDeptSearch ( value : string ) {
deptSearchKeys . value = value ;
deptSearchKeys . value = value ;
@@ -348,9 +342,9 @@ function handleDeptSearch(value: string) {
}
}
}
}
/ / 处 理 部 门 选 择
/** 处理部门选择 */
async function handleDeptSelect ( selectedKeys : Key [ ] , _info : any ) {
async function handleDeptSelect ( selectedKeys : Key [ ] , _info : any ) {
/ / 更 新 选 中 的 部 门 I D
/ / 更 新 选 中 的 部 门 ID
const newDeptId =
const newDeptId =
selectedKeys . length > 0 ? Number ( selectedKeys [ 0 ] ) : undefined ;
selectedKeys . length > 0 ? Number ( selectedKeys [ 0 ] ) : undefined ;
selectedDeptId . value =
selectedDeptId . value =
@@ -362,7 +356,7 @@ async function handleDeptSelect(selectedKeys: Key[], _info: any) {
await loadUserData ( 1 , pageSize ) ;
await loadUserData ( 1 , pageSize ) ;
}
}
/ / 确 认 选 择
/** 确认选择 */
function handleConfirm ( ) {
function handleConfirm ( ) {
if ( selectedUserIds . value . length === 0 ) {
if ( selectedUserIds . value . length === 0 ) {
message . warning ( '请选择用户' ) ;
message . warning ( '请选择用户' ) ;
@@ -377,7 +371,7 @@ function handleConfirm() {
modalApi . close ( ) ;
modalApi . close ( ) ;
}
}
/ / 取 消 选 择
/** 取消选择 */
function handleCancel ( ) {
function handleCancel ( ) {
emit ( 'cancel' ) ;
emit ( 'cancel' ) ;
modalApi . close ( ) ;
modalApi . close ( ) ;
@@ -387,13 +381,13 @@ function handleCancel() {
} , 300 ) ;
} , 300 ) ;
}
}
/ / 关 闭 弹 窗
/** 关闭弹窗 */
function handleClosed ( ) {
function handleClosed ( ) {
emit ( 'closed' ) ;
emit ( 'closed' ) ;
resetData ( ) ;
resetData ( ) ;
}
}
/ / 递 归 处 理 部 门 树 节 点
/** 递归处理部门树节点 */
function processDeptNode ( node : any ) : DeptTreeNode {
function processDeptNode ( node : any ) : DeptTreeNode {
return {
return {
key : String ( node . id ) ,
key : String ( node . id ) ,