mkw-visit-wx/pages/index/login.vue

<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">
			<uni-forms ref="formdata" :model="form" :border="true" :rules="rules" labelWidth="100px" label-position="top">
				<uni-forms-item label="用户名" name="name">
					<uni-easyinput :inputBorder="false" v-model="form.name" placeholder="请输入用户名" />
				</uni-forms-item>
				<uni-forms-item label="密码" name="password">
					<uni-easyinput :inputBorder="false" type="password" v-model="form.password" placeholder="请输入密码" />
				</uni-forms-item>
			</uni-forms>
				<view class="sbtn">
					<u-button type="primary" size="large" :custom-style="{'background-color': '#182849','border-color': '#182849'}" @click="submit">登录</u-button>
				</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				logo: require("../../static/img/bdlogo.png"),
				winHeight: 0,
				form: {},
				rules: {
					name: {
						rules: [{
							required: true,
							errorMessage: '请输入用户名'
						}]
					},
					password: {
						rules: [{
							required: true,
							errorMessage: '请输入密码'
						}]
					}
				},
				labelStyle:{
					fontSize:'12px',
					color:"#ccc"
				}
			}
		},
		onLoad() {
			this.winHeight = uni.getSystemInfoSync().screenHeight - uni.getSystemInfoSync().statusBarHeight * 2 - 20;
		},
		methods: {
			
			submit(){
				let that = this
				this.$refs['formdata'].validate().then(res => {
					this.util.request({
						api: '/api/admin/auth/login',
						data: {
							username:this.form.name,
							password:this.form.password
						},
						method:'POST',
						utilSuccess: function(res) {
							console.log(res)
							uni.setStorageSync("userInfo_BD_token", {
								token:res.access_token
							})
							that.getBdInfo();
						},
						utilFail: function(res) {
							uni.showToast({
								title: '登陆失败',
								duration: 2000,
								icon:'none'
							})
						}
					})
				}).catch(err => {
					console.log('err', err);
				})
				// uni.navigateTo({
				// 	url:"/pages/bd/mine"
				// })
			},
			getBdInfo() {
				let that = this
				this.util.request({
					api: '/api/admin/auth/me',
					method: "POST",
					requestType: 'bd',
					utilSuccess: function(res) {
						// that.userName = res.name
						// that.userEmail = res.email?res.email:''
						uni.setStorageSync('userInfo_Bd',res)
						uni.showToast({
							title:"登录成功",
							success() {
								uni.redirectTo({
									url:"/pages/bd/mine"
								})
							}
						})
					},
					utilFail: function(res) {
						uni.showToast({
							title: '登陆失败',
							duration: 2000,
							icon: 'none'
						})
					}
				})
			
			},
		}
	}
</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>