忘记密码与部门改为懒加载

This commit is contained in:
孙景学
2025-07-18 13:39:45 +08:00
parent e637f62d86
commit 505562892f
8 changed files with 480 additions and 61 deletions

View File

@ -1,17 +1,23 @@
import React, { useState, useEffect } from 'react';
import { TreeSelect } from 'antd';
import React, { useEffect, useState } from 'react';
import { TreeSelect, Spin } from 'antd';
import { treeData } from './services'; // 你的接口
export interface AccessDepartmentSelectProps {
value?: string | number;
onChange?: (value: string | number) => void;
placeholder?: string;
disabled?: boolean;
style?: React.CSSProperties;
}
interface orgData {
orgName: string;
// 树节点类型
interface OrgNode {
orgId: string;
children?: orgData[];
orgName: string;
children?: OrgNode[];
isLeaf?: boolean;
key?: string;
title?: string;
}
const AccessDepartmentSelect: React.FC<AccessDepartmentSelectProps> = ({
@ -19,36 +25,70 @@ const AccessDepartmentSelect: React.FC<AccessDepartmentSelectProps> = ({
onChange,
placeholder = '请选择准入部门',
disabled = false,
style = { width: 200 },
}) => {
const [userOrgAll, setUserOrgAll] = useState<orgData[]>([]);
const [tree, setTree] = useState<OrgNode[]>([]);
const [loading, setLoading] = useState(false);
useEffect(() => {
const userOrgAllStr = sessionStorage.getItem('userOrgAll');
const userOrgAll = userOrgAllStr ? JSON.parse(userOrgAllStr) : [];
setUserOrgAll(userOrgAll);
}, []);
// TreeSelect 要的数据结构
function buildTree(data: orgData[]): any[] {
// 转换接口为 TreeSelect 结构
function formatTree(data: OrgNode[]): any[] {
return data.map(item => ({
...item,
title: item.orgName,
value: item.orgId,
key: item.orgId,
children: item.children && item.children.length > 0 ? buildTree(item.children) : undefined,
// isLeaf: item.isLeaf || false,
// children: item.children && item.children.length > 0 ? formatTree(item.children) : undefined,
}));
}
// 懒加载节点
const onLoadData = async (treeNode: any) => {
if (treeNode.children && treeNode.children.length > 0) return;
setLoading(true);
const { code, data } = await treeData({ upOrgId: treeNode.value });
if (code === 200 && Array.isArray(data)) {
setTree(origin => updateNode(origin, treeNode.value, formatTree(data)));
}
setLoading(false);
};
// 递归插入children
function updateNode(list: OrgNode[], key: string, children: OrgNode[]): OrgNode[] {
return list.map(node => {
if (node.orgId === key) return { ...node, children };
if (node.children) return { ...node, children: updateNode(node.children, key, children) };
return node;
});
}
// 初始化
useEffect(() => {
setLoading(true);
treeData({}).then(res => {
if (res.code === 200 && Array.isArray(res.data)) {
setTree(formatTree(res.data));
}
setLoading(false);
});
}, []);
return (
<TreeSelect
value={value}
onChange={onChange}
placeholder={placeholder}
disabled={disabled}
treeData={buildTree(userOrgAll)}
allowClear
style={{ width: '160px' }}
showSearch
/>
<Spin spinning={loading}>
<TreeSelect
value={value}
treeData={tree}
onChange={onChange}
placeholder={placeholder}
disabled={disabled}
allowClear
style={style}
showSearch
loadData={onLoadData}
treeDefaultExpandAll={false}
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
/>
</Spin>
);
};

View File

@ -4,8 +4,13 @@ import request from '@/utils/request';
* 部门
*/
export const queryUserOrgAll = () => request.get(`/org/queryUserOrgAll`);
/**
* 部门列表
*/
interface treeInterface {
upOrgId?: string
}
export const treeData = (params: treeInterface) => request.get('/org/list', { params });