布局修改 部分bug修复
This commit is contained in:
X1627315083
@@ -46,7 +46,7 @@
|
||||
:class="{ active: emailStap === 2 }"
|
||||
>
|
||||
<div v-show="emailStap === 2" class="email_last_step">
|
||||
<div class="email_last_step_block">
|
||||
<!-- <div class="email_last_step_block">
|
||||
<span class="email_last_step_content"
|
||||
>Verify using a one-time verification code</span
|
||||
>
|
||||
@@ -54,10 +54,10 @@
|
||||
class="fi fi-br-cross email_last_step_block_icon"
|
||||
@click="emailLastStepFun()"
|
||||
></i>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="email_last_step_bottom">
|
||||
<div class="email_last_step_des">
|
||||
<div class="sent_email_content">Sent to {{ email }}</div>
|
||||
<div class="sent_email_content">Enter Code</div>
|
||||
<div class="tip_content">
|
||||
<span v-show="time">{{ time }}s</span>
|
||||
<span v-show="!time" @click="emailNextStepFun()"
|
||||
@@ -65,29 +65,44 @@
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<VerificationCodeInput
|
||||
:ct="emailCode"
|
||||
@sendCaptcha="submitEmailLogin($event)"
|
||||
></VerificationCodeInput>
|
||||
|
||||
<div class="email_last_step_des">
|
||||
<div class="sent_email_content email_tip_content">
|
||||
Please check the junk box if you haven't received
|
||||
verification code
|
||||
</div>
|
||||
</div>
|
||||
<div class="codeEmail">We’ve sent an code to your email <span>{{ email }}</span></div>
|
||||
<div class="codeEmailInput">
|
||||
<VerificationCodeInput
|
||||
:ct="emailCode"
|
||||
@sendCaptcha="submitEmailLogin($event)"
|
||||
></VerificationCodeInput>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="login_text" v-show="emailStap !== 2">
|
||||
|
||||
<div class="login_form_title marign_top30">
|
||||
<div class="forget_password_text" @click="changeIsLogin(2)">
|
||||
Forgot your password
|
||||
</div>
|
||||
</div>
|
||||
<div class="login_form_title marign_top40">
|
||||
<label :class="{ active: emailStap == 2 }">
|
||||
<input :state="emailStap" type="checkbox" v-model="checked" />
|
||||
<span>I agree to the Terms, Privacy Policy, and Fees.</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="thirdPartyLogin marign_top30">
|
||||
|
||||
<div
|
||||
class="login_submit_button"
|
||||
:state="emailStap"
|
||||
@click="submitPerLogin()"
|
||||
>
|
||||
Sign in
|
||||
</div>
|
||||
<div class="NewAccount" @click="newAccount()">Create New Account</div>
|
||||
<div class="segmentation">
|
||||
<div class="wire"></div>
|
||||
<div class="text">or</div>
|
||||
<div class="wire"></div>
|
||||
</div>
|
||||
<div class="thirdPartyLogin marign_top30">
|
||||
<div class="label">
|
||||
<div
|
||||
class="mask"
|
||||
@@ -106,19 +121,7 @@
|
||||
</div>
|
||||
<!-- <phoneLogin></phoneLogin> -->
|
||||
</div>
|
||||
<div
|
||||
class="login_submit_button marign_top40"
|
||||
:state="emailStap"
|
||||
@click="submitPerLogin()"
|
||||
>
|
||||
Sign in
|
||||
</div>
|
||||
|
||||
<div class="login_text">
|
||||
<div class="forget_password_text" @click="changeIsLogin(2)">
|
||||
Forgot your password
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- 账号密码登录 end -->
|
||||
</div>
|
||||
@@ -245,6 +248,7 @@ import { useStore } from "vuex";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { setLang } from "@/tool/guide";
|
||||
import md5 from "md5";
|
||||
import router from "@/router";
|
||||
export default defineComponent({
|
||||
components: {
|
||||
VerificationCodeInput,
|
||||
@@ -254,14 +258,21 @@ export default defineComponent({
|
||||
},
|
||||
setup() {
|
||||
let timer: any = 0;
|
||||
let router = useRouter()
|
||||
|
||||
const { locale } = useI18n();
|
||||
const store = useStore();
|
||||
let loadingShow = ref(false);
|
||||
const newAccount = ()=>{
|
||||
// router.spuh({path:'/register'})
|
||||
router.push({path:'/register'})
|
||||
}
|
||||
return {
|
||||
store,
|
||||
timer,
|
||||
locale,
|
||||
loadingShow,
|
||||
newAccount,
|
||||
};
|
||||
},
|
||||
data() {
|
||||
@@ -332,7 +343,7 @@ export default defineComponent({
|
||||
//邮箱登录的上一步
|
||||
emailLastStepFun() {
|
||||
this.emailStap = 1;
|
||||
(this.username = ""), (this.password = ""), (this.email = "");
|
||||
// (this.username = ""), (this.password = ""), (this.email = "");
|
||||
(this.checked = false),
|
||||
(this.loginType = "username"),
|
||||
(this.emailCode = ["", "", "", "", "", ""]),
|
||||
@@ -509,7 +520,7 @@ export default defineComponent({
|
||||
}
|
||||
this.createTimer();
|
||||
let isTest = rv.systemUser == 3 ? true : false;
|
||||
let isBeginner = rv.isBeginner == 1 ? true : false;
|
||||
let isBeginner = rv?.isBeginner == 1 ? true : false;
|
||||
let token = rv.token;
|
||||
setCookie("isMurmur", false);
|
||||
setCookie("token", token);
|
||||
@@ -635,7 +646,7 @@ export default defineComponent({
|
||||
background: #fff;
|
||||
transform: scale(0);
|
||||
transition: 0.3s all;
|
||||
border: 2px solid;
|
||||
// border: 2px solid;
|
||||
border-radius: 20px;
|
||||
.email_last_step {
|
||||
width: 100%;
|
||||
@@ -650,9 +661,9 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
.login_form_title {
|
||||
font-size: 1.6rem;
|
||||
font-size: 1.8rem;
|
||||
// color: #666666;
|
||||
font-weight: 900;
|
||||
font-weight: 500;
|
||||
color: #000;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@@ -662,7 +673,7 @@ export default defineComponent({
|
||||
span {
|
||||
font-size: 1.6rem;
|
||||
margin-left: 10px;
|
||||
font-weight: normal;
|
||||
font-weight: 500;
|
||||
}
|
||||
&.active {
|
||||
pointer-events: none;
|
||||
@@ -690,24 +701,23 @@ export default defineComponent({
|
||||
position: absolute;
|
||||
font-size: 2.4rem;
|
||||
right: 2rem;
|
||||
top: 1.7rem;
|
||||
top: 3.3rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.login_form_input {
|
||||
width: 100%;
|
||||
height: 5rem;
|
||||
margin-top: 1rem;
|
||||
border: .1rem solid #000;
|
||||
background: transparent;
|
||||
border-radius: 2.5rem;
|
||||
padding-left: 2.1rem;
|
||||
line-height: 5rem;
|
||||
font-size: 1.4rem;
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
transition: all 0.3s;
|
||||
width: 100%;
|
||||
height: 6.75rem;
|
||||
margin-top: 2rem;
|
||||
border: 0.1rem solid #dfdfdf;
|
||||
border-radius: 4.2rem;
|
||||
padding-left: 2.1rem;
|
||||
line-height: 5rem;
|
||||
font-size: 1.6rem;
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
transition: all .3s;
|
||||
&:hover {
|
||||
border: .1rem solid #000;
|
||||
}
|
||||
@@ -719,12 +729,10 @@ export default defineComponent({
|
||||
|
||||
.email_last_step {
|
||||
// margin-top: 4rem;
|
||||
.email_last_step_bottom {
|
||||
padding: 0 40px;
|
||||
}
|
||||
|
||||
.email_last_step_block {
|
||||
padding: 10px;
|
||||
border-bottom: 2px solid;
|
||||
// border-bottom: 2px solid;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -752,16 +760,19 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
.login_submit_button {
|
||||
height: 5rem;
|
||||
height: 6.3rem;
|
||||
background: #000;
|
||||
border-radius: 2.5rem;
|
||||
line-height: 5rem;
|
||||
border-radius: 4rem;
|
||||
line-height: 6.3rem;
|
||||
text-align: center;
|
||||
font-size: 1.8rem;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
margin-top: 5rem;
|
||||
font-weight: 600;
|
||||
|
||||
&:hover {
|
||||
background: #3c3c3c;
|
||||
}
|
||||
@@ -769,9 +780,36 @@ export default defineComponent({
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
.NewAccount{
|
||||
font-size: 1.6rem;
|
||||
text-decoration: underline;
|
||||
font-weight: 500;
|
||||
margin-top: 1.2rem;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
.segmentation{
|
||||
margin-top: 4rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
> .wire{
|
||||
width: 30rem;
|
||||
height: 0.1rem;
|
||||
background: #dfdfdf;
|
||||
}
|
||||
> .text{
|
||||
font-weight: 400;
|
||||
font-size: 1.6rem;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
}
|
||||
.login_text {
|
||||
font-size: 1.6rem;
|
||||
margin-top: 4rem;
|
||||
margin-top: 1.2rem;
|
||||
font-weight: 500;
|
||||
text-decoration: underline;
|
||||
color: #151515;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
@@ -787,7 +825,7 @@ export default defineComponent({
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 60rem;
|
||||
width: 77rem;
|
||||
background: #ffffff;
|
||||
box-shadow: -0.3rem 2rem 5.9rem 0px rgba(200, 200, 200, 0.3);
|
||||
border-radius: 1rem;
|
||||
@@ -796,6 +834,7 @@ export default defineComponent({
|
||||
|
||||
.forget_password_content_block {
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.fi-br-arrow-left {
|
||||
@@ -904,7 +943,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
.marign_top30 {
|
||||
margin-top: 3rem;
|
||||
margin-top: 2.7rem;
|
||||
}
|
||||
.marign_top40 {
|
||||
margin-top: 4rem;
|
||||
@@ -915,6 +954,10 @@ export default defineComponent({
|
||||
> div {
|
||||
position: relative;
|
||||
margin-right: 1rem;
|
||||
width: 50%;
|
||||
&:last-child{
|
||||
margin: 0;
|
||||
}
|
||||
> .mask {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
@@ -932,23 +975,31 @@ export default defineComponent({
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.codeEmail{
|
||||
font-weight: 400;
|
||||
font-size: 2rem;
|
||||
color: #a5b0c2;
|
||||
text-align: left;
|
||||
span{
|
||||
font-family: 'pingfang_regular';
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
.codeEmailInput{
|
||||
margin: 4.8rem auto;
|
||||
width: 61rem;
|
||||
padding: 1.2rem;
|
||||
}
|
||||
.email_last_step_des {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 4rem;
|
||||
margin-bottom: 2rem;
|
||||
margin-top: 2.4rem;
|
||||
margin-bottom: 1.4rem;
|
||||
|
||||
.sent_email_content {
|
||||
font-size: 1.8rem;
|
||||
font-weight: bold;
|
||||
color: #a5b0c2;
|
||||
}
|
||||
|
||||
.email_tip_content {
|
||||
font-size: 1.4rem;
|
||||
color: #030303;
|
||||
font-size: 3.8rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user