import React from 'react'; import type { TreeSelectProps } from 'antd'; import type { Service, Options, Result } from 'ahooks/lib/useRequest/src/types'; import type { ProFormOtherType } from '../../../ProForm/propsType'; /** * 树数据属性 * @description 定义树节点的基本数据属性 */ export interface ProTreeSelectDataType { /** * 节点标签 * @description 显示的节点文本 * @default undefined */ label: string; /** * 节点值 * @description 节点的唯一标识 * @default undefined */ value?: string; /** * 是否禁用 * @description 是否禁用节点 * @default false */ disabled?: boolean; /** * 禁用复选框 * @description 是否禁用复选框 * @default false */ disableCheckbox?: boolean; /** * 是否可选 * @description 是否可以选中 * @default true */ selectable?: boolean; /** * 是否可勾选 * @description 是否可以勾选 * @default undefined */ checkable?: boolean; /** * 标题 * @description 节点标题 * @default undefined */ title?: string; } /** * 数据选项 * @description 扩展的数据选项接口 */ export interface ProTreeSelectDataOptionType { /** * 节点标签 * @description 显示的节点文本 * @default undefined */ label: string; /** * 节点值 * @description 节点的唯一标识 * @default undefined */ value?: string; /** * 是否禁用 * @description 是否禁用节点 * @default false */ disabled?: boolean; /** * 禁用复选框 * @description 是否禁用复选框 * @default false */ disableCheckbox?: boolean; /** * 是否可选 * @description 是否可以选中 * @default true */ selectable?: boolean; /** * 是否可勾选 * @description 是否可以勾选 * @default undefined */ checkable?: boolean; /** * 子节点 * @description 当前节点的子节点数组 * @default undefined */ children?: ProTreeSelectDataType[]; /** * 标题 * @description 节点标题 * @default undefined */ title?: string; /** * 自定义属性 * @description 可添加任意其他属性 * @default undefined */ [key: string]: any; } /** * 基础选项类型 * @description 基础选项类型定义 */ export interface ProTreeSelectBaseOptionType { /** * 是否禁用 * @description 是否禁用节点 * @default false */ disabled?: boolean; /** * 是否可勾选 * @description 是否可以勾选 * @default undefined */ checkable?: boolean; /** * 禁用复选框 * @description 是否禁用复选框 * @default false */ disableCheckbox?: boolean; /** * 子节点 * @description 当前节点的子节点数组 * @default undefined */ children?: ProTreeSelectBaseOptionType[]; /** * 自定义属性 * @description 可添加任意其他属性 * @default undefined */ [name: string]: any; } /** * 默认选项类型 * @description 扩展基础选项类型的默认选项类型 */ export interface ProTreeSelectDefaultOptionType extends ProTreeSelectBaseOptionType { /** * 节点值 * @description 节点的值 * @default undefined */ value?: any; /** * 标题 * @description 节点的标题 * @default undefined */ title?: React.ReactNode; /** * 标签 * @description 节点的显示标签 * @default undefined */ label: React.ReactNode; /** * 键值 * @description 节点的键值 * @default undefined */ key?: React.Key; /** * 子节点 * @description 子节点数组 * @default undefined */ children?: ProTreeSelectDefaultOptionType[]; } /** * 树选择属性 * @description 树选择组件的配置属性 */ export interface ProTreeSelectType extends Omit { /** * 是否查看模式 * @description 是否为查看模式 * @default false */ isView?: boolean; /** * 过滤树节点 * @description 是否根据输入项进行筛选 * @default true */ filterTreeNode?: boolean; /** * 树节点过滤属性 * @description 输入项过滤对应的 treeNode 属性 * @default 'label' */ treeNodeFilterProp?: string; /** * 默认展开所有 * @description 是否展开所有树 * @default false */ treeDefaultExpandAll?: boolean; /** * 树可选择 * @description 是否支持复选、多选 * @default true */ treeCheckable?: boolean; /** * 宽度 * @description 输入框宽度 * @default '100%' */ width?: any; /** * 枚举代码 * @description 从localStorage里面根据此code取枚举值 * @default undefined */ code?: string; /** * 数据源 * @description 选择项数据源 * @default [] */ dataSource?: ProTreeSelectDataOptionType[]; /** * 默认禁用值 * @description 兼容2.0版本、3.0使用view模式,查看模式值 * @default undefined */ defaultDisableValue?: string; /** * 响应数据转换 * @description 格式化接口响应数据 * @default undefined */ transformResponse?: (data: any) => ProTreeSelectDataOptionType[]; /** * 是否显示提示 * @description 是否展示tooltip,当label特别长的时候使用 * @default false */ tooltip?: boolean; /** * 显示代码名称 * @description 是否展示code-label形式 * @default false */ showCodeName?: boolean; /** * 其他属性 * @description 集成表单form的属性 * @default undefined */ otherProps?: ProFormOtherType; /** * 搜索回调 * @description 搜索时的回调函数 * @default undefined */ onSearch?: (value: string, useRequest: Result) => void; /** * 远程请求 * @description 远程请求接口配置 * @default undefined */ useRequest?: { service: Service; options?: Options; }; /** * 默认展开所有 * @description 默认展开所有树节点 * @default false */ defaultExpandAll?: boolean; /** * 展开的节点 * @description 展开指定的树节点 * @default [] */ expandedKeys?: any[]; /** * 严格选择 * @description 父子节点选中状态不再关联 * @default false */ checkStrictly?: boolean; /** * 可勾选 * @description 是否可以勾选 * @default false */ checkable?: boolean; /** * 显示省略号 * @description 是否单行省略 * @default false */ showEllipse?: boolean; /** * 是否差异比对 * @description 是否处于比对模式 * @default false */ isDiffChange?: boolean; } /** * ProSelect操作 * @description ProSelect组件的操作接口 */ export interface ProTreeSelectActionType { /** * useRequest引用 * @description 获取发生请求的useRequest的ref * @default undefined */ useRequestRef: Result; } /** * 树节点数据 * @description 树节点的数据结构 */ export interface ProTreeSelectNodeDataType extends ProTreeSelectDataOptionType { /** * 标题 * @description 节点的标题 * @default undefined */ title: string; /** * 值 * @description 节点的值 * @default undefined */ value: string; /** * 子节点 * @description 子节点数组 * @default undefined */ children?: ProTreeSelectNodeDataType[]; /** * 图标 * @description 节点的图标 * @default undefined */ icon?: React.ReactNode; /** * 隐藏节点类名 * @description 隐藏节点的类名 * @default undefined */ hideNodeClass?: string; } /** * 树选择表单属性 * @description 树选择表单的配置属性 */ export interface ProTreeSelectFormType { /** * 类型 * @description 表单项类型 * @default undefined */ type: string; /** * 标签 * @description 表单项标签 * @default undefined */ label: string; /** * 名称 * @description 表单项字段名 * @default undefined */ name?: string; /** * 字段属性 * @description 树选择组件的属性配置 * @default undefined */ fieldProps?: ProTreeSelectType; /** * 自定义属性 * @description 其他自定义属性 * @default undefined */ [key: string]: any; } /** * 响应数据 * @description API响应数据结构 */ export interface ProTreeSelectResponseDataType { /** * 状态码 * @description 接口返回的状态码 * @default undefined */ status: number; /** * 消息 * @description 接口返回的消息 * @default undefined */ message: string; /** * 数据 * @description 接口返回的数据 * @default undefined */ data: any; /** * 是否成功 * @description 请求是否成功 * @default undefined */ success?: boolean; /** * 代码 * @description 业务代码 * @default undefined */ code?: number; }