<template>
|
<view class="login">
|
<view class="logo">无人值守</view>
|
<!--用户名密码登录-->
|
<user-password :userList="userList" />
|
<view class="login-bottom-box">
|
<view class="copyright">沧州聚隆化工无人值守微信小程序</view>
|
<view class="copyright">小程序仅供已拥有系统账号特定内部人员使用</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { apiLoginWx, apiLoginPassword } from '@/api/publicInterface.js';
|
import { mapMutations } from 'vuex';
|
import userPassword from './insideUser.vue';
|
import { setToken, setRefreshToken, setUsernameKey, setCustomerId, redirectHome } from '@/utils/status.js';
|
export default {
|
data() {
|
return {
|
btnLoading: false,
|
loginPopupShow: false,
|
// 绑定微信模态框
|
bindWxModelShow: false,
|
bindWxModelTitle: '提示',
|
bindWxContent: '如果已拥有系统账号,可以直接跳转绑定微信页面',
|
appid: "",
|
secret: "",
|
userList:[]
|
};
|
},
|
components: {
|
userPassword
|
},
|
onLoad() {
|
if (uni.getSystemInfoSync().platform === 'android' || uni.getSystemInfoSync().platform === 'ios') {
|
// 设置屏幕横屏显示
|
plus.screen.lockOrientation('landscape');
|
}
|
},
|
onShow() {
|
this.userList=uni.getStorageSync('userList')?JSON.parse(uni.getStorageSync('userList')):[];
|
},
|
onUnload() {
|
// 判断是否是App环境
|
if (uni.getSystemInfoSync().platform === 'android' || uni.getSystemInfoSync().platform === 'ios') {
|
// 解锁屏幕方向
|
plus.screen.unlockOrientation();
|
}
|
// 其余代码...
|
},
|
methods: {
|
...mapMutations(['setUserTabbar', 'changeisLogin']),
|
getAppidAndSercet() {
|
this.$reqGet('getAppidAndSercet').then(res => {
|
this.appid = res.data.appid;
|
this.secret = res.data.secret
|
})
|
},
|
// 访问wx.login,获取code
|
beforeLoginEvent() {
|
this.loginPopupShow = true;
|
this.getAppidAndSercet();
|
},
|
wxLogin() {
|
// 获取登录用户code
|
uni.login({
|
success: res => {
|
if (res.code) {
|
uni.setStorageSync('code', res.code);
|
this.apiLogin(res.code);
|
} else {
|
uni.showToast({
|
title: '微信登录失败!',
|
duration: 2000
|
});
|
}
|
}
|
});
|
},
|
// 登录接口
|
apiLogin(code) {
|
// 获取微信用户openid,微信一键登录暂无相关接口,用于测试呼叫客服功能
|
uni.showLoading({
|
title: '加载中...'
|
});
|
wx.request({
|
url: `https://api.weixin.qq.com/sns/jscode2session?appid=${this.appid}&secret=${this.secret}&js_code=${code}&grant_type=authorization_code`,
|
success(res) {
|
console.log(res, 'openid');
|
uni.setStorageSync('openid', res.data.openid);
|
// uni.showToast({
|
// title: '成功获取测试openid',
|
// icon: 'none'
|
// });
|
}
|
});
|
this.$nextTick(() => {
|
apiLoginWx({ code: code }).then(res => {
|
if (res.code != 1) {
|
this.$u.toast('登录成功');
|
this.changeisLogin(true);
|
// 登陆成功,存储相关信息
|
setToken(res.access_token);
|
setRefreshToken(res.refresh_token);
|
setUsernameKey(res.username);
|
//查询用户详细信息并储存
|
this.$reqGet('getUserEntity').then(res => {
|
this.setUserTabbar(res.data.type);
|
uni.setStorageSync('roleType', res.data.type);
|
uni.setStorageSync("userId", res.data.userId)
|
uni.setStorageSync("carNo", res.data.carNo)
|
setCustomerId(res.data.customerid);
|
uni.hideLoading();
|
//跳转页面
|
this.$nextTick(() => {
|
redirectHome();
|
});
|
});
|
} else {
|
this.$u.toast(res.msg);
|
this.bindWxModelShow = true;
|
}
|
});
|
});
|
this.loginPopupShow = false;
|
},
|
bindWxConfirm() {
|
uni.navigateTo({
|
url: `/pages/login/wxLogin?code=${uni.getStorageSync('code')}`
|
});
|
this.bindWxModelShow = false;
|
},
|
bindWxCancel() {
|
this.bindWxModelShow = false;
|
},
|
// 弹出层时间
|
closePopup() {
|
this.loginPopupShow = false;
|
},
|
openPopup() {
|
console.log('打开了');
|
},
|
forgetPassword() {
|
uni.navigateTo({
|
url: '/pages/login/forgetPassword/forgetPassword'
|
})
|
},
|
PrivacyAgreementHandle() {
|
uni.navigateTo({
|
url: '/pages/login/PrivacyAgreementText/PrivacyAgreementText'
|
})
|
},
|
}
|
};
|
</script>
|
|
<style lang="scss">
|
@import 'index.scss';
|
|
.PrivacyAgreement {
|
color: rgb(60, 156, 255)
|
}
|
|
.login {
|
.loginBtn {
|
margin-top: vww(20);
|
|
.u-button {
|
width: 80%;
|
}
|
}
|
|
.utils-block {
|
width: 80%;
|
margin: vww(20) auto;
|
display: flex;
|
justify-content: space-between;
|
color: #497bff;
|
font-size: vww(17);
|
}
|
|
.logo {
|
width: 80%;
|
font-size: 64rpx;
|
color: #497bff;
|
margin: vww(100) auto 0;
|
text-align: center;
|
}
|
|
.list-call-icon {
|
color: #ff0000;
|
}
|
|
.currentPhone-box {
|
text-align: center;
|
padding: 40rpx 80rpx;
|
|
.number-text {
|
color: #000000;
|
font-size: 60rpx;
|
}
|
|
.other-text {
|
color: #999999;
|
font-size: 26rpx;
|
padding: 20rpx 0;
|
}
|
|
.u-btn {
|
margin: 30rpx auto;
|
}
|
|
.u-hairline-border {
|
border: 1px solid #fff;
|
}
|
}
|
|
.register {
|
color: #497bff;
|
height: 40rpx;
|
line-height: 40rpx;
|
font-size: 28rpx;
|
position: fixed;
|
bottom: vww(70);
|
text-align: center;
|
width: 100%;
|
}
|
|
.register-link {
|
float: right;
|
padding: 0 16rpx;
|
}
|
|
.reg-link {
|
display: inline-block;
|
color: #497bff;
|
}
|
|
.oauth2 {
|
display: flex;
|
flex-direction: row;
|
justify-content: space-around;
|
margin: 0rpx 100rpx 30rpx;
|
|
image {
|
height: 80rpx;
|
width: 80rpx;
|
}
|
}
|
|
.u-tabs {
|
padding: 0 70rpx;
|
}
|
|
// 弹出框
|
.loginPopup {
|
.u-popup {
|
.u-transition {
|
.u-popup__content {
|
.popup-warp {
|
height: vww(200);
|
padding: vww(10) vww(20);
|
|
.body {
|
width: 100%;
|
height: 70%;
|
}
|
|
.btn {
|
display: flex;
|
justify-content: space-between;
|
|
.u-button {
|
width: 40%;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
</style>
|