MALL_MP_WX/pages/personal/index.vue

<template>
	<view :style="{paddingTop:`${titleStyle.top+titleStyle.height}px`}"
		style="background: linear-gradient(180deg, #FF4A2B 0%, #F2F2F2 25%);" class="personal">
		<view class="personal_header flex ac">
			<view class="personal_header_left flex ac oneflex">
				<view class="headSculpture">
					<image v-if="user.headPhoto"  style="width: 100%;height: 100%;" mode="aspectFit"  :src="user.headPhoto"></image>
				</view>
				<view class="userDetails">
					<view class="name">{{user.name}}</view>
					<view class="account">当前积分：{{accountBalance}}</view>
				</view>
			</view>
			<view @click="goSeting" class="personal_header_right">
				<uni-icons type="gear" color="#ffffff" size="30"></uni-icons>
			</view>
		</view>
		<view class="personal_center">
			<view @click="goOrder" class="personal_center_header flex ac jw">
				<text style="font-size: 28rpx;"> 我的订单</text>
				<uni-icons color="#999999" type="right" size="20"></uni-icons>
			</view>
			<view class="menuList flex ">
				<view @click="goList(item)" v-for="item in options" class="menuItem">
					<image :src="item.logo"></image>
					<view class="title">{{item.title}}</view>
				</view>
			</view>
		</view>
		<view class="personal_footer oneflex">
			<view @click="othersClick(item)" v-for="item in others" class="personal_footer_row flex jw ac">
				<view class="flex ac oneflex">
					<image :src="item.logo"></image>
					<view style="margin-left: 20rpx;">{{item.title}}</view>
				</view>
				<uni-icons type="right" color="#999999" size="20"></uni-icons>
			</view>
		</view>
	</view>

</template>

<script>
	import homeApi from "@/api/home.js"
	import tool from '../../utils/tool.js'
	export default {
		data() {
			return {
				integral:null,
				imgUrl: this.baseImgURL,
				cards: uni.getStorageSync('cards'),
				user: uni.getStorageSync('user'),
				others: [{
					title: '积分记录',
					logo: require('../../static/jfjl@2x.png'),
					url: "/pages/personal/points"
				}, {
					title: '联系客服',
					logo: require('../../static/lxkf@2x.png'),
				}, {
					title: '意见反馈',
					logo: require('../../static/yjfk@2x.png'),
				}],
				options: [{
						logo: require('../../static/dth@2x.png'),
						title: '待提货',
						functionName: 'KillTheRecord',
						value:1
					},
					{
						logo: require('../../static/ywc@2x.png'),
						title: '已完成',
						functionName: 'ultramanVehicle',
						value:2
					},
					{
						logo: require('../../static/tk@2x.png'),
						title: '退款/售后',
						functionName: 'goCollect',
						value:99
					}
				],
				titleStyle: {}
			}
		},
		created() {
			this.init()
		},
		onShow() {
			this.myInfo()
		},
		//下拉刷新
		onPullDownRefresh() {
			this.myInfo()
		},
		filters: {
			filterPhone(str) {
				if (!str) return ' '
				let enStr = str.slice(0, 3) + '****' + str.slice(str.length - 4);
				return enStr
			}
		},
		computed:{
			accountBalance(){ 
				return this.integral.accountBalance?Number(this.integral.accountBalance).toFixed(0):0
			}
		},
		methods: {
			goList(item){
				uni.navigateTo({
					url:`/Order/pages/index/index?orderStatus=${item.value}`
				})
			},
			myInfo() {
				homeApi.myInfo().then(res => {
					if(res.code==20000){
						this.integral = res.data;
						uni.setStorageSync('user',Object.assign(this.user,{integral:this.integral}));
						 this.user = uni.getStorageSync('user');
					}
				}).finally(res=>{
					uni.stopPullDownRefresh();
				})
			},
			othersClick({
				url
			}) {
				if (url) {
					uni.navigateTo({
						url
					})
				}

			},
			goSeting() {
				uni.navigateTo({
					url: "/Seting/pages/index/index"
				})
			},
			goOrder() {
				uni.navigateTo({
					url: "/Order/pages/index/index"
				})
			},
			ultramanVehicle() {
				uni.navigateTo({
					url: '/ChargingStation/pages/vehicle/index'
				})
			},
			goCollect() {
				uni.navigateTo({
					url: '/ChargingStation/pages/collect/index'
				})
			},
			KillTheRecord() {
				this.$emit('switchTabBar', 3)
			},
			login() {
				if (!this.user) {
					uni.clearStorageSync();
					uni.reLaunch({
						url: '/pages/login/index'
					})
				}
			},
			isEyeFn(e) {
				e.isEye = !e.isEye;
				console.log(e, 'isEyeFnisEyeFnisEyeFn')
			},
			// othersClick(e) {
			// 	if (e.functionName) {
			// 		this[e.functionName]()
			// 	} else {
			// 		uni.showToast({
			// 			title: '功能暂未开放',
			// 			icon: 'none'
			// 		})
			// 	}
			// },
			init() {
				this.titleStyle = wx.getMenuButtonBoundingClientRect(); //获取高度
				if (!this.user) {
					this.others.pop();
				}else{
					
				}
			},
			async goM78() {
				let res = await tool.loginOut();
				if (res) {
					uni.clearStorageSync();
					uni.reLaunch({
						url: '/pages/login/index'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import 'index.scss';
	@import '../index/index.scss';
</style>