<template>
	<view>
		<image style="width: 100%; height: 247rpx;" src="@/static/bg (2).png"></image>
		<view class="custom-navigation-bar">
			<view class="left-button" @click="handleBack">
				<uni-icons type="left" color="#fff" size="30"></uni-icons>
			</view>
			<view class="title">
				{{ title }}
			</view>
		</view>
		<view class="form">
			<uni-row>
				<uni-col :span="12">
					头像:
				</uni-col>
				<uni-col :span='6' :offset="6">
					<uni-file-picker v-model="imageValue" fileMediatype="image" mode="grid" @success="success"
						:image-styles="imageStyles" @fail="fail" />
				</uni-col>
			</uni-row>
			<view style="border-bottom: 1px solid #999999;"></view>
			<uni-row>
				<uni-col :span="8">
					昵称:
				</uni-col>
				<uni-col :span='6'>
					<input class="uni-input" style="margin-top: 20px;"  placeholder="请输入昵称"/>
				</uni-col>
			</uni-row>
		</view>
		<view class="subbtn">
			确认
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: '更新信息',
				imageValue: [],
				imageStyles: {
					width: 64,
					height: 64,
					border: {
						color: "#999999",
						width: 1,
						style: 'dashed',
						radius: '2px'
					}
				},
			}
		},
		methods: {
			// 上传成功
			success(e) {
				console.log('上传成功')
			},

			// 上传失败
			fail(e) {
				console.log('上传失败：', e)
			},
			detail() {
				uni.navigateTo({
					url: "/pages/user/notice/detail/detail"
				})
			},
			handleBack() {
				uni.navigateBack({
					delta: 2
				})
				// console.log(1344444);
				// uni.switchTab({
				// 	url: "/pages/user/index"
				// })
			},
			toPage() {
				console.log(1111232)
				uni.navigateTo({
					url: "/pages/user/index"
				})
			},
		}
	}
</script>

<style lang="scss">
	.subbtn{
		margin-top: 40rpx;
		margin-left: 50rpx;
		text-align: center;
		line-height: 98rpx;
		color: #fff;
		width: 660rpx;
		height: 98rpx;
		background: #CA151F;
		border-radius: 49rpx;
	}
	.form {
		width: 700rpx;
		height: 250rpx;
		background: #FFFFFF;
		line-height: 120rpx;
		padding: 25rpx;
	}

	.custom-navigation-bar {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 220rpx;
		/* #ifdef MP-WEIXIN */
		margin-top: -230rpx;
		/* #endif */
	}

	.left-button,
	.right-button {
		padding: 0 12px;
	}

	.title {
		flex: 1;
		// text-align: center;
		color: #fff;
		font-size: 18px;
		font-weight: bold;
	}
</style>