<template>
	<view class="containers" :style="{'height':winHeight+'px'}">
		<view :style="{'height':winHeight*.5+'px','position':'relative'}" class="logo">
			<view>
				<u--image :showLoading="true" :src="logo" width="336rpx" height="336rpx"></u--image>
			</view>
		</view>
		<view class="login">
			<u--form labelPosition="top" :labelStyle="labelStyle" :labelWidth="'auto'" :model="form" :rules="rules" ref="form">
				<u-form-item label="用户名" prop="form.name"  ref="item1">
					<u--input v-model="form.name" border="bottom" placeholder="请输入用户名"></u--input>
				</u-form-item>
				<u-form-item label="密码" prop="form.password" ref="item1">
					<u--input type="password" v-model="form.password" border="bottom" placeholder="请输入密码"></u--input>
				</u-form-item>
				<view class="sbtn">
					<u-button type="primary" size="large" @click="submit">登录</u-button>
				</view>
			</u--form>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				logo: require("../../static/img/bdlogo.png"),
				winHeight: 0,
				form: {},
				rules: {},
				labelStyle:{
					fontSize:'12px',
					color:"#ccc"
				}
			}
		},
		onLoad() {
			this.winHeight = uni.getSystemInfoSync().screenHeight - uni.getSystemInfoSync().statusBarHeight * 2 - 20;
		},
		methods: {
			
			submit(){
				uni.navigateTo({
					url:"/pages/bd/mine"
				})
			}
		}
	}
</script>

<style scoped>
	.containers {
		background-color: #fff;
		padding: 0 40rpx;
		padding-bottom: 20px;
	}

	.logo view {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.sbtn{
		margin-top:60rpx
	}
</style>
