daijia/司机端/pages/my/index.vue

<template>
	<view>
		<u-sticky h5-nav-height="0">
			<view class="status_bar bg-blue">
			</view>
			<view class="bg-blue white">
				<view class="center pd-20" style="padding-top: 52rpx;">
					<view class="size-36 mr-10">我的</view>
				</view>				
			</view>
		</u-sticky>
		<view class="w100 bg-blue"></view>
		<view class="my-header">
			<image class="" src="../../static/my-bg.png" style="position:absolute;z-index:-1;width:100%;height:260rpx;" mode=""></image>
			<view class="plr-36 ptb-40">
				<view class="flex_l" @click="goLogin">
					<image src="../../static/my-head-icon.png" mode=""></image>
					<view>
						<view class="size-32 ml-40 white">
							{{token?userInfo.truename:'登录/注册'}}
						</view>
					</view>
				</view>
			</view>
			<view class="plr-65 ptb-35 umargin bg-white flex" @click="goWallet">
				<view class="text-center">
					<view class="">
						￥{{token?income||0:0}}
					</view>
					<view class="size-28 gray-2 mt-10">
						累计收入
					</view>
				</view>
				<view class="text-center">
					<view class="">
						￥{{token?money||0:0}}
					</view>
					<view class="size-28 gray-2 mt-10">
						账户余额
					</view>
				</view>
				<view class="text-center">
					<view class="">
						￥{{token?today_money||0:0}}
					</view>
					<view class="size-28 gray-2 mt-10">
						今日收入
					</view>
				</view>
			</view>
		</view>
		<view class="w100" style="height: 20rpx;background: #F8F8F8;"></view>
		<u-cell-item title="实名认证" :class="[userInfo.real_verified==0?'':userInfo.real_verified==1?'active':userInfo.real_verified==2?'active':'']"
		 :value="!token?'请登录':userInfo.real_verified==0?'未认证':userInfo.real_verified==1?'已认证':userInfo.real_verified==2?'待审核':'已拒绝'"
		 :arrow="userInfo.real_verified==0?true:userInfo.real_verified==1?false:userInfo.real_verified==2?false:true" @click="goIDcard">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-1.png" mode=""></image>
			</view>
		</u-cell-item>
		<u-cell-item title="驾照认证" :class="[userInfo.driver_verified==0?'':userInfo.driver_verified==1?'active':userInfo.driver_verified==2?'active':'']"
		 :value="!token?'请登录':userInfo.driver_verified==0?'未认证':userInfo.driver_verified==1?'已认证':userInfo.driver_verified==2?'待审核':'已拒绝'"
		 :arrow="userInfo.driver_verified==0?true:userInfo.driver_verified==1?false:userInfo.driver_verified==2?false:true"
		 @click="goDriver">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-2.png" mode=""></image>
			</view>
		</u-cell-item>
		<u-cell-item v-if="hasSF" title="车主认证" :class="[userInfo.card_verified==0?'':userInfo.card_verified==1?'active':userInfo.card_verified==2?'active':'']"
		 :value="!token?'请登录':userInfo.card_verified==0?'未认证':userInfo.card_verified==1?'已认证':userInfo.card_verified==2?'待审核':'已拒绝'"
		 :arrow="userInfo.card_verified==0?true:userInfo.card_verified==1?false:userInfo.card_verified==2?false:true" @click="goOwner">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-3.png" mode=""></image>
			</view>
		</u-cell-item>
		<view class="w100" style="height: 20rpx;background: #F8F8F8;"></view>
		<u-cell-item v-if="hasSF" title="顺风车发布" class="active" @click="toSflist">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-4.png" mode=""></image>
			</view>
		</u-cell-item>
		<u-cell-item title="我的订单" class="active" @click="goOrder">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-5.png" mode=""></image>
			</view>
		</u-cell-item>
		<view class="flex plr-32 ptb-26" style="height: 103rpx;" @click="goPay">
			<view class="flex" @click.stop="showModel=true">
				<view class="icon mr-20">
					<image src="../../static/my-6.png" mode=""></image>
				</view>
				<view class="mr-20" style="font-weight: 700;">
					平台服务费
				</view>
				<u-icon name="question-circle" color="#969799"></u-icon>
			</view>
			<view class="flex1 flex-middle">
				<view class="" v-if="!token">
					0
				</view>
				<view :class="[fee * 1== 0?'blue':'red','mr-5']" v-else>
					{{fee*1==0?fee:'-'+fee}}
				</view>
				<u-icon name="arrow-right" color="#969799" size="28"></u-icon>
			</view>
		</view>
		<view class="w100" style="height: 20rpx;background: #F8F8F8;"></view>
		<u-cell-item title="设置" @click="goSet">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-7.png" mode=""></image>
			</view>
		</u-cell-item>
		<u-cell-item title="联系我们" @click="goContact">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-8.png" mode=""></image>
			</view>
		</u-cell-item>
		<u-cell-item title="帮助中心" @click="goHelp">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-9.png" mode=""></image>
			</view>
		</u-cell-item>
		<u-cell-item title="关于我们" @click="goAbout">
			<view slot="icon" class="icon flex1 flex-middle mr-20">
				<image src="../../static/my-10.png" mode=""></image>
			</view>
		</u-cell-item>
		<view class="w100" style="height: 20rpx;background: #F8F8F8;"></view>
		<pay :show="show" @money="getmoney" @close="show=false"></pay>
		<u-modal v-model="showModel" content="线下结算产生订单服务费,欠缴的服务费达到平台设置的限额,将无法接单"></u-modal>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				fee: '', //平台服务费
				income: '', //累计收入
				money: '', //可提现金额
				today_money: '', //今日收入
				IDcard: '未认证',
				Driver: '未认证',
				Owner: '',
				show: false, //支付
				showModel: false,
			}
		},
		computed: {
			...mapState(['userInfo', 'token', 'tabList']),

			hasSF() {
				let a = false
				this.tabList.forEach(item => {
					if (item.id == 1) a = true
				})
				return a
			},
			hasDJ() {
				let a = false
				this.tabList.forEach(item => {
					if (item.id == 0) a = true
				})
				return a
			},
		},
		onLoad() {

		},
		onShow() {
			if (this.token) {
				this.$store.dispatch('updateUserInfo')
				this.getmoney()
				this.driver_status = this.userInfo.driver_status == 1 ? true : false
			}
		},
		methods: {
			change(status) {
				console.log(status);
				this.$http('/addons/ddrive/user/driver_status', {
					status: status ? 0 : 1
				}, "POST").then(data => {
					this.$store.dispatch('updateUserInfo')
				})
			},
			toSflist() {
				uni.navigateTo({
					url: "/pages/shunfeng/pub-list"
				})
			},
			goLogin() {
				if (!this.token) {
					uni.navigateTo({
						url: '/pages/login/index'
					})
				}
			},
			goPay() {
				if (parseFloat(this.fee) > 0) {
					this.show = true
				}
			},
			goWallet() { //钱包
				if (this.token) {
					uni.navigateTo({
						url: '/pages/my/wallet'
					})
				} else {
					uni.showToast({
						title: '请登录',
						icon: 'none'
					})
				}
			},
			goIDcard() { //实名认证
				if (this.userInfo.real_verified == 0 || this.userInfo.real_verified == -1) {
					uni.navigateTo({
						url: '/pages/my/IDcard'
					})
				}
			},
			goDriver() { //驾照认证
				if (this.userInfo.driver_verified == 0 || this.userInfo.driver_verified == -1) {
					uni.navigateTo({
						url: '/pages/my/Driver'
					})
				}
			},
			goOwner() { //车主认证
				if (this.userInfo.card_verified == 0 || this.userInfo.card_verified == -1) {
					uni.navigateTo({
						url: '/pages/my/owner/index'
					})
				}
			},
			goOrder() { //订单
				uni.navigateTo({
					url: '/pages/my/my-order'
				})
			},
			goSet() { //设置
				uni.navigateTo({
					url: '/pages/my/set/index'
				})
			},
			goContact() { //联系我们
				uni.navigateTo({
					url: '/pages/my/contact'
				})
			},
			goHelp() { //帮助中心
				uni.navigateTo({
					url: '/pages/my/help/index'
				})
			},
			goAbout() { //关于我们
				uni.navigateTo({
					url: '/pages/my/about'
				})
			},
			// 我的收入
			getmoney() {
				this.$http('/addons/ddrive/user/userIncome', "POST").then(data => {
					//console.log(data);
					this.money = parseFloat(data.money).toFixed(2)
					this.income = parseFloat(data.income).toFixed(2)
					this.today_money = parseFloat(data.today_income).toFixed(2)
					this.fee = data.platform_service_fee
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.my-header {

		image {
			width: 104rpx;
			height: 104rpx;
		}
	}
	
	.umargin {
		margin: 0 20px;
		border-radius: 10rpx;
	}

	.left {
		height: 42rpx;
	}

	.icon {
		image {
			width: 42rpx;
			height: 42rpx;
		}
	}

	.active {
		/deep/.u-cell__value {
			color: $blue;
		}
	}

	.red {
		/deep/.u-cell__value {
			color: $red;
		}
	}
</style>