fix

2024-12-19 13:47:55 +08:00
parent 4a65772ca9
commit 82836a7b27
9 changed files with 608 additions and 13 deletions
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,5 +7,6 @@
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
+  height: 100%;
 }
 </style>
--- a/src/component/Account/frontPage.vue
+++ b/src/component/Account/frontPage.vue
@@ -50,6 +50,9 @@ export default defineComponent({
 			],
 			loadingShow:false,
 			activeKey: '',
+			userDetail:computed(()=>{
+				return store.state.UserHabit.userDetail
+			})
 		})
 		let domRefs:any = reactive({
 			myInformation:ref(null),
@@ -86,8 +89,13 @@ export default defineComponent({
 		    Https.axiosGet(Https.httpUrls.bindWeChat, {params:data})
                .then((rv) => {
 					accountfrontPage.loadingShow = false
-					console.log(rv);
-					
+					let value = {
+					accountExtendList:{
+							WeChat:rv,
+							Google:accountfrontPage.userDetail.accountExtendList?.Google
+						}
+					}
+				store.commit("upUserDetail", value)
 					router.push({ query: {} });
                })
                .catch((res) => {accountfrontPage.loadingShow = false});
--- a/src/component/Account/frontPage/bindPage.vue
+++ b/src/component/Account/frontPage/bindPage.vue
@@ -76,6 +76,13 @@ export default defineComponent({
 		    Https.axiosGet(Https.httpUrls.bindGoogle, {params:data})
 			.then((rv) => {
 				accountHomeData.loadingShow = false
+				let value = {
+					accountExtendList:{
+						WeChat:accountHomeData.userDetail.accountExtendList?.WeChat,
+						Google:rv,
+						}
+					}
+				store.commit("upUserDetail", value)
 			})
 			.catch((res) => {accountHomeData.loadingShow = false});
 		}
--- a/src/component/HomePage/bindEmail.vue
+++ b/src/component/HomePage/bindEmail.vue
@@ -0,0 +1,562 @@
+<template>
+	<div ref="register"></div>
+	<a-modal
+		class="register generalModel"
+		:get-container="() => $refs.register"
+		v-model:visible="registerModel"
+		:footer="null"
+		:width="pageWidth"
+		height="50rem"
+		:maskClosable="false"
+		:centered="true"
+		:closable="false"
+		:mask="registerModelMask"
+		:keyboard="false"
+		:destroyOnClose="true"
+		:zIndex="9999"
+	>
+		<div class="login_page">
+			<div class="page_content">
+				<!-- 账号密码和邮箱登录  start-->
+				<div class="login_content" >
+					<div class="login_content_left">
+						<div class="login_type_list">
+							<div
+								:class="[
+									'login_type_item','username_login_item',
+									'login_active',
+								]"
+							>
+								Bind Email
+							</div>
+						</div>
+						<!-- 账号密码登录 start -->
+						<!-- v-show="loginType == 'username'" -->
+						<div >
+							<div class="login_form_content" :state="emailStap">
+								<div class="login_form_title marign_top30">Email</div>
+								<input
+									class="login_form_input"
+									placeholder="Enter your email address"
+									v-model="email"
+									@keydown.enter="submitPerLogin()"
+								/>
+
+							<!-- 邮箱登录 start -->
+								<div class="login_form_email" :class="{active:emailStap===2}">
+							<div v-show="emailStap === 2"  class="email_last_step">
+								
+								<div class="email_last_step_block" >
+									<span class="email_last_step_content"
+										>Verify with one-time verification code</span
+									>
+									<i class="fi fi-br-cross email_last_step_block_icon" @click="emailLastStepFun()"></i>
+								</div>
+								<div class="email_last_step_bottom">
+									<div class="email_last_step_des">
+									<div class="sent_email_content">
+										Sent to {{ email }}
+									</div>
+									<div class="tip_content">
+										<span v-show="time">{{ time }}s</span>
+										<span v-show="!time" @click="emailNextStepFun()"
+											>Resend</span
+										>
+									</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>
+							</div>
+						</div>
+						</div>
+							<div
+								class="login_submit_button marign_top40" 
+								style="width: 100%;"
+								:state="emailStap"
+								@click="submitPerLogin()"
+							>
+							Bind Email
+							</div>
+						</div>
+						<!-- 账号密码登录 end -->
+						
+					</div>
+					
+					<!-- 邮箱登录 end -->
+				</div>
+			</div>
+		</div>
+	</a-modal>
+
+</template>
+
+<script lang="ts">
+import { defineComponent,ref,reactive,toRefs ,onMounted} from "vue";
+import { Https } from "@/tool/https";
+import { isEmail } from "@/tool/util";
+import { setCookie ,WriteCookie } from "@/tool/cookie";
+import { message } from "ant-design-vue";
+import VerificationCodeInput from "@/component/LoginPage/verificationCodeInput.vue";
+import { useStore } from "vuex";
+import { useI18n } from "vue-i18n";
+import { setLang } from "@/tool/guide";
+const md5 = require("md5");
+export default defineComponent({
+    components: {
+        VerificationCodeInput,
+    },
+    setup(){
+        let timer:any =  0;
+		const {locale} = useI18n()
+		const store = useStore();
+		let register = reactive({
+			registerModel:false,
+			registerModelMask:true,
+			pageWidth:'45%'
+		})
+        return{
+			store,
+            timer,
+			...toRefs(register),
+			locale
+        }
+    },
+    data() {
+        return {
+			checked:false,
+            emailStap: 1, // 邮箱登录步骤
+            emailCode: ["", "", "", "", "", ""], //邮箱验证码
+            emailNextStep: true,
+            email: "", //邮箱登录邮箱
+            frogetPasswordStep: 1, //忘记密码的步骤
+            forgetPasswordEmail: "",
+            forgetEmailCode: ["", "", "", "", "", ""], //忘记密码的邮箱验证码
+            forgetEmailValue: "", //忘记密码的邮箱验证码保存值
+            newPassword: "", //新密码
+            isCheckRobot: false,
+            time: 60, //60秒倒计时
+            passwordType:'password',
+            userId:'',
+			loginTime:true
+        };
+    },
+    methods: {
+		init(){
+			this.registerModel = true
+			this.emailLastStepFun()
+			
+		},
+       
+
+        //邮箱登录的下一步
+        emailNextStepFun() {
+            if (!isEmail(this.email)) {
+                message.info("The email format is incorrect");
+                return;
+            }
+            let data = {
+                email: this.email,
+                operationType: "LOGIN",
+            };
+
+            Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+                (rv: any) => {
+                    if (rv) {
+                        this.emailStap = 2;
+                        this.time = 60;
+                        this.emailCode = ["", "", "", "", "", ""]
+                        this.createTimer();
+                    }
+                }
+            );
+        },
+
+        //邮箱登录的上一步
+        emailLastStepFun() {
+            this.emailStap = 1;
+            this.email = "";
+			this.checked=false,
+            (this.emailCode = ["", "", "", "", "", ""]), this.clearTimer();
+        },
+
+        //改变勾选是否是机器人
+        checkRobot() {
+            this.isCheckRobot = !this.isCheckRobot;
+        },
+
+        //提交账号密码预先登录
+        submitPerLogin() {
+			
+			//输入账号密码
+			if(this.emailStap>=2){
+				return;
+			}else{
+				//输入邮箱
+				if (!this.email) {
+					message.info("Please enter your email address");
+					return;
+				}
+				//判断邮箱格式是否正确
+				if (!isEmail(this.email)) {
+					message.info("The email format is incorrect");
+					return;
+				}
+				let data = {
+					"email": this.email,
+					"ip": "",
+					"operationType": "BIND_MAILBOX"
+				};
+				if(this.loginTime){
+					this.loginTime = false
+					Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+					(rv: any) => {
+						this.emailStap = 2;
+						if (rv) {
+							this.userId = rv.userId
+							this.time = 60;
+							this.emailCode = ["", "", "", "", "", ""]
+							this.createTimer();
+						}
+					}
+					).catch(res=>{
+						this.emailStap = 1;
+					});
+					setTimeout(() => {
+						this.loginTime = true
+					}, 2000);
+				}
+		
+			}
+        },
+
+        changePasswordType(){
+            this.passwordType = this.passwordType === 'password' ? 'text' : 'password'
+        },
+		setSuccessLogin(rv:any){
+			if (rv) {
+				let value = {
+					email:this.email
+				}
+				this.store.commit("upUserDetail", value)
+				window.location.reload();
+				this.cancelDsign()
+			}
+		},
+        //邮箱登录提交
+        submitEmailLogin(emailVerifyCode: any) {
+            let data = {
+                email: this.email,
+                emailVerifyCode: emailVerifyCode,
+            };
+            Https.axiosPost(Https.httpUrls.accountBindEmail, data).then(
+                (rv: any) => {
+					this.setSuccessLogin(rv)
+                }
+			).catch(res=>{
+			});
+        },
+        //创建定时器
+        createTimer() {
+            this.timer = setInterval(() => {
+                this.time--;
+                if (!this.time) {
+                    clearInterval(this.timer);
+                }
+            }, 1000);
+        },
+
+        //清除定时器
+        clearTimer() {
+            this.time = 60;
+            if (this.timer) {
+                clearInterval(this.timer);
+            }
+        },
+		cancelDsign(){
+			this.registerModel = false
+		}
+    },
+});
+</script>
+<style lang="less" scoped>
+:deep(.register){
+	@media (max-width: 768px) {
+		// box-shadow: none;
+		// height: 100%;
+		margin: 0;
+		max-width: 95%;
+		&.generalModel{
+			.ant-modal-content{
+				// height: 100%;
+			}
+			.ant-modal-body{
+				padding: 6rem 4rem;
+				// height: 100%;
+			}
+		}
+	}
+}
+</style>
+<style lang="less" scoped>
+.login_page {
+    width: 100%;
+    height: 100%;
+    .page_content {
+        // position: relative;
+        .login_content {
+			
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%,-50%);
+            // width: 60rem;
+			width: 80%;
+            background: #FFFFFF;
+            // box-shadow: -0.3rem 2rem 5.9rem 0px rgba(200,200,200,0.3);
+            border-radius: 1rem;
+            padding: 3rem 6rem 6.5rem;
+            box-sizing: border-box;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			@media (max-width: 768px) {
+				padding: 0;
+			}
+			.login_content_left{
+				width: 100%;
+				.login_form_email{
+					position: absolute;
+					left: 0;
+					width: 100%;
+					height: 100%;
+					top: 0;
+					background: #fff;
+					transform: scale(0);
+					transition: .3s all;
+					border: 2px solid;
+					border-radius: 20px;
+					.email_last_step{
+						width: 100%;
+						height: 100%;
+						#app{
+							height: auto;
+						}
+					}
+				}
+				.active{
+					transform: scale(1);
+				}
+			}
+            .login_type_list {
+                width: 100%;
+                display: flex;
+
+                .login_type_item {
+                    text-align: center;
+                    font-size: 3.6rem;
+                    font-weight: bold;
+                    color: #D7D7D7;
+                    cursor: pointer;
+                    height: 4rem;
+                    line-height: 4rem;
+
+                    &.login_active {
+                        color: #030303;
+                    }
+                }
+            }
+			.login_form_title {
+                    font-size: 1.6rem;
+                    // color: #666666;
+					font-weight: 900;
+					color: #000;
+                    display: flex;
+                    justify-content: space-between;
+                    box-sizing: border-box;
+					label{
+						display: flex;
+						span{
+							font-size: 1.6rem;
+							margin-left: 10px;
+							font-weight: normal;
+						}
+						&.active{
+							pointer-events:none;
+							input{
+								pointer-events:none;
+							}
+						}
+					}
+                }
+
+            .login_form_content {
+                margin-top: 4rem;
+				position: relative;
+                &[state="2"]{
+					>*{
+						opacity: 0;
+					}
+					.login_form_email{
+						opacity: 1;
+					}
+				}
+                .password_input_block{
+                    position: relative;
+
+                    .password_show_icon{
+                        position: absolute;
+                        font-size: 2.4rem;
+                        right: 2rem;
+                        top:1.7rem;
+                        cursor: pointer;
+                    }
+                }
+
+                .login_form_input {
+                    width: 100%;
+                    height: 5rem;
+                    margin-top: 1rem;
+                    border: 0.1rem solid #dfdfdf;
+                    border-radius: 2.5rem;
+                    padding-left: 2.1rem;
+                    line-height: 5rem;
+                    font-size: 1.4rem;
+                    box-sizing: border-box;
+                    outline: none;
+					transition: all .3s;
+					&:hover{
+						border: 0.1rem solid #000;
+					}
+                    &::placeholder {
+                        color: #a5b0c2;
+                    }
+                }
+            }
+
+            .email_last_step {
+                // margin-top: 4rem;
+				.email_last_step_bottom{
+					padding: 0 40px;
+				}
+                .email_last_step_block{
+					padding: 10px;
+					border-bottom: 2px solid;
+					box-sizing: border-box;
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					.email_last_step_content {
+                    margin-left: 1rem;
+                    font-size: 2.2rem;
+                    font-weight: bold;
+                    color: #030303;
+                }
+					.email_last_step_block_icon{
+						cursor: pointer;
+						margin-right: 1rem;
+						height: 20px;
+					}
+                }
+
+                .fi-br-arrow-left {
+                    font-size: 2.5rem;
+                    font-weight: bold;
+                    color: #030303;
+					transform: translateY(1rem);
+					display: inline-block;
+                }
+
+                
+            }
+
+            .login_submit_button {
+                height: 5rem;
+                background: #000;
+                border-radius: 2.5rem;
+                line-height: 5rem;
+                text-align: center;
+                font-size: 1.8rem;
+                font-weight: 500;
+                color: #ffffff;
+                cursor: pointer;
+				transition: all .3s;
+				&:hover{
+					background: #3C3C3C;
+				}
+                &[state="2"] {
+                    cursor: not-allowed;
+                }
+            }
+            .login_text {
+                font-size: 1.6rem;
+                margin-top: 4rem;
+                color: #151515;
+                display: flex;
+                justify-content: flex-end;
+
+                .forget_password_text{
+                    cursor: pointer;
+                }
+            }
+        }
+    }
+
+
+    .marign_top20 {
+        margin-top: 2rem;
+    }
+
+    .marign_top22 {
+        margin-top: 2.2rem;
+    }
+
+    .marign_top30 {
+        margin-top: 3rem;
+    }
+    .marign_top40 {
+        margin-top: 4rem;
+    }
+	.thirdPartyLogin{
+		display: flex;
+		justify-content: flex-start;
+		>div{
+			margin-right: 1rem;
+		}
+	}
+    .tip_content {
+        font-size: 1.3rem;
+        font-weight: bold;
+        color: #343579;
+        cursor: pointer;
+    }
+
+    .email_last_step_des {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-top: 4rem;
+        margin-bottom: 2rem;
+
+        .sent_email_content {
+            font-size: 1.8rem;
+            font-weight: bold;
+            color: #a5b0c2;
+        }
+
+        .email_tip_content{
+            font-size: 1.4rem;
+            color: #030303;
+        }
+    }
+}
+
+</style>
--- a/src/component/mainPage/signUp/registerModel.vue
+++ b/src/component/mainPage/signUp/registerModel.vue
@@ -503,10 +503,11 @@ export default defineComponent({
 				setCookie("isBeginner", isBeginner);
 				setCookie("isBeginnerNum", 0); //从第一步开始，机器人开始的话就是从第二部开始
 				setCookie("userInfo", JSON.stringify(rv));
-				let userid = {
+				let userid:any = {
 					ueserId:rv.userId,
 					systemUser:rv.systemUser
 				}
+				if(rv.email)userid.email = rv.email
 				this.store.commit("upUserDetail", userid);
 				
 				if (window.innerWidth < 768) {
--- a/src/tool/https.js
+++ b/src/tool/https.js
@@ -100,7 +100,7 @@ axios.interceptors.response.use((res) =>{
 				}
 			}
 			if(!sSystemUser){
-				// router.replace('/')
+				router.replace('/')
 			}
 			message.warning('Please login and try again~')
 			store.commit('createDetail')
--- a/src/views/HomeMain.vue
+++ b/src/views/HomeMain.vue
@@ -133,10 +133,12 @@
 		<scaleVideo ref="scaleVideo"></scaleVideo>
 		<!-- 进行续订 -->
 		<renew ref="renew"></renew>
+		<!-- 绑定邮箱 -->
+		<bindEmail ref="bindEmail"></bindEmail>
    </div>
 </template>
 <script >
-import { defineComponent, createVNode, ref,toRefs, reactive, computed, onMounted } from "vue";
+import { defineComponent, createVNode, ref,toRefs, reactive, computed, onMounted, nextTick } from "vue";
 import { isEmail } from "@/tool/util";
 import { setCookie, getCookie, WriteCookie,clonAllCookie } from "@/tool/cookie";
 import payOrder from "@/component/Pay/payOrder.vue";
@@ -152,6 +154,7 @@ import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 import scaleVideo from "@/component/HomePage/scaleVideo.vue";
 import newPosted from "@/component/HomePage/newPosted.vue";
 import navRouter from "@/component/modules/navRouter.vue";
+import bindEmail from "@/component/HomePage/bindEmail.vue";
 import { useStore } from "vuex";
 import { setLang } from "@/tool/guide";
 import  showViewVideo from "@/tool/mount";
@@ -172,6 +175,7 @@ export default defineComponent({
 		payOrder,
 		TaskPage,
 		navRouter,
+		bindEmail,
    },
 	setup(){
        const store = useStore();
@@ -202,6 +206,8 @@ export default defineComponent({
 		let isLanguage = ref(false)

 		let newPosted = ref(null)
+
+		let bindEmail = ref(null)
 		let getUnreadCount = ()=>{
 			Https.axiosGet(Https.httpUrls.getUnreadCount).then((rv)=>{
 				if(rv){
@@ -304,6 +310,7 @@ export default defineComponent({
 			messageType,
 			...toRefs(stateList),
 			newPosted,
+			bindEmail,
 			openNewPosted,
 			changeLanguage,
 			closeShowOperateContent,
@@ -338,9 +345,14 @@ export default defineComponent({
        };
    },
 	watch: {
-		// credits.value(newVal,oldVal){
-		// 	console.log(String(newVal).length);
-		// }
+		'userDetail.email':{
+			handler(newVal, oldVal){
+				nextTick(()=>{
+					if(newVal == '-------------')this.setBindEmail()//如果没有绑定邮箱就弹窗
+				})
+			},
+			immediate: true
+		},
 	},
 	directives:{
 		moveOpenDetal:{
@@ -355,9 +367,10 @@ export default defineComponent({
 				resolve()
 			}).catch(()=>{
 				this.getLangIsShowMark = false
-				resolve()
+				reject()
 			})
 		})
+
        let isMurmur = getCookie('isMurmur')//获取是否是试用用户
        this.isMurmur =JSON.parse(isMurmur)
        if (this.userDetail.userId && this.userDetail.userId > -1) {
@@ -409,7 +422,6 @@ export default defineComponent({
 			}, 500);
 		})
 		let orderId = sessionStorage.getItem('orderId');//进入首页后是否打开订单列表查询到订单
-		console.log(orderId);
 		if(orderId){
 			let payOrder = this.$refs.payOrder
 			payOrder.init(orderId)
@@ -420,7 +432,9 @@ export default defineComponent({
 			this.openTask(data)
 		},
       
-
+		setBindEmail(){
+			this.bindEmail.init()
+		},
        turnToPage(name) {
            let noRefresh = name === "home" ? true : false;
            this.$router.push({ name: name, params: { noRefresh: noRefresh } });
--- a/src/views/HomeView/HomeView.vue
+++ b/src/views/HomeView/HomeView.vue
@@ -449,6 +449,7 @@ export default defineComponent({
 		let text = {

 		}
+		if(this.userDetail.email == '-------------')return
 		if(!isModalOne){//判断是否是试用用户
 		// if(!isTest && !isModalOne){//判断是否是试用用户
 			await new Promise(async (resolve) => {
--- a/src/views/LoginPage.vue
+++ b/src/views/LoginPage.vue
@@ -558,10 +558,11 @@ export default defineComponent({
 				setCookie("isBeginner", isBeginner);
 				setCookie("isBeginnerNum", 0); //从第一步开始，机器人开始的话就是从第二部开始
 				setCookie("userInfo", JSON.stringify(rv));
-				let userid = {
+				let userid:any = {
 					ueserId:rv.userId,
-					systemUser:rv.systemUser
+					systemUser:rv.systemUser,
 				}
+				if(rv.email)userid.email = rv.email
 				this.store.commit("upUserDetail", userid);
 				this.store.commit("setSystemUser", rv.systemUser);