|
|
@@ -1,282 +1,336 @@
|
|
|
<template>
|
|
|
<view class="container">
|
|
|
- <view class="container_text" >
|
|
|
+ <view class="container_text">
|
|
|
<image class="banner-img" src="/static/img/shouye1.png" mode="scaleToFill"></image>
|
|
|
</view>
|
|
|
<view class="loginTitle"><text>{{$t('login.a0')}}</text></view>
|
|
|
<view class="login_text">
|
|
|
<view class="login_input flex">
|
|
|
- <view class="login_img"><image src="/static/icon/img03.png"></image></view>
|
|
|
- <view class="login_name"><input class="uni-input" v-model="account" focus :placeholder="$t('login.a1')" /></view>
|
|
|
+ <view class="login_img">
|
|
|
+ <image src="/static/icon/img03.png"></image>
|
|
|
+ </view>
|
|
|
+ <view class="login_name"><input class="uni-input" v-model="account" focus
|
|
|
+ :placeholder="$t('login.a1')" /></view>
|
|
|
</view>
|
|
|
<view class="login_input flex">
|
|
|
- <view class="login_img"><image src="/static/icon/img04.png"></image></view>
|
|
|
- <view class="login_name"><input class="uni-input" type="password" v-model="password" focus :placeholder="$t('login.a3')" /></view>
|
|
|
+ <view class="login_img">
|
|
|
+ <image src="/static/icon/img04.png"></image>
|
|
|
+ </view>
|
|
|
+ <view class="login_name"><input class="uni-input" type="password" v-model="password" focus
|
|
|
+ :placeholder="$t('login.a3')" /></view>
|
|
|
</view>
|
|
|
<view class="login_input flex">
|
|
|
- <view class="login_img"><image src="/static/icon/img04.png"></image></view>
|
|
|
- <view class="login_name"><input class="uni-input" type="password" v-model="trade_password" focus :placeholder="$t('login.b3')" /></view>
|
|
|
+ <view class="login_img">
|
|
|
+ <image src="/static/icon/img04.png"></image>
|
|
|
+ </view>
|
|
|
+ <view class="login_name"><input class="uni-input" type="password" v-model="trade_password" focus
|
|
|
+ :placeholder="$t('login.b3')" /></view>
|
|
|
</view>
|
|
|
<view class="login_input flex">
|
|
|
- <view class="login_img"><image src="/static/icon/img07.png"></image></view>
|
|
|
- <view class="login_name"><input class="uni-input" type="text" v-model="spread" focus :placeholder="$t('login.b4')" /></view>
|
|
|
+ <view class="login_img">
|
|
|
+ <image src="/static/icon/img07.png"></image>
|
|
|
+ </view>
|
|
|
+ <view class="login_name"><input class="uni-input" type="text" v-model="spread" focus
|
|
|
+ :placeholder="$t('login.b4')" /></view>
|
|
|
</view>
|
|
|
<view class="login_input flex">
|
|
|
- <view class="login_img"><image src="/static/icon/img06.png"></image></view>
|
|
|
+ <view class="login_img">
|
|
|
+ <image src="/static/icon/img06.png"></image>
|
|
|
+ </view>
|
|
|
<view class="login_name flex">
|
|
|
<input class="uni-input width" v-model="captcha" focus :placeholder="$t('login.b6')" />
|
|
|
<view class="code" @click="verification">{{ countDown == 0 ? $t('login.b5') : countDown }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view><button type="green" @click="register" class="uni-button uni-button-green">{{$t('login.a7')}}</button></view>
|
|
|
- <view><button class="uni-button uni-button-green uni-button-green-plain" type="green" plain="true" hover-class="none" @click="login">{{$t('login.a4')}}</button></view>
|
|
|
+ <view><button type="green" @click="register" class="uni-button uni-button-green">{{$t('login.a7')}}</button>
|
|
|
+ </view>
|
|
|
+ <view><button class="uni-button uni-button-green uni-button-green-plain" type="green" plain="true"
|
|
|
+ hover-class="none" @click="login">{{$t('login.a4')}}</button></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { register, verify } from '@/api/login.js';
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- // phone: '', //用户
|
|
|
- account: '', //用户
|
|
|
- password: '', //密码
|
|
|
- repassword: '',
|
|
|
- // invitation: '', //邀请码
|
|
|
- spread: '', //邀请码
|
|
|
- captcha: '', //验证码
|
|
|
- time: '', //保存倒计时对象
|
|
|
- countDown: 0 ,//倒计时
|
|
|
- trade_password: '', // 交易密码
|
|
|
- };
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- // 获取扫码邀请人id
|
|
|
- this.spread = uni.getStorageSync('spread')||'';
|
|
|
- },
|
|
|
- watch: {
|
|
|
- // 监听倒计时
|
|
|
- countDown(i) {
|
|
|
- if (i == 0) {
|
|
|
- clearInterval(this.time);
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 注册
|
|
|
- register() {
|
|
|
- let obj = this;
|
|
|
- if (obj.account == '') {
|
|
|
- obj.$api.msg('请输入电话号码');
|
|
|
- return;
|
|
|
- }
|
|
|
- if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(this.account)) {
|
|
|
- obj.$api.msg('请输入正确的手机号');
|
|
|
- return;
|
|
|
- }
|
|
|
- if (obj.password == '') {
|
|
|
- obj.$api.msg('请输入密码');
|
|
|
- return;
|
|
|
- }
|
|
|
- if (obj.trade_password == '') {
|
|
|
- obj.$api.msg('请输入交易密码');
|
|
|
- return;
|
|
|
+ import {
|
|
|
+ register,
|
|
|
+ verify
|
|
|
+ } from '@/api/login.js';
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ // phone: '', //用户
|
|
|
+ account: '', //用户
|
|
|
+ password: '', //密码
|
|
|
+ repassword: '',
|
|
|
+ // invitation: '', //邀请码
|
|
|
+ spread: '', //邀请码
|
|
|
+ captcha: '', //验证码
|
|
|
+ time: '', //保存倒计时对象
|
|
|
+ countDown: 0, //倒计时
|
|
|
+ trade_password: '', // 交易密码
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ // #ifndef MP
|
|
|
+ if (option.spread) {
|
|
|
+ // 存储其他邀请人
|
|
|
+ uni.setStorageSync('spread', option.spread);
|
|
|
}
|
|
|
-
|
|
|
- register({
|
|
|
- account: obj.account, //账号
|
|
|
- captcha: obj.captcha, //验证码
|
|
|
- password: obj.password ,//密码
|
|
|
- trade_password: obj.trade_password, // 交易密码
|
|
|
- spread:this.spread//上级推广人
|
|
|
- }).then(function(e) {
|
|
|
- uni.showToast({
|
|
|
- title:'注册成功',
|
|
|
- duration:2000,
|
|
|
- position:'top'
|
|
|
+ // #endif
|
|
|
+ // #ifdef MP
|
|
|
+ if (option.scene) {
|
|
|
+ // 存储小程序邀请人
|
|
|
+ uni.setStorage({
|
|
|
+ key: 'spread_code',
|
|
|
+ data: option.scene
|
|
|
});
|
|
|
- setTimeout(function () {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/public/login'
|
|
|
- });
|
|
|
- },1000)
|
|
|
-
|
|
|
- });
|
|
|
- //调用注册接口，成功跳转登录页
|
|
|
- },
|
|
|
- //发送验证码
|
|
|
- verification() {
|
|
|
- let obj = this;
|
|
|
- if (this.account == '') {
|
|
|
- this.$api.msg('请输入电话号码');
|
|
|
- return;
|
|
|
}
|
|
|
- if (this.account.length < 11) {
|
|
|
- this.$api.msg('请输入正确的手机号');
|
|
|
- return;
|
|
|
+ // #endif
|
|
|
+ // 获取扫码邀请人id
|
|
|
+ this.spread = option.spread||uni.getStorageSync('spread') || '';
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ // 监听倒计时
|
|
|
+ countDown(i) {
|
|
|
+ if (i == 0) {
|
|
|
+ clearInterval(this.time);
|
|
|
+ }
|
|
|
}
|
|
|
- // 判断是否在倒计时
|
|
|
- if (obj.countDown > 0) {
|
|
|
- return false;
|
|
|
- } else {
|
|
|
- obj.countDown = 60;
|
|
|
- obj.time = setInterval(() => {
|
|
|
- obj.countDown--;
|
|
|
- }, 1000);
|
|
|
- //调用验证码接口
|
|
|
- verify({
|
|
|
- phone: obj.account,
|
|
|
- type: 'register'
|
|
|
- })
|
|
|
- .then(({ data }) => {})
|
|
|
- .catch(err => {
|
|
|
- console.log(err);
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 注册
|
|
|
+ register() {
|
|
|
+ let obj = this;
|
|
|
+ if (obj.account == '') {
|
|
|
+ obj.$api.msg('请输入电话号码');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(this.account)) {
|
|
|
+ obj.$api.msg('请输入正确的手机号');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.password == '') {
|
|
|
+ obj.$api.msg('请输入密码');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.trade_password == '') {
|
|
|
+ obj.$api.msg('请输入交易密码');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ register({
|
|
|
+ account: obj.account, //账号
|
|
|
+ captcha: obj.captcha, //验证码
|
|
|
+ password: obj.password, //密码
|
|
|
+ trade_password: obj.trade_password, // 交易密码
|
|
|
+ spread: this.spread //上级推广人
|
|
|
+ }).then(function(e) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '注册成功',
|
|
|
+ duration: 2000,
|
|
|
+ position: 'top'
|
|
|
});
|
|
|
+ setTimeout(function() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/public/login'
|
|
|
+ });
|
|
|
+ }, 1000)
|
|
|
+
|
|
|
+ });
|
|
|
+ //调用注册接口，成功跳转登录页
|
|
|
+ },
|
|
|
+ //发送验证码
|
|
|
+ verification() {
|
|
|
+ let obj = this;
|
|
|
+ if (this.account == '') {
|
|
|
+ this.$api.msg('请输入电话号码');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (this.account.length < 11) {
|
|
|
+ this.$api.msg('请输入正确的手机号');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 判断是否在倒计时
|
|
|
+ if (obj.countDown > 0) {
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ obj.countDown = 60;
|
|
|
+ obj.time = setInterval(() => {
|
|
|
+ obj.countDown--;
|
|
|
+ }, 1000);
|
|
|
+ //调用验证码接口
|
|
|
+ verify({
|
|
|
+ phone: obj.account,
|
|
|
+ type: 'register'
|
|
|
+ })
|
|
|
+ .then(({
|
|
|
+ data
|
|
|
+ }) => {})
|
|
|
+ .catch(err => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ login() {
|
|
|
+ //返回登录
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/public/login'
|
|
|
+ });
|
|
|
}
|
|
|
- },
|
|
|
- login() {
|
|
|
- //返回登录
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/public/login'
|
|
|
- });
|
|
|
}
|
|
|
- }
|
|
|
-};
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
-page {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-.container {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- background-size: 100%;
|
|
|
- background-color: #000000;
|
|
|
-}
|
|
|
-.container_text {
|
|
|
- width: 100%;
|
|
|
- height: 500rpx;
|
|
|
- top: 0rpx;
|
|
|
- .banner-img {
|
|
|
- width: 144rpx;
|
|
|
- height: 144rpx;
|
|
|
- margin-top: 100rpx;
|
|
|
- margin-left: 302rpx;
|
|
|
+ page {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .container {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-size: 100%;
|
|
|
+ background-color: #000000;
|
|
|
}
|
|
|
-}
|
|
|
-.login_text {
|
|
|
- margin: auto 30rpx;
|
|
|
- position: relative;
|
|
|
- padding: 100rpx 102rpx;
|
|
|
- background-color: #000000;
|
|
|
- margin-top: -180rpx;
|
|
|
- border-radius: 20rpx;
|
|
|
- .login_input {
|
|
|
- border-bottom: 1px solid #f0f0f0;
|
|
|
- margin-bottom: 65rpx;
|
|
|
- .login_img image {
|
|
|
- height: 35rpx;
|
|
|
- width: 29rpx;
|
|
|
- margin-right: 20rpx;
|
|
|
+
|
|
|
+ .container_text {
|
|
|
+ width: 100%;
|
|
|
+ height: 500rpx;
|
|
|
+ top: 0rpx;
|
|
|
+
|
|
|
+ .banner-img {
|
|
|
+ width: 144rpx;
|
|
|
+ height: 144rpx;
|
|
|
+ margin-top: 100rpx;
|
|
|
+ margin-left: 302rpx;
|
|
|
}
|
|
|
- .uni-input {
|
|
|
- text-align: left;
|
|
|
- width: 470rpx;
|
|
|
- font-size: 28rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .login_text {
|
|
|
+ margin: auto 30rpx;
|
|
|
+ position: relative;
|
|
|
+ padding: 100rpx 102rpx;
|
|
|
+ background-color: #000000;
|
|
|
+ margin-top: -180rpx;
|
|
|
+ border-radius: 20rpx;
|
|
|
+
|
|
|
+ .login_input {
|
|
|
+ border-bottom: 1px solid #f0f0f0;
|
|
|
+ margin-bottom: 65rpx;
|
|
|
+
|
|
|
+ .login_img image {
|
|
|
+ height: 35rpx;
|
|
|
+ width: 29rpx;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-input {
|
|
|
+ text-align: left;
|
|
|
+ width: 470rpx;
|
|
|
+ font-size: 28rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .login_name {
|
|
|
+ color: #FFFFFF;
|
|
|
+ // width: 640rpx;
|
|
|
+ // height: 99rpx;
|
|
|
+ // background: #FFFFFF;
|
|
|
+ // opacity: 0.1;
|
|
|
+ // border-radius: 50rpx;
|
|
|
+ }
|
|
|
}
|
|
|
- .login_name {
|
|
|
- color: #FFFFFF;
|
|
|
- // width: 640rpx;
|
|
|
- // height: 99rpx;
|
|
|
- // background: #FFFFFF;
|
|
|
- // opacity: 0.1;
|
|
|
- // border-radius: 50rpx;
|
|
|
+
|
|
|
+ .other {
|
|
|
+ margin-top: 60rpx;
|
|
|
+
|
|
|
+ .fenge {
|
|
|
+ width: 30%;
|
|
|
+ height: 2rpx;
|
|
|
+ background-color: #eeeeee;
|
|
|
+ }
|
|
|
+
|
|
|
+ .qita {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .other {
|
|
|
- margin-top: 60rpx;
|
|
|
- .fenge {
|
|
|
- width: 30%;
|
|
|
- height: 2rpx;
|
|
|
- background-color: #eeeeee;
|
|
|
+ .weixin {
|
|
|
+ width: 75rpx;
|
|
|
+ height: 75rpx;
|
|
|
+ margin: 25rpx auto;
|
|
|
}
|
|
|
- .qita {
|
|
|
+
|
|
|
+ .weixin image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .weixin_text {
|
|
|
+ text-align: center;
|
|
|
font-size: 28rpx;
|
|
|
color: #999999;
|
|
|
}
|
|
|
+
|
|
|
+ .forget {
|
|
|
+ font-size: 28rpx;
|
|
|
+ width: 100%;
|
|
|
+ text-align: right;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-button-green {
|
|
|
+ color: #ffffff;
|
|
|
+ background-color: #feb041;
|
|
|
+ margin: 40rpx 10rpx;
|
|
|
+ border-radius: 50rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-button-green-plain {
|
|
|
+ border: 1px solid #feb041;
|
|
|
+ margin: 40rpx 10rpx;
|
|
|
+ border-radius: 50rpx;
|
|
|
+ color: #feb041;
|
|
|
+ background-color: #000000;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-button {
|
|
|
+ height: 85rpx;
|
|
|
+ line-height: 85rpx;
|
|
|
+ }
|
|
|
}
|
|
|
- .weixin {
|
|
|
- width: 75rpx;
|
|
|
- height: 75rpx;
|
|
|
- margin: 25rpx auto;
|
|
|
- }
|
|
|
- .weixin image {
|
|
|
+
|
|
|
+ .loginTitle {
|
|
|
+ position: absolute;
|
|
|
+ top: 250rpx;
|
|
|
width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- .weixin_text {
|
|
|
text-align: center;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #999999;
|
|
|
+ color: #c6a674;
|
|
|
+ font-size: 40rpx;
|
|
|
}
|
|
|
+
|
|
|
.forget {
|
|
|
- font-size: 28rpx;
|
|
|
- width: 100%;
|
|
|
- text-align: right;
|
|
|
- color: #999999;
|
|
|
+ width: 100rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #ffffff;
|
|
|
+ margin: 0px auto;
|
|
|
+ border-bottom: 1px solid #ffffff;
|
|
|
}
|
|
|
|
|
|
- .uni-button-green {
|
|
|
- color: #ffffff;
|
|
|
- background-color: #feb041;
|
|
|
- margin: 40rpx 10rpx;
|
|
|
- border-radius: 50rpx;
|
|
|
+ .width {
|
|
|
+ width: 325rpx !important;
|
|
|
}
|
|
|
- .uni-button-green-plain {
|
|
|
- border: 1px solid #feb041;
|
|
|
- margin: 40rpx 10rpx;
|
|
|
- border-radius: 50rpx;
|
|
|
+
|
|
|
+ .code {
|
|
|
color: #feb041;
|
|
|
- background-color: #000000;
|
|
|
- }
|
|
|
- .uni-button {
|
|
|
- height: 85rpx;
|
|
|
- line-height: 85rpx;
|
|
|
+ font-size: 23rpx;
|
|
|
+ border-left: 1px solid #eeeeee;
|
|
|
+ width: 150rpx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
-}
|
|
|
-.loginTitle {
|
|
|
- position: absolute;
|
|
|
- top: 250rpx;
|
|
|
- width: 100%;
|
|
|
- text-align: center;
|
|
|
- color:#c6a674;
|
|
|
- font-size: 40rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.forget {
|
|
|
- width: 100rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #ffffff;
|
|
|
- margin: 0px auto;
|
|
|
- border-bottom: 1px solid #ffffff;
|
|
|
-}
|
|
|
-.width {
|
|
|
- width: 325rpx !important;
|
|
|
-}
|
|
|
-.code {
|
|
|
- color: #feb041;
|
|
|
- font-size: 23rpx;
|
|
|
- border-left: 1px solid #eeeeee;
|
|
|
- width: 150rpx;
|
|
|
- flex-shrink: 0;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-uni-button {
|
|
|
- height: 80rpx !important;
|
|
|
- line-height: 80rpx !important;
|
|
|
-}
|
|
|
-
|
|
|
-</style>
|
|
|
|
|
|
+ uni-button {
|
|
|
+ height: 80rpx !important;
|
|
|
+ line-height: 80rpx !important;
|
|
|
+ }
|
|
|
+</style>
|
