保存进度！

企业级管理系统/前端/admin_system/src/views/account/Login.vue

@@ -2,8 +2,8 @@
  * @Author: Kane
  * @Date: 2022-12-14 15:23:54
  * @LastEditors: Kane
- * @LastEditTime: 2022-12-14 18:04:50
- * @FilePath: \admin_system\src\views\account\login.vue
+ * @LastEditTime: 2022-12-14 21:23:51
+ * @FilePath: \admin_system\src\views\account\Login.vue
  * @Description: 
  * 
  * Copyright (c) ${2022} by Kane, All Rights Reserved. 
@@ -12,8 +12,10 @@
   <div id="login">
     <div class="form-warp">
       <ul class="menu-tab">
-        <li class="current">登录</li>
-        <li>注册</li>
+        <li :class="{ 'current': current_menu === item.type }" @click="onToggleMenu(item.type)" v-for="item in tab_menu"
+          :key="item.type">{{ item.label
+          }}
+        </li>
       </ul>
       <el-form ref="form" :model="form">
         <el-form-item>
@@ -26,7 +28,7 @@
         </el-form-item>
         <el-form-item>
           <label class="form-label">验证码</label>
-          <el-row :gutter="30">
+          <el-row :gutter="10">
             <el-col :span="14">
               <el-input type="text"></el-input>
             </el-col>
@@ -44,6 +46,8 @@
 </template>
 
 <script>
+// import { ref } from "vue";
+
 export default {
   name: "loginPage",
   data() {
@@ -51,9 +55,19 @@ export default {
       loginForm: {
         username: "",
         password: "",
-      }
+      },
+      tab_menu: [
+        { type: "login", label: "登录" },
+        { type: "regiester", label: "注册" },
+      ],
+      current_menu: "login",
     }
-  }
+  },
+  methods: {
+    onToggleMenu(type) {
+      this.current_menu = type;
+    }
+  },
 };
 </script>