| xqd
@@ -1,25 +1,34 @@
|
|
|
<template>
|
|
|
+ <!-- 'background-image': 'url('+topPicUrl+')' -->
|
|
|
<view class="app-user-center-top cross-center" :style="{'background-image': 'url('+topPicUrl+')'}">
|
|
|
<!-- style 3 start -->
|
|
|
<view class="style-3 box-grow-1 main-center" v-if="topStyle == '3'">
|
|
|
<view class="style-3-container dir-left-nowrap cross-center"
|
|
|
:style="userCenter.style_bg_pic_url?`background-image: url(${userCenter.style_bg_pic_url})`:``">
|
|
|
<view class="box-grow-0 avatar-container">
|
|
|
- <image :src="avatar" :class="[userInfo.is_vip_card_user && is_icon_super_vip == '1' ? 'avatar is_vip' : 'avatar']"></image>
|
|
|
- <image v-if="userInfo.is_vip_card_user && is_icon_super_vip == '1'" src="/static/image/vip_icon.png" class="vip_icon"></image>
|
|
|
+ <image :src="avatar" :class="[is_vip_card_user && is_icon_super_vip == '1' ? 'avatar is_vip' : 'avatar']"></image>
|
|
|
+ <image v-if="is_vip_card_user && is_icon_super_vip == '1'" src="/static/image/vip_icon.png" class="vip_icon"></image>
|
|
|
</view>
|
|
|
<view class="box-grow-1 info-container">
|
|
|
<template v-if="isLogin">
|
|
|
<view class="dir-left-nowrap cross-center">
|
|
|
- <view class="nickname t-omit">{{userInfo.nickname}}</view>
|
|
|
- <!--#ifdef MP-WEIXIN-->
|
|
|
+ <view v-if="userInfo" class="nickname t-omit" :style="{'color':userNameColor}">{{userInfo.nickname}}</view>
|
|
|
+ <!--#ifdef MP-WEIXIN -->
|
|
|
<button class="u-refresh dir-left-nowrap main-between cross-center member-margin"
|
|
|
- open-type="getUserInfo"
|
|
|
+
|
|
|
scope="userInfo"
|
|
|
- @getAuthorize="getUserInfo"
|
|
|
- @getuserinfo="getUserInfo"
|
|
|
+ @click="getUserInfo"
|
|
|
>
|
|
|
- <icon class="u-icon"></icon>
|
|
|
+ <icon class="u-icon" type></icon>
|
|
|
+ <text>刷新</text>
|
|
|
+ </button>
|
|
|
+ <!-- #endif-->
|
|
|
+ <!--#ifdef H5 -->
|
|
|
+ <button class="u-refresh dir-left-nowrap main-between cross-center member-margin"
|
|
|
+ @click="getUserInfo"
|
|
|
+ v-if="isWechat"
|
|
|
+ >
|
|
|
+ <icon class="u-icon" type></icon>
|
|
|
<text>刷新</text>
|
|
|
</button>
|
|
|
<!-- #endif-->
|
| xqd
@@ -29,7 +38,7 @@
|
|
|
<view>
|
|
|
<image :src="getMemberPicUrl" class="member-icon" mode="aspectFill"></image>
|
|
|
</view>
|
|
|
- <view class="t-omit">{{userInfo.identity.level_name}}</view>
|
|
|
+ <view v-if="userInfo" class="t-omit">{{userInfo.identity.level_name}}</view>
|
|
|
</view>
|
|
|
</app-form-id>
|
|
|
</template>
|
| xqd
@@ -40,9 +49,15 @@
|
|
|
</template>
|
|
|
</view>
|
|
|
<view class="box-grow-0 address-container">
|
|
|
+ <app-jump-button v-if="userInfo && userInfo.is_show_pay_code" form url="/plugins/teller/index/index">
|
|
|
+ <view class="address-btn-3 pay-code">
|
|
|
+ <image class="pay-code-icon" src="/static/image/icon/pay-code.png"></image>
|
|
|
+ <view>付款码</view>
|
|
|
+ </view>
|
|
|
+ </app-jump-button>
|
|
|
<app-jump-button form url="/pages/address/address">
|
|
|
- <view class="address-btn-3" >
|
|
|
- <image class="address-btn-icon" src="/static/image/icon/address-gray.png"></image>
|
|
|
+ <view class="address-btn-3">
|
|
|
+ <image class="address-btn-icon" src="/static/image/icon/address-white.png"></image>
|
|
|
<view>收货地址</view>
|
|
|
</view>
|
|
|
</app-jump-button>
|
| xqd
@@ -53,9 +68,15 @@
|
|
|
|
|
|
<!-- style 2 start -->
|
|
|
<view class="style-2 box-grow-1" v-else-if="topStyle == '2'">
|
|
|
+ <app-jump-button v-if="userInfo && userInfo.is_show_pay_code" form url="/plugins/teller/index/index">
|
|
|
+ <view class="pay-code-btn">
|
|
|
+ <image class="pay-code-icon" src="/static/image/icon/pay-code.png"></image>
|
|
|
+ <view>付款码</view>
|
|
|
+ </view>
|
|
|
+ </app-jump-button>
|
|
|
<view class="avatar-container">
|
|
|
- <image :src="avatar" :class="[userInfo.is_vip_card_user && is_icon_super_vip == '1' ? 'avatar is_vip' : 'avatar']"></image>
|
|
|
- <image v-if="userInfo.is_vip_card_user && is_icon_super_vip == '1'" src="/static/image/vip_icon.png" class="vip_icon"></image>
|
|
|
+ <image :src="avatar" :class="[is_vip_card_user && is_icon_super_vip == '1' ? 'avatar is_vip' : 'avatar']"></image>
|
|
|
+ <image v-if="is_vip_card_user && is_icon_super_vip == '1'" src="/static/image/vip_icon.png" class="vip_icon"></image>
|
|
|
</view>
|
|
|
<view class="info-container">
|
|
|
<template v-if="isLogin">
|
| xqd
@@ -64,22 +85,31 @@
|
|
|
<view>
|
|
|
<image :src="getMemberPicUrl" class="member-icon" mode="aspectFill"></image>
|
|
|
</view>
|
|
|
- <view class="t-omit">{{userInfo.identity.level_name}}</view>
|
|
|
+ <view v-if="userInfo" class="t-omit">{{userInfo.identity.level_name}}</view>
|
|
|
</view>
|
|
|
</app-form-id>
|
|
|
<view class="dir-left-nowrap cross-center main-center">
|
|
|
- <view class="nickname t-omit"
|
|
|
+ <view v-if="userInfo" class="nickname t-omit" :style="{'color':userNameColor}"
|
|
|
:class="[mall.setting.is_icon_members_grade != 1 ? 'no-member-icon' : '',]">
|
|
|
{{userInfo.nickname}}</view>
|
|
|
- <!--#ifdef MP-WEIXIN-->
|
|
|
+ <!--#ifdef MP-WEIXIN -->
|
|
|
<button class="u-refresh dir-left-nowrap main-between cross-center"
|
|
|
:class="[mall.setting.is_icon_members_grade != 1 ? 'no-member-icon' : '',]"
|
|
|
- open-type="getUserInfo"
|
|
|
+
|
|
|
scope="userInfo"
|
|
|
- @getAuthorize="getUserInfo"
|
|
|
- @getuserinfo="getUserInfo"
|
|
|
+ @click="getUserInfo"
|
|
|
>
|
|
|
- <icon class="u-icon"></icon>
|
|
|
+ <icon class="u-icon" type></icon>
|
|
|
+ <text>刷新</text>
|
|
|
+ </button>
|
|
|
+ <!-- #endif-->
|
|
|
+ <!--#ifdef H5 -->
|
|
|
+ <button class="u-refresh dir-left-nowrap main-between cross-center"
|
|
|
+ v-if="isWechat"
|
|
|
+ :class="[mall.setting.is_icon_members_grade != 1 ? 'no-member-icon' : '',]"
|
|
|
+ @click="getUserInfo"
|
|
|
+ >
|
|
|
+ <icon class="u-icon" type></icon>
|
|
|
<text>刷新</text>
|
|
|
</button>
|
|
|
<!-- #endif-->
|
| xqd
@@ -97,19 +127,25 @@
|
|
|
<!-- style 1 start -->
|
|
|
<view class="style-1 dir-left-nowrap cross-center box-grow-1" v-else-if="topStyle == '1'">
|
|
|
<view class="box-grow-0 avatar-container">
|
|
|
- <image :src="avatar" :class="[userInfo.is_vip_card_user && is_icon_super_vip == '1' ? 'avatar is_vip' : 'avatar']"></image>
|
|
|
- <image v-if="userInfo.is_vip_card_user && is_icon_super_vip == '1'" src="/static/image/vip_icon.png" class="vip_icon"></image>
|
|
|
+ <image :src="avatar" :class="[is_vip_card_user && is_icon_super_vip == '1' ? 'avatar is_vip' : 'avatar']"></image>
|
|
|
+ <image v-if="is_vip_card_user && is_icon_super_vip == '1'" src="/static/image/vip_icon.png" class="vip_icon"></image>
|
|
|
</view>
|
|
|
<view class="box-grow-1 info-container">
|
|
|
<template v-if="isLogin">
|
|
|
<view class="dir-left-nowrap cross-center">
|
|
|
- <view class="nickname t-omit">{{userInfo.nickname}}</view>
|
|
|
- <!--#ifdef MP-WEIXIN-->
|
|
|
- <button class="u-refresh dir-left-nowrap main-between cross-center member-margin" open-type="getUserInfo"
|
|
|
- scope="userInfo"
|
|
|
- @getAuthorize="getUserInfo"
|
|
|
- @getuserinfo="getUserInfo">
|
|
|
- <icon class="u-icon"></icon>
|
|
|
+ <view v-if="userInfo" class="nickname t-omit" :style="{'color':userNameColor}">{{userInfo.nickname}}</view>
|
|
|
+ <!--#ifdef MP-WEIXIN -->
|
|
|
+ <button class="u-refresh dir-left-nowrap main-between cross-center member-margin"
|
|
|
+ @click="getUserInfo">
|
|
|
+ <icon class="u-icon" type></icon>
|
|
|
+ <text>刷新</text>
|
|
|
+ </button>
|
|
|
+ <!-- #endif-->
|
|
|
+ <!--#ifdef H5 -->
|
|
|
+ <button class="u-refresh dir-left-nowrap main-between cross-center member-margin"
|
|
|
+ v-if="isWechat"
|
|
|
+ @click="getUserInfo">
|
|
|
+ <icon class="u-icon" type></icon>
|
|
|
<text>刷新</text>
|
|
|
</button>
|
|
|
<!-- #endif-->
|
| xqd
@@ -119,7 +155,7 @@
|
|
|
<view>
|
|
|
<image :src="getMemberPicUrl" class="member-icon" mode="aspectFill"></image>
|
|
|
</view>
|
|
|
- <view class="t-omit">{{userInfo.identity.level_name}}</view>
|
|
|
+ <view v-if="userInfo" class="t-omit">{{userInfo.identity.level_name}}</view>
|
|
|
</view>
|
|
|
</app-form-id>
|
|
|
</template>
|
| xqd
@@ -130,8 +166,14 @@
|
|
|
</template>
|
|
|
</view>
|
|
|
<view class="box-grow-0 address-container">
|
|
|
+ <app-jump-button v-if="userInfo && userInfo.is_show_pay_code" form url="/plugins/teller/index/index">
|
|
|
+ <view class="pay-code">
|
|
|
+ <image class="pay-code-icon" src="/static/image/icon/pay-code.png"></image>
|
|
|
+ <view>付款码</view>
|
|
|
+ </view>
|
|
|
+ </app-jump-button>
|
|
|
<app-jump-button form url="/pages/address/address">
|
|
|
- <view class="address-btn-1 dir-left-nowrap cross-center" style="background-color:#F84469;">
|
|
|
+ <view class="address-btn-1 dir-left-nowrap cross-center" >
|
|
|
<view>
|
|
|
<image class="address-btn-icon" src="/static/image/icon/address-white.png"></image>
|
|
|
</view>
|
| xqd
@@ -147,6 +189,7 @@
|
|
|
|
|
|
<script>
|
|
|
import {mapState, mapGetters} from 'vuex';
|
|
|
+ import Vue from "@dcloudio/vue-cli-plugin-uni/packages/h5-vue";
|
|
|
|
|
|
export default {
|
|
|
name: 'app-user-center-top',
|
| xqd
@@ -154,6 +197,7 @@
|
|
|
topStyle: String,
|
|
|
topPicUrl: String,
|
|
|
memberPicUrl: String,
|
|
|
+ userNameColor: String,
|
|
|
is_icon_super_vip: {
|
|
|
type: String,
|
|
|
default() {
|
| xqd
@@ -167,6 +211,9 @@
|
|
|
},
|
|
|
...mapState({
|
|
|
mall: state => state.mallConfig.mall,
|
|
|
+ is_vip_card_user: function(state) {
|
|
|
+ return state.user.info && state.user.info.is_vip_card_user ? 1 : 0;
|
|
|
+ }
|
|
|
}),
|
|
|
...mapGetters({
|
|
|
userCenter: 'mallConfig/getUserCenter',
|
| xqd
@@ -188,13 +235,19 @@
|
|
|
return this.userInfo.identity.member_pic_url;
|
|
|
}
|
|
|
},
|
|
|
+ // #ifdef H5
|
|
|
+ isWechat: function() {
|
|
|
+ return this.$jwx.isWechat();
|
|
|
+ }
|
|
|
+ // #endif
|
|
|
},
|
|
|
+ // #ifdef MP
|
|
|
created() {
|
|
|
if (this.isLogin) {
|
|
|
this.$store.dispatch('user/info', {refresh: true});
|
|
|
- } else {
|
|
|
}
|
|
|
},
|
|
|
+ // #endif
|
|
|
methods: {
|
|
|
callLogin() {
|
|
|
this.$store.dispatch('user/accessToken');
|
| xqd
@@ -204,45 +257,65 @@
|
|
|
url: '/pages/member/index/index',
|
|
|
});
|
|
|
},
|
|
|
- getUserInfo(userInfoResult) {
|
|
|
+ getUserInfo() {
|
|
|
+ // #ifdef MP
|
|
|
let _this = this;
|
|
|
uni.login({
|
|
|
scopes: 'auth_user',
|
|
|
- success(loginResult) {
|
|
|
- const data = {
|
|
|
- encryptedData: userInfoResult.detail.encryptedData,
|
|
|
- iv: userInfoResult.detail.iv,
|
|
|
- rawData: userInfoResult.detail.rawData,
|
|
|
- signature: userInfoResult.detail.signature,
|
|
|
- code: loginResult.code,
|
|
|
- };
|
|
|
- _this.$request({
|
|
|
- url: _this.$api.passport.login,
|
|
|
- method: 'post',
|
|
|
- data: data
|
|
|
- }).then(response => {
|
|
|
- uni.hideLoading();
|
|
|
- if (response.code === 0) {
|
|
|
- uni.showToast({
|
|
|
- title: '资料已更新',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- uni.setStorageSync('_USER_ACCESS_TOKEN', response.data.access_token);
|
|
|
- } else {
|
|
|
- return reject(response.msg);
|
|
|
- }
|
|
|
+ success:(loginResult)=> {
|
|
|
+ this.getuserinfodata(loginResult)
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5
|
|
|
+ this.$request({
|
|
|
+ url: this.$api.registered.url,
|
|
|
+ method: 'get',
|
|
|
+ data: {
|
|
|
+ scope: 'snsapi_userinfo',
|
|
|
+ response_type: 'code',
|
|
|
+ url: `${window.location.href}`
|
|
|
+ }
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.$storage.setStorageSync('_USER_SIGN', true);
|
|
|
+ window.location.replace(res.data.url);
|
|
|
+ } else {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/registered/sign'
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
- }
|
|
|
- },
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ getuserinfodata(code){
|
|
|
+ this.$request({
|
|
|
+ url: this.$api.passport.login,
|
|
|
+ method: 'post',
|
|
|
+ data: {
|
|
|
+ code:code.code
|
|
|
+ }
|
|
|
+ }).then(response => {
|
|
|
+ uni.hideLoading();
|
|
|
+ if (response.code === 0) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '资料已更新',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ this.$storage.setStorageSync('_USER_ACCESS_TOKEN', response.data.access_token);
|
|
|
+ } else {
|
|
|
+ // return reject(response.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
.app-user-center-top {
|
|
|
width: #{750rpx};
|
|
|
- height: #{300rpx};
|
|
|
+ height: #{360rpx};
|
|
|
background-repeat: no-repeat;
|
|
|
background-size: cover;
|
|
|
background-position: center;
|
| xqd
@@ -286,7 +359,7 @@
|
|
|
.info-container {
|
|
|
padding: #{0rpx};
|
|
|
position: relative;
|
|
|
- z-index: 1000;
|
|
|
+ z-index: 997;
|
|
|
}
|
|
|
|
|
|
.address-container {
|
| xqd
@@ -315,14 +388,35 @@
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ .pay-code-btn {
|
|
|
+ z-index: 998;
|
|
|
+ position: absolute;
|
|
|
+ right: 50rpx;
|
|
|
+ top: 0;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ font-size: $uni-font-size-weak-two;
|
|
|
+ .pay-code-icon {
|
|
|
+ width: #{44rpx};
|
|
|
+ height: #{44rpx};
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.address-btn-3 {
|
|
|
text-align: center;
|
|
|
font-size: $uni-font-size-general-two;
|
|
|
- color: $uni-general-color-two;
|
|
|
-
|
|
|
+ color: #ffffff;
|
|
|
+ &.pay-code {
|
|
|
+ margin-bottom: #{20rpx};
|
|
|
+ font-size: $uni-font-size-weak-two;
|
|
|
+ .pay-code-icon {
|
|
|
+ width: #{44rpx};
|
|
|
+ height: #{44rpx};
|
|
|
+ }
|
|
|
+ }
|
|
|
.address-btn-icon {
|
|
|
- width: #{56rpx};
|
|
|
- height: #{56rpx};
|
|
|
+ width: #{44rpx};
|
|
|
+ height: #{44rpx};
|
|
|
}
|
|
|
}
|
|
|
|
| xqd
@@ -361,7 +455,8 @@
|
|
|
|
|
|
.style-2 {
|
|
|
text-align: center;
|
|
|
-
|
|
|
+ position: relative;
|
|
|
+
|
|
|
.info-container {
|
|
|
margin-top: -#{50rpx};
|
|
|
}
|
| xqd
@@ -393,6 +488,17 @@
|
|
|
.u-refresh.member-margin {
|
|
|
margin-bottom: 12upx;
|
|
|
}
|
|
|
+ .pay-code {
|
|
|
+ margin-bottom: #{20rpx};
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ font-size: $uni-font-size-weak-two;
|
|
|
+ margin-left: #{96rpx};
|
|
|
+ .pay-code-icon {
|
|
|
+ width: #{44rpx};
|
|
|
+ height: #{44rpx};
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
|