‘首次‘
This commit is contained in:
fz
@@ -0,0 +1,226 @@
|
||||
<template>
|
||||
<view class="login">
|
||||
<view class="login-title">法务仲裁系统</view>
|
||||
<view class="login-content">
|
||||
<view class="login-username">
|
||||
<i class="el-icon-user"></i>
|
||||
<input type="text" placeholder="请输入账号" v-model="phone">
|
||||
</view>
|
||||
<view class="login-password">
|
||||
<i class="el-icon-key"></i>
|
||||
<input type="safe-password" name="" id="" placeholder="请输入密码" v-model="password">
|
||||
</view>
|
||||
</view>
|
||||
<view class="button"><button @click="onsubmit">登录</button></view>
|
||||
<view class="login-botton">
|
||||
<view class="login-password" @click="findPassword">找回密码</view>
|
||||
<span>|</span>
|
||||
<view class="login-zhuce" @click="Registration">注册账号</view>
|
||||
</view>
|
||||
<!-- 其他的登录方式 -->
|
||||
<!-- <view class="login-other">
|
||||
<view class="login-top">
|
||||
其他的登录方式
|
||||
</view>
|
||||
<view class="login-icon">
|
||||
<image src="../../static/index/QQ.png" mode="widthFix"></image>
|
||||
<image src="../../static/index/weixin.png" mode="widthFix"></image>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapMutations
|
||||
} from 'vuex';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
phone: '',
|
||||
password: '',
|
||||
rules: {
|
||||
phone: [{
|
||||
required: true,
|
||||
message: '请输入手机号',
|
||||
rule: '/^1[23456789]\d{9}$/'
|
||||
}],
|
||||
password: [{
|
||||
required: true,
|
||||
message: '请输入密码',
|
||||
trigger: 'blur'
|
||||
}]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// ...mapMutations(['user_Login']),
|
||||
//登录
|
||||
onsubmit() {
|
||||
if (this.phone == '' || this.password == '') {
|
||||
uni.showToast({
|
||||
title: "内容不能为空哦！",
|
||||
icon: "none"
|
||||
})
|
||||
} else {
|
||||
let data = {
|
||||
phone: this.phone,
|
||||
password: this.password
|
||||
}
|
||||
if(this.phone == 'admin' && this.password == 'abc123456'){
|
||||
uni.switchTab({
|
||||
url: '/pages/home/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
Registration() {
|
||||
console.log('hah ');
|
||||
uni.navigateTo({
|
||||
url: '../../pages/login/registration'
|
||||
});
|
||||
},
|
||||
// 找回密码
|
||||
findPassword() {
|
||||
// console.log('hah ');
|
||||
// this.$router.push('/pages/login/findPassword');
|
||||
},
|
||||
// 其他方式登录
|
||||
loginOther() {
|
||||
// uni.share({
|
||||
// provider: "weixin",
|
||||
// scene: "WXSceneSession",
|
||||
// type: 1,
|
||||
// summary: "我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！",
|
||||
// success: function(res) {
|
||||
// console.log("success:" + JSON.stringify(res));
|
||||
// },
|
||||
// fail: function(err) {
|
||||
// console.log("fail:" + JSON.stringify(err));
|
||||
// }
|
||||
// });
|
||||
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.login {
|
||||
// background-color: #fff;
|
||||
// background-image: url('../../static/zhongcai.png');
|
||||
width: 100%;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
// background-color: #464646;
|
||||
margin: 0px;
|
||||
background-size: 100% 100%;
|
||||
background-attachment: fixed;
|
||||
height: calc(100vh - 150rpx);
|
||||
.login-title {
|
||||
padding-top: 150rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
margin-left: 50rpx;
|
||||
font-weight: 700;
|
||||
font-size: 40rpx;
|
||||
color: #d11c1c;
|
||||
letter-spacing: 5rpx;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.login-content {
|
||||
.login-username {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 50rpx;
|
||||
border-bottom: 1rpx solid gainsboro;
|
||||
|
||||
input {
|
||||
padding: 10rpx;
|
||||
height: 60rpx;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
i {
|
||||
color: #d11c1c;
|
||||
padding-right: 20rpx;
|
||||
font-size: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.login-password {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 50rpx;
|
||||
border-bottom: 1rpx solid gainsboro;
|
||||
margin-top: 50rpx;
|
||||
|
||||
input {
|
||||
padding: 10rpx;
|
||||
height: 60rpx;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
i {
|
||||
color: #d11c1c;
|
||||
padding-right: 20rpx;
|
||||
font-size: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-top: 120rpx;
|
||||
|
||||
button {
|
||||
background-color: #d11c1c;
|
||||
width: 90%;
|
||||
height: 85rpx;
|
||||
text-align: center;
|
||||
line-height: 85rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.login-botton {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 100rpx;
|
||||
|
||||
.login-password {
|
||||
padding: 0 15rpx;
|
||||
color: #d11c1c;
|
||||
}
|
||||
|
||||
.login-zhuce {
|
||||
padding: 0 15rpx;
|
||||
color: #d11c1c;
|
||||
}
|
||||
}
|
||||
|
||||
.login-other {
|
||||
position: absolute;
|
||||
bottom: 100rpx;
|
||||
left: 37%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.login-top {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-icon {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 50rpx;
|
||||
|
||||
image {
|
||||
width: 80rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user