Browse Source

Merge branch 'ch/need_pool233' of hongze/hongze_yb_pc into debug

leichen 7 months ago
parent
commit
1d4e1ade92
3 changed files with 42 additions and 17 deletions
  1. 1 1
      src/App.vue
  2. 39 14
      src/components/LoginPop.vue
  3. 2 2
      src/views/report/Index.vue

+ 1 - 1
src/App.vue

@@ -1,5 +1,5 @@
 <script setup>
-import zhCn from 'element-plus/lib/locale/lang/zh-cn'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 </script>
 
 <template>

+ 39 - 14
src/components/LoginPop.vue

@@ -47,6 +47,9 @@ const typeChange=(e)=>{
     isSendCode.value=false
 }
 
+// 登录验证码增加倒计时
+let remainingTime = ref(0); // 剩余时间,单位为秒
+
 //发送验证码
 
 let isSendCode=ref(false)//是否已发送验证码
@@ -70,11 +73,18 @@ const handleSendCode=async (type)=>{
         res=await apiGetEmailCode({email: form.email})
     }
     if(res.code===200){
-        isSendCode.value=true
-        ElMessage.success('验证码已发送')
-        sendCodeInterval=setTimeout(() => {
-            isSendCode.value=false
-        }, 60000);
+        isSendCode.value = true;
+        remainingTime.value = 60; // 设置初始倒计时为60秒
+        const timer = setInterval(() => {
+            if (remainingTime.value > 1) {
+                remainingTime.value--;
+            } else {
+                clearInterval(timer);
+                isSendCode.value = false;
+                remainingTime.value = 0; // 重置剩余时间
+            }
+        }, 1000); // 每秒减少一次剩余时间
+        ElMessage.success('验证码已发送');
     }
 }
 
@@ -98,11 +108,18 @@ const handlePCSendCode=async (type)=>{
         res=await apiGetPCEmailCode({email: form.email})
     }
     if(res.code===200){
-        isSendCode.value=true
-        ElMessage.success('验证码已发送')
-        sendCodeInterval=setTimeout(() => {
-            isSendCode.value=false
-        }, 60000);
+        isSendCode.value = true;
+        remainingTime.value = 60; // 设置初始倒计时为60秒
+        const timer = setInterval(() => {
+            if (remainingTime.value > 1) {
+                remainingTime.value--;
+            } else {
+                clearInterval(timer);
+                isSendCode.value = false;
+                remainingTime.value = 0; // 重置剩余时间
+            }
+        }, 1000); // 每秒减少一次剩余时间
+        ElMessage.success('验证码已发送');
     }
 }
 
@@ -231,7 +248,9 @@ onMounted(()=>{
                     </div>
                     <div class="input-item">
                         <input v-model="form.code" placeholder="请输入验证码" />
-                        <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handlePCSendCode('phone')">{{isSendCode?'已发送':'发送验证码'}}</span>
+                        <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handlePCSendCode('phone')">
+                            {{ isSendCode ? `${remainingTime}秒后重新发送` : '发送验证码' }}
+                        </span>
                     </div>
                     <div class="global-main-btn login-btn" @click="handleLogin('phone')">登录</div>
                     <div style="display:flex;justify-content: space-around;">
@@ -253,7 +272,9 @@ onMounted(()=>{
                     </div>
                     <div class="input-item">
                         <input v-model="form.code" placeholder="请输入验证码" />
-                        <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handlePCSendCode('email')">{{isSendCode?'已发送':'发送验证码'}}</span>
+                        <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handlePCSendCode('email')">
+                            {{ isSendCode ? `${remainingTime}秒后重新发送` : '发送验证码' }}
+                        </span>
                     </div>
                     <div class="global-main-btn login-btn" @click="handleLogin('email')">登录</div>
 
@@ -302,7 +323,9 @@ onMounted(()=>{
                 </div>
                 <div class="input-item">
                     <input v-model="form.code" placeholder="请输入验证码" />
-                    <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handleSendCode('phone')">{{isSendCode?'已发送':'发送验证码'}}</span>
+                    <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handleSendCode('phone')">
+                        {{ isSendCode ? `${remainingTime}秒后重新发送` : '发送验证码' }}
+                    </span>
                 </div>
                 <div class="global-main-btn login-btn" @click="handleBind('phone')">登录</div>
                 <div class="bot-img">
@@ -318,7 +341,9 @@ onMounted(()=>{
                 </div>
                 <div class="input-item">
                     <input v-model="form.code" placeholder="请输入验证码" />
-                    <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handleSendCode('email')">{{isSendCode?'已发送':'发送验证码'}}</span>
+                    <span :class="['send-code-btn',isSendCode&&'send-code-disabled']" @click="handleSendCode('email')">
+                        {{ isSendCode ? `${remainingTime}秒后重新发送` : '发送验证码' }}
+                    </span>
                 </div>
                 <div class="global-main-btn login-btn" @click="handleBind('email')">登录</div>
                 <div class="bot-img">

+ 2 - 2
src/views/report/Index.vue

@@ -742,12 +742,12 @@ onActivated(()=>{
             margin-top: 10px;
             color: #666666;
             font-size: 14px;
+            word-wrap: break-word;
+            word-break: break-all;
             :deep(div){
               word-wrap: break-word;
               word-break: break-all;
             }
-            word-wrap: break-word;
-            word-break: break-all;
           }
 
           .tags {