<template>
	<view>
		<view class="login-logo">
			<u-image width="120rpx" height="120rpx" src="../../assets/img/logo.png" border-radius="20"></u-image>
			<h3>小鹏管家</h3>
			<p>合伙收益通</p>
		</view>
		<view class="login-form">
			<u-form :model="form" ref="uForm">
				<view class="login-form-row">
					<u-icon name="user-2-fill" custom-prefix="custom-icon" color="#b0b8c8" size="40"></u-icon>
					<u-line color="#d9e0ec" length="20" direction="col" margin="10px"/>
					<u-form-item label="" prop="name"  :border-bottom="false">
						<u-input v-model="form.name" />
					</u-form-item>
				</view>
				<view class="login-form-row">
					<u-icon name="message-3-fill" custom-prefix="custom-icon" color="#b0b8c8" size="40"></u-icon>
					<u-line color="#d9e0ec" length="20" direction="col" margin="10px"/>
					<u-form-item label="" prop="intro"  :border-bottom="false">
						<u-input v-model="form.intro" />
					</u-form-item>
				</view>
				<view class="login-code">
					<span>获取验证码</span>
				</view>
			</u-form>
			<u-button class="login-btn" @click="submit">提交</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					name: '',
					intro: '',
				},
			}
		},
		methods: {

		}
	}
</script>
<style>
	page{
		background: url(../../assets/img/bgbg.png) no-repeat;
		background-size: 100%;
	}
</style>
<style lang="scss" scoped>
	.login-logo{
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-top: 20%;
		h3{
			margin:15px 0;
		}
	}
	/deep/.u-form-item{
		padding: 0;
		flex: 1;
	}
	.login-form{
		width: 300px;
		margin:50px auto 0;
	}
	.login-form-row{
		height: 40px;
		border: 1px solid #c7d1e2;
		background-color: #fff;
		border-radius: 10px;
		display: flex;
		align-items: center;
		padding: 2px 10px;
		margin-bottom: 15px;
	}
	.login-code{
		text-align: right;
		span{
			color:#005AD9;
		}
	}
	.login-btn{
		background-color: #cdd7e8;
		border-color:#cdd7e8 ;
		color:#fff;
		margin-top: 30px;
	}
</style>
