txCar/pages/me/me.vue

<template>
	<view class="box">
		<!-- <view @click="login">
			登录
		</view> -->
		<view class="headerBox">
			<view class="headerLeft">
				<image :src="ueserInfo.memberInfo.headUrl" mode="" class="headerImg" v-if="ueserInfo.memberInfo.headUrl"></image>
				<!-- <image src="../../static/img/pic_def_ava.png" mode="" class="headerImg" v-else></image> -->
				
				<view class="nickName">{{ueserInfo.memberInfo.nickName}}</view>
			</view>
			<view>
				<!-- <image src="../../static/img/icon_set.png" mode="" class="setImg" @click="gonavigateTo('../me/setup')"></image> -->
			</view>
		</view>

		<view class="meLineBox2">
			<view class="meLine2"  @click="gonavigateTo('../me/scGoodsList')">
			<!-- 	<image src="../../static/img/icon_star.png" mode="" class="maintainBottomImg"></image> -->
				<view class="maintainBottomTxt">商品收藏</view>
			</view>
			<view class="meLine2" @click="gonavigateTo('../me/gzshopList')">
				<!-- <image src="../../static/img/my_icon_store.png" mode="" class="maintainBottomImg"></image> -->
				<view class="maintainBottomTxt">门店关注</view>
			</view>
			<view class="meLine2" @click="gonavigateTo('../me/footprint')">
			<!-- 	<image src="../../static/img/my_icon_zuji.png" mode="" class="maintainBottomImg"></image> -->
				<view class="maintainBottomTxt">我的足迹</view>
			</view>
			<view class="meLine2" @click="gonavigateTo('discountCard')">
				<!-- <image src="../../static/img/icon_youhui.png" mode="" class="maintainBottomImg"></image> -->
				<view class="maintainBottomTxt">优惠券</view>
			</view>
		</view>
		<!-- 我的订单 -->
		<view class="orderBox">
			<view class="orderTitle">我的订单</view>
			<view class="orderLIneBox">
				<view class="orderLine" @click="goorder(1)">
					<view class="orderImgBox">
						<view class="orderNum" v-show="numList.sheetOne>0">{{numList.sheetOne}}</view>
						<!-- <image src="../../static/img/my_icon_2.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">待付款</view>
				</view>
				<view class="orderLine" @click="goorder(2)">
					<view class="orderImgBox">
						<view class="orderNum" v-show="numList.sheetTwo>0">{{numList.sheetTwo}}</view>
						<!-- <image src="../../static/img/my_icon_1.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">待服务</view>
				</view>
				<view class="orderLine" @click="goorder(4)">
					<view class="orderImgBox">
						<view class="orderNum" v-show="numList.sheetFour>0">{{numList.sheetFour}}</view>
						<!-- <image src="../../static/img/my_icon_5.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">待评价</view>
				</view>
				<view class="orderLine" @click="goorder(5)">
					<view class="orderImgBox">
						<!-- <image src="../../static/img/qubu.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">全部</view>
				</view>
			</view>
		</view>
		<!-- 常用功能 -->
		<view class="orderBox">
			<view class="orderTitle">常用功能</view>
			<view class="orderLIneBox">
				<view class="orderLine" @click="gonavigateTo('../car/carArchives')">
					<view class="orderImgBox">
						<!-- <image src="../../static/img/my_icon_staff.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">爱车档案</view>
				</view>
				<view class="orderLine" @click="gonavigateTo('myAppraise')">
					<view class="orderImgBox">
						<!-- <image src="../../static/img/qingjia.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">我的评价</view>
				</view>
				<view class="orderLine" @click="gonavigateTo('myIntegral')">
					<view class="orderImgBox">
						<!-- <image src="../../static/img/my_icon_review.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">我的积分</view>
				</view>
				<view class="orderLine" @click="gonavigateTo('feedBack')">
					<view class="orderImgBox">
						<!-- <image src="../../static/img/yjfk.png" mode="" class="orderLineImg"></image> -->
					</view>
					<view class="orderLineTxt">意见反馈</view>
				</view>
			</view>
		</view>
		<!-- 客服电话： -->
		<view class="phone" @click="call">
			<span class="phoneSpan1">客服电话：</span>
			<span class="phoneSpan2">{{numList.customerService.contents}}</span>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			ueserInfo:'',
			shopData:'',
			numList:'',
		}
	},
	onLoad() {
		 
	},
	onShow() {
		this.$common.isUserId()
		this.ueserInfo=uni.getStorageSync("logodata");
		this.shopData=uni.getStorageSync("shopData");
		this.queryMyDetail();
	},
	methods: {
		call(){
			uni.makePhoneCall({
			    phoneNumber: this.numList.customerService.contents
			}); 
		},
		goorder(num){
			uni.navigateTo({
				url:'../order/myorder?num='+num
			})
		},
        login(){
			uni.navigateTo({
				url:'../login/login'
			})
		},
		queryMyDetail(){
			uni.showLoading({ });
			this.$http('miniAppMyBMemberCar/queryMyDetail', {
			
			 },'GET').then(res => {
				uni.hideLoading();
			    this.numList=res.data
			})
		},
		gonavigateTo(url){
			uni.navigateTo({
				url:url
			})
		}
	}
}
</script>

<style scoped>
	.box{
		min-height: 100vh;
		background: linear-gradient(180deg, #FEF1E9 0%, #F4F5F7 100%);
		padding: 0 24rpx;
	}
	.flex{
		display: flex;
	}
	.headerBox{
		padding-top: 14rpx;
	}
	.headerImg{
		width: 90rpx;height: 90rpx;border-radius: 50%;
	}
	.setImg{
		width: 38rpx;height: 38rpx;margin-top: 25rpx;
	}
	.headerBox{
		display: flex;
		justify-content: space-between;
	}
	.headerLeft{
		display: flex;
	}
	.nickName{
		padding-left: 20rpx;line-height: 90rpx;color: #3C3C3C;font-size: 32rpx;
	}
	.shopBox{
		background: url('http://phone.66km.cn:8088/thFiles/41A4AA99-0EE8-47DE-88AB-2221820C346F.png') no-repeat;
		background-size: 100%;
		width: 702rpx;
		height: 80rpx;
		line-height: 80rpx;
		margin-top: 30rpx;
		display: flex;
		justify-content: space-between;
	}
	.shopName{
		color: #EBCE8F;padding-left: 20rpx;font-size: 28rpx;
	}
	.shopImg{
		width: 30rpx;height: 30rpx;
		margin-right: 20rpx;margin-top: 25rpx;
	}
	.maintain{
		margin-top: 20rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 25rpx 15rpx;
	}
	.maintainTopIcon{
		width: 56rpx;height: 56rpx;
	}
	.maintainTxt{
		font-size: 30rpx;
		color: #3C3C3C;
		line-height: 56rpx;
		padding-left: 20rpx;
	}
	.maintainTopNum{
		font-size: 30rpx;line-height: 56rpx;
		font-weight: 600;
		color: #FF4F00;
	}
	.shopcar{
		display: flex;
		justify-content: space-between;
		width: 310rpx;
	}
	.shuxian{
		width: 1px;
		height: 36rpx;
		background-color:#EEEEEE ;
		margin-top:10rpx ;
	}
	.shuxian2{
		width: 1px;
		height: 36rpx;
		background-color:#EEEEEE ;
		margin-top:4rpx ;
	}
	.maintainTop{
		display: flex;
		justify-content: space-between;
		padding-right: 10rpx;
		border-bottom: 1px solid #EEEEEE;
		padding-bottom: 20rpx;
	}
	.maintainBottomImg{
		width: 48rpx;
		height: 48rpx;
	}
	.maintainBottomTxt{
		font-size: 28rpx;
		color: #000000;
		padding-left: 6rpx;
	}
	.maintainBottom{
		display: flex;line-height: 42rpx;
		padding-top: 20rpx;justify-content: space-between;
	}
	.maintainBottomNum{
		font-size: 24pxr;
		color: #999999;
		padding-left: 6rpx;
	}
	.orderBox{
		margin-top: 30rpx;
		background: #FFFFFF;
		padding: 30rpx 0rpx;
		border-radius: 10rpx;
	}
	.orderTitle{
		font-size: 30rpx;
		color: #3C3C3C;
		font-weight: 600;
		padding-left: 20rpx;
	}
	.orderLine{
		width: 25%;
		text-align: center;
	}
	.orderLineImg{
		width: 60rpx;
		height: 60rpx;
	}
	.orderLineTxt{
		font-size: 26rpx;
		color: #3C3C3C;
	}
	.orderImgBox{
		text-align: center;
		position: relative;
	}
	.orderLIneBox{
		display: flex;
		justify-content: space-between;
		padding-top: 30rpx;
	}
	.orderNum{
		line-height: 26rpx;
		background: #FF4F00;
		padding: 0 8rpx;
		border-radius: 13rpx;
		color: #FFFFFF;
		font-size: 20rpx;
	    position: absolute;
		top: -5rpx;
		right: 38rpx;
		z-index: 11;
	}
	.phone{
		text-align: center;
		font-size: 28rpx;
		padding-top: 30rpx;
		color: #3C3C3C;
	}
	.phoneSpan2{
		color: #3F90F7;
	}
	.meLineBox2{
		display: flex;
		justify-content: space-between;
		padding-top: 50rpx;
		padding-bottom: 10rpx;
		
	}
	.meLine2{
		text-align: center;
		width: 25%;
	}
</style>