2019-01-01 12:13:51 +08:00
|
|
|
|
// Project: https://github.com/vueComponent/ant-design-vue
|
|
|
|
|
// Definitions by: akki-jat <https://github.com/akki-jat>
|
|
|
|
|
// Definitions: https://github.com/vueComponent/ant-design-vue/types
|
|
|
|
|
|
|
|
|
|
import { AntdComponent } from './component';
|
2019-01-12 11:33:27 +08:00
|
|
|
|
import { VNode } from 'vue';
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
export interface CascaderOptionType {
|
2019-03-18 10:35:24 +08:00
|
|
|
|
value?: string | number;
|
2019-01-01 12:13:51 +08:00
|
|
|
|
label?: any;
|
|
|
|
|
disabled?: boolean;
|
|
|
|
|
children?: any;
|
2019-03-18 10:35:24 +08:00
|
|
|
|
key?: string | number;
|
2019-01-01 12:13:51 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export interface ShowSearchType {
|
|
|
|
|
/**
|
|
|
|
|
* The function will receive two arguments, inputValue and option,
|
|
|
|
|
* if the function returns true, the option will be included in the filtered set; Otherwise, it will be excluded.
|
|
|
|
|
* @type Function
|
|
|
|
|
*/
|
|
|
|
|
filter?: (inputValue: any, path: any) => boolean;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Used to render filtered options, you can use slot="showSearchRender" and slot-scope="{inputValue, path}"
|
|
|
|
|
* @type Function
|
|
|
|
|
*/
|
|
|
|
|
render?: ({ inputValue, path }: { inputValue: any; path: any }) => VNode;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Used to sort filtered options.
|
|
|
|
|
* @type Function
|
|
|
|
|
*/
|
|
|
|
|
sort?: (a: any, b: any, inputValue: any) => any;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Whether the width of result list equals to input's
|
|
|
|
|
* @type boolean
|
|
|
|
|
*/
|
|
|
|
|
matchInputWidth?: boolean;
|
2019-01-03 20:51:56 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Set the count of filtered items
|
|
|
|
|
* @type number | false
|
|
|
|
|
*/
|
|
|
|
|
limit?: number | false;
|
2019-01-01 12:13:51 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export declare class Cascader extends AntdComponent {
|
|
|
|
|
/**
|
|
|
|
|
* whether allow clear
|
|
|
|
|
* @default true
|
|
|
|
|
* @type boolean
|
|
|
|
|
*/
|
|
|
|
|
allowClear: boolean;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* get focus when component mounted
|
|
|
|
|
* @default false
|
|
|
|
|
* @type boolean
|
|
|
|
|
*/
|
2020-07-17 17:36:58 +08:00
|
|
|
|
autofocus: boolean;
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* change value on each selection if set to true.
|
|
|
|
|
* @default false
|
|
|
|
|
* @type boolean
|
|
|
|
|
*/
|
|
|
|
|
changeOnSelect: boolean;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* initial selected value
|
2019-03-18 10:35:24 +08:00
|
|
|
|
* @type Array<string | number>
|
2019-01-01 12:13:51 +08:00
|
|
|
|
*/
|
2019-03-18 10:35:24 +08:00
|
|
|
|
defaultValue: Array<string | number>;
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Whether disabled select
|
|
|
|
|
* @default false
|
|
|
|
|
* @type boolean
|
|
|
|
|
*/
|
|
|
|
|
disabled: boolean;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* render function of displaying selected options, you can use slot="displayRender" and slot-scope="{labels, selectedOptions}"
|
|
|
|
|
* @default labels => labels.join(' / ')
|
|
|
|
|
* @type Function
|
|
|
|
|
*/
|
2019-01-20 21:13:55 +08:00
|
|
|
|
displayRender: ({
|
|
|
|
|
labels,
|
|
|
|
|
selectedOptions,
|
|
|
|
|
}: {
|
|
|
|
|
labels: string[];
|
|
|
|
|
selectedOptions: CascaderOptionType[];
|
|
|
|
|
}) => VNode;
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* expand current item when click or hover, one of 'click' 'hover'
|
|
|
|
|
* @default 'click'
|
|
|
|
|
* @type string
|
|
|
|
|
*/
|
2019-01-12 11:33:27 +08:00
|
|
|
|
expandTrigger: 'click' | 'hover';
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* custom field name for label and value and children
|
|
|
|
|
* @default { label: 'label', value: 'value', children: 'children' }
|
|
|
|
|
* @type { value: string; label: string; children?: string; }
|
|
|
|
|
*/
|
|
|
|
|
fieldNames: {
|
|
|
|
|
value: string;
|
|
|
|
|
label: string;
|
|
|
|
|
children?: string;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Parent Node which the selector should be rendered to. Default to body.
|
|
|
|
|
* When position issues happen, try to modify it into scrollable content and position it relative.
|
|
|
|
|
* @default () => document.body
|
|
|
|
|
* @type Function
|
|
|
|
|
*/
|
|
|
|
|
getPopupContainer: (triggerNode: any) => HTMLElement;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* To load option lazily, and it cannot work with showSearch
|
|
|
|
|
* @type Function
|
|
|
|
|
*/
|
|
|
|
|
loadData: (selectedOptions: CascaderOptionType[]) => void;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Specify content to show when no result matches.
|
|
|
|
|
* @default 'Not Found'
|
|
|
|
|
* @type string
|
|
|
|
|
*/
|
|
|
|
|
notFoundContent: string;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* data options of cascade
|
|
|
|
|
* @type CascaderOptionType
|
|
|
|
|
*/
|
|
|
|
|
options: CascaderOptionType;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* input placeholder
|
|
|
|
|
* @default 'Please select'
|
|
|
|
|
* @type string
|
|
|
|
|
*/
|
|
|
|
|
placeholder: string;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* additional className of popup overlay
|
|
|
|
|
* @type string
|
|
|
|
|
*/
|
|
|
|
|
popupClassName: string;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* additional style of popup overlay
|
|
|
|
|
* @type object
|
|
|
|
|
*/
|
|
|
|
|
popupStyle: object;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* use preset popup align config from builtinPlacements:bottomLeft bottomRight topLeft topRight
|
|
|
|
|
* @default 'bottomLeft'
|
|
|
|
|
* @type string
|
|
|
|
|
*/
|
2019-01-12 11:33:27 +08:00
|
|
|
|
popupPlacement: 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight';
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* set visible of cascader popup
|
|
|
|
|
* @type boolean
|
|
|
|
|
*/
|
|
|
|
|
popupVisible: boolean;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Whether show search input in single mode.
|
|
|
|
|
* @default false
|
|
|
|
|
* @type boolean | ShowSearchType
|
|
|
|
|
*/
|
|
|
|
|
showSearch: boolean | ShowSearchType;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* input size, one of large default small
|
|
|
|
|
* @default 'default'
|
|
|
|
|
* @type string
|
|
|
|
|
*/
|
2019-01-12 11:33:27 +08:00
|
|
|
|
size: 'large' | 'default' | 'small';
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* The custom suffix icon
|
|
|
|
|
* @type String | VNode | slot
|
|
|
|
|
*/
|
|
|
|
|
suffixIcon: any;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* selected value
|
2019-03-18 10:35:24 +08:00
|
|
|
|
* @type Array<string | number>
|
2019-01-01 12:13:51 +08:00
|
|
|
|
*/
|
2019-03-18 10:35:24 +08:00
|
|
|
|
value: Array<string | number>;
|
2019-01-01 12:13:51 +08:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* remove focus
|
|
|
|
|
*/
|
|
|
|
|
blur(): void;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* get focus
|
|
|
|
|
*/
|
|
|
|
|
focus(): void;
|
|
|
|
|
}
|