<template>
  <el-input v-model.number="minute" @change="watchMinute" @input="watchMinute">
    <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() {
      let v = this.minute * 60;
      if (!isFinite(v)) {
        v = 0;
        this.minute = 0;
      }
      this.$emit("change", v);
      this.$emit("input", v);
    },
  },
};
</script>

<style></style>
