From cfce577132832b5291c5bd3b171d7f4397d44643 Mon Sep 17 00:00:00 2001 From: 819527061@qq.com <123456> Date: 星期二, 14 五月 2024 17:06:53 +0800 Subject: [PATCH] docs:参数加密 --- src/views/login.vue | 191 ++++++++++++++++++++++++++++++----------------- 1 files changed, 121 insertions(+), 70 deletions(-) diff --git a/src/views/login.vue b/src/views/login.vue index bc0cce4..7d02bb2 100644 --- a/src/views/login.vue +++ b/src/views/login.vue @@ -10,7 +10,12 @@ <Col class="content"> <div> <Header /> - <div v-if="!socialLogining"> + <div class="login-main-box" v-if="!socialLogining"> + <div class="login-img"> + <img src="../assets/img/login-mmain-left-bj.jpg" alt=""> + </div> + <div class="login-form"> + <div class="login-form-inside"> <Form ref="usernameLoginForm" :model="form" @@ -18,6 +23,10 @@ class="form" v-if="tabName == 'username'" > + <FormItem> + <!--<h1 style="margin-left: 40%;">鐧� 褰�</h1>--> + <h1>瀹夊叏閰嶉�佺鐞嗙郴缁�</h1> + </FormItem> <FormItem prop="username"> <Input v-model="form.username" @@ -39,72 +48,76 @@ autocomplete="off" /> </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>--> + <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">--> - <!--<Checkbox v-model="saveLogin" size="large">{{--> + <!--<Row justify="space-between" align="middle">--> + <!--<Checkbox v-model="saveLogin" size="large">{{--> <!--$t("autoLogin")--> <!--}}</Checkbox>--> - <!--<Dropdown trigger="click" @on-click="handleDropDown">--> + <!--<Dropdown trigger="click" @on-click="handleDropDown">--> <!--<a class="forget-pass">{{ $t("forgetPass") }}</a>--> <!--<DropdownMenu slot="list">--> - <!--<DropdownItem name="test">浣撻獙娴嬭瘯璐﹀彿</DropdownItem>--> - <!--<DropdownItem name="resetByMobile"--> - <!-->浣跨敤鎵嬫満鍙烽噸缃瘑鐮�(浠樿垂)</DropdownItem--> - <!-->--> - <!--<DropdownItem name="resetByEmail"--> - <!-->浣跨敤閭閲嶇疆瀵嗙爜(浠樿垂)</DropdownItem--> - <!-->--> + <!--<DropdownItem name="test">浣撻獙娴嬭瘯璐﹀彿</DropdownItem>--> + <!--<DropdownItem name="resetByMobile"--> + <!-->浣跨敤鎵嬫満鍙烽噸缃瘑鐮�(浠樿垂)</DropdownItem--> + <!-->--> + <!--<DropdownItem name="resetByEmail"--> + <!-->浣跨敤閭閲嶇疆瀵嗙爜(浠樿垂)</DropdownItem--> + <!-->--> <!--</DropdownMenu>--> - <!--</Dropdown>--> - <!--</Row>--> - <Button - class="login-btn" - type="primary" - size="large" - :loading="loading" - @click="submitLogin" - long - > - <span v-if="!loading">{{ $t("login") }}</span> - <span v-else>{{ $t("logining") }}</span> - </Button> + <!--</Dropdown>--> + <!--</Row>--> + <Button + class="login-btn" + type="primary" + size="large" + :loading="loading" + @click="submitLogin" + long + > + <span v-if="!loading">{{ $t("login") }}</span> + <span v-else>{{ $t("logining") }}</span> + </Button> + </div> + + </div> </div> + <div v-if="socialLogining"> <RectLoading /> </div> </div> <!--<Footer />--> </Col> - <LangSwitch /> + <!--<LangSwitch />--> </Row> </div> <!--<div>--> @@ -121,6 +134,7 @@ <!--</VueFurcateTree>--> <!--</div>--> + </template> @@ -190,7 +204,9 @@ ] } ], + sessionStorage: null, showMore: false, + code:"", captchaId: "", captchaImg: "", loadingCaptcha: true, @@ -207,6 +223,7 @@ password: "", code: "", }, + showChangePass: false, }; }, methods: { @@ -215,7 +232,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 +257,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,10 +303,15 @@ }, 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, - password: this.form.password, + password: btoa(this.form.password), code: this.form.imgCode, captchaId: this.captchaId, saveLogin: this.saveLogin, @@ -394,14 +418,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,20 +502,47 @@ }); }, test() { - this.$Notice.info({ - title: "娴嬭瘯浣撻獙璐﹀彿", - desc: "璐﹀彿锛歵est鎴杢est2<br>瀵嗙爜锛�123456", - }); + // this.$Notice.info({ + // title: "娴嬭瘯浣撻獙璐﹀彿", + // desc: "璐﹀彿锛歵est鎴杢est2<br>瀵嗙爜锛�123456", + // }); }, }, mounted() { //this.showNotice(); this.relatedLogin(); - //this.getCaptchaImg(); + this.getCaptchaImg(); + }, }; </script> <style lang="less"> + .login-main-box{ + .ivu-form-item{ + margin-bottom: 2vw; + &:first-child{ + margin-bottom: 4vw; + } + } + .ivu-form-item-content{ + h1{ + font-size: 1.5vw; + text-align: center; + } + } + .ivu-input-large{ + height: 2vw; + } + .ivu-input-wrapper-large .ivu-input-prefix i, .ivu-input-wrapper-large .ivu-input-suffix i{ + line-height: 2vw; + } + .ivu-input{ + border: 1px solid #aaaaaa; + } + } + +</style> +<style lang="less"> @import "./login.less"; </style> -- Gitblit v1.9.1