Selaa lähdekoodia

Merge branch 'dev1.1' of https://jygit.jydev.jianyu360.cn/data_processing/spider_creater into dev1.1

小阿七 6 kuukautta sitten
vanhempi
commit
526e3c2f45
1 muutettua tiedostoa jossa 71 lisäystä ja 10 poistoa
  1. 71 10
      frontend/src/views/Login.vue

+ 71 - 10
frontend/src/views/Login.vue

@@ -12,22 +12,22 @@
                     <el-form-item label="密码">
                         <el-input type="password" v-model="form.password" placeholder="请输入密码" @keydown.enter="doLogin"></el-input>
                     </el-form-item>
-                    <el-form-item style="text-align: center;">
-                        <el-button text>
-                            <el-icon><UserFilled /></el-icon>忘记密码
-                        </el-button>
-                        <el-button type="primary" @click="doLogin" :loading="loading">
-                            <el-icon><Lock /></el-icon> 登录
-                        </el-button>
+                    <el-form-item>
+                        <div class="login-line">
+                            <div class="login-placeholder"></div>
+                            <el-button type="primary" @click="doLogin" :loading="loading">
+                                <el-icon><Lock /></el-icon> 登录
+                            </el-button>
+                            <el-checkbox v-model="rememberPwd" label="记住密码" @change="saveRemember" />
+                        </div>
                     </el-form-item>
                 </el-form>
             </el-col>
-            <el-col :span="9"></el-col>
         </el-row>
     </el-card>
 </template>
 <script setup>
-import { ref } from 'vue';
+import { onMounted, ref } from 'vue';
 import Breadcrumb from '../components/Breadcrumb.vue'
 import { useStore } from 'vuex';
 import { useRouter } from 'vue-router';
@@ -38,6 +38,42 @@ const router = useRouter();
 
 const form = ref({})
 const loading = ref(false)
+
+const rememberPwd = ref(false)
+const rememberKey = 'user-remember-pwd'
+
+
+const saveRemember = (e) => {
+    localStorage.setItem(rememberKey, JSON.stringify(rememberPwd.value))
+}
+const restoreRemember = () => {
+    const payload = localStorage.getItem(rememberKey)
+    if (payload) {
+        const p = JSON.parse(payload)
+        rememberPwd.value = p
+    }
+}
+
+const pwdKey = 'user-pwd'
+const savePwd = () => {
+    const payload = {
+        username: form.value.username,
+        password: form.value.password,
+    }
+    localStorage.setItem(pwdKey, JSON.stringify(payload))
+}
+const restorePwd = () => {
+    const payload = localStorage.getItem(pwdKey)
+    if (payload) {
+        const p = JSON.parse(payload)
+        form.value.username = p.username
+        form.value.password = p.password
+    }
+}
+const removePwd = () => {
+    localStorage.removeItem(pwdKey)
+}
+
 //
 const doLogin = async () => {
     if (!form.value.username) {
@@ -59,6 +95,11 @@ const doLogin = async () => {
         const { msg } = await store.dispatch('login', {...form.value});
         loading.value = false
         if (store.state.isAuthenticated) {
+            if (rememberPwd.value) {
+                savePwd()
+            } else {
+                removePwd()
+            }
             // 登录成功。跳转首页
             const path = store.getters.getCurrentMenu[0]?.path
             if (path) {
@@ -86,4 +127,24 @@ const doLogin = async () => {
     }
     
 }
-</script>
+
+restoreRemember()
+
+onMounted(() => {
+    restorePwd()
+})
+</script>
+
+<style scoped lang="scss">
+.login-line {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content:space-between;
+    text-align: center;
+}
+.login-placeholder {
+    width: 72px;
+    height: 0px;
+}
+</style>