<template>
  <el-input
    v-model.number="minute"
    @change="watchMinute"
    @input="watchMinute"
    :maxlength="6"
  >
    <template slot="append">分钟</template>
  </el-input>
</template>

<script>
import { isFinite } from "lodash-es";
export default {
  name: "MinuteInput",
  props: {
    value: { type: Number, default: 0 },
  },
  data() {
    return {
      minute: 0,
    };
  },
  watch: {
    value: {
      immediate: true,
      handler(v) {
        if (isFinite(v)) {
          this.minute = v / 60;
        } else {
          this.minute = 0;
        }
      },
    },
  },
  methods: {
    watchMinute() {
      // 负数要用blur
      // if (this.minute === "-" || this.minute === "") {
      //   return;
      // }
      this.minute = +this.minute;
      let v = this.minute * 60;
      // console.log(v, isFinite(v));
      if (!isFinite(v)) {
        v = 0;
        this.minute = 0;
      }
      this.$emit("change", v);
      this.$emit("input", v);
    },
  },
};
</script>

<style></style>
