import type { Api, Option, ReactPropsBase, SchemaBoolean, SchemaClassName, SchemaExpression, SchemaRenderFn } from 'jamis-core'; import type { CSSProperties } from 'react'; import type { ActionSchema, FormOptionsSchema, IFormItemStore, IFormStore, ItemRenderStates, OptionsControlProps, SchemaApi, SchemaObject, SchemaTpl } from '../types'; export interface BaseTreeOptionsSchema extends FormOptionsSchema { /** * 是否隐藏顶级 */ hideRoot?: boolean; /** * 顶级选项的名称 */ rootLabel?: string; /** * 顶级选项的值 */ rootValue?: any; /** * 可选选项的名称, 用于新增或编辑选项的dialog的标题中 */ optionLabel?: string; /** * 创建顶级节点的悬浮提示 * @deprecated 请使用`rootCreateConfig`来配置schema */ rootCreateTip?: string; /** * 顶级节点是否可以创建子节点 * @deprecated 请使用`rootCreateConfig`来配置schema */ rootCreatable?: boolean; /** * 新增根节点配置项 */ rootCreateConfig?: ActionSchema; /** * 显示图标 */ showIcon?: boolean; /** * 是否为选项添加默认的Icon，默认值为true */ enableDefaultIcon?: boolean; /** * ui级联关系，true代表级联选中，false代表不级联，默认为true */ autoCheckChildren?: boolean; autoCheckParent?: boolean; /** * 该属性代表数据级联关系，autoCheckChildren为true时生效，默认为false，具体数据级联关系如下： * 1.casacde为false，ui行为为级联选中子节点，子节点禁用；值只包含父节点的值 * 2.cascade为false，withChildren为true，ui行为为级联选中子节点，子节点禁用；值包含父子节点的值 * 3.cascade为true，ui行为级联选中子节点，子节点可反选，值包含父子节点的值，此时withChildren属性失效 * 4.cascade不论为true还是false，onlyChildren为true，ui行为级联选中子节点，子节点可反选，值只包含子节点的值 */ cascade?: boolean; /** * 选父级的时候是否把子节点的值也包含在内。 */ withChildren?: boolean; /** * 选父级的时候，是否只把子节点的值包含在内 */ onlyChildren?: boolean; /** * 单选时，只运行选择叶子节点 */ onlyLeaf?: boolean; /** * 是否开启节点路径模式 */ enableNodePath?: boolean; /** * 开启节点路径模式后，节点路径的分隔符 */ pathSeparator?: string; /** * 是否显示展开线 */ showOutline?: boolean; deferApi?: SchemaApi; /** * 需要高亮的字符串 */ highlightTxt?: string; /** * 需要高亮的字符串的表达式 */ highlightTxtExpr?: SchemaExpression; /** * 配置指定展开的层级数，从1开始计算, 默认展开第 1 层 */ unfoldedLevel?: number; /** * 配置指定展开的层级数，从1开始计算, 默认展开第 1 层 */ unfoldedLevelExpr?: SchemaExpression; /** 是否默认都展开 */ initiallyOpen?: boolean; sortable?: boolean; sortableOn?: SchemaBoolean; /** 是否可拖拽 */ draggable?: boolean; draggableOn?: SchemaBoolean; /** * 标签字段名 */ labelField?: string; /** * 值字段名 */ valueField?: string; /** 在多选情况下, 点击label时是否不选中, 默认是false*/ clickLabelNoCheck?: boolean; /** 是否使用手风琴模式 */ accordion?: boolean; /** * 树项的样式 */ itemClassName?: SchemaClassName; placeholder?: SchemaTpl; placeholderExpr?: SchemaTpl; optionsPlaceholder?: SchemaTpl; /** * 多选时, 限制最多选择数量 */ maxLength?: number; /** * 多选时, 限制最少选择数量 */ minLength?: number; /** * 隐藏选择框中已选择节点的祖先节点（ancestor） */ hideNodePathLabel?: boolean; /** 是否可搜索 */ searchable?: boolean; /** 搜索字段 */ searchFields?: string[]; /** * 是否精确搜索, 默认是`undefined`, 启用后, 只显示匹配的节点, 不会将匹配的父节点的子节点显示出来 */ searchExact?: boolean; /** 搜索框的placeholder */ searchPlaceholder?: SchemaTpl; /** * `.cxd-Tree-itemDesc`元素的样式类 */ itemDescClassName?: SchemaClassName; /** 开启虚拟列表的阈值, 默认是100 */ virtualThreshold?: number; /** 启用虚拟列表时, 每项的高度, 默认是32px */ itemHeight?: number; virtualListClassName?: SchemaClassName; virtualListHeight?: number; virtualListWidth?: number; virtualListStyle?: CSSProperties; /** * 单选/多选时, 选中一项后是否清空搜索条件 */ autoClearSearchValue?: boolean; /** * 通过数据域来改变值时是否发出`change`事件, 默认是`false` */ emitChangeByScope?: boolean; /** 是否可以切换选中 */ selectTogglable?: boolean; /** * 组件的顶部描述信息 */ topDescInfo?: SchemaObject | SchemaTpl; } /** * Tree 下拉选择框。 */ export interface TreeControlSchema extends BaseTreeOptionsSchema { type: 'tree-select' | 'input-tree'; /** 自定义菜单项 */ menuTpl?: SchemaTpl; /** * 是否以popover形式打开, 默认是 true */ popOverMode?: boolean; popoverClassName?: SchemaClassName; /** * 选中项的显示模式, 默认是 list 列表模式, 也就是一项项单独显示 */ selectedOptionViewMode?: 'list' | 'tree'; /** * 选中值容器样式类 */ valueWrapClassName?: SchemaClassName; /** * 选中值单项的样式类 */ valueClassName?: SchemaClassName; /** 项的标签元素`.cxd-Tree-itemLabel`的样式类 */ itemLabelClassName?: SchemaClassName; /** * 表单项value改变事件监听 */ onChange?: (curr: any, prev: any, itemStore: IFormItemStore, formStore: IFormStore) => any; } export interface TreeSelectProps extends OptionsControlProps, Omit { autoComplete?: Api; } export interface IDropIndicator { left: number; top: number; width: number; height?: number; } export interface TreeDropInfo { /** 拖动的节点 */ dragNode: Option | null; /** 放置的节点 */ node: Option; /** 拖动的三种情况, 上/下/里面 */ position: 'top' | 'bottom' | 'self'; indicator: IDropIndicator; } export interface TreeCompProps extends ReactPropsBase, Pick { highlightTxt?: string; showIcon?: boolean; initiallyOpen?: boolean; unfoldedLevel?: number; showRadio?: boolean; multiple?: boolean; disabled?: boolean; withChildren?: boolean; onlyChildren?: boolean; onlyLeaf?: boolean; labelField?: string; valueField?: string; iconField?: string; unfoldedField?: string; foldedField?: string; showOutline?: boolean; className?: string; itemClassName?: SchemaClassName; itemLabelClassName?: SchemaClassName; /** * `.cxd-Tree-itemDesc`元素的样式类 */ itemDescClassName?: SchemaClassName; joinValues?: boolean; extractValue?: boolean; delimiter?: string; options: Option[]; value?: any; /** * 同步修改结果到父组件, 返回`true`代表同步成功, `false`代表同步失败 */ onChange: (value: any, changedOption?: Option) => Promise | boolean | void; placeholder?: string; hideRoot?: boolean; rootLabel?: string; rootValue?: any; enableNodePath?: boolean; pathSeparator?: string; nodePath?: any[]; cascade?: boolean; /** * ui级联关系，true代表级联选中，false代表不级联，默认为true */ autoCheckChildren?: boolean; /** * UI父子节点级联关系, true 代表选中子时自动选中父, false 代表不选中, 默认是 true */ autoCheckParent?: boolean; /** * 在多选情况下, 点击label时是否不选中, 默认是false */ clickLabelNoCheck?: boolean; /** 点击label时的回调事件 */ dispatchEvent?: (eventName: 'click' | 'sort-asc' | 'sort-desc', value: Record) => Promise; selfDisabledAffectChildren?: boolean; minLength?: number; maxLength?: number; bultinCUD?: boolean; /** @deprecated 请使用 `rootCreateConfig` */ rootCreatable?: boolean; /** @deprecated 请使用 `rootCreateConfig` */ rootCreateTip?: string; rootCreateConfig?: ActionSchema; /** @deprecated 请使用 `createConfig` */ creatable?: boolean; /** @deprecated 请使用 `createConfig` */ createTip?: string; /** 是否可排序 */ sortable?: boolean; /** @deprecated 请使用 `editConfig` */ editable?: boolean; /** @deprecated 请使用 `editConfig` */ editTip?: string; /** @deprecated 请使用 `removeConfig` */ removable?: boolean; /** @deprecated 请使用 `removeConfig` */ removeTip?: string; draggable?: boolean; /** 是否使用手风琴模式 */ accordion?: boolean; /** 开启虚拟列表的阈值, 默认是100 */ virtualThreshold?: number; /** 启用虚拟列表时, 每项的高度, 默认是32px */ itemHeight?: number; virtualListClassName?: SchemaClassName; virtualListHeight?: CSSProperties['height']; virtualListWidth?: CSSProperties['width']; virtualListStyle?: CSSProperties; enableDefaultIcon?: boolean; checkAll?: boolean; checkAllLabel?: string; /** * 搜索字段 */ searchFields?: string[]; /** 是否可切换选中 */ selectTogglable?: boolean; /** menu里的头部描述信息 */ topDescInfo?: string | JSX.Element | null; onAdd?: (idx?: number | Array, value?: any, skipForm?: boolean) => void; onEdit?: (value: Option, origin?: Option, skipForm?: boolean) => void; onDelete?: (value: Option) => void; onDeferLoad?: (option: Option) => void; onExpandTree?: (nodePathArr: any[]) => void; onMove?: (dropInfo: TreeDropInfo) => void; onSort?: (parent: Option | undefined, index: number, mode: 'asc' | 'desc') => void; itemRender?: (option: Option, states: ItemRenderStates) => JSX.Element; render?: SchemaRenderFn; } export type TreeCompRef = { clickItem: (value: any) => boolean; syncUnFolded: (props: Pick, /** * 传入默认展开层级需要重新初始化unfolded */ unfoldedLevel?: number) => any; flattenOptions: (options: Option[], initial?: boolean) => Promise; toggleUnfolded: (node: Option) => void; };