<template>
	<view class="login_page ">
		<view class="login_top">
			<view class="login_logo">
				<image src="https://dm-auto.oss-cn-shanghai.aliyuncs.com/mes_wechat/meslogo.png" class="logopng"></image>
				<image src="https://dm-auto.oss-cn-shanghai.aliyuncs.com/mes_wechat/demu.png" class="demupng"></image>
			</view>
			<view class="">
				自动化MES管理系统
			</view>
		</view>
		<view class="login_centre">
			<view class="login_switch text_color_black font14">
				<view class="login_name font_bold" >
					账号登录
				</view>
				<view class="login_name">
					手机号登录
				</view>
			</view>
			<view class="font12 text_color_black" v-if="type==1">
				<view class="login_input">
					<input placeholder="请输入账号" />
				</view>
				<view class="login_input">
					<input password type="text" placeholder="请输入密码" />
				</view>
			</view>
			<view class="font12" v-if="type==2">
				<view class="login_input">
					<input placeholder="请输入手机号"/>
				</view>
				<view class="">
					<input placeholder="请输入手机号"/>
					<view  class="getCaptcha">{{codename}}</view>
				</view>
			</view>
			<view class="" style="color: #C4C4C4;font-size: 11px;    padding-top: 14px;">
				记住密码
			</view>
			<view class="loginbut">
				登录
			</view>
			<view class="" style="color: #009688;text-align: center;font-size: 13px;">
				手机号一键登录
			</view>
		</view>
		<view class="login_below">
			<view class="">
				
			</view>
			<view class="">
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				codename:'获取验证码',
				type:1,
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	.login_page{
		padding: 0 32px;
		background: url('https://dm-auto.oss-cn-shanghai.aliyuncs.com/mes_wechat/background.png') no-repeat;
		background-position: center center;
		background-size: cover;
		height: 100vh;
	}

	.login_top{padding-top: 160px;padding-bottom: 32px;}
	.login_logo{display: flex;align-items: center;margin-bottom: 17px;}
	.logopng{width: 53px;height: 44px;}
	.demupng{width: 60px;height: 36px;}
	.login_centre{border-radius: 16px;background: #FFF;padding: 20px 24px 40px;}
	.login_switch{display: flex;}
	.login_name{flex: 1;text-align: center;}
	.login_input{border-radius: 21.5px;background: #F3F5F9;    margin-top: 12px;    padding: 5px 15px;}
	.loginbut{    
	background: #009688;
    text-align: center;
    margin-top: 60px;
	margin-bottom: 18px;
    padding: 9px;
    border-radius: 66rpx;}
</style>
