@senntyou/mint-ui/es/components/Picker.js

mint-ui extensions

import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";

/* script */
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//

/* eslint-disable prefer-destructuring */
import { makePickerSlots } from '../util';
var __vue_script__ = {
  name: 'StMtPicker',
  props: {
    value: {
      type: Boolean,
      required: !0,
      "default": !1
    },
    items: {
      type: Array,
      required: !0,
      "default": function _default() {
        return [];
      }
    },
    onSubmit: {
      type: Function,
      required: !0,
      "default": function _default() {}
    },
    onCancel: {
      type: Function,
      required: !1,
      "default": function _default() {}
    },
    okText: {
      type: String,
      required: !1,
      "default": 'OK'
    },
    cancelText: {
      type: String,
      required: !1,
      "default": 'Cancel'
    },
    divider: {
      type: Boolean,
      required: !1,
      "default": !1
    },
    visibleItemsCount: {
      type: Number,
      required: !1,
      "default": 5
    }
  },
  data: function data() {
    return {
      result: [],
      visible: false,
      slots: [],
      // picker instance
      picker: undefined
    };
  },
  watch: {
    visible: function visible(val) {
      this.$emit('input', val);
    },
    value: function value(val) {
      this.visible = val;
    },
    items: function items() {
      this.makeSlots();
    }
  },
  created: function created() {
    this.makeSlots();
  },
  methods: {
    makeSlots: function makeSlots() {
      var _makePickerSlots = makePickerSlots({
        items: this.items,
        divider: this.divider
      }),
          slots = _makePickerSlots.slots,
          initResult = _makePickerSlots.initResult;

      this.slots = slots;
      this.result = initResult;

      if (this.picker) {
        if (initResult[0]) this.picker.setSlotValue(0, initResult[0]);
        if (initResult[1]) this.picker.setSlotValue(1, initResult[1]);
        if (initResult[2]) this.picker.setSlotValue(2, initResult[2]);
      }
    },
    onChange: function onChange(picker, values) {
      if (!this.picker) this.picker = picker; // first value changed

      if (values[0] !== this.result[0]) {
        var _makePickerSlots2 = makePickerSlots({
          items: this.items,
          divider: this.divider,
          firstValue: values[0]
        }),
            valuesCollection = _makePickerSlots2.valuesCollection,
            initResult = _makePickerSlots2.initResult;

        if (valuesCollection[1]) {
          picker.setSlotValues(1, valuesCollection[1]);
          picker.setSlotValue(1, initResult[1]);
          this.result[1] = initResult[1];
        }

        if (valuesCollection[2]) {
          picker.setSlotValues(2, valuesCollection[2]);
          picker.setSlotValue(2, initResult[2]);
          this.result[2] = initResult[2];
        }
      } // second value changed
      else if (values[1] !== this.result[1]) {
          var _makePickerSlots3 = makePickerSlots({
            items: this.items,
            divider: this.divider,
            firstValue: values[0],
            secondValue: values[1]
          }),
              _valuesCollection = _makePickerSlots3.valuesCollection,
              _initResult = _makePickerSlots3.initResult;

          if (_valuesCollection[2]) {
            picker.setSlotValues(2, _valuesCollection[2]);
            picker.setSlotValue(2, _initResult[2]);
            this.result[2] = _initResult[2];
          }
        }

      this.result = _toConsumableArray(values);
    },
    submit: function submit() {
      this.visible = !1;
      this.onSubmit(_toConsumableArray(this.result));
    },
    cancel: function cancel() {
      this.visible = !1;
      if (this.onCancel) this.onCancel();
    }
  }
};
/* template */

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c("div", {
    staticClass: "st-mt-picker"
  }, [_c("mt-popup", {
    staticClass: "c-mint-popup",
    attrs: {
      position: "bottom"
    },
    model: {
      value: _vm.visible,
      callback: function callback($$v) {
        _vm.visible = $$v;
      },
      expression: "visible"
    }
  }, [_c("div", {
    staticClass: "picker-toolbar"
  }, [_c("span", {
    staticClass: "mint-datetime-action mint-datetime-cancel",
    on: {
      click: _vm.cancel
    }
  }, [_vm._v(_vm._s(_vm.cancelText))]), _vm._v(" "), _c("span", {
    staticClass: "mint-datetime-action mint-datetime-confirm",
    on: {
      click: _vm.submit
    }
  }, [_vm._v(_vm._s(_vm.okText))])]), _vm._v(" "), _c("mt-picker", {
    attrs: {
      slots: _vm.slots,
      "visible-item-count": _vm.visibleItemsCount
    },
    on: {
      change: _vm.onChange
    }
  })], 1)], 1);
};

var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

var __vue_scope_id__ = undefined;
/* module identifier */

var __vue_module_identifier__ = undefined;
/* functional template */

var __vue_is_functional_template__ = false;
/* component normalizer */

function __vue_normalize__(template, style, script, scope, functional, moduleIdentifier, createInjector, createInjectorSSR) {
  var component = (typeof script === 'function' ? script.options : script) || {}; // For security concerns, we use only base name in production mode.

  component.__file = "src/components/Picker.vue";

  if (!component.render) {
    component.render = template.render;
    component.staticRenderFns = template.staticRenderFns;
    component._compiled = true;
    if (functional) component.functional = true;
  }

  component._scopeId = scope;

  if (false) {
    var hook;

    if (false) {
      // In SSR.
      hook = function hook(context) {
        // 2.3 injection
        context = context || // cached call
        this.$vnode && this.$vnode.ssrContext || // stateful
        this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext; // functional
        // 2.2 with runInNewContext: true

        if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
          context = __VUE_SSR_CONTEXT__;
        } // inject component styles


        if (style) {
          style.call(this, createInjectorSSR(context));
        } // register component module identifier for async chunk inference


        if (context && context._registeredComponents) {
          context._registeredComponents.add(moduleIdentifier);
        }
      }; // used by ssr in case component is cached and beforeCreate
      // never gets called


      component._ssrRegister = hook;
    } else if (style) {
      hook = function hook(context) {
        style.call(this, createInjector(context));
      };
    }

    if (hook !== undefined) {
      if (component.functional) {
        // register for functional component in vue file
        var originalRender = component.render;

        component.render = function renderWithStyleInjection(h, context) {
          hook.call(context);
          return originalRender(h, context);
        };
      } else {
        // inject component registration as beforeCreate hook
        var existing = component.beforeCreate;
        component.beforeCreate = existing ? [].concat(existing, hook) : [hook];
      }
    }
  }

  return component;
}
/* style inject */

/* style inject SSR */


export default __vue_normalize__({
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined);