feat: #登录60秒、分页总数

src/components/BaseTable.vue

@@ -73,7 +73,7 @@
       <el-pagination
         v-if="showPage"
         background
-        layout="prev, pager, next"
+        layout="prev, pager, next, total"
         :current-page="pagination.page"
         :page-size="pagination.pageSize"
         :total="pagination.total"

src/views/login/index.vue

@@ -28,10 +28,10 @@
             slot="suffix"
             class="inline-btn"
             type="primary"
-            :disabled="!validPhone(loginForm.phone)"
-            @click="dialogVisible = true"
+            :disabled="!canBtn"
+            @click="handlerGetCode"
           >
-            获取验证码
+            {{btnTxt}}
           </el-button>
         </el-input>
       </el-form-item>
@@ -88,6 +88,7 @@
 import { validPhone } from '@/utils/validate';
 import { getImgCode, getSMSCode } from '@/api/user';
 
+
 export default {
   name: 'Login',
   data() {
@@ -120,9 +121,27 @@ export default {
 
       dialogVisible: false,
       info: {},
-      point: ''
+      point: '',
+
+      time: 60,
+      timer: null
     };
   },
+
+  computed: {
+    canBtn() {
+      const { time, loginForm}= this
+      let b = validPhone(loginForm.phone) && this.timer === null
+      return b
+    },
+    btnTxt() {
+      if (this.timer !== null) {
+        return `${this.time}秒`
+      }
+      return '获取验证码'
+    }
+  },
+
   watch: {
     $route: {
       handler: function(route) {
@@ -152,7 +171,26 @@ export default {
     }
   },
 
+  beforeDestroy() {
+      if (this.timer) { clearInterval(this.timer); this.timer= null}
+
+    },
+
   methods: {
+    handlerGetCode() {
+      if (this.timer) { clearInterval(this.timer); this.timer= null}
+      this.timer = setInterval(() => {
+        if (this.time > 0) {
+          this.time -= 1;
+        }
+        if (this.time <= 0) {
+          this.time = 60;
+          clearInterval(this.timer);
+          this.timer = null
+        }
+      }, 1000);
+      this.dialogVisible = true
+    },
     handleLogin() {
       this.$refs.loginForm.validate(valid => {
         if (valid) {