<template>
	<view class="setting-box">
		<list-item>
			<template v-slot:left>
				<view>头像</view>
			</template>
			<template v-slot:right>
				<view class="box-l-item">
					<u-image src="https://cdn.uviewui.com/uview/example/fade.jpg" shape="circle" width="67rpx" height="67rpx"></u-image>
					<image src="../../static/img/xtsz_icon_yjt/xtsz_icon_yjt.png" style="width: 11rpx; height: 20rpx;margin-left: 20rpx;"></image>
				</view>
			</template>
		</list-item>
		<list-item>
			<template v-slot:left>
				<view>昵称</view>
			</template>
			<template v-slot:right>
				<view class="box-l-item">
					<view class="name">魏珂珂</view>
					<image src="../../static/img/xtsz_icon_yjt/xtsz_icon_yjt.png" style="width: 11rpx; height: 20rpx;margin-left: 20rpx;"></image>
				</view>
			</template>
		</list-item>
		<view class="logout-btn" @click="logoutClick">推出登录</view>
	</view>
</template>

<script>
	import listItem from '../../components/listitem/listItem.vue'
	export default {
		components: {
			listItem
		},
		data () {
			return {
				formData: {}
			}
		},
		methods: {
			// 推出登录
			logoutClick () {
				
			}
		}
	}
</script>

<style scoped lang="scss">
	.setting-box {
		color: #FFFFFF;
		font-size: 28rpx;
		padding: 28rpx;
		font-weight: 400;
		text-align: center;
		& .box-l-item {
			display: flex;
			align-items: center;
		}
		& .name {
			color: #8688A4;
		}
		& .logout-btn {
			margin-top: 50rpx;
			color: #FE192F;
		}
	}
</style>
