repairForMiniProgram/miniRepairPro/pages/identity/identity.vue

<template>
	<view>
		<!-- 学生选择按钮 -->
		<button class="student" open-type="getUserInfo" @getuserinfo="wxLogin">
			<view class="stu">
				学生
			</view>
			<view class="stu_point">
				学生用户选择此项
			</view>
			<view class="stu_img">
				<image src="../../static/stu_img.svg" mode=""></image>
			</view>
		</button>
		
		<!-- 维修人员选择按钮 -->
		<button class="worker" @click="getlogin()">
			<view class="work">
				维修人员
			</view>
			<view class="work_point">
				维修人员选择此项
			</view>
			<view class="work_img">
				<image src="../../static/work_img.svg" mode=""></image>
			</view>
		</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			getlogin(){
				uni.reLaunch({
					url:'../list-center/list-center',
				})
			}
		}
	}
</script>

<style>
.student{
	position: relative;
	width: 351px;
	height: 149px;
	margin-top: 74px;
	margin-left: 12px;
	border-radius: 16px;
	background-color: rgba(42, 69, 228, 0.89);
}
.student .stu{
	position: absolute;
	top: 17px;
	left: 25px;
	font-size: 28px;
	font-weight: 700;
	color: rgba(255, 255, 255, 1);
}
.student .stu_point{
	position: absolute;
	top: 69px;
	left: 79px;
	font: 16px;
	color: rgba(255, 255, 255, 1);
}
.student image{
	position: absolute;
	right: 20px;
	top: 36px;
	width: 76px;
	height: 76px;
}
.worker{
	position: relative;
	width: 351px;
	height: 149px;
	margin-top: 57px;
	margin-left: 12px;
	border-radius: 16px;
	background-color: rgba(42, 130, 228, 1);
}
.worker .work {
	position: absolute;
	top: 17px;
	left: 25px;
	font-size: 28px;
	font-weight: 700;
	color: rgba(255, 255, 255, 1);
}
.worker .work_point{
	position: absolute;
	top: 69px;
	left: 79px;
	font: 16px;
	color: rgba(255, 255, 255, 1);
}
.worker image{
	position: absolute;
	right: 20px;
	top: 36px;
	width: 76px;
	height: 76px;
}
</style>