更改1234567

src/views/enterprise/login/registerPage.vue

@@ -10,9 +10,13 @@
         +86
         <input style="border:none;width: 94%;height:30px;font-size: 15px;outline: none" name="phone" type="text" placeholder="请输入注册手机号">
       </div>
-      <div style="border-bottom:1px solid black ;width: 80%;margin-top: 5%" >
-        <input style="border:none;width: 80%;height:30px;font-size: 15px;outline: none" name="text" type="text" placeholder="请输入6位验证码">
-        <el-button type="text" style="width: 20%;height: 30px ;padding-left: 40px;color:#b3b3b3 ">获取验证码</el-button>
+      <div style="border-bottom:1px solid black ;width: 80%;margin-top: 5%">
+        <input style="border:none;width: 80%;height:30px;font-size: 15px;outline: none" name="text" type="text" placeholder="请输入 6 位验证码" />
+        <el-button
+          type="text"
+          :style="{ width: '20%', height: '30px', paddingLeft: buttonPaddingLeft, color: buttonColor }"
+          @click="startCountdown"
+        >{{ buttonText }}</el-button>
       </div>
       <div style="border-bottom:1px solid black ;width: 80%;margin-top: 6%">
         <input
@@ -42,6 +46,11 @@ export default {
   components: {Index},
   data() {
     return {
+      countdown: 60,
+      isCountingDown: false,
+      buttonText: '获取验证码',
+      buttonColor: '#b3b3b3',
+      buttonPaddingLeft: '40px',
       showPassword: false,
       hiddenImagePath: require('../login/img/眼睛_闭.png'), // 替换为你的隐藏密码状态图片路径
       visibleImagePath: require('../login/img/发现-眼睛.png'), // 替换为你的显示密码状态图片路径
@@ -61,6 +70,27 @@ export default {
       imgElement.src = this.showPassword? this.visibleImagePath : this.hiddenImagePath;
       imgElement.dataset.showPassword = this.showPassword.toString();
     },
+    startCountdown() {
+      if (!this.isCountingDown) {
+        this.isCountingDown = true;
+        this.buttonText = `重新获取（${this.countdown}s）`;
+        this.buttonColor = '#b3b3b3';
+        this.buttonPaddingLeft = '10px';
+        const countdownInterval = setInterval(() => {
+          if (this.countdown > 0) {
+            this.countdown--;
+            this.buttonText = `重新获取（${this.countdown}s）`;
+          } else {
+            clearInterval(countdownInterval);
+            this.isCountingDown = false;
+            this.countdown = 60;
+            this.buttonText = '获取验证码';
+            this.buttonColor = '#b3b3b3';
+            this.buttonPaddingLeft = '40px';
+          }
+        }, 1000);
+      }
+    },
   },
 }
 </script>