init
This commit is contained in:
feng0207
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div class="login_input">
|
||||
<div class="title_icon">
|
||||
<slot name="icon"></slot>
|
||||
</div>
|
||||
<div class="input">
|
||||
<input class="input_model" :placeholder="placeholder" :type="type" v-model="value" @blur="$emit('input', $event.target.value)" />
|
||||
</div>
|
||||
<div class="clear" v-if="value" @click="clear">
|
||||
<span class="iconfont"></span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
model: {
|
||||
prop: 'value',
|
||||
event: 'input'
|
||||
},
|
||||
props: {
|
||||
placeholder: {
|
||||
type: String,
|
||||
default:''
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: 'text'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
value: ''
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
clear() {
|
||||
this.value = '';
|
||||
this.$emit('input', '');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.login_input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 22rpx 0;
|
||||
border-bottom: 1px solid #EDEDED;
|
||||
font-size: 14px;
|
||||
.title_icon {
|
||||
margin-right: 12rpx;
|
||||
color: @primaryColor;
|
||||
}
|
||||
.input {
|
||||
flex: 1;
|
||||
&_model {
|
||||
border: none !important;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
}
|
||||
.clear {
|
||||
opacity: .2;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<div class="login_container">
|
||||
<!-- 头部背景图 -->
|
||||
<div class="login_container_bg"><image class="login_container_bg_image" src="~static/image/login/bg.png" mode="widthFix"></image></div>
|
||||
<!-- 头部背景图结束 -->
|
||||
<div class="login_container_content">
|
||||
<div class="login_container_content_title"><span>欢迎登录</span></div>
|
||||
|
||||
<div class="login_container_content_form">
|
||||
<div class="login_container_content_form_input">
|
||||
<login-input v-model="loginData.account" type="text" placeholder="请输入账号"><span slot="icon" class="iconfont"></span></login-input>
|
||||
</div>
|
||||
|
||||
<div class="login_container_content_form_input">
|
||||
<login-input v-model="loginData.password" type="password" placeholder="请输入密码"><span slot="icon" class="iconfont"></span></login-input>
|
||||
</div>
|
||||
|
||||
<div class="login_container_content_form_input privacy_agreement">
|
||||
<div class="privacy_agreement_content">
|
||||
<checkbox-group @change="checkoutPrivaey">
|
||||
<checkbox class="checkbox" :value="isCheckEd" />
|
||||
<span>请阅读并勾选</span>
|
||||
<text @click="showPrivaey">隐私协议</text>
|
||||
</checkbox-group>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="login_container_content_handle"><div class="login_primary_button" @click="handleLogin">登录</div></div>
|
||||
<div v-if='isDomainName' class="login-to-set-domin-name"><navigator hover-class="none" url="/pages/view/dominName/index">修改域名</navigator></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import loginInput from './component/loginInput.vue';
|
||||
import { navigateTo, Modal, Toast } from 'pages/utils/uniApi.js';
|
||||
import http from 'pages/api/index';
|
||||
import api from 'pages/api/api.js';
|
||||
import config from 'pages/config/app.js';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
loginInput
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loginData: {
|
||||
account: '',
|
||||
password: ''
|
||||
},
|
||||
cid: '',
|
||||
isCheckEd: '1', // 是否选中隐私协议
|
||||
isCheckEdArr: [],
|
||||
isDomainName: config.isDomainName
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.$cache.remove('accountData');
|
||||
this.$cache.set('pages_login', 1);
|
||||
this.scoket.clearPing()
|
||||
},
|
||||
onUnload() {
|
||||
this.$cache.remove('pages_login');
|
||||
},
|
||||
methods: {
|
||||
async handleLogin() {
|
||||
if (!this.isCheckEdArr.length) {
|
||||
Toast('请勾选隐私协议');
|
||||
return;
|
||||
}
|
||||
//#ifdef APP-PLUS
|
||||
let info = plus.push.getClientInfo();
|
||||
this.cid = info.clientid;
|
||||
this.$cache.set('cid', this.cid);
|
||||
//#endif
|
||||
let loginRes = await http(api.login, { ...this.loginData, client_id: this.cid, is_app: 1 });
|
||||
this.$cache.set('userData', loginRes);
|
||||
this.$store.commit('setToken', loginRes.token);
|
||||
this.$cache.set('accountData', this.loginData);
|
||||
//连接长连接
|
||||
this.scoket.startConnect();
|
||||
this.$cache.remove('pages_login');
|
||||
navigateTo(4, '/pages/view/messageList/index');
|
||||
},
|
||||
// 勾选隐私协议
|
||||
checkoutPrivaey(e) {
|
||||
this.isCheckEdArr = e.detail.value;
|
||||
},
|
||||
// 跳转隐私协议
|
||||
showPrivaey() {
|
||||
navigateTo(1, '/pages/view/privacyAgreement/index');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.login_container {
|
||||
position: relative;
|
||||
&_bg {
|
||||
&_image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&_content {
|
||||
width: 642rpx;
|
||||
padding: 54rpx 79rpx 120rpx 79rpx;
|
||||
box-shadow: 0px 3px 20px rgba(0, 20, 41, 0.06);
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 349rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: #fff;
|
||||
margin: auto;
|
||||
border-radius: 20rpx;
|
||||
&_title {
|
||||
text-align: center;
|
||||
font-size: 21px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 54rpx;
|
||||
}
|
||||
&_handle {
|
||||
margin-top: 115rpx;
|
||||
|
||||
.login_primary_button {
|
||||
font-size: 15px;
|
||||
width: 100%;
|
||||
height: 82rpx;
|
||||
background: @primaryBgColor;
|
||||
border-radius: 41px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.privacy_agreement {
|
||||
margin-top: 30rpx;
|
||||
&_content {
|
||||
font-size: 28rpx;
|
||||
.checkbox {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
text {
|
||||
color: @primaryColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.login-to-set-domin-name {
|
||||
font-size: 20rpx;
|
||||
padding-top: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user