Browse Source

Merge pull request #795 from flipped-aurora/update

调整验证码校验规则保证前后端配置一致 #794
main
奇淼(piexlmax 3 years ago
committed by GitHub
parent
commit
1844d13bdd
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 5
      server/api/v1/system/sys_captcha.go
  2. 5
      server/model/system/response/sys_captcha.go
  3. 128
      web/src/style/login.scss
  4. 30
      web/src/view/login/index.vue

5
server/api/v1/system/sys_captcha.go

@ -34,8 +34,9 @@ func (b *BaseApi) Captcha(c *gin.Context) {
response.FailWithMessage("验证码获取失败", c)
} else {
response.OkWithDetailed(systemRes.SysCaptchaResponse{
CaptchaId: id,
PicPath: b64s,
CaptchaId: id,
PicPath: b64s,
CaptchaLength: global.GVA_CONFIG.Captcha.KeyLong,
}, "验证码获取成功", c)
}
}

5
server/model/system/response/sys_captcha.go

@ -1,6 +1,7 @@
package response
type SysCaptchaResponse struct {
CaptchaId string `json:"captchaId"`
PicPath string `json:"picPath"`
CaptchaId string `json:"captchaId"`
PicPath string `json:"picPath"`
CaptchaLength int `json:"captchaLength""`
}

128
web/src/style/login.scss

@ -1,128 +0,0 @@
.login-register-box {
height: 100vh;
.login-box {
width: 40vw;
position: absolute;
left: 50%;
margin-left: -22vw;
top: 5vh;
.logo {
height: 35vh;
width: 35vh;
}
}
}
.link-icon {
width: 20px;
min-width: 20px;
height: 20px;
border-radius: 10px;
}
.vPic {
width: 33%;
height: 38px;
float: right !important;
background: #ccc;
img {
cursor: pointer;
vertical-align: middle;
}
}
.logo_login {
width: 100px;
}
#userLayout.user-layout-wrapper {
height: 100%;
position: relative;
&.mobile {
.container {
.main {
max-width: 368px;
width: 98%;
}
}
}
.container {
position: relative;
overflow: auto;
width: 100%;
min-height: 100%;
background: #f0f2f5 url(@/assets/background.svg) no-repeat 50%;
background-size: 100%;
padding: 110px 0 144px;
a {
text-decoration: none;
}
.top {
text-align: center;
margin-top: -40px;
.header {
height: 44px;
line-height: 44px;
margin-bottom: 30px;
.badge {
position: absolute;
display: inline-block;
line-height: 1;
vertical-align: middle;
margin-left: -12px;
margin-top: -10px;
opacity: 0.8;
}
.logo {
height: 44px;
vertical-align: top;
margin-right: 16px;
border-style: none;
}
.title {
font-size: 33px;
color: rgba(0, 0, 0, 0.85);
font-family: Avenir, "Helvetica Neue", Arial, Helvetica, sans-serif;
font-weight: 600;
position: relative;
top: 2px;
}
}
.desc {
font-size: 14px;
color: rgba(0, 0, 0, 0.45);
margin-top: 12px;
}
}
.main {
min-width: 260px;
width: 368px;
margin: 0 auto;
}
.footer {
position: relative;
width: 100%;
padding: 0 20px;
margin: 40px 0 10px;
text-align: center;
.links {
margin-bottom: 8px;
font-size: 14px;
width: 330px;
display: inline-flex;
flex-direction: row;
justify-content: space-between;
padding-right: 40px;
a {
color: rgba(0, 0, 0, 0.45);
transition: all 0.3s;
}
}
.copyright {
color: rgba(0, 0, 0, 0.45);
font-size: 14px;
padding-right: 40px;
}
}
}
}

30
web/src/view/login/index.vue

@ -7,7 +7,7 @@
class="login_panle_form_title_logo"
:src="$GIN_VUE_ADMIN.appLogo"
alt
/>
>
<p class="login_panle_form_title_p">{{ $GIN_VUE_ADMIN.appName }}</p>
</div>
<el-form
@ -50,19 +50,20 @@
:src="picPath"
alt="请输入验证码"
@click="loginVerify()"
/>
>
</div>
</el-form-item>
<el-form-item>
<el-button type="primary" style="width: 46%" @click="checkInit"
>前往初始化</el-button
>
<el-button
type="primary"
style="width: 46%"
@click="checkInit"
>前往初始化</el-button>
<el-button
type="primary"
style="width: 46%; margin-left: 8%"
@click="submitForm"
> </el-button
>
> </el-button>
</el-form-item>
</el-form>
</div>
@ -70,16 +71,16 @@
<div class="login_panle_foot">
<div class="links">
<a href="http://doc.henrongyi.top/">
<img src="@/assets/docs.png" class="link-icon" />
<img src="@/assets/docs.png" class="link-icon">
</a>
<a href="https://www.yuque.com/flipped-aurora/">
<img src="@/assets/yuque.png" class="link-icon" />
<img src="@/assets/yuque.png" class="link-icon">
</a>
<a href="https://github.com/flipped-aurora/gin-vue-admin">
<img src="@/assets/github.png" class="link-icon" />
<img src="@/assets/github.png" class="link-icon">
</a>
<a href="https://space.bilibili.com/322210472">
<img src="@/assets/video.png" class="link-icon" />
<img src="@/assets/video.png" class="link-icon">
</a>
</div>
<div class="copyright">
@ -124,8 +125,6 @@ export default {
password: [{ validator: checkPassword, trigger: 'blur' }],
captcha: [{ required: true, message: '请输入验证码', trigger: 'blur' },
{
min: 5,
max: 6,
message: '验证码格式不正确',
trigger: 'blur',
}]
@ -180,6 +179,8 @@ export default {
},
loginVerify() {
captcha({}).then((ele) => {
this.rules.captcha[1].max = ele.data.captchaLength
this.rules.captcha[1].min = ele.data.captchaLength
this.picPath = ele.data.picPath
this.loginForm.captchaId = ele.data.captchaId
})
@ -189,9 +190,6 @@ export default {
</script>
<style lang="scss" scoped>
@import "@/style/newLogin.scss";
</style>
Loading…
Cancel
Save