|
|
@@ -1,181 +1,149 @@
|
|
|
-<script setup>
|
|
|
-import { ref, watch, onMounted } from 'vue'
|
|
|
-import { useI18n } from 'vue-i18n'
|
|
|
-import { useEmailCountdown } from '@/hooks/useEmailCountdown'
|
|
|
-import { ucardApi } from '@/api/ucard'
|
|
|
-import { showToast } from '@/utils/toast'
|
|
|
-const { t } = useI18n()
|
|
|
-
|
|
|
-const {
|
|
|
- time,
|
|
|
- text: getCodeString,
|
|
|
- canSend,
|
|
|
- start,
|
|
|
- restore
|
|
|
-} = useEmailCountdown()
|
|
|
-
|
|
|
-// 响应式表单数据
|
|
|
-const formData = ref({
|
|
|
- country: '',
|
|
|
- birthDate: '',
|
|
|
- code: '',
|
|
|
- password: '',
|
|
|
- agentId: null,
|
|
|
- agentValue: '',
|
|
|
- readName: '',
|
|
|
- agree: '',
|
|
|
-})
|
|
|
-const ho = ref('')
|
|
|
-// 账号类型
|
|
|
-const accountType = ref(1)
|
|
|
-
|
|
|
-const value = ref('')
|
|
|
-
|
|
|
-watch(value, (newValue, oldValue) => {
|
|
|
- // console.log('v-model', newValue);
|
|
|
-})
|
|
|
-
|
|
|
-// 切换注册账号类型
|
|
|
-const changeAccountType = (type) => {
|
|
|
- if (accountType.value !== type) accountType.value = type
|
|
|
-}
|
|
|
-// 获取验证码按钮点击
|
|
|
-async function handleGetCode() {
|
|
|
- if (!canSend.value) return
|
|
|
- await sendEmailCode();
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-// 发送邮箱验证码
|
|
|
-async function sendEmailCode() {
|
|
|
- const res = await ucardApi.getBlockchainWithdrawSendEmailCode({
|
|
|
- ...formData.value,
|
|
|
- });
|
|
|
-
|
|
|
- if (res.code === 200) {
|
|
|
- showToast(t("Msg.CodeSuccess"));
|
|
|
- start()
|
|
|
- return true;
|
|
|
- } else {
|
|
|
- showToast(t("Msg.CodeFail"));
|
|
|
- return false;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-onMounted(() => {
|
|
|
- const hostParts = window.location.host.split('.')
|
|
|
- ho.value = hostParts.length > 1 ? hostParts[1] : ''
|
|
|
-})
|
|
|
-
|
|
|
-</script>
|
|
|
<template>
|
|
|
<view class="regist-page" :isHeaderFixed="true" :isLoginPage="true">
|
|
|
- <uni-row class="content">
|
|
|
- <uni-col :span="20" :offset="2" :sm="{ span: 14, offset: 5 }">
|
|
|
- <view class="logo">
|
|
|
- <image src="/static/images/logo.png" class="company-icon" mode="widthFix"></image>
|
|
|
- </view>
|
|
|
- <!-- 账号类型-->
|
|
|
- <view class="account-type">
|
|
|
- <view class="type-btn" @click="changeAccountType(1)" :class="{ active: accountType === 1 }">Open Live Account
|
|
|
+ <view class="regist-content">
|
|
|
+ <uni-row class="content">
|
|
|
+ <uni-col :span="20" :offset="2" :sm="{ span: 14, offset: 5 }">
|
|
|
+ <view class="regist-header">
|
|
|
+ <text class="title">{{ t('signup.title') }}</text>
|
|
|
+ <view class="login-link">
|
|
|
+ <text class="text">{{ t('Label.Or') }}</text>
|
|
|
+ <navigator url="/pages/login/index" class="link" hover-class="none">{{ t('signin.login') }}
|
|
|
+ </navigator>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="type-btn" @click="changeAccountType(2)" :class="{ active: accountType === 2 }">Register Demo
|
|
|
- Account
|
|
|
+ <uni-forms ref="form" :modelValue="formData" validate-trigger="blur" label-position="top" label-width="120">
|
|
|
+ <uni-row :gutter="20" class="formContent">
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item name="country" :label="t('newSignup.item3')">
|
|
|
+ <cwg-combox class="formStyle" v-model:value="formData.country" :options="countryOptions">
|
|
|
+ </cwg-combox>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item name="phone" :label="t('newSignup.item5')">
|
|
|
+ <uni-easyinput class="formStyle" v-model="formData.phone"></uni-easyinput>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item name="birthDate" :label="t('newSignup.item18')">
|
|
|
+ <uni-datetime-picker class="formStyle" type="date" v-model="formData.birthDate"
|
|
|
+ :placeholder="t('newSignup.item19')" @change="checkAge" />
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item name="email" :label="t('newSignup.item7')">
|
|
|
+ <uni-easyinput class="formStyle" v-model="formData.email"
|
|
|
+ :placeholder="t('newSignup.item8')"
|
|
|
+ :disabled="!isAgeValid || !formData.birthDate"></uni-easyinput>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item name="code" :label="t('newSignup.item7')">
|
|
|
+ <uni-easyinput class="formStyle" :disabled="!isAgeValid || !formData.birthDate"
|
|
|
+ v-model="formData.code" :placeholder="t('newSignup.item8')">
|
|
|
+ <template #right>
|
|
|
+ <view class="btn-code" @click="(!isAgeValid || !formData.birthDate) ? '' : handleGetCode()">
|
|
|
+ {{ getCodeString }}
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ </uni-easyinput>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <view class="agreemnet9">*{{ t('signup.agreemnet9') }}</view>
|
|
|
+ </uni-col>
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item name="password" :label="t('newSignup.item12')">
|
|
|
+ <uni-easyinput class="formStyle" v-model.trim="formData.password"
|
|
|
+ :disabled="!isAgeValid || !formData.birthDate"
|
|
|
+ :placeholder="t('newSignup.item13')" type="password"></uni-easyinput>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item>
|
|
|
+ <ul class="pwd">
|
|
|
+ <li :class="{ fit: rule1 }" v-t="'signup.form.rules.1st'"></li>
|
|
|
+ <li :class="{ fit: rule2 }" v-t="'signup.form.rules.2nd'"></li>
|
|
|
+ <li :class="{ fit: rule3 }" v-t="'signup.form.rules.3rd'"></li>
|
|
|
+ </ul>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+
|
|
|
+ <uni-col :xs="24" :md="24">
|
|
|
+ <uni-forms-item v-if="!isRouteHasId" name="linkValue" :label="t('newSignup.item14')">
|
|
|
+ <uni-easyinput class="formStyle" v-model.trim="formData.linkValue"
|
|
|
+ :disabled="!isAgeValid || !formData.birthDate"
|
|
|
+ :placeholder="t('newSignup.item15')"
|
|
|
+ @input="limitAgentIdLength"></uni-easyinput>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-col>
|
|
|
+
|
|
|
+
|
|
|
+ </uni-row>
|
|
|
+
|
|
|
+ </uni-forms>
|
|
|
+ <view class="check-box">
|
|
|
+ <up-checkbox-group v-model="formData.agree">
|
|
|
+ <up-checkbox size="14" labelSize="14" labelColor="#666666" activeColor="#ea002a" v-model="formData.agree"
|
|
|
+ :label="t('signup.agree')" name="" class="wcg-checkbox"></up-checkbox>
|
|
|
+ </up-checkbox-group>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- <view class="account-tip">
|
|
|
- <view class="title">{{ accountType === 1 ? 'Open Live Account' : 'Register Demo Account' }}</view>
|
|
|
- <view class="tip">
|
|
|
- {{ accountType === 1 ? 'Please enter your required information' : 'Register Demo Account' }}
|
|
|
+ <view class="check-box">
|
|
|
+ <up-checkbox-group v-model="formData.isSubscribeEmail">
|
|
|
+ <up-checkbox size="14" labelSize="14" labelColor="#666666" activeColor="#ea002a"
|
|
|
+ v-model="formData.isSubscribeEmail" :label="t('signup.agree1')" name=""
|
|
|
+ class="wcg-checkbox"></up-checkbox>
|
|
|
+ </up-checkbox-group>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- <uni-forms ref="form" :modelValue="formData" validate-trigger="blur" label-position="top" label-width="120">
|
|
|
- <uni-row :gutter="20" class="formContent">
|
|
|
- <uni-col :xs="24" :md="12">
|
|
|
- <uni-forms-item name="country" :label="t('newSignup.item3')">
|
|
|
- <uni-data-select class="formStyle" v-model="formData.country">
|
|
|
- </uni-data-select>
|
|
|
- </uni-forms-item>
|
|
|
- </uni-col>
|
|
|
- <uni-col :xs="24" :md="12">
|
|
|
- <uni-forms-item name="phone" :label="t('newSignup.item5')">
|
|
|
- <uni-easyinput class="formStyle" v-model="formData.phone"></uni-easyinput>
|
|
|
- </uni-forms-item>
|
|
|
- </uni-col>
|
|
|
- <uni-col :xs="24" :md="12">
|
|
|
- <uni-forms-item name="birthDate" :label="t('newSignup.item18')">
|
|
|
- <uni-datetime-picker class="formStyle" type="date" v-model="formData.birthDate"
|
|
|
- :placeholder="t('newSignup.item19')" />
|
|
|
- </uni-forms-item>
|
|
|
- </uni-col>
|
|
|
- <uni-col :xs="24" :md="12">
|
|
|
- <uni-forms-item name="email" :label="t('newSignup.item7')">
|
|
|
- <uni-easyinput class="formStyle" v-model="formData.email"
|
|
|
- :placeholder="t('newSignup.item8')"></uni-easyinput>
|
|
|
- </uni-forms-item>
|
|
|
- </uni-col>
|
|
|
- <uni-col :xs="24" :md="12">
|
|
|
- <uni-forms-item name="code" :label="t('newSignup.item7')">
|
|
|
- <uni-easyinput class="formStyle" v-model="formData.code" :placeholder="t('newSignup.item8')">
|
|
|
- <template #right>
|
|
|
- <view class="btn-code" @click="handleGetCode">{{ getCodeString }}</view>
|
|
|
- </template>
|
|
|
- </uni-easyinput>
|
|
|
- </uni-forms-item>
|
|
|
- </uni-col>
|
|
|
-
|
|
|
- </uni-row>
|
|
|
-
|
|
|
- </uni-forms>
|
|
|
- <view class="check-box">
|
|
|
- <up-checkbox-group v-model="formData.agree">
|
|
|
- <up-checkbox size="14" labelSize="14" labelColor="#666666" activeColor="#ea002a" v-model="formData.agree"
|
|
|
- :label="t('signup.agree')" name="" class="wcg-checkbox"></up-checkbox>
|
|
|
- </up-checkbox-group>
|
|
|
- </view>
|
|
|
- <view class="check-box">
|
|
|
- <up-checkbox-group v-model="formData.isSubscribeEmail">
|
|
|
- <up-checkbox size="14" labelSize="14" labelColor="#666666" activeColor="#ea002a"
|
|
|
- v-model="formData.isSubscribeEmail" :label="t('signup.agree1')" name=""
|
|
|
- class="wcg-checkbox"></up-checkbox>
|
|
|
- </up-checkbox-group>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <u-button class="regiset-btn">
|
|
|
- {{ t('signup.button') }}
|
|
|
- </u-button>
|
|
|
- </view>
|
|
|
- <view class="or-title">
|
|
|
- <view class="line"></view>
|
|
|
- <view class="qr-tit2">OR</view>
|
|
|
- <view class="line"></view>
|
|
|
- </view>
|
|
|
- <uni-row :gutter="20">
|
|
|
- <uni-col :xs="24" :md="12">
|
|
|
- <u-button class="login-btn">
|
|
|
+ <view>
|
|
|
+ <u-button class="regiset-btn" @click="register">
|
|
|
{{ t('signup.button') }}
|
|
|
</u-button>
|
|
|
- </uni-col>
|
|
|
- <uni-col :xs="24" :md="12">
|
|
|
- <u-button class="login-btn">
|
|
|
- {{ t('signup.button') }}
|
|
|
- </u-button>
|
|
|
- </uni-col>
|
|
|
- </uni-row>
|
|
|
- </uni-col>
|
|
|
+ </view>
|
|
|
+ <view class="des-bottom">
|
|
|
+ <text v-t="'signup.agreemnet1'"></text>
|
|
|
+ <a href="pdf/Client_Agreement.pdf" target="_blank" v-t="'signup.agreemnet2'"></a>
|
|
|
+ <text v-t="'signup.agreemnet3'"></text>
|
|
|
+ <a href="pdf/Terms&Conditions.pdf" target="_blank" v-t="'signup.agreemnet4'"></a>
|
|
|
+ <text v-t="'signup.agreemnet5'"></text>
|
|
|
+ <a href="pdf/Privacy_Policy.pdf" target="_blank" v-t="'signup.agreemnet6'"></a>
|
|
|
+ <text v-t="'signup.agreemnet7'"></text>
|
|
|
+ </view>
|
|
|
+ <!-- <view class="or-title">-->
|
|
|
+ <!-- <view class="line"></view>-->
|
|
|
+ <!-- <view class="qr-tit2">OR</view>-->
|
|
|
+ <!-- <view class="line"></view>-->
|
|
|
+ <!-- </view>-->
|
|
|
+ <!-- <uni-row :gutter="20">-->
|
|
|
+ <!-- <uni-col :xs="24" :md="12">-->
|
|
|
+ <!-- <u-button class="login-btn">-->
|
|
|
+ <!-- {{ t('signup.button') }}-->
|
|
|
+ <!-- </u-button>-->
|
|
|
+ <!-- </uni-col>-->
|
|
|
+ <!-- <uni-col :xs="24" :md="12">-->
|
|
|
+ <!-- <u-button class="login-btn">-->
|
|
|
+ <!-- {{ t('signup.button') }}-->
|
|
|
+ <!-- </u-button>-->
|
|
|
+ <!-- </uni-col>-->
|
|
|
+ <!-- </uni-row>-->
|
|
|
+ </uni-col>
|
|
|
+
|
|
|
+ </uni-row>
|
|
|
+ </view>
|
|
|
|
|
|
- </uni-row>
|
|
|
<view class="des">
|
|
|
<view>
|
|
|
{{ t('newSignin.item12') }}
|
|
|
- </view><br />
|
|
|
+ </view>
|
|
|
+ <br />
|
|
|
<view>
|
|
|
{{ t('newSignin.item10') }}
|
|
|
- </view><br />
|
|
|
+ </view>
|
|
|
+ <br />
|
|
|
<view>
|
|
|
{{ t('newSignin.item11') }}
|
|
|
- </view><br />
|
|
|
+ </view>
|
|
|
+ <br />
|
|
|
<view>{{ t('newSignin.item13') }}</view>
|
|
|
<a :href="`https://www.${ho}.com/doc/Risk-Disclosures-and-Acknowledgements-2020-08.pdf`" target="_blank">
|
|
|
{{ t('newSignin.item13_1') }}
|
|
|
@@ -186,18 +154,358 @@ onMounted(() => {
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
+<script setup>
|
|
|
+ import { ref, watch, onMounted, computed } from 'vue'
|
|
|
+ import { useI18n } from 'vue-i18n'
|
|
|
+ import { useEmailCountdown } from '@/hooks/useEmailCountdown'
|
|
|
+ import { loginApi } from '@/api/login'
|
|
|
+ import { systemApi } from '@/api/system'
|
|
|
+ import Config from '@/config/index'
|
|
|
+ import { showToast } from '@/utils/toast'
|
|
|
+ import { onLoad } from '@dcloudio/uni-app'
|
|
|
+ import useUserStore from '@/stores/use-user-store'
|
|
|
+ import { userToken } from '@/composables/config'
|
|
|
+ import { userApi } from '@/api/user'
|
|
|
+
|
|
|
+ const { t } = useI18n()
|
|
|
+ const userStore = useUserStore()
|
|
|
+
|
|
|
+ const {
|
|
|
+ time,
|
|
|
+ text: getCodeString,
|
|
|
+ canSend,
|
|
|
+ start,
|
|
|
+ restore,
|
|
|
+ } = useEmailCountdown()
|
|
|
+
|
|
|
+ const isRouteHasId = ref(false)
|
|
|
+ const rule1 = computed(() => {
|
|
|
+ if (!formData.value.password) return false
|
|
|
+ return /^.{8,16}$/.test(formData.value.password)
|
|
|
+ })
|
|
|
+
|
|
|
+ const rule2 = computed(() => {
|
|
|
+ return /^(?=.*?[a-z])(?=.*?[A-Z]).*$/.test(formData.value.password)
|
|
|
+ })
|
|
|
+
|
|
|
+ const rule3 = computed(() => {
|
|
|
+ return /^(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?!.*([~!@&%$^\(\)#_]).*\1.*\1)[A-Za-z0-9~!@&%$^\(\)#_]{8,16}$/.test(
|
|
|
+ formData.value.password,
|
|
|
+ )
|
|
|
+ })
|
|
|
+
|
|
|
+ // 响应式表单数据
|
|
|
+ const formData = ref({
|
|
|
+ country: '',
|
|
|
+ birthDate: '',
|
|
|
+ code: '',
|
|
|
+ password: '',
|
|
|
+ linkValue: '',
|
|
|
+ agentId: null,
|
|
|
+ agentValue: '',
|
|
|
+ readName: '',
|
|
|
+ agree: '',
|
|
|
+ })
|
|
|
+
|
|
|
+ // 检查是否满18周岁
|
|
|
+ const isAgeValid = computed(() => {
|
|
|
+ if (!formData.value.birthDate) {
|
|
|
+ return false // 如果还没选择日期，不允许继续
|
|
|
+ }
|
|
|
+ const today = new Date()
|
|
|
+ const birthDate = new Date(formData.value.birthDate)
|
|
|
+ let age = today.getFullYear() - birthDate.getFullYear()
|
|
|
+ const monthDiff = today.getMonth() - birthDate.getMonth()
|
|
|
+ if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birthDate.getDate())) {
|
|
|
+ age--
|
|
|
+ }
|
|
|
+ return age >= 18
|
|
|
+ })
|
|
|
+
|
|
|
+ // 检查年龄并提示
|
|
|
+ const checkAge = () => {
|
|
|
+ if (formData.value.birthDate && !isAgeValid.value) {
|
|
|
+ uni.showModal({
|
|
|
+ title: t('Msg.SystemPrompt'),
|
|
|
+ content: t('signup.ageRestriction'),
|
|
|
+ showCancel: false,
|
|
|
+ confirmText: t('Btn.Confirm'),
|
|
|
+ success: function(res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ // 用户点击确认后的操作
|
|
|
+ }
|
|
|
+ },
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ const limitAgentIdLength = (val) => {
|
|
|
+ if (val == null || val === '') return
|
|
|
+ // 推荐码只能输入数字和英文
|
|
|
+ const filtered = val.toString().replace(/[^0-9a-zA-Z]/g, '').slice(0, 10)
|
|
|
+ if (formData.value.linkValue !== filtered) {
|
|
|
+ formData.value.linkValue = filtered
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ onLoad((options) => {
|
|
|
+ if (options && options.id) {
|
|
|
+ isRouteHasId.value = true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ const ho = ref('')
|
|
|
+ // 账号类型
|
|
|
+ const accountType = ref(1)
|
|
|
+
|
|
|
+ const form = ref(null)
|
|
|
+ const value = ref('')
|
|
|
+ const mock_options = ref([])
|
|
|
+ const countryCode = ref('')
|
|
|
+ const countryOptions = computed(() => {
|
|
|
+ return mock_options.value.map(item => ({
|
|
|
+ text: item.name,
|
|
|
+ value: item.code,
|
|
|
+ disabled: item.isOpenAccount == 0 || item.isOpenAccount === null ? true : false,
|
|
|
+ }))
|
|
|
+ })
|
|
|
+
|
|
|
+ watch(value, (newValue, oldValue) => {
|
|
|
+ // console.log('v-model', newValue);
|
|
|
+ })
|
|
|
+
|
|
|
+ async function getCountry() {
|
|
|
+ try {
|
|
|
+ let res = await systemApi.countryGet({})
|
|
|
+ if (res.code == 200) { // Code.StatusOK
|
|
|
+ mock_options.value = res.data
|
|
|
+ countryCode.value = res.msg
|
|
|
+ } else {
|
|
|
+ showToast(res.msg)
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error(error)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 获取验证码按钮点击
|
|
|
+ async function handleGetCode() {
|
|
|
+ if (!formData.value.birthDate) {
|
|
|
+ showToast(t('vaildate.birthDate.empty'))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (!isAgeValid.value) {
|
|
|
+ showToast(t('signup.ageRestriction'))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (!formData.value.country) {
|
|
|
+ showToast(t('vaildate.country.empty'))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (!formData.value.email) {
|
|
|
+ showToast(t('vaildate.email.empty'))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (!Config.Pattern.Email.test(formData.value.email)) {
|
|
|
+ showToast(t('vaildate.email.format'))
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!canSend.value) return
|
|
|
+ await sendEmailCode()
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 发送邮箱验证码
|
|
|
+ async function sendEmailCode() {
|
|
|
+ const res = await loginApi.Code({
|
|
|
+ ...formData.value,
|
|
|
+ })
|
|
|
+
|
|
|
+ if (res.code === 200) {
|
|
|
+ showToast(t('Msg.CodeSuccess'))
|
|
|
+ start()
|
|
|
+ return true
|
|
|
+ } else {
|
|
|
+ showToast(t('Msg.CodeFail'))
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
-<style lang="scss"></style>
|
|
|
-<style lang="scss" scoped>
|
|
|
-@import "@/uni.scss";
|
|
|
|
|
|
-.regist-page {
|
|
|
- height: 100vh;
|
|
|
- border: none;
|
|
|
- padding: 0;
|
|
|
+ const register = async () => {
|
|
|
+ if (countryCode.value == 'MY' || countryCode.value == 'ID') {
|
|
|
+ status.value = true
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ form.value.validate().then(async (res) => {
|
|
|
+
|
|
|
+
|
|
|
+ // 中国（含港澳台）使用 X-System: B，非中国使用 X-System: A
|
|
|
+ const chinaCountryCodes = ['CN']
|
|
|
+ const isChina = chinaCountryCodes.includes(formData.value.country)
|
|
|
+ const xSystemValue = isChina ? 'B' : 'A'
|
|
|
+
|
|
|
+ try {
|
|
|
+ let resData = await loginApi.Register(
|
|
|
+ { ...formData.value },
|
|
|
+ { headers: { 'X-System': xSystemValue } },
|
|
|
+ )
|
|
|
+ if (resData.code == 200) { // Code.StatusOK
|
|
|
+ showToast(t('Msg.registerSuc'))
|
|
|
+ login()
|
|
|
+ } else {
|
|
|
+ showToast(resData.msg)
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error(error)
|
|
|
+ }
|
|
|
+ }).catch(err => {
|
|
|
+ console.log('表单错误信息：', err)
|
|
|
+ return false
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ const login = async () => {
|
|
|
+ try {
|
|
|
+ let res = await userApi.login({
|
|
|
+ loginName: formData.value.email,
|
|
|
+ password: formData.value.password,
|
|
|
+ })
|
|
|
+ if (res.code == 200) { // Code.StatusOK
|
|
|
+ userToken.value = res.data
|
|
|
+ getLoginInfo()
|
|
|
+ } else {
|
|
|
+ showToast(res.msg)
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error(error)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ const getLoginInfo = async () => {
|
|
|
+ try {
|
|
|
+ let res = await userApi.getUserInfo()
|
|
|
+ if (res.code == 200) { // Code.StatusOK
|
|
|
+ userStore.saveUserInfo(res.data)
|
|
|
+ showToast(t('Msg.LoginSuccess'))
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '/pages/customer/index'
|
|
|
+ })
|
|
|
+ // this.$store.commit("isActiveTab", "0"); (可能需要适配相应的逻辑)
|
|
|
+ }, 1000)
|
|
|
+ } else {
|
|
|
+ showToast(t('Msg.SystemError'))
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error(error)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
+ getCountry()
|
|
|
+ const hostParts = window.location.host.split('.')
|
|
|
+ ho.value = hostParts.length > 1 ? hostParts[1] : ''
|
|
|
+ })
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+
|
|
|
+<style lang="scss"> .pwd {
|
|
|
+ list-style: none;
|
|
|
+ padding-left: 0;
|
|
|
+ margin: 0;
|
|
|
+
|
|
|
+ li {
|
|
|
+ font-size: px2rpx(12);
|
|
|
+ color: #999;
|
|
|
+ line-height: px2rpx(20);
|
|
|
+ position: relative;
|
|
|
+ padding-left: px2rpx(16);
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 50%;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ width: px2rpx(6);
|
|
|
+ height: px2rpx(6);
|
|
|
+ border-radius: 50%;
|
|
|
+ background-color: #999;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.fit {
|
|
|
+ color: #67c23a;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ background-color: #67c23a;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
+</style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ @import "@/uni.scss";
|
|
|
|
|
|
-.content {
|
|
|
+ :deep(uni-content) {
|
|
|
+ padding-left: 0 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .regist-page {
|
|
|
+ height: 100vh;
|
|
|
+ border: none;
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .regist-content {
|
|
|
+ width: 100vw;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content {
|
|
|
+ width: px2rpx(650);
|
|
|
+ margin: 0 auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .regist-header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: flex-end;
|
|
|
+ margin: px2rpx(40) 0 px2rpx(20);
|
|
|
+ padding-bottom: px2rpx(10);
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: px2rpx(28);
|
|
|
+ font-weight: bold;
|
|
|
+ color: #141d22;
|
|
|
+ line-height: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ .login-link {
|
|
|
+ font-size: px2rpx(14);
|
|
|
+ color: #141d22;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ line-height: 1;
|
|
|
+
|
|
|
+ .text {
|
|
|
+ margin-right: px2rpx(4);
|
|
|
+ }
|
|
|
+
|
|
|
+ .link {
|
|
|
+ color: #005bbb;
|
|
|
+ text-decoration: none;
|
|
|
+ border-bottom: 1px dashed #005bbb;
|
|
|
+ padding-bottom: 2px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
//display: flex;
|
|
|
.logo {
|
|
|
@@ -208,6 +516,11 @@ onMounted(() => {
|
|
|
justify-content: center;
|
|
|
}
|
|
|
|
|
|
+ .agreemnet9 {
|
|
|
+ text-align: initial;
|
|
|
+ color: #e61f1e;
|
|
|
+ }
|
|
|
+
|
|
|
.company-icon {
|
|
|
width: px2rpx(234);
|
|
|
}
|
|
|
@@ -237,142 +550,151 @@ onMounted(() => {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
|
|
|
-.formStyle {
|
|
|
- height: px2rpx(40);
|
|
|
-}
|
|
|
|
|
|
-.account-tip {
|
|
|
- width: 100%;
|
|
|
- text-align: center;
|
|
|
- margin: px2rpx(30) 0;
|
|
|
+ .formStyle {
|
|
|
+ height: px2rpx(40);
|
|
|
+ }
|
|
|
|
|
|
- .title {
|
|
|
- font-size: px2rpx(26);
|
|
|
- font-weight: bold;
|
|
|
+ .account-tip {
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ margin: px2rpx(30) 0;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: px2rpx(26);
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tip {
|
|
|
+ margin-top: px2rpx(5);
|
|
|
+ color: var(--gray);
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- .tip {
|
|
|
- margin-top: px2rpx(5);
|
|
|
- color: var(--gray);
|
|
|
+ .formContent {
|
|
|
+ padding: 0 10px;
|
|
|
}
|
|
|
-}
|
|
|
|
|
|
-.formContent {
|
|
|
- padding: 0 10px;
|
|
|
-}
|
|
|
+ // 修改表单组件高度。
|
|
|
+ :deep(.uni-stat-box) {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
|
|
|
-// 修改表单组件高度。
|
|
|
-:deep(.uni-stat-box) {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
+ :deep(.uni-select) {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
|
|
|
-:deep(.uni-select) {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
+ :deep(.uni-easyinput__content) {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
|
|
|
-:deep(.uni-easyinput__content) {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
+ :deep(.uni-date-editor) {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
|
|
|
-:deep(.uni-date-editor) {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
+ :deep(.uni-date-editor--x) {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
|
|
|
-:deep(.uni-date-editor--x) {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
+ .btn-code {
|
|
|
+ width: 30%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #102047;
|
|
|
+ border: 1px solid #f0f0f0;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ line-height: px2rpx(40);
|
|
|
+ border-radius: 0 4px 4px 0;
|
|
|
+ }
|
|
|
|
|
|
-.btn-code {
|
|
|
- width: 30%;
|
|
|
- height: 100%;
|
|
|
- background-color: #102047;
|
|
|
- border: 1px solid #f0f0f0;
|
|
|
- color: #fff;
|
|
|
- text-align: center;
|
|
|
- line-height: px2rpx(40);
|
|
|
- border-radius: 0 4px 4px 0;
|
|
|
-}
|
|
|
+ .check-box {
|
|
|
+ padding: 0 px2rpx(10);
|
|
|
+ margin-bottom: px2rpx(10);
|
|
|
|
|
|
-.check-box {
|
|
|
- padding: 0 px2rpx(10);
|
|
|
- margin-bottom: px2rpx(10);
|
|
|
+ :deep(.u-checkbox) {
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-start;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- :deep(.u-checkbox) {
|
|
|
- display: flex;
|
|
|
- align-items: flex-start;
|
|
|
+ .regiset-btn {
|
|
|
+ width: 100%;
|
|
|
+ height: px2rpx(40);
|
|
|
+ border-radius: px2rpx(4);
|
|
|
+ background-color: #ffde02;
|
|
|
+ color: #333;
|
|
|
+ font-weight: bold;
|
|
|
}
|
|
|
-}
|
|
|
|
|
|
-.regiset-btn {
|
|
|
- width: 100%;
|
|
|
- height: px2rpx(40);
|
|
|
- border-radius: px2rpx(20);
|
|
|
- background-color: #DE002D;
|
|
|
- color: #fff;
|
|
|
- font-weight: bold;
|
|
|
-}
|
|
|
+ .or-title {
|
|
|
+ font-size: px2rpx(16);
|
|
|
+ line-height: 1.5;
|
|
|
+ color: #333;
|
|
|
+ font-weight: 500;
|
|
|
+ text-align: center;
|
|
|
+ margin: px2rpx(20) 0 px2rpx(18) 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
|
|
|
-.or-title {
|
|
|
- font-size: px2rpx(16);
|
|
|
- line-height: 1.5;
|
|
|
- color: #333;
|
|
|
- font-weight: 500;
|
|
|
- text-align: center;
|
|
|
- margin: px2rpx(20) 0 px2rpx(18) 0;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
+ .line {
|
|
|
+ flex: 1;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #e4e4e4;
|
|
|
+ }
|
|
|
|
|
|
- .line {
|
|
|
- flex: 1;
|
|
|
- height: 1px;
|
|
|
- background-color: #e4e4e4;
|
|
|
+ .qr-tit2 {
|
|
|
+ margin: 0 px2rpx(12);
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- .qr-tit2 {
|
|
|
- margin: 0 px2rpx(12);
|
|
|
+ .login-btn {
|
|
|
+ width: 100%;
|
|
|
+ height: px2rpx(40);
|
|
|
+ border-radius: px2rpx(20);
|
|
|
+ background-color: #1EBF42;
|
|
|
+ color: #fff;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: px2rpx(20);
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
-.login-btn {
|
|
|
- width: 100%;
|
|
|
- height: px2rpx(40);
|
|
|
- border-radius: px2rpx(20);
|
|
|
- background-color: #1EBF42;
|
|
|
- color: #fff;
|
|
|
- font-weight: bold;
|
|
|
- margin-bottom: px2rpx(20);
|
|
|
-}
|
|
|
|
|
|
-.code-text {
|
|
|
- padding-right: px2rpx(20);
|
|
|
-}
|
|
|
+ .code-text {
|
|
|
+ padding-right: px2rpx(20);
|
|
|
+ }
|
|
|
+ .des-bottom{
|
|
|
+ margin-top: px2rpx(20);
|
|
|
+ line-height: 20px;
|
|
|
+ color: #000;
|
|
|
+ font-size: 12px;
|
|
|
+ a {
|
|
|
+ color: #e61f1e;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
-.des {
|
|
|
- width: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- text-align: start;
|
|
|
- line-height: 20px;
|
|
|
- color: #000;
|
|
|
- font-size: 12px;
|
|
|
- padding: px2rpx(20) px2rpx(30);
|
|
|
+ .des {
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: start;
|
|
|
+ line-height: 20px;
|
|
|
+ color: #000;
|
|
|
+ font-size: 12px;
|
|
|
+ padding: px2rpx(20) px2rpx(30);
|
|
|
+
|
|
|
+ //display: none;
|
|
|
+ :nth-child(n) {
|
|
|
+ display: inline;
|
|
|
+ word-break: break-all;
|
|
|
+ word-wrap: break-word;
|
|
|
+ }
|
|
|
|
|
|
- //display: none;
|
|
|
- :nth-child(n) {
|
|
|
- display: inline;
|
|
|
- word-break: break-all;
|
|
|
- word-wrap: break-word;
|
|
|
+ a {
|
|
|
+ color: #e61f1e;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- a {
|
|
|
- color: #e61f1e;
|
|
|
+ :deep(.u-text__value) {
|
|
|
+ color: #ea002a !important;
|
|
|
+ font-size: px2rpx(14) !important;
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
-:deep(.u-text__value) {
|
|
|
- color: #ea002a !important;
|
|
|
- font-size: px2rpx(14) !important;
|
|
|
-}
|
|
|
</style>
|
