384 lines
8.8 KiB
Plaintext
384 lines
8.8 KiB
Plaintext
<template>
|
||
<view class="login_wrap">
|
||
<dxx-loading loadingtext="正在登录..." :show="isLoading"></dxx-loading>
|
||
<view class="login_form" v-show="isLogin">
|
||
<view class="login_form_title">
|
||
<text class="login_title_text">TMR饲喂管理</text>
|
||
</view>
|
||
<view class="login_form_content">
|
||
<view class="login_form_item">
|
||
<text class="item_label">手机号: </text>
|
||
<view class="item_input_content">
|
||
<input type="text" keyboard-type="tel" class="input" name="name" v-model="phone" placeholder="请输入手机号"/>
|
||
</view>
|
||
</view>
|
||
<view class="login_form_item">
|
||
<text class="item_label">验证码: </text>
|
||
<view class="item_input_content">
|
||
<input type="text" keyboard-type="number" class="input2" name="psw" v-model="code" placeholder="请输入验证码"/>
|
||
<button type="button" :class="isCodeClick?'disabled_yam':'login_yzm'" :disabled="isCodeClick" @click="handleGetCode">{msgNum}}</button>
|
||
</view>
|
||
</view>
|
||
<button type="button" class="login_btn" @click="handeLogin">立即登录</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import "../components/dxx-loading.stml"
|
||
import {GET,POST} from '../script/req.js'
|
||
import {Util} from '../script/util'
|
||
import { Permission } from '../script/permission.js'
|
||
export default {
|
||
name: 'login',
|
||
apiready(){
|
||
|
||
},
|
||
data() {
|
||
return{
|
||
//验证码文字
|
||
isCodeClick:false,
|
||
msgNum:"获取验证码",
|
||
phone:null,
|
||
code:null,
|
||
resCode:null,
|
||
codeSwitch:true,
|
||
isLoading:false,
|
||
isLogin:true
|
||
}
|
||
},
|
||
methods: {
|
||
apiready(){
|
||
this.ifHasPhone()
|
||
this.ifHasBle()
|
||
this.ifHasBleCle()
|
||
this.ifHasLocation()
|
||
var token= api.getPrefs({sync: true,key: 'token'})
|
||
var sourceCow= api.getPrefs({sync: true,key: 'sourceCow'})
|
||
if(''!=token && ''!=sourceCow){
|
||
api.openWin({
|
||
name: 'index',
|
||
reload:true,
|
||
url:'../html/index.html'
|
||
})
|
||
}
|
||
},
|
||
ifHasLocation() {
|
||
var statusJson = Permission.hasPermission('location');
|
||
// console.log(('location'+JSON.stringify(statusJson)));
|
||
if (statusJson[0].granted == true) {
|
||
} else {
|
||
api.confirm({
|
||
title: '提醒',
|
||
msg: '需要开启定位权限，去设置？',
|
||
buttons: ['确认', '取消']
|
||
}, function (ret, err) {
|
||
if (1 == ret.buttonIndex) {
|
||
Permission.reqPermission('location', function (ret, err) {
|
||
if (ret) {
|
||
if (ret.never == true) {
|
||
return;
|
||
} else {
|
||
if (ret.list[0].granted == true) {
|
||
} else {
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
},
|
||
ifHasPhone(){
|
||
var statusJson = Permission.hasPermission('phone');
|
||
// console.log(('phone'+JSON.stringify(statusJson)));
|
||
if (statusJson[0].granted == true) {
|
||
// Util.appOpen()
|
||
} else {
|
||
api.confirm({
|
||
title: '提醒',
|
||
msg: '需要开设备权限，去设置？',
|
||
buttons: ['确认', '取消']
|
||
}, function (ret, err) {
|
||
if (1 == ret.buttonIndex) {
|
||
Permission.reqPermission('phone', function (ret, err) {
|
||
if (ret) {
|
||
if (ret.never == true) {
|
||
return;
|
||
} else {
|
||
if (ret.list[0].granted == true) {
|
||
// Util.appOpen()
|
||
} else {
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
},
|
||
ifHasBle(){
|
||
var statusJson = Permission.hasPermission('ble-scan');
|
||
// console.log(('ble-scan'+JSON.stringify(statusJson)));
|
||
if (statusJson[0].granted == true) {
|
||
// Util.appOpen()
|
||
} else {
|
||
api.confirm({
|
||
title: '提醒',
|
||
msg: '需要开蓝牙权限，去设置？',
|
||
buttons: ['确认', '取消']
|
||
}, function (ret, err) {
|
||
if (1 == ret.buttonIndex) {
|
||
Permission.reqPermission('ble-scan', function (ret, err) {
|
||
if (ret) {
|
||
if (ret.never == true) {
|
||
return;
|
||
} else {
|
||
if (ret.list[0].granted == true) {
|
||
// Util.appOpen()
|
||
} else {
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
},
|
||
ifHasBleCle(){
|
||
var statusJson = Permission.hasPermission('ble-connect');
|
||
// console.log(('ble-connect'+JSON.stringify(statusJson)));
|
||
if (statusJson[0].granted == true) {
|
||
// Util.appOpen()
|
||
} else {
|
||
api.confirm({
|
||
title: '提醒',
|
||
msg: '需要开蓝牙权限，去设置？',
|
||
buttons: ['确认', '取消']
|
||
}, function (ret, err) {
|
||
if (1 == ret.buttonIndex) {
|
||
Permission.reqPermission('ble-connect', function (ret, err) {
|
||
if (ret) {
|
||
if (ret.never == true) {
|
||
return;
|
||
} else {
|
||
if (ret.list[0].granted == true) {
|
||
// Util.appOpen()
|
||
} else {
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
},
|
||
//获取验证码，60秒倒计时
|
||
handleGetCode(){
|
||
let that = this;
|
||
let _timeNum = 60;
|
||
if(that.data.phone != null && '' != that.data.phone){
|
||
GET('sendSms?phone='+that.data.phone).then(ret => {
|
||
if(ret.code == 200){
|
||
api.toast({
|
||
msg:'短信发送成功，请注意查收',
|
||
location:'middle'
|
||
})
|
||
that.data.resCode = ret.data.verificationCode
|
||
}else{
|
||
api.toast({
|
||
msg:'短信发送成功，请稍后重试',
|
||
location:'middle'
|
||
})
|
||
}
|
||
}).catch(err => {
|
||
api.toast({
|
||
msg: JSON.stringify(err)
|
||
})
|
||
})
|
||
that.data.isCodeClick = true;
|
||
let _timer = setInterval(function () {
|
||
setTimeout(function () {
|
||
if(_timeNum === 0){
|
||
that.data.msgNum = "获取验证码";
|
||
that.data.isCodeClick = false;
|
||
clearInterval(_timer);
|
||
return false;
|
||
}
|
||
_timeNum--;
|
||
that.data.msgNum = _timeNum+'s';
|
||
},0)
|
||
},1000)
|
||
}else{
|
||
api.toast({
|
||
msg:'手机号不能为空',
|
||
location:'middle'
|
||
})
|
||
}
|
||
|
||
},
|
||
//登录
|
||
handeLogin(){
|
||
let _this = this;
|
||
if(!this.data.phone){
|
||
api.toast({
|
||
msg:'手机号不能为空',
|
||
location:'middle'
|
||
})
|
||
}else if(!this.data.code && this.data.codeSwitch){
|
||
api.toast({
|
||
msg:'验证码不能为空',
|
||
location:'middle'
|
||
})
|
||
}else if(this.data.code != this.data.resCode && this.data.codeSwitch){
|
||
api.toast({
|
||
msg:'验证码错误,请重新发送',
|
||
location:'middle'
|
||
})
|
||
}else{
|
||
_this.data.isLoading = true;
|
||
GET('login?phonenumber='+this.data.phone).then(ret => {
|
||
_this.data.isLoading = false;
|
||
api.toast({
|
||
msg:ret.msg,
|
||
location:'middle'
|
||
})
|
||
if(ret.code == 200){
|
||
api.setPrefs({
|
||
key: 'token',
|
||
value: ret.token
|
||
});
|
||
api.setPrefs({
|
||
key: 'loginUser',
|
||
value: ret.loginUser
|
||
});
|
||
api.setPrefs({
|
||
key: 'sourceCow',
|
||
value: ret.loginUser.sourceCow
|
||
});
|
||
api.openWin({
|
||
name: 'index',
|
||
reload:true,
|
||
url:'../html/index.html'
|
||
})
|
||
// if (ret.loginUser.sourceCow !=2 ) {
|
||
// api.openWin({
|
||
// name: 'index',
|
||
// reload:true,
|
||
// url:'../html/index.html'
|
||
// })
|
||
// }else{
|
||
// api.openWin({
|
||
// name: 'index',
|
||
// reload:true,
|
||
// url:'./index.stml'
|
||
// })
|
||
// }
|
||
var token= api.getPrefs({sync: true,key: 'token'})
|
||
var sourceCow= api.getPrefs({sync: true,key: 'sourceCow'})
|
||
}
|
||
}).catch(err => {
|
||
api.toast({
|
||
msg: JSON.stringify(err)
|
||
})
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
<style>
|
||
.login_wrap {
|
||
width:100%;
|
||
height: 100%;
|
||
background-size: 150%;
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
position: relative;
|
||
background-image: url("../image/bg_img.jpg");
|
||
}
|
||
.login_form{
|
||
position: absolute;
|
||
top: 45%;
|
||
right: 10%;
|
||
transform: translateY(-45%);
|
||
box-sizing: border-box;
|
||
background-color: #ffffff;
|
||
padding: 2%;
|
||
border-radius: 10px;
|
||
width: 50%;
|
||
}
|
||
.login_form_title{
|
||
width: 100%;
|
||
text-align: center;
|
||
margin: 10px 0;
|
||
}
|
||
.login_title_text{
|
||
font-size: 20px;
|
||
color: #000000;
|
||
}
|
||
.login_form_content{
|
||
margin-top: 20px;
|
||
width: 100%;
|
||
}
|
||
.login_form_item{
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin: 10px 0;
|
||
width: 100%;
|
||
}
|
||
.item_label{
|
||
font-size: 16px;
|
||
margin-right: 5px;
|
||
width: 20%;
|
||
text-align: right;
|
||
}
|
||
.item_input_content{
|
||
width: 80%;
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
}
|
||
.input{
|
||
width: 100%;
|
||
height: 40px;
|
||
box-sizing: border-box;
|
||
padding: 5px 10px;
|
||
border-radius: 8px;
|
||
}
|
||
.input2{
|
||
height: 40px;
|
||
box-sizing: border-box;
|
||
padding: 5px 10px;
|
||
border-radius: 8px;
|
||
}
|
||
.login_yzm{
|
||
background-color: #407ae6;
|
||
color: #ffffff;
|
||
margin-left: 5px;
|
||
font-size: 14px;
|
||
opacity: 1;
|
||
}
|
||
.login_btn{
|
||
width: 80%;
|
||
height: 48px;
|
||
line-height: 24px;
|
||
margin: 30px auto 20px;
|
||
background-color: #407ae6;
|
||
color: #ffffff;
|
||
font-size: 16px;
|
||
}
|
||
.disabled_yam{
|
||
opacity: 0.7;
|
||
background-color: #407ae6;
|
||
color: #ffffff;
|
||
margin-left: 5px;
|
||
font-size: 14px;
|
||
}
|
||
</style> |