session保存token

kongdeqiang

2023-04-26 cb5c9968b763362d399e1c7fce1129ec7434aba8

 src/views/login.vue

@@ -10,7 +10,7 @@
            <Col class="content">
            <div>
                <Header />
                <div v-if="!socialLogining">
                <div v-if="!socialLogining" style="margin-top: 150px">
                            <Form
                                    ref="usernameLoginForm"
                                    :model="form"
@@ -18,13 +18,16 @@
                                    class="form"
                                    v-if="tabName == 'username'"
                            >
                                <FormItem>
                                    <h1 style="margin-left: 40%;">登&nbsp陆</h1>
                                </FormItem>
                                <FormItem prop="username">
                                    <Input
                                            v-model="form.username"
                                            prefix="ios-contact"
                                            size="large"
                                            clearable
                                            placeholder="账号/邮箱/手机号"
                                            placeholder="账号"
                                            autocomplete="off"
                                    />
                                </FormItem>
@@ -39,34 +42,34 @@
                                            autocomplete="off"
                                    />
                                </FormItem>
                                <!--<FormItem prop="imgCode">-->
                                    <!--<Row-->
                                            <!--type="flex"-->
                                            <!--justify="space-between"-->
                                            <!--style="align-items: center; overflow: hidden"-->
                                    <!--&gt;-->
                                        <!--<Input-->
                                                <!--v-model="form.imgCode"-->
                                                <!--size="large"-->
                                                <!--clearable-->
                                                <!--placeholder="请输入图片验证码"-->
                                                <!--:maxlength="10"-->
                                                <!--class="input-verify"-->
                                        <!--/>-->
                                        <!--<div-->
                                                <!--class="code-image"-->
                                                <!--style="position: relative; font-size: 12px"-->
                                        <!--&gt;-->
                                            <!--<Spin v-if="loadingCaptcha" fix></Spin>-->
                                            <!--<img-->
                                                    <!--:src="captchaImg"-->
                                                    <!--@click="getCaptchaImg"-->
                                                    <!--alt="加载验证码失败"-->
                                                    <!--style="width: 110px; cursor: pointer; display: block"-->
                                            <!--/>-->
                                        <!--</div>-->
                                    <!--</Row>-->
                                <!--</FormItem>-->
                                <FormItem prop="imgCode">
                                    <Row
                                            type="flex"
                                            justify="space-between"
                                            style="align-items: center; overflow: hidden"
                                    >
                                        <Input
                                                v-model="form.imgCode"
                                                size="large"
                                                clearable
                                                placeholder="请输入图片验证码"
                                                :maxlength="10"
                                                class="input-verify"
                                        />
                                        <div
                                                class="code-image"
                                                style="position: relative; font-size: 12px"
                                        >
                                            <Spin v-if="loadingCaptcha" fix></Spin>
                                            <img
                                                    :src="captchaImg"
                                                    @click="getCaptchaImg"
                                                    alt="加载验证码失败"
                                                    style="width: 110px; cursor: pointer; display: block"
                                            />
                                        </div>
                                    </Row>
                                </FormItem>
                            </Form>

                    <!--<Row justify="space-between" align="middle">-->
@@ -121,6 +124,7 @@
    <!--</VueFurcateTree>-->

    <!--</div>-->


</template>

@@ -190,7 +194,9 @@
                        ]
                    }
                ],
                sessionStorage: null,
                showMore: false,
                code:"",
                captchaId: "",
                captchaImg: "",
                loadingCaptcha: true,
@@ -203,10 +209,11 @@
                sending: false,
                errorCode: "",
                form: {
                    username: "admin",
                    password: "123456",
                    username: "",
                    password: "",
                    code: "",
                },
                showChangePass: false,
            };
        },
        methods: {
@@ -215,7 +222,8 @@
                initCaptcha().then((res) => {
                    this.loadingCaptcha = false;
                    if (res.success) {
                        this.captchaId = res.result;
                        this.code = res.result.code;
                        this.captchaId = res.result.captchaId;
                        this.captchaImg = drawCodeImage + this.captchaId;
                    }
                });
@@ -239,14 +247,15 @@
            },
            afterLogin(res) {
                let accessToken = res.result;
                this.setStore("accessToken", accessToken);
                console.log("login_afterLogin()",accessToken)
                this.setSessionStore("accessToken", accessToken);
                getOtherSet().then((res) => {
                    if (res.result) {
                        let domain = res.result.ssoDomain;
                        Cookies.set("accessToken", accessToken, {
                            domain: domain,
                            expires: 7,
                        });
                        // Cookies.set("accessToken", accessToken, {
                        //     domain: domain,
                        //     expires: 7,
                        // });
                    }
                });
                // 获取用户信息
@@ -284,6 +293,11 @@
            },
            submitLogin() {
                if (this.tabName == "username") {
                    if(this.code.toUpperCase()!=this.form.imgCode.toUpperCase()){
                        this.$Message.error("验证码错误");
                        this.getCaptchaImg();
                        return
                    }
                            this.loading = true;
                            login({
                                username: this.form.username,
@@ -394,14 +408,14 @@
                        if (res.success) {
                            this.socialLogining = true;
                            let accessToken = res.result;
                            this.setStore("accessToken", accessToken);
                            this.setSessionStore("accessToken", accessToken);
                            getOtherSet().then((res) => {
                                if (res.result) {
                                    let domain = res.result.ssoDomain;
                                    Cookies.set("accessToken", accessToken, {
                                        domain: domain,
                                        expires: 7,
                                    });
                                    // Cookies.set("accessToken", accessToken, {
                                    //     domain: domain,
                                    //     expires: 7,
                                    // });
                                }
                            });
                            // 获取用户信息
@@ -478,16 +492,17 @@
                });
            },
            test() {
                this.$Notice.info({
                    title: "测试体验账号",
                    desc: "账号：test或test2<br>密码：123456",
                });
                // this.$Notice.info({
                //     title: "测试体验账号",
                //     desc: "账号：test或test2<br>密码：123456",
                // });
            },
        },
        mounted() {
            //this.showNotice();
            this.relatedLogin();
            //this.getCaptchaImg();
            this.getCaptchaImg();

        },
    };
</script>