@types/layui-src

/** * 存储所有类型 */ declare namespace Layui { /** * 第一个按钮回调即yes回调 * @param [index] 当前层索引参数 * @param [layero] 当前层的jqDOM */ // eslint-disable-next-line @typescript-eslint/no-invalid-void-type type LayerCallbackYes = (index: number, layero: JQuery) => boolean | void; /** * 层关闭的回调,如果不想关闭，return false即可 * @param [index] 当前层索引参数 * @param [layero] 当前层的DOM对象 */ // eslint-disable-next-line @typescript-eslint/no-invalid-void-type type LayerCallbackCancel = (index: number, layero: JQuery) => boolean | void; type LayerCallbackEnd = () => void; type LayerCallbackFull = (layero: JQuery) => void; type LayerCallbackMin = (layero: JQuery, index: number) => void; type LayerCallbackRestore = (layero: JQuery) => void; /** * 输入层 * @param [value] 输入的值 * @param [index] 当前层实例的索引 * @param [layero] 当前层的jqDOM */ type LayerCallbackPrompt = (value: string, index: number, layero: JQuery) => void; type ExportsCallback = (this: Layui, fn: (app: string, exports: object) => void) => void; /** * 全局属性 */ interface GlobalConfigOptions { /** * layui.js 所在目录（如果是 script 单独引入 layui.js，无需设定该参数）一般可无视 */ dir?: string; /** * 一般用于更新模块缓存，默认不开启。设为 true 即让浏览器不缓存。也可以设为一个固定的值，如：201610 */ version?: boolean; /** * 用于开启调试模式，默认 false，如果设为 true，则JS模块的节点会保留在页面 */ debug?: boolean; /** * 设定扩展的 layui 模块的所在目录，一般用于外部模块扩展 */ base?: string; } /** * 地址中的参数和路径信息 */ interface UrlHash { hash: string; href?: string; path: string[]; search: { [index: string]: string }; } interface CarouselOption { /** * 指向容器选择器，如：elem: '#id'。也可以是DOM对象 */ elem?: string | HTMLElement | JQuery; /** * 设定轮播容器宽度，支持像素和百分比默认：'600px' * @default '600px' */ width?: string; /** * 设定轮播容器高度，支持像素和百分比 * @default '280px' */ height?: string; /** * 是否全屏轮播 * @default false */ full?: boolean; /** * 轮播切换动画方式 * @default 'default' * @example * anim: 'default' //（左右切换） * anim: 'updown' //（上下切换） * anim: 'fade' //（渐隐渐显切换） */ anim?: "default" | "updown" | "fade"; /** * 是否自动切换 * @default true */ autoplay?: boolean; /** * 自动切换的时间间隔，单位：ms（毫秒），不能低于800 * @default 3000 */ interval?: number; /** * 初始开始的条目索引 * @default 0 */ index?: number; /** * 切换箭头默认显示状态 * @default 'hover' * @example * arrow: hover // （悬停显示） * arrow: always // （始终显示） * arrow: none //（始终不显示） */ arrow?: "hover" | "always" | "none"; /** * 指示器位置 * @default 'inside' * @example * indicator: inside // （容器内部） * indicator: outside // （容器外部） * indicator: none //（不显示） */ indicator?: "insider" | "outsider" | "none"; /** * 指示器的触发事件 * @default 'click' */ trigger?: string; } interface CarouselItem { /** * 当前条目的索引 */ index: number; /** * 上一个条目的索引 */ prevIndex: number; /** * 当前条目的元素对象 */ item: JQuery; } interface CarouselClass { /** * 配置属性 */ config: CarouselOption; /** * 初始焦点 */ elemItem: JQuery; /** * 轮播渲染 */ render(): void; /** * 重置轮播 */ reload(options: { [index: string]: string }): void; /** * 获取上一个等待条目的索引 */ prevIndex(): number; /** * 获取下一个等待条目的索引 */ nextIndex(): number; /** * 手动递增索引值 */ addIndex(num: number): void; /** * 手动递减索引值 */ subIndex(num: number): void; /** * 自动轮播 */ autoplay(): void; /** * 箭头 */ arrow(): void; /** * 指示器 */ indicator(): void; /** * 滑动切换 type ：sub减，其他增 */ slide(type: string, num: number): void; /** * 事件处理 */ events(): void; } // https://www.layui.com/doc/modules/carousel.html // carousel 是 layui 2.0 版本中新增的全新模块，主要适用于跑马灯/轮播等交互场景。 // 它并非单纯地为焦点图而生，准确地说，它可以满足任何类型内容的轮播式切换操作， // 更可以胜任 FullPage （全屏上下轮播）的需求，简洁而不失强劲，灵活而优雅。 /** * 轮播组件 */ interface Carousel { config: { [index: string]: any }; /** * 核心入口 */ render(options: CarouselOption): object; /** * 绑定切换事件 * @param [event] 事件 * @param [callback] 回调 */ on(event: string, callback: (this: CarouselClass, obj: CarouselItem) => any): any; /** * 重置轮播 * @param [options] 基础参数 */ reload(options?: CarouselOption): void; /** * 设置轮播组件的全局参数 * @param [options] 基础参数 */ set(options?: CarouselOption): Carousel; } /** * code高亮参数 */ interface CodeOption { /** * 指定元素的选择器默认值为.layui-code */ elem?: string; /** * 设定标题默认值为code */ title?: string; /** * 设置最大高度,请注意必须加px,默认无：则会自适应高度，且不会出现滚动条 */ height?: string; /** * 是否转义html标签，默认false */ encode?: boolean; /** * 风格选择（目前内置了两种:默认和notepad） */ skin?: string; /** * 是否剔除右上关于 */ about?: boolean; } interface ColorPickerOption { /** * 指向容器选择器 */ elem?: string | HTMLElement | JQuery; /** * 默认颜色，不管你是使用 hex、rgb 还是 rgba 的格式输入，最终会以指定的格式显示。 */ color?: string; /** * 颜色显示/输入格式，可选值： hex、rgb   * 若在 rgb 格式下开启了透明度，格式会自动变成 rgba。在没有输入颜色的前提下，组件会默认为 #000 也就是黑色。 */ format?: "hex" | "rgb" | "rgba"; /** * 是否开启透明度，若不开启，则不会显示透明框。   * 开启了透明度选项时，当你的默认颜色为 hex 或 rgb 格式，组件会默认加上值为 1 的透明度。   * 相同的，当你没有开启透明度，却以 rgba 格式设置默认颜色时，组件会默认没有透明度。   * 注意：该参数必须配合 rgba 颜色值使用 */ alpha?: boolean; /** * 预定义颜色是否开启 */ predefine?: boolean; /** * 预定义颜色，此参数需配合 predefine: true 使用。 */ colors?: string[]; /** * 下拉框大小，可以选择：lg、sm、xs。 */ size?: "lg" | "sm" | "xs"; /** * 颜色被改变的回调 */ change?(this: ColorPickerOption, color: string): void; /** * 颜色选择后的回调 */ done?(this: ColorPickerOption, color: string): void; } // https://www.layui.com/doc/modules/colorpicker.html /** * 颜色选择器 */ interface ColorPicker { config: { [index: string]: any }; index: number; render(option: ColorPickerOption): ColorPicker; set(option: ColorPickerOption): ColorPicker; /** * 绑定切换事件 * @param [event] 事件名 * @param [callback] 回调函数 */ on(event: string, callback: (this: Layui, params: any) => any): any; } interface DropDownOptionData { /** * 菜单标题 */ title?: string; /** * 菜单 ID。用户菜单项唯一索引 */ id?: string | number; /** * 菜单项的超链接地址。若填写，点击菜单将直接发生跳转。 */ href?: string; /** * 菜单项超链接的打开方式，需 href 填写才生效。   * 一般可设为 _blank 或 _self 等默认：_self */ target?: string; /** * 菜单项的类型,normal（默认） ,group（垂直菜单组）   * parent（横向父子菜单） ,-（分割线）默认：normal 或不填 */ type?: string; /** * 子级菜单数据项。参数同父级，可无限嵌套。默认：[] */ child?: any[]; /** * 自定义当前菜单项模板，优先级高于全局设定的 templet。详见下文。 */ templet?: string; [index: string]: any; } interface DropDownOption { /** * 绑定触发组件的元素。必填项 */ elem: string | HTMLElement | JQuery; /** * 菜单列数据项，其参数详见下文。必填项也可用content支持模板 */ data?: DropDownOptionData[]; /** * 给当前实例设置个唯一标识 */ id?: string; /** * 触发组件的事件类型。支持所有事件，如：click/hover/mousedown/contextmenu 等默认：click */ trigger?: string; /** * 是否初始即显示组件面板默认：false */ show?: boolean; /** * 下拉面板相对绑定元素的水平对齐方式（支持: left/center/right） v2.6.8 新增默认：left */ align?: "left" | "center" | "right"; /** * 是否允许菜单组展开收缩默认：true */ isAllowSpread?: boolean; /** * 是否初始展开子菜单默认：true */ isSpreadItem?: boolean; /** * 延迟关闭的毫秒数。当 trigger 为 hover 时才生效默认：300 */ delay?: number; /** * 自定义组件的样式类名 */ className?: string; /** * 设置组件的 style 属性，从而定义新的样式 */ style?: string; /** * 全局定义菜单的列表模板，添加任意 html 字符，模版将被 laytpl 组件所转义，   * 因此可通过 {{ d.title }} 的方式得到当前菜单配置的数据。   * 详见 https:// www.layui.com/doc/modules/dropdown.html#templet */ templet?: string; /** * 自定义组件内容，从而替代默认的菜单结构 */ content?: string; /** * 组件成功弹出后的回调，并返回两个参数 * @param [elemPanel] 弹出的面板 * @param [elem] 点击的面板 */ ready?(elemPanel: JQuery, elem: JQuery): void; /** * 菜单项被点击时的回调，并返回两个参数 */ click?(data: any, othis: JQuery): void; } /** * reload时是用，全部可选 */ type DropDownOptionForReload = Partial<DropDownOption>; /** * 全部必有项用于查看 */ type DropDownOptionForRead = Required<DropDownOption>; interface DropDownModule { config: DropDownOptionForRead; reload(options?: DropDownOptionForReload | object): void; } interface DropDown { config: { [index: string]: any }; index: number; set(options: DropDownOption): DropDown; /** * 给dropdown绑定事件，当前只有click 即event类似:click(id|filter) * @param [event] 事件名如： click(id|filter) 括号内是.layui-menu的id=""或者lay-filter="" * @param [callback] 回调中的参数是 <li lay-options="{id: 101}">中lay-options的值字符串用'' */ on(event: string, callback: (this: HTMLElement, obj: any) => any): any; /** * 重载实例 * @param [id] id参数为render>options中的id，如果render时未指定id则从1开始。 * @param [options] 全部基础参数 */ reload(id: string, options: DropDownOptionForReload): DropDownModule; /** * 核心入口 */ render(options: DropDownOption): DropDownModule; } interface TabOption { /** * 选项卡的标题不写则是unnaming */ title?: string; /** * '选项卡的内容' ,支持传入html */ content?: string; /** * 选项卡标题的lay-id属性值 */ id?: string; } interface TabElement { /** * 指定tab头元素项 */ headerElem: string | HTMLElement | JQuery; /** * 指定tab主体元素项 */ bodyElem: string | HTMLElement | JQuery; } // https://www.layui.com/doc/modules/element.html /** * 元素操作 */ interface Element { config: { [index: string]: any }; // set(options?: ): object; 很少用 /** * 用于元素的一些事件触发 * @param [filter] 比如：tab(filter)，tabDelete(filter)，nav(filter)，collapse(filter) * @param [callback] 不同filter对应的data类型不同 */ on(filter: string, callback: (this: any, data: any) => any): any; /** * 用于新增一个Tab选项 * @param [filter] tab元素的 lay-filter="value" 过滤器的值（value） * @param [options] 设定可选值的对象， */ tabAdd(filter: string, options: TabOption): void; /** * 用于删除指定的Tab选项 * @param [filter] tab元素的 lay-filter="value" 过滤器的值（value） * @param [layid] 选项卡标题列表的属性 lay-id 的值 */ tabDelete(filter: string, layid: string): void; /** * 用于外部切换到指定的Tab项上 * @param [filter] 比如：element.tabChange('demo', 'layid');中的'demo' * @param [layid] 比如：lay-id="yyy"中的'yyy' */ tabChange(filter: string, layid: string): void; /** * 用于绑定自定义 Tab 元素（即非 layui 自带的 tab 结构） * @param [option] 参数 */ tab(option: TabElement): void; /** * 用于动态改变进度条百分比：例如：element.progress('demo', '30%'); * @param [filter] lay-filter * @param [percent] 比例 */ progress(filter: string, percent: string): void; /** * 更新渲染同render， 2.1.6 开始，可以用 element.render(type, filter); 方法替代 * @param [type] 可选有：'tab' | 'nav' | 'breadcrumb' | 'progress' | 'collapse' * @param [filter] lay-filter */ init(type?: "tab" | "nav" | "breadcrumb" | "progress" | "collapse", filter?: string): void; /** * 更新渲染，当type不能识别时，layui会遍历渲染"tab""nav"|"breadcrumb"|"progress"|"collapse" 全部；   * @param [type] 表单的type类型，如下：   * 1、tab 重新对tab选项卡进行初始化渲染,   * 2、nav 重新对导航进行渲染   * 3、breadcrumb 重新对面包屑进行渲染   * 4、progress 重新对进度条进行渲染   * 5、collapse 重新对折叠面板进行渲染   * @param [filter] 为元素的 lay-filter="" 的值，用于局部更新 */ render(type?: "tab" | "nav" | "breadcrumb" | "progress" | "collapse", filter?: string): void; } interface FlowOption { /** * 指定列表容器的选择器 */ elem?: string | HTMLElement; /** * 滚动条所在元素选择器，默认document。如果你不是通过窗口滚动来触发流加载，   * 而是页面中的某一个容器的滚动条，那么通过该参数指定即可。 */ scrollElem?: string | HTMLElement; /** * 是否自动加载。默认true。如果设为false，点会在列表底部生成一个“加载更多”的button，则只能点击它才会加载下一页数据。 */ isAuto?: boolean; /** * 用于显示末页内容，可传入任意HTML字符。默认为：没有更多了 */ end?: string; /** * 是否开启图片懒加载。默认false。   * 如果设为true，则只会对在可视区域的图片进行按需加载。但与此同时，在拼接列表字符的时候，   * 你不能给列表中的img元素赋值src，必须要用lay-src取代 */ isLazyimg?: boolean; /** * 与底部的临界距离，默认50。即当滚动条与底部产生该距离时，触发加载。注意：只有在isAuto为true时有效。 */ mb?: number; /** * 到达临界点触发加载的回调。信息流最重要的一个存在。携带两个参数：page, next */ done?: (page: number, next: (html: string, hasMore: boolean) => void) => void; } // https://www.layui.com/doc/modules/flow.html /** * 流加载 */ interface Flow { /** * 流加载 * @param option 信息流参数 */ load(option: FlowOption): void; /** * 图片懒加载 * @param [option] 参数 */ lazyimg(option?: { /** * 指定开启懒加载的img元素选择器，如 elem: '.demo img' 或 elem: 'img.load' 默认:img */ elem?: string; /** * 滚动条所在元素选择器，默认document */ scrollElem?: string; }): void; } interface LayFormData { /** * 被执行事件的元素DOM对象，一般为button对象 ,可能是input select button等不能用HTMLElement */ elem: any; /** * 得到美化后的DOM对象=$(selector) */ othis: JQuery; /** * DOM对象值 */ value: string; /** * 被执行提交的form对象，一般在存在form标签时才会返回 */ form: HTMLFormElement; /** * 当前容器的全部表单字段，名值对形式：{name: value} */ field: any; } interface LayFormVerifyConfig { [index: string]: ((value: string, item: HTMLElement) => any) | [RegExp, string]; } // https://www.layui.com/doc/element/form.html // https://www.layui.com/doc/modules/form.html /** * 表单 - 页面元素 */ interface Form { config: { autocomplete: any; /** * form内置的验证 */ verify: { /** * 日期验证 date[0]是正则,date[1]是验证失败的提示（"日期格式不正确"） */ date: [RegExp, string]; /** * 邮箱验证 email[0]是正则,email[1]是验证失败的提示（"邮箱格式不正确"） */ email: [RegExp, string]; /** * 身份证号验证 identity[0]是正则,identity[1]是验证失败的提示（请输入正确的身份证号"） */ identity: [RegExp, string]; /** * 验证数字，如果参数不是数字则返回"只能填写数字"，是数字则无返回值   * bug：当0,"0"会提示不是数字 * @param [arg] 参数比如 1,"1",-1 */ number: (arg: any) => string | null; /** * 手机号验证 phone[0]是正则,phone[1]是验证失败的提示（"请输入正确的手机号"） */ phone: [RegExp, string]; /** * 空值验证 required[0]是正则,required[1]是为空的提示（"必填项不能为空"） */ required: [RegExp, string]; /** * url验证 url[0]是正则,url[1]是验证失败的提示（"链接格式不正确"） */ url: [RegExp, string]; [index: string]: [RegExp, string] | ((...arg: any) => any); }; }; /** * 取值，取出所有子元素是input,select,textarea且有name的表单值 * @param [filter] class=""lay-filter=""中的值 * @param [itemForm] 表单field子元素的父容器，没有则是第一个.layui-form作为父元素。实例：$(".layui-form")， */ getValue(filter: string, itemForm?: JQuery): { [index: string]: string }; /** * 表单field元素回调事件（每个表单都有一个默认事件） * @param [event] 类似： select(x)|checkbox(x)|switch(x)|radio(x)|submit(x) x为field上的lay-filter="x" * @param [callback] 回调函数 */ on(event: string, callback: (data: LayFormData) => any): any; /** * 更新渲染,对动态插入的元素渲染 * @param [type] 可选：'select' | 'checkbox' | 'radio' | null * @param [filter] lay-filter */ render(type?: "select" | "checkbox" | "radio" | null, filter?: string): Form; /** * 表单赋值 / 取值 * @param [filter] .layui-form 上的lay-filter=""值 * @param [obj] 要设置的值 */ val(filter: string, obj?: object): any; /** * 维护表单验证 * @param [config] 验证参数 */ verify(config: LayFormVerifyConfig): Form; } interface LAY extends Omit<any[], "find"> { /** * 当前的选择器 */ selector: string | undefined; /** * 添加css类 * @param [className] 类名,必须项比如 a 或 a b * @param [remove] 是否是移除className 默认false即添加 */ addClass(className: string, remove?: boolean): HTMLElement[]; /** * 追加内容 * @param [elem] html或者元素对象 */ append(elem?: string | HTMLElement): HTMLElement[]; /** * 设置元素属性 * @param [key] 是attribute的key * @param [value] 是attribute的value */ attr(key: string, value: any): HTMLElement[]; /** * 获取第一个元素属性 */ attr(): string; /** * 添加 css style * @param [key] 属性css * @param [value] 值 */ css(key: string, value: any): HTMLElement[]; /** * 获取 css style * @param [key] 属性css */ css(key: string): string; /** * 对元素遍历 * @param [fn] (index,elem) */ each(fn?: (this: HTMLElement, index: number, elem: HTMLElement) => any): HTMLElement[]; /** * 查找子元素 * @param [selector] 选择器 */ find(selector: string | HTMLElement): LAY; /** * 是否包含 css 类 * @param [className] 类名 */ hasClass(className: string): boolean; /** * 设置高度 * @param [value] 元素宽度 */ height(value: number | string): HTMLElement[]; /** * 获取第一个元素高度 */ height(): number; /** * 设置元素的innerHTML * @param [html] html */ html(html: string): HTMLElement[]; /** * 获取第一个元素的innerHTML */ html(): string; /** * 解除事件 * @param [eventName] 事件名比如click * @param [fn] 回调 */ off(eventName: string, fn: (...args: any) => any): HTMLElement[]; /** * 事件绑定，注意：只支持内置事件，不支持自定义事件 * @param [eventName] 事件名比如click，自定事件会绑定失败 * @param [fn] 回调 (tip:this:any) */ on(eventName: keyof HTMLElementEventMap, fn: (...args: any) => any): HTMLElement[]; /** * 移除元素 * @param [elem] 实际是removeChild(elem) */ remove(elem: HTMLElement): HTMLElement[]; /** * 移除指定的attribute * @param [key] 是attribute的key */ removeAttr(key: string): HTMLElement[]; /** * 移除 className * @param [className] */ removeClass(className: string): HTMLElement[]; /** * 设置元素的value * @param [value] 值 */ val(value: any): HTMLElement[]; /** * 获取第一个元素的value */ val(): string; /** * 设置宽度 * @param [value] 元素宽度 */ width(value: number | string): HTMLElement[]; /** * 获取第一个元素宽度 */ width(): number; } interface Lay { /** * 查找 DOM 作为返回实例的操作对象 * @param [selector] 选择器原始dom或者选择器串 */ (selector?: string | HTMLElement): LAY; v: string; /** * 把多个对象深层复制到dest,返回也为dest * @param [dest] * @param [src] */ extend(dest: any, ...src: any): any; /** * 如果是ie则是版本，非ie则false */ ie: boolean | string; layui: Layui; /** * 获取当前 JS 所在目录 */ getPath: string; /** * 阻止事件冒泡 */ stope(event?: Event): void; /** * 对象（Array、Object、DOM 对象等）遍历，可用于取代 for 语句同layui.each * @param [obj] * @param [fn] */ each(obj: object, fn?: (k: string, v: any) => void): Lay; /** * 数字前置补零 * @param [num] 数字 * @param [length] 补0后的长度 */ digit(num?: any, length?: number): string; /** * 根据tagName生成HTMLElement子元素 * @param [elemName] ts中小写可智能提示 * @param [attr] 属性名 */ elem<K extends keyof HTMLElementTagNameMap>(elemName: K, attr?: object): HTMLElementTagNameMap[K]; /** * 根据tagName生成HTMLElement子元素 * @param elemName 非小写内置tagName * @param [attr] 属性名 */ elem(elemName: string, attr?: object): HTMLElement; /** * 当前页面body是否存在滚动条 */ hasScrollbar(): boolean; /** * unknown * @param [elem] HTMLElement * @param [elemView] * @param [obj] */ position(elem: HTMLElement, elemView: any, obj?: any): any; /** * 获取元素上的参数，同jquery.attr() * @param [elem] html元素 * @param [attr] 若空则为lay-options */ options(elem: string | HTMLElement | JQuery, attr?: string): any; /** * 元素是否属于顶级元素（顶级：document 或 body） * @param [elem] 只有document或body才返回true */ isTopElem(elem: any): boolean; } interface DateParam { year?: number; month?: number; date?: number; hours?: number; minutes?: number; seconds?: number; } interface DateOption { /** * 绑定的元素，选择的值会填充该元素 */ elem?: string | HTMLElement | JQuery; /** * 控件选择类型 */ type?: "year" | "month" | "date" | "time" | "datetime"; /** * 开启左右面板范围选择 */ range?: string | boolean | any[]; /** * 自定义格式默认值：yyyy-MM-dd 实例： 'yyyy年MM月dd日'   * yyyy 年份，至少四位数。如果不足四位，则前面补零   * y 年份，不限制位数，即不管年份多少位，前面均不补零   * MM 月份，至少两位数。如果不足两位，则前面补零。   * M 月份，允许一位数。   * dd 日期，至少两位数。如果不足两位，则前面补零。   * d 日期，允许一位数。   * HH 小时，至少两位数。如果不足两位，则前面补零。   * H 小时，允许一位数。   * mm 分钟，至少两位数。如果不足两位，则前面补零。   * m 分钟，允许一位数。   * ss 秒数，至少两位数。如果不足两位，则前面补零。   * s 秒数，允许一位数。   */ format?: string; /** * 初始值 ""|new Date()|20180115 */ value?: string | Date | number; /** * 初始值填充默认值：true   */ /** * 用于控制是否自动向元素填充初始值（需配合 value 参数使用） */ isInitValue?: boolean; /** * 是否开启选择值预览   * 用于控制是否显示当前结果的预览（type 为 datetime 时不开启） */ isPreview?: boolean; /** * 最小范围内的日期时间值   * 1.如果值为字符类型，则：年月日必须用 -（中划线）分割、时分秒必须用 :（半角冒号）号分割。这里并非遵循 format 设定的格式   * 2.如果值为整数类型，且数字＜86400000，则数字代表天数，如：min: -7，即代表最小日期在7天前，正数代表若干天后   * 3.如果值为整数类型，且数字 ≥ 86400000，则数字代表时间戳，如：max: 4073558400000，即代表最大日期在：公元3000年1月1日 */ min?: string | number; /** * 最大范围内的日期时间值   * 1.如果值为字符类型，则：年月日必须用 -（中划线）分割、时分秒必须用 :（半角冒号）号分割。这里并非遵循 format 设定的格式   * 2.如果值为整数类型，且数字＜86400000，则数字代表天数，如：min: -7，即代表最小日期在7天前，正数代表若干天后   * 3.如果值为整数类型，且数字 ≥ 86400000，则数字代表时间戳，如：max: 4073558400000，即代表最大日期在：公元3000年1月1日 */ max?: string | number; /** * 自定义弹出控件的事件默认值：focus，如果绑定的元素非输入框，则默认事件为：click */ trigger?: string; /** * 默认显示默认值：false */ show?: boolean; /** * 阻止关闭事件冒泡 */ closeStop?: string; /** * 定位方式 */ position?: "abolute" | "fixed" | "static"; /** * 层叠顺序 ,如果 position 参数设为 static 时，该参数无效。 */ zIndex?: number; /** * 是否显示底部栏 */ showBottom?: boolean; /** * 工具按钮默认值：['clear', 'now', 'confirm'] */ btns?: Array<"clear" | "now" | "confirm">; /** * 语言内置了两种语言版本：cn（中文版）、en（国际版，即英文版），默认值：cn */ lang?: "cn" | "en"; /** * 主题，默认值：default */ theme?: string | "default" | "molv" | "grid"; /** * 是否显示公历节日默认值：false */ calendar?: boolean; /** * 标注重要日子实例:{'0-0-31':'月末'} 比如2月bug */ mark?: { [key: string]: string }; eventElem?: string | HTMLElement | JQuery; /** * 控件初始打开的回调 * @param [date] 基础参数 */ ready?(dateParam: DateParam): void; /** * 日期时间被切换后的回调 this to test and elem * @param [value] 得到日期生成的值，如：2017-08-18 范围："2021-07-06 - 2021-08-09" * @param [date] 得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0} * @param [endDate] 开启范围选择（range: true）才会返回。对象成员同上date */ change?(this: Required<DateOption>, value: string, date: DateParam, endDate: DateParam): void; /** * 控件选择完毕后的回调 * @param [value] 得到日期生成的值，如：2017-08-18 范围："2021-07-06 - 2021-08-09" * @param [date] 得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0} * @param [endDate] 开启范围选择（range: true）才会返回。对象成员同上date */ done?(value: string, date: DateParam, endDate: DateParam): void; } /** * 日期和时间组件 */ interface Laydate { /** * 核心方法 * @param [options] 基础参数 */ render(options: DateOption): { config: DateOption; hint: (content: string) => void }; /** * 设置全局参数 * @param [options] */ set(options?: DateOption): Laydate; /** * 配置基础路径   * 如果你不是采用 layui 或者普通 script 标签方式加载的 laydate.js，   * 而是采用 requirejs 等其它方式引用 laydate，   * 那么你需要设置基础路径，以便 laydate.css 完成加载。 */ path: string; /** * 获取指定年月的最后一天 * @param [month] month默认为当前月 * @param [year] year默认为当前年 */ getEndDate(month?: number, year?: number): number; } /** * 编辑器基本设置 */ interface EditOption { /** * 重新定制编辑器工具栏，如： tool: ['link', 'unlink', 'face'] 当前可选有：   * 'strong' //加粗   * ,'italic' //斜体   * ,'underline' //下划线   * ,'del' //删除线   * * ,'|' //分割线   * * ,'left' //左对齐   * ,'center' //居中对齐   * ,'right' //右对齐   * ,'link' //超链接   * ,'unlink' //清除链接   * ,'face' //表情   * ,'image' //插入图片   * ,'help' //帮助   */ tool?: string[]; /** * 不显示编辑器工具栏，一般用于隐藏默认配置的工具bar */ hideTool?: string[]; /** * 设定编辑器的初始高度 */ height?: number | string; /** * 设定图片上传接口，如：uploadImage: {url: '/upload/', type: 'post'},需要服务端返回：   * {   * "code": 0 // 0表示成功，其它失败   * ,"msg": "" // 提示信息一般上传失败后返回   * ,"data": {   * "src": "图片路径"   * ,"title": "图片名称" //可选   * }   * }   */ uploadImage?: { url: string; type: string }; } // https://www.layui.com/doc/modules/layedit.html /** * 富文本编辑器 */ interface Layedit { /** * 用于建立编辑器的核心方法 * @param [id] 实例元素（一般为textarea）的id值 * @param [options] 编辑器的可配置项 */ build(id: string, options?: EditOption): any; /** * 设置编辑器的全局属性 * @param [options] */ set(options: EditOption): Layedit; /** * 获得编辑器的内容 * @param [index] 即执行layedit.build返回的值 */ getContent(index: number): string; /** * 获得编辑器的纯文本内容 * @param [index] 即执行layedit.build返回的值 */ getText(index: number): string; /** * 用于同步编辑器内容到textarea（一般用于异步提交） * @param [index] 即执行layedit.build返回的值 */ sync(index: number): void; /** * 获取编辑器选中的文本 * @param [index] 即执行layedit.build返回的值 */ getSelection(index: number): string; } // https://www.layui.com/doc/modules/layer.html#base /** * 弹层组件 */ interface LayerOptions { /** * 基本层类型，layer提供了5种层类型。可传入的值有：   * 0（默认信息框）,1（页面层）,   * 2（iframe层）,3（加载层）,4（tips层）。   * 若你采用layer.open({type: 1})方式调用，则type为必填项（信息框除外） */ type?: 0 | 1 | 2 | 3 | 4; /** * 标题，不想显示标题栏可以title: false * @example * title :'我是标题' * title: ['文本', 'font-size:18px;'] // 给文本指定style样式 */ title?: string | boolean | string[]; /** * 内容 * @default '' */ content?: string | HTMLElement | JQuery | string[]; /** * 样式类名，允许你传入layer内置的样式class名，还可以传入您自定义的class名 * @default '' * @example * skin: 'demo-class' */ skin?: string; /** * 宽高 * @default 'auto' * @example * area: '500px' // 高会自适应 * area: ['500px', '300px'] // 指定宽高 */ area?: string | string[]; // https://www.layui.com/doc/modules/layer.html#offset /** * 坐标 * @default 'auto' // 即垂直水平居中 * @example * offset: '100px' // 只定义top坐标，水平保持居中 * offset: ['100px', '50px'] // 同时定义top、left坐标 * offset: 't' // 快捷设置顶部坐标 * offset: 'r' // 快捷设置右边缘坐标 * offset: 'b' // 快捷设置底部坐标 * offset: 'l' // 快捷设置左边缘坐标 * offset: 'lt' // 快捷设置左上角 * offset: 'lb' // 快捷设置左下角 * offset: 'rt' // 快捷设置右上角 * offset: 'rb' // 快捷设置右下角 */ offset?: number | string | string[]; /** * 图标   * 当type为0(即信息框)可以传入0-6启用图标   * 当type为3(即加载层)可以传入0-2启用图标 * @default -1 // 不显示图标 * @example * type:0,icon: 0 //0(!),1(√)，2(x),3(?),4(锁),5(cry)，6(smile), 其他数字同0 * type:3,icon:0 //0(3个点)，1（慢圈），2(慢快圈) ，其他数字同0 */ icon?: number; // https://www.layui.com/doc/modules/layer.html#btn /** * 按钮   * 信息框模式时(type:0)，btn默认是一个确认按钮，其它层类型则默认不显示，加载层和tips层则无效   * 可以定义更多按钮，比如：btn: ['按钮1', '按钮2', '按钮3', …]，按钮1的回调是yes，   * 而从按钮2开始，则回调为btn2: function(){}，以此类推。 * @default '确认' * @example * type:0,btn: '我知道了' * type:0,btn: ['yes','btn2'] // 第一个对应yes回调，后边对应btn2,btn3回调 */ btn?: string | string[]; /** * 按钮排列默认：r   * @default 'r' * @example * btnAlign: 'l' // 按钮左对齐 * btnAlign: 'c' // 按钮居中对齐 * btnAlign: 'r' // 按钮右对齐。默认值，不用设置 */ btnAlign?: string; /** * 右上角的关闭按钮默认：1   * layer提供了两种风格的关闭按钮，可通过配置1和2来展示，如果不显示，则closeBtn: 0 * @default 1 * @example * closeBtn: 0 // 隐藏右上角的关闭按钮 * closeBtn: 1 // x * closeBtn: 2 // O+x */ closeBtn?: string | boolean | number; /** * 遮罩 * @default 0.3 // 0.3透明度的黑色背景（'#000'） * @example * shade: 0 // 不显示遮罩 * shade: [0.8, '#393D49'] // 指定透明度和遮罩颜色 */ shade?: string | boolean | number | [number, string]; /** * 是否点击遮罩关闭 * @default false */ shadeClose?: boolean; /** * 自动关闭所需毫秒 * @default 0 * @example * time: 5000 // 即代表5秒后自动关闭 */ time?: number; /** * 用于控制弹层唯一标识   * 设置该值后，不管是什么类型的层，都只允许同时弹出一个。一般用于页面层和iframe层模式 * @default '' */ id?: string; // https://www.layui.com/doc/modules/layer.html#anim /** * 弹出动画   * 目前anim可支持的动画类型有0-6 如果不想显示动画，设置 anim: -1 即可 * @default 0 * @example * anim: -1 // 不显示动画 * anim: 0 // 平滑放大。默认 * anim: 1 // 从上掉落 * anim: 2 // 从最底部往上滑入 * anim: 3 // 从左滑入 * anim: 4 // 从左翻滚 * anim: 5 // 渐显 * anim: 6 // 抖动 */ anim?: number; /** * 关闭动画 * @default true */ isOutAnim?: boolean; /** * 最大最小化   * 该参数值对type:1和type:2有效,需要显示配置maxmin: true即可 * @default false // 默认不显示最大小化按钮 * @example * type:1,maxmin:true * type:2,maxmin:true */ maxmin?: boolean; /** * 固定，即鼠标滚动时，层是否固定在可视区域 * @default true // 默认固定在可视区域显示 * @example * fixed: false // 不固定 */ fixed?: boolean; /** * 是否允许拉伸 ,该参数对loading(type:3)、tips(type:4)层无效 * @default true // 允许拉伸,在弹层右下角拖动来拉伸尺寸 */ resize?: boolean; /** * 监听窗口拉伸动作 * @default null */ resizing?(layero: JQuery): any; /** * 是否允许浏览器出现滚动条 * @default true */ scrollbar?: boolean; /** * 最大宽度 ,只有当area: 'auto'时，maxWidth的设定才有效。 * @default 360 * @example * area: 'auto',maxWidth: 800 */ maxWidth?: number; /** * 层叠顺序 * @default 19891014 */ zIndex?: number; /** * 触发拖动的元素 * @default '.layui-layer-title' */ move?: string | boolean | HTMLElement; /** * 固定1，不能修改 */ readonly moveType?: boolean; /** * 是否允许拖拽到窗口外 * @default false */ moveOut?: boolean; /** * 拖动完毕后的回调方法 * @default null */ moveEnd?: null | ((layero: JQuery) => any); /** * tips方向和颜色 * @default 2 // 箭头在右边，黑色 * @example * tips: 1 //箭头在上 * tips: 2 //箭头在右 * tips: 3 //箭头在下 * tips: 4 //箭头在左 * layui.layer.tips('提示内容','#abc',{tips:1}) * layui.layer.tips('提示内容','#abc',{tips:[1, 'red']}) // 指定颜色 * layui.layer.tips('提示内容','#abc',{tips:[1, '#f00']}) * layui.layer.tips('提示内容','#abc',{tips:[1, 'rgb(255,0,0)']}) */ tips?: number | [number, string]; /** * 是否允许多个tips ，true则允许多个意味着不会销毁之前的tips层 * @default false // 同一时刻只有一个提示框 */ tipsMore?: boolean; /** * 层弹出后的成功回调方法 */ success?(layero: JQuery, index: number): void; /** * 确定按钮回调方法 */ yes?: LayerCallbackYes; /** * 可以定义更多按钮，比如：btn: ['按钮1', '按钮2', '按钮3', …]，按钮1的回调是yes，   * 而从按钮2开始，则回调为btn2: function(){}，以此类推。 */ btn2?: LayerCallbackYes; btn3?: LayerCallbackYes; btn4?: LayerCallbackYes; btn5?: LayerCallbackYes; btn6?: LayerCallbackYes; btn7?: LayerCallbackYes; btn8?: LayerCallbackYes; btn9?: LayerCallbackYes; /** * 右上角关闭按钮触发的回调 */ cancel?: LayerCallbackCancel; /** * 层销毁后触发的回调 */ end?: LayerCallbackEnd; /** * 最大化后触发的回调 */ full?: LayerCallbackFull; /** * 最小化后触发的回调 */ min?: LayerCallbackMin; /** * 还原后触发的回调 */ restore?: LayerCallbackRestore; /** * 最小化后是否默认堆叠在左下角默认：true */ minStack?: boolean; } /** * 配置layer层的基础参数 * @example ```javascript * layui.layer.config({ * anim: 1, // 默认动画风格 * skin: 'layui-layer-molv', // 默认皮肤 * extend: 'myskin/style.css', // 样式位置 * //... * }); */ interface LayerConfigOptions extends LayerOptions { /** * layer.js所在的目录，可以是绝对目录，也可以是相对目录 * @example * path: '/res/layer/' */ path?: string; /** * 要加载的拓展css皮肤   * 如果是独立版的layer，则将 myskin 存放在 ./skin 目录下   * 如果是layui中使用layer，则将 myskin 存放在 ./css/modules/layer 目录下 * @example * extend: 'myskin/style.css' */ extend?: string[] | string; } /** * 输入框的参数对象 * @example ```javascript * layui.layer.prompt({ * formType: 2, // 输入框类型，支持0（文本）默认1（密码）2（多行文本） * value: '初始值', // 初始时的值，默认空字符 * maxlength: 140, // 可输入文本的最大长度，默认500 * title: '请输入值', * area: ['800px', '350px'], // 自定义文本域宽高 * },(value, index, elem) => { * layui.layer.alert(value); // 得到value * layui.layer.close(index); * }, * ); * ``` */ interface LayerPromptOptions extends LayerOptions { /** * 输入框类型，支持0（文本）默认1（密码）2（多行文本） * @example * formType: 0 // 文本 * formType: 1 // 密码 * formType: 2 // 多行文本 */ formType?: number; /** * 初始时的值 * @default '' */ value?: string; /** * 可输入文本的最大长度 * @default 500 */ maxlength?: number; /** * 自定义文本域宽高 * @example * ['800px', '350px'] */ area?: string[]; } interface LayerTabOptions extends LayerOptions { tab: Array<{ title: string; content: string }>; } interface LayerPhotosOptions extends LayerOptions { /** * json或者选择器用于构造img */ photos?: LayerPhotosData | string | JQuery; /** * 切换图片时触发 * @param [pic] 当前图片的一些信息 * @param [layero] 当前元素 */ tab?(pic: LayerPhotosDataItem, layero: JQuery): void; } interface LayerPhotosData { /** * 相册标题 */ title?: string; /** * 相册id * @example * id: 123 */ id?: number; /** * 初始显示的图片序号 * @default 0 */ start?: number; /** * 相册包含的图片，数组格式 * @example ```javascript * "data": [{ * "alt": "图片名", * "pid": 666, //图片id * "src": "", //原图地址 * "thumb": "" //缩略图地址 * }] * ``` */ data?: LayerPhotosDataItem[]; } interface LayerPhotosDataItem { /** * 图片名 */ alt?: string; /** * 图片id */ pid?: number; /** * 原图地址 */ src?: string; /** * 缩略图地址 */ thumb?: string; } /** * 弹层组件 */ interface Layer { ie: boolean; index: number; path: string; v: string; zIndex: number; // https://www.layui.com/doc/modules/layer.html#layer.config /** * 初始化全局配置 * @param [options] 基础参数 * @param [fn] 无用 */ config(options: LayerConfigOptions, fn?: any): void; /** * 执行初始化，就绪后执行回调参数   * ready(path: string, callback: () => void): void; //兼容旧版？   * 初始化就绪 (CSS完成的回调),当你在页面一打开就要执行弹层时可放入回调中 * @param [callback] 就绪后回调 */ ready(callback: () => void): void; /** * 原始核心方法 * @param [options] 基础参数 */ open(options?: LayerOptions): number; /** * 普通信息框 * @param [content] 内容 * @param [options] 基础参数 * @param [yes] 点击确定后的回调 */ alert(content?: any, options?: LayerOptions, yes?: LayerCallbackYes): number; // 源码中会第三个参数代替第二个。单独定义一个方法。 /** * 普通信息框 * @param [content] 内容 * @param [yes] 点击确定后的回调 */ alert(content: any, yes: LayerCallbackYes): number; /** * 询问框 * @param [content] 提示内容 * @param [options] 参数 * @param [yes] 确认回调 * @param [cancel] 右上角关闭按钮触发的回调 * @example ```javascript * layer.confirm('is not?', { * icon: 3, * title: '提示', * cancel: (index, layero) => { * console.log("点击了右上角关闭"); * //return false //点击右上角叉号不能关闭 * } * }, (index, layero) => { * console.log("点击了下边的第一个按钮'确定'"); * layer.close(index);//需要手动关闭 * }, (index, layero) => { * console.log("点击了下边的第二个按钮'取消'"); * //return false // 点击取消不能关闭 * }); * ``` */ confirm(content?: any, options?: LayerOptions, yes?: LayerCallbackYes, cancel?: LayerCallbackCancel): number; /** * 询问框 * @param [content] 提示内容 * @param [yes] 确认回调 * @param [cancel] 右上角关闭按钮触发的回调 * @example ```javascript * layer.confirm('is not?', (index,layero) => { * // do something * layer.close(index); * },(index,layero)=>{ * return false // 返回false则取消关闭 * }); * ``` */ confirm(content: any, yes: LayerCallbackYes, cancel?: LayerCallbackCancel): number; // https://www.layui.com/doc/modules/layer.html#layer.msg /** * 提示框 * @param [content] 提示内容 * @param [options] 参数 * @param [end] 自动关闭后的回调 */ msg(content?: string, options?: LayerOptions, end?: LayerCallbackEnd): number; // https://www.layui.com/doc/modules/layer.html#layer.load /** * 提示框 * @param [content] 提示内容 * @param [end] 自动关闭后的回调 */ msg(content: string, end?: LayerCallbackEnd): number; /** * 加载层 * @param [icon] 可用：0,1,2 * @param [options] 参数 */ load(icon?: number, options?: LayerOptions): number; /** * 加载层 * @param [options] 参数 */ load(options: LayerOptions): number; // https://www.layui.com/doc/modules/layer.html#layer.tips /** * tips层 * @param [content] 显示的内容 * @param [follow] 在那里显示 * @param [options] 参数 */ tips(content?: string, follow?: string | HTMLElement | JQuery, options?: LayerOptions): number; /** * 关闭指定层 * @param [index] 层索引 * @param [callback] 关闭后的回调 */ close(index: number, callback?: () => any): void; /** * 关闭所有层 * @param [type] 只想关闭某个类型的层,不传则关闭全部 */ /** * 闭所有层 * @param [type] 只想关闭某个类型(dialog,page,iframe,loading,tips)的层,不传则关闭全部 * @param [callback] 关闭所有层后执行回调 */ closeAll(type?: "dialog" | "page" | "iframe" | "loading" | "tips", callback?: () => any): void; /** * @param [callback] 关闭所有层后执行回调 */ closeAll(callback: () => any): void; /** * 重新定义层的样式 * @param [index] 层索引 * @param [options] 参数 * @param [limit] 影响宽度和高度 */ style(index: number, options: { [key: string]: string | number }, limit?: boolean): void; /** * 改变层的标题 * @param [title] 新标题 * @param [index] 层索引 */ title(title: string, index: number): void; /** * 获取iframe页的DOM * @param [selector] * @param [index] */ getChildFrame(selector: string | HTMLElement | JQuery, index: number): JQuery; /** * 获取特定iframe层的索引 * @param [windowName] 即window.name */ getFrameIndex(windowName: string): number; /** * 指定iframe层自适应 * @param [index] 层索引 */ iframeAuto(index: number): void; /** * 重置特定iframe url   * 如：layer.iframeSrc(index, 'http://sentsin.com') * @param [index] 层索引 * @param [url] */ iframeSrc(index: number, url: string): void; /** * 置顶当前窗口 * @param [layero] */ setTop(layero: JQuery): void; /** * 手工执行最大化 * @param [index] 层索引 */ full(index: number): void; /** * 手工执行最小化 * @param [index] 层索引 */ min(index: number): void; /** * 手工执行还原 * @param [index] 层索引 */ restore(index: number): void; /** * 输入层 * @param [options] 参数 * @param [yes] 点击确定的回调，用该参数而不是用options的yes */ prompt(options?: LayerPromptOptions, yes?: LayerCallbackPrompt): number; /** * 输入层 * @param [yes] 点击确定的回调 */ prompt(yes: LayerCallbackPrompt): number; /** * tab层 * @param [options] 参数，一般配置area和tab */ tab(options?: LayerTabOptions): number; /** * 相册层 * @param [options] 参数 */ photos(options?: LayerPhotosOptions): number; } interface PageOptions { /** * 指向存放分页的容器，值可以是容器ID、DOM对象。如：   * 1. elem: 'id' 注意：这里不能加 # 号   * 2. elem: document.getElementById('id') */ elem?: string | HTMLElement; /** * 数据总数。一般通过服务端得到 */ count?: number; /** * 每页显示的条数。laypage将会借助 count 和 limit 计算出分页数。默认：10 */ limit?: number; /** * 每页条数的选择项。如果 layout 参数开启了 limit，默认：[10, 20, 30, 40, 50]   * 则会出现每页条数的select选择框 */ limits?: number[]; /** * 起始页。一般用于刷新类型的跳页以及HASH跳页 */ curr?: number | string; /** * 连续出现的页码个数默认：5 */ groups?: number; /** * false:则不显示”上一页”的内容，其他值则是自定义”上一页”的内容默认：上一页 */ prev?: string; /** * false:则不显示”下一页”的内容，其他值则是自定义”下一页”的内容默认：下一页 */ next?: string; /** * false:则不显示”首页”的内容，其他值则是自定义”首页”的内容默认：首页 */