393 lines
9.3 KiB
Vue
393 lines
9.3 KiB
Vue
<template>
|
|
<view class="top">
|
|
<image class="bjtp" src="../../static/img/wobg.jpg" />
|
|
<view v-if="islogin" class="userinfor">
|
|
<view @tap="topage('/minePages/userInfor/index')" class="toux">
|
|
<image :src="toux()" />
|
|
<view>
|
|
<view class="niche">{{username()}}</view>
|
|
<!-- <view style="text-align: center;color: #484848;">{{userInfo.phoneNumber}}</view> -->
|
|
</view>
|
|
</view>
|
|
<view style="text-align: center;" @tap="topage('/minePages/account/index')">
|
|
<view style="font-size: 36rpx;text-align: center;">{{totalAmount/100}}</view>
|
|
<view style="color: #848484;">余额</view>
|
|
</view>
|
|
</view>
|
|
<view v-else class="userinfor">
|
|
<view class="toux">
|
|
<image src="../../static/img/toux.png" />
|
|
<view>未登录</view>
|
|
</view>
|
|
<view class="btn" @tap="topage('/pages/login/index')">登录</view>
|
|
</view>
|
|
<!-- <up-icon name="arrow-right" color="#bdbdbd" size="20" /> -->
|
|
</view>
|
|
<view class="gncont">
|
|
<template v-if="islogin">
|
|
<view class="gnrk" @tap="topage('/minePages/order/index')">
|
|
<view>
|
|
<image src="../../static/img/cd2.png" />
|
|
<view>我的订单</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="topage('/minePages/recharge/index')">
|
|
<view>
|
|
<image src="../../static/img/cd1.png" />
|
|
<view>充值中心</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="topage('/minePages/reserlist/index')">
|
|
<view>
|
|
<image src="../../static/img/shiyxy.png" />
|
|
<view>预约记录</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="topage('/minePages/vehicle/index')">
|
|
<view>
|
|
<image src="../../static/img/cd3.png" />
|
|
<view>我的车辆</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="topage('/minePages/company/index')">
|
|
<view>
|
|
<image src="../../static/img/cd4.png" />
|
|
<view>所属公司</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<view class="gnrk" @tap="wdltip">
|
|
<view>
|
|
<image src="../../static/img/cd2.png" />
|
|
<view>我的订单</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="wdltip">
|
|
<view>
|
|
<image src="../../static/img/cd1.png" />
|
|
<view>充值中心</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="wdltip">
|
|
<view>
|
|
<image src="../../static/img/shiyxy.png" />
|
|
<view>预约记录</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="wdltip">
|
|
<view>
|
|
<image src="../../static/img/cd3.png" />
|
|
<view>我的车辆</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<view class="gnrk" @tap="wdltip">
|
|
<view>
|
|
<image src="../../static/img/cd4.png" />
|
|
<view>所属公司</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
</template>
|
|
<view class="gnrk" @tap="kefu">
|
|
<view>
|
|
<image src="../../static/img/shiyxy.png" />
|
|
<view>客服热线</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
<!-- <view class="gnrk">
|
|
<view>
|
|
<image src="../../static/img/jrwm.png" />
|
|
<view>加入我们</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view> -->
|
|
<view class="gnrk" @tap="topage('/minePages/about/index')">
|
|
<view>
|
|
<image src="../../static/img/gywm.png" />
|
|
<view>关于我们</view>
|
|
</view>
|
|
<up-icon name="arrow-right" color="#b9b9b9" />
|
|
</view>
|
|
</view>
|
|
<!-- <view v-if="islogin" class="cdrk">
|
|
<view @tap="topage('/minePages/recharge/index')">
|
|
<image src="../../static/img/cd1.png" />
|
|
<view>充值</view>
|
|
</view>
|
|
<view @tap="topage('/minePages/order/index')">
|
|
<image src="../../static/img/cd2.png" />
|
|
<view>我的订单</view>
|
|
</view>
|
|
<view @tap="topage('/minePages/reserlist/index')">
|
|
<image src="../../static/img/shiyxy.png" />
|
|
<view>预约记录</view>
|
|
</view>
|
|
<view @tap="topage('/minePages/vehicle/index')">
|
|
<image src="../../static/img/cd3.png" />
|
|
<view>车辆管理</view>
|
|
</view>
|
|
</view> -->
|
|
|
|
<!-- <view v-else @tap="wdltip" class="cdrk">
|
|
<view>
|
|
<image src="../../static/img/cd1.png" />
|
|
<view>充值</view>
|
|
</view>
|
|
<view>
|
|
<image src="../../static/img/cd2.png" />
|
|
<view>我的订单</view>
|
|
</view>
|
|
<view>
|
|
<image src="../../static/img/shiyxy.png" />
|
|
<view>预约记录</view>
|
|
</view>
|
|
<view>
|
|
<image src="../../static/img/cd3.png" />
|
|
<view>车辆管理</view>
|
|
</view>
|
|
</view> -->
|
|
|
|
<!-- <view class="cdrk">
|
|
<view>
|
|
<image src="../../static/img/cd4.png" />
|
|
<view>优惠活动</view>
|
|
</view>
|
|
<view>
|
|
<image src="../../static/img/shiyxy.png" />
|
|
<view>客服中心</view>
|
|
</view>
|
|
<view>
|
|
<image src="../../static/img/gywm.png" />
|
|
<view>加入我们</view>
|
|
</view>
|
|
<view>
|
|
<image src="../../static/img/jrwm.png" />
|
|
<view>关于我们</view>
|
|
</view>
|
|
</view> -->
|
|
<!-- <view style="position: absolute;width:100%;bottom: 30rpx;text-align: center;color: #c1c1c1;">关于我们</view> -->
|
|
<!-- <cc-myTabbar :tabBarShow="2"></cc-myTabbar> -->
|
|
<mytabbar :tabBarShow="2" />
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref,reactive } from 'vue'
|
|
import { onShow } from '@dcloudio/uni-app'
|
|
import { getInfo,getaccou } from '@/utils/service'
|
|
|
|
import mytabbar from '@/components/mytabbar/mytabbar.vue'
|
|
|
|
uni.hideTabBar()
|
|
|
|
let islogin = ref(false)
|
|
let PhoneNumber = ref('')
|
|
|
|
let userInfo = reactive<any>({
|
|
phoneNumber:'',
|
|
avatarUrl:'',
|
|
name:'',
|
|
nickName:''
|
|
})
|
|
|
|
let totalAmount = ref(0)
|
|
function toux() {
|
|
return userInfo.avatarUrl?userInfo.avatarUrl:'../../static/img/toux.png'
|
|
}
|
|
|
|
onShow(() => {
|
|
if(uni.getStorageSync('wxuid')){
|
|
//获取用户信息
|
|
getInfo({
|
|
wuid:uni.getStorageSync('wxuid')
|
|
}).then((rps:any) => {
|
|
userInfo.phoneNumber = rps.data.phoneNumber?rps.data.phoneNumber:''
|
|
userInfo.nickName = rps.data.nickName?rps.data.nickName:''
|
|
userInfo.avatarUrl = rps.data.avatarUrl?rps.data.avatarUrl:''
|
|
userInfo.name = rps.data.name?rps.data.name:''
|
|
})
|
|
|
|
//获取账户信息
|
|
getaccou(uni.getStorageSync('wxuid')).then((rps:any) => {
|
|
if(rps.data.records){
|
|
totalAmount.value = rps.data.records[0].totalAmount
|
|
uni.setStorageSync('totalAmount', rps.data.records[0].totalAmount)
|
|
uni.setStorageSync('walletCode', rps.data.records[0].code)
|
|
}
|
|
})
|
|
|
|
|
|
islogin.value = true
|
|
// let pnum = uni.getStorageSync('PhoneNumber')
|
|
// if(pnum){
|
|
// PhoneNumber.value = pnum
|
|
// }
|
|
}else{
|
|
islogin.value = false
|
|
//PhoneNumber.value = ''
|
|
}
|
|
})
|
|
|
|
|
|
function username() {
|
|
if(userInfo.phoneNumber){
|
|
return userInfo.phoneNumber
|
|
}else if(userInfo.nickName){
|
|
return userInfo.nickName
|
|
}else if(userInfo.name){
|
|
return userInfo.name
|
|
}
|
|
return '微信用户'
|
|
}
|
|
|
|
//页面跳转
|
|
function topage(url:string){
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
}
|
|
|
|
function wdltip() {
|
|
uni.showToast({
|
|
title:'请您先登录',
|
|
icon:'none'
|
|
})
|
|
}
|
|
|
|
//客服热线
|
|
function kefu(){
|
|
uni.makePhoneCall({
|
|
phoneNumber: '400-888-12345' //示例
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page{
|
|
background: #f4f4f4;
|
|
}
|
|
.top{
|
|
box-sizing: border-box;
|
|
padding-bottom: 30rpx;
|
|
// width: 750rpx;
|
|
// height: 450rpx;
|
|
//display: flex;
|
|
//height: 400rpx;
|
|
// padding:200rpx 25rpx 50rpx;
|
|
// align-items: center;
|
|
// justify-content: space-between;
|
|
|
|
//background:linear-gradient(to bottom, #00aa7f , #fff);
|
|
.bjtp{
|
|
width: 750rpx;
|
|
height: 450rpx;
|
|
}
|
|
.userinfor{
|
|
position: relative;
|
|
display: flex;
|
|
margin: -80rpx 20rpx 20rpx;
|
|
padding: 20rpx 25rpx;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
background: #fff;
|
|
border-radius: 20rpx;
|
|
box-shadow: 0 0 20px 2px rgba(0, 170, 0, 0.5);
|
|
.toux{
|
|
display: flex;
|
|
align-items: center;
|
|
image{
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
border-radius: 50%;
|
|
}
|
|
view{
|
|
padding-left: 10rpx;
|
|
//font-size: 40rpx;
|
|
//font-weight: bold;
|
|
//color: #005500;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
.gncont{
|
|
margin: 0 25rpx;
|
|
border-radius: 20rpx;
|
|
background: #fff;
|
|
.gnrk{
|
|
display: flex;
|
|
box-sizing: border-box;
|
|
padding: 30rpx;
|
|
border-bottom: 1px solid #f4f4f4;
|
|
justify-content: space-between;
|
|
|
|
>view:first-child{
|
|
display: flex;
|
|
align-items:center;
|
|
image{
|
|
width: 45rpx;
|
|
height: 45rpx;
|
|
margin-right: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.cdrk{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin: 10rpx 30rpx 30rpx;
|
|
// padding: 20rpx;
|
|
// border-radius: 20rpx;
|
|
flex-wrap: wrap;
|
|
|
|
>view{
|
|
box-sizing: border-box;
|
|
width: 22%;
|
|
//margin: 25rpx;
|
|
//padding: 25rpx;
|
|
|
|
//margin-bottom: 50rpx;
|
|
text-align: center;
|
|
background: #ccc;
|
|
//box-shadow: 0 0 20px 2px rgba(221, 221, 221, 0.8);
|
|
image{
|
|
width: 70rpx;
|
|
height: 70rpx;
|
|
}
|
|
view{
|
|
padding-top: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
.niche{
|
|
width: 240rpx;
|
|
padding-left: 20rpx;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-align: left;
|
|
font-size: 36rpx;
|
|
color: #003829;
|
|
}
|
|
.btn{
|
|
width: 150rpx;
|
|
height:64rpx;
|
|
background: #00aa7f;
|
|
text-align:center;
|
|
color:#fff;
|
|
border-radius:10rpx;
|
|
line-height: 64rpx;
|
|
background: #5ac725;
|
|
}
|
|
</style> |