个人中心新增绑定关系

This commit is contained in:
唐明明
2022-07-19 11:57:20 +08:00
28 changed files with 10492 additions and 4458 deletions

View File

@@ -1,12 +1,15 @@
<template>
<view class="content">
<!-- 用户信息 -->
<view class="info-box">
<image src="@/static/user/user_back.png" mode="aspectFill" />
<view class="user-flex">
<view class="info-box" style="background-color: red;">
<image src="@/static/user/user_back.png" mode="aspectFill" />
<view class="user-flex">
<view class="news" @click="onBtn('newsIndex', {})">
<u-icon class="bell_fill" name="bell-fill" color="#fff" size="28" />
<u-badge class="bell_fill_dot" :isDot="messages > 0" type="error" />
</view>
<image class="cover" @click="onBtn('Setting', {})"
:src="userInfo.avatar || require('@/static/user/cover.png')" mode="aspectFill" />
<view class="user-content">
<view class="name">{{ userInfo.nickname }}</view>
<view class="tabs">
@@ -91,6 +94,17 @@
<image class="icon" src="@/static/user/userIcon_02.png" mode="widthFix" />
导出助记词
<uni-icons class="forward" type="forward" color="#999" />
</view>
<view class="btns-box-item" @click="onWbt">
<image class="icon" src="@/static/user/userIcon_02.png" mode="widthFix" />
文版通账号
<uni-icons class="forward" type="forward" color="#999" />
</view>
<view class="btns-box-item" @click="resetPassword">
<image class="icon" src="@/static/user/userIcon_13.png" mode="widthFix" />
{{hasPassword ? '修改' : '设置'}}支付密码
<uni-icons class="forward" type="forward" color="#999" />
</view>
<block v-if="canSeeData">
<view class="btns-box-item" @click="onBtn('DataBoard', {})">
@@ -116,12 +130,19 @@
供应商入驻
<uni-icons class="forward" type="forward" color="#999" />
</view>
<view class="btns-box-item" @click="resetPassword">
<image class="icon" src="@/static/user/userIcon_13.png" mode="widthFix" />
{{hasPassword ? '修改' : '设置'}}支付密码
<uni-icons class="forward" type="forward" color="#999" />
</view>
</view>
</view>
<view class="btns-box">
<view class="btns-box-item" @click="onShare">
<image class="icon" src="@/static/user/userIcon_14.png" mode="widthFix" />
绑定分享关系
<block v-if="share == null">
<uni-icons class="forward" type="forward" color="#999" />
</block>
<block v-else>
<text class="forward" style="color: gray;">{{share.nickname}}</text>
</block>
</view>
</view>
<view class="btns-box">
<view class="btns-box-item" @click="onBtn('Feedback', {})">
<image class="icon" src="@/static/user/userIcon_06.png" mode="widthFix" />
@@ -149,7 +170,7 @@
<view>The total force ecological</view>
</view>
<!-- 助记词弹出框 -->
<u-modal :show="wordsShow" :zoom="false" confirmText="复制" @confirm="copyWord" confirmColor="#34CE98">
<u-modal :show="wordsShow" :zoom="false" confirmText="复制" @confirm="copyWord('zjc')" confirmColor="#34CE98">
<slot default>
<view class="wordsCont">
<view class="wordsCont-title">导出助记词</view>
@@ -160,6 +181,18 @@
</view>
</slot>
</u-modal>
<!-- 查看文版通账号 -->
<u-modal :show="wbtShow" :zoom="false" confirmText="复制" @confirm="copyWord('wbt')" confirmColor="#34CE98">
<slot default>
<view class="wordsCont">
<view class="wordsCont-title">文版通账号</view>
<view class="wordsCont-tips">请务必抄下文版通账号并存在安全的地方若文版通账号丢失重装或换设备登录时将无法查看历史消息若文版通账号被他人获取将可能获取你的信息</view>
<view class="wordsCont-text">账号{{wbtAccount}}</view>
<image class="wordsCont-close" @click="wordsShow = false;wbtShow= false;" src="@/static/icon/userCloes.png"
mode="widthFix"></image>
</view>
</slot>
</u-modal>
<!-- 输入支付密码 -->
<u-modal :show="showIv" title="请输入钱包支付密码" :showCancelButton="true" confirmColor="#34CE98" negativeTop="160"
@confirm="validationIv" @cancel="()=>{ this.showIv = false, this.iv = '' }">
@@ -169,21 +202,46 @@
placeholder="输入支付密码" />
</view>
</slot>
</u-modal>
</u-modal>
<!-- 绑定分享关系 -->
<u-modal
:show="showBind"
confirmColor="#34CE98"
:showCancelButton="true"
:confirmText="isInvitation ? '校验邀请码': '绑定关系'"
@cancel="()=> {
this.showBind = false
this.isInvitation = true
this.invitation = ''
}"
@confirm="onBind"
>
<slot>
<view class="bind-view" v-if="isInvitation">
<view class="bind-title">邀请码</view>
<view class="bind-subtitle">请输入好友的邀请码</view>
<view class="bind-input">
<input type="text" v-model="invitation" placeholder="输入邀请码">
</view>
</view>
<view class="bind-user" v-else>
<view class="bind-title">邀请用户</view>
<view class="bind-subtitle">请确认绑定关系用户信息</view>
<view class="bind-acitve">
<image :src="invitationUser.avatar" mode="aspectFill"></image>
</view>
<view class="bind-nickname">{{invitationUser.nickname}}</view>
<view class="bind-username">{{invitationUser.username}}</view>
</view>
</slot>
</u-modal>
</view>
</template>
<script>
import {
info,
chainSeed
} from '@/apis/interfaces/user';
import {
payPassword
} from '@/apis/interfaces/account.js'
import {
getVersions
} from '@/apis/interfaces/versions.js'
import { info, chainSeed, relationsBind, relationsVerify } from '@/apis/interfaces/user';
import { payPassword } from '@/apis/interfaces/account.js'
import { getVersions } from '@/apis/interfaces/versions.js'
export default {
data() {
return {
@@ -219,42 +277,117 @@
isWallet: false,
walletNum: 0,
// 数据看板权限
canSeeData: false
canSeeData: false,
messages:0,
wbtAccount:'',
wbtShow:false,
// 绑定关系
share : null,
showBind : false,
invitation : '',
isInvitation : true,
invitationUser : {}
};
},
onShow() {
// if(uni.getStorageSync('isWalleNum') != '' && uni.getStorageSync('isWalleNum') === 1) this.isWallet = true
this.getInfo();
},
methods: {
methods: {
onWbt(){
if(this.wbtAccount === ''){
uni.showModal({
title:'温馨提示',
content:'当前账号没有绑定文版通账号,是否现在就去绑定',
confirmText:'立即绑定',
cancelText:'先不绑定',
success:(res) => {
if(res.confirm){
this.$Router.push({name:'WbtBind'})
}
}
})
}else{
this.wbtShow = true;
}
},
// 绑定分享关系
onShare(){
if(this.share != null){
return
}
this.showBind = true
},
// 绑定邀请码
onBind(){
// 检验邀请码
if(this.isInvitation){
if(this.invitation === ''){
uni.showToast({
title: '请输入邀请码',
icon : 'none'
})
return
}
relationsVerify(this.invitation).then(res => {
this.invitationUser = res
this.isInvitation = false
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
return
}
// 绑定关系
relationsBind(this.invitation).then(res => {
this.showBind = false
uni.showModal({
title : '提示',
content : '关系绑定成功',
showCancel : false,
success : res => {
this.getInfo()
}
})
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
// 用户信息
getInfo() {
if (this.$store.state.token === '') return;
info().then(res => {
uni.setNavigationBarTitle({
title: res.nickname
});
this.canSeeData = res.can_see_data
this.order = res.order
this.cardText = res.identity_array
this.userInfo = {
nickname: res.nickname,
addr: res.addr,
avatar: res.avatar,
isOpenVip: res.is_open_vip,
username: res.username
}
this.identity = res.identity
this.account = res.account
this.serial = res.serial
this.hasPassword = res.has_transfer_password
})
.catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
});
});
info().then(res => {
uni.setNavigationBarTitle({
title: res.nickname
});
this.share = String(res.share) == '' ? null : res.share
this.canSeeData = res.can_see_data
this.order = res.order
this.cardText = res.identity_array
this.userInfo = {
nickname: res.nickname,
addr: res.addr,
avatar: res.avatar,
isOpenVip: res.is_open_vip,
username: res.username
}
this.identity = res.identity;
this.account = res.account;
this.serial = res.serial;
this.hasPassword = res.has_transfer_password;
this.messages = Number(res.messages);
this.wbtAccount = res.wbt_account;
}).catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
});
});
},
// 导出助记词
onMnemonic() {
@@ -312,7 +445,7 @@
})
},
// 按钮导航
onBtn(name, params) {
onBtn(name, params) {
this.$Router.push({
name,
params
@@ -361,13 +494,14 @@
}
},
// 复制助记词
copyWord() {
copyWord(type) {
uni.setClipboardData({
data: this.mnemonic,
data: type === 'zjc'?this.mnemonic:this.wbtAccount,
success: () => {
this.wordsShow = false
this.wordsShow = false
this.wbtShow = false
uni.showToast({
title: '助记词已复制',
title: type === 'zjc' ? '助记词已复制' : '文版通账号已复制',
icon: 'none',
mask: true
})
@@ -453,8 +587,82 @@
.content {
background: $window-color;
min-height: 100vh;
}
}
// 邀请码
.bind-view{
padding: 15rpx 30rpx;
width: 100%;
box-sizing: border-box;
.bind-title{
text-align: center;
font-size: 36rpx;
font-weight: bold;
}
.bind-subtitle{
line-height: 40rpx;
font-size: 28rpx;
color: gray;
padding-top: 15rpx;
text-align: center;
}
.bind-input{
padding-top: 30rpx;
input{
background: #f8f8f8;
width: 100%;
height: 80rpx;
padding: 0 30rpx;
border-radius: 40rpx;
text-align: center;
box-sizing: border-box;
font-size: 32rpx;
font-weight: bold;
}
}
}
// 确认绑定用户关系
.bind-user{
padding: 15rpx 30rpx;
width: 100%;
box-sizing: border-box;
.bind-title{
text-align: center;
font-size: 36rpx;
font-weight: bold;
}
.bind-subtitle{
line-height: 40rpx;
font-size: 28rpx;
color: gray;
padding-top: 15rpx;
text-align: center;
}
.bind-acitve{
text-align: center;
padding-top: 30rpx;
image{
width: 108rpx;
height: 108rpx;
background: #f8f8f8;
border-radius: 50%;
}
}
.bind-nickname{
text-align: center;
font-size: 32rpx;
color: #333;
font-weight: bold;
line-height: 40rpx;
padding-top: 20rpx;
}
.bind-username{
text-align: center;
font-weight: bold;
font-size: 28rpx;
color: gray;
}
}
// 版权信息
.footer-text {
text-align: center;
@@ -476,13 +684,29 @@
right: 0;
width: 100%;
height: 100%;
// z-index: 100;
}
.user-flex {
position: relative;
padding: $padding * 2 $padding ($padding * 2 + 60);
height: 128rpx;
height: 128rpx;
.news{
top: -30rpx;
right: -30rpx;
position: relative;
.bell_fill_dot{
position: absolute;
top: 24rpx;
right: 46rpx;
z-index: 1000;
}
.bell_fill{
position: absolute;
right: 50rpx;
top: 30rpx;
z-index: 10000000;
}
}
.cover {
position: absolute;