forked from zhongyuanhaiju/uniapp
1007 lines
29 KiB
Vue
1007 lines
29 KiB
Vue
<template>
|
|
<view>
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<view @touchmove.prevent.stop class="new-complete-info-popup" :style="{ '--background-image-': 'url('+ $util.img('public/static/img/login_bg.jpg') +')' }">
|
|
<uni-popup ref="completeInfoPopup" type="center" :maskClick="true" @change="popupChange">
|
|
<view class="new-complete-info-wrap">
|
|
<!--登录主要内容-->
|
|
<view class="login-content">
|
|
<!--登录注册按钮-->
|
|
<view class="login-buttons">
|
|
<button class="mini-btn" type="default" size="mini" @click="promiseRegisterShow">我要注册</button>
|
|
<button class="mini-btn" type="primary" size="mini" @click="promiseLogin">我要登录</button>
|
|
</view>
|
|
<!-- 取消 -->
|
|
<view class="login-cancel-button">
|
|
<button class="mini-btn" type="default" size="mini" @click="$refs.completeInfoPopup.close()">取消</button>
|
|
</view>
|
|
</view>
|
|
<!--小程序授权信息-->
|
|
<view @touchmove.prevent.stop class="complete-info-popup">
|
|
<uni-popup ref="subCompleteInfoPopup" type="bottom" :maskClick="true">
|
|
<view class="complete-info-wrap">
|
|
<view class="head">
|
|
<text class="title">
|
|
获取您的昵称、头像
|
|
<template v-if="forceBindingMobileControl">
|
|
、手机号
|
|
</template>
|
|
</text>
|
|
<text class="color-tip tips">
|
|
获取用户头像、昵称
|
|
<template v-if="forceBindingMobileControl">
|
|
、手机号
|
|
</template>
|
|
完善个人资料，主要用于向用户提供具有辨识度的用户中心界面
|
|
</text>
|
|
<text class="iconfont icon-close color-tip" @click="cancelCompleteInfo"></text>
|
|
</view>
|
|
<view class="item-wrap">
|
|
<text class="label">头像</text>
|
|
<button open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
|
|
<image :src="avatarUrl ? avatarUrl : $util.getDefaultImage().head" @error="avatarUrl = $util.getDefaultImage().head" mode="aspectFill"></image>
|
|
<text class="iconfont icon-right color-tip"></text>
|
|
</button>
|
|
</view>
|
|
<view class="item-wrap">
|
|
<text class="label">昵称</text>
|
|
<input type="nickname" placeholder="请输入昵称" v-model="nickName" @blur="blurNickName" maxlength="50" />
|
|
</view>
|
|
<view class="item-wrap" v-if="forceBindingMobileControl">
|
|
<text class="label">手机号</text>
|
|
<button open-type="getPhoneNumber" class="auth-login" @getphonenumber="getPhoneNumber">
|
|
<text class="mobile" v-if="formData.mobile">{{ formData.mobile }}</text>
|
|
<text class="color-base-text" v-else>获取手机号</text>
|
|
</button>
|
|
</view>
|
|
<button type="default" class="save-btn" @click="saveMp" :disabled="isDisabled">保存</button>
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
<!--注册时 承诺书填写弹框-->
|
|
<view @touchmove.prevent.stop class="complete-info-popup">
|
|
<uni-popup ref="registerPopup" type="bottom" :maskClick="true">
|
|
<view class="complete-info-wrap">
|
|
<view class="head">
|
|
<!--承诺书相关操作-->
|
|
<view class="promise-block">
|
|
<textarea v-model="promise_text" class="promise-textarea" placeholder-style="color: #e04242" placeholder="请输入以下承诺内容！" auto-height/>
|
|
<view class="promise-content">
|
|
<view class="promise-text">
|
|
<span class="promise-text-title">承诺内容：</span>
|
|
{{ registerConfig.promise }}
|
|
<span class="promise-copy-button" @click="$util.copy(registerConfig.promise)">[复制]</span>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--同意协议-->
|
|
<view class="agreement">
|
|
<checkbox-group @change="checkboxChange">
|
|
<label>
|
|
<checkbox value="agree" style="transform: scale(0.8)"/>同意并且接受如上段落的注册协议
|
|
</label>
|
|
</checkbox-group>
|
|
</view>
|
|
<!--改变按钮-->
|
|
<text class="iconfont icon-close color-tip" @click="$refs.registerPopup.close()"></text>
|
|
</view>
|
|
<!--确认按钮-->
|
|
<button type="primary" class="save-btn" @click="promiseRegister">注册</button>
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
<!-- #endif -->
|
|
|
|
|
|
<!-- #ifndef MP-WEIXIN -->
|
|
<!-- 完善会员资料 -->
|
|
<view @touchmove.prevent.stop class="complete-info-popup">
|
|
<uni-popup ref="completeInfoPopup" type="bottom" :maskClick="true">
|
|
<view class="complete-info-wrap">
|
|
<!-- #ifdef H5 -->
|
|
<template v-if="forceBindingMobileControl">
|
|
<view class="head">
|
|
<text class="title">检测到您还未绑定手机号</text>
|
|
<text class="color-tip tips">为了方便您接收订单等信息，需要绑定手机号</text>
|
|
<text class="iconfont icon-close color-tip" @click="cancelCompleteInfo"></text>
|
|
</view>
|
|
<view class="item-wrap">
|
|
<text class="label">手机号</text>
|
|
<input type="number" placeholder="请输入手机号" v-model="formData.mobile" maxlength="11" />
|
|
</view>
|
|
<view class="item-wrap" v-if="captchaConfig">
|
|
<text class="label">验证码</text>
|
|
<input type="number" placeholder="请输入验证码" v-model="formData.vercode" maxlength="4" />
|
|
<image :src="captcha.img" class="captcha" @click="getCaptcha"></image>
|
|
</view>
|
|
<view class="item-wrap">
|
|
<text class="label">动态码</text>
|
|
<input type="number" placeholder="请输入动态码" v-model="formData.dynacode" maxlength="4" />
|
|
<view class="send color-base-text" @click="sendMobileCode">{{ dynacodeData.codeText }}</view>
|
|
</view>
|
|
</template>
|
|
<button type="default" class="save-btn" @click="saveH5" :disabled="isDisabled">保存</button>
|
|
<!-- #endif -->
|
|
|
|
<!-- #ifdef MP-QQ || MP-BAIDU -->
|
|
<view class="head">
|
|
<text class="title">
|
|
获取您的昵称、头像
|
|
<template v-if="forceBindingMobileControl">
|
|
、手机号
|
|
</template>
|
|
</text>
|
|
<text class="color-tip tips">
|
|
获取用户头像、昵称
|
|
<template v-if="forceBindingMobileControl">
|
|
、手机号
|
|
</template>
|
|
完善个人资料，主要用于向用户提供具有辨识度的用户中心界面
|
|
</text>
|
|
<text class="iconfont icon-close color-tip" @click="cancelCompleteInfo"></text>
|
|
</view>
|
|
<view class="item-wrap">
|
|
<text class="label">头像</text>
|
|
<button open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
|
|
<image :src="avatarUrl ? avatarUrl : $util.getDefaultImage().head" @error="avatarUrl = $util.getDefaultImage().head" mode="aspectFill"></image>
|
|
<text class="iconfont icon-right color-tip"></text>
|
|
</button>
|
|
</view>
|
|
<view class="item-wrap">
|
|
<text class="label">昵称</text>
|
|
<input type="nickname" placeholder="请输入昵称" v-model="nickName" @blur="blurNickName" maxlength="50" />
|
|
</view>
|
|
<view class="item-wrap" v-if="forceBindingMobileControl">
|
|
<text class="label">手机号</text>
|
|
<button open-type="getPhoneNumber" class="auth-login" @getphonenumber="getPhoneNumber">
|
|
<text class="mobile" v-if="formData.mobile">{{ formData.mobile }}</text>
|
|
<text class="color-base-text" v-else>获取手机号</text>
|
|
</button>
|
|
</view>
|
|
<button type="default" class="save-btn" @click="saveMp" :disabled="isDisabled">保存</button>
|
|
<!-- #endif -->
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
<!-- #endif -->
|
|
|
|
|
|
<!--注册内容-->
|
|
<register-reward ref="registerReward"></register-reward>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import uniPopup from '../uni-popup/uni-popup.vue';
|
|
import Config from 'common/js/config.js';
|
|
import registerReward from '../register-reward/register-reward.vue';
|
|
import auth from 'common/js/auth.js';
|
|
import validate from 'common/js/validate.js';
|
|
|
|
export default {
|
|
mixins: [auth],
|
|
name: 'ns-login',
|
|
components: {
|
|
uniPopup,
|
|
registerReward
|
|
},
|
|
data() {
|
|
return {
|
|
url: '',
|
|
registerConfig: {},
|
|
avatarUrl: '', // 头像预览路径
|
|
headImg: '', // 头像上传路径
|
|
nickName: '', // 昵称
|
|
isSub: false,
|
|
|
|
// 绑定手机号
|
|
captchaConfig: null,
|
|
captcha: {
|
|
id: '',
|
|
img: ''
|
|
},
|
|
formData: {
|
|
key: '',
|
|
mobile: '',
|
|
vercode: '',
|
|
dynacode: ''
|
|
},
|
|
dynacodeData: {
|
|
seconds: 120,
|
|
timer: null,
|
|
codeText: '获取动态码',
|
|
isSend: false
|
|
},
|
|
// 小程序获取手机号所需数据
|
|
authMobileData: {
|
|
iv: '',
|
|
encryptedData: ''
|
|
},
|
|
// 承诺登录相关内容
|
|
promise_text: '',// 用户输入的承诺书
|
|
request_type: 'login',// 请求场景 register=注册 login=登录
|
|
popup_show: false,
|
|
is_checked: false,
|
|
};
|
|
},
|
|
options: { styleIsolation: 'shared' },
|
|
created() {
|
|
// 其他登录方式
|
|
this.getRegisterConfig();
|
|
// #ifdef H5
|
|
if (!uni.getStorageSync('token')) this.getCaptchaConfig();
|
|
// #endif
|
|
},
|
|
mounted() {},
|
|
watch: {
|
|
'dynacodeData.seconds': {
|
|
handler(newValue, oldValue) {
|
|
if (newValue == 0) {
|
|
this.refreshDynacodeData();
|
|
}
|
|
},
|
|
immediate: true,
|
|
deep: true
|
|
}
|
|
},
|
|
computed: {
|
|
// 控制按钮是否禁用
|
|
isDisabled() {
|
|
// #ifdef MP-WEIXIN
|
|
if (this.nickName.length == 0) return true;
|
|
// #endif
|
|
|
|
// 强制绑定手机号验证
|
|
if (this.forceBindingMobileControl) {
|
|
if (this.formData.mobile.length == 0) return true;
|
|
|
|
// #ifdef H5
|
|
|
|
// 验证码
|
|
if (this.formData.vercode.length == 0) return true;
|
|
|
|
// 动态码
|
|
if (this.formData.dynacode.length == 0) return true;
|
|
|
|
// #endif
|
|
}
|
|
return false;
|
|
},
|
|
forceBindingMobileControl() {
|
|
if (this.registerConfig && this.registerConfig.third_party == 1 && this.registerConfig.bind_mobile == 1) return true;
|
|
else return false;
|
|
}
|
|
},
|
|
methods: {
|
|
// 获取注册配置
|
|
getRegisterConfig() {
|
|
this.$api.sendRequest({
|
|
url: '/api/register/config',
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
this.registerConfig = res.data.value;
|
|
}
|
|
}
|
|
});
|
|
},
|
|
open(url) {
|
|
|
|
// #ifdef MP-WEIXIN
|
|
// 判断：如果登录框未弹出 则弹出登录框
|
|
if(!this.popup_show){
|
|
this.$refs.completeInfoPopup.open();
|
|
return false;
|
|
}
|
|
// #endif
|
|
|
|
if (url) this.url = url;
|
|
// #ifdef MP-WEIXIN
|
|
this.getCode((authData) => {
|
|
this.authLogin(authData, 'authOnlyLogin');
|
|
})
|
|
// #endif
|
|
|
|
// #ifdef H5
|
|
if (this.$util.isWeiXin()) {
|
|
let authData = uni.getStorageSync('authInfo');
|
|
if (authData) this.authLogin(authData);
|
|
else this.getCode();
|
|
} else {
|
|
this.toLogin();
|
|
}
|
|
// #endif
|
|
|
|
// #ifndef MP-WEIXIN || H5
|
|
this.toLogin();
|
|
// #endif
|
|
},
|
|
// 跳转去登录页
|
|
toLogin() {
|
|
if (this.url) this.$util.redirectTo('/pages_tool/login/login', { back: encodeURIComponent(this.url) });
|
|
else this.$util.redirectTo('/pages_tool/login/login');
|
|
},
|
|
cancelCompleteInfo() {
|
|
// #ifdef MP-WEIXIN
|
|
this.$refs.subCompleteInfoPopup.close()
|
|
// #endif
|
|
|
|
// #ifndef MP-WEIXIN
|
|
if (this.$refs.completeInfoPopup) this.$refs.completeInfoPopup.close();
|
|
this.$store.commit('setBottomNavHidden', false); // 显示底部导航
|
|
// #endif
|
|
},
|
|
blurNickName(e) {
|
|
if (e.detail.value) this.nickName = e.detail.value;
|
|
},
|
|
onChooseAvatar(e) {
|
|
this.avatarUrl = e.detail.avatarUrl;
|
|
uni.getFileSystemManager().readFile({
|
|
filePath: this.avatarUrl, //选择图片返回的相对路径
|
|
encoding: 'base64', //编码格式
|
|
success: res => {
|
|
let base64 = 'data:image/jpeg;base64,' + res.data; //不加上这串字符，在页面无法显示的哦
|
|
this.myUpload(base64);
|
|
}
|
|
});
|
|
},
|
|
//上传返回图片
|
|
myUpload(base64) {
|
|
let app_type = 'h5';
|
|
let app_type_name = 'H5';
|
|
|
|
// #ifdef MP
|
|
app_type = 'weapp';
|
|
app_type_name = 'weapp';
|
|
// #endif
|
|
uni.request({
|
|
url: this.$config.baseUrl + '/api/upload/headimgBase64',
|
|
method: 'POST',
|
|
data: {
|
|
app_type: app_type,
|
|
app_type_name: app_type_name,
|
|
images: base64
|
|
},
|
|
header: {
|
|
'content-type': 'application/x-www-form-urlencoded;application/json'
|
|
},
|
|
dataType: 'json',
|
|
responseType: 'text',
|
|
success: res => {
|
|
if (res.data.code == 0) {
|
|
this.headImg = res.data.data.pic_path;
|
|
} else {
|
|
this.$util.showToast({
|
|
title: res.message
|
|
});
|
|
}
|
|
},
|
|
fail: () => {
|
|
this.$util.showToast({
|
|
title: '上传失败'
|
|
});
|
|
}
|
|
});
|
|
},
|
|
openCompleteInfoPop() {
|
|
this.$refs.completeInfoPopup.open(()=>{
|
|
this.$store.commit('setBottomNavHidden', false); //显示底部导航
|
|
});
|
|
this.$store.commit('setBottomNavHidden', true); //隐藏底部导航
|
|
},
|
|
// 获取验证码配置
|
|
getCaptchaConfig() {
|
|
this.$api.sendRequest({
|
|
url: '/api/config/getCaptchaConfig',
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
this.captchaConfig = res.data.data.value.shop_reception_login;
|
|
if (this.captchaConfig) this.getCaptcha();
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 获取验证码
|
|
getCaptcha() {
|
|
this.$api.sendRequest({
|
|
url: '/api/captcha/captcha',
|
|
data: {
|
|
captcha_id: this.captcha.id
|
|
},
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
this.captcha = res.data;
|
|
this.captcha.img = this.captcha.img.replace(/\r\n/g, '');
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 发送手机动态码
|
|
sendMobileCode() {
|
|
if (this.dynacodeData.seconds != 120 || this.dynacodeData.isSend) return;
|
|
var data = {
|
|
mobile: this.formData.mobile,
|
|
captcha_id: this.captcha.id,
|
|
captcha_code: this.formData.vercode
|
|
};
|
|
var rule = [{ name: 'mobile', checkType: 'required', errorMsg: '请输入手机号' }, { name: 'mobile', checkType: 'phoneno', errorMsg: '请输入正确的手机号' }];
|
|
if (this.captchaConfig == 1) {
|
|
rule.push({ name: 'captcha_code', checkType: 'required', errorMsg: '请输入验证码' });
|
|
}
|
|
var checkRes = validate.check(data, rule);
|
|
if (!checkRes) {
|
|
this.$util.showToast({ title: validate.error });
|
|
return;
|
|
}
|
|
this.dynacodeData.isSend = true;
|
|
|
|
if (this.dynacodeData.seconds == 120) {
|
|
this.dynacodeData.timer = setInterval(() => {
|
|
this.dynacodeData.seconds--;
|
|
this.dynacodeData.codeText = this.dynacodeData.seconds + 's后可重新获取';
|
|
}, 1000);
|
|
}
|
|
|
|
this.$api.sendRequest({
|
|
url: '/api/tripartite/mobileCode',
|
|
data: data,
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
this.formData.key = res.data.key;
|
|
} else {
|
|
this.$util.showToast({ title: res.message });
|
|
this.refreshDynacodeData();
|
|
}
|
|
},
|
|
fail: () => {
|
|
this.$util.showToast({ title: 'request:fail' });
|
|
this.refreshDynacodeData();
|
|
}
|
|
});
|
|
},
|
|
refreshDynacodeData() {
|
|
this.getCaptcha();
|
|
clearInterval(this.dynacodeData.timer);
|
|
this.dynacodeData = {
|
|
seconds: 120,
|
|
timer: null,
|
|
codeText: '获取动态码',
|
|
isSend: false
|
|
};
|
|
},
|
|
// 表单验证
|
|
verify(data) {
|
|
let rule = [{ name: 'mobile', checkType: 'required', errorMsg: '请输入手机号' }, { name: 'mobile', checkType: 'phoneno', errorMsg: '请输入正确的手机号' }];
|
|
if (this.captchaConfig == 1) {
|
|
if (this.captcha.id != '') rule.push({ name: 'captcha_code', checkType: 'required', errorMsg: this.$lang('captchaPlaceholder') });
|
|
}
|
|
rule.push({ name: 'code', checkType: 'required', errorMsg: this.$lang('dynacodePlaceholder') });
|
|
|
|
var checkRes = validate.check(data, rule);
|
|
if (checkRes) {
|
|
return true;
|
|
} else {
|
|
this.$util.showToast({ title: validate.error });
|
|
return false;
|
|
}
|
|
},
|
|
// 微信公众号强制绑定手机号
|
|
forceBindMobile() {
|
|
let authData = uni.getStorageSync('authInfo');
|
|
let data = {
|
|
mobile: this.formData.mobile,
|
|
key: this.formData.key,
|
|
code: this.formData.dynacode
|
|
};
|
|
if (this.captcha.id != '') {
|
|
data.captcha_id = this.captcha.id;
|
|
data.captcha_code = this.formData.vercode;
|
|
}
|
|
|
|
if (authData) Object.assign(data, authData);
|
|
if (authData.avatarUrl) data.headimg = authData.avatarUrl;
|
|
if (authData.nickName) data.nickname = authData.nickName;
|
|
|
|
if (uni.getStorageSync('source_member')) data.source_member = uni.getStorageSync('source_member');
|
|
|
|
if (this.isSub) return;
|
|
this.isSub = true;
|
|
|
|
this.$api.sendRequest({
|
|
url: '/api/tripartite/mobile',
|
|
data,
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
uni.setStorage({
|
|
key: 'token',
|
|
data: res.data.token,
|
|
success: () => {
|
|
this.$store.commit('setToken', res.data.token);
|
|
this.$store.dispatch('getCartNumber');
|
|
}
|
|
});
|
|
this.$refs.completeInfoPopup.close();
|
|
this.$store.commit('setBottomNavHidden', false); // 显示底部导航
|
|
if (res.data.is_register) this.$refs.registerReward.open();
|
|
} else {
|
|
this.isSub = false;
|
|
this.getCaptcha();
|
|
this.$util.showToast({ title: res.message });
|
|
}
|
|
},
|
|
fail: res => {
|
|
this.isSub = false;
|
|
this.getCaptcha();
|
|
}
|
|
});
|
|
},
|
|
// 微信小程序获取手机号
|
|
getPhoneNumber(e) {
|
|
if (e.detail.errMsg == 'getPhoneNumber:ok') {
|
|
this.authMobileData = {
|
|
iv: e.detail.iv,
|
|
encryptedData: e.detail.encryptedData
|
|
};
|
|
|
|
let authData = uni.getStorageSync('authInfo');
|
|
if (authData) Object.assign(this.authMobileData, authData);
|
|
if (uni.getStorageSync('source_member')) this.authMobileData.source_member = uni.getStorageSync('source_member');
|
|
|
|
this.$api.sendRequest({
|
|
url: '/api/tripartite/getPhoneNumber',
|
|
data: this.authMobileData,
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
this.formData.mobile = res.data.mobile;
|
|
} else {
|
|
this.formData.mobile = '';
|
|
this.$util.showToast({ title: res.message });
|
|
}
|
|
}
|
|
});
|
|
}
|
|
},
|
|
// 微信小程序强制绑定手机号
|
|
bindMobile() {
|
|
let data = this.authMobileData;
|
|
let authData = uni.getStorageSync('authInfo');
|
|
if (authData) Object.assign(data, authData);
|
|
if (authData.avatarUrl) data.headimg = authData.avatarUrl;
|
|
if (authData.nickName) data.nickname = authData.nickName;
|
|
|
|
this.$api.sendRequest({
|
|
url: '/api/tripartite/mobileauth',
|
|
data,
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
uni.setStorage({
|
|
key: 'token',
|
|
data: res.data.token,
|
|
success: () => {
|
|
this.$store.dispatch('getCartNumber');
|
|
this.$store.commit('setToken', res.data.token);
|
|
this.cancelCompleteInfo();
|
|
}
|
|
});
|
|
if (res.data.is_register) this.$refs.registerReward.open();
|
|
} else {
|
|
this.$util.showToast({ title: res.message });
|
|
}
|
|
},
|
|
fail: res => {
|
|
this.$util.showToast({ title: 'request:fail' });
|
|
}
|
|
});
|
|
},
|
|
/**
|
|
* 授权登录
|
|
*/
|
|
authLogin(data, type = 'authLogin') {
|
|
uni.showLoading({ title: '登录中' });
|
|
uni.setStorage({
|
|
key: 'authInfo',
|
|
data: data
|
|
});
|
|
if (uni.getStorageSync('source_member')) data.source_member = uni.getStorageSync('source_member');
|
|
//let url = type === 'authLogin' ? '/api/login/auth' : '/api/login/authonlylogin';
|
|
let url = '/api/login/auth';
|
|
// 获取登录接口
|
|
console.log(data);
|
|
console.log(this.registerConfig);
|
|
console.log(this.promise_text);
|
|
|
|
if(this.registerConfig.promise.length > 0){
|
|
data.promise_text = this.promise_text;
|
|
data.is_promise = 1;
|
|
data.request_type = this.request_type;
|
|
url = '/api/login/auth';
|
|
}
|
|
// 请求登录
|
|
this.$api.sendRequest({
|
|
url: url,
|
|
data,
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
uni.setStorage({
|
|
key: 'token',
|
|
data: res.data.token,
|
|
success: () => {
|
|
this.$store.dispatch('getCartNumber');
|
|
this.$store.commit('setToken', res.data.token);
|
|
if (res.data.is_register) this.$refs.registerReward.open();
|
|
|
|
// #ifdef MP-WEIXIN
|
|
this.$refs.completeInfoPopup.close()
|
|
// #endif
|
|
this.cancelCompleteInfo();
|
|
}
|
|
});
|
|
setTimeout(() => {
|
|
uni.hideLoading();
|
|
}, 1000);
|
|
}
|
|
else if (res.code == -10016) {
|
|
let register_error = res.message;
|
|
this.$api.sendRequest({
|
|
url: '/api/register/config',
|
|
success: res => {
|
|
if (res.code >= 0) {
|
|
this.registerConfig = res.data.value;
|
|
if (this.registerConfig.third_party == 1 && this.registerConfig.bind_mobile == 1) {
|
|
uni.hideLoading();
|
|
this.openCompleteInfoPop();
|
|
} else if (this.registerConfig.third_party == 0) {
|
|
uni.hideLoading();
|
|
this.toLogin();
|
|
} else {
|
|
uni.hideLoading();
|
|
this.openCompleteInfoPop();
|
|
}
|
|
}
|
|
}
|
|
});
|
|
} else {
|
|
uni.hideLoading();
|
|
this.$util.showToast({ title: res.message });
|
|
|
|
// #ifdef MP-WEIXIN
|
|
this.cancelCompleteInfo()
|
|
// #endif
|
|
}
|
|
},
|
|
fail: () => {
|
|
uni.hideLoading();
|
|
this.$util.showToast({ title: '登录失败' });
|
|
}
|
|
});
|
|
},
|
|
// 微信公众号，强制绑定手机号，验证
|
|
saveH5() {
|
|
if (this.$util.isWeiXin() && this.forceBindingMobileControl) {
|
|
let data = {
|
|
mobile: this.formData.mobile
|
|
};
|
|
|
|
if (!this.verify(data)) return;
|
|
}
|
|
this.forceBindMobile();
|
|
},
|
|
// 微信小程序保存数据
|
|
saveMp() {
|
|
if (this.nickName.length == 0) {
|
|
this.$util.showToast({
|
|
title: '请输入昵称'
|
|
});
|
|
return;
|
|
}
|
|
let authData = uni.getStorageSync('authInfo');
|
|
if (authData) {
|
|
Object.assign(authData, {nickName: this.nickName, avatarUrl: this.headImg});
|
|
uni.setStorageSync('authInfo', authData);
|
|
if (this.forceBindingMobileControl) this.bindMobile();
|
|
else this.authLogin(authData);
|
|
} else {
|
|
this.getCode((authData) => {
|
|
Object.assign(authData, {nickName: this.nickName, avatarUrl: this.headImg});
|
|
uni.setStorageSync('authInfo', authData);
|
|
if (this.forceBindingMobileControl) this.bindMobile();
|
|
else this.authLogin(authData);
|
|
})
|
|
}
|
|
|
|
},
|
|
// 承诺书 登录
|
|
promiseLogin(){
|
|
this.request_type = 'login';
|
|
this.getCode((authData) => {
|
|
this.authLogin(authData);
|
|
})
|
|
},
|
|
// 弹框状态改变
|
|
popupChange(e){
|
|
this.popup_show = e.show;
|
|
if(e.show) this.$store.commit('setBottomNavHidden', true); //隐藏底部导航
|
|
else this.$store.commit('setBottomNavHidden', false); //显示底部导航
|
|
},
|
|
// 承诺书 注册 - 显示弹框
|
|
promiseRegisterShow(){
|
|
this.request_type = 'register';
|
|
if (!uni.getStorageSync('source_member')){
|
|
uni.showModal({
|
|
title: '请扫推广码注册',
|
|
mask: true,
|
|
duration: 2000,
|
|
showCancel: false,
|
|
success: function () {}
|
|
});
|
|
}else {
|
|
this.$refs.registerPopup.open()
|
|
}
|
|
// this.$refs.registerPopup.open()
|
|
},
|
|
// 承诺书 注册 - 申请注册
|
|
promiseRegister(){
|
|
// 判断：是否同意协议内容
|
|
if(!this.is_checked){
|
|
this.$util.showToast({ title: '请同意协议后进行后续操作！' });
|
|
return false;
|
|
}
|
|
// 开始注册
|
|
this.$refs.registerPopup.close()
|
|
this.$refs.subCompleteInfoPopup.open();
|
|
},
|
|
// 同意协议状态变更
|
|
checkboxChange(e){
|
|
let values = e.detail.value;
|
|
this.is_checked = values.includes('agree');
|
|
}
|
|
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
//旧版登录
|
|
.complete-info-popup {
|
|
.complete-info-wrap {
|
|
background: #fff;
|
|
padding: 50rpx 40rpx 40rpx;
|
|
|
|
.head {
|
|
position: relative;
|
|
border-bottom: 2rpx solid $color-line;
|
|
padding-bottom: 20rpx;
|
|
.title {
|
|
font-size: $font-size-toolbar;
|
|
display: block;
|
|
}
|
|
.tips {
|
|
font-size: $font-size-base;
|
|
display: block;
|
|
}
|
|
.iconfont {
|
|
position: absolute;
|
|
right: 0;
|
|
top: -30rpx;
|
|
display: inline-block;
|
|
width: 56rpx;
|
|
height: 56rpx;
|
|
line-height: 56rpx;
|
|
text-align: right;
|
|
font-size: $font-size-toolbar;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
.item-wrap {
|
|
border-bottom: 2rpx solid $color-line;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 16rpx 0;
|
|
|
|
.label {
|
|
font-size: $font-size-toolbar;
|
|
margin-right: 40rpx;
|
|
width: 100rpx;
|
|
}
|
|
button {
|
|
background: transparent;
|
|
margin: 0;
|
|
padding: 0;
|
|
border-radius: 0;
|
|
flex: 1;
|
|
text-align: left;
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: $font-size-toolbar;
|
|
image {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
border-radius: 10rpx;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
.iconfont {
|
|
flex: 1;
|
|
text-align: right;
|
|
font-size: $font-size-tag;
|
|
}
|
|
input {
|
|
flex: 1;
|
|
height: 80rpx;
|
|
box-sizing: border-box;
|
|
font-size: $font-size-toolbar;
|
|
}
|
|
|
|
.send {
|
|
border: 2rpx solid $base-color;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
border-radius: 60rpx;
|
|
font-size: $font-size-tag;
|
|
text-align: center;
|
|
padding: 0 40rpx;
|
|
}
|
|
|
|
.captcha {
|
|
height: 80rpx;
|
|
width: 200rpx;
|
|
}
|
|
|
|
.auth-login {
|
|
width: calc(100% - 100rpx);
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
border-radius: 80rpx;
|
|
}
|
|
}
|
|
.save-btn {
|
|
width: 280rpx;
|
|
height: 90rpx;
|
|
line-height: 90rpx;
|
|
background-color: #07c160;
|
|
color: #fff;
|
|
margin: 40rpx auto 20rpx;
|
|
}
|
|
}
|
|
}
|
|
//新版登录
|
|
.new-complete-info-popup{
|
|
.new-complete-info-wrap{
|
|
.login-content{
|
|
background: var(--background-image-) no-repeat;
|
|
background-size: 100% 100%;
|
|
//background: #e2ea00;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
margin: 0!important;
|
|
padding: 0!important;
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
display: inline-flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
justify-content: center;
|
|
align-content: center;
|
|
.login-buttons{
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
align-content: center;
|
|
}
|
|
.mini-btn{
|
|
display: block;
|
|
width: 80vw;
|
|
height: 90rpx;
|
|
line-height: 90rpx;
|
|
border-radius: 350rpx;
|
|
font-size: 30rpx;
|
|
}
|
|
.mini-btn:nth-child(1){
|
|
margin-bottom: 50rpx!important;
|
|
}
|
|
.login-cancel-button{
|
|
margin: 0!important;
|
|
padding: 0!important;
|
|
width: 100vw;
|
|
position: fixed;
|
|
left: 0;
|
|
bottom: 100rpx;
|
|
display: inline-flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
justify-content: center;
|
|
align-content: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
.complete-info-popup{
|
|
width: 100vw!important;
|
|
.complete-info-wrap{
|
|
width: calc(100vw - 80rpx)!important;
|
|
max-height: 80vh;
|
|
overflow: auto;
|
|
border-top-right-radius: 30rpx;
|
|
border-top-left-radius: 30rpx;
|
|
|
|
.head {
|
|
position: relative;
|
|
border-bottom: none;
|
|
padding-top: 30rpx;
|
|
|
|
.promise-textarea{
|
|
width: calc(100% - 20rpx);
|
|
min-height: 300rpx;
|
|
border: 1px solid #004cff;
|
|
padding: 10rpx;
|
|
}
|
|
.promise-content{
|
|
|
|
.promise-text{
|
|
color: #000000;
|
|
font-size: 26rpx;
|
|
font-weight: bold;
|
|
.promise-text-title{
|
|
color: #e04242;
|
|
font-weight: 100;
|
|
}
|
|
}
|
|
.promise-copy-button{
|
|
font-size: 26rpx;
|
|
color: #0e940d;
|
|
font-weight: 100;
|
|
}
|
|
}
|
|
.agreement{
|
|
border: 1px solid #cccccc;
|
|
padding: 10rpx 20rpx;
|
|
margin-top: 20rpx;
|
|
border-radius: 50rpx;
|
|
}
|
|
}
|
|
.save-btn {
|
|
width: 70%;
|
|
height: 70rpx;
|
|
line-height: 70rpx;
|
|
background-color: #007aff;
|
|
color: #fff;
|
|
margin: 20rpx auto;
|
|
border-radius: 70rpx;
|
|
}
|
|
}
|
|
/deep/ .goodslist-uni-popup-box{
|
|
width: 100vw!important;
|
|
}
|
|
/deep/ .uni-popup__wrapper-box {
|
|
background: none !important;
|
|
max-width: unset !important;
|
|
max-height: unset !important;
|
|
overflow: unset !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
</style>
|
|
<style scoped>
|
|
/deep/ .reward-popup .uni-popup__wrapper-box {
|
|
background: none !important;
|
|
max-width: unset !important;
|
|
max-height: unset !important;
|
|
overflow: unset !important;
|
|
}
|
|
.complete-info-popup /deep/ .uni-popup__wrapper.bottom,
|
|
.complete-info-popup /deep/ .uni-popup__wrapper.bottom .uni-popup__wrapper-box {
|
|
border-top-left-radius: 30rpx !important;
|
|
border-top-right-radius: 30rpx !important;
|
|
}
|
|
</style>
|