<template>
|
<view class="login">
|
<view class="login_title">欢迎登录</view>
|
<view class="login_info">滨湖森林公园运营中心</view>
|
<view class="login_form">
|
<view class="login_form_item">
|
<image src="@/static/icon/login_ic_name@2x.png" mode="widthFix"></image>
|
<input type="text" v-model="from.account" placeholder="账号" />
|
</view>
|
<view class="login_form_item">
|
<image src="@/static/icon/login_ic_password@2x.png" mode="widthFix"></image>
|
<input type="password" v-model="from.password" placeholder="密码" />
|
</view>
|
</view>
|
<view class="login_btn" @click="login">登录</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
from: {
|
account: '',
|
password: ''
|
}
|
};
|
},
|
methods: {
|
login() {
|
var that = this;
|
if (!this.from.account) return uni.showToast({
|
title: '请输入账号',
|
icon: 'none'
|
})
|
if (!this.from.password) return uni.showToast({
|
title: '请输入密码',
|
icon: 'none'
|
})
|
uni.showLoading({ title: '加载中' });
|
that.$u.api.login({
|
password: that.from.password,
|
username: that.from.account
|
}).then(res => {
|
if (res.code === 200) {
|
uni.hideLoading();
|
that.$store.commit('setUserInfo', res.data)
|
uni.navigateTo({
|
url: '/pages/operationsCenter/operationsCenter'
|
})
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.login {
|
width: 100vw;
|
height: 100vh;
|
padding: 80rpx 60rpx;
|
box-sizing: border-box;
|
background: linear-gradient( 179deg, #E1FBFA 0%, #FBFEFE 17%, #FFFFFF 100%);
|
.login_title {
|
font-weight: 600;
|
font-size: 52rpx;
|
color: #333333;
|
}
|
.login_info {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #999999;
|
margin-top: 16rpx;
|
}
|
.login_form {
|
width: 100%;
|
margin-top: 80rpx;
|
.login_form_item {
|
width: 100%;
|
height: 98rpx;
|
padding: 0 40rpx;
|
box-sizing: border-box;
|
background: #F4F9F8;
|
border-radius: 50rpx;
|
border: 1rpx solid #E4EFED;
|
margin-bottom: 40rpx;
|
display: flex;
|
align-items: center;
|
&:last-child {
|
margin: 0 !important;
|
}
|
image {
|
width: 40rpx;
|
height: 40rpx;
|
margin-right: 24rpx;
|
flex-shrink: 0;
|
}
|
input {
|
flex: 1;
|
height: 100%;
|
font-weight: 400;
|
font-size: 30rpx;
|
color: #222222;
|
}
|
}
|
}
|
.login_btn {
|
width: 100%;
|
height: 96rpx;
|
line-height: 96rpx;
|
text-align: center;
|
font-weight: 600;
|
font-size: 32rpx;
|
color: #FFFFFF;
|
background: #01B6AD;
|
box-shadow: 0rpx 6rpx 16rpx 0rpx rgba(1,182,173,0.24);
|
border-radius: 50rpx;
|
margin-top: 80rpx;
|
}
|
}
|
</style>
|
