other_project/mallplus
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

2023-02-22 完善页面样式

Browse Source
This commit is contained in:
guoxing
2023-02-22 20:24:25 +08:00
parent 515ae22389
commit c64e72109e
4 changed files with 303 additions and 271 deletions
Download Patch File Download Diff File Expand all files Collapse all files

202
mallplusui-uniapp-app/pages/public/login.vue
View File

@@ -1,100 +1,104 @@
<template>
<view class="container">
<view class="left-bottom-sign"></view>
<!-- <view class="left-bottom-sign"></view> -->
<!-- <view class="back-btn yticon icon-zuojiantou-up" @click="navBack"></view> -->
<view class="right-top-sign"></view>
<!-- <view class="right-top-sign"></view> -->
<!-- 设置白色背景防止软键盘把下部绝对定位元素顶上来盖住输入框等 -->
<!-- <view class="left-top-sign">{{ sysInfo.name }}LOGIN</view> -->
<view class="welcome">欢迎回来！汇融云链</view>
<view class="wrapper">
<!-- #ifdef H5 -->
<view class="input-content">
<view class="select_lay">
<text class="select_lay_text" :class="{'select_lay_text1':selectKey===0}" @click="selectType(0)">免密登录</text>
<text class="select_lay_text" :class="{'select_lay_text1':selectKey===1}" @click="selectType(1)">账号登录</text>
</view>
<view class="input-item">
<text class="tit">手机号码</text>
<input type="number" v-model="phone" maxlength="11" placeholder="请输入手机号码" />
</view>
<view class="input-item" v-if="show">
<text class="tit">密码</text>
<input type="password" placeholder="请输入密码" v-model="password" @confirm="toLogin" />
</view>
<view class="input-item" v-if="!show">
<text class="tit">验证码</text>
<view class="input-item-right">
<input type="number" maxlength="6" placeholder="请输入验证码" v-model="code" @confirm="toLogin"
style="width: 70%;" />
<view class="codeText" v-if="coding == false" @click="getCode()">获取验证码</view>
<view class="authTime" v-else>{{ auth_time }}秒</view>
<view class="welcome">汇融云链欢迎您</view>
<view class="wrapper">
<!-- #ifdef H5 -->
<view class="input-content">
<view class="select_lay">
<text :class="{'select_lay_text1':selectKey===0}"
@click="selectType(0)">账号登录</text>
<text style="margin-left: 20px;" :class="{'select_lay_text1':selectKey===1}"
@click="selectType(1)">短信登录</text>
</view>
<view class="input-item">
<text class="tit">手机号码</text>
<input type="number" v-model="phone" maxlength="11" placeholder="请输入手机号码" />
</view>
<view class="input-item" v-if="show">
<text class="tit">密码</text>
<input type="password" placeholder="请输入密码" v-model="password" @confirm="toLogin" />
</view>
<view class="input-item" v-if="!show">
<text class="tit">验证码</text>
<view class="input-item-right">
<input type="number" maxlength="6" placeholder="请输入验证码" v-model="code" @confirm="toLogin"
style="width: 70%;" />
<view class="codeText" v-if="coding == false" @click="getCode()">获取验证码</view>
<view class="authTime" v-else>{{ auth_time }}秒</view>
</view>
</view>
</view>
</view>
<button class="confirm-btn" @click="toLogin" :disabled="logining">登录</button>
<view class="login_bot">
<view class="forget-section" @click="toForget">忘记密码?</view>
<view class="register-section">
还没有账号?
<text @click="toRegist">马上注册</text>
</view>
</view>
<br />
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<button class="confirm-btn" open-type="getUserInfo" @getuserinfo="wxGetUserInfo" withCredentials="true"
v-if="isGetPhone == false">微信登录</button>
<button class="confirm-btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"
v-if="isGetPhone == true">获取手机号</button>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="input-content">
<view class="select_lay">
<text :class="{'select_lay_text1':selectKey===0}" @click="selectType(0)">免密登录</text>
<text class="select_lay_text" :class="{'select_lay_text1':selectKey===1}" @click="selectType(1)">账号登录</text>
</view>
<view class="input-item">
<text class="tit">手机号码</text>
<input type="number" v-model="phone" maxlength="11" placeholder="请输入手机号码" />
</view>
<view class="input-item" v-if="show">
<text class="tit">密码</text>
<input type="password" placeholder="请输入密码" v-model="password" @confirm="toLogin" />
</view>
<view class="input-item" v-if="!show">
<text class="tit">验证码</text>
<view class="input-item-right">
<input type="number" maxlength="6" placeholder="请输入验证码" v-model="code" @confirm="toLogin"
style="width: 70%;" />
<view class="codeText" v-if="coding == false" @click="getCode()">获取验证码</view>
<view class="authTime" v-else>{{ auth_time }}秒</view>
<button class="confirm-btn" @click="toLogin" :disabled="logining">登录</button>
<view class="login_bot">
<view class="forget-section" @click="toForget">忘记密码?</view>
<view class="register-section">
还没有账号?
<text @click="toRegist">马上注册</text>
</view>
</view>
</view>
<button class="confirm-btn" @click="toLogin" :disabled="logining">登录</button>
<!-- <button v-if="isWeiXin == 1" class="confirm-btn" @click="wechatH5Login" :disabled="logining">微信授权登录</button> -->
<view class="login_bot">
<view class="forget-section" @click="toForget">忘记密码?</view>
<view class="register-section">
还没有账号?
<text @click="toRegist">马上注册</text>
<br />
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<button class="confirm-btn" open-type="getUserInfo" @getuserinfo="wxGetUserInfo" withCredentials="true"
v-if="isGetPhone == false">微信登录</button>
<button class="confirm-btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"
v-if="isGetPhone == true">获取手机号</button>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="input-content">
<view class="select_lay">
<text :class="{'select_lay_text1':selectKey===0}"
@click="selectType(0)">账号登录</text>
<text style="margin-left: 20px;" :class="{'select_lay_text1':selectKey===1}" @click="selectType(1)">短信登录</text>
</view>
<view class="input-item">
<text class="tit">手机号码</text>
<input type="number" v-model="phone" maxlength="11" placeholder="请输入手机号码" />
</view>
<view class="input-item" v-if="show">
<text class="tit">密码</text>
<input type="password" placeholder="请输入密码" v-model="password" @confirm="toLogin" />
</view>
<view class="input-item" v-if="!show">
<text class="tit">验证码</text>
<view class="input-item-right">
<input type="number" maxlength="6" placeholder="请输入验证码" v-model="code" @confirm="toLogin"
style="width: 70%;" />
<view class="codeText" v-if="coding == false" @click="getCode()">获取验证码</view>
<view class="authTime" v-else>{{ auth_time }}秒</view>
</view>
</view>
</view>
<button class="confirm-btn" @click="toLogin" :disabled="logining">登录</button>
<!-- <button v-if="isWeiXin == 1" class="confirm-btn" @click="wechatH5Login" :disabled="logining">微信授权登录</button> -->
<view class="login_bot">
<view class="forget-section" @click="toForget">忘记密码?</view>
<view class="register-section">
还没有账号?
<text @click="toRegist">马上注册</text>
</view>
</view>
<br />
<!-- #endif -->
</view>
<br />
<!-- #endif -->
</view>
<!-- <mallplusCopyright></mallplusCopyright> -->
</view>
@@ -114,8 +118,8 @@
},
data() {
return {
show: false,
selectKey:0,
show: true,
selectKey: 0,
code: '',
coding: false,
auth_time: 60,
@@ -140,10 +144,10 @@
},
methods: {
...mapMutations(['login']),
selectType(index){
this.selectKey=index
selectType(index) {
this.selectKey = index
this.show = !this.show
},
inputChange(e) {
const key = e.currentTarget.dataset.key;
@@ -487,17 +491,17 @@
async toLogin() {
var that = this;
let phoneReg = /^1[1-9][0-9]\d{8}$/;
if(that.selectKey==0){
// 免密登录
if (that.selectKey == 1) {
// 短信登录
uni.showToast({
icon: 'none',
title: '暂不支持此登录方式'
});
return;
}else{
} else {
// 账号登录
try {
if (this.phone == '') {
throw '请填写手机号';
@@ -535,7 +539,7 @@
});
}
}
},
getuserinfoh5appwx() {
var that = this;
@@ -701,7 +705,7 @@
align-items: center;
.select_lay_text {
margin-left: 30upx;
}
.select_lay_text1 {
@@ -792,7 +796,7 @@
.login_bot {
display: flex;
margin-top: 15upx;
margin-top: 25upx;
margin-left: 70upx;
margin-right: 70upx;
flex-direction: row;