39 changed files with 157 additions and 517 deletions
@ -1,410 +0,0 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<!-- <image mode="widthFix" class="loginimg" src="../../static/login.png"></image> --> |
|||
<image mode="widthFix" class="loginimg" src="../../static/icons_ui/login_bg.png"></image> |
|||
<view class="login_title"> |
|||
<text>您好，欢迎使用</text><br> |
|||
WMS仓库管理系统 |
|||
</view> |
|||
<view class="bgf login_wrap"> |
|||
<view class="loginbox"> |
|||
<form > |
|||
<view class="mytab"> |
|||
<!-- <view class="mytabline" :class="tapstyle == 1?'active':''" @click="tapchenge(1)">扫码登录</view> --> |
|||
<view class="mytabline" :class="tapstyle == 2?'active_in':''" @click="tapchenge(2)">密码登录</view> |
|||
</view> |
|||
|
|||
<!-- <view class="mybox" v-if="tapstyle == 1"> |
|||
<view class="conone"> |
|||
<uni-easyinput prefixIcon="scan" class="uni-input" type="password" v-model="smloginmsg" |
|||
name="nickname" placeholder="扫码登录"></uni-easyinput> |
|||
</view> |
|||
</view> --> |
|||
<view class="mybox" v-if="tapstyle == 2"> |
|||
<view class="conone"> |
|||
<view class="title uni-flex"> |
|||
<image class="icon_normal" src="../../static/icons_ui/icon_login_user.svg"></image> |
|||
用户名 |
|||
</view> |
|||
<view> |
|||
<input class="uni-input" placeholder="请输入用户名" v-model="username" /> |
|||
</view> |
|||
</view> |
|||
<view class="conone"> |
|||
<view class="title uni-flex"> |
|||
<image class="icon_normal" src="../../static/icons_ui/icon_login_password.svg"></image> |
|||
密码 |
|||
</view> |
|||
<view class="uni-input-wrapper"> |
|||
<input class="uni-input" placeholder="请输入密码" :password="showPassword" |
|||
v-model="password" /> |
|||
<text class="uni-icon" :class="[!showPassword ? 'uni-eye-active' : '']" |
|||
@click="changePassword"></text> |
|||
</view> |
|||
<!-- <view class="uni-input-wrapper"> |
|||
<input class="uni-input" type="password" name="password" |
|||
:password="showPassword" |
|||
placeholder="请输入密码" v-model="password"></input> |
|||
<text class="uni-icon" :class="[!showPassword ? 'uni-eye-active' : '']" @click="changePassword"></text> |
|||
</view> --> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view class="loginbtnbox"> |
|||
<button @click="handelerlogin()" class="loginbtn">登录</button> |
|||
</view> |
|||
</form> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
getlogin |
|||
} from '@/api/index.js'; |
|||
import jwtDecode from 'jwt-decode' |
|||
// import qs from 'qs' |
|||
import { |
|||
mapState, |
|||
mapMutations |
|||
} from 'vuex' |
|||
// import VUE from 'vue' |
|||
// import Base64 from 'base-64'; |
|||
// import vue from vue |
|||
export default { |
|||
data() { |
|||
return { |
|||
smloginmsg: "", |
|||
username: "", |
|||
password: "", |
|||
tapstyle: 2, |
|||
loading: false, |
|||
showPassword: true |
|||
} |
|||
}, |
|||
computed: mapState(['forcedLogin', 'hasLogin']), |
|||
mounted() { |
|||
uni.clearStorage(); //清除缓存 |
|||
if (process.env.NODE_ENV === 'development') { |
|||
this.username = "admin" |
|||
this.password = "1234qwer!@#$QWER"; |
|||
} |
|||
uni.setNavigationBarColor({ |
|||
frontColor: '#ffffff', |
|||
backgroundColor: "#476DF5 !important" |
|||
}) |
|||
}, |
|||
onLoad() {}, |
|||
methods: { |
|||
...mapMutations(['login']), |
|||
handelerlogin() { |
|||
if (this.username === '') { |
|||
uni.showToast({ |
|||
title: '用户名不能为空', |
|||
icon: 'none', |
|||
mask: true |
|||
}) |
|||
} else if (this.password === '') { |
|||
uni.showToast({ |
|||
title: '密码不能为空', |
|||
icon: 'none', |
|||
mask: true |
|||
}) |
|||
} else { |
|||
// console.log("用户名：", this.username, "密码：", this.password, this.tapstyle, this.smloginmsg) |
|||
let logininfo = { |
|||
grant_type: 'password', |
|||
client_id: 'Auth_App', |
|||
client_secret: '1q2w3E*', |
|||
username: "", |
|||
password: "" |
|||
} |
|||
if (this.tapstyle == 2) //密码登录 |
|||
{ |
|||
logininfo.username = this.username; |
|||
logininfo.password = this.password |
|||
} else if (this.tapstyle == 1) { |
|||
// let arr = Base64.decode(this.smloginmsg).split(':') |
|||
// logininfo.username = arr[0]; |
|||
// logininfo.password = arr[1] |
|||
} |
|||
let params = JSON.stringify(logininfo); |
|||
console.log('params', params); |
|||
// let params = qs.stringify(logininfo) |
|||
this.toLogin(params); |
|||
} |
|||
}, |
|||
toLogin(params) { |
|||
uni.showLoading({ |
|||
title: '登录中...' |
|||
}) |
|||
localStorage.setItem("token_type", 'application/json') |
|||
getlogin(params).then((res) => { |
|||
console.log("res", res) |
|||
this.setStorage(res); |
|||
if (res) { |
|||
this.toMain(res); |
|||
} else { |
|||
uni.showToast({ |
|||
title: '请求失败', |
|||
icon: 'none', |
|||
mask: true |
|||
}) |
|||
} |
|||
uni.hideLoading(); |
|||
}).catch((err) => { |
|||
this.loading = false; |
|||
if (err.message.includes('token返回的res为空')) { |
|||
uni.showToast({ |
|||
title: '无法连接到认证服务器!', |
|||
icon: 'none', |
|||
duration: 2000 |
|||
}); |
|||
} else { |
|||
uni.showToast({ |
|||
title: err.message, |
|||
icon: 'none', |
|||
duration: 2000 |
|||
}); |
|||
} |
|||
|
|||
uni.hideLoading(); |
|||
}) |
|||
// this.loading = false; |
|||
// uni.showToast({ |
|||
// title: eror.message, |
|||
// icon: 'none', |
|||
// duration: 2000 |
|||
// }); |
|||
// if (eror=='token返回的res为空') { |
|||
// uni.showToast({ |
|||
// title: '无法连接到认证服务器!', |
|||
// icon: 'none', |
|||
// duration: 2000 |
|||
// }); |
|||
// } else { |
|||
// uni.showToast({ |
|||
// title: err.message, |
|||
// icon: 'none', |
|||
// duration: 2000 |
|||
// }); |
|||
// } |
|||
// getlogin(params).then(res => { |
|||
// console.log("请求getlogin", res) |
|||
// console.log("res", res) |
|||
// this.setStorage(res); |
|||
// if (res) { |
|||
// this.toMain(res); |
|||
// } else { |
|||
// uni.showToast({ |
|||
// title: '请求失败', |
|||
// icon: 'none', |
|||
// mask: true |
|||
// }) |
|||
// } |
|||
// uni.hideLoading(); |
|||
// }).catch((err) => { |
|||
// this.loading = false; |
|||
// // if (err.message.includes('token返回的res为空')) { |
|||
// // uni.showToast({ |
|||
// // title: '无法连接到认证服务器!', |
|||
// // icon: 'none', |
|||
// // duration: 2000 |
|||
// // }); |
|||
// // } else { |
|||
// // uni.showToast({ |
|||
// // title: err.message, |
|||
// // icon: 'none', |
|||
// // duration: 2000 |
|||
// // }); |
|||
// // } |
|||
|
|||
// uni.hideLoading(); |
|||
// }) |
|||
}, |
|||
|
|||
setStorage(res) { |
|||
sessionStorage.setItem('isLogin', 1); //登录判断 |
|||
sessionStorage.setItem('hasLogin', true); |
|||
localStorage.setItem("token_type", res.token_type + ' ' + res.access_token) |
|||
localStorage.setItem('userName', this.username); |
|||
localStorage.setItem('company', this.$companyCode); |
|||
localStorage.setItem('warehouseCode', this.$warehouseCode); |
|||
var decode = jwtDecode(localStorage.getItem('token_type')) |
|||
localStorage.setItem('userId', decode.sub); |
|||
}, |
|||
clearStorage(res) { |
|||
sessionStorage.setItem('isLogin', 0); //登录判断 |
|||
sessionStorage.setItem('hasLogin', false); |
|||
localStorage.setItem("token_type", "") |
|||
}, |
|||
|
|||
toMain(user) { |
|||
console.log("user", user) |
|||
this.login(user); |
|||
uni.switchTab({ |
|||
url: '/pages/index/index' |
|||
}); |
|||
|
|||
/** |
|||
* 强制登录时使用reLaunch方式跳 |
|||
* 返回首页也是使用reLaunch方式 |
|||
*/ |
|||
// if (this.forcedLogin) //强制登录 |
|||
// { |
|||
// uni.reLaunch({ |
|||
// url: '../index/index' |
|||
// }) |
|||
// } else { |
|||
// uni.navigateBack() |
|||
// } |
|||
}, |
|||
tapchenge(e) { |
|||
this.tapstyle = e |
|||
}, |
|||
onchange(e) { |
|||
const value = e.detail.value |
|||
}, |
|||
onCompanyChange(company) { |
|||
if (company === 'IACHZ') {} else { |
|||
|
|||
} |
|||
}, |
|||
// onBackPress(e) { |
|||
// console.log("监听返回按钮事件", e); |
|||
// // 此处一定要return为true，否则页面不会返回到指定路径 |
|||
// return true; |
|||
// } |
|||
changePassword: function() { |
|||
this.showPassword = !this.showPassword; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
page { |
|||
background-color: #fff; |
|||
} |
|||
|
|||
.content { |
|||
width: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
background-color: #FFFFFF; |
|||
} |
|||
|
|||
.cs { |
|||
margin-bottom: 20upx; |
|||
} |
|||
|
|||
.mytab { |
|||
display: flex; |
|||
} |
|||
|
|||
.mytabline { |
|||
flex: 1; |
|||
text-align: center; |
|||
padding: 20rpx 0; |
|||
color: #666; |
|||
position: relative; |
|||
font-size: 0.875rem; |
|||
} |
|||
|
|||
.active_in { |
|||
color: #101010; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.active_in::after { |
|||
content: ""; |
|||
position: absolute; |
|||
bottom: 0; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
height: 8rpx; |
|||
background-color: #007AFF; |
|||
width: 40rpx; |
|||
border-radius: 8rpx; |
|||
} |
|||
|
|||
.loginbox { |
|||
box-sizing: border-box; |
|||
padding: 30rpx; |
|||
|
|||
} |
|||
|
|||
.loginimg { |
|||
width: 100%; |
|||
} |
|||
|
|||
.logo { |
|||
height: 200rpx; |
|||
width: 200rpx; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
margin-bottom: 50rpx; |
|||
} |
|||
|
|||
.conone { |
|||
margin: 30rpx 0; |
|||
align-items: center; |
|||
} |
|||
|
|||
.conone .uni-input-wrapper { |
|||
position: relative; |
|||
} |
|||
|
|||
.conone .uni-input { |
|||
background-color: #F7F9FF; |
|||
height: 90rpx; |
|||
line-height: 90rpx; |
|||
padding: 0 0 0 20rpx; |
|||
} |
|||
|
|||
.conone .title { |
|||
font-size: .875rem; |
|||
align-items: center; |
|||
margin-bottom: 20rpx; |
|||
letter-spacing: 1rpx; |
|||
} |
|||
|
|||
.conone .title image { |
|||
margin-right: 6rpx; |
|||
} |
|||
|
|||
.uni-easyinput .is-input-border { |
|||
border-color: transparent !important; |
|||
} |
|||
|
|||
.loginbtnbox { |
|||
margin-top: 40rpx; |
|||
} |
|||
|
|||
.loginbtn { |
|||
color: #fff; |
|||
font-size: 0.875rem; |
|||
height: 100rpx; |
|||
line-height: 100rpx; |
|||
background: #5d66de; |
|||
border-radius: 8rpx; |
|||
border: none; |
|||
outline: none; |
|||
} |
|||
|
|||
.conone .uni-icon { |
|||
float: right; |
|||
position: absolute; |
|||
right: 20rpx; |
|||
color: #ccc; |
|||
font-size: 1.25rem; |
|||
} |
|||
|
|||
.conone .uni-eye-active { |
|||
color: #5a7cf3; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue