更新记录

1.0.0（2025-12-04） 下载此版本

项目初次更新 看到有vue2的类似参加 考虑到没有Vue3版本顾 开发了一个

平台兼容性

uni-app(4.81)

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
- √ √ √ √ - √ √ √
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 快应用-华为 快应用-联盟
√ √ √ √ √ √ √ √ √ √ √

其他

多语言 暗黑模式 宽屏模式
× × √

介绍

基于uni-app+vue3开发的一个少见的场地+时间预约组件 已用于生产环境 如有自定义 和bug 可联系我免费维护

colorDate 属性

参数 说明 类型 可选值 默认值 是否必须
startColor 开始时间的色块 String -- #E8F3FF 否
endColor 结束时间的色块 String -- #E8FFF3 否
disableColor 不可选时间的色块 String -- #F1F1F1 否
enableColor 可选时间的色块 String -- #FFFFFF 否
selectColor 选中区间的色块 String -- #E5F0FF 否
selectStartColor 已选中的开始时间的色块 String -- #7BB7FF 否
selectEndColor 已选中的结束时间的色块 String -- #7ADEAC 否

setTimeInterval 属性

参数 说明 类型 可选值 默认值 是否必须
start 开始时间区域 String -- 07:00:00 否
end 结束时间的区域 String -- 18:00:00 否
timeHeight 行高 Number 60 -- 是
interval 时间间隔 Number -- 30 否

其他属性

参数 说明 类型 可选值 默认值 是否必须
reserv_date 日期 String -- 2025-12-26 是
venuesList 场地数组 [] -- -- 是

li-appointment 事件

参数 说明 类型 可选值 默认值 是否必须
事件名自定义 取决于type类型为operation的 renders参数里面 func 的参数名 Function (row,index)=>{} -- 否
selectService 选择的场地 Function (val)=>{} -- 否
confirmSelection 选择的时间区间 Function (val)=>{} -- 否

data 属性

参数 说明 类型 可选值 默认值
id key值 String -- 无
label 显示场地名称 String -- 无
bookedList 禁止选择的时间段 [] true --
startTime 禁止开始时间 String -- --
endTime 禁止结束时间 String -- --

示例

<LiAppointment ref="childRef" :colorDate="colorDate" :setTimeInterval="setTimeInterval" :venuesList="venuesList"
     :reserv_date="reserv_date" @selectService="selectService"
    @confirmSelection="confirmSelection">
</LiAppointment>

数据格式

roomList = [
    {
        "remark": null,
        "id": 2023708802936,
        "label": "1号包间",
        "bookedList": [
            {
                "startTime": "2025-11-26 00:00:00",
                "endTime": "2025-11-26 07:00:00",
                "id": 2033155920168,
                "roomId": 2023708802936
            },
            {
                "startTime": "2025-11-26 10:00:00",
                "endTime": "2025-11-26 11:00:00",
                "id": 2033155920192,
                "roomId": 2023708802936
            }
        ]
    }
]

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

插件不采集任何数据

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

许可协议

MIT协议
评论列表 撰写评论 向官方投诉

暂无用户评论。