shenzeeUniApp/pages/Login/loginWeixin.vue

<template>
	<view class="content">
		<image class="logo" :src="avatarUrl"></image>
		<view class="title">
			{{nickName}}
		</view>
		<form @submit="loginwxSubmit">
			<view class="section">
				<input class="input-account" name="username" placeholder="请输入用户名" />
			</view>
			<view class="section">
				<input class="input-pwd" password name="password" placeholder="请输入密码" />
			</view>
			<view class="btn-area">
				<button type="primary" formType="submit" :loading="isLoading">绑定微信</button>
			</view>
		</form>
	</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import MD5 from '@/assets/scripts/md5';
	export default {
		data() {
			return {
				nickName: '',
				openId: '',
				avatarUrl: '',
				pname: '',
				password: '',
				parm: {
					username: "",
					password: "",
					avatarUrl: "",
					nickName: "",
					openId: ""
				}
			};
		},
		onShow() {

			var weixinInfo = uni.getStorageSync("weixinInfo");
			this.nickName = weixinInfo.nickName;
			this.openId = weixinInfo.openId;
			this.avatarUrl = weixinInfo.avatarUrl;
		},
		computed: {
			...mapState(['isLoading']),
		},
		methods: {
			loginwxSubmit(event) {
				uni.hideKeyboard();
				// const { value: loginForm } = event.detail;
				var username = event.detail.value.username;
				var pass = event.detail.value.password;
				var password = MD5(pass);
				var serverUrl = this.serverurl;
				this.parm['username'] = username;
				this.parm['password'] = password;
				this.parm['avatarUrl'] = this.avatarUrl;
				this.parm['nickName'] = this.nickName;
				this.parm['openId'] = this.openId;
				// debugger;
				this.$store.dispatch('loginWXCZ', this.parm)
					.then(data => {
						var result = data.message;
						var weixinInfo = data.data;
						var code = data.code;
						uni.setStorageSync("globalUser", weixinInfo);
						if (code == true) {
							uni.reLaunch({
								url: '/pages/Charts/mainStatistics',
							});
						}
					}, _ => void uni.stopPullDownRefresh());
			},
		},
	}
</script>

<style lang="scss">
	page {
		padding: 200upx 0 0 0;
		background-image: url('~@/static/backgrounds/login_bg.png');
		background-repeat: no-repeat;
		background-size: 100% 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;

		.content {
			padding: 0 20upx;
			display: flex;
			flex-flow: column nowrap;
			align-items: center;

			.logo {
				width: 150upx;
				height: 150upx;
				text-align: center;
				margin: 50upx;
			}

			form {
				width: calc(100% - 100upx);
				padding: 50upx;

				.section {
					margin: 50upx 0;
				}

				.btn-area {
					margin-top: 100upx;

					button {
						background-color: $uni-color-primary;
					}
				}
			}
		}
	}
</style>