<template>
  <div class="login-code">
    <el-button
      class="x_btns login-code-img"
      size="medium"
      type="primary"
      style="width: 100%"
      @click.prevent="getCode"
      :disabled="isDisabled"
    >
      <span>{{ buttonName }}</span>
    </el-button>
  </div>
</template>

<script setup>
const disabled = ref(true);
const buttonName = ref("获取验证码");
const isDisabled = ref(false);
const time = ref(60);
function getCode() {
  isDisabled.value = true;
  let interval = setInterval(function () {
    buttonName.value = time.value + "后重新发送";
    --time.value;
    if (time.value < 0) {
      buttonName.value = "重新发送";
      time.value = 60;
      isDisabled.value = false;
      clearInterval(interval);
    }
  }, 1000);
  console.log(66666);
  // getCodeImg().then((res) => {
  //   captchaOnOff.value =
  //     res.captchaOnOff === undefined ? true : res.captchaOnOff;
  //   if (captchaOnOff.value) {
  //     codeUrl.value = "data:image/gif;base64," + res.img;
  //     loginForm.value.mode = res.mode;
  //   }
  // });
}
</script>

<style lang="scss" scoped>
.login-code {
  width: 30%;
  height: 38px;
  float: right;
  img {
    cursor: pointer;
    vertical-align: middle;
  }
}
.login-code-img {
  height: 36px;
}
</style>