355 lines
7.5 KiB
Vue
355 lines
7.5 KiB
Vue
|
<template>
|
|||
|
|
<view class="login">
|
|||
|
|
|
|||
|
|
<u-navbar v-if="uniMP" @leftClick="leftClick" bgColor="rgba(0,0,0,0)" leftIconColor=" #fff" :autoBack="false">
|
|||
|
|
</u-navbar>
|
|||
|
|
|
|||
|
|
<!-- #ifdef APP-PLUS||H5 -->
|
|||
|
|
<view style="height: var(--status-bar-height)"></view>
|
|||
|
|
<!-- #endif -->
|
|||
|
|
<view class="body">
|
|||
|
|
<view class="title">欢迎进入里海供销平台！</view>
|
|||
|
|
<view class="login-card">
|
|||
|
|
<view class="login-card-img">
|
|||
|
|
<image src="@/static/images/logo.png" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="top">
|
|||
|
|
|
|||
|
|
<input @click="getId" class="mobile item" v-model="formData.account" type="tel" placeholder="输入账号"
|
|||
|
|
placeholder-style="font-size:10rpx;" />
|
|||
|
|
<input style="width: 0;height: 0;opacity: 0;margin: 0;padding: 0;" v-model="formData.account"
|
|||
|
|
type="tel" placeholder="输入账号" placeholder-style="font-size:10rpx;padding-left:15rpx;" />
|
|||
|
|
<input @click="getId" class="mobile item" v-model="formData.password" maxlength="26"
|
|||
|
|
placeholder="输入密码" password type="safe-password" placeholder-style="font-size:10rpx;" />
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<button class="submit_btn" @click="login">登录</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
loginAccount,
|
|||
|
|
userInfo
|
|||
|
|
} from "@/api/oaUser.js"
|
|||
|
|
|
|||
|
|
import {
|
|||
|
|
Toast
|
|||
|
|
} from "../../libs/uniApi";
|
|||
|
|
import bj from "@/static/animation/bj2.json"
|
|||
|
|
import encrypt from "@/utils/encrypt.js"
|
|||
|
|
// #ifdef APP-PLUS
|
|||
|
|
var jpushModule = uni.requireNativePlugin("JG-JPush");
|
|||
|
|
|
|||
|
|
// #endif
|
|||
|
|
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
options: {
|
|||
|
|
data: '',
|
|||
|
|
},
|
|||
|
|
uniMP: false,
|
|||
|
|
APP_token: '',
|
|||
|
|
tabList: [{
|
|||
|
|
name: '账号登录'
|
|||
|
|
},
|
|||
|
|
// {name:'手机登录'},
|
|||
|
|
],
|
|||
|
|
current: 0,
|
|||
|
|
formData: {
|
|||
|
|
account: '',
|
|||
|
|
password: '',
|
|||
|
|
|
|||
|
|
// code: '',
|
|||
|
|
// terminal: 6, //6是APP端
|
|||
|
|
// scene: 1,
|
|||
|
|
// register_id: "",
|
|||
|
|
// shop_token: ""
|
|||
|
|
},
|
|||
|
|
tips: '获取验证码',
|
|||
|
|
// refCode: null,
|
|||
|
|
seconds: 60,
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
this.APP_token = uni.getStorageSync('APP_token');
|
|||
|
|
this.options.data = bj;
|
|||
|
|
// this.$refs.lottie.call('play');
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
if (uni.getStorageSync('uniMP')) this.uniMP = true;
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
changeTabs(e) {
|
|||
|
|
this.current = e.index;
|
|||
|
|
this.formData.scene = e.index + 1;
|
|||
|
|
},
|
|||
|
|
leftClick(e) {
|
|||
|
|
uni.sendHostEvent('closeApp', e, (ret) => {
|
|||
|
|
//发送消息成功回调
|
|||
|
|
console.log('关闭应用' + JSON.stringify(ret));
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 获取设备id
|
|||
|
|
// 获取设备id
|
|||
|
|
getId() {
|
|||
|
|
// #ifdef APP-PLUS
|
|||
|
|
if (this.formData.register_id) return
|
|||
|
|
jpushModule.initJPushService()
|
|||
|
|
jpushModule.getRegistrationID(result => {
|
|||
|
|
console.log("设备----", result)
|
|||
|
|
// 绑定极光设备id
|
|||
|
|
this.formData.register_id = result.registerID || 1
|
|||
|
|
console.log("设备----", this.formData)
|
|||
|
|
})
|
|||
|
|
// #endif
|
|||
|
|
|
|||
|
|
// #ifdef H5
|
|||
|
|
this.formData.register_id = 1
|
|||
|
|
// #endif
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
async login() {
|
|||
|
|
|
|||
|
|
if (!this.formData.account) return Toast('账号不能为空');
|
|||
|
|
if (this.formData.scene == 1 && !this.formData.password) return Toast('密码不能为空');
|
|||
|
|
if (this.formData.scene == 2 && !this.formData.code) return Toast('验证码不能为空');
|
|||
|
|
|
|||
|
|
let that = this;
|
|||
|
|
// uni.showLoading({
|
|||
|
|
// title: '正在登录中'
|
|||
|
|
// })
|
|||
|
|
console.log(that.formData)
|
|||
|
|
let res = await loginAccount(that.formData);
|
|||
|
|
console.log(res)
|
|||
|
|
encrypt.encode('ACT', that.formData);
|
|||
|
|
|
|||
|
|
this.$store.commit('SET_USERINFO', {
|
|||
|
|
user: res.data,
|
|||
|
|
token: res.data.token
|
|||
|
|
})
|
|||
|
|
// let {
|
|||
|
|
// data
|
|||
|
|
// } = await userInfo();
|
|||
|
|
|
|||
|
|
// console.log(data, '11111111')
|
|||
|
|
// this.$store.commit('setUserInfo', data);
|
|||
|
|
|
|||
|
|
|
|||
|
|
uni.hideLoading()
|
|||
|
|
if (res.data.token) {
|
|||
|
|
// console.log('111111111')
|
|||
|
|
uni.reLaunch({
|
|||
|
|
url: '/pages/index/index'
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// uni.showLoading({
|
|||
|
|
// mask: true,
|
|||
|
|
// title: '加载中'
|
|||
|
|
// })
|
|||
|
|
// return uni.redirectTo({
|
|||
|
|
// url: '/pages/index/index',
|
|||
|
|
// success: () => {
|
|||
|
|
|
|||
|
|
// uni.hideLoading()
|
|||
|
|
// }
|
|||
|
|
// })
|
|||
|
|
// #ifdef APP-PLUS
|
|||
|
|
// return uni.switchTab({
|
|||
|
|
// url: '/pages/index/index',
|
|||
|
|
// success: () => {
|
|||
|
|
// uni.$emit('initOaTask'); // 更新任务
|
|||
|
|
// uni.hideLoading()
|
|||
|
|
// }
|
|||
|
|
// })
|
|||
|
|
// // #endif
|
|||
|
|
// return uni.reLaunch({
|
|||
|
|
// url: '/pages/index/index',
|
|||
|
|
// success: () => {
|
|||
|
|
// uni.$emit('initOaTask'); // 更新任务
|
|||
|
|
// uni.hideLoading()
|
|||
|
|
// }
|
|||
|
|
// })
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
codeChange(text) {
|
|||
|
|
this.tips = text;
|
|||
|
|
},
|
|||
|
|
getCode() {
|
|||
|
|
if (this.$refs.uCode.canGetCode) {
|
|||
|
|
// 模拟向后端请求验证码
|
|||
|
|
uni.showLoading({
|
|||
|
|
title: '正在获取验证码'
|
|||
|
|
})
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.hideLoading();
|
|||
|
|
// 这里此提示会被this.start()方法中的提示覆盖
|
|||
|
|
uni.$u.toast('验证码已发送');
|
|||
|
|
// 通知验证码组件内部开始倒计时
|
|||
|
|
this.$refs.uCode.start();
|
|||
|
|
}, 2000);
|
|||
|
|
} else {
|
|||
|
|
uni.$u.toast('倒计时结束后再发送');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
end() {
|
|||
|
|
// uni.$u.toast('倒计时结束');
|
|||
|
|
},
|
|||
|
|
start() {
|
|||
|
|
// uni.$u.toast('倒计时开始');
|
|||
|
|
},
|
|||
|
|
//忘记密码
|
|||
|
|
forgetPWD() {
|
|||
|
|
Toast('暂未开放')
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.login {
|
|||
|
|
height: 100vh;
|
|||
|
|
width: 100vw;
|
|||
|
|
position: relative;
|
|||
|
|
overflow: hidden;
|
|||
|
|
background-color: #0022c7;
|
|||
|
|
|
|||
|
|
|
|||
|
|
.body {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 45%;
|
|||
|
|
left: 50%;
|
|||
|
|
transform: translate(-50%, -50%);
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.login-card-img {
|
|||
|
|
width: 90rpx;
|
|||
|
|
height: 90rpx;
|
|||
|
|
background-color: #ffffff;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
font-size: 20rpx;
|
|||
|
|
|
|||
|
|
margin-top: -40rpx;
|
|||
|
|
|
|||
|
|
image {
|
|||
|
|
|
|||
|
|
width: 68rpx;
|
|||
|
|
height: 68rpx;
|
|||
|
|
margin-left: 13rpx;
|
|||
|
|
margin-top: 10px;
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
width: 694rpx;
|
|||
|
|
height: 74rpx;
|
|||
|
|
|
|||
|
|
margin-bottom: 29rpx;
|
|||
|
|
font-weight: 500;
|
|||
|
|
color: #ffffff;
|
|||
|
|
line-height: 68rpx;
|
|||
|
|
-webkit-background-clip: text;
|
|||
|
|
margin-bottom: 54rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep uni-input {
|
|||
|
|
min-height: 0 !important;
|
|||
|
|
padding-left: 15rpx;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.login-card {
|
|||
|
|
width: 374rpx;
|
|||
|
|
height: 223rpx;
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 21rpx 21rpx 21rpx 21rpx;
|
|||
|
|
opacity: 1;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
padding-bottom: 30rpx;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
|
|||
|
|
.top {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-evenly;
|
|||
|
|
flex-direction: column;
|
|||
|
|
|
|||
|
|
.item {
|
|||
|
|
margin-bottom: 15rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: 500;
|
|||
|
|
color: rgba(0, 0, 0, 0.8);
|
|||
|
|
line-height: 35rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mobile,
|
|||
|
|
.code {
|
|||
|
|
|
|||
|
|
width: 268rpx;
|
|||
|
|
height: 29rpx;
|
|||
|
|
background: #f5f5f5;
|
|||
|
|
border-radius: 56rpx 56rpx 56rpx 56rpx;
|
|||
|
|
opacity: 1;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #333;
|
|||
|
|
line-height: 29rpx;
|
|||
|
|
font-size: 12rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.code {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
input {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.get-code {
|
|||
|
|
color: $theme-oa-color;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.submit_btn {
|
|||
|
|
width: 192rpx;
|
|||
|
|
height: 28rpx;
|
|||
|
|
background: #0022C7;
|
|||
|
|
|
|||
|
|
border-radius: 29rpx 29rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 28rpx;
|
|||
|
|
font-size: 13rpx;
|
|||
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|||
|
|
font-weight: 500;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|