Delivery-merchant/pages/Modifypass.vue

<template>
	<view>
		<!-- <titlenav></titlenav> -->
		<view class="register">
			<view class="title">修改密码</view>
			<view class="name">修改密码后立即生效，下次登录请使用新密码</view>
			<view class="content content2">
				<image src="https://ticket-exchange.oss-cn-hangzhou.aliyuncs.com/image/2021-09-23-15-00-32OuHmKLtr.png" mode="widthFix"></image>
				<view class="border"><input class="inputNm" placeholder="请输入旧密码" type="number" v-model="form.usedpassword" /></view>
			</view>
			<view class="content content2">
				<image src="https://ticket-exchange.oss-cn-hangzhou.aliyuncs.com/image/2021-09-23-15-00-32OuHmKLtr.png" mode="widthFix"></image>
				<view class="border"><input class="inputNm" placeholder="请输入新密码" type="number" v-model="form.newpassword" /></view>
			</view>
			<view class="content content2">
				<image src="https://ticket-exchange.oss-cn-hangzhou.aliyuncs.com/image/2021-09-23-15-00-32OuHmKLtr.png" mode="widthFix"></image>
				<view class="border"><input class="inputNm" placeholder="请再次输入新密码" type="number" v-model="form.password" /></view>
			</view>
			<u-button type="primary">确定</u-button>
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex';
import Titlenav from '../components/Titlenav.vue';
export default {
	components: {
		Titlenav
	},
	data() {
		return {
			form: {},
			time: 0,
			forget: false
		}
	},
	onLoad(options) {
		this.forget = options.forget;
	},
	computed: {
		...mapState(['systemInfo'])
	},
	methods: {
		send() {
			console.log(this.form);
			this.sendCode(this.form.phone);
		}
	}
};
</script>

<style lang="scss" scoped>
.register {
	/deep/ .uni-input-placeholder {
		font-size: 14px;
		font-weight: 400;
		color: #c8c9cc;
		line-height: 24px;
	}
	/deep/ .u-btn {
		height: 48px;
		font-size: 14px;
		margin: 60px 26px 12px;
	}
	margin: 10px 20px 0;
	.title {
		font-size: 24px;
		font-weight: bold;
		color: #000000;
		line-height: 33px;
		margin-bottom: 10px;
	}
	.name {
		font-size: 13px;
		font-weight: 400;
		color: #aaabad;
		line-height: 22px;
		margin-bottom: 50px;
	}
	.phone {
		margin: 0 26px;
		.text1 {
			font-size: 20px;
			font-weight: bold;
			color: #000000;
			line-height: 28px;
		}
		.text2 {
			font-size: 14px;
			font-weight: 400;
			color: #939599;
			line-height: 24px;
		}
	}
	.content {
		display: flex;
		align-items: center;
		margin: 0 26px;
		.border {
			border-bottom: 1px solid #f2f3f5;
			width: 100%;
			margin-left: 10px;
			.inputNm {
				height: 44px;
			}
		}
		&.content2 {
			margin: 20px 26px 6px;
		}
		image {
			width: 24px;
			height: 24px;
		}
	}
}
</style>