<template>
	<view class="u-font-28 default-box-padding u-relative bg-fff border-r-12 u-overflow-hide">
		<template v-if="orderInfo.status=='unpaid'">
			<view class="change u-absolute my-bg-main color-fff  left-top" @click="chooseUser">切换</view>
		</template>
		<view class="u-flex	u-row-between u-m-t-20 border-bottom u-p-b-20">
			<view class="u-flex">
				<up-avatar :size="30"></up-avatar>
				<view class="color-666 u-m-l-30">未绑定手机号</view>
			</view>
			<view>
				<my-button :height="60" plain shape="circle">他的订单</my-button>
			</view>
		</view>
		<view class="u-flex u-m-t-20 u-row-between">
			<view class="">
				<view class="font-bold">0.00</view>
				<view class="color-666 u-m-t-10">余额</view>
			</view>
			<view class="">
				<view class="font-bold">0.00</view>
				<view class="color-666 u-m-t-10">积分</view>
			</view>
			<view class="">
				<view class="font-bold">0.00</view>
				<view class="color-666 u-m-t-10">已消费</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import go from '@/commons/utils/go.js'
	const props = defineProps({
		orderInfo: {
			type: Object,
			default: () => {}
		},
		user: {
			type: Object,
			default: () => {}
		}
	})

	function chooseUser() {
		go.to('PAGES_CHOOSE_USER')
	}
</script>

<style lang="scss" scoped>
	.change {
		padding: 4rpx 16rpx;
		border-radius: 0 0 16rpx 0;
		z-index: 2;
	}
</style>