Ct-adc-date NPM

date & dates

日期组件封装，分别封装单个时间/日期和开始结束时间/日期组合

在线demo

使用

从npm安装ct-adc-date

npm install ct-adc-date

在代码中使用

import {DateInput, DatesInput} from 'ct-adc-date';
Vue.component(DateInput.name,DateInput);
Vue.component(DatesInput.name,DatesInput);

或

new Vue({
    el: ...,
    components: {
        DateInput,
        DatesInput
    }
})

参数说明

date参数说明

参数	描述	类型	默认值
initialDate	开始日期初始值	String,Number	''
disabled	是否将日期控件处于禁用状态	Boolean	false
ops	日期的配置项	Object	{type:'date'...}详见备注
placeholder	placeholder	String	''
valueReadable	value值是否可读可读时为指定格式的值，否则为毫秒时间戳	Boolean	false

dates参数说明

参数	描述	类型	默认值
initialDates	日期初始值(可以是符合格式的日期或者时间戳)	Object{begin: (String,Number), end: (String,Number)}	{begin: '', end: ''}
beginPlaceholder	开始日期的placeholder	String	'请选择'
beginOps	开始日期的配置项	Object	{type:'date'...}详见备注
beginDisabled	是否将开始日期控件处于禁用状态	Boolean	false
endPlaceholder	结束日期的placeholder	String	'请选择'
endOps	结束日期的配置项	Object	{type:'date'...}详见备注
endDisabled	是否将结束日期控件处于禁用状态	Boolean	false
related	开始结束日期是否要联动	Boolean	false
valueReadable	value值是否可读可读时为指定格式的值，否则为毫秒时间戳	Boolean	false
valueEndTransfered	当type为date时，结束日期是否需要定位到23:59:59:999; 当type为datetime时是否定位到所选择时间的最后一毫秒，即`所选时间:999`	Boolean	true

备注: 默认选项

{
    type:'date', //可选值: 'date': 日期; datetime':日期时间
    dateFormat:'yyyy-MM-dd', // 日期格式 如 yyyy/MM/dd
    timeFormat:'HH:mm:ss', // 时间格式 如 'hh:mm:ss'为12小时制的时间格式
    timeStart:'00:00:00', // 初始化时间
    timeBtn:true, // 是否显示时间按钮
    clearBtn: true, // 是否显示清空图标
    monthNames:["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
    shortMonthNames: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
    shortMonthNames2: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
    shortDayNames: ["日", "一", "二", "三", "四", "五", "六"],
    errorOutOfRange: "选择的日期不符合规则",
    selectableDays: [0, 1, 2, 3, 4, 5, 6], //  可选择的天
    nonSelectable: [],
    recNonSelectable: [],
    startOfWeek: 1, // 每周的开始
    showWeek: false, // 是否显示周行头
    selectWeek: false, // 按周选择
    weekLabel: "周", //showWeek为true时，显示的周的列头内容
    dateMin: "",// 符合dateFormat设置的日期，如'2017-09-01' 注意：该参数只能用于配置日期 设置后小于该日期将无法被选择
    dateMax: "" // 符合dateFormat设置的日期，如'2017-09-01' 注意：该参数只能用于配置日期 设置后大于该日期将无法被选择
}