<template>
	<view class="login-bg">
		<view class="margin bg-fff padding-xl radius shadow-warp bg-white margin-top">
			<!-- 图标 -->
			<view class="text-center">
				<image class="avatar" src="./avatar.png"></image>
			</view>
			<!-- 账号密码 -->
			<view class="login_form">
				<view class="login_form_input">
					<view name="username">
						<uni-easyinput v-model="form.username" prefixIcon="person" placeholder="请输入登录用户名"></uni-easyinput>
					</view>
					<view name="password" style="margin-top: 10upx;">
						<uni-easyinput type="password" v-model="form.password" prefixIcon="locked" placeholder="请输入登录密码"></uni-easyinput>
					</view>
				</view>
			</view>
		</view>
		<!-- 按钮 -->
		<button class="btn" type="primary" @click="onLogin()">登录</button>
		<navigator url="xxxx" style="margin: 10rpx 40rpx; color: deepskyblue;display: none;">前往注册</navigator>
	</view>
</template>
 
<script>
	export default {
		data() {
			return {
				baseUrl: "http://192.168.3.23:8086",
				form: {
					username: 'shenmu',
					password: 'shenmu123'
				},
				userInfo: {},
				proList: []
			}
		},
		methods: {
			onLogin() {
				uni.request({
					url: this.baseUrl + '/auth/login',
					method: "POST",
					header: {
						'Accept':'application/json, text/plain, */*'
					},
					data: this.form,
				}).then(result => {
					let [error, res] = result
					if (res.data && res.data.token) {
						this.userInfo = res.data
						uni.setStorageSync('userInfo', JSON.stringify(res.data))
						uni.showToast({
							title: '登录成功'
						})
						this.getProList()
					}
				})
			},
			goToPage() {
				// 跳转页面
				uni.switchTab({
					url:"/pages/tabBar/monitor/userCenter",
					fail(err) {
						console.log(err)
					}
				})
			},
			getProList() {
				uni.request({
					url: this.baseUrl + '/api/static',
					method: "get",
					header: {
						'Accept':'application/json, text/plain, */*',
						'Authorization':'Bearer '+this.userInfo.token
					}
				}).then(result => {
					let [error, res] = result
					if (res.data && res.data.code==200) {
						let list = res.data.data.proListInfo||[]
						this.proList = list.map(item=>{
							return {
								value: item.proId,
								text: item.proName
							}
						})
						uni.setStorageSync('proList', JSON.stringify(this.proList||[]))
						uni.setStorageSync('currProInfo', JSON.stringify(this.proList[0]||{}))
						this.goToPage()
					}
				})
			}
		}
	}
</script>
 
<style lang="scss">
	page {
		width: 100%!important;
		height: 100%!important;
	}
	.login-bg {
		background-image: url('~@/pages/bg.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		height: 100%;
	}
	.btn {
		width: 200upx;
		height: 100upx;
		// background-color: #89AB9E;
		color: #eee;
	}
	.text-center {
		width: 100%;
		text-align: center;
	}
	.avatar {
		width: 150upx;
		height: 150upx;
		border-radius: 5%;
		margin-top: 250upx;
	}
 
	.login_form {
		// background-color: #89AB9E;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		padding: 30upx 8%;
		margin-top: 50upx;
	}
 
	.login_form_name {
		width: 25%;
		color: #445b53;
	}
 
	.login_form_input {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px #eee solid;
		padding: 30upx 0upx;
		margin: 0upx auto;
	}
</style>