123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428 |
- <template>
- <view :style="colorStyle">
- <view class="authorize">
- <view class="pictrue">
- <image :src="logoUrl"></image>
- <view class="iconfont icon-guanbi4" @click='close'></view>
- </view>
- <view class="title">账号登录</view>
- <view class="info">
- <checkbox-group @change='ChangeIsDefault' v-if="agreement">
- <checkbox :checked="protocol ? true : false" />您已同意商城<text class="agree"
- @click="privacy('user')">《用户协议》</text>
- 与<text class="agree" @click="privacy('privacy')">《隐私协议》</text>
- </checkbox-group>
- <view v-else>
- 登录注册即同意商城
- <text class="agree" @click="privacy('user')">《用户协议》</text>与<text class="agree" @click="privacy('privacy')">《隐私协议》</text>
- </view>
- </view>
- <template v-if="routineAuthType.indexOf(1) != -1">
- <button hover-class="none" v-if="mp_is_new" @tap="userLogin"
- class="btn1">授权登录</button>
- <button v-else-if="canUseGetUserProfile && code" hover-class="none" @tap="getUserProfile"
- class="btn1">授权登录</button>
- <button v-else hover-class="none" open-type="getUserInfo" @getuserinfo="setUserInfo"
- class="btn1">授权登录</button>
- </template>
-
- </view>
-
- <block v-if="isPhoneBox">
-
- </block>
- <block>
- <editUserModal :isShow="isShow" @closeEdit="closeEdit" @editSuccess="editSuccess">
- </editUserModal>
- </block>
- <view class="mask" @click='close'></view>
- </view>
- </template>
- <script>
- const app = getApp();
-
- import routinePhone from '../loginMobile/routine_phone.vue';
- import editUserModal from '@/components/eidtUserModal/index.vue'
- import {
- getLogo,
- silenceAuth,
- wechatAuthV2,
- authLogin
- } from '@/api/public';
- import {
- LOGO_URL,
- EXPIRES_TIME,
- USER_INFO,
- STATE_R_KEY
- } from '@/config/cache';
- import {
- getUserInfo
- } from '@/api/user.js';
- import Routine from '@/libs/routine';
- import wechat from '@/libs/wechat';
- import colors from '@/mixins/color.js';
- export default {
- mixins:[colors],
- props: {
- isShowAuth: {
- type: Boolean,
- default: false
- }
- },
- data() {
- return {
- isShow: false,
- isUp: false,
- phone: '',
- isPhoneBox: false,
- logoUrl: '',
- code: '',
- authKey: '',
- options: '',
- userInfo: {},
- codeNum: 0,
- canUseGetUserProfile: false,
- mp_is_new: this.$Cache.get('MP_VERSION_ISNEW') || false,
- agreement: 0,
- protocol: false,
- routineAuthType: []
- };
- },
- components: {
-
- routinePhone,
- editUserModal
- },
- mounted(options) {
- if (uni.getUserProfile) {
- this.canUseGetUserProfile = true;
- }
- getLogo().then(res => {
- this.logoUrl = res.data.logo_url;
- this.agreement = res.data.store_user_agreement;
- this.routineAuthType = res.data.routine_auth_type;
- });
- let that = this;
-
- Routine.getCode()
- .then(code => {
- this.code = code
- })
-
- },
- methods: {
- close(){
- this.$emit('authColse', false);
- },
- privacy(type) {
- uni.navigateTo({
- url: "/pages/users/privacy/index?type=" + type
- })
- },
- ChangeIsDefault(e) {
- this.$set(this, 'protocol', !this.protocol);
- },
- // 小程序 22.11.8日删除getUserProfile 接口获取用户昵称头像
- userLogin() {
- if (!this.protocol && this.agreement) {
- return this.$util.Tips({
- title: '请先阅读并同意协议'
- });
- }
- Routine.getCode()
- .then(code => {
- uni.showLoading({
- title: '正在登录中'
- });
- authLogin({
- code,
- spread_spid: app.globalData.spid,
- spread_code: app.globalData.code
- }).then(res => {
- if (res.data.key !== undefined && res.data.key) {
- uni.hideLoading();
- this.authKey = res.data.key;
- this.isPhoneBox = true;
- } else {
- uni.hideLoading();
- let time = res.data.expires_time - this.$Cache.time();
- this.$store.commit('LOGIN', {
- token: res.data.token,
- time: time
- });
- this.getUserInfo(res.data.store_user_avatar || 0)
- }
- }).catch(err => {
- uni.hideLoading();
- uni.showToast({
- title: err,
- icon: 'none',
- duration: 2000
- });
- })
- })
- .catch(err => {
- uni.hideLoading();
- uni.showToast({
- title: err,
- icon: 'none',
- duration: 2000
- });
- });
- },
- editSuccess() {
- this.isShow = false
- this.$emit('onLoadFun');
- },
- closeEdit() {
- this.isShow = false
- this.$emit('onLoadFun');
- this.$util.Tips({
- title: '登录成功',
- icon: 'success'
- });
- },
-
-
-
-
-
-
-
- bindPhoneClose(data) {
- if (data.isStatus) {
- uni.hideLoading();
- this.isPhoneBox = false;
- if(data.store_user_avatar){
- this.isShow = true
- }else{
- this.$emit('onLoadFun');
- this.$util.Tips({
- title: '登录成功',
- icon: 'success'
- });
- }
-
-
-
-
-
-
-
- } else {
- this.isPhoneBox = false;
- }
- },
-
-
- getUserInfo: function(store_user_avatar) {
- let that = this;
- getUserInfo().then(res => {
- uni.hideLoading();
- that.userInfo = res.data;
- that.$store.commit('SETUID', res.data.uid);
- that.$store.commit('UPDATE_USERINFO', res.data);
- if(store_user_avatar){
- that.isShow = true
- }else{
- that.$emit('onLoadFun');
- that.$util.Tips({
- title: '登录成功',
- icon: 'success'
- });
- }
- });
- },
- setUserInfo(e) {
- if (!this.protocol && this.agreement) {
- return this.$util.Tips({
- title: '请先阅读并同意协议'
- });
- }
- this.close();
- uni.showLoading({
- title: '正在登录中'
- });
- Routine.getCode()
- .then(code => {
- this.getWxUser(code);
- })
- .catch(res => {
- uni.hideLoading();
- });
- },
-
- getUserProfile() {
- if (!this.protocol && this.agreement) {
- return this.$util.Tips({
- title: '请先阅读并同意协议'
- });
- }
- this.close();
- uni.showLoading({
- title: '正在登录中'
- });
- let self = this;
- Routine.getUserProfile()
- .then(res => {
- let userInfo = res.userInfo;
- userInfo.code = this.code;
- userInfo.spread_spid = app.globalData.spid || this.$Cache.get('spid');
- userInfo.spread_code = app.globalData.code;
- Routine.authUserInfo(userInfo)
- .then(res => {
- if (res.data.key !== undefined && res.data.key) {
- uni.hideLoading();
- self.authKey = res.data.key;
- self.isPhoneBox = true;
- } else {
- uni.hideLoading();
- let time = res.data.expires_time - self.$Cache.time();
- self.$store.commit('LOGIN', {
- token: res.data.token,
- time: time
- });
- this.getUserInfo()
- }
- })
- .catch(res => {
- uni.hideLoading();
- uni.showToast({
- title: res.msg,
- icon: 'none',
- duration: 2000
- });
- });
- })
- .catch(res => {
- uni.hideLoading();
- });
- },
- getWxUser(code) {
- let self = this;
- Routine.getUserInfo()
- .then(res => {
- let userInfo = res.userInfo;
- userInfo.code = code;
- userInfo.spread_spid = app.globalData.spid;
- userInfo.spread_code = app.globalData.code;
- Routine.authUserInfo(userInfo)
- .then(res => {
- if (res.data.key !== undefined && res.data.key) {
- uni.hideLoading();
- self.authKey = res.data.key;
- self.isPhoneBox = true;
- } else {
- uni.hideLoading();
- let time = res.data.expires_time - self.$Cache.time();
- self.$store.commit('LOGIN', {
- token: res.data.token,
- time: time
- });
- self.$emit('onLoadFun');
- self.$util.Tips({
- title: res.msg,
- icon: 'success'
- });
- }
- })
- .catch(res => {
- uni.hideLoading();
- uni.showToast({
- title: res.msg,
- icon: 'none',
- duration: 2000
- });
- });
- })
- .catch(res => {
- uni.hideLoading();
- });
- },
-
- }
- };
- </script>
- <style lang="scss">
- .mask{
- z-index: 99;
- }
- .authorize{
- width: 100%;
- height: 560rpx;
- background-color: #fff;
- border-radius: 48rpx 48rpx 0 0;
- position: fixed;
- left: 0;
- bottom: 0;
- z-index: 667;
- padding-top: 50rpx;
- text-align: center;
- .pictrue{
- width: 152rpx;
- height: 152rpx;
- border-radius: 50%;
- margin: 0 auto;
- position: relative;
- image{
- width: 100%;
- height: 100%;
- border-radius: 50%;
- border:1px solid #eee;
- }
- .iconfont{
- position: absolute;
- width: 52rpx;
- height: 52rpx;
- background: #EEE;
- border-radius: 50%;
- color: #888;
- font-size: 30rpx;
- text-align: center;
- line-height: 52rpx;
- right: -267rpx;
- top: -20rpx;
- }
- }
- .title{
- margin-top: 28rpx;
- font-size: 36rpx;
- color: #333333;
- }
- .info{
- color: #9E9E9E;
- font-size: 28rpx;
- margin-top: 14rpx;
- .agree{
- color: #333;
- }
- }
- .btn1{
- width: 536rpx;
- height: 86rpx;
- border-radius: 43rpx;
- color: #fff;
- text-align: center;
- line-height: 86rpx;
- margin: 50rpx auto 0 auto;
- background-color: var(--view-theme);
- font-size: 30rpx;
- }
- .btn2{
- width: 536rpx;
- height: 86rpx;
- border-radius: 43rpx;
- border: 2rpx solid var(--view-theme);
- color: var(--view-theme);
- font-size: 30rpx;
- margin: 40rpx auto 0 auto;
- }
- }
- </style>
|