Skip to content

Commit

Permalink
1
Browse files Browse the repository at this point in the history
  • Loading branch information
SunWuyuan committed Aug 26, 2024
1 parent 1a4d590 commit beff530
Show file tree
Hide file tree
Showing 4 changed files with 645 additions and 11 deletions.
47 changes: 36 additions & 11 deletions src/pages/account/login.vue
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
欢迎来到ZeroCatNext! 👋🏻
</h5>
<p class="mb-0">
请登录或创建您的账户 </p>
登录你的账户 </p>
</VCardText>
</v-col></v-row>

Expand All @@ -23,8 +23,11 @@
<VRow>
<!-- email -->
<VCol cols="12">
<VTextField label="Username" type="text" v-model='username' variant="outlined"></VTextField>
<VTextField label="Password" type="password" v-model='password' variant="outlined"></VTextField>
<VTextField label="邮箱" type="text" v-model='username' variant="outlined" :rules="emailRules"></VTextField>
<VTextField label="密码" v-model='password' variant="outlined" :rules="usernameRules"
:append-icon="show1 ? 'mdi-eye' : 'mdi-eye-off'"
:type="show1 ? 'text' : 'password'"
@click:append="show1 = !show1"></VTextField>
</VCol>
<VCol cols="9">
<div id="recaptcha-div"></div>
Expand All @@ -40,17 +43,18 @@
</div>-->

<v-btn class="text-none" color="primary" rounded="xl" text="登录" variant="flat" size="large" @click="login"
append-icon="mdi-arrow-right"></v-btn> <!-- login button -->
<v-btn class="text-none" color="primary" rounded="xl" text="登录" variant="flat" size="large" @click="login" append-icon="mdi-arrow-right"></v-btn> <!-- login button -->

</VCol>
<VCol cols="12">


<v-btn class="text-none" color="white" rounded="xl" text="注册" variant="text" size="large" append-icon="mdi-arrow-right" to="/account/register"></v-btn> <!-- login button -->
<v-btn class="text-none" color="white" rounded="xl" text="找回密码" variant="text" size="large" append-icon="mdi-arrow-right" to="/account/retrieve"></v-btn> <!-- login button -->

</VCol>
<!-- create account -->
<VCol cols="12" class="text-center text-base">
<span>新用户?</span>
<a class="text-primary ms-2" :href="BASE_API + '/user/login?redirect=new'">
注册账户 </a>
</VCol>



</VRow>
Expand Down Expand Up @@ -92,6 +96,27 @@ export default {
initRecaptcha,
getResponse,
resetCaptcha,
show1:ref(false),
emailRules: [
value => {
if (value) return true
return '必须填写邮箱'
},
value => {
if (/.+@.+\..+/.test(value)) return true
return '不符合格式'
},
],
usernameRules: [
value => {
if (value) return true
return '必须填写用户名'
},
],
};
},
Expand All @@ -108,7 +133,7 @@ export default {
async login() {
this.loading = true
this.tryinguser = await request({
url: '/user/login',
url: '/account/login',
method: 'post',
data: {
"captcha": getResponse(),
Expand Down
267 changes: 267 additions & 0 deletions src/pages/account/register.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,267 @@
<template>




<div class="auth-wrapper d-flex align-center justify-center pa-4">
<VCard class="auth-card pa-4 pt-7" max-width="448">

<v-row>
<v-col cols="12">
<VCardText>
<h5 class="text-h5 font-weight-semibold mb-1">
欢迎来到ZeroCatNext! 👋🏻
</h5>
<p class="mb-0">
创建你的账户 </p>
</VCardText>
</v-col></v-row>


<VCardText>
<VForm>
<VRow>
<!-- email -->
<VCol cols="12">
<VTextField label="邮箱" type="email" v-model='email' variant="outlined" required :rules="emailRules">
</VTextField>
<VTextField label="用户名" type="text" v-model='username' variant="outlined" required :rules="usernameRules">
</VTextField>
</VCol>
<VCol cols="9">
<div id="recaptcha-div"></div>
</VCol>
<VCol cols="3"> <v-btn @click="resetCaptcha()" variant="text">刷新</v-btn> </VCol>
<!-- password -->
<VCol cols="12">

<!-- remember me checkbox
<div class="d-flex align-center justify-space-between flex-wrap ">
<VCheckbox disabled label="Remember me" />
</div>-->

<v-dialog persistent>
<template v-slot:activator="{ props: activatorProps }">
<v-btn v-bind="activatorProps" class="text-none" color="primary" rounded="xl" text="注册" variant="flat"
size="large" append-icon="mdi-arrow-right"></v-btn>
</template>

<template v-slot:default="{ isActive }">
<v-card title="您正在使用由厚浪(及孙悟元)提供的服务
">
<v-card-text>
我们可能会收集您的个人信息,具体参见 <v-tooltip location="bottom">
<template v-slot:activator="{ props }">
<a href="https://wuyuan.dev/privacy-policy/privacy-policy.html" target="_blank" v-bind="props"
@click.stop>
隐私策略
</a>
</template>
孙悟元网站与服务隐私策略
</v-tooltip>
<v-checkbox v-model="agreement.privacy">
<template v-slot:label>
<div>
我已阅读并同意隐私策略

</div>
</template>
</v-checkbox>我们将在中国大陆安全的存储您的数据,我们暂不提供自助删除您的个人数据,如果您希望删除您的数据,您需要优先选择联系我们
<v-checkbox v-model="agreement.datadelete">
<template v-slot:label>
<div>
我理解并同意我无法自助删除我的个人数据,在需要时我会主动联系管理员删除

</div>
</template>
</v-checkbox>
在 ZeroCatNext 上,你需要遵守 <v-tooltip location="bottom">
<template v-slot:activator="{ props }">
<a href="https://scratch.mit.edu/community_guidelines" target="_blank" v-bind="props"
@click.stop>
社区行为准则(第三方站点)
</a>
</template>
你的当前地区可能无法访问此网站
</v-tooltip>
<v-checkbox v-model="agreement.rules">
<template v-slot:label>
<div>
我已阅读并同意将会遵守社区行为准则
</div>
</template>
</v-checkbox>
你需要同意<v-tooltip location="bottom">
<template v-slot:activator="{ props }">
<a href="https://wuyuan.dev/privacy-policy/terms-of-service.html" target="_blank"
v-bind="props" @click.stop>
用户协议
</a>
</template>
孙悟元网站与服务用户协议
</v-tooltip>
<v-checkbox v-model="agreement.terms">
<template v-slot:label>
<div>
我已阅读并同意用户协议
</div>
</template>
</v-checkbox>
<v-btn class="text-none" color="primary" rounded="xl" text="注册" variant="flat" size="large"
@click="register" append-icon="mdi-arrow-right"></v-btn> <br /> <br /> 对于技术手段绕过此页面的行为视为对 ZeroCat
的基础设施进行攻击,涉嫌非法入侵计算机系统,我们将保留追究法律责任的权利,且违规获得的账号不受保护,如果您同意以上内容,请点击“复选框”以完成注册流程.

</v-card-text>

<v-card-actions>
<v-spacer></v-spacer>

<v-btn text="取消" @click="isActive.value = false; agreement = {
privacy: false,
terms: false,
rules: false,
datadelete: false
}"></v-btn>
</v-card-actions>
</v-card>
</template>
</v-dialog>

</VCol>

<VCol cols="12">


<v-btn class="text-none" color="white" rounded="xl" text="登录" variant="text" size="large"
append-icon="mdi-arrow-right" to="/account/login"></v-btn> <!-- login button -->
<v-btn class="text-none" color="white" rounded="xl" text="找回密码" variant="text" size="large" append-icon="mdi-arrow-right" to="/account/retrieve"></v-btn> <!-- login button -->

</VCol>


</VRow>
</VForm>
</VCardText> <v-card class="mx-auto bg-surface-light" :href="BASE_API + '/user/login?redirect=new'">
<template v-slot:prepend>
<v-icon icon="mdi-web"></v-icon>
</template>
<template v-slot:append>
<v-icon icon="mdi-arrow-right-circle"></v-icon>
</template>
<template v-slot:title>

<span>在 ZeroCat 完成登录</span> </template><template v-slot:subtitle>
<span>您将在 {{ BASE_API }} 完成登录</span> </template>
</v-card>
</VCard>
</div>





<LoadingDialog :show="loading" text='正在注册' />

</template>

<script>
import { localuser } from '@/stores/user';
import request from "../../axios/axios";
import LoadingDialog from '@/components/LoadingDialog.vue';
import 'https://static.geetest.com/v4/gt4.js'
import { initRecaptcha, getResponse, resetCaptcha } from '../../stores/useRecaptcha';
export default {
components: { LoadingDialog },
data() {
return {
BASE_API: import.meta.env.VITE_APP_BASE_API,
email: '',
username: '',
tryinguser: {},
loading: false,
initRecaptcha,
getResponse,
resetCaptcha,
agreement: {
privacy: false,
terms: false,
rules: false,
datadelete: false
},
emailRules: [
value => {
if (value) return true
return '必须填写邮箱'
},
value => {
if (/.+@.+\..+/.test(value)) return true
return '不符合格式'
},
],
usernameRules: [
value => {
if (value) return true
return '必须填写用户名'
},
],
};
},
created() {
if (localuser.islogin.value == true) {
this.$router.push("/");
}
},
setup() {
initRecaptcha('recaptcha-div');
},
methods: {
async register() {
for (const key in this.agreement) {
if (this.agreement[key] === false) {
this.addtoast("请先阅读并同意有关协议")
return
}
}
this.loading = true
this.tryinguser = await request({
url: '/account/register',
method: 'post',
data: {
"captcha": getResponse(),
"un": this.email,
"pw": this.username
}
})
if (this.tryinguser.message != 'OK') {
this.loading = false
this.$toast.add({ severity: 'info', summary: 'info', detail: this.tryinguser.msg || this.tryinguser.message, life: 3000 });
return
}
this.loading = false
//this.$toast.add({ severity: 'info', summary: 'info', detail: this.tryinguser.msg||this.tryinguser.message, life: 3000 });
localuser.setuser(this.tryinguser.token)
console.log(this.tryinguser)
if (this.tryinguser.msg || this.tryinguser.message == 'OK') {
this.$router.push("/");
}
},
addtoast(text) {
this.$toast.add({ severity: 'info', summary: 'info', detail: text, life: 3000 });
}
}
};
</script>
Loading

0 comments on commit beff530

Please sign in to comment.