<template>
|
<view class="pages-login">
|
<view class="uni-panel-content items-center">
|
|
<view class="login-content">
|
<view class="items-center">
|
<!-- <image class="title-img" src="/images/earth.svg" alt=" 图片" /> -->
|
|
</view>
|
<text class="title">请登录</text>
|
<view class="login-form">
|
<view class="login-form-item line">
|
<text class="label">用户名</text>
|
<input class="input" :focus="formData.accountFocus" comfirm-type="done" type="text"
|
v-model="form.account" placeholder="手机号码" />
|
</view>
|
|
<view class="login-form-item line">
|
<text class="label">密码</text>
|
<input class="input" :focus="formData.passwordFocus" :password="hidePassContent"
|
comfirm-type="done" v-model="form.password" placeholder="登录密码" />
|
<uni-icons :type="hidePassContent?'eye-slash':'eye'" size="28"
|
@click="clickHidePassContent"></uni-icons>
|
</view>
|
<view class="login-form-item">
|
<checkbox-group @change="handleSavePwdChange">
|
<label>
|
<checkbox value="1" :checked="savePsw" />
|
<text>记住密码</text>
|
</label>
|
</checkbox-group>
|
|
|
<!-- <a @click="clickForgotPassword">忘记密码</a> -->
|
</view>
|
<view class="button-group">
|
<a-button :disabled="disabledOk" type="primary" class="button" @click="clickLogin">登录</a-button>
|
<!-- <a-button class="button" type="ghost" @click="clickNewAccount">创建账号</a-button> -->
|
</view>
|
</view>
|
|
</view>
|
</view>
|
<view class="bottom">
|
<view class="version">
|
版本：{{version}}
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import {
|
session,
|
showToast,
|
showModal
|
} from "@/comm/utils.js"
|
import {
|
Button
|
} from 'antd-mobile-vue-next'
|
export default {
|
name: "PagesLogin",
|
components: {
|
'a-button': Button
|
},
|
data() {
|
|
return {
|
form: {
|
account: '',
|
password: ''
|
},
|
formData: {
|
accountFocus: true,
|
passwordFocus: false
|
},
|
hidePassContent: true,
|
savePsw: false,
|
version: "1.0.0",
|
}
|
},
|
computed: {
|
disabledOk() {
|
// let text = this.form.account.trim()
|
// if (!text) {
|
// return true
|
// }
|
// text = this.form.password.trim()
|
// if (!text) {
|
// return true
|
// }
|
return false
|
}
|
},
|
onLoad() {
|
|
uni.getSystemInfo({
|
success(e) {
|
const app = getApp()
|
app.globalData.platform = e.platform
|
app.globalData.deviceModel = e.deviceModel
|
app.globalData.osVersion = parseInt(e.osVersion)
|
console.log(e)
|
},
|
|
})
|
const info = session.getValue("login_info")
|
console.log(info)
|
this.setData({
|
form: {
|
account: info?.id || '',
|
password: info?.password || ''
|
|
},
|
savePsw: info?.savePsw || false
|
})
|
// #ifdef APP-PLUS
|
plus.runtime.getProperty(plus.runtime.appid, (info) => {
|
// console.log(info);
|
this.version = info.version;
|
});
|
//#endif
|
|
},
|
methods: {
|
setData(obj) {
|
let that = this;
|
let keys = [];
|
let val, data;
|
|
Object.keys(obj).forEach(function(key) {
|
keys = key.split(".");
|
val = obj[key];
|
data = that.$data;
|
keys.forEach(function(key2, index) {
|
if (index + 1 == keys.length) {
|
that.$set(data, key2, val);
|
} else {
|
if (!data[key2]) {
|
that.$set(data, key2, {});
|
}
|
}
|
data = data[key2];
|
});
|
});
|
},
|
clickHidePassContent() {
|
this.hidePassContent = !this.hidePassContent
|
},
|
handleSavePwdChange(e) {
|
|
if (e.detail.value[0] == '1') {
|
this.savePsw = true
|
} else {
|
this.savePsw = false
|
}
|
|
},
|
clickLogin() {
|
let account = this.form.account.trim()
|
if (!account) {
|
showToast("请输入手机号")
|
return
|
}
|
let password = this.form.password.trim()
|
if (!password) {
|
showToast("请输入密码")
|
return
|
}
|
if (account != "sa") {
|
showToast("手机号不存在")
|
return
|
}
|
if (password != "0000") {
|
showToast("密码错误")
|
return
|
}
|
if (this.savePsw) {
|
|
session.setValue("login_info", {
|
id: account,
|
password,
|
savePsw: true,
|
})
|
} else {
|
session.setValue("login_info", {
|
id: account,
|
password: ""
|
})
|
}
|
|
uni.reLaunch({
|
url: "/pages/index/index"
|
})
|
// uni.navigateTo({
|
// url: `/pages/index/connect?ip=192.168.1.2&sid=HH&password=HH888888`
|
// })
|
},
|
clickNewAccount() {
|
uni.navigateTo({
|
url: "/pages/login/register"
|
})
|
},
|
clickForgotPassword() {
|
uni.navigateTo({
|
url: "/pages/login/forgot-password"
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.pages-login {
|
display: flex;
|
width: 750rpx;
|
height: 100vh;
|
flex-direction: column;
|
|
.uni-panel-content {
|
display: flex;
|
flex: 1;
|
width: 750rpx;
|
flex-direction: column;
|
}
|
|
.bottom {
|
width: calc(100% - 40rpx);
|
padding: 10rpx 20rpx;
|
|
.version {
|
float: right;
|
color: #888;
|
flex-direction: row;
|
display: flex;
|
}
|
}
|
|
.login-content {
|
width: 750rpx;
|
display: flex;
|
flex-direction: column;
|
}
|
|
.justify-center {
|
justify-content: center;
|
}
|
|
.items-center {
|
align-items: center
|
}
|
|
.title-img {
|
display: block;
|
margin: auto;
|
width: 300rpx;
|
height: 300rpx;
|
}
|
|
.title {
|
font-size: 40rpx;
|
margin: auto;
|
padding: 100rpx;
|
}
|
|
.login-form {
|
display: flex;
|
padding: 20rpx 40rpx;
|
flex-direction: column;
|
}
|
|
.login-form-item {
|
padding: 10rpx;
|
display: flex;
|
margin: 20rpx 10rpx;
|
font-size: 28rpx !important;
|
flex-direction: row;
|
|
|
.label {
|
text-align: right;
|
width: 120rpx;
|
margin-top: 15rpx;
|
}
|
|
.input {
|
flex: 1;
|
margin: 10rpx 20rpx 15rpx 20rpx;
|
}
|
|
}
|
.line{
|
border-bottom: 2rpx solid #ddd;
|
}
|
|
.button-group {
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
flex-direction: column;
|
font-size: 30rpx !important;
|
padding: 100rpx;
|
|
.am-button {
|
border-radius: 30px;
|
}
|
|
.am-button-ghost {
|
border: 1px solid #1677ff !important;
|
|
}
|
}
|
|
.button {
|
margin: auto;
|
margin-top: 20rpx;
|
width: 500rpx;
|
|
}
|
|
|
}
|
</style>
|
