props.js 7.74 KB
import { defineMixin } from '../../libs/vue.js'
import CalendarDefaultProps from './calendar.js'
import { registerComponentProps } from '../../libs/config/props.js'

const defProps = registerComponentProps(CalendarDefaultProps)
export const props = defineMixin({
    props: {
        // 日历顶部标题
        title: {
            type: String,
            default: () => defProps.calendar.title
        },
        // 是否显示标题
        showTitle: {
            type: Boolean,
            default: () => defProps.calendar.showTitle
        },
        // 是否显示副标题
        showSubtitle: {
            type: Boolean,
            default: () => defProps.calendar.showSubtitle
        },
        // 日期类型选择,single-选择单个日期,multiple-可以选择多个日期,range-选择日期范围
        mode: {
            type: String,
            default: () => defProps.calendar.mode
        },
        // mode=range时,第一个日期底部的提示文字
        startText: {
            type: String,
            default: () => defProps.calendar.startText
        },
        // mode=range时,最后一个日期底部的提示文字
        endText: {
            type: String,
            default: () => defProps.calendar.endText
        },
        // 自定义列表
        customList: {
            type: Array,
            default: () => defProps.calendar.customList
        },
        // 主题色,对底部按钮和选中日期有效
        color: {
            type: String,
            default: () => defProps.calendar.color
        },
        // 最小的可选日期
        minDate: {
            type: [String, Number],
            default: () => defProps.calendar.minDate
        },
        // 最大可选日期
        maxDate: {
            type: [String, Number],
            default: () => defProps.calendar.maxDate
        },
        // 默认选中的日期,mode为multiple或range是必须为数组格式
        defaultDate: {
            type: [Array, String, Date, null],
            default: () => defProps.calendar.defaultDate
        },
        // mode=multiple时,最多可选多少个日期
        maxCount: {
            type: [String, Number],
            default: () => defProps.calendar.maxCount
        },
        // 日期行高
        rowHeight: {
            type: [String, Number],
            default: () => defProps.calendar.rowHeight
        },
        // 日期格式化函数
        formatter: {
            type: [Function, null],
            default: () => defProps.calendar.formatter
        },
        // 是否显示农历
        showLunar: {
            type: Boolean,
            default: () => defProps.calendar.showLunar
        },
        // 是否显示月份背景色
        showMark: {
            type: Boolean,
            default: () => defProps.calendar.showMark
        },
        // 确定按钮的文字
        confirmText: {
            type: String,
            default: () => defProps.calendar.confirmText
        },
        // 确认按钮处于禁用状态时的文字
        confirmDisabledText: {
            type: String,
            default: () => defProps.calendar.confirmDisabledText
        },
        // 是否显示日历弹窗
        show: {
            type: Boolean,
            default: () => defProps.calendar.show
        },
        // 是否显示遮罩
        overlay: {
            type: Boolean,
            default: () => defProps.calendar.overlay
        },
        // 动画时长,单位ms
        duration: {
            type: [String, Number],
            default: () => defProps.calendar.duration
        },
        // 自定义遮罩的样式
        overlayStyle: {
            type: [Object, String],
            default: () => defProps.calendar.overlayStyle
        },
        // 遮罩的透明度,0-1之间
        overlayOpacity: {
            type: [Number, String],
            default: () => defProps.calendar.overlayOpacity
        },
        // 层级
        zIndex: {
            type: [String, Number],
            default: () => defProps.calendar.zIndex
        },
        // 是否为iPhoneX留出底部安全距离
        safeAreaInsetBottom: {
            type: Boolean,
            default: () => defProps.calendar.safeAreaInsetBottom
        },
        // 是否留出顶部安全距离(状态栏高度)
        safeAreaInsetTop: {
            type: Boolean,
            default: () => defProps.calendar.safeAreaInsetTop
        },
        // 弹窗背景色,设置为transparent可去除白色背景
        bgColor: {
            type: String,
            default: () => defProps.calendar.bgColor
        },
        // 是否允许点击遮罩关闭日历
        closeOnClickOverlay: {
            type: Boolean,
            default: () => defProps.calendar.closeOnClickOverlay
        },
        // 是否为只读状态,只读状态下禁止选择日期
        readonly: {
            type: Boolean,
            default: () => defProps.calendar.readonly
        },
        // 	是否展示确认按钮
        showConfirm: {
            type: Boolean,
            default: () => defProps.calendar.showConfirm
        },
        // 日期区间最多可选天数,默认无限制,mode = range时有效
        maxRange: {
            type: [Number, String],
            default: () => defProps.calendar.maxRange
        },
        // 范围选择超过最多可选天数时的提示文案,mode = range时有效
        rangePrompt: {
            type: String,
            default: () => defProps.calendar.rangePrompt
        },
        // 范围选择超过最多可选天数时,是否展示提示文案,mode = range时有效
        showRangePrompt: {
            type: Boolean,
            default: () => defProps.calendar.showRangePrompt
        },
        // 是否允许日期范围的起止时间为同一天,mode = range时有效
        allowSameDay: {
            type: Boolean,
            default: () => defProps.calendar.allowSameDay
        },
        // 区间模式下确认返回值格式,all-返回区间内所有日期,boundary-仅返回起止日期
        rangeResultMode: {
            type: String,
            default: () => defProps.calendar.rangeResultMode
        },
        // 是否开启时分秒选择
        enableTime: {
            type: Boolean,
            default: () => defProps.calendar.enableTime
        },
        // 时间精度:hour-仅时,minute-时分,second-时分秒
        timePrecision: {
            type: String,
            default: () => defProps.calendar.timePrecision
        },
        // 默认时间,格式支持 HH / HH:mm / HH:mm:ss
        defaultTime: {
            type: String,
            default: () => defProps.calendar.defaultTime
        },
		// 圆角值
		round: {
		    type: [Boolean, String, Number],
		    default: () => defProps.calendar.round
		},
		// 最多展示月份数量
		monthNum: {
			type: [Number, String],
			default: 3
		},
		// 是否启用非滚动的单月切换模式
		monthSwitch: {
			type: Boolean,
			default: () => defProps.calendar.monthSwitch
		},
		// 是否显示今天按钮
		showToday: {
			type: Boolean,
			default: () => defProps.calendar.showToday
		},
		// 今天日期的独立高亮颜色,默认跟随主题色
		todayColor: {
			type: String,
			default: () => defProps.calendar.todayColor
		},
        // 星期文案
        weekText: {
			type: Array,
			default: defProps.calendar.weekText
		},
        forbidDays: {
			type: Array,
			default: defProps.calendar.forbidDays
		},
        forbidDaysToast:{
			type: String,
			default: defProps.calendar.forbidDaysToast
		},
        monthFormat:{
			type: String,
			default: defProps.calendar.monthFormat
		},
        // 是否页面内展示
        pageInline:{
			type: Boolean,
			default: defProps.calendar.pageInline
		}
    }
})