Browse Source

feat:新增首页勾选协议

dxj
杜贤金 1 year ago
parent
commit
8c0967890e
  1. 117
      src/views/login/index.vue

117
src/views/login/index.vue

@ -1,7 +1,7 @@
<script setup lang="ts">
import { reactive, ref } from 'vue'
import { Button, Form, FormItem, Input, message } from 'ant-design-vue'
import { Button, Checkbox, Form, FormItem, Input, message } from 'ant-design-vue'
import { useRoute, useRouter } from 'vue-router'
import type { Rule } from 'ant-design-vue/es/form'
@ -25,7 +25,7 @@ const formRef = ref()
const btnTxt = ref('获取验证码')
const disabled = ref(false)
const time = ref(0)
const checked = ref(false) //
const ruleForm = reactive<LoginForm>({
phone: '',
code: '',
@ -51,26 +51,31 @@ const rules: Record<string, Rule[]> = {
}
//
function handleLogin() {
formRef.value
.validate()
.then(() => {
loading.value = true
userStore.login({
user_type: UserTypeEnum.C,
grant_type: GrantTypeEnum.SMS,
invite_code: '',
phone: ruleForm.phone,
phoneCode: ruleForm.code,
type: TypeEnum.PHONE,
inviteCode: ruleForm.inviteCode,
}).then(() => {
message.success('登录成功')
loading.value = false
router.push('/')
}).catch(() => {
loading.value = false
if (checked.value) {
formRef.value
.validate()
.then(() => {
loading.value = true
userStore.login({
user_type: UserTypeEnum.C,
grant_type: GrantTypeEnum.SMS,
invite_code: '',
phone: ruleForm.phone,
phoneCode: ruleForm.code,
type: TypeEnum.PHONE,
inviteCode: ruleForm.inviteCode,
}).then(() => {
message.success('登录成功')
loading.value = false
router.push('/')
}).catch(() => {
loading.value = false
})
})
})
}
else {
message.warning('请先勾选协议!')
}
}
//
function handleSendCode() {
@ -112,6 +117,31 @@ function timer() {
disabled.value = false
}
}
//
function handleCheck() {
checked.value = !checked.value
}
//
function handleView(number: number) {
let url
if (number === 1) {
url = 'https://qn-static-resource.oss-cn-shanghai.aliyuncs.com/docs/%E6%9C%8D%E5%8A%A1%E5%8D%8F%E8%AE%AE.docx'
}
else {
url = 'https://qn-static-resource.oss-cn-shanghai.aliyuncs.com/docs/%E9%9A%90%E7%A7%81%E6%94%BF%E7%AD%96.docx'
}
let urls = ''
urls = `http://view.xdocin.com/xdoc?_xdoc=${url}`
window.open(
urls,
'',
`width=${
window.screen.availWidth - 10
},height=${
window.screen.availHeight - 70
}, top = 0, left = 0, status=no`,
)
}
</script>
<template>
@ -194,11 +224,17 @@ function timer() {
>
</Button>
<div class="versions">
v1.0.0
</div>
</FormItem>
</Form>
<div class="check" @click="handleCheck">
<Checkbox v-model:checked="checked" />
<span style="padding-left: 3px;">
勾选即代表您同意并接受<span class="blue" @click.stop="handleView(1)">服务协议</span><span class="blue" @click.stop="handleView(2)">隐私政策</span>
</span>
</div>
<div class="versions">
v1.0.0
</div>
</div>
</div>
</div>
@ -277,6 +313,7 @@ function timer() {
border-radius: 4px;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
letter-spacing: 0.2em;
backdrop-filter: blur(50px);
@ -285,7 +322,7 @@ function timer() {
top: 0;
right: 2%;
.login-Form {
width: 70%;
width: 77%;
margin: 0 auto;
.icon {
width: 15px;
@ -328,15 +365,27 @@ function timer() {
border-radius: 4px;
color: white;
}
.versions {
width: 100%;
text-align: center;
font-size: 13px;
font-weight: 400;
color: #6e7382;
padding-top: 20px;
letter-spacing: 2px;
}
.versions {
width: 100%;
text-align: center;
font-size: 13px;
font-weight: 400;
color: #6e7382;
padding-top: 10px;
letter-spacing: 2px;
}
.check {
width: 100%;
text-align: center;
font-size: 12px;
font-weight: 400;
color: #6e7382;
text-align: center;
cursor: pointer;
.blue {
color: #5aa8fd;
}
}
}

Loading…
Cancel
Save