element-plus/es/components/time-select/src/time-select.mjs.map

A Component Library for Vue 3

{"version":3,"file":"time-select.mjs","sources":["../../../../../../packages/components/time-select/src/time-select.vue"],"sourcesContent":["<template>\n  <el-select\n    ref=\"select\"\n    :model-value=\"value\"\n    :disabled=\"disabled\"\n    :clearable=\"clearable\"\n    :clear-icon=\"clearIcon\"\n    :size=\"size\"\n    :effect=\"effect\"\n    :placeholder=\"placeholder\"\n    default-first-option\n    :filterable=\"editable\"\n    @update:model-value=\"(event) => $emit('update:modelValue', event)\"\n    @change=\"(event) => $emit('change', event)\"\n    @blur=\"(event) => $emit('blur', event)\"\n    @focus=\"(event) => $emit('focus', event)\"\n  >\n    <el-option\n      v-for=\"item in items\"\n      :key=\"item.value\"\n      :label=\"item.value\"\n      :value=\"item.value\"\n      :disabled=\"item.disabled\"\n    />\n    <template #prefix>\n      <el-icon v-if=\"prefixIcon\" class=\"el-input__prefix-icon\">\n        <component :is=\"prefixIcon\" />\n      </el-icon>\n    </template>\n  </el-select>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat'\nimport ElSelect from '@element-plus/components/select'\nimport ElIcon from '@element-plus/components/icon'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\ndayjs.extend(customParseFormat)\n\nconst { Option: ElOption } = ElSelect\n\ninterface Time {\n  hours: number\n  minutes: number\n}\n\nconst parseTime = (time: string): null | Time => {\n  const values = (time || '').split(':')\n  if (values.length >= 2) {\n    let hours = parseInt(values[0], 10)\n    const minutes = parseInt(values[1], 10)\n    const timeUpper = time.toUpperCase()\n    if (timeUpper.includes('AM') && hours === 12) {\n      hours = 0\n    } else if (timeUpper.includes('PM') && hours !== 12) {\n      hours += 12\n    }\n    return {\n      hours,\n      minutes,\n    }\n  }\n  return null\n}\nconst compareTime = (time1: string, time2: string): number => {\n  const value1 = parseTime(time1)\n  const value2 = parseTime(time2)\n  const minutes1 = value1.minutes + value1.hours * 60\n  const minutes2 = value2.minutes + value2.hours * 60\n  if (minutes1 === minutes2) {\n    return 0\n  }\n  return minutes1 > minutes2 ? 1 : -1\n}\nconst padTime = (time: number | string) => {\n  return `${time}`.padStart(2, '0')\n}\nconst formatTime = (time: Time): string => {\n  return `${padTime(time.hours)}:${padTime(time.minutes)}`\n}\nconst nextTime = (time: string, step: string): string => {\n  const timeValue = parseTime(time)\n  const stepValue = parseTime(step)\n  const next = {\n    hours: timeValue.hours,\n    minutes: timeValue.minutes,\n  }\n  next.minutes += stepValue.minutes\n  next.hours += stepValue.hours\n  next.hours += Math.floor(next.minutes / 60)\n  next.minutes = next.minutes % 60\n  return formatTime(next)\n}\n\nexport default defineComponent({\n  name: 'ElTimeSelect',\n  components: { ElSelect, ElOption, ElIcon },\n  model: {\n    prop: 'value',\n    event: 'change',\n  },\n  props: {\n    format: {\n      type: String,\n      default: 'HH:mm',\n    },\n    modelValue: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    editable: {\n      type: Boolean,\n      default: true,\n    },\n    effect: {\n      type: String as PropType<'light' | 'dark' | string>,\n      default: 'light',\n    },\n    clearable: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      default: 'default',\n      validator: (value: string) =>\n        !value || ['large', 'default', 'small'].indexOf(value) !== -1,\n    },\n    placeholder: {\n      type: String,\n      default: '',\n    },\n    start: {\n      type: String,\n      default: '09:00',\n    },\n    end: {\n      type: String,\n      default: '18:00',\n    },\n    step: {\n      type: String,\n      default: '00:30',\n    },\n    minTime: {\n      type: String,\n      default: '',\n    },\n    maxTime: {\n      type: String,\n      default: '',\n    },\n    name: {\n      type: String,\n      default: '',\n    },\n    prefixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: Clock,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n  },\n  emits: ['change', 'blur', 'focus', 'update:modelValue'],\n  setup(props) {\n    // computed\n    const select = ref(null)\n    const value = computed(() => props.modelValue)\n    const start = computed(() => {\n      const time = parseTime(props.start)\n      return formatTime(time)\n    })\n    const end = computed(() => {\n      const time = parseTime(props.end)\n      return formatTime(time)\n    })\n    const step = computed(() => {\n      const time = parseTime(props.step)\n      return formatTime(time)\n    })\n    const minTime = computed(() => {\n      const time = parseTime(props.minTime)\n      return time ? formatTime(time) : null\n    })\n    const maxTime = computed(() => {\n      const time = parseTime(props.maxTime)\n      return time ? formatTime(time) : null\n    })\n    const items = computed(() => {\n      const result = []\n      if (props.start && props.end && props.step) {\n        let current = start.value\n        let currentTime\n        while (compareTime(current, end.value) <= 0) {\n          currentTime = dayjs(current, 'HH:mm').format(props.format)\n          result.push({\n            value: currentTime,\n            disabled:\n              compareTime(current, minTime.value || '-1:-1') <= 0 ||\n              compareTime(current, maxTime.value || '100:100') >= 0,\n          })\n          current = nextTime(current, step.value)\n        }\n      }\n      return result\n    })\n    const blur = () => {\n      select.value?.blur?.()\n    }\n    const focus = () => {\n      select.value?.focus?.()\n    }\n\n    return {\n      select,\n      value,\n      items,\n      blur,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":"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"}