zhc077
/
hnjd_comp
forked from wangjiadong/comp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改登录样式

Browse Source
main
JayChou 4 months ago
parent 2f2e9e3fc8
commit a5e604cf7c
4 changed files with 65 additions and 34 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      jeecgboot-vue3-master/src/assets/loginmini/style/home.less
  2. 3
      jeecgboot-vue3-master/src/locales/lang/zh-CN/sys.ts
  3. 4
      jeecgboot-vue3-master/src/views/system/loginmini/MiniLogin.vue
  4. 88
      jeecgboot-vue3-master/src/views/system/loginmini/MiniRegister.vue

4
jeecgboot-vue3-master/src/assets/loginmini/style/home.less
Unescape View File

@ -30,13 +30,15 @@
}
.aui-image {
padding: 180px 80px;
flex-basis: 60%;
-webkit-flex-basis: 60%;
background-color: #0198cd;
//background-image: url(../icon/jeecg_ad.png);
background-image: url(/resource/img/comp/comp_ad.png);
background-size: cover;
background-size: contain;
background-position: center;
}
.aui-image-text {

3
jeecgboot-vue3-master/src/locales/lang/zh-CN/sys.ts
Unescape View File

@ -91,7 +91,8 @@ export default {
mobilePlaceholder: '请输入手机号码',
policyPlaceholder: '勾选后才能注册',
diffPwd: '两次输入密码不一致',
name:'姓名',
department:'部门',
userName: '账号',
password: '密码',
inputCode: '验证码',

4
jeecgboot-vue3-master/src/views/system/loginmini/MiniLogin.vue
Unescape View File

@ -39,9 +39,9 @@
<div class="aui-flex-box" :class="activeIndex === 'accountLogin' ? 'activeNav on' : ''" @click="loginClick('accountLogin')"
>{{ t('sys.login.signInFormTitle') }}
</div>
<div class="aui-flex-box" :class="activeIndex === 'phoneLogin' ? 'activeNav on' : ''" @click="loginClick('phoneLogin')"
<!-- <div class="aui-flex-box" :class="activeIndex === 'phoneLogin' ? 'activeNav on' : ''" @click="loginClick('phoneLogin')"
>{{ t('sys.login.mobileSignInFormTitle') }}
</div>
</div> -->
</div>
<div class="aui-form-box" style="height: 180px">
<a-form ref="loginRef" :model="formData" v-if="activeIndex === 'accountLogin'" @keyup.enter.native="loginHandleClick">

88
jeecgboot-vue3-master/src/views/system/loginmini/MiniRegister.vue
Unescape View File

@ -11,47 +11,71 @@
<div class="aui-formWell">
<a-form ref="formRef" :model="formData">
<div class="aui-flex aui-form-nav aui-clear-left" style="padding-bottom: 21px">
<div class="aui-flex-box activeNav on">{{t('sys.login.signUpFormTitle')}}</div>
<div class="aui-flex-box activeNav on">{{ t('sys.login.signUpFormTitle') }}</div>
</div>
<div class="aui-form-box">
<div class="aui-account aui-account-line">
<a-form-item>
<div class="aui-input-line">
<Icon class="aui-icon" icon="ant-design:user-outlined"/>
<Icon class="aui-icon" icon="ant-design:user-outlined" />
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.userName')" v-model:value="formData.username" />
</div>
</a-form-item>
<a-form-item>
<div class="aui-input-line">
<Icon class="aui-icon" icon="ant-design:mobile-outlined"/>
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.mobile')" v-model:value="formData.mobile" />
<Icon class="aui-icon" icon="ant-design:mobile-outlined" />
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.name')" v-model:value="formData.name" />
</div>
</a-form-item>
<a-form-item>
<div class="aui-input-line">
<Icon class="aui-icon" icon="ant-design:mobile-outlined" />
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.department')" v-model:value="formData.department" />
<!-- <DeptSelectModal rowKey="id" @register="registerSelModal" @getSelectResult="onSelectOk"/> -->
</div>
</a-form-item>
<a-form-item>
<div class="aui-input-line">
<Icon class="aui-icon" icon="ant-design:mobile-outlined" />
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.name')" v-model:value="formData.name" />
</div>
</a-form-item>
<!-- <a-form-item>
<div class="aui-input-line">
<Icon class="aui-icon" icon="ant-design:mail-outlined"/>
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.smsCode')" v-model:value="formData.smscode" />
<div v-if="showInterval" class="aui-code-line" @click="getLoginCode">{{t('component.countdown.normalText')}}</div>
<div v-else class="aui-code-line">{{t('component.countdown.sendText',[unref(timeRuning)])}}</div>
</div>
</a-form-item>
</a-form-item> -->
<a-form-item>
<div class="aui-input-line">
<Icon class="aui-icon" icon="ant-design:lock-outlined"/>
<a-input class="fix-auto-fill" :type="pwdIndex==='close'?'password':'text'" :placeholder="t('sys.login.password')" v-model:value="formData.password" />
<Icon class="aui-icon" icon="ant-design:lock-outlined" />
<a-input
class="fix-auto-fill"
:type="pwdIndex === 'close' ? 'password' : 'text'"
:placeholder="t('sys.login.password')"
v-model:value="formData.password"
/>
<div class="aui-eye">
<img :src="eyeKImg" alt="开启" v-if="pwdIndex==='open'" @click="pwdClick('close')" />
<img :src="eyeGImg" alt="关闭" v-else-if="pwdIndex==='close'" @click="pwdClick('open')" />
<img :src="eyeKImg" alt="开启" v-if="pwdIndex === 'open'" @click="pwdClick('close')" />
<img :src="eyeGImg" alt="关闭" v-else-if="pwdIndex === 'close'" @click="pwdClick('open')" />
</div>
</div>
</a-form-item>
<a-form-item>
<div class="aui-input-line">
<Icon class="aui-icon" icon="ant-design:lock-outlined"/>
<a-input class="fix-auto-fill" :type="confirmPwdIndex==='close'?'password':'text'" :placeholder="t('sys.login.confirmPassword')" v-model:value="formData.confirmPassword" />
<Icon class="aui-icon" icon="ant-design:lock-outlined" />
<a-input
class="fix-auto-fill"
:type="confirmPwdIndex === 'close' ? 'password' : 'text'"
:placeholder="t('sys.login.confirmPassword')"
v-model:value="formData.confirmPassword"
/>
<div class="aui-eye">
<img :src="eyeKImg" alt="开启" v-if="confirmPwdIndex==='open'" @click="confirmPwdClick('close')" />
<img :src="eyeGImg" alt="关闭" v-else-if="confirmPwdIndex==='close'" @click="confirmPwdClick('open')" />
<img :src="eyeKImg" alt="开启" v-if="confirmPwdIndex === 'open'" @click="confirmPwdClick('close')" />
<img :src="eyeGImg" alt="关闭" v-else-if="confirmPwdIndex === 'close'" @click="confirmPwdClick('open')" />
</div>
</div>
</a-form-item>
@ -59,8 +83,8 @@
<div class="aui-flex">
<div class="aui-flex-box">
<div class="aui-choice">
<a-checkbox v-model:checked="formData.policy" />
<span style="color: #1b90ff;margin-left: 4px">{{ t('sys.login.policy') }}</span>
<a-checkbox v-model:checked="formData.policy" />
<span style="color: #1b90ff; margin-left: 4px">{{ t('sys.login.policy') }}</span>
</div>
</div>
</div>
@ -92,7 +116,7 @@
import jeecgAdTextImg from '/@/assets/loginmini/icon/jeecg_ad_text.png';
import eyeKImg from '/@/assets/loginmini/icon/icon-eye-k.png';
import eyeGImg from '/@/assets/loginmini/icon/icon-eye-g.png';
import { useI18n } from "/@/hooks/web/useI18n";
import { useI18n } from '/@/hooks/web/useI18n';
const { t } = useI18n();
const { notification, createErrorModal, createMessage } = useMessage();
@ -105,7 +129,11 @@
password: '',
confirmPassword: '',
policy: false,
name: '',
department: '',
});
// 选择部门
//是否显示获取验证码
const showInterval = ref<boolean>(true);
//60s
@ -177,7 +205,7 @@
createMessage.warn(t('sys.login.diffPwd'));
return;
}
if(!formData.policy){
if (!formData.policy) {
createMessage.warn(t('sys.login.policyPlaceholder'));
return;
}
@ -224,8 +252,8 @@
* 初始化表单
*/
function initForm() {
Object.assign(formData,{username:'',mobile: '', smscode: '', password: '', confirmPassword: '', policy: false})
if(!unref(timer)){
Object.assign(formData, { username: '', mobile: '', smscode: '', password: '', confirmPassword: '', policy: false });
if (!unref(timer)) {
showInterval.value = true;
clearInterval(unref(timer));
timer.value = null;
@ -250,17 +278,17 @@
}
defineExpose({
initForm
})
initForm,
});
</script>
<style lang="less" scoped>
@import '/@/assets/loginmini/style/home.less';
@import '/@/assets/loginmini/style/base.less';
.aui-input-line .aui-icon{
position: absolute;
z-index: 2;
top: 10px;
left: 10px;
font-size: 20px !important;
}
@import '/@/assets/loginmini/style/home.less';
@import '/@/assets/loginmini/style/base.less';
.aui-input-line .aui-icon {
position: absolute;
z-index: 2;
top: 10px;
left: 10px;
font-size: 20px !important;
}
</style>

Write Preview
Loading…
Cancel
Save