"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
;/* empty css                                               */
;/* empty css                                                */
;/* empty css                                               */
;/* empty css                                                  */
;/* empty css                                                */
;/* empty css                                                  */
;/* empty css                                                 */
;/* empty css                                                */
;/* empty css                                                     */
;/* empty css                                               */
;/* empty css                                              */
;/* empty css                                                 */
;/* empty css                                                       */
const Vue = require("vue");
const index = require("../field/index.js");
const moment = require("../../../../node_modules/moment/dist/moment.js");
const dateUtil = require("../../../utils/dateUtil.js");
const index$2 = require("../../../../node_modules/vant/es/time-picker/index.js");
const index$1 = require("../../../../node_modules/vant/es/popup/index.js");
const index$3 = require("../../../../node_modules/vant/es/icon/index.js");
const _sfc_main = {
  __name: "FieldTimePicker",
  props: {
    modelValue: {
      type: String,
      default: ""
    },
    // textFormat: {
    //   type: String,
    //   default: "HH:mm:ss",
    // },
    // valueFormat: {
    //   type: String,
    //   default: "HH:mm:ss",
    // },
    timeTextFormat: {
      //0:HH:mm:ss;1: HH时mm分ss秒
      type: String,
      default: "0"
    },
    timeColumnsType: {
      type: String,
      default: "hour,minute"
      // default: ["hour", "minute", "second"],
    },
    disabled: {
      type: Boolean,
      default: false
    },
    readonly: {
      type: Boolean,
      default: false
    },
    "is-link": false
  },
  emits: ["update:modelValue"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const fieldTextValue = Vue.ref("");
    const showPicker = Vue.ref(false);
    const emit = __emit;
    let textFormat = dateUtil.parseTimeFormatter(
      props.timeTextFormat,
      props.timeColumnsType
    );
    let valueFormat = dateUtil.parseTimeFormatter("0", props.timeColumnsType);
    const pickerValue = Vue.computed(() => {
      let date;
      if (!props.modelValue) {
        date = moment.default();
      } else {
        date = moment.default(props.modelValue, props.valueFormat);
      }
      const hours = date.hours();
      const minutes = date.minutes();
      const seconds = date.seconds();
      let value = [];
      const columnsTypeArr = props.timeColumnsType.split(",");
      if (columnsTypeArr.length == 1) {
        value = [hours];
      } else if (columnsTypeArr.length == 2) {
        value = [hours, minutes];
      } else if (columnsTypeArr.length == 3) {
        value = [hours, minutes, seconds];
      }
      return value;
    });
    const columnsType = Vue.computed(() => {
      return props.timeColumnsType.split(",");
    });
    const formatter = (type, option) => {
      console.log(type);
      if (type === "hour") {
        option.text += "时";
      } else if (type === "minute") {
        option.text += "分";
      } else if (type === "second") {
        option.text += "秒";
      }
      return option;
    };
    Vue.watch(
      () => props.modelValue,
      (value) => {
        if (!value) {
          fieldTextValue.value = "";
          return;
        }
        fieldTextValue.value = moment.default(value, valueFormat).format(textFormat);
      },
      { immediate: true }
    );
    const onConfirm = ({ selectedValues, selectedOptions, selectedIndexes }) => {
      const val = moment.default(
        `${selectedValues[0]}${selectedValues[1]}${selectedValues[2]}`,
        "HH:mm:ss"
      ).format(valueFormat);
      emit("update:modelValue", val);
      showPicker.value = false;
    };
    return (_ctx, _cache) => {
      const _component_van_icon = index$3.Icon;
      const _component_van_time_picker = index$2.TimePicker;
      const _component_van_popup = index$1.Popup;
      return Vue.openBlock(), Vue.createBlock(Vue.unref(index.MobileField), Vue.mergeProps(_ctx.$attrs, {
        modelValue: Vue.unref(fieldTextValue),
        "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => Vue.isRef(fieldTextValue) ? fieldTextValue.value = $event : null),
        isLink: __props.readonly || __props.disabled ? false : true,
        readonly: "",
        disabled: __props.disabled,
        onOpenPicker: _cache[5] || (_cache[5] = () => {
          if (!__props.readonly) {
            showPicker.value = true;
          }
        })
      }), Vue.createSlots({
        default: Vue.withCtx(() => [
          Vue.createVNode(_component_van_popup, {
            show: Vue.unref(showPicker),
            "onUpdate:show": _cache[3] || (_cache[3] = ($event) => Vue.isRef(showPicker) ? showPicker.value = $event : null),
            "destroy-on-close": "",
            position: "bottom",
            teleport: "body"
          }, {
            default: Vue.withCtx(() => [
              Vue.createVNode(_component_van_time_picker, Vue.mergeProps(_ctx.$attrs, {
                modelValue: Vue.unref(pickerValue),
                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => Vue.isRef(pickerValue) ? pickerValue.value = $event : null),
                readonly: false,
                columnsType: Vue.unref(columnsType),
                formatter,
                onConfirm,
                onCancel: _cache[2] || (_cache[2] = ($event) => showPicker.value = false)
              }), null, 16, ["modelValue", "columnsType"])
            ]),
            _: 1
          }, 8, ["show"])
        ]),
        _: 2
      }, [
        !__props.readonly && !__props.disabled && Vue.unref(fieldTextValue) ? {
          name: "right-icon",
          fn: Vue.withCtx(() => [
            Vue.createVNode(_component_van_icon, {
              name: "clear",
              class: "custom-close-icon",
              onClick: _cache[0] || (_cache[0] = Vue.withModifiers(($event) => emit("update:modelValue", null), ["stop"]))
            })
          ]),
          key: "0"
        } : void 0
      ]), 1040, ["modelValue", "isLink", "disabled"]);
    };
  }
};
exports.default = _sfc_main;
