<template>
  <MegaModal
    class="dia-batch avue-new-table"
    :title="$t('REFRESH_TIME')"
    :visible="show"
    top="50px"
    width="300px"
    @close="handleCancel"
    @cancel="handleCancel"
  >
    <a-form-model ref="form" layout="vertical" :model="form" :rules="rules">
      <a-form-model-item
        :label="$t('BOARD_DATA') + $t('REFRESH_TIME')"
        prop="refreshTime"
      >
        <a-input
          v-model="form.refreshTime"
          :placeholder="`${$t('PLACEENTER')}:${$t('TIME_UNIT')}${$t('SECOND')}`"
          oninput="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}"
        />
      </a-form-model-item>
    </a-form-model>
    <template slot="footer">
      <a-button type="primary" @click="handleConfirm">
        <i class="iconfont icon-baocun"></i> {{ $t("SAVE") }}
      </a-button>
      <a-button @click="handleCancel">
        <i class="iconfont icon-quxiao"></i> {{ $t("CANCEL") }}
      </a-button>
    </template>
  </MegaModal>
</template>

<script>
import { Modal as MegaModal } from "@mega-design/ui-vue";

export default {
  name: "NoData",
  components: {
    MegaModal,
  },
  props: {
    show: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      form: {
        refreshTime: "",
      },
    };
  },
  computed: {
    rules() {
      return {
        refreshTime: [
          {
            required: true,
            message: this.$t("PLACEENTER"),
            trigger: "blur",
          },
        ],
      };
    },
  },
  methods: {
    // 刷新时间-确认
    handleConfirm() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          // this.$message.success(this.$t("EDIT_SUCCESS"));
          this.$refs.form.clearValidate();
          this.$emit("confirm", this.form.refreshTime);
        }
      });
    },
    // 刷新时间-取消
    handleCancel() {
      this.$refs.form.clearValidate();
      this.$emit("close");
    },
  },
};
</script>

<style lang="less" scoped>
.board_empty {
  color: #fff;
}
</style>
