企业级时间轴插件Vue-timelinepick - hellogril前端库 - CSDN博客

简介

时间范围选择插件 取当前时间之前一段时间范围 按刻，小时，天分类

在线演示及下载

在线演示:[](https://yelingfeng.github.io/vue-timelinepick/)https://yelingfeng.github.io/vue-timelinepick/
本地下载

依赖

  • jquery
import timelinepick from "vue-timelinepick"
import "vue-timelinepick/dist/vue-timelinepick.css"

Vue.use(timelinpick)

vue组件中直接使用

<timelinepick :option="op" :width="width" :height="height" :handler="changeAction"></timelinepick>

data() {
      return {
          "width": 1200,
          "height":110,
          "op" : {
              "threshold": new Date(),
              "number": 97,
              "spanMinNumber": 10,
              "isFixedDrag" : true,
              "spanIndex": {start: 70, end: 97},
              "type": "quarter",
              "dateFormat" : 'yyyy-MM-dd mm:hh:ss'
          }
      }
  },
methods:{
    changeAction(e){
        this.startTime = e.startTime;
        this.endTime = e.endTime;
    }
}

属性

属性

说明

width

宽

height

高

option

配置项

方法

属性

说明

threshold

起点时间（默认当前） new Date()

number

总刻度 97

isFixedDrag

是否禁止拖拽 false

spanIndex

起始滑块范围 {start: 70, end: 97}

type

刻度类型 “quarter”

dateFormat

格式 ‘yyyy-MM-dd mm:hh:ss’

更多插件

Original url: Access
Created at: 2019-09-24 21:43:33
Category: default
Tags: none

未标明原创文章均为采集，版权归作者所有，转载无需和我联系，请注明原出处，南摩阿彌陀佛，知识，不只知道，要得到

请先后发表评论
  • 最新评论
  • 总共0条评论