<template>
	<view>
		<view class="photo"><image :src="user.avatar"></image></view>
		<view class="info">
			<view class="nickname">{{ user.nickname }}</view>
			<view>
				<text>报名时间</text>
				<text>{{ info.sign_time }}</text>
			</view>
			<view>
				<text>手机号</text>
				<text>{{ user.phone }}</text>
			</view>
			<view>
				<text>销售级别</text>
				<text>{{ info.level }}</text>
			</view>
			<view>
				<text>性别</text>
				<text>{{ Number(user.sex) == 1 ? '女' : '男' }}</text>
			</view>
			<view>
				<text>团队老大</text>
				<text>{{ info.crown }}</text>
			</view>
			<view>
				<text>是否签到</text>
				<text>{{ Number(info.status) == 1 ? '已签到' : '未签到' }}</text>
			</view>
			<view v-if="info.op_name">
				<text>签到人</text>
				<text>{{ info.op_name }}</text>
			</view>
			<view v-if="info.time">
				<text>签到时间</text>
				<text>{{ info.time }}</text>
			</view>
		</view>
	</view>
</template>

<script>
import { getUserDetail } from '../../api/sign.js';
export default {
	data() {
		return {
			user: '',
			info: ''
		};
	},
	onLoad(options) {
		this.user = options;
	},
	onShow() {
		this.getInfo();
	},
	methods: {
		getInfo() {
			getUserDetail({ id: this.user.id }).then(res => {
				if (res.code == 200) {
					this.info = res.data;
				} else {
					uni.showModal({
						content: res.message || '获取信息失败',
						showCancel: false
					});
				}
			});
		}
	}
};
</script>

<style lang="scss">
.photo {
	padding-top: 37rpx;
	text-align: center;
	image {
		height: 108rpx;
		width: 108rpx;
		border-radius: 50%;
		margin-bottom: 54rpx;
	}
}
.info {
	background-color: #fff;
	width: 690rpx;
	margin: -54rpx auto 0;

	border-radius: 8rpx;
	.nickname {
		width: 480rpx;
		height: 106rpx;
		line-height: 106rpx;
		text-align: center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 32rpx;
		color: #333;
		margin: 0 auto;
		border-bottom: 1rpx solid #fafafa;
	}
	> view:not(:first-child) {
		font-size: 32rpx;
		height: 105rpx;
		border-bottom: 1rpx solid #fafafa;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 30rpx;
		box-sizing: border-box;
		text:first-child {
			color: #666666;
		}
	}
}
</style>
