import Vue from 'vue';
import "../../../src/scss/progress.scss";
export default Vue.extend({
  name: 'w-progress',
  props: {
    percent: {
      type: [Number, String],
      required: true,
      validator: function validator(val) {
        return val >= 0 && val <= 100;
      }
    },
    showClear: {
      type: Boolean,
      default: true
    },
    color: {
      type: String,
      default: '#09bb07'
    },
    backgroundColor: {
      type: String,
      default: '#ebebeb'
    },
    strokeWidth: {
      type: Number,
      default: 3,
      validator: function validator(val) {
        return val > 0;
      }
    },
    borderRadius: {
      type: Number,
      default: 0
    }
  },
  computed: {
    style: function style() {
      return {
        height: "".concat(this.strokeWidth, "px"),
        backgroundColor: this.backgroundColor,
        borderRadius: "".concat(this.borderRadius, "px")
      };
    },
    barStyle: function barStyle() {
      return {
        width: "".concat(this.percent, "%"),
        height: "".concat(this.strokeWidth, "px"),
        backgroundColor: this.color,
        borderRadius: "".concat(this.borderRadius, "px")
      };
    }
  },
  methods: {
    onClickCancel: function onClickCancel(e) {
      e.preventDefault();
      this.$emit('cancel', this);
    }
  },
  render: function render() {
    var _this = this;

    var h = arguments[0];
    return h("div", {
      "class": "weui-progress"
    }, [h("div", {
      "class": "weui-progress__bar",
      "style": this.style
    }, [h("div", {
      "class": "weui-progress__inner-bar js_progress",
      "style": this.barStyle
    })]), this.showClear && h("span", {
      "class": "weui-progress__opr"
    }, [h("i", {
      "class": "weui-icon-cancel",
      "on": {
        "click": function click(e) {
          _this.onClickCancel(e);
        }
      }
    })])]);
  }
});
//# sourceMappingURL=WProgress.js.map