0.0.5 • Published 7 years ago

@beisen/upaas-timepicker-search v0.0.5

Weekly downloads
1
License
ISC
Repository
gitlab
Last release
7 years ago

@beisen/upaas-textbox-search

  • 日历搜索态组件
  • 默认需要的参数
  /**参数
  * "title": "开发态标准时分",
      "value" : "11:11:11", //时间的值
      "defaultValue" : "", //**初始默认时间(string) 默认日期的格式需与format格式相同!!!! 
      "size" : "", //
      "placeholder" : "开发态标准时分",/**没有值的时候显示的内容(string)**/
      "format" : "HH:mm",/**展示的时间格式  "HH:mm:ss"、"HH:mm"、"mm:ss"  (string)**/
      "disabled" : false,/**禁用全部操作 (bool)**/
      "hidden" : false,/**是否隐藏**/
      "readonly": false,/**是否只读**/
      "showStatus" : "是否报错",//显示状态 "search" or ""
      "required" : false,/**是否必填**/
      "disabledHours":{
        "value":[22,3],
        "limit" : "open" /**限制选择部分 小时选项(array) 
                                [开始时间(小时),结束时间(小时)]  
                                limit:  open 启用限制
                                        close 关闭限制
                                范围:0~24
                                结束时间可小于开始时间
                              **/
      },
      "disabledMinutes":{
        "value":[40,10],
        "limit":"open" /**限制选择部分 分钟选项(array)
                                    value:[开始分钟,结束分钟]
                                    limit:  open 启用限制
                                        close 关闭限制
                                    范围:0~60
                                    结束时间可小于开始时间
                                    如果想实现任意时间段的禁用,在value数组中传入多个范围数组即可,例如:[[1,7],[34,45]]
                                  **/
      },
      "disabledSeconds":{ /**限制选择部分 秒选项(array) ,配置规范同分钟**/
        "value":[0,30],
        "limit":"open"
      },
      "hideDisabledOptions" : false,/**隐藏禁止选择的选项 (bool)**/
      "errorStatus" : false,//是否报错
      "errorMsg":"出错了……",//报错信息
      "cmp_type":"BC_Time",//类型
      "cmp_id":"852fb18d-6031-463f-b62f-889acb92ff29",
      "onChange":function(time,booldata){ /**点击后时间回调**/
        console.log(time,booldata);
      },
      "onSaveSearchStatus":function(status,cmp_type){ //请求action
        console.log(cmp_type,status);
      },
      "onGobalClick":function(e,cmp_id){ //请求action
        console.log(e);
        console.log(cmp_id);
      }
  */
  
  • 使用demo
import TimePickerSearch from '@beisen/upaas-timepicker-search';

class Demo extends Component{
 
  getInitData(){
    let initData = {
      "title": "开发态标准时分",
      "value" : "",
      "defaultValue" : "",
      "size" : "",
      "placeholder" : "开发态标准时分",
      "format" : "HH:mm",
      "disabled" : false,
      "hidden" : false,
      "readonly": false,
      "showStatus" : "是否报错",
      "required" : false,
      "disabledHours":{
        "value":[22,3],
        "limit" : "open"
      },
      "disabledMinutes":{
        "value":[40,10],
        "limit":"open"
      },
      "disabledSeconds":{
        "value":[0,30],
        "limit":"open"
      },
      "hideDisabledOptions" : false,
      "errorStatus" : false,
      "errorMsg":"出错了……",
      "cmp_type":"BC_Time",
      "cmp_id":"852fb18d-6031-463f-b62f-889acb92ff29",
      "onChange":function(time,booldata){
        console.log(time,booldata);
      },
      "onSaveSearchStatus":function(status,cmp_type){
        console.log(cmp_type,status);
      },
      "onGobalClick":function(e,cmp_id){
        console.log(e);
        console.log(cmp_id);
      }
    }
    return initData;
  }
  render () {
    let data = this.getInitData();
    return (
      <div>
          <UpaasTimePicker {...data} />
      </div>
    )
  }
}