Files
douhuo-h5/pages/user/setup.vue
2023-05-15 13:18:38 +08:00

432 lines
11 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="content">
<view class="setupItem">
<view class="label" @click="albumClick">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_01.png" mode="aspectFill"></image>
<view class="label-name-text">修改头像</view>
</view>
<view class="label-tips">
<image class="label-name-head" :src="avatar ? avatar : '/static/imgs/default_myHead.png'" mode="aspectFill"></image>
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<view class="label" @click="$Router.push({name: 'Modify'})">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_02.png" mode="aspectFill"></image>
<view class="label-name-text">修改密码</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<view class="label" @click="$Router.push({name: 'Authsuccess'})" v-if="certification">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_03.png" mode="aspectFill"></image>
<view class="label-name-text">实名认证</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<view class="label" @click="$Router.push({name: 'sheetIdcard'})" v-else>
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_03.png" mode="aspectFill"></image>
<view class="label-name-text">实名认证</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<!-- <view class="label" @click="$Router.push({name: 'Invite'})">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_03.png" mode="aspectFill"></image>
<view class="label-name-text">邀请码</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view> -->
</view>
<view class="setupItem">
<view class="label" @click="$Router.push({name: 'Referee'})">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_04.png" mode="aspectFill"></image>
<view class="label-name-text">我的伙伴</view>
</view>
<view class="label-tips">
<view class="label-name-number" v-if="childrenCount">{{childrenCount}}</view>
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<view class="label" @click="$Router.push({name: 'SignLog'})">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_08.png" mode="aspectFill"></image>
<view class="label-name-text">合同查看</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<view class="label" @click="$Router.push({name: 'Parent'})">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_05.png" mode="aspectFill"></image>
<view class="label-name-text">业务联系人</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<view class="label" @click="delSubscribe" v-if="hasSubscribe">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_07.png" mode="aspectFill"></image>
<view class="label-name-text">{{hasTitle}}</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
<view class="label" @click="followSubscribe" v-else>
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_07.png" mode="aspectFill"></image>
<view class="label-name-text">{{hasTitle}}</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
</view>
<view class="setupItem">
<view class="label" @click="$Router.push({name: 'AppDown'})">
<view class="label-name">
<image class="label-name-img" src="/static/imgs/zK_06.png" mode="aspectFill"></image>
<view class="label-name-text">APP下载</view>
</view>
<view class="label-tips">
<image class="label-name-arrow" src="/static/imgs/zK_arrow.png" mode="widthFix"></image>
</view>
</view>
</view>
<view class="setupItem">
<view class="signOut" @click="outLogin">
退出登录
</view>
</view>
<!-- 关注公众号弹出 -->
<view class="tipsBack" v-if="generalShow"></view>
<view class="tipsCont" v-if="generalShow">
<view class="tipsWhite">
<image class="tipsCont-img" src="@/static/imgs/general_back.png" mode="widthFix"></image>
<view class="tipsWhite-top">
<view class="tipsWhite-name">
关注抖火法律咨询公众号
</view>
<view class="tipsWhite-text">
关注后可立即下单
</view>
</view>
<view class="tipsWhite-btn">
<view class="tipsWhite-btn-go" @click="generalShow = false">
稍后关注
</view>
<view class="tipsWhite-btn-go" @click="judgeGeneral">
马上关注
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { userIndex, setting, userSubscribe, judgeReal } from '@/apis/interfaces/user'
import { authFollow } from '@/apis/interfaces/index'
import { uploads } from '@/apis/interfaces/uploading'
export default {
data() {
return {
avatar : '', //用户头像
childrenCount: '', // 下级人数
certification: '', // 是否认证
hasSubscribe : '', // 是否关注公众号
hasTitle : '', // 是否关注公众号-标题
generalShow : false ,// 公众号
};
},
onShow() {
// 获取用户信息
this.userInfo();
// 判断是否认证
this.sheetClick();
},
methods:{
// 用户信息
userInfo() {
userIndex().then(res => {
this.avatar = res.avatar
this.childrenCount = res.children_count.one
this.certification = res.certification
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
},
// 判断是否认证
sheetClick(){
// 获取微信授权信息
judgeReal().then(res => {
if(res.has_subscribe) {
this.hasTitle = '解除公众号'
} else {
this.hasTitle = '关注公众号'
}
this.hasSubscribe = res.has_subscribe
}).catch( err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
},
// 相册选择图片
albumClick() {
var _this = this
uni.chooseImage({
count: 1, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album','camera'], // way是点击时传入的打开方式相机或相册
success: path=> {
uploads([{
uri : path.tempFilePaths[0]
}]).then(res => {
this.avatar = res.url[0]
// 上传头像
this.settingInfo('avatar', res.path[0])
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
});
},
// 上传用户信息
settingInfo(key, value) {
setting(key, {
value: value
}).then(res => {
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
// 退出登录
outLogin(){
this.$store.commit('setToken', '')
this.$Router.replaceAll({name: 'Index'})
},
// 删除用户微信数据和关注
delSubscribe() {
uni.showModal({
title: '温馨提示',
content: '是否解除公众号?',
confirmColor: '#da2b56',
success: res=> {
if (res.confirm) {
userSubscribe().then(res => {
// 判断是否认证
this.sheetClick();
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
// 绑定用户微信数据和关注
followSubscribe(){
// 弹出公众号
this.generalShow = true
},
// 状态
judgeGeneral(){
// 获取微信授权信息
authFollow({
// url: 'https://web.douhuofalv.com/webview/webCode'
url: 'https://web.douhuotest.douhuofalv.com/webview/webCode'
}).then(res => {
window.location.href = res
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
// 关闭公众号
this.generalShow = false
}
}
}
</script>
<style lang="scss" scoped>
.content {
background-color: #f7f9fa;
height: 100vh;
overflow-y: scroll;
}
.setupItem {
margin-bottom: $margin;
background-color: #ffffff;
.label {
line-height: 60rpx;
display: flex;
padding: $padding;
box-sizing: border-box;
border-bottom: 2rpx solid #f7f9fa;
&:last-child {
border: none;
}
.label-name {
display: flex;
flex: 1;
.label-name-img {
width: 34rpx;
height: 34rpx;
margin-top: 12rpx;
margin-right: 20rpx;
}
}
.label-tips {
display: flex;
.label-name-head {
width: 54rpx;
height: 54rpx;
border-radius: 50%;
margin-right: 20rpx;
}
.label-name-arrow {
width: 24rpx;
height: 24rpx;
margin-top: 18rpx;
}
.label-name-number {
display: inline-block;
background-color: $mian-color;
color: #ffffff;
border-radius: $radius * 3;
height: 36rpx;
line-height: 36rpx;
padding: 0 $padding - 10;
font-size: $title-size-sm;
margin: 12rpx 20rpx 0 0;
}
}
}
.signOut {
text-align: center;
line-height: 60rpx;
padding: $padding - 5 0;
color: $mian-color;
}
}
// 关注
.tipsBack {
position: fixed;
width: 100vw;
height: 100vh;
left: 0;
top: 0;
z-index: 9;
background-color: rgba(0, 0, 0, .8);
}
.tipsCont {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-box-pack: center;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 10;
padding: 0 10%;
box-sizing: border-box;
}
.tipsWhite {
background-color: #ffffff;
border-radius: 20rpx;
overflow: hidden;
}
.tipsWhite-top {
padding: $padding;
box-sizing: border-box;
text-align: center;
}
.tipsCont-img {
width: 100%;
}
.tipsWhite-name {
text-align: center;
color: #111111;
font-size: 34rpx;
font-weight: 600;
margin-bottom: 15rpx;
}
.tipsWhite-text {
font-size: 30rpx;
color: #666666;
line-height: 48rpx;
}
.tipsWhite-btn {
display: flex;
padding: $padding 10rpx;
box-sizing: border-box;
.tipsWhite-btn-go {
flex: 2;
color: #fff;
margin: 0 15rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
border: 2rpx solid #F6F6F6;
background-color: #007df5;
border-radius: $radius-m;
&:first-child {
color: #333333;
background-color: #ffffff;
border: 2rpx solid #cccccc;
}
}
}
</style>