review:【antd】【BPM】代码迁移的 review

This commit is contained in:
YunaiV
2025-12-08 08:59:55 +08:00
parent 67ed1753a7
commit f1c7a4ebfb
4 changed files with 32 additions and 47 deletions

View File

@@ -1 +1 @@
export { default as DeptSelectModal } from './dept-select-modal.vue'; export { default as DeptSelectModal } from './select-modal.vue';

View File

@@ -16,16 +16,11 @@ defineOptions({ name: 'DeptSelectModal' });
const props = withDefaults( const props = withDefaults(
defineProps<{ defineProps<{
// cancelText?: string; //
cancelText?: string; checkStrictly?: boolean; // checkable
// checkable confirmText?: string; //
checkStrictly?: boolean; multiple?: boolean; //
// title?: string; //
confirmText?: string;
//
multiple?: boolean;
//
title?: string;
}>(), }>(),
{ {
cancelText: '取消', cancelText: '取消',
@@ -41,17 +36,13 @@ const emit = defineEmits<{
}>(); }>();
type checkedKeys = number[] | { checked: number[]; halfChecked: number[] }; type checkedKeys = number[] | { checked: number[]; halfChecked: number[] };
// const deptTree = ref<DataNode[]>([]); //
const deptTree = ref<DataNode[]>([]); const selectedDeptIds = ref<checkedKeys>([]); // ID
// ID const deptData = ref<SystemDeptApi.Dept[]>([]); //
const selectedDeptIds = ref<checkedKeys>([]);
//
const deptData = ref<SystemDeptApi.Dept[]>([]);
//
const [Modal, modalApi] = useVbenModal({ const [Modal, modalApi] = useVbenModal({
async onConfirm() { async onConfirm() {
// ID // ID
const selectedIds: number[] = Array.isArray(selectedDeptIds.value) const selectedIds: number[] = Array.isArray(selectedDeptIds.value)
? selectedDeptIds.value ? selectedDeptIds.value
: selectedDeptIds.value.checked || []; : selectedDeptIds.value.checked || [];

View File

@@ -1 +1 @@
export { default as UserSelectModal } from './user-select-modal.vue'; export { default as UserSelectModal } from './select-modal.vue';

View File

@@ -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,
}, },
}); }); //
// Transfer
const transferDataSource = computed(() => { const transferDataSource = computed(() => {
return [ return [
...leftListState.value.dataSource, ...leftListState.value.dataSource,
...rightListState.value.dataSource, ...rightListState.value.dataSource,
]; ];
}); }); // Transfer
//
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() {
// 使 Set ID // 使 Set 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[]) {
// 使 Set ID // 使 Set ID
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) {
// ID // 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),