<template>
|
<view class="login">
|
<view class="logo">无人值守</view>
|
<!--用户名密码登录-->
|
<user-password />
|
<!-- 微信openid登录 -->
|
<view class="loginBtn">
|
<u-button class="button" @click.stop="beforeLoginEvent" :disabled="btnLoading" :loading="btnLoading" type="primary" text="微信一键登录"></u-button>
|
</view>
|
<view class="register" @click="registerClick"><text>注册</text></view>
|
<view class="login-bottom-box">
|
<view class="copyright">冀中能源无人值守微信小程序</view>
|
<view class="copyright">小程序仅供已拥有系统账号特定内部人员使用</view>
|
</view>
|
<!-- 微信授权前的弹框 -->
|
<view class="loginPopup">
|
<u-popup :show="loginPopupShow" mode="bottom" @close="closePopup" @open="openPopup" round="10" :safeAreaInsetBottom="true">
|
<view class="popup-warp">
|
<view class="body"><text>本小程序,仅供已拥有系统账号特定内部人员登录使用,点击同意即表示您已同意相应信息授权。</text></view>
|
<view class="btn">
|
<u-button @click="loginPopupShow = false" type="error" text="不同意" shape="circle" :plain="true"></u-button>
|
<u-button @click="wxLogin" type="error" text="同意" throttleTime="3000" shape="circle"></u-button>
|
</view>
|
</view>
|
</u-popup>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { apiLogin, apiLogin2, apiLoginPassword } from '@/api/publicInterface.js';
|
import { mapMutations } from 'vuex';
|
import userPassword from './userPassword.vue';
|
|
export default {
|
data() {
|
return {
|
wxcode: '', // 司机1
|
btnLoading: false,
|
loginPopupShow: false
|
};
|
},
|
components: {
|
userPassword
|
},
|
methods: {
|
...mapMutations(['setUserTabbar']),
|
// 访问wx.login,获取code
|
beforeLoginEvent() {
|
this.loginPopupShow = true;
|
},
|
wxLogin() {
|
// 获取登录用户code
|
uni.login({
|
success: res => {
|
if (res.code) {
|
this.wxcode = res.code;
|
this.apiLogin();
|
} else {
|
uni.showToast({
|
title: '微信登录失败!',
|
duration: 2000
|
});
|
}
|
}
|
});
|
},
|
// 登录接口
|
apiLogin() {
|
// apiLogin2({ code: this.wxcode })
|
// .then(res => {
|
// console.log('请求登录', res);
|
// if (res.msg == '需绑定') {
|
// uni.navigateTo({
|
// url: `/pages/register/register?code=${res.data}`
|
// });
|
// }
|
// if (res.msg == '登录成功') {
|
// uni.setStorageSync('userInfo', res.data);
|
// this.setUserTabbar(res.data.type);
|
// uni.switchTab({
|
// url: '/pages/tabbar-page/index-tabbar/index-tabbar'
|
// });
|
// }
|
// })
|
// .catch(err => {
|
// console.log('错误', err);
|
// });
|
|
/**
|
* @openid
|
* 获取微信用户openid,微信一键登录暂无相关接口,用于测试呼叫客服功能
|
*/
|
|
wx.request({
|
url: `https://api.weixin.qq.com/sns/jscode2session?appid=wx30f254cbb0b90b3c&secret=938a068410796cda21e5e03b9435cdbf&js_code=${this.wxcode}&grant_type=authorization_code`,
|
success(res) {
|
let id = res.data.openid;
|
uni.setStorageSync('openid', id);
|
uni.showToast({
|
title: '成功获取测试openid',
|
icon: 'none'
|
});
|
}
|
});
|
this.loginPopupShow = false
|
},
|
// 弹出层时间
|
closePopup() {
|
this.loginPopupShow = false;
|
},
|
openPopup() {
|
console.log('打开了');
|
},
|
registerClick() {
|
uni.navigateTo({
|
url: '/pages/register/register'
|
});
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss">
|
@import 'index.scss';
|
.login {
|
// height: 100vh;
|
// display: flex;
|
// align-items: center;
|
|
// .loginBtn {
|
// margin: 0 auto;
|
// width: 80%;
|
|
// .u-button {
|
// .u-icon {
|
// .u-icon__icon {
|
// font-size: vww(20) !important;
|
// }
|
// }
|
// }
|
|
// .u-button--success {
|
// border-style: none;
|
// }
|
// }
|
.loginBtn {
|
margin-top: vww(20);
|
.u-button {
|
width: 80%;
|
}
|
}
|
.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>
|