liumin
/
NewZkgj
1
0
Fork 0
Koodi Ongelmat 0 Pull-pyynnöt 0 Julkaisut 0 Wiki Toiminta
Selaa lähdekoodia

登录相关

yun
wangxiaohua 2 vuotta sitten
vanhempi
e0ef1fed36
commit
f9a4ae29e7
14 muutettua tiedostoa jossa 1746 lisäystä ja 55 poistoa
Jaettu näkymä
Diff Options
Show Stats Download Patch File Download Diff File
  1. +5
    -0
      manifest.json
  2. +36
    -1
      pages.json
  3. +86
    -20
      pages/index/guide.vue
  4. +144
    -16
      pages/index/personal.vue
  5. +325
    -0
      pages/login/Setthepassword.vue
  6. +330
    -0
      pages/login/Verification.vue
  7. +238
    -0
      pages/login/Verifythelogin.vue
  8. +343
    -18
      pages/login/index.vue
  9. +239
    -0
      pages/login/yinzhongmalogin.vue
  10. BIN
      static/images/Customer.png
  11. BIN
      static/images/arrow.png
  12. BIN
      static/images/exit.png
  13. BIN
      static/images/password.png
  14. BIN
      static/images/setting.png

+ 5
- 0
manifest.json Näytä tiedosto

@@ -115,5 +115,10 @@
},
"mp-toutiao" : {
"usingComponents" : true
},
"h5" : {
"router" : {
"base" : "/pages/login/guide"
}
}
}

+ 36
- 1
pages.json Näytä tiedosto

@@ -37,7 +37,7 @@
"path": "pages/index/personal",
"style": {
"navigationBarTitleText": "个人",
"navigationBarBackgroundColor": "#008EF2",
"navigationBarBackgroundColor": "#2671E2",
"navigationBarTextStyle": "white"
}
}
@@ -54,7 +54,42 @@
"navigationBarBackgroundColor": "#008EF2",
"navigationBarTextStyle": "white"
}
},
{
"path": "Verification",
"style": {
"navigationBarTitleText": "验证码登录",
"navigationBarBackgroundColor": "#008EF2",
"navigationBarTextStyle": "white"
}
},
{
"path": "yinzhongmalogin",
"style": {
"navigationBarTitleText": "验证码登录",
"navigationBarBackgroundColor": "#008EF2",
"navigationBarTextStyle": "white"
}
},
{
"path": "Setthepassword",
"style": {
"navigationBarTitleText": "忘记密码",
"navigationBarBackgroundColor": "#008EF2",
"navigationBarTextStyle": "white"
}
},
{
"path": "Verifythelogin",
"style": {
"navigationBarTitleText": "验证码验证",
"navigationBarBackgroundColor": "#008EF2",
"navigationBarTextStyle": "white"
}
}
]
},
{


+ 86
- 20
pages/index/guide.vue Näytä tiedosto

@@ -1,29 +1,95 @@
<template>
<view>
引导页
<view @click="tologin()" style="width: 200rpx;height: 80rpx;text-align: center;line-height: 80rpx;margin: 0 auto;border: 1px solid red;margin-top: 400rpx;">登录</view>
</view>
<view class="full">
<view class="logo"></view>
<view class="title">
数智工牌
</view>
<image class="middle" src="https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/lead_middle.png" mode="scaleToFill"></image>
<view class="content">
<view class="">
1 智能语音转写
</view>
<view class="">
2 高效的判客机制
</view>
<view class="">
3 全方位的客户跟进
</view>
<view class="">
4 专业的经纪管家
</view>
<view class="">
5 在线实时沟通
</view>
</view>
<view @click="bindWxBLogin" class="button">
立即去登录
</view>
</view>
</template>

<script>
var app = getApp();
var config = require("../../config");
export default {
data() {
return {};
},
components: {},
onLoad() {},
onShow() {},
methods: {
tologin(){
wx.navigateTo({
url: '/pages/login/index'
});
}
},
data() {
return {
};
},
onShow: function () { },
onHide: function(){ },
methods: {
bindWxBLogin() {
wx.navigateTo({
url: '/pages/login/index'
});
}

}
};
</script>
<style lang="scss">
.full{
width: 100vw;
height: 100vh;
position: relative;
background: url("https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/lead_background.png");
background-size: 100% 100%;
display: flex;
flex-direction: column;
align-items: center;

<style lang="scss" scoped>

</style>
.logo{
width: 202upx;
height: 202upx;
margin-top: 40rpx
}
.title{
color: #FFFFFF;
font-size: 36upx;
font-weight:500;
}
.middle{
width: 480upx;
height: 485upx;
margin-top: 34upx;
}
.content{
color: #FFFFFF;
font-size: 28rpx;
line-height: 66rpx;
}
.button{
background: #fff;
border-radius:76px;
width:584upx;
height:100upx;
color: #008EF2;
font-size: 40upx;
line-height: 100upx;
text-align: center;
}
}
</style>

+ 144
- 16
pages/index/personal.vue Näytä tiedosto

@@ -1,24 +1,152 @@
<template>
<view>
个人
</view>
<view class="main">
<view class="backTop"></view>
<!-- 头部开始 -->
<view class="header box">
<u-avatar :src="photo?photo:'https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/my/headPicture.png'"
size="174"></u-avatar>
<view class="userName">{{name}}</view>
<view class="mobile">{{mobile}}</view>
</view>
<view class="settingGroup box">
<view class="line">
<view class="title">
<image src="/static/images/password.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
修改密码
</view>
<view class="right">
<image src="/static/images/arrow.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
</view>
</view>
<navigator class="line" url="/pages/my/set/index">
<view class="title">
<image src="/static/images/setting.png" style="width: 44rpx;height: 42rpx;" mode=""></image>
我的设置
</view>
<view class="right">
<image src="/static/images/arrow.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
</view>
</navigator>
<view class="line" @click="phone">
<view class="title">
<image src="/static/images/Customer.png" style="width: 48rpx;height: 46rpx;" mode=""></image>
客服电话
</view>
<view class="right">
<image src="/static/images/arrow.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
</view>
</view>
<view class="line" @click="logout" style="border: none;">
<view class="title">
<image src="/static/images/exit.png" style="width: 46rpx;height: 46rpx;" mode=""></image>
退出登录
</view>
</view>
</view>
</view>
</template>

<script>
export default {
data() {
return {};
},
components: {},
onLoad() {},
onShow() {},
methods: {
},
};
</script>
var app = getApp();
var util = require("../../utils/util.js");
var config = require("../../config");

export default {
data() {
return {
name: "",
photo: "",
mobile: "",
ishowAS:true,
};
},
onShow: function() {
},
methods: {
//拨打电话
phone() {
wx.makePhoneCall({
phoneNumber: '4008191707,8888' //仅为示例，并非真实的电话号码
})
},
logout() {
}
}
};
</script>
<style lang="scss" scoped>
.main {
padding: 0 30rpx;
background: #F8F8F8;
display: flex;
flex-direction: column;
min-height: 100vh;
padding-bottom: 40rpx;
.backTop {
background: #2671E2;
position: absolute;
left: 0;
top: 0;
width: 750rpx;
height: 352rpx;
}

.box {
background: #ffffff;
}
}

.header {
z-index: 2;
border-radius: 25upx;
margin-top: 120upx;
display: flex;
flex-direction: column;
align-items: center;
padding: 30upx 0;
.userName{
font-size: 36upx;
font-weight: 500;
color: #303030;
margin-top: 20upx;
line-height: 50upx;
}
.mobile{
font-size: 30upx;
line-height: 42upx;
color: #BDBDBD;
margin-top: 6upx;
}
}
.settingGroup{
margin-top: 30upx;
color: #303030;
font-size: 30upx;
display: flex;
flex-direction: column;
.line{
height: 118upx;
border-bottom: 1upx solid #EEEEEE;
margin: 0 38upx 0 30upx;
display: flex;
align-items: center;
justify-content: space-between;
.title{
display: flex;
align-items: center;
width: 190upx;
justify-content: space-between;
}
}
}
</style>

+ 325
- 0
pages/login/Setthepassword.vue Näytä tiedosto

@@ -0,0 +1,325 @@
<template>
<view>
<view class="input">
<view class="zcasfdasf">设置密码</view>
<view class="tejHdgasd">设置密码后,就可以使用手机号码与密码登录了~</view>
<view style="margin-top:60rpx" class="cwjs-cells item-flex">
<view class="cwjs-item center">
<input class="cwjs-item cwjs-input" v-model="username" password="true" placeholder="请设置6~12位的登录密码"
placeholder-style='color:#AAAAAA' maxlength="12" />
</view>
</view>

</view>
<view class="button" @tap="bindWxBLogin">确认</view>
</view>
</template>
<script>
var util = require("../../utils/util.js");
var config = require("../../config");
var app = getApp();
export default {
data() {
return {
username: '', //获取到的密码
phone: ''
}
},
onLoad: function(options) {
this.phone = options.username
},
methods: {
bindWxBLogin() {
if (this.username.length < 6) {
util.showNone("密码小于6位，请重试");
return false;
} else {
uni.reLaunch({
url: '/pages/login/index',
})
}
}
}
};
</script>

<style lang="scss">
.cwjs-logo {
display: block;
width: 219rpx;
height: 158rpx;
margin: 54rpx auto 66rpx;
}

.cwjs-tips {
font-size: 24rpx;
padding: 80rpx 0;
color: #8a8a8a;
}

.cwjs-form {
position: relative;
margin: 0;
background-color: #fff;
border-radius: 10px;
padding: 20rpx 40rpx 113rpx;
}

.zcasfdasf {
height: 48rpx;
font-size: 48rpx;
font-weight: 400;
color: #303030;
line-height: 48rpx;
margin-top: 80rpx;
}

.tejHdgasd {
height: 28rpx;
font-size: 26rpx;
font-weight: 400;
color: #303030;
line-height: 28rpx;
margin-top: 28rpx;

}

.cwjs-cells {
width: 600rpx;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 0 auto;
height: 88rpx;
overflow: hidden;
border-bottom: 1rpx solid #BFC7D3;
position: relative;
}

.center {
flex: 1;
display: flex;
}

.texteasda {
height: 88rpx;
line-height: 88rpx;
font-size: 28rpx;
color: #000;
}

.cwjs-input {
width: 100%;
height: 88rpx;
line-height: 88rpx;
font-size: 28rpx;
color: #000;
}

.images {
display: block;
width: 40rpx;
height: 21rpx;
margin-right: 30rpx;
margin-top: 33.5rpx;
}

.mod-btn {
position: absolute;
bottom: -80rpx;
left: 50%;
margin-left: -80rpx;
}

.mod-btn .button {
width: 160rpx;
height: 160rpx;
background: linear-gradient(180deg, rgba(116, 197, 230, 1) 0%, rgba(64, 147, 201, 1) 100%);
border: 10rpx solid rgba(255, 255, 255, 1);
border-radius: 100%;
font-size: 36rpx;
color: #fff;
display: flex;
justify-content: center;
align-items: center;

}

.mod-btn .button::after {
content: ""
}

.retPassword {
display: inline;
width: auto;
font-size: 28rpx;
color: rgba(64, 147, 201, 1);
line-height: 40rpx;
float: right;
}

.retPassword:active {
background-color: #fff;
}

.appliyAdmin {
position: absolute;
left: 50%;
margin-left: -57rpx;
bottom: 100rpx;
width: 114rpx;
font-size: 28rpx;
color: rgba(255, 255, 255, 1);
line-height: 40rpx;
}

/* 头部 */

.head {
width: 750rpx;
height: 355rpx;
}

.background {
width: 750rpx;
height: 400rpx;
position: absolute;
top: -3rpx;
left: 0;
}

.logo {
width: 123rpx;
height: 107rpx;
display: block;
position: absolute;
top: 84rpx;
left: 313.5rpx;
}

.head text {
font-size: 34rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #2343BD;
position: absolute;
top: 222rpx;
left: 203rpx;
}

/* 输入框 */
.input {
width: 100%;
height: auto;
padding: 0 90rpx;
box-sizing: border-box;
}

.logo_input {
width: 34rpx;
height: 38rpx;
position: absolute;
top: 25rpx;
left: 0;
}

/* 登录 */
.button {
width: 603rpx;
height: 89rpx;
background: rgba(72, 149, 255, 1);
box-shadow: 0rpx 2rpx 14rpx 0rpx rgba(151, 192, 255, 1);
border-radius: 45rpx;
text-align: center;
line-height: 89rpx;
color: #fff;
margin: 0 auto;
margin-top: 239rpx;
font-size: 34rpx;
}

.footer {
width: 100%;
height: 157rpx;
position: absolute;
bottom: 0;
left: 0;
}

.agreeBox {
/* text-align: center; */
/* width: 450rpx; */
/* padding-left: 145rpx; */
font-size: 28rpx;
color: #88909E;
margin: 0 auto;
margin-top: 30rpx;
position: relative;
display: flex;

}

checkbox {
transform: scale(0.5);
}

checkbox-group {
display: inline;
}

navigator {
display: inline
}

.agreeBox image {
width: 26rpx;
height: 26rpx;
display: block;
position: absolute;
top: 9rpx;
left: 18rpx;
margin-right: 19rpx;
}

.imagesBox {
width: 80rpx;
height: 88rpx;
}

.chooseBox {
width: 60rpx;
height: 60rpx;
}

.login {
text-decoration: underline;
text-align: center;
margin-top: 40px;
color: #88909E;
font-size: 28rpx;
}

.textbox {
width: 569rpx;
display: flex;
margin-top: 40rpx;
}

.textbox-1 {
width: 30%;
font-size: 30rpx;
color: #999999;
}

.textbox-11 {
width: 30%;
text-align: right;
font-size: 30rpx;
color: #999999;
}

.textbox-2 {
width: 40%;
}
</style>

+ 330
- 0
pages/login/Verification.vue Näytä tiedosto

@@ -0,0 +1,330 @@
<template>
<view>
<view class="head">
<text>智能高效客户管理平台</text>
</view>
<view class="input">
<view class="cwjs-cells item-flex">
<view class="cwjs-item center">
<input type="text" v-model="username" placeholder="请输入手机号码" maxlength="11"
placeholder-style='color:#AAAAAA' />
</view>
</view>
<view class="textbox">
<view class="textbox-1" @tap="bindVerification">密码登录</view>
<view class="textbox-2"></view>
<view class="textbox-11"></view>
</view>
</view>
<view class="button" @tap="bindWxBLogin">获取验证码</view>
<image src="https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/login/footer.png" class="footer">
</image>
</view>
</template>

<script>
var util = require("../../utils/util.js");
var config = require("../../config");
var app = getApp();
export default {
data() {
return {
username: '',
role: ''
};
},
onLoad: function(options) {
this.role=options.role;
},
methods: {
//账号密码登录
bindVerification() {
uni.navigateTo({
url: '/pages/login/index',
})
},
//获取验证码
bindWxBLogin: function(e) {
if (!(/^1[34578]\d{9}$/.test(this.username))) {
util.showNone("手机号码错误");
this.username='';
return false;
} else {
if(this.role==1){
uni.navigateTo({
url: '/pages/login/yinzhongmalogin?username=' + this.username +
'&role=' + this.role,
})
}else{
console.log(this.role)
uni.navigateTo({
url: '/pages/login/Verifythelogin?username=' + this.username +
'&role=' + this.role,
})
}
}
},
}
};
</script>
<style lang="scss">
.cwjs-logo {
display: block;
width: 219rpx;
height: 158rpx;
margin: 54rpx auto 66rpx;
}

.cwjs-tips {
font-size: 24rpx;
padding: 80rpx 0;
color: #8a8a8a;
}

.cwjs-form {
position: relative;
margin: 0;
background-color: #fff;
border-radius: 10px;
padding: 20rpx 40rpx 113rpx;
}

.cwjs-cells {
width: 569rpx;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 0 auto;
height: 88rpx;
overflow: hidden;
border-bottom: 1rpx solid #BFC7D3;
position: relative;
}

.center {
flex: 1;
}

.cwjs-input {
height: 48rpx;
line-height: 48rpx;
padding: 23rpx 23rpx 23rpx 78rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
color: #000;
}

.images {
display: block;
width: 40rpx;
height: 21rpx;
margin-right: 30rpx;
margin-top: 33.5rpx;
}

.mod-btn {
position: absolute;
bottom: -80rpx;
left: 50%;
margin-left: -80rpx;
}

.mod-btn .button {
width: 160rpx;
height: 160rpx;
background: linear-gradient(180deg, rgba(116, 197, 230, 1) 0%, rgba(64, 147, 201, 1) 100%);
border: 10rpx solid rgba(255, 255, 255, 1);
border-radius: 100%;
font-size: 36rpx;
color: #fff;
display: flex;
justify-content: center;
align-items: center;

}

.mod-btn .button::after {
content: ""
}

.retPassword {
display: inline;
width: auto;
font-size: 28rpx;
color: rgba(64, 147, 201, 1);
line-height: 40rpx;
float: right;
}

.retPassword:active {
background-color: #fff;
}

.appliyAdmin {
position: absolute;
left: 50%;
margin-left: -57rpx;
bottom: 100rpx;
width: 114rpx;
font-size: 28rpx;
color: rgba(255, 255, 255, 1);
line-height: 40rpx;
}

/* 头部 */

.head {
width: 750rpx;
height: 410rpx;
background-image: url(https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/background.png);
background-size: 100vw auto;
background-repeat: no-repeat;
}

.background {
width: 750rpx;
height: 400rpx;
position: absolute;
top: -3rpx;
left: 0;
}

.logo {
width: 248upx;
height: 248upx;
display: block;
position: absolute;
top: 134rpx;
left: 240.5rpx;
}

.head text {
font-size: 34rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #008EF2;
position: absolute;
top: 300rpx;
width: 100%;
text-align: center;

}

/* 输入框 */
.input {
width: 100%;
height: auto;
padding: 0 105rpx;
box-sizing: border-box;
}

.logo_input {
width: 34rpx;
height: 38rpx;
position: absolute;
top: 25rpx;
left: 0;
}

/* 登录 */
.button {
width: 603rpx;
height: 89rpx;
background: rgba(72, 149, 255, 1);
box-shadow: 0rpx 2rpx 14rpx 0rpx rgba(151, 192, 255, 1);
border-radius: 45rpx;
text-align: center;
line-height: 89rpx;
color: #fff;
margin: 0 auto;
margin-top: 239rpx;
font-size: 34rpx;
}

.footer {
width: 100%;
height: 157rpx;
position: absolute;
bottom: 0;
left: 0;
}

.agreeBox {
/* text-align: center; */
/* width: 450rpx; */
/* padding-left: 145rpx; */
font-size: 28rpx;
color: #88909E;
margin: 0 auto;
margin-top: 30rpx;
position: relative;
display: flex;
margin-left: 83upx;
}

checkbox {
transform: scale(0.5);
}

checkbox-group {
display: inline;
}

navigator {
display: inline
}

.agreeBox image {
width: 26rpx;
height: 26rpx;
display: block;
position: absolute;
top: 9rpx;
left: 18rpx;
margin-right: 19rpx;
}

.imagesBox {
width: 80rpx;
height: 88rpx;
}

.chooseBox {
width: 60rpx;
height: 60rpx;
}

.login {
text-decoration: underline;
text-align: center;
margin-top: 40px;
color: #88909E;
font-size: 28rpx;
}

.textbox {
width: 569rpx;
display: flex;
margin-top: 40rpx;
}

.textbox-1 {
width: 30%;
font-size: 30rpx;
color: #999999;
}

.textbox-11 {
width: 30%;
text-align: right;
font-size: 30rpx;
color: #999999;
}

.textbox-2 {
width: 40%;
}
</style>

+ 238
- 0
pages/login/Verifythelogin.vue Näytä tiedosto

@@ -0,0 +1,238 @@
<template>
<view class="content">
<view class="sadsadasdasdsadasd">智能高效客户管理平台</view>
<view class="sction">
<view class="mama">
<view class="mamaz">
<input type="text" v-model="msg" maxlength="4" placeholder="请输入验证码" placeholder-class="input-class" class="input" />
</view>
<view class="mamay">
<view class="sada" v-if="sendAuthCode" style="font-size: 35rpx;" @click="getAuthCode">获取验证码</view>
<text class="sada" v-if="!sendAuthCode">
重新发送
<text>({{ auth_time }})</text>
</text>
</view>
</view>
<view class="login-btn" :style="{ background: msg == '' ? '#F2F2F2' : '#2B6EFF' }" @click="denglu"><text
class="">确认</text></view>
<view class="code-login" @click="passwordlogin"><text>密码登录</text></view>
</view>
</view>
</template>

<script>
var util = require("../../utils/util.js");
var config = require("../../config");
var app = getApp();
export default {
data() {
return {
sendAuthCode: true,
auth_time: 0,
msg: '',
phonecet: '',
role:''
};
},
onLoad: function(options) {
var phonese = options.username;
var phonexxz = phonese.substring(0, 3) + '****' + phonese.substring(7);
this.phone = phonexxz,
this.phonecet = options.username,
this.role = options.role
this.sendAuthCode = false;
this.auth_time = 60;
var auth_timetimer = setInterval(() => {
this.auth_time--;
if (this.auth_time <= 0) {
this.sendAuthCode = true;
clearInterval(auth_timetimer);
}
}, 1000);
},
methods: {
//跳转密码登录页面
passwordlogin() {
uni.reLaunch()({
url: '/pages/login/index',
})
},
//获取验证码
getAuthCode() {
this.sendAuthCode = false;
this.auth_time = 60;
var auth_timetimer = setInterval(() => {
this.auth_time--;
if (this.auth_time <= 0) {
this.sendAuthCode = true;
clearInterval(auth_timetimer);
}
}, 1000);
},
//登录
denglu() {
if (this.msg=='') {
uni.showToast({
title: '验证码不能为空',
icon: 'none'
});
return
}
if (this.msg.length == 4) {
uni.navigateTo({
url: '/pages/login/Setthepassword?username='+'18655732363',
})
} else {
uni.showToast({
title: '验证码位数不正确',
icon: 'none'
});
}

},
}
};
</script>

<style>
.mama {
width: 620rpx;
display: flex;
border-bottom: 1px solid #E1E1E1;
margin: 60rpx auto;
}

.sadsadasdasdsadasd {
font-size: 34rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #008EF2;
width: 100%;
text-align: center;
padding-top: 340rpx;
}

.mamaz {
width: 50%;
height: 90rpx;
}

.mamay {
width: 50%;
height: 90rpx;
}

.input {
width: 350rpx;
color: #78DFB0;
height: 100%;
line-height: 90rpx;
font-size: 17px;
color: #171717;
}

.sada {
width: 70%;
line-height: 90rpx;
color: #2B6EFF;
text-align: right;
font-size: 35rpx;
margin-left: 100rpx;
display: block;
}
.content {
margin: 0;
padding: 0;
background-image: url(https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/background.png);
background-size: 100vw auto;
background-repeat: no-repeat;
}

.login-text {
font-size: 60rpx;
font-family: PingFang SC;
font-weight: 500;
color: rgba(23, 23, 23, 1);
letter-spacing: 8rpx;
margin-left: 75rpx;
font-weight: bold;
}

.login-input {
border-bottom: 1px solid #e1e1e1;
color: #c9cac9;
margin: 98rpx 64rpx 200rpx 75rpx;
font-size: 17px;

}

.login-btn {
margin: 0 auto;
margin-top: 240rpx;
width: 567rpx;
height: 86rpx;
border-radius: 2em;
font-size: 17px;
font-weight: bold;
border: none;
display: flex;
justify-content: center;
align-items: center;
color: #ffffff;
}

.code-login {
display: flex;
justify-content: center;
margin-top: 40rpx;
color: #D6D7D6;
margin-bottom: 200rpx;
font-size: 30rpx;
}

.log-box {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 28rpx;
color: #bfc0bf;
margin-bottom: 65rpx;
}

.hengx {
margin: 0 20rpx 0 20rpx;
height: 2rpx;
width: 232rpx;
background: #e1e1e1;
}

.wechat {
display: flex;
justify-content: center;
align-items: center;
width: 93rpx;
height: 93rpx;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 10rpx 30rpx rgba(120, 223, 176, 0.22);
border-radius: 50%;
margin: 0 auto;
}

.btn-get {
width: 250rpx;
font-size: 17px;
color: #c9cac9;
position: relative;
top: -290rpx;
right: -450rpx;
}

.input-class {
color: #D6D7D6;
font-size: 17px;
letter-spacing: 1rpx;
}
</style>

+ 343
- 18
pages/login/index.vue Näytä tiedosto

@@ -1,29 +1,354 @@
<template>
<view>
登录页
<view @click="tologin()" style="width: 200rpx;height: 80rpx;text-align: center;line-height: 80rpx;margin: 0 auto;border: 1px solid red;margin-top: 400rpx;">确认</view>
<view class="head">
<text>智能高效客户管理平台</text>
</view>
<view class="input">
<view class="cwjs-cells item-flex">
<view class="cwjs-item center">
<image src="https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/user.png" class="logo_input">
</image>
<input class="cwjs-item cwjs-input" v-model="username" placeholder="请输入账号名" type="number" maxlength="11" placeholder-style="color:#AAAAAA"></input>
</view>
</view>
<view class="cwjs-cells item-flex" style="margin-top:13rpx;">
<view class="cwjs-item center">
<image src="https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/lock.png" class="logo_input">
</image>
<input class="cwjs-item cwjs-input" placeholder="请输入密码" placeholder-style="color:#AAAAAA" type="password" v-model="password" maxlength="16" v-if="passwordType"></input>
<input class="cwjs-item cwjs-input" placeholder="请输入密码" placeholder-style="color:#AAAAAA" maxlength="16" v-model="password" v-else></input>
</view>
<view class="imagesBox" @tap="changeBindPassword">
<image
:src="'https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/login/' + (passwordType==true?'close_eyes.png':'open_eyes.png')"
class="images" mode="scaleToFill"></image>
</view>
</view>
<view class="textbox">
<view class="textbox-1" @tap="bindVerification">验证码登录</view>
<view class="textbox-2"></view>
<view class="textbox-11" @tap="bindpassword">忘记密码</view>
</view>
</view>
<view class="button" @tap="bindWxBLogin">登录</view>
<image src="https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/login/footer.png" class="footer">
</image>
</view>
</template>

<script>
export default {
data() {
return {};
},
components: {},
onLoad() {},
onShow() {},
methods: {
tologin(){
uni.switchTab({
url: '/pages/index/index'
});
var util = require("../../utils/util.js");
var config = require("../../config");
var app = getApp();
export default {
data() {
return {
username: '18655732363',
//获取到的用户名的值
password: '123456',
//获取到的密码栏中的值
passwordType: true,
agreeChecked: true
};
},
onLoad: function(options) {
uni.hideToast();
},
onShow: function() {
},
methods: {
//验证码登录
bindVerification() {
uni.navigateTo({
url: '/pages/login/Verification?role=1',
})
},
//忘记密码
bindpassword() {
uni.navigateTo({
url: '/pages/login/Verification?role=2',
})
},
//密码选择
changeBindPassword: function(e) {
this.passwordType=!this.passwordType;
},
//登录
bindWxBLogin: function(e) {
util.showBusy('正在登录...');
if (this.username == '') {
util.showNone("请输入账号名");
return false;
}
if (this.password == '') {
util.showNone("请输入密码");
return false;
}
uni.switchTab({
url: '/pages/index/index'
});
},
}
},

};
};
</script>
<style lang="scss">
.cwjs-logo {
display: block;
width: 219rpx;
height: 158rpx;
margin: 54rpx auto 66rpx;
}

.cwjs-tips {
font-size: 24rpx;
padding: 80rpx 0;
color: #8a8a8a;
}

.cwjs-form {
position: relative;
margin: 0;
background-color: #fff;
border-radius: 10px;
padding: 20rpx 40rpx 113rpx;
}

.cwjs-cells {
width: 569rpx;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 0 auto;
height: 88rpx;
overflow: hidden;
border-bottom: 1rpx solid #BFC7D3;
position: relative;
}

.center {
flex: 1;
}

.cwjs-input {
height: 48rpx;
line-height: 48rpx;
padding: 23rpx 23rpx 23rpx 78rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
color: #000;
}

.images {
display: block;
width: 40rpx;
height: 21rpx;
margin-right: 30rpx;
margin-top: 33.5rpx;
}

.mod-btn {
position: absolute;
bottom: -80rpx;
left: 50%;
margin-left: -80rpx;
}

.mod-btn .button {
width: 160rpx;
height: 160rpx;
background: linear-gradient(180deg, rgba(116, 197, 230, 1) 0%, rgba(64, 147, 201, 1) 100%);
border: 10rpx solid rgba(255, 255, 255, 1);
border-radius: 100%;
font-size: 36rpx;
color: #fff;
display: flex;
justify-content: center;
align-items: center;

}

.mod-btn .button::after {
content: ""
}

.retPassword {
display: inline;
width: auto;
font-size: 28rpx;
color: rgba(64, 147, 201, 1);
line-height: 40rpx;
float: right;
}

.retPassword:active {
background-color: #fff;
}

.appliyAdmin {
position: absolute;
left: 50%;
margin-left: -57rpx;
bottom: 100rpx;
width: 114rpx;
font-size: 28rpx;
color: rgba(255, 255, 255, 1);
line-height: 40rpx;
}

/* 头部 */

.head {
width: 750rpx;
height: 410rpx;
background-image: url(https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/background.png);
background-size: 100vw auto;
background-repeat: no-repeat;
}

.background {
width: 750rpx;
height: 400rpx;
position: absolute;
top: -3rpx;
left: 0;
}

.logo {
width: 248upx;
height: 248upx;
display: block;
position: absolute;
top: 134rpx;
left: 240.5rpx;
}

.head text {
font-size: 34rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #008EF2;
position: absolute;
top: 353rpx;
width: 100%;
text-align: center;

}

/* 输入框 */
.input {
width: 100%;
height: auto;
padding: 0 105rpx;
box-sizing: border-box;
}

.logo_input {
width: 34rpx;
height: 38rpx;
position: absolute;
top: 25rpx;
left: 0;
}

/* 登录 */
.button {
width: 603rpx;
height: 89rpx;
background: rgba(72, 149, 255, 1);
box-shadow: 0rpx 2rpx 14rpx 0rpx rgba(151, 192, 255, 1);
border-radius: 45rpx;
text-align: center;
line-height: 89rpx;
color: #fff;
margin: 0 auto;
margin-top: 239rpx;
font-size: 34rpx;
}

.footer {
width: 100%;
height: 157rpx;
position: absolute;
bottom: 0;
left: 0;
}

.agreeBox {
/* text-align: center; */
/* width: 450rpx; */
/* padding-left: 145rpx; */
font-size: 28rpx;
color: #88909E;
margin: 0 auto;
margin-top: 30rpx;
position: relative;
display: flex;
margin-left: 83upx;
}

checkbox {
transform: scale(0.5);
}

checkbox-group {
display: inline;
}

navigator {
display: inline
}

.agreeBox image {
width: 26rpx;
height: 26rpx;
display: block;
position: absolute;
top: 9rpx;
left: 18rpx;
margin-right: 19rpx;
}

.imagesBox {
width: 80rpx;
height: 88rpx;
}

.chooseBox {
width: 60rpx;
height: 60rpx;
}

.login {
text-decoration: underline;
text-align: center;
margin-top: 40px;
color: #88909E;
font-size: 28rpx;
}

.textbox {
width: 569rpx;
display: flex;
margin-top: 40rpx;
}

.textbox-1 {
width: 30%;
font-size: 30rpx;
color: #999999;
}

<style lang="scss" scoped>
.textbox-11 {
width: 30%;
text-align: right;
font-size: 30rpx;
color: #999999;
}

.textbox-2 {
width: 40%;
}
</style>

+ 239
- 0
pages/login/yinzhongmalogin.vue Näytä tiedosto

@@ -0,0 +1,239 @@
<template>
<view class="content">
<view class="sadsadasdasdsadasd">智能高效客户管理平台</view>
<view class="sction">
<view class="mama">
<view class="mamaz">
<input type="text" v-model="msg" maxlength="4" placeholder="请输入验证码" placeholder-class="input-class" class="input" />
</view>
<view class="mamay">
<view class="sada" v-if="sendAuthCode" style="font-size: 35rpx;" @click="getAuthCode">获取验证码</view>
<text class="sada" v-if="!sendAuthCode">
重新发送
<text>({{ auth_time }})</text>
</text>
</view>
</view>
<view class="login-btn" :style="{ background: msg == '' ? '#F2F2F2' : '#2B6EFF' }" @click="denglu"><text
class="">登录</text></view>
<view class="code-login" @click="passwordlogin"><text>密码登录</text></view>
</view>
</view>
</template>

<script>
var util = require("../../utils/util.js");
var config = require("../../config");
var app = getApp();
export default {
data() {
return {
sendAuthCode: true,
auth_time: 0,
msg: '',
phonecet: '',
role:''
};
},
onLoad: function(options) {
var phonese = options.username;
var phonexxz = phonese.substring(0, 3) + '****' + phonese.substring(7);
this.phone = phonexxz,
this.phonecet = options.username,
this.role = options.role
this.sendAuthCode = false;
this.auth_time = 60;
var auth_timetimer = setInterval(() => {
this.auth_time--;
if (this.auth_time <= 0) {
this.sendAuthCode = true;
clearInterval(auth_timetimer);
}
}, 1000);
},
methods: {
//跳转密码登录页面
passwordlogin() {
uni.reLaunch()({
url: '/pages/login/index',
})
},
//获取验证码
getAuthCode() {
this.sendAuthCode = false;
this.auth_time = 60;
var auth_timetimer = setInterval(() => {
this.auth_time--;
if (this.auth_time <= 0) {
this.sendAuthCode = true;
clearInterval(auth_timetimer);
}
}, 1000);
},
//登录
denglu() {
if (this.msg=='') {
uni.showToast({
title: '验证码不能为空',
icon: 'none'
});
return
}
if (this.msg.length == 4) {
uni.switchTab({
url: '/pages/index/index'
});
} else {
uni.showToast({
title: '验证码位数不正确',
icon: 'none'
});
}

},
}
};
</script>

<style>
.mama {
width: 620rpx;
display: flex;
border-bottom: 1px solid #E1E1E1;
margin: 60rpx auto;
}

.sadsadasdasdsadasd {
font-size: 34rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #008EF2;
width: 100%;
text-align: center;
padding-top: 340rpx;
}

.mamaz {
width: 50%;
height: 90rpx;
}

.mamay {
width: 50%;
height: 90rpx;
}

.input {
width: 350rpx;
color: #78DFB0;
height: 100%;
line-height: 90rpx;
font-size: 17px;
color: #171717;
}

.sada {
width: 70%;
line-height: 90rpx;
color: #2B6EFF;
text-align: right;
font-size: 35rpx;
margin-left: 100rpx;
display: block;
}
.content {
margin: 0;
padding: 0;
background-image: url(https://qufang.oss-cn-beijing.aliyuncs.com/channelHelper/background.png);
background-size: 100vw auto;
background-repeat: no-repeat;
}

.login-text {
font-size: 60rpx;
font-family: PingFang SC;
font-weight: 500;
color: rgba(23, 23, 23, 1);
letter-spacing: 8rpx;
margin-left: 75rpx;
font-weight: bold;
}

.login-input {
border-bottom: 1px solid #e1e1e1;
color: #c9cac9;
margin: 98rpx 64rpx 200rpx 75rpx;
font-size: 17px;

}

.login-btn {
margin: 0 auto;
margin-top: 240rpx;
width: 567rpx;
height: 86rpx;
border-radius: 2em;
font-size: 17px;
font-weight: bold;
border: none;
display: flex;
justify-content: center;
align-items: center;
color: #ffffff;
}

.code-login {
display: flex;
justify-content: center;
margin-top: 40rpx;
color: #D6D7D6;
margin-bottom: 200rpx;
font-size: 30rpx;
}

.log-box {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 28rpx;
color: #bfc0bf;
margin-bottom: 65rpx;
}

.hengx {
margin: 0 20rpx 0 20rpx;
height: 2rpx;
width: 232rpx;
background: #e1e1e1;
}

.wechat {
display: flex;
justify-content: center;
align-items: center;
width: 93rpx;
height: 93rpx;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 10rpx 30rpx rgba(120, 223, 176, 0.22);
border-radius: 50%;
margin: 0 auto;
}

.btn-get {
width: 250rpx;
font-size: 17px;
color: #c9cac9;
position: relative;
top: -290rpx;
right: -450rpx;
}

.input-class {
color: #D6D7D6;
font-size: 17px;
letter-spacing: 1rpx;
}
</style>

BIN
static/images/Customer.png Näytä tiedosto

Before After
Leveys: 36  |  Korkeus: 36  |  Koko: 1.5 KiB

BIN
static/images/arrow.png Näytä tiedosto

Before After
Leveys: 24  |  Korkeus: 56  |  Koko: 902 B

BIN
static/images/exit.png Näytä tiedosto

Before After
Leveys: 36  |  Korkeus: 36  |  Koko: 845 B

BIN
static/images/password.png Näytä tiedosto

Before After
Leveys: 36  |  Korkeus: 36  |  Koko: 848 B

BIN
static/images/setting.png Näytä tiedosto

Before After
Leveys: 36  |  Korkeus: 36  |  Koko: 1.7 KiB

Kirjoita Esikatselu
Ladataan…
Peruuta
Tallenna