chuangte_bike_newxcx/page_shanghu/shmy.vue

432 lines
11 KiB
Vue
Raw Permalink Normal View History

2025-12-20 14:29:10 +08:00
<template>
<view class="page">
<u-navbar title="个人中心" :is-back='false' :border-bottom="false" :background="bgc" title-color='#fff'
title-size='36' height='45'></u-navbar>
<view class="info">
<view class="lt">
<view class="pic">
<image :src="appimg.mineDefaultAvatar" mode="aspectFill" style="border-radius: 50%;width:112rpx;height: 112rpx;"></image>
</view>
<view class="cen">
<view class="name">
{{user.nickName == null ? '--' : maskName(user.nickName)}}
</view>
<view class="tel">
{{user.userName == null ? '--' : maskPhone(user.userName)}}
</view>
</view>
</view>
<!-- <u-icon name="arrow-right" color="#D8D8D8" size="28"></u-icon> -->
<view class=""></view>
</view>
<view class="zijin" @click="btntx">
<view class="top">
<view class="lt">
<view class="zh">
账户余额
</view>
<view class="price">
{{user.balance == null ? '0.00' : (Number(user.balance) + Number(waitDivideAmount)).toFixed(2)}}
</view>
</view>
<view class="rt">
<image src="https://api.ccttiot.com/smartmeter/img/static/uWybWHvfNvmi7X0hp93I" mode=""></image>
</view>
</view>
<view class="bot">
<view class="botlt">
可提现 {{user.balance == null ? '0.00' : user.balance.toFixed(2)}}
</view>
<view class="botrt">
累计提现 {{successAmount == null ? '0.00' : Number(successAmount).toFixed(2)}}
</view>
</view>
</view>
<view class="caozuolist">
<view class="itemcaozuo" @click="btnskzh">
<view class="lt">
<image src="https://api.ccttiot.com/smartmeter/img/static/ubmOhv58UFoPpg8fyTf5" mode=""></image> 收款账户
</view>
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
</view>
<view class="itemcaozuo" @click="btnbangzhu">
<view class="lt">
<image src="https://api.ccttiot.com/smartmeter/img/static/uHbCdZb2Z034155WseVr" mode=""></image> 使用帮助
</view>
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
</view>
<view class="itemcaozuo" @click="btnfuwuewm">
<view class="lt">
<image src="https://api.ccttiot.com/smartmeter/img/static/uKy9LoyuuVQAdeL8pvm7" mode=""></image> 消息通知
</view>
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
</view>
<view class="itemcaozuo" @click="btnLicense">
<view class="lt">
<image src="https://api.ccttiot.com/smartmeter/img/static/uiYvlUjghsWmJXbVnHdc" mode=""></image> 企业认证
</view>
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
</view>
<!-- <view class="itemcaozuo" @click="btnLicense">
<view class="lt">
<image src="https://api.ccttiot.com/smartmeter/img/static/ueOFWLPU7WhWW7AYgxh7" mode=""></image> 营业执照
</view>
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
</view> -->
</view>
<view class="caozuolist" style="height: 130rpx;padding-top: 40rpx;" @click="btnyh">
<view class="itemcaozuo" style="margin-top: 0;">
<view class="lt">
<image src="https://api.ccttiot.com/smartmeter/img/static/ubmOhv58UFoPpg8fyTf5" mode=""></image> 进入用户端
</view>
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
</view>
</view>
<view class="caozuolist" style="height: 130rpx;padding-top: 40rpx;" @click="btnlogo">
<view class="itemcaozuo" style="margin-top: 0;">
<view class="lt">
<image src="https://api.ccttiot.com/smartmeter/img/static/uId3DZ3vnrSHUfbsv2FF" mode=""></image> 退出登录
</view>
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
</view>
</view>
<view class="fuwuewm" v-if="fuwuewm">
<image src="https://api.ccttiot.com/qrcode_for_gh_25c71c637dbc_344%20(2)-1753329225290.jpg" show-menu-by-longpress @longpress="handleLongPress" mode=""></image>
<text class="" style="width: 100%;text-align: center;margin-top: 20rpx;display: block;color: #fff;">
长按关注公众号租车信息不错过
</text>
<view class="" @click="fuwuewm = false">
关闭
</view>
</view>
<view class="mask" style="background-color: rgba(0, 0, 0, 0.7);" v-if="fuwuewm"></view>
<TabBar :indexs='4' style=""></TabBar>
</view>
</template>
<script>
import TabBar from '@/page_shanghu/components/tab-bar/tab-bar.vue'
export default {
components: { TabBar },
data() {
return {
bgc: {
backgroundColor: " ",
},
fuwuewm:false,
appimg: this.$store.state.app.imgConfig,
user:{},
waitDivideAmount:'',
successAmount:'',
licenseInfo: null, // 营业执照信息
authTypes: [] // 认证类型数组
}
},
onLoad() {
},
onShow() {
2026-01-28 18:00:39 +08:00
this.$store.dispatch('jiance');
2025-12-20 14:29:10 +08:00
this.getinfo()
},
methods: {
// 点击企业认证
btnLicense(){
let url = '/page_shanghu/upload_license';
if(this.user.userId){
url += '?userId=' + this.user.userId;
}
uni.navigateTo({
url: url,
success: (res) => {
console.log('跳转成功:', res);
},
fail: (err) => {
console.error('跳转失败:', err);
uni.showToast({
title: '跳转失败,请稍后重试',
icon: 'none'
})
}
})
},
// 点击跳转收款账户
btnskzh(){
if(this.user.isReal == true){
uni.navigateTo({
url:'/page_user/shoukuan/index'
})
}else{
uni.showModal({
title: '提示',
content: '您还未通过实名认证,是否前往?',
showCancel: true,
success: function (res) {
if (res.confirm) {
uni.navigateTo({
url:'/page_user/shiming'
})
} else if (res.cancel) {
console.log('取消') // 用户点击取消
}
}
})
}
},
// 点击进行跳转点击去提现
btntx(){
uni.navigateTo({
url:'/page_shanghu/gongzuotai/AccountDetails'
})
},
// 点击跳转到商户使用帮助
btnbangzhu(){
uni.navigateTo({
url:'/page_fenbao/bangzhu/index'
})
},
// 获取个人信息
getinfo(){
this.$u.get("/getInfo").then((res) => {
if(res.code == 200){
this.user = res.user
this.authTypes = res.user.authTypes || []
this.waitDivideAmount = res.stat.bonus.waitDivideAmount == null ? 0 : res.stat.bonus.waitDivideAmount
this.successAmount = res.stat.withdraw.successAmount == null ? 0 : Number(res.stat.withdraw.successAmount)
}
})
},
// 名称:将名称的第二位替换为 * 展示
maskName(name) {
if (!name || typeof name !== 'string') return name
const chars = Array.from(name)
if (chars.length < 2) return name
chars[1] = '*'
return chars.join('')
},
// 手机号:将手机号的中间四位替换为 * 展示
maskPhone(phone) {
if (!phone) return phone
const str = String(phone)
if (str.length < 7) return str
return str.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
},
// 点击回到用户页
btnyh(){
uni.reLaunch({
url:'/pages/nearbystores/index'
})
},
// 点击绑定服务号
btnfuwuewm(){
let that = this
wx.login({
success(res) {
if (res.code) {
that.$u.put(`/app/user/bindUnionId?jsCode=${res.code}`).then((res) => {
if (res.code == 200) {
that.fuwuewm = true
}else{
uni.showModal({
title: '提示',
content: res.msg,
showCancel:false,
})
}
})
}
},
})
},
// 点击退出登录
btnlogo(){
uni.showModal({
title: '提示',
content: '您确定要退出登录吗?',
showCancel: true,
success: function(res) {
if (res.confirm) {
try {
uni.clearStorageSync() // 同步清除
console.log('所有缓存已清除')
uni.showToast({
title: '缓存已清除',
icon: 'success',
duration: 3000
})
uni.reLaunch({
url: '/pages/login/login'
})
} catch (e) {
console.error('清除失败:', e)
uni.showToast({
title: '清除失败',
icon: 'none',
duration: 3000
})
}
} else if (res.cancel) {
console.log('取消'); // 用户点击取消
}
}
})
}
}
}
</script>
<style lang="scss">
page {
background: linear-gradient( 180deg, #4886F1 0%, rgba(66,151,243,0) 100%);
}
.mask{
width: 100%;
height: 100vh;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.3);
z-index: 9;
}
.fuwuewm{
position: fixed;
top: 30%;
left: 50%;
transform: translateX(-50%);
z-index: 10;
image{
width: 600rpx;
height: 600rpx;
}
view{
width: 200rpx;
height: 70rpx;
background-color: #4297F3;
color: #fff;
font-size: 32rpx;
text-align: center;
line-height: 70rpx;
margin: auto;
margin-top: 50rpx;
border-radius: 10rpx;
}
}
.caozuolist{
width: 718rpx;
height: 480rpx;
background: #FFFFFF;
border-radius: 24rpx 24rpx 24rpx 24rpx;
padding-top: 2rpx;
margin: auto;
margin-top: 24rpx;
.itemcaozuo{
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 48rpx;
margin-top: 52rpx;
.lt{
display: flex;
align-items: center;
image{
width: 54rpx;
height: 54rpx;
margin-right: 16rpx;
}
}
}
}
.zijin{
width: 718rpx;
height: 278rpx;
background: linear-gradient( 90deg,#2C8AF0 0%, #B6D9FF 100%);
border-radius: 24rpx 24rpx 24rpx 24rpx;
margin: auto;
margin-top: 24rpx;
position: relative;
overflow: hidden;
.bot{
width: 718rpx;
height: 70rpx;
background: linear-gradient( 90deg, rgba(205,224,255,0) 0%, #ACCBFF 34%, #CDE0FF 100%);
display: flex;
align-items: center;
position: absolute;
left: 0;
bottom: 0;
.botlt{
font-size: 28rpx;
color: #FFFFFF;
width: 50%;
height: 50rpx;
line-height: 50rpx;
border-right: 1px solid #fff;
padding-left: 36rpx;
}
.botrt{
font-size: 28rpx;
color: #FFFFFF;
width: 50%;
height: 50rpx;
line-height: 50rpx;
padding-left: 26rpx;
}
}
.top{
display: flex;
justify-content: space-between;
align-items: center;
.lt{
margin-top: 26rpx;
padding-left: 34rpx;
.zh{
font-size: 28rpx;
color: #FFFFFF;
}
.price{
margin-top: 30rpx;
font-size: 60rpx;
color: #FFFFFF;
font-weight: 600;
}
}
.rt{
image{
width: 196rpx;
height: 52rpx;
}
}
}
}
.info{
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
margin-top: 20rpx;
padding: 0 30rpx;
.lt{
display: flex;
align-items: center;
.pic{
width: 112rpx;
height: 112rpx;
// background: #D8D8D8;
margin-right: 36rpx;
border-radius: 50%;
}
.cen{
.name{
font-weight: 500;
font-size: 36rpx;
color: #FFFFFF;
}
.tel{
font-size: 28rpx;
color: #FFFFFF;
margin-top: 10rpx;
}
}
}
}
</style>