<template>
	<view class="">
		<view class="navbar">
			<view class="back">
				<text class="iconfont icon-fanhui " @click="backLast()"></text>
			</view>
			<text>修改密码</text>
		</view>
		<view class="reset">
			<view class="list">
				<view class="text">
					请输入新密码：
				</view>
				<input type="text" v-model="password" value="" placeholder="请输入新密码" :password="oldIsshow" />
				<view class="eyes" @click="showEyes(1)">
					<text v-if="oldIsshow==true" class="iconfont icon-yanjing-bi" style="font-size: 40upx;"></text>
					<text v-else class="iconfont icon-yanjing" style="font-size: 40upx; font-weight: bold;"></text>
				</view>
			</view>
			<view class="list">
				<view class="text">
					确认新密码：
				</view>
				<input type="text" value="" v-model="surePassword" placeholder="确认密码" :password="newIshow" />
				<view class="eyes" @click="showEyes(2)">
					<text v-if="newIshow==true" class="iconfont icon-yanjing-bi" style="font-size: 40upx;"></text>
					<text v-else class="iconfont icon-yanjing" style="font-size: 40upx; font-weight: bold;"></text>
				</view>
			</view>

		</view>
		<view class="submit" @click="submit()">
			确认修改
		</view>
	</view>
</template>
<script>
	var app = getApp()
	import navBar from '../../components/navBar/navbar.vue';
	export default {
		components: {
			navBar
		},
		data() {
			return {
				password: "",
				surePassword: '',
				oldIsshow: true,
				newIshow: true
			}
		},
		methods: {
			backLast: function() {
				console.log(this.url)
				uni.reLaunch({
					url: './index'
				})
			},
			showEyes: function(e) {
				if (e == 1) {
					this.oldIsshow = !this.oldIsshow
				} else {
					this.newIshow = !this.newIshow
				}
			},
			submit: function() {
				if (this.password !== this.surePassword) {
					uni.showToast({
						title: '您两次输入的密码不相同，请重新输入',
						icon: 'none'
					})

				} else {
					const data = {
						id: uni.getStorageSync('userId'),
						password: this.password
					};
					app.request('/user-remake-password', data, 'post').then(res => {
						console.log(res)
						if (res.statusCode !== 200) {
							uni.showToast({
								title: res.data.message,
								icon: 'none'
							})
						} else {


							uni.showToast({
								title: '修改成功，请重新登录',
								icon: 'none'
							})
							setTimeout(function() {
								app.request('/authorization', '', 'delete').then(res => {
									uni.reLaunch({
										url: '../login/index'
									})
								})
							}, 500)
						}
					})
				}
			}
		}
	}
</script>
<style lang="scss">
	page {
		background-color: #f4f4f4;
	}

	.navbar {
		font-size: 32upx;
		height: 100upx;
		line-height: 100upx;
		color: #888888;
		position: relative;
		position: fixed;
		top: 0;
		z-index: 9999999;
		width: 100%;
		background-color: #FFFFFF;
		text-align: center;
		border-bottom: solid 2upx #EFF1F6;

		.back {
			height: 100upx;
			width: 100upx;
			text-align: center;
			// background-color: #007AFF;
			position: absolute;
			float: left;
			left: 0upx;
			font-size: 32upx;
		}
	}

	.reset {
		margin-top: 130upx;
		background-color: #FFFFFF;
		padding: 50upx;

		.list {
			border-bottom: solid 2upx #f0f0f0;
			padding: 10upx 0;
			position: relative;

			.text {
				height: 70upx;
				line-height: 70upx;
				color: #afafaf;
				font-size: 28upx;
			}

			input {
				height: 50upx;
				line-height: 50upx;
				font-size: 28upx;
				padding-left: 55upx;
				color: #232323;
				background-image: url(../../static/images/password.png);
				background-size: 30upx;
				background-position: 10upx;
				background-repeat: no-repeat;
			}

			.eyes {
				position: absolute;
				height: 90upx;
				width: 90upx;
				z-index: 30000;
				bottom: 0upx;
				right: 0;
				line-height: 90upx;
				text-align: center;
				color: #e69d90;
				font-size: 40upx;
			}
		}
	}

	.submit {
		width: 70%;
		font-size: 30upx;
		color: #FFFFFF;
		height: 70upx;
		line-height: 70upx;
		background-color: #e61916;
		margin: 0 auto;
		margin-top: 100upx;
		text-align: center;
		border-radius: 10upx;
	}
</style>
