You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
89 lines
2.4 KiB
89 lines
2.4 KiB
<!--修改邮箱-->
|
|
<template>
|
|
<el-row type="flex" justify="center">
|
|
<el-col :span="8">
|
|
<el-input v-model="userEmail" :disabled="true">
|
|
<template v-slot:prepend>当前邮箱</template>
|
|
</el-input>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row type="flex" justify="center" class="mt-1">
|
|
<el-col :span="8">
|
|
<el-input v-model="newEmail" :disabled="second>0">
|
|
<template v-slot:prepend>新邮箱</template>
|
|
</el-input>
|
|
<span v-if="userEmail === newEmail">新邮箱不能和当前邮箱一致</span>
|
|
</el-col>
|
|
</el-row>
|
|
<EmailCode :allowSendCode="allowSendCode"/>
|
|
<el-row type="flex" justify="center" class="mt-1">
|
|
<el-col :span="2">
|
|
<el-button type="primary" class="btn-block" :disabled="!checkCode" @click="changeEmail">更换邮箱</el-button>
|
|
</el-col>
|
|
<el-col :span="2"/>
|
|
<el-col :span="2">
|
|
<el-button type="info" class="btn-block" @click="$router.replace('/config')">返回</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import {computed, defineComponent, provide, Ref, ref} from "vue";
|
|
|
|
import {changeEmail as _changeEmail, message} from "../request";
|
|
import {updateRoute} from "../router";
|
|
import {useRouter} from "vue-router";
|
|
import {emailRegexp} from "../validate";
|
|
// @ts-ignore
|
|
import crumbs from 'crumbsjs';
|
|
import {email_cookie_key} from "../global";
|
|
import EmailCode from "./EmailCode.vue";
|
|
|
|
export default defineComponent({
|
|
name: 'Email',
|
|
components: {EmailCode},
|
|
setup(props) {
|
|
const newEmail = ref<string>('')
|
|
const code = ref<string>('')
|
|
|
|
const second = ref<number>(0)
|
|
|
|
const router = useRouter()
|
|
|
|
const userEmail = crumbs.get(email_cookie_key)
|
|
|
|
const changeEmail = () => _changeEmail(userEmail, newEmail.value, code.value).then(res => res.json()).then(
|
|
res => {
|
|
message(res)
|
|
crumbs.set(email_cookie_key, newEmail.value)
|
|
if (res.result === 'OK') {
|
|
router.replace('/config')
|
|
}
|
|
}
|
|
)
|
|
|
|
provide<Ref<string>>('code', code)
|
|
provide<Ref<number>>('second', second)
|
|
|
|
|
|
const allowSendCode = computed<boolean>(() => second.value === 0 && userEmail !== newEmail.value && emailRegexp.test(newEmail.value))
|
|
|
|
const checkCode = computed<boolean>(() => /^\d{6}$/.test(code.value))
|
|
|
|
updateRoute()
|
|
|
|
return {
|
|
newEmail,
|
|
allowSendCode,
|
|
checkCode,
|
|
second,
|
|
userEmail,
|
|
changeEmail
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style> |