finecarmini/components/carslider/carslider.js

// components/carslider.js
var app = getApp()

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    "min":{
      value:0,
      type:Number
    },
    "max":{
      value:100,
      type:Number
    },
    "splitnum":{
      value:"0",
      type:String
    },
    "unit":{
      value:"0",
      type:String
    },
    "splitvalue":{
      value:NaN,
      type:String
    }
    // "step":{
    //   value:"",
    //   type:String
    // },
    // "value":{
    //   value:"",
    //   type:String
    // },
    // "activeColor":{
    //   value:"",
    //   type:String
    // },
    // "backgroundColor":{
    //   value:"",
    //   type:String
    // },
    // "block-size":{
    //   value:"",
    //   type:String
    // },
    // "block-color":{
    //   value:"",
    //   type:String
    // },
    // "show-value":{
    //   value:"",
    //   type:String
    // }
  },

  /**
   * 组件的初始数据
   */
  data: {
    scale:0,
    gscale:app.globalData.scale
  },
  ready:function(){
    if(this.data.splitnum>0){
      var min = parseInt(this.data.min);
      var space = this.data.max-this.data.min;
      var gap = space/this.data.splitnum;
      var list = [this.data.min];
      for(var i=1;i<=this.data.splitnum;i++){
        list.push(parseInt(this.data.min)+i*gap);
      }
      this.setData({
        list:list,
        value:min+gap*this.data.scale
      });
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    touchMove:function(e){
      var obj = this.changeScale(e);      
      this.setData(obj);
      this.triggerEvent("changevalue",obj);
    },
    tapToScale:function(e){
      var obj = this.changeScale(e);    
      this.setData(obj);
      this.triggerEvent("changeend",obj);
    },
    changeScale:function(e){
      var left = e.touches[0].pageX*this.data.gscale-45;
      var scale = left/660;
      if(scale>1){
        scale=1;
      }else if(scale<0){
        scale=0;
      }
      var space = this.data.max-this.data.min;
      var selectv = space*scale;      
      if(this.data.splitvalue){
        selectv = Math.round(selectv/this.data.splitvalue)*this.data.splitvalue;
      }
      scale = selectv/space;
      var value = Math.round(selectv+parseInt(this.data.min));
      var obj = {
        scale:scale,
        value:value
      };
      return obj;
    },
    changeEndScale:function(e){
      var obj = {
        scale:this.data.scale,
        value:this.data.value
      };
      this.triggerEvent("changeend",obj);
    }
  }
})