王明 / DeYangHighTechApp

  <template>

  	<view class="logo-v">

  		<view class="t-login">
  			<!-- 页面装饰图片 -->
  			<image class="img-a" src="@/static/2.png"></image>
  			<image class="img-b" src="@/static/3.png"></image>
  			<!-- 标题 -->
  			<view class="t-b">
  				<image src="../../static/logo.png" mode="widthFix" style="width: 90%;">
  				</image>

  			</view>

  			<u-form :model="formData" :rules="rules" ref="dataForm" :errorType="['toast']" label-position="left"
  				label-width="150" label-align="left">
  
  				<u-form-item prop="account">
  					<view class="t-a">
  						<image src="@/static/sj.png"></image>
  						<input placeholder="请输入帐号" v-model="formData.account" />
  					</view>
  				</u-form-item>
  				<u-form-item prop="password">
  					<view class="t-a">
  						<image src="@/static/yz.png"></image>
  						<input placeholder="请输入密码" type="password" v-model="formData.password" />

  					</view>

  				</u-form-item>
  			</u-form>
  			<u-button @click="login" type="primary" :loading="loading">{{ loading ? "登录中...":"登录"}}
  			</u-button>
  
  			<!-- 	<view class="t-f"><text>————— 第三方账号登录 —————</text></view>
  			<view class="t-e cl">
  				<view class="t-g" @tap="wxLogin()">
  					<image src="@/static/wx.png"></image>

  				</view>

  				<view class="t-g" @tap="zfbLogin()">
  					<image src="@/static/qq.png"></image>
  				</view>
  			</view> -->

  		</view>

  	</view>
  </template>
  
  <script>
  	import {
  		login
  	} from '@/api/common.js'
  	import request from '../../utils/request.js'
  	import md5Libs from "uview-ui/libs/function/md5";
  	import resources from '@/libs/resources'
  
  	export default {
  		data() {
  			return {
  				loading: false,
  				formData: {
  					account: "",
  					password: "",
  				},
  				rules: {
  					account: [{
  						required: true,
  						message: '请输入账号',
  						trigger: 'blur',
  					}],
  					password: [{
  						required: true,
  						message: '请输入密码',
  						trigger: 'blur',
  					}],
  				}
  			}
  		},
  		onReady() {
  			this.$refs.dataForm.setRules(this.rules);
  		},
  		onLoad() {
  			this.formData.password = ''
  		},
  		methods: {
  			// 登录
  			login() {
  				let that = this
  				this.$refs.dataForm.validate(valid => {
  					if (valid) {
  						this.loading = true
  						let query = {
  							account: this.formData.account,
  							password: this.formData.password
  						}
  						// // #ifdef  APP-PLUS
  						// const clientId = plus.push.getClientInfo().clientid;
  						// query.clientId = clientId
  						// // #endif
  						// uni.showToast({
  						// 	title:'denglu',
  						// 	duration:'2000'
  						// })
  						request({

  							url: '/api/oauth/Login1',
  							method: 'post',
  							data: query,
  							header: {

  								"Content-Type": "application/x-www-form-urlencoded"
  							}
  						}).then(res => {

  							// this.API.userLogin(query).then(res => {
  							console.log('登录信息', res)

  							uni.showToast({

  								title: 'denglu',
  								duration: '2000'

  							})

  
  							if (res.code === 200) {

  								let token = res.data.token
  								// let user = res.data.user

  								console.log('token', token)

  								this.$store.commit('user/SET_TOKEN', token)
  								uni.setStorageSync('AuthToken_KEY', token)
  								uni.setStorageSync('token', token)

  
  								that.API.getUserInfo().then(res => {

  									console.log(res)

  									let user = res.data

  									uni.setStorageSync('user', user)
  									if (uni.getStorageSync('user')) {

  										this.loading = false
  										uni.showToast({

  											icon: "success",
  											title: "登陆成功"

  										})
  										uni.switchTab({
  											url: '/pages/home/home'
  										});
  									}

  								})

  
  							} else {

  								uni.showToast({

  									icon: "error",
  									title: res.msg

  								})
  								this.loading = false
  							}
  							// uni.navigateTo({
  							// 	url:'/pages/tbDrugIftForm/index'
  							// })
  						}).catch(() => {
  							this.loading = false
  						})
  					}
  				});
  			},
  		},

  	}
  </script>
  
  <style lang="scss">

  	.logo-v {}

  	.img-a {
  		position: absolute;
  		width: 100%;
  		top: -280rpx;
  		right: -100rpx;
  	}

  	.img-b {
  		position: absolute;
  		width: 50%;
  		bottom: 0;
  		left: -50rpx;
  		margin-bottom: -200rpx;
  	}

  	.t-login {
  		width: 600rpx;
  		margin: 0 auto;
  		font-size: 28rpx;
  		color: #000;
  	}

  	.t-login button {
  		font-size: 28rpx;
  		background: #ff0000;
  		color: #fff;
  		height: 90rpx;
  		line-height: 90rpx;
  		border-radius: 50rpx;
  		box-shadow: 0 5px 7px 0 rgba(86, 119, 252, 0.2);
  	}

  	.t-login input {
  		padding: 0 20rpx 0 120rpx;
  		height: 90rpx;
  		line-height: 90rpx;
  		margin-bottom: 50rpx;
  		background: #f8f7fc;
  		border: 1px solid #e9e9e9;
  		font-size: 28rpx;
  		border-radius: 50rpx;
  	}

  	.t-login .t-a {
  		position: relative;
  		width: 100%
  	}

  	.t-login .t-a image {
  		width: 40rpx;
  		height: 40rpx;
  		position: absolute;
  		left: 40rpx;
  		top: 28rpx;
  		border-right: 2rpx solid #dedede;
  		padding-right: 20rpx;
  	}

  	.t-login .t-b {
  		text-align: left;
  		font-size: 46rpx;
  		color: #000;
  		padding: 300rpx 0 40rpx 0;
  		font-weight: bold;
  	}

  	.t-login .t-c {
  		position: absolute;
  		right: 22rpx;
  		top: 22rpx;
  		background: #ff0000;
  		color: #fff;
  		font-size: 24rpx;
  		border-radius: 50rpx;
  		height: 50rpx;
  		line-height: 50rpx;
  		padding: 0 25rpx;
  	}

  	.t-login .t-d {
  		text-align: center;
  		color: #999;
  		margin: 80rpx 0;
  	}

  	.t-login .t-e {
  		text-align: center;
  		width: 250rpx;
  		margin: 80rpx auto 0;
  	}
  
  	.t-login .t-g {
  		float: left;
  		width: 50%;
  	}
  
  	.t-login .t-e image {
  		width: 50rpx;
  		height: 50rpx;
  	}
  
  	.t-login .t-f {
  		text-align: center;
  		margin: 200rpx 0 0 0;
  		color: #666;
  	}
  
  	.t-login .t-f text {
  		margin-left: 20rpx;
  		color: #aaaaaa;
  		font-size: 27rpx;
  	}
  
  	.t-login .uni-input-placeholder {
  		color: #000;
  	}
  
  	.cl {
  		zoom: 1;
  	}
  
  	.cl:after {
  		clear: both;
  		display: block;
  		visibility: hidden;
  		height: 0;
  		content: '\20';

  	}

  </style>