feat:记住密码

张含笑

2025-11-07 01ebf3e418fc2278cefd877914c4f23457571609

feat:记住密码

 src/pages/login/index.vue

@@ -6,17 +6,24 @@
        <div class="user-name">
            <image :src="usernameSvg" />
            <input v-model="loginForm.username" placeholder="请输入用户名" />

        </div>
        <div class="pass-word">
            <image :src="passwordSvg" />
            <input v-model="loginForm.password" type="password" placeholder="请输入密码" />
        </div>
        <div class="remember-password">
            <label>
                <checkbox-group @change="toggleRemember">
                    <checkbox :checked="rememberPassword" color="#1D6FE9" style="transform:scale(0.7)" />
                </checkbox-group>
                记住密码
            </label>
        </div>

        <button class="login-btn" :style="[inputStyle]" @tap="submit">
            登录
        </button>

		
        <image class="lowerRightCorner" :src="droneSvg" />
    </view>
</template>
@@ -38,12 +45,14 @@
        LOGIN_PATH,
        removeQueryString
    } from "@/router";
    import { onMounted } from 'vue';

    const userStore = useUserStore();
    const loginForm = ref({
        username: "",
        password: "",
    });
    const rememberPassword = ref(false);
    const inputStyle = computed(() => {
        const style = {};
        if (loginForm.value.username && loginForm.value.password) {
@@ -53,6 +62,9 @@
        return style;
    });
    let redirect = HOME_PATH;
    function toggleRemember(e) {
        rememberPassword.value = e.detail.value.length > 0;
    }

    async function submit() {
        let userInfo = {
@@ -65,6 +77,16 @@
            code: "",
            key: "",
        };

        if (rememberPassword.value) {
            uni.setStorageSync('rememberedUser', {
                username: loginForm.value.username,
                password: loginForm.value.password
            });
        } else {
            uni.removeStorageSync('rememberedUser');
        }
		
        try {
            const res = await loginByUsername(
                userInfo.tenantId,
@@ -87,15 +109,24 @@
                icon: "none",
                duration: 2000
            });

        }
    }

    // 从本地存储加载记住的密码
    onMounted(() => {
        const savedUserInfo = uni.getStorageSync('rememberedUser');
        console.log('记住密码',savedUserInfo)
        if (savedUserInfo) {
            loginForm.value.username = savedUserInfo.username;
            loginForm.value.password = savedUserInfo.password;
            rememberPassword.value = true;
        }
    });
    onLoad((options) => {
        if (options.redirect && removeQueryString(options.redirect) !== LOGIN_PATH) {
            redirect = decodeURIComponent(options.redirect);
        }
    });
	
</script>

<style lang="scss" scoped>
@@ -164,13 +195,24 @@
                color: #E3E3E3;
                font-weight: 500;
            }

            //:deep(.uni-input-input) {
            //  top: 10px !important;
            //}
        }

        .pass-word {}
        .remember-password {
            display: flex;
            justify-content: flex-end;
            align-items: center;
            margin-left: 62rpx;
            margin-right: 58rpx;
            margin-top: 20rpx;
	
            color: #666;
            font-size: 28rpx;
			
            label {
                display: flex;
                align-items: center;
            }
        }

        input {
            @apply pb-6rpx mb-10rpx text-left;
@@ -178,7 +220,6 @@

        .tips {
            @apply mt-8rpx mb-60rpx;

            color: $u-info;
        }

@@ -199,7 +240,6 @@

        .alternative {
            @apply flex justify-between mt-30rpx;

            color: $u-tips-color;
        }
    }
@@ -209,14 +249,12 @@

        .item {
            @apply flex items-center flex-col text-28rpx;

            color: $u-content-color;
        }
    }

    .hint {
        @apply px-40rpx py-20rpx text-24rpx;

        color: $u-tips-color;

        .link {