wujinriyu/pages/index/register.vue

<template>
	<view class="content">
		<image class="logo " src="../../static/111(1).png" mode=""></image>
		<view class="title">
			Sophia NFT Community
		</view>
		<view class="content-input">
			<view class="item">
				<view class="pic">
					<image src="../../static/person.png" mode=""></image>
				</view>
				<input v-model="form.studentNumber" placeholder="学籍番号/Student ID" />
			</view>
			<view class="item">
				<view class="pic">
					<image src="../../static/lock.png" mode=""></image>
				</view>
				<input type="password" v-model="form.pass" placeholder="パスワード/Password" />
			</view>
			<view class="item">
				<view class="pic">
					<image src="../../static/lock.png" mode=""></image>
				</view>
				<input type="password" v-model="password" placeholder="もう一度パスワード/Password" />
			</view>
		</view>
		<button class="btn-one" type="default" @click="registerme">新しいID</button>
		<button class="btn-two" type="default" @click="login">ログイン</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					pass: "",
					studentNumber: "",
				},
				password: ""
			}
		},
		onLoad() {

		},
		methods: {
			//跳转登录页面
			login() {
				uni.navigateTo({
					url: "./index"
				})
			},
			registerme(){
				if(!this.form.studentNumber){
					uni.showToast({
						title:"学籍番号/Student ID",
						icon:"none"
					})
				}else if(!this.form.pass){
					uni.showToast({
						title:"パスワード/Password",
						icon:"none"
					})
					
				}else if(!this.password){
					uni.showToast({
						title:"もう一度パスワード/Password",
						icon:"none"
					})
					
				}else if(this.password!=this.form.pass){
					uni.showToast({
						title:"パスワードを同じに保つ",
						icon:"none"
					})
					
				}else{
					this.register()
				}
				
			},
			//注册接口
			async register() {
				const res = await this.$myRequest({
					url: '/open/foreignLogin/studentNumber',
					method: "post",
					data: this.form
				})
				if (res.data.code == 200) {
					uni.setStorageSync("token",res.data.data.token)
					uni.setStorageSync("Authorization",res.data.data.createToken)
					uni.setStorageSync("id",res.data.data.id)
					uni.showToast({
						title: res.data.msg
					})
					setTimeout(() => {
						uni.switchTab({
							url: "./homepage"
						})
					}, 10)
				}
			},
		}
	}
</script>

<style lang="scss">
	.content {
		display: flex;
		flex-direction: column;
		background-color: #000000;
		height:94.6vh;
	}

	.logo {
		height: 156rpx;
		width: 156rpx;
		margin-top: 188rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 52rpx;
	}



	.title {
		display: flex;
		justify-content: center;
		font-size: 52rpx;
		font-weight: 600;
		color: #FFFFFF;
	}

	.forget {
		display: flex;
		color: #FFFFFF;
		justify-content: flex-end;
		font-size: 24rpx;
		margin-top: 36rpx;
	}

	.content-input {
		display: flex;
		flex-direction: column;

		.item {
			margin-left: 60rpx;
			margin-top: 72rpx;
			padding-left: 0rpx;
			display: flex;
			border-bottom: 1rpx solid #2D2D2D;

			.pic {
				image {
					width: 48rpx;
					height: 48rpx;
					margin-top: -10rpx;
				}
			}

			input {
				margin-left: 24rpx;
				font-size: 28rpx;
				width: 500rpx;
				color: #FFFFFF;
			}
		}

	}

	.btn-one {
		margin-top: 60rpx;
		background-color: #E84779;
		color: #FFFFFF;
		width: 582rpx;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 25px;
		font-size: 28rpx;
	}

	.btn-two {
		margin-top: 50rpx;
		background-color: #000000;
		border: 1rpx solid #FFFFFF;
		color: #FFFFFF;
		width: 582rpx;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 25px;
		font-size: 28rpx;
	}
</style>