gitee
/
snowy
mirror of https://gitee.com/xiaonuobase/snowy
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

【优化】优化登录页面以及账户绑定等页面在小屏幕下的展示效果

dev
xuyuxiang 2025-09-18 00:28:52 +08:00
parent 3744162982
commit 96e496009c
6 changed files with 18 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
snowy-admin-web/src/views/auth/findPwd/emailFindForm.vue
View File

@ -9,7 +9,7 @@
</a-form-item>
<a-form-item name="emailValidCode">
<a-row :gutter="8">
<a-col :span="17">
<a-col :span="14">
<a-input
v-model:value="emailFormData.emailValidCode"
:placeholder="$t('login.emailCodePlaceholder')"
@ -20,7 +20,7 @@
</template>
</a-input>
</a-col>
<a-col :span="7">
<a-col :span="10">
<a-button size="large" class="xn-wd" @click="getEmailValidCode" :disabled="state.smsSendBtn">{{
(!state.smsSendBtn && $t('login.getSmsCode')) || state.time + ' s'
}}</a-button>
@ -42,10 +42,10 @@
<a-form-item>
<a-row :gutter="8">
<a-col :span="7">
<a-col :span="12">
<a-button class="xn-wd" round size="large" href="/login">{{ $t('login.backLogin') }}</a-button>
</a-col>
<a-col :span="17">
<a-col :span="12">
<a-button type="primary" class="xn-wd" :loading="islogin" round size="large" @click="submitReset">{{
$t('login.restPassword')
}}</a-button>

9
snowy-admin-web/src/views/auth/findPwd/index.vue
View File

@ -227,12 +227,7 @@
text-align: center;
margin-bottom: 6px;
}
@media (max-width: 1200px) {
.login-form {
width: 340px;
}
}
@media (max-width: 1000px) {
@media (max-width: 768px) {
.login_main {
width: 100%;
position: absolute;
@ -244,8 +239,6 @@
}
.login-form {
width: 100%;
padding: 20px 40px;
top: 15%;
}
.login_background .version {
padding: 0 20px;

8
snowy-admin-web/src/views/auth/findPwd/phoneFindForm.vue
View File

@ -9,7 +9,7 @@
</a-form-item>
<a-form-item name="phoneValidCode">
<a-row :gutter="8">
<a-col :span="17">
<a-col :span="14">
<a-input
v-model:value="phoneFormData.phoneValidCode"
:placeholder="$t('login.smsCodePlaceholder')"
@ -20,7 +20,7 @@
</template>
</a-input>
</a-col>
<a-col :span="7">
<a-col :span="10">
<a-button size="large" class="xn-wd" @click="getPhoneValidCode" :disabled="state.smsSendBtn">{{
(!state.smsSendBtn && $t('login.getSmsCode')) || state.time + ' s'
}}</a-button>
@ -42,10 +42,10 @@
<a-form-item>
<a-row :gutter="8">
<a-col :span="7">
<a-col :span="12">
<a-button class="xn-wd" round size="large" href="/login">{{ $t('login.backLogin') }}</a-button>
</a-col>
<a-col :span="17">
<a-col :span="12">
<a-button type="primary" class="xn-wd" :loading="islogin" round size="large" @click="submitReset">{{
$t('login.restPassword')
}}</a-button>

9
snowy-admin-web/src/views/auth/login/login.less
View File

@ -149,12 +149,7 @@
text-align: center;
margin-bottom:6px;
}
@media (max-width: 1200px) {
.login-form {
width: 340px;
}
}
@media (max-width: 1000px) {
@media (max-width: 768px) {
.login_main {
width: 100%;
position: absolute;
@ -163,8 +158,6 @@
}
.login-form {
width: 100%;
padding: 20px 40px;
top:15%
}
.logo_background{
padding-left:40px;

8
snowy-admin-web/src/views/sys/user/userTab/bindForm/bindEmail.vue
View File

@ -150,20 +150,20 @@
</Form.Item>
<Form.Item name="validCode">
<a-row :gutter="8">
<a-col :span="16">
<a-col :span="14">
<Input v-model:value="formState.validCode" placeholder="请输入图片验证码" />
</a-col>
<a-col :span="8">
<a-col :span="10">
<img v-if="captchaImage" :src="captchaImage" class="captcha-image" @click="getCaptcha" />
</a-col>
</a-row>
</Form.Item>
<Form.Item name="emailValidCode">
<a-row :gutter="8">
<a-col :span="16">
<a-col :span="14">
<Input v-model:value="formState.emailValidCode" placeholder="请输入邮箱验证码" />
</a-col>
<a-col :span="8">
<a-col :span="10">
<Button :loading="captchaLoading" @click="getEmailValidCode" style="width: 100%" :disabled="state.sendBtn">
{{ (!state.sendBtn && '获取验证码') || state.time + ' s' }}
</Button>

8
snowy-admin-web/src/views/sys/user/userTab/bindForm/bindPhone.vue
View File

@ -152,20 +152,20 @@
</Form.Item>
<Form.Item name="validCode">
<a-row :gutter="8">
<a-col :span="16">
<a-col :span="14">
<Input v-model:value="formState.validCode" placeholder="请输入图片验证码" />
</a-col>
<a-col :span="8">
<a-col :span="10">
<img v-if="captchaImage" :src="captchaImage" class="captcha-image" @click="getCaptcha" />
</a-col>
</a-row>
</Form.Item>
<Form.Item name="phoneValidCode">
<a-row :gutter="8">
<a-col :span="16">
<a-col :span="14">
<Input v-model:value="formState.phoneValidCode" placeholder="请输入短信验证码" />
</a-col>
<a-col :span="8">
<a-col :span="10">
<Button :loading="captchaLoading" @click="getPhoneValidCode" style="width: 100%" :disabled="state.sendBtn">
{{ (!state.sendBtn && '获取验证码') || state.time + ' s' }}
</Button>