124 lines
3.6 KiB
Vue
124 lines
3.6 KiB
Vue
<template>
|
|
<tpx-page>
|
|
<view class="lgn-page">
|
|
<view class="pos-abt-all" style="z-index: 0;overflow: hidden;">
|
|
<tpx-image width="750" mode="widthFix" :src="getCdnUrl('login/bg.png')"></tpx-image>
|
|
<view class="yunduo">
|
|
<tpx-image width="750" mode="widthFix" :src="getCdnUrl('login/bg-yun.png')"></tpx-image>
|
|
</view>
|
|
</view>
|
|
<view class="pos-rlt" style="z-index: 1;">
|
|
<view>
|
|
<u-image custom-style="margin: 160rpx auto 0 auto;" width="140" height="140" :src="getCdnUrl('logo.png')"></u-image>
|
|
<u-text margin="70rpx 0 0 0" size="60" text="探路物流 速运全球" color="#fff" bold="true" align="center"></u-text>
|
|
</view>
|
|
<view style="margin-top: 90rpx;" class="pl-30 pr-30">
|
|
<u-text text="密码登录" size="30" color="#fff" bold="true"></u-text>
|
|
|
|
<view class="mt-40">
|
|
<u-input placeholder="请输入账号" color="#fff" font-size="30"
|
|
v-model="submitParams.username"
|
|
custom-style="padding: 30rpx 60rpx;background: rgba(255,255,255,0.2); border: 2px solid #FFFFFF;border-radius: 16rpx;"
|
|
placeholder-style="color: #FFF;"></u-input>
|
|
</view>
|
|
<view class="mt-40">
|
|
<u-input placeholder="请输入密码" color="#fff" font-size="30" type="password"
|
|
v-model="submitParams.password"
|
|
custom-style="padding: 30rpx 60rpx;background: rgba(255,255,255,0.2); border: 2px solid #FFFFFF;border-radius: 16rpx;"
|
|
placeholder-style="color: #FFF;"></u-input>
|
|
</view>
|
|
<view class="mt-30">
|
|
<u-checkbox-group placement="column" v-model="submitParams.remberPassport">
|
|
<u-checkbox size="28" labelSize="28" label="记住密码"
|
|
:name="true"
|
|
label-color="#fff" activeColor="#fff" iconColor="#B12D29" iconSize="20"></u-checkbox>
|
|
</u-checkbox-group>
|
|
</view>
|
|
|
|
<view style="margin-top: 70rpx;">
|
|
<u-button @click="handleLogin" custom-style="height:90rpx;font-size:32rpx;color: #B12D29;font-weight: bold;;box-shadow: 0rpx 12rpx 21rpx 0rpx rgba(177,45,41,0.32);border-radius: 16rpx;">登录</u-button>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</tpx-page>
|
|
</template>
|
|
<script>
|
|
import { USERKEY } from "@/store/actionKey"
|
|
import { getSessionLoginInfo, setSessionLoginInfo } from "@/session"
|
|
import { encrypt } from "@/common/libs/jsencrypt_utils"
|
|
|
|
|
|
export default {
|
|
props: {
|
|
},
|
|
data() {
|
|
return {
|
|
submitParams: {
|
|
isEncrypt: true,
|
|
username: '',
|
|
password: '',
|
|
// macCode: '', // 设备唯一ID TODO
|
|
remberPassport: []
|
|
},
|
|
}
|
|
},
|
|
onShareAppMessage() {
|
|
return {
|
|
title: '',
|
|
}
|
|
},
|
|
onLoad() {
|
|
let info = getSessionLoginInfo()
|
|
let { remberPassport } = info
|
|
if(remberPassport[0]) {
|
|
Object.assign(this.submitParams, info)
|
|
}
|
|
},
|
|
methods: {
|
|
async handleLogin() {
|
|
const { submitParams } = this
|
|
this.showLoading()
|
|
try{
|
|
await this.$store.dispatch(USERKEY.LOGIN, {
|
|
...submitParams,
|
|
...(submitParams.isEncrypt ? {
|
|
password: encrypt(submitParams.password),
|
|
username: encrypt(submitParams.username),
|
|
} : {})
|
|
})
|
|
await this.$store.dispatch(USERKEY.GETUSERINFO)
|
|
setSessionLoginInfo(submitParams)
|
|
this.goto("tabBar/home/home")
|
|
}catch(e){
|
|
console.error("USERKEY.LOGIN===catch error:", e)
|
|
}
|
|
this.hideLoading()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import '@/common/uni-nvue.scss';
|
|
page{
|
|
height: 100% !important;
|
|
}
|
|
</style>
|
|
<style scoped lang="scss">
|
|
.lgn-page {
|
|
background-color: #B12D29;
|
|
position: relative;
|
|
min-height: 100%;
|
|
background-size: 100% auto;
|
|
background-repeat: no-repeat;
|
|
}
|
|
.yunduo{
|
|
position: absolute;
|
|
bottom: 0rpx;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
</style>
|