You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
133 lines
2.5 KiB
133 lines
2.5 KiB
<template> |
|
<view class="content"> |
|
<view class="avatorWrapper"> |
|
<view class="avator"> |
|
<image class="img" src="../../static/yh.png" mode="widthFix"></image> |
|
</view> |
|
</view> |
|
<view class="form"> |
|
<view class="inputWrapper"> |
|
<input class="input" type="text" v-model="userinfo.username" placeholder="请输入用户名"/> |
|
</view> |
|
<view class="inputWrapper"> |
|
<input class="input" type="password" v-model="userinfo.password" placeholder="请输入密码"/> |
|
</view> |
|
</view> |
|
<button form-type="submit" @click="submit" class="loginBtn">确认登录</button> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
data() { |
|
return { |
|
userinfo: { |
|
username: null, |
|
password: null |
|
} |
|
} |
|
}, |
|
onLoad() { |
|
|
|
}, |
|
methods: { |
|
submit(){ |
|
if(this.userinfo.username==null || this.userinfo.username=='' ){ |
|
return uni.showToast({ |
|
title: '用户名不能为空!', |
|
icon: 'error' |
|
}) |
|
} |
|
if(this.userinfo.password == null || this.userinfo.password==''){ |
|
return uni.showToast({ |
|
title: '密码不能为空!', |
|
icon: 'error' |
|
}) |
|
} |
|
if(this.userinfo.username == 'admin' && this.userinfo.password=='admin123'){ |
|
// let user = null; |
|
let user = { |
|
nickName: '管理员', |
|
phonenumber: '15706698585' |
|
}; |
|
// 发送登录请求 |
|
uni.setStorageSync("userinfo", user) |
|
uni.switchTab({ |
|
url: '../index/me', |
|
}) |
|
}else{ |
|
uni.showToast({ |
|
title: '用户名或者密码不正确!', |
|
icon: 'error' |
|
}) |
|
} |
|
|
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style> |
|
.content { |
|
background: radial-gradient(#3f3abb, #63bfe6); |
|
width: 100vw; |
|
height: 100vh; |
|
} |
|
.avatorWrapper{ |
|
height: 20vh; |
|
width: 100vw; |
|
display: flex; |
|
justify-content: center; |
|
align-items: flex-end; |
|
} |
|
.avator{ |
|
width: 200upx; |
|
height: 200upx; |
|
overflow: hidden; |
|
} |
|
.avator .img{ |
|
width: 100% |
|
} |
|
.form{ |
|
padding: 0 100upx; |
|
margin-top: 80px; |
|
} |
|
.inputWrapper{ |
|
width: 100%; |
|
height: 80upx; |
|
background: #ffffff; |
|
border-radius: 20px; |
|
box-sizing: border-box; |
|
padding: 0 20px; |
|
margin-top: 25px; |
|
border: 1px solid #55aaff; |
|
} |
|
.inputWrapper .input{ |
|
width: 100%; |
|
height: 100%; |
|
text-align: center; |
|
font-size: 15px; |
|
|
|
} |
|
.loginBtn{ |
|
width: 50%; |
|
height: 80upx; |
|
color: #fff; |
|
background: radial-gradient(#3f3abb, #63bfe6); |
|
border-radius: 50upx; |
|
margin-top: 50px; |
|
display: flex; |
|
justify-content: center; |
|
align-items: center; |
|
|
|
} |
|
.loginBtn .btnValue{ |
|
color: white; |
|
} |
|
.forgotBtn{ |
|
text-align: center; |
|
font-size: 15px; |
|
margin-top: 20px; |
|
} |
|
</style> |
|
|
|
|