"use strict";

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _comp = require("../../ui/src/comp");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _ui = require("../../ui");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
  name: 'VxeSlider',
  model: {
    prop: 'value',
    event: 'modelValue'
  },
  props: {
    value: [String, Number, Array],
    vertical: Boolean,
    max: {
      type: [String, Number],
      default: function _default() {
        return (0, _ui.getConfig)().slider.max;
      }
    },
    min: {
      type: [String, Number],
      default: function _default() {
        return (0, _ui.getConfig)().slider.min;
      }
    },
    step: {
      type: [String, Number],
      default: function _default() {
        return (0, _ui.getConfig)().slider.step;
      }
    },
    size: {
      type: String,
      default: function _default() {
        return (0, _ui.getConfig)().slider.size || (0, _ui.getConfig)().size;
      }
    },
    range: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().slider.range;
      }
    },
    readonly: {
      type: Boolean,
      default: null
    },
    disabled: {
      type: Boolean,
      default: null
    }
  },
  inject: {
    $xeForm: {
      default: null
    },
    formItemInfo: {
      from: 'xeFormItemInfo',
      default: null
    }
  },
  data: function data() {
    var xID = _xeUtils.default.uniqueId();
    var reactData = {
      startValue: 0,
      endValue: 0
    };
    return {
      xID: xID,
      reactData: reactData
    };
  },
  computed: Object.assign(Object.assign({}, {}), {
    computeFormReadonly: function computeFormReadonly() {
      var $xeSlider = this;
      var props = $xeSlider;
      var $xeForm = $xeSlider.$xeForm;
      var readonly = props.readonly;
      if (readonly === null) {
        if ($xeForm) {
          return $xeForm.readonly;
        }
        return false;
      }
      return readonly;
    },
    computeIsDisabled: function computeIsDisabled() {
      var $xeSlider = this;
      var props = $xeSlider;
      var $xeForm = $xeSlider.$xeForm;
      var disabled = props.disabled;
      if (disabled === null) {
        if ($xeForm) {
          return $xeForm.disabled;
        }
        return false;
      }
      return disabled;
    },
    computeMaxNum: function computeMaxNum() {
      var $xeSlider = this;
      var props = $xeSlider;
      return _xeUtils.default.toNumber(props.max || 0);
    },
    computeMinNum: function computeMinNum() {
      var $xeSlider = this;
      var props = $xeSlider;
      return _xeUtils.default.toNumber(props.min || 0);
    }
  }),
  methods: {
    //
    // Method
    //
    dispatchEvent: function dispatchEvent(type, params, evnt) {
      var $xeSlider = this;
      $xeSlider.$emit(type, (0, _ui.createEvent)(evnt, {
        $watermark: $xeSlider
      }, params));
    },
    emitModel: function emitModel(value) {
      var $xeSlider = this;
      var _events = $xeSlider._events;
      if (_events && _events.modelValue) {
        $xeSlider.$emit('modelValue', value);
      } else {
        $xeSlider.$emit('model-value', value);
      }
    },
    getStartPercent: function getStartPercent(startValue) {
      var $xeSlider = this;
      var props = $xeSlider;
      var range = props.range;
      var maxNum = $xeSlider.computeMaxNum;
      var minNum = $xeSlider.computeMinNum;
      return range ? _xeUtils.default.floor((startValue - minNum) / _xeUtils.default.toNumber(maxNum - minNum) * 100) : 0;
    },
    getEndPercent: function getEndPercent(startValue, endValue) {
      var $xeSlider = this;
      var props = $xeSlider;
      var range = props.range;
      var maxNum = $xeSlider.computeMaxNum;
      var minNum = $xeSlider.computeMinNum;
      return _xeUtils.default.floor((endValue - (range ? startValue : 0) - minNum) / _xeUtils.default.toNumber(maxNum - minNum) * 100);
    },
    updateModel: function updateModel() {
      var $xeSlider = this;
      var props = $xeSlider;
      var reactData = $xeSlider.reactData;
      var value = props.value;
      if (_xeUtils.default.isArray(value)) {
        var _XEUtils$clone$sort = _xeUtils.default.clone(value, true).sort(),
          _XEUtils$clone$sort2 = _slicedToArray(_XEUtils$clone$sort, 2),
          sVal = _XEUtils$clone$sort2[0],
          eVal = _XEUtils$clone$sort2[1];
        reactData.startValue = _xeUtils.default.floor(_xeUtils.default.toNumber(sVal || 0));
        reactData.endValue = _xeUtils.default.floor(_xeUtils.default.toNumber(eVal || 0));
      } else {
        reactData.startValue = 0;
        reactData.endValue = _xeUtils.default.floor(_xeUtils.default.toNumber(value || 0));
      }
    },
    updateBarStyle: function updateBarStyle() {
      var $xeSlider = this;
      var reactData = $xeSlider.reactData;
      var startValue = reactData.startValue,
        endValue = reactData.endValue;
      var trackElem = $xeSlider.$refs.refTrackElem;
      var startBtnElem = $xeSlider.$refs.refStartBtnElem;
      var endBtnElem = $xeSlider.$refs.refEndBtnElem;
      var startPercent = 0;
      var endPercent = 0;
      if (startValue > endValue) {
        startPercent = $xeSlider.getStartPercent(endValue);
        endPercent = $xeSlider.getEndPercent(endValue, startValue);
      } else {
        startPercent = $xeSlider.getStartPercent(startValue);
        endPercent = $xeSlider.getEndPercent(startValue, endValue);
      }
      if (trackElem) {
        trackElem.style.left = "".concat(startPercent, "%");
        trackElem.style.width = "".concat(endPercent, "%");
      }
      if (startBtnElem) {
        startBtnElem.style.left = "".concat(startPercent, "%");
      }
      if (endBtnElem) {
        endBtnElem.style.left = "".concat(_xeUtils.default.floor(startPercent + endPercent), "%");
      }
    },
    changeEvent: function changeEvent(evnt) {
      var $xeSlider = this;
      var props = $xeSlider;
      var reactData = $xeSlider.reactData;
      var $xeForm = $xeSlider.$xeForm;
      var formItemInfo = $xeSlider.formItemInfo;
      var range = props.range;
      var startValue = reactData.startValue,
        endValue = reactData.endValue;
      var value = range ? [startValue, endValue].sort() : endValue;
      $xeSlider.emitModel(value);
      $xeSlider.dispatchEvent('change', {
        value: value
      }, evnt);
      // 自动更新校验状态
      if ($xeForm && formItemInfo) {
        $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
      }
    },
    handleMousedownEvent: function handleMousedownEvent(evnt, isEnd) {
      var $xeSlider = this;
      var reactData = $xeSlider.reactData;
      var formReadonly = $xeSlider.computeFormReadonly;
      var isDisabled = $xeSlider.computeIsDisabled;
      var maxNum = $xeSlider.computeMaxNum;
      var minNum = $xeSlider.computeMinNum;
      if (!(formReadonly || isDisabled)) {
        evnt.preventDefault();
        document.onmousemove = function (evnt) {
          evnt.preventDefault();
          var barElem = $xeSlider.$refs.refBarElem;
          if (barElem) {
            var barRect = barElem.getBoundingClientRect();
            var trackWidth = (evnt.clientX - barRect.left) / barRect.width;
            if (isEnd) {
              reactData.endValue = _xeUtils.default.floor(Math.max(minNum, Math.min(maxNum, trackWidth * (maxNum - minNum) + minNum)));
            } else {
              reactData.startValue = _xeUtils.default.floor(Math.max(minNum, Math.min(maxNum, trackWidth * (maxNum - minNum))));
            }
            $xeSlider.dispatchEvent('track-dragover', {
              startValue: reactData.startValue,
              endValue: reactData.endValue
            }, evnt);
          }
          $xeSlider.updateBarStyle();
        };
        document.onmouseup = function (evnt) {
          document.onmousemove = null;
          document.onmouseup = null;
          $xeSlider.dispatchEvent('track-dragend', {
            startValue: reactData.startValue,
            endValue: reactData.endValue
          }, evnt);
          $xeSlider.changeEvent(evnt);
          $xeSlider.updateBarStyle();
        };
        $xeSlider.dispatchEvent('track-dragstart', {
          startValue: reactData.startValue,
          endValue: reactData.endValue
        }, evnt);
      }
    },
    handleStartMousedownEvent: function handleStartMousedownEvent(evnt) {
      var $xeSlider = this;
      var endBtnElem = $xeSlider.$refs.refEndBtnElem;
      var startBtnElem = evnt.currentTarget;
      $xeSlider.handleMousedownEvent(evnt, endBtnElem ? endBtnElem.offsetLeft < startBtnElem.offsetLeft : false);
    },
    handleEndMousedownEvent: function handleEndMousedownEvent(evnt) {
      var $xeSlider = this;
      var startBtnElem = $xeSlider.$refs.refStartBtnElem;
      var endBtnElem = evnt.currentTarget;
      $xeSlider.handleMousedownEvent(evnt, startBtnElem ? endBtnElem.offsetLeft > startBtnElem.offsetLeft : true);
    },
    //
    // Render
    //
    renderVN: function renderVN(h) {
      var $xeSlider = this;
      var props = $xeSlider;
      var vertical = props.vertical,
        range = props.range;
      var vSize = $xeSlider.computeSize;
      var formReadonly = $xeSlider.computeFormReadonly;
      var isDisabled = $xeSlider.computeIsDisabled;
      return h('div', {
        ref: 'refElem',
        class: ['vxe-slider', _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--vertical', vertical), 'is--readonly', formReadonly), 'is--disabled', isDisabled)]
      }, [h('div', {
        class: 'vxe-slider--inner'
      }, [h('div', {
        ref: 'refBarElem',
        class: 'vxe-slider--bar-wrapper'
      }), h('div', {
        ref: 'refTrackElem',
        class: 'vxe-slider--bar-track'
      }), formReadonly || !range ? (0, _ui.renderEmptyElement)($xeSlider) : h('div', {
        ref: 'refStartBtnElem',
        class: 'vxe-slider--bar-btn vxe-slider--start-btn',
        on: {
          mousedown: $xeSlider.handleStartMousedownEvent
        }
      }), formReadonly ? (0, _ui.renderEmptyElement)($xeSlider) : h('div', {
        ref: 'refEndBtnElem',
        class: 'vxe-slider--bar-btn vxe-slider--end-btn',
        on: {
          mousedown: $xeSlider.handleEndMousedownEvent
        }
      })])]);
    }
  },
  watch: {
    value: function value() {
      var $xeSlider = this;
      $xeSlider.updateModel();
    }
  },
  created: function created() {
    var $xeSlider = this;
    $xeSlider.updateModel();
  },
  mounted: function mounted() {
    var $xeSlider = this;
    $xeSlider.updateBarStyle();
  },
  render: function render(h) {
    return this.renderVN(h);
  }
});
/* define-vxe-component end */