import TyComponent from '../common/component'

TyComponent({
  /**
   * 组件的属性列表
   */
  properties: {
    useButtonSlot: Boolean,
    value: {
      type: Number,
      value: 0
    },
    disabled: {
      type: Boolean,
      value: false
    },
    max: {
      type: Number,
      value: 100
    },
    min: {
      type: Number,
      value: 0
    },
    step: {
      type: Number,
      value: 1
    },
    barHeight: {
      type: [String, Number],
      value: '2px'
    },
    activeColor: {
      type: String,
      value: '#1890FF'
    },
    inactiveColor: {
      type: String,
      value: '#BFBFBF'
    },
    customClass: {
      type: String
    }

  },

  /**
   * 组件的初始数据
   */
  data: {

  },

  /**
   * 组件的方法列表
   */
  methods: {
    handleDrag({detail}) {
      this.triggerEvent('drag', detail)
    },
    handleChange({detail}) {
      this.triggerEvent('change', detail)
    },
    handleDragStart({detail}) {
      this.triggerEvent('drag-start', detail)
    },
    handleDragEnd({detail}) {
      this.triggerEvent('drag-end', detail)
    },
  }
})
