yuyongdong/UAW
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增绑定邮箱

Browse Source
This commit is contained in:
yuyongdong 2024-05-15 20:16:49 +08:00
parent 478a099803
commit aadf65466c
9 changed files with 154 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/common/step one.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 193 KiB

BIN
src/assets/common/step tow.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 128 KiB

156
src/components/emailDialog.vue
View File

@ -20,8 +20,8 @@
</div>
<div class="dialog-content">
<div class="wallet-content">
<div class="dialog-header-title title-color">Sign in with Email</div>
<el-form :model="emailValidateForm" ref="emailValidateForm" :rules="rules">
<div class="dialog-header-title title-color">Link with Code</div>
<!-- <el-form :model="emailValidateForm" ref="emailValidateForm" :rules="rules">
<el-form-item
prop="email"
:show-message="isShowMes"
@ -52,27 +52,63 @@
</div>
</el-form-item>
</el-form>
<div class="check-validate" @click="resetForm('emailValidateForm')">Verify</div>
<div class="check-validate" @click="resetForm('emailValidateForm')">Verify</div> -->
<el-form :model="codeValidateForm" ref="codeValidateForm" :rules="codeRules">
<el-form-item prop="emailCode">
<div>
<span class="table-title">Code</span>
<el-input placeholder=""
class="ipt_css"
v-model="codeValidateForm.emailCode" />
</div>
</el-form-item>
<div class="code-btn" @click="checkEmailDialogVisible = true">How to Get Your Code</div>
</el-form>
<div class="check-validate" @click="codeResetForm('codeValidateForm')">Verify</div>
</div>
</div>
</el-dialog>
<!-- <el-dialog class="dialog-wallet" :visible.sync="checkEmailDialogVisible" :modal="false" :before-close="checkHandleClose">
<el-dialog class="dialog-wallet dialog-code" :visible.sync="checkEmailDialogVisible" :modal="false" :before-close="checkHandleClose">
<div class="dialog-header">
<div class="dialog-header-title"><i class="el-icon-arrow-left"></i> 邮箱登录</div>
<div class="dialog-header-title title-color"> How to Get Your Code</div>
<div class="dialog-header-close" @click="checkHandleClose">
<img src="@/assets/common/CloseButton.png" alt />
<img src="@/assets/common/close.png" alt />
</div>
</div>
<div class="dialog-content">
<div class="wallet-content">
<div class="get-code">
<div class="get-code-left">
<div class="get-code-left-top">
Login to the game and find the 'Code' icon.
</div>
<div class="get-code-left-btm">
<div>
<img src="@/assets/common/step one.png" alt="">
</div>
</div>
</div>
<div class="get-code-right">
<div class="get-code-left-top">
Copy your Code
</div>
<div class="get-code-left-btm">
<div>
<img src="@/assets/common/step tow.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</el-dialog> -->
</el-dialog>
</div>
</template>
<script>
import { apiSendCode, apiVerifyEmail } from '@/utils/webapi.js'
import { apiSendCode, apiVerifyEmail, apiVerifyClient } from '@/utils/webapi.js'
export default {
props: {
@ -80,7 +116,23 @@ export default {
},
data() {
let codeVerifiers = /^\d{6}$/;
let emailCodeVerifiers = /^\d{6}$/;
let emailValidateCode = (rule, value, callback) => {
if (value === "") {
callback(new Error("Please enter the verification code we sent to your email."));
} else {
if (emailCodeVerifiers.test(value)) {
callback();
} else {
callback(
new Error(
"Verification code is incorrect. Please verify and try again."
)
);
}
}
};
let codeVerifiers = /^[23456789abcdefghjkmnpqrstuvwxy]{8}$/;
let validateCode = (rule, value, callback) => {
if (value === "") {
callback(new Error("Please enter the verification code we sent to your email."));
@ -127,6 +179,17 @@ export default {
trigger: ['blur', 'change'],
},
],
emailCode: [
{
validator: emailValidateCode,
trigger: ['blur', 'change'],
},
],
},
codeValidateForm: {
emailCode: ''
},
codeRules: {
emailCode: [
{
validator: validateCode,
@ -190,6 +253,30 @@ export default {
})
},
// 客户端验证
codeResetForm(codeValidateForm) {
this.$refs[codeValidateForm].validate(async (valid) => {
if(valid) {
let { errcode, errmsg, data } = await apiVerifyClient(this.codeValidateForm.emailCode)
if(!errcode) {
this.$emit('bindEmail')
} else if(errcode == 11) {
this.$showErr(errmsg)
} else if(errcode == 12) {
this.$showErr(errmsg)
} else if(errcode == 13) {
this.$showErr(errmsg)
} else if(errcode == 14) {
this.$showErr(errmsg)
} else if(errcode == 16) {
this.$showErr(errmsg)
}
} else {
return
}
})
},
// 邮箱验证
isValidateEmail(email) {
const reg = /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/
@ -262,9 +349,6 @@ div {
color: #994FFD;
}
.dialog-header-close {
// position: absolute;
// top: -8%;
// right: -4%;
width: 35px;
height: 35px;
cursor: pointer;
@ -357,18 +441,8 @@ div {
color: #fff;
}
}
.code-btn {
position: absolute;
bottom: 0;
right: 0;
min-width: 80px;
background: #9950fd;
padding: 0 10px;
text-align: center;
border-radius: 10px;
cursor: pointer;
}
}
.email-no {
position: absolute;
bottom: 0;
@ -378,6 +452,38 @@ div {
}
}
}
.code-btn {
width: 140px;
color: #9950fd;
text-align: left;
text-decoration: underline;
cursor: pointer;
}
}
.get-code {
display: flex;
justify-content: space-between;
margin-top: 30px;
.get-code-left,
.get-code-right {
width: 48%;
.get-code-left-top {
font-size: 18px;
padding-bottom: 10px;
border-bottom: 2px solid #413c4c;
}
.get-code-left-btm {
width: 100%;
margin: 30px 0;
div {
width: 100%;
img {
width: 100%;
height: 100%;
}
}
}
}
}
.check-validate {
width: 120px;
@ -386,6 +492,7 @@ div {
background: #ffc35b;
color: #000;
margin: 20px auto;
margin-top: 50px;
border-radius: 20px;
cursor: pointer;
}
@ -400,5 +507,8 @@ div {
}
}
}
.dialog-code {
width: 100% !important;
}
}
</style>

4
src/components/errorDialog/index.js
View File

@ -82,6 +82,10 @@ let errmsg = err
errmsg = `You don't have enough Spins.`
} else if(errmsg.indexOf('Email address is required. Please enter your email to proceed.') > -1) {
errmsg = `Email address is required. Please enter your email to proceed.`
} else if(errmsg.indexOf('already bind game account') > -1) {
errmsg = `This Account is Already Connected to Another User. Try Using a Different Account.`
} else if(errmsg.indexOf('Email already binded to another account') > -1) {
errmsg = `This Account is Already Connected to Another User. Try Using a Different Account.`
} else if(errmsg.indexOf('code expired') > -1) {
errmsg = `Your verification code has expired. Please request a new code.`
} else if(errmsg.indexOf('code error') > -1) {

1
src/main.js
View File

@ -18,6 +18,7 @@ Vue.use(iErrorMsg)
import {Message} from 'element-ui'
Vue.prototype.$message = Message
Vue.prototype.$moment = moment
Vue.filter('formatDate', function (value) {
return moment(value).format('YYYY-MM-DD HH:mm:ss')

6
src/utils/webapi.js
View File

@ -334,3 +334,9 @@ export const apiVerifyEmail = async (email, code) => {
const url = `${API_BASE}/api/user/verify_email`;
return httpPost(url, {email, code})
}
// 发送客户端验证码
export const apiVerifyClient = async (code) => {
const url = `${API_BASE}/api/user/verify_client`;
return httpPost(url, {code})
}

6
src/views/home/gameCheckBtn.vue
View File

@ -52,10 +52,8 @@ bonusCount: 2, // 已助力次数
methods: {
async checkBtn(){
this.isShow = false
let googleId = this.$store.state.user.userData?.googleId || undefined
let usesEmailId = this.$store.state.user.userData?.emailId || undefined
console.log(googleId, usesEmailId)
if(usesEmailId || googleId) {
let usesEmailId = this.$store.state.user.userData?.gameId || undefined
if(usesEmailId) {
try {
let { errcode, errmsg, data } = await apiGameClaim(this.itemData.id);
if (!errcode) {

9
src/views/home/gameQuest.vue
View File

@ -53,7 +53,7 @@
</div>
<div v-if="token != null" class="btn">
<div class="is-btn">
<div v-if="!usesGoogleId && !usesEmailId" @click="toBindGoogle" class="check-no">
<div v-if="!usesEmailId" @click="toBindGoogle" class="check-no">
<span>Verify</span>
</div>
<div v-else-if="item.ticket == 0 && item.task == 'NftHolderCheck'" class="Time-no">
@ -127,7 +127,7 @@
<div v-if="getTime" class="Time-no">
<span>Verify</span>
</div>
<div v-else-if="getTime && !usesGoogleId && !usesEmailId" @click="toBindGoogle" class="check-no">
<div v-else-if="getTime && !usesEmailId" @click="toBindGoogle" class="check-no">
<span>Verify</span>
</div>
<div v-else>
@ -175,11 +175,8 @@ export default {
}
},
computed: {
usesGoogleId() {
return this.$store.state.user.userData?.googleId || undefined;
},
usesEmailId() {
return this.$store.state.user.userData?.emailId || undefined;
return this.$store.state.user.userData?.gameId || undefined;
},
getTime() {
var now = new Date().getTime();

15
src/views/home/index.vue
View File

@ -127,14 +127,11 @@
Connect Game Account
</div>
<!-- @click="isLogin('bind')" -->
<div v-if="usesGoogleMail || usesEmail" class="google-mail">
<div v-if="usesEmail" class="google-mail">
<!-- <el-tooltip placement="top" :content="usesGoogleMail"> -->
<div v-if="usesEmail">
{{ usesEmail.slice(0,6) }}***{{usesEmail.substr(-6)}}
</div>
<div v-if="usesGoogleMail">
{{ usesGoogleMail.slice(0,6) }}***{{usesGoogleMail.substr(-6)}}
</div>
<!-- </el-tooltip> -->
</div>
<div v-else class="bind-btn" @click="isLogin('bind')">Connect</div>
@ -1178,14 +1175,11 @@ export default {
usesTwitterId() {
return this.$store.state.user.userData?.twitterId || undefined;
},
usesGoogleMail() {
return this.$store.state.user.userData?.googleMail || undefined;
},
usesEmailId() {
return this.$store.state.user.userData?.emailId || undefined;
return this.$store.state.user.userData?.gameId || undefined;
},
usesEmail() {
return this.$store.state.user.userData?.email || undefined;
return this.$store.state.user.userData?.gameMail || undefined;
}
},
created() {
@ -1688,7 +1682,8 @@ export default {
this.isLoading = true;
let storeageKey;
try {
let today = formatDate(new Date());
// const moment = this.$moment().format()
let today = formatDate(moment);
storeageKey = await sendToChain("check", address, today);
} catch (err) {
this.isLoading = false;