/**
 * tdesign v0.39.1-alpha.1
 * (c) 2022 tdesign
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var utils_mixins = require('../utils/mixins.js');
var configProvider_configReceiver = require('../config-provider/config-receiver.js');
var timePicker_constant = require('./constant.js');
var timePicker_interface = require('./interface.js');
var config = require('../config.js');
require('vue');
require('@babel/runtime/helpers/defineProperty');
require('lodash/mergeWith');
require('../config-provider/context.js');
require('lodash/merge');
require('../_common/js/global-config/default-config.js');
require('../_common/js/global-config/locale/zh_CN.js');

var name = "".concat(config.prefix, "-time-picker-input-items");
var InputItems = utils_mixins["default"](configProvider_configReceiver["default"]("timePicker")).extend({
  name: name,
  data: function data() {
    return {
      timeArr: [timePicker_interface.EPickerCols.hour, timePicker_interface.EPickerCols.minute, timePicker_interface.EPickerCols.second]
    };
  },
  props: {
    format: {
      type: String
    },
    dayjs: {
      type: [Object, Array, void 0],
      "default": void 0
    },
    placeholder: {
      type: String
    },
    allowInput: {
      type: Boolean
    },
    isRangePicker: {
      type: Boolean,
      "default": false
    },
    disabled: {
      type: Boolean
    },
    steps: {
      type: Array
    }
  },
  computed: {
    displayTimeList: function displayTimeList() {
      return this.isRangePicker ? this.dayjs : [this.dayjs];
    }
  },
  methods: {
    onInput: function onInput(e, type, index) {
      if (!this.allowInput) return;
      var target = e.target,
          data = e.data;
      var value = target.value;
      var _this$$props = this.$props,
          format = _this$$props.format,
          steps = _this$$props.steps;
      var curDayJs = this.displayTimeList[index];
      var number = Number(value);
      var colIdx = this.timeArr.indexOf(type);

      if (number % steps[colIdx]) {
        number = 0;
      }

      if (curDayJs[type] === "00" && number === 0 || value === "") {
        this.$emit("change", {
          value: timePicker_constant.EMPTY_VALUE,
          type: type,
          index: index
        });
      } else if ("".concat(number).length > 2) {
        number = Number(data);
      }

      var emitChange = true;

      if (!isNaN(number)) {
        switch (type) {
          case "hour":
            if (number > (/[h]{1}/.test(format) ? 12 : 24) || number < 0) {
              emitChange = false;
            }

            break;

          case "minute":
            if (number > 59 || number < 0) {
              emitChange = false;
            }

            break;

          case "second":
            if (number > 59 || number < 0) {
              emitChange = false;
            }

            break;
        }

        if (emitChange) {
          this.$emit("change", {
            value: number,
            type: type,
            index: index
          });
        }
      }

      if (curDayJs[type] !== void 0) this.setInputValue(curDayJs[type], target);
    },
    onBlur: function onBlur(e, trigger, index, input) {
      this.allowInput && this.$emit("blurDefault", e, trigger, index, input);
    },
    onFocus: function onFocus(e, trigger, index, input) {
      this.allowInput && this.$emit("focusDefault", e, trigger, index, input);
    },
    onKeydown: function onKeydown(e, type, index) {
      if (!this.allowInput) return;
      var which = e.which;
      var _this$$props2 = this.$props,
          format = _this$$props2.format,
          steps = _this$$props2.steps;
      var curDayJs = this.displayTimeList[index];
      var colIdx = this.timeArr.indexOf(type);

      if ([timePicker_interface.KeyboardDirection.up, timePicker_interface.KeyboardDirection.down].includes(which)) {
        if (type === timePicker_interface.EPickerCols.meridiem) return;
        var current = curDayJs[type] ? Number(curDayJs[type]) : 0;
        var operateStep = Number(steps[colIdx]);
        var operate = which === timePicker_interface.KeyboardDirection.up ? 0 - operateStep : operateStep;
        var result = current + operate;

        if (type === "hour") {
          if (result > (/[h]{1}/.test(format) ? 11 : 23)) {
            result = 0;
          } else if (result < 0) {
            result = /[h]{1}/.test(format) ? 11 : 23;
          }
        } else if (result > 59 || result < 0) {
          result = 0;
        }

        this.$emit("change", {
          value: result,
          type: type,
          index: index
        });
      } else if ([timePicker_interface.KeyboardDirection.left, timePicker_interface.KeyboardDirection.right].includes(which)) {
        var target = e.target;
        var parentNode = target.parentNode;
        var focus = which === timePicker_interface.KeyboardDirection.left ? parentNode.previousSibling : parentNode.nextSibling;

        if (focus) {
          var input = focus.querySelector("input");
          if (!input.focus) return;
          input.focus();
        }
      }
    },
    onToggleMeridiem: function onToggleMeridiem(index) {
      this.$emit("toggleMeridiem", index);
    },
    setInputValue: function setInputValue(v, input) {
      var sV = String(v);

      if (!input) {
        return;
      }

      if (input.value !== sV) {
        Object.assign(input, {
          value: sV
        });
      }
    },
    switchRenderComponent: function switchRenderComponent() {
      var _this = this;

      var h = this.$createElement;
      var _this$$props3 = this.$props,
          format = _this$$props3.format,
          placeholder = _this$$props3.placeholder,
          allowInput = _this$$props3.allowInput,
          disabled = _this$$props3.disabled;

      function isEmptyDayjs(val) {
        return val === void 0 || val.hour === void 0 && val.minute === void 0 && val.second === void 0;
      }

      var isEmptyVal = this.displayTimeList.every(function (date) {
        return isEmptyDayjs(date);
      });

      if (isEmptyVal) {
        return h("span", {
          "class": "".concat(timePicker_constant.componentName, "__input-placeholder")
        }, [placeholder]);
      }

      var itemClasses = disabled ? ["".concat(timePicker_constant.componentName, "__input-item"), "".concat(timePicker_constant.componentName, "__input-item-disabled")] : ["".concat(timePicker_constant.componentName, "__input-item")];
      var inputClass = "".concat(timePicker_constant.componentName, "__input-item-input");
      var render = [];
      this.displayTimeList.forEach(function (inputTime, index) {
        if (index > 0) render.push("-");
        var hour = inputTime.hour,
            minute = inputTime.minute,
            second = inputTime.second;
        render.push(h("span", {
          "class": itemClasses
        }, [h("input", {
          "class": inputClass,
          "domProps": {
            "value": hour
          },
          "attrs": {
            "disabled": !allowInput
          },
          "on": {
            "keydown": function keydown(e) {
              return _this.onKeydown(e, "hour", index);
            },
            "input": function input(e) {
              return _this.onInput(e, "hour", index);
            },
            "blur": function blur(e) {
              return _this.onBlur(e, "hour", index, Number(hour));
            },
            "focus": function focus(e) {
              return _this.onFocus(e, "hour", index, Number(hour));
            }
          }
        })]));

        if (/[hH]{1,2}:m{1,2}/.test(format)) {
          render.push(h("span", {
            "class": itemClasses
          }, [":", h("input", {
            "class": inputClass,
            "domProps": {
              "value": minute
            },
            "attrs": {
              "disabled": !allowInput
            },
            "on": {
              "keydown": function keydown(e) {
                return _this.onKeydown(e, "minute", index);
              },
              "input": function input(e) {
                return _this.onInput(e, "minute", index);
              },
              "blur": function blur(e) {
                return _this.onBlur(e, "minute", index, Number(minute));
              },
              "focus": function focus(e) {
                return _this.onFocus(e, "minute", index, Number(minute));
              }
            }
          })]));

          if (/[hH]{1,2}:m{1,2}:s{1,2}/.test(format)) {
            render.push(h("span", {
              "class": itemClasses
            }, [":", h("input", {
              "class": inputClass,
              "domProps": {
                "value": second
              },
              "attrs": {
                "disabled": !allowInput
              },
              "on": {
                "keydown": function keydown(e) {
                  return _this.onKeydown(e, "second", index);
                },
                "input": function input(e) {
                  return _this.onInput(e, "second", index);
                },
                "blur": function blur(e) {
                  return _this.onBlur(e, "second", index, Number(second));
                },
                "focus": function focus(e) {
                  return _this.onFocus(e, "second", index, Number(second));
                }
              }
            })]));
          }
        }

        if (/[h]{1}/.test(format) && (format.includes("A") || format.includes("a"))) {
          var localeMeridiemList = [_this.global.anteMeridiem, _this.global.postMeridiem];
          var text = localeMeridiemList[timePicker_constant.MERIDIEM_LIST.indexOf(inputTime.meridiem.toUpperCase())];
          render[timePicker_constant.AM_FORMAT.test(format) ? "unshift" : "push"](h("span", {
            "class": itemClasses,
            "on": {
              "click": function click() {
                return allowInput && _this.onToggleMeridiem(index);
              }
            }
          }, [h("input", {
            "attrs": {
              "readonly": true,
              "disabled": !allowInput
            },
            "class": [inputClass, "".concat(inputClass, "-meridiem")],
            "domProps": {
              "value": text
            },
            "on": {
              "keydown": function keydown(e) {
                return _this.onKeydown(e, "meridiem", index);
              }
            }
          })]));
        }
      });
      return render;
    }
  },
  render: function render() {
    var h = arguments[0];
    var classes = ["".concat(timePicker_constant.componentName, "__input")];
    return h("div", {
      "class": classes
    }, [this.switchRenderComponent()]);
  }
});

exports["default"] = InputItems;
//# sourceMappingURL=input-items.js.map
