日历
用于显示和选择日期。其主要功能包括:展示时间轴,月/周/日视图, 支持日程查看,高亮当前日期,标记特殊事件,是日程管理类应用的核心组件。
- 在配置日历部件样式为【时间轴】时,会按照时间的顺序依次展示事件数据;
- 在配置日历部件样式为【月】时,可一次性显示一个月的时间以及该时间段内的事件数据,同时该模式下部件参数
showmode可额外配置值为'daterange'和'expand'(详情见控件动态参数); - 在配置日历部件样式为【周】时,可一次性显示一周的时间以及每天的事件数据;
- 在配置日历部件样式为【天】时,可一次性显示一天24小时的时间以及各时间段内的事件数据;
- 当在配置日历部件样式为【用户自定义1】时,该模式是以只读模式的周视图进行展示;
常规
多数据源
布局面板
上下文菜单
设置默认值
内置导航
显示模式
刷新模式
事件
能力调用
输入参数
| 名称 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| modelData | 日历模型数据 | Object as ISysCalendar | - |
| context | 应用上下文对象 | Object as IContext | - |
| params | 视图参数对象 | Object as IParams | {} |
| provider | 部件适配器 | Object as IControlProvider | - |
| mdctrlActiveMode | 部件激活模式,值为0:表示无激活,1:表示单击激活,2:表示双击激活 | Number | - |
| isSimple | 是否是简单模式,即直接传入数据,不加载数据 | Boolean | - |
| loadDefault | 是否默认加载 | Boolean | true |
状态
| 名称 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| isCreated | 控制器是否走完created生命周期 | boolean | false |
| isMounted | 控制器是否走完mounted生命周期 | boolean | false |
| isDestroyed | 控制器是否走完destroy生命周期 | boolean | false |
| context | 应用上下文对象 | IApiContext | {} |
| zIndex | popover层级 | number | - |
| activated | 当前部件是否为激活状态(缓存下的激活状态,一般与框架的生命周期相同) | boolean | false |
| isSimple | 是否是简单模式,简单模式下不加载数据,而是由父组件传值 | boolean | false |
| isLoading | 部件是否正在加载 | boolean | false |
| loadDefault | 是否默认加载数据 | boolean | true |
| disabled | 部件禁用状态 | boolean | false |
| maskOption | 部件遮罩参数 | IApiMaskOption | - |
| isCounterDisabled | 是否禁用计数器 | boolean | - |
| items | 日历项数据 | IApiCalendarItemData[] | [] |
| selectedData | 多数据部件已选中的数据集合 | IApiData[] | [] |
| selectedKeys | 多数据部件选中数据主键集合(数据选择视图中使用) | string[] | [] |
| singleSelect | 是否是单项选择 | boolean | true |
| mdctrlActiveMode | 多数据部件激活模式,0:无激活;1:单击激活;2:双击激活 | number | 0 | 1 | 2 | 0 |
| curPage | 当前页 | number | 1 |
| size | 分页条数 | number | 20 |
| total | 总条数 | number | 0 |
| totalx | 全部计数条数,数据集配置需勾选返回全部计数 | number | 0 |
| totalPages | 总页数 | number | - |
| isLoaded | 是否加载过数据,用于某些需要等待数据加载回来之后的场景。 | boolean | false |
| searchParams | 搜索部件的查询参数 | IApiParams | {} |
| noSort | 是否禁用排序 | boolean | false |
| sortQuery | 排序查询条件 | string | '' |
| groups | 日历分组数据 | IApiCalendarGroup[] | [] |
| hideNoDataImage | 隐藏无数据图片,该状态仅PC端使用。 | boolean | false |
| enableNavView | 是否启用内置导航视图,该状态仅PC端使用。 | boolean | false |
| showNavView | 是否显示内置导航视图,该状态仅PC端使用。 | boolean | false |
| showNavIcon | 是否显示内置导航图标,导航视图显示模式为程序控制时不显示。该状态仅PC端使用。 | boolean | false |
| showRowDetail | 是否显示行明细,该状态仅PC端(表格,列表)使用。 | boolean | false |
| enableGroup | 是否启用分组,该状态仅PC端(表格,卡片,列表)使用。 | boolean | - |
| selectedDate | 选中的日期 | Date | Date |
| legends | 图例 | IApiData[] | [] |
| calendarTitle | 日历名称 | string | '' |
控制器
| 名称 | 说明 | 类型 |
|---|---|---|
| id | 控制器实例的唯一标识,创建时自动生成 | string |
| state | 状态对象,泛型 | S |
| model | 模型对象,泛型 | T |
| context | 应用上下文对象 | IApiContext |
| params | 视图参数对象 | IApiParams |
| view | 当前视图控制器 | IApiViewController & IApiData |
| ctrlId | 部件标识 | string |
| controlParams | 部件参数 | IApiParams |
| layoutPanel | 部件布局面板控制器 | IApiViewLayoutPanelController & IApiData |
| runMode | 运行模式(DESIGN:设计模式,RUNTIME:运行时) | 'DESIGN' | 'RUNTIME' |
| force | 强制更新,触发render函数 | (_callback?: () => void) => void |
| startLoading | 开始加载 | () => Promise<void> |
| endLoading | 加载完毕 | () => Promise<void> |
| getControlType | 获取部件类型 | () => string |
| enable | 取消部件禁用 | () => void |
| disabled | 设置部件禁用 | (options?: IApiMaskOption) => void |
| disableCounter | 禁用部件计数器 | () => void |
| emitDEDataChange | 触发实体数据变更的通知 | (type: 'create' | 'update' | 'remove', data: IApiData) => void |
| setSort | 设置排序 | (key?: string, order?: 'asc' | 'desc') => void |
| loadMore | 加载更多 | () => Promise<void> |
| load | 加载数据 | (args?: IApiMDCtrlLoadParams) => Promise<IApiData[]> |
| remove | 删除数据 | (args?: IApiMDCtrlRemoveParams) => Promise<void> |
| refresh | 刷新数据 | () => Promise<void> |
| importData | 导入数据 | () => Promise<void> |
| getData | 获取选中数据 | () => IApiData[] |
| setSelection | 设置选中数据,设置的数据和已经选中的一样时会触发onSelectionChange事件 | (selection: IApiData[], isEmit?: boolean) => void |
| setActive | 设置激活数据 | (data: IApiData, event?: MouseEvent | undefined) => Promise<void> |
| goToFirstPage | 跳转第一页 | () => Promise<IApiData[]> |
| goToPreviousPage | 跳转上一页 | () => Promise<IApiData[]> |
| goToNextPage | 跳转下一页 | () => Promise<IApiData[]> |
| goToLastPage | 跳转最后一页 | () => Promise<IApiData[]> |
| selectAll | 选中全部数据 | (state?: boolean) => void |
| execGroup | 执行多数据分组 | (arg: IApiMDGroupParams[], params?: IApiParams) => Promise<void> |
| setSelectedData | 设置选中数据 | (items: IApiData[]) => void |
| newRow | 新建行 | (args?: IApiMDCtrlLoadParams) => Promise<void> |
| setSelectDate | 设置选中日期 | (date: Date) => void |
事件
| 名称 | 描述 | 类型 |
|---|---|---|
| onCreated | 自身的准备工作完成(如模型加载,各种初始化,init结束) | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onMounted | 没有下级组件created之后的生命周期,有下级时需要等所有下级组件onMounted完成后触发 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onBeforeDestroy | 组件销毁前 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onDestroyed | 自身组件被销毁时触发 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onActivated | 自身组件重新激活 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onDeactivated | 自身组件暂时停用 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onUIAction | 界面行为执行 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onRefreshSuccess | 刷新成功 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onActive | 数据激活事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onSelectionChange | 选中数据变更事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onBeforeSave | 保存之前 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onSaveSuccess | 保存成功后 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onSaveError | 保存失败 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onBeforeRemove | 删除之前 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onRemoveSuccess | 删除成功之后 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onRemoveError | 删除失败 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onBeforeLoad | 加载前事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onLoadSuccess | 加载后处理事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onLoadError | 加载失败 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
| onNavDataChange | 导航数据变更 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
控件动态参数
| 名称 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| showmode | 该值为 'DEFAULT' 时正常显示无数据提示图片,该值为 'ONLYDATA' 和 'MIXIN' 时,不显示无数据提示图片;当日历部件样式为月时,默认情况下,时间单元格内仅显示首个事件数据,剩余事件数据隐藏,点击 更多 按钮后,剩余事件数据会以气泡形式展示。当该值为 'daterange' 时,会依据事件数据中的时间范围,在对应时间单元格内以连续的色块覆盖形式展示日历项范围。当该值为 'expand' 时,时间单元格内的事件数据会从上至下平铺展示 | 'DEFAULT' | 'ONLYDATA' | 'MIXIN' | 'daterange' | 'expand' | 'DEFAULT' |
| showdetail | 当日历部件样式为周 、天时生效,鼠标悬浮到显示日历事件项之上时是否弹出气泡框显示事件项详情 | boolean | false |
| defaultdatetime | 当日历部件样式为周 、天、月、用户自定义时生效,用于设置日历初始化的时间,值格式化为YYYY-MM-DD | string | '' |
| mdctrlrefreshmode | 多数据部件刷新模式,当值为 'cache',部件刷新时保留选中数据;当值为 'nocache',部件刷新时清空选中数据 | 'nocache' | 'cache' | 'cache' |