中品加油
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

407 lines
11 KiB

<template>
<view class="bg-white page-content">
<view class="bg-img padding-bottom-lg flex align-center"
style="background-image: url(https://xoil-public.oss-cn-beijing.aliyuncs.com/baichuan_MP/bg-wg@ZP.png);height: 600upx;">
<view class="padding-xl margin-top bg-tm text-white top-part">
<view class="padding-xs padding-top-lg text-sm padding-top">
Hi{{(user.name?user.name:wxInfo.nickName)|nameKong}}师傅愿你开心每一天!
</view>
<view class="padding-xs padding-bottom-lg">
<view class="cu-list menu-avatar padding-bottom-lg">
<view class="cu-item bg-tm no-mr-border">
<view v-if="wxInfo.avatarUrl" class="cu-avatar round xl" @tap="getUserInfo"
:style="'background-image:url('+wxInfo.avatarUrl+')'">
</view>
<view v-else class="cu-avatar round xl" @tap="getUserInfo"
:style="'background-image:url('+imgURL+'default-avator.png)'">
</view>
<view class="content padding padding-top-sm" @tap="onTapUserInfo">
<view class="text-cut text-xl padding-bottom-xs">
{{(user.name?user.name:wxInfo.nickName)|nameKong}}
</view>
<view class="text-sm">
<view class="text-cut zh-label">ID:{{user.userCode?user.userCode:'未登录'}}</view>
<view class="text-cut zh-label">{{user.userPhone?user.userPhone:'点击登录'}}</view>
</view>
</view>
<view class="action" @tap="onTapUserInfo">
<text class="cuIcon-right text-lg"></text>
</view>
</view>
</view>
</view>
</view>
</view>
<view style="margin-bottom: 10rpx;" class="xu-content margin">
<view style="border-radius: 6px 6px 0px 0px !important;" class="bg-white self-card person-card radius my-shadow" v-if="!isCompany">
<view class="flex solid-bottom padding-xs justify-between person-vip">
<view class="radius padding-xs text-xs">
<!-- <text class="icon-person cuIcon-crownfill padding-right-xs"></text> -->
<my-icon iconName="wd-ge-hy.png" class="padding-right-xs"></my-icon>
<text class="icon-person ">个人会员</text>
</view>
<!-- <view class="radius padding-xs text-xs" @tap="changeAccount('1')">
<my-icon iconName="wd-qh.png" class="padding-right-xs"></my-icon>
<text class="text-white ">
<image :src="starUrl+'wd-qh.png'" class="van-icon__image van-icon"></image>
切换企业会员
</text>
</view> -->
</view>
<!-- <view class="padding-xl text-center padding-top padding-bottom">
<view class="text-sl text-bold text-black">
{{userTotal.oilCardTotalPrice|moneyFormat}}
</view>
<view class="text-sm">
星油豆
</view>
<view class="flex padding-xs margin-top-sm justify-around ">
<view class="radius padding-xs">
<button class="cu-btn mr-btn mr-back-btn" @tap="toCards">消费明细</button>
</view>
<view class="radius padding-xs">
<button class="cu-btn mr-btn" @tap="routerTo('/BagMoney/pages/reCharge/reCharge')">
<text class=" padding-left padding-right">充值</text>
</button>
</view>
</view>
</view> -->
</view>
<view class="bg-white self-card person-card radius my-shadow" v-if="isCompany">
<view class="flex solid-bottom padding-xs justify-between company-vip">
<view class="radius padding-xs text-xs">
<!-- <text class="icon-company cuIcon-crownfill padding-right-xs"></text> -->
<my-icon iconName="wd-qy-hy.png" class="padding-right-xs"></my-icon>
<text class="icon-company text-xs">企业会员</text>
</view>
<!-- <view class="radius padding-xs text-xs" @tap="changeAccount('0')">>
<my-icon iconName="wd-qh.png" class="padding-right-xs"></my-icon>
<text class="text-white">
<image :src="starUrl+'wd-qh.png'" class="van-icon__image van-icon"></image>
切换个人会员
</text>
</view> -->
</view>
<view class="padding-sm margin-bottom" @tap="toCards">
<view class="color-666 text-sm">
<!-- 山东星卡互联科技有限公司 -->
</view>
<view class=" padding-sm text-center">
<view class="text-sl text-bold text-black">
{{userTotal.oilCardTotalPrice|moneyFormat}}
</view>
<view class="text-sm">
钱包余额(元)
</view>
</view>
<!-- <view class="grid col-2 cu-list text-center margin-top-sm margin-bottom-sm ">
<view class="cu-item no-mr-border">
<view class="text-xxl text-bold text-black">
{{userTotal.oilCardTotalPrice|moneyFormat}}
</view>
<view class="text-sm">
钱包余额(元)
</view>
</view>
<view class="cu-item no-mr-border">
<view class="text-xxl text-bold text-black">
{{userTotal.oilCardTotalPrice|moneyFormat}}
</view>
<view class="text-sm">
钱包余额(元)
</view>
</view>
</view> -->
<view class="text-center">
<text class="text-sm">您一共有
<text
class="oil-main-color padding-left-xs padding-right-xs">{{userTotal.oilCardNumber}}</text>
张油卡</text>
</view>
</view>
</view>
</view>
<view style="margin-top: 10rpx;border-radius: 0 0 6px 6px;" class="xu-content card-menu margin margin-bottom-xs radius my-shadow">
<view class=" cu-list sm-border grid col-4 no-border ">
<view class="cu-item">
<view class=" padding-tb-0">
<view class="image-self-view">
<img :src="otherImgURL+'hb@ZP.png'" lazy-load class="png" mode="widthFix"></img>
</view>
</view>
<text>红包卡券</text>
</view>
<view class="cu-item">
<view class=" padding-tb-0">
<view class="image-self-view">
<img :src="otherImgURL+'hd@ZP.png'" lazy-load class="png" mode="widthFix"></img>
</view>
</view>
<text>活动通知</text>
</view>
<view class="cu-item">
<view class=" padding-tb-0">
<view class="image-self-view">
<img :src="otherImgURL+'tj@ZP.png'" lazy-load class="png" mode="widthFix"></img>
</view>
</view>
<text>推荐有礼</text>
</view>
<view class="cu-item" @tap="goToPage('/BagAuth/pages/agreeMent/OperationGuide')">
<view class=" padding-tb-0">
<view class="image-self-view">
<img :src="otherImgURL+'sm@ZP.png'" lazy-load class="png" mode="widthFix"></img>
</view>
</view>
<text>操作说明</text>
</view>
</view>
</view>
<view class="xu-content padding-sm">
<view class="cu-list menu">
<view class="cu-item hidden-cu-item">
</view>
<view class="cu-item arrow">
<view class="content">
<image :src="starUrl+'zskf.png'" class="png" mode="aspectFit"></image>
<text class="text-grey padding-left-sm">专属客服</text>
</view>
<view class="action">
<button class="cu-btn oil-main-btn-color" open-type="contact" @contact="onContact">
<text class="text-grey text-sm">打开会话</text>
</button>
</view>
</view>
<view class="cu-item arrow">
<view class="content">
<image :src="starUrl+'gywm.png'" class="png" mode="aspectFit"></image>
<text class="text-grey padding-left-sm">关于我们</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import oilSiteApi from '@/api/oil-site.js'
import accountApi from '@/api/account.js'
export default {
props: {
},
data() {
return {
otherImgURL: this.global.otherImgURL,
imgURL: this.global.imgURL ,
starUrl: this.global.starUrl,
isCompany: uni.getStorageSync('accountStatus'),
user: uni.getStorageSync('user'),
wxInfo: uni.getStorageSync('wxInfo'),
userTotal:{}
};
},
onShow() {
this.getAuthInfo()
this.getAmount()
},
methods: {
goToPage(url) {
if (!url) return;
uni.navigateTo({
url
});
},
getAuthInfo() {
oilSiteApi.getUserAuthInfo().then(res => {
if (res.code === 20000) {
// realStatus: 0 vehicleStatus: 0
if (this.showAuthFrzen <= new Date().getTime()) {
this.showAuthFrror = res.data.realStatus&& res.data.vehicleStatus ? false : true
}
}
})
},
onTapUserInfo(){
if(uni.getStorageSync('user')){
this.routerTo('/BagSetup/setup/setup')
}else{
uni.reLaunch({
url:'../../../BagAuth/pages/login/login'
})
}
},
getUserInfo() {
uni.getUserProfile({
desc: '获取您的头像昵称',
success: (res) => {
console.log(res)
this.wxInfo = JSON.parse(res.rawData)
uni.setStorageSync('wxInfo', JSON.parse(res.rawData))
},
complete: (msg) => {
console.log(msg)
}
})
},
changeAccount(type) {
// 切换账户类型为
// this.$emit('switchType',type)
},
toCards() {
uni.navigateTo({
url: '/BagMoney/pages/oilCards/oilCards'
})
},
getAmount() {
accountApi.getTotalOilCardInfo().then(res => {
if (res.code == 20000) {
this.userTotal = res.data
}
})
},
copy() {
uni.setClipboardData({
data: 'lallalala',
success() {
uni.showToast({
title: '复制成功',
position: 'bottom',
icon: 'none'
})
}
})
},
toAuth() {
uni.navigateTo({
url: '/pages/authentication/authForm/authForm'
})
},
toQrcode() {
uni.navigateTo({
url: '/pages/qrcode/qrcodeList/qrcodeList'
});
},
routerTo(url) {
uni.navigateTo({
url: url
});
},
toLogin() {
uni.navigateTo({
url: 'pages/login/login'
});
},
// 拨打电话
makeCall() {
uni.makePhoneCall({
phoneNumber: '4008-56-5355' //仅为示例
})
},
onContact(e) {
// console.log(e)
}
},
filters: {
moneyFormat(value) {
if (value) {
return value.toFixed(2)
} else {
return '0.00'
}
},
nameKong(value) {
if (value) {
return value
} else {
return ''
}
}
}
};
</script>
<style scoped>
.content {
height: 100%;
}
.bottom-bar {
position: relative;
padding-top: 50px;
margin-bottom: 0;
margin-top: 0;
}
.main-topbar>>>.cu-bar {
height: 380rpx !important;
z-index: 0 !important;
}
.main-topbar>>>.cu-bar .content {
padding-bottom: 300rpx;
}
.bottom-bar-fixed {
position: fixed;
bottom: 0;
padding-top: 70rpx;
width: 100%;
}
.main-money {
position: relative;
z-index: 1;
}
.van-tag {
display: inline-block;
padding: 0.3rem 0.4rem;
position: absolute;
right: 1px;
font-size: 12px;
top: 25%;
background-color: #b9ffca;
border-radius: 10rem 0 0 10rem;
border-color: transparent;
}
.top-part {
min-width: 100%;
position: relative;
z-index: 0;
}
.zh-label {
line-height: 1.1rem;
}
.xu-content {
position: relative;
z-index: 1;
top: -160upx;
}
.hidden-cu-item {
min-height: 1upx !important;
}
.card-menu>>>image.png.user-png {
max-height: 100upx;
}
.image-self-view>>>img {
width: 3.5rem !important;
height: 3.5rem !important;
display: inline-block;
}
.cu-avatar{
background-color: transparent !important;
}
</style>