修改授权页,登录页样式

This commit is contained in:
Gao xiaosong
2020-09-13 03:58:01 +08:00
parent b706b4f104
commit b275117c35
7 changed files with 285 additions and 260 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -6153,7 +6153,7 @@ page {
margin: 0.2*100rpx 0.3*100rpx 0 0.3*100rpx; margin: 0.2*100rpx 0.3*100rpx 0 0.3*100rpx;
} }
.cash-withdrawal{ .cash-withdrawal {
padding-top: 1.3*100rpx; padding-top: 1.3*100rpx;
} }
@ -7349,49 +7349,51 @@ page {
/*立即注册*/ /*立即注册*/
.register { .register {
background-image: linear-gradient(to bottom, #eb3729 0%, #eb3729 100%); // background-image: linear-gradient(to bottom, #eb3729 0%, #eb3729 100%);
background-image: -moz-linear-gradient(to bottom, #eb3729 0%, #eb3729 100%); // background-image: -moz-linear-gradient(to bottom, #eb3729 0%, #eb3729 100%);
width: 100%; width: 100%;
height: 100vh; height: 100vh;
display: flex;
flex-direction: column;
// justify-content: center;
} }
.register .shading { // .register .shading {
background-image: url("https://wx.yixiang.co/static/images/registerw.png"); // background-image: url("https://wx.yixiang.co/static/images/registerw.png");
background-repeat: no-repeat; // background-repeat: no-repeat;
background-size: 100% 100%; // background-size: 100% 100%;
width: 100%; // width: 100%;
height: 2.86*100rpx; // height: 2.86*100rpx;
padding-top: 0.7*100rpx; // padding-top: 0.7*100rpx;
} // }
.register .shading .pictrue { // .register .shading .pictrue {
width: 1.72*100rpx; // width: 1.72*100rpx;
height: 1.72*100rpx; // height: 1.72*100rpx;
border-radius: 50%; // border-radius: 50%;
background-color: rgba(255, 255, 255, 0.8); // background-color: rgba(255, 255, 255, 0.8);
margin: 0 auto; // margin: 0 auto;
} // }
.register .shading .pictrue image { // .register .shading .pictrue image {
width: 1.64*100rpx; // width: 1.64*100rpx;
height: 1.64*100rpx; // height: 1.64*100rpx;
border-radius: 50%; // border-radius: 50%;
display: block; // display: block;
} // }
.register .whiteBg { .register .whiteBg {
width: 6.2*100rpx; padding: 0 60rpx
border-radius: 0.16*100rpx;
background-color: #fff;
margin: 0.3*100rpx auto 0 auto;
padding: 0.45*100rpx 0.3*100rpx 0 0.3*100rpx;
} }
.register .whiteBg .title { .register .whiteBg .title {
line-height: 2em;
font-size: 0.36*100rpx; font-size: 0.36*100rpx;
color: #282828; color: #282828;
text-align: center; text-align: left;
font-weight: bold; font-weight: bold;
margin-top: 100rpx;
margin-bottom: 50rpx;
} }
.register .whiteBg .title .item~.item { .register .whiteBg .title .item~.item {
@ -7410,8 +7412,8 @@ page {
} }
.register .whiteBg .list .item { .register .whiteBg .list .item {
border-bottom: 1px solid #ededed; border-bottom: 1px solid #cccccc;
padding: 0.47*100rpx 0 0.13*100rpx 0; padding: 30rpx 0 30rpx 0rpx;
position: relative; position: relative;
} }
@ -7429,7 +7431,7 @@ page {
.register .whiteBg .list .item input { .register .whiteBg .list .item input {
font-size: 0.33*100rpx; font-size: 0.33*100rpx;
width: 4.9*100rpx; width: 100%;
} }
.register .whiteBg .list .item input::placeholder { .register .whiteBg .list .item input::placeholder {
@ -7493,7 +7495,7 @@ page {
} }
.register .bottom { .register .bottom {
background-image: url("https://wx.yixiang.co/static/images/registerB.png"); // background-image: url("https://wx.yixiang.co/static/images/registerB.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
width: 6.2*100rpx; width: 6.2*100rpx;
@ -7523,7 +7525,7 @@ page {
// #endif // #endif
z-index: 9; z-index: 9;
border-bottom: 1px solid #f5f5f5; // border-bottom: 1px solid #555;
} }
.productSort .header .input { .productSort .header .input {
@ -9307,3 +9309,9 @@ rich-text {
position: relative; position: relative;
} }
} }
.shoppingCart,
.user,
.container {
height: 100%;
}

View File

@ -99,7 +99,9 @@ import {
ready, ready,
wxShowLocation, wxShowLocation,
} from '@/libs/wechat' } from '@/libs/wechat'
import { isWeixin } from '@/utils' import { isWeixin } from '@/utils'
// 判断是否是微信浏览器 // 判断是否是微信浏览器
if (isWeixin()) { if (isWeixin()) {
Vue.prototype.$deviceType = 'weixin' Vue.prototype.$deviceType = 'weixin'

View File

@ -14,7 +14,7 @@
<!-- #endif --> <!-- #endif -->
<!-- #ifndef MP-WEIXIN --> <!-- #ifndef MP-WEIXIN -->
<view class="force-login-wrap"> <view class="force-login-wrap">
<image class="logo-bg" src="@/static/images/logo_bg.png" mode="aspectFill"></image> <!-- <image class="logo-bg" src="@/static/images/logo_bg.png" mode="aspectFill"></image> -->
<view class="force-login__content y-f"> <view class="force-login__content y-f">
<view class="login-notice">为了提供更优质的服务请先登录</view> <view class="login-notice">为了提供更优质的服务请先登录</view>
<button class="cu-btn author-btn" @tap="toLogin">去登录</button> <button class="cu-btn author-btn" @tap="toLogin">去登录</button>
@ -118,13 +118,11 @@
} }
.force-login-wrap { .force-login-wrap {
position: fixed; width: 100%;
width: 100vw; height: 100%;
height: 100vh;
overflow: hidden; overflow: hidden;
z-index: 11111; z-index: 11111;
top: 0; top: 0;
background: #fff;
.logo-bg { .logo-bg {
width: 640rpx; width: 640rpx;
@ -167,7 +165,8 @@
.author-btn { .author-btn {
width: 630rpx; width: 630rpx;
height: 80rpx; height: 80rpx;
background: linear-gradient(90deg, #eb3729, #eb3729); background: linear-gradient(to right, #f35447 0%, #ff8e3c 100%);
background: -moz-linear-gradient(to right, #f35447 0%, #ff8e3c 100%);
// box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22); // box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22);
border-radius: 40rpx; border-radius: 40rpx;
font-size: 30rpx; font-size: 30rpx;

View File

@ -21,6 +21,9 @@
<view class="qr" @click="startQr()"> <view class="qr" @click="startQr()">
<image src="@/static/images/qr.png" /> <image src="@/static/images/qr.png" />
</view> </view>
<view class="qr" @click="$yrouter.push({path:'/pages/shop/GoodsEvaluate/index'})">
<image src="@/static/images/qr.png" />
</view>
</view> </view>
<Banner :banner="banner" @getbgcolor="getbgcolor"></Banner> <Banner :banner="banner" @getbgcolor="getbgcolor"></Banner>
<uni-notice-bar scrollable="true" @click="goRoll(singNew)" single="true" :speed="10" showIcon="true" <uni-notice-bar scrollable="true" @click="goRoll(singNew)" single="true" :speed="10" showIcon="true"

View File

@ -1,19 +1,9 @@
<template> <template>
<view class="register absolute"> <view class="register absolute">
<view class="shading">
<view class="pictrue acea-row row-center-wrapper">
<image src="@/static/images/logo.png" />
</view>
</view>
<view class="whiteBg" v-if="formItem === 1"> <view class="whiteBg" v-if="formItem === 1">
<view class="title acea-row row-center-wrapper"> <view class="title acea-row row-between-wrapper">
<view <view class="item" :class="current === index ? 'on' : ''" v-for="(item, index) in navList"
class="item" @click="navTap(index)" :key="index">{{ item }}</view>
:class="current === index ? 'on' : ''"
v-for="(item, index) in navList"
@click="navTap(index)"
:key="index"
>{{ item }}</view>
</view> </view>
<view class="list" :hidden="current !== 0"> <view class="list" :hidden="current !== 0">
<form @submit.prevent="submit"> <form @submit.prevent="submit">
@ -50,12 +40,8 @@
<use xlink:href="#icon-code_1" /> <use xlink:href="#icon-code_1" />
</svg>--> </svg>-->
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" /> <input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
<button <button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''"
class="code" @click="code">{{ text }}</button>
:disabled="disabled"
:class="disabled === true ? 'on' : ''"
@click="code"
>{{ text }}</button>
</view> </view>
</view> </view>
</view> </view>
@ -67,7 +53,9 @@
</view> </view>
</view> </view>
<view class="whiteBg" v-else> <view class="whiteBg" v-else>
<view class="title">注册账号</view> <view class="title acea-row row-between-wrapper">
<view class="item on">注册账号</view>
</view>
<view class="list"> <view class="list">
<view class="item"> <view class="item">
<view> <view>
@ -83,12 +71,8 @@
<use xlink:href="#icon-code_1" /> <use xlink:href="#icon-code_1" />
</svg>--> </svg>-->
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" /> <input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
<button <button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''"
class="code" @click="code">{{ text }}</button>
:disabled="disabled"
:class="disabled === true ? 'on' : ''"
@click="code"
>{{ text }}</button>
</view> </view>
</view> </view>
<view class="item"> <view class="item">
@ -99,6 +83,7 @@
<input type="password" placeholder="填写您的登录密码" v-model="password" /> <input type="password" placeholder="填写您的登录密码" v-model="password" />
</view> </view>
</view> </view>
<!-- #ifndef H5 -->
<view class="item"> <view class="item">
<view> <view>
<!-- <svg class="icon" aria-hidden="true"> <!-- <svg class="icon" aria-hidden="true">
@ -107,6 +92,8 @@
<input type="text" placeholder="输入邀请码" v-model="inviteCode" /> <input type="text" placeholder="输入邀请码" v-model="inviteCode" />
</view> </view>
</view> </view>
<!-- #endif -->
</view> </view>
<view class="logon" @click="register">注册</view> <view class="logon" @click="register">注册</view>
<view class="tip"> <view class="tip">
@ -114,25 +101,37 @@
<text @click="formItem = 1" class="font-color-red">立即登录</text> <text @click="formItem = 1" class="font-color-red">立即登录</text>
</view> </view>
</view> </view>
<view class="bottom"></view>
</view> </view>
</template> </template>
<script> <script>
import sendVerifyCode from "@/mixins/SendVerifyCode"; import sendVerifyCode from "@/mixins/SendVerifyCode";
import { login, loginMobile, registerVerify, register } from "@/api/user"; import {
import attrs, { required, alpha_num, chs_phone } from "@/utils/validate"; login,
import { validatorDefaultCatch } from "@/utils/dialog"; loginMobile,
import dayjs from "dayjs"; registerVerify,
import cookie from "@/utils/store/cookie"; register
} from "@/api/user";
import attrs, {
required,
alpha_num,
chs_phone
} from "@/utils/validate";
import {
validatorDefaultCatch
} from "@/utils/dialog";
import dayjs from "dayjs";
import cookie from "@/utils/store/cookie";
import { handleGetUserInfo } from "@/utils"; import {
handleGetUserInfo
} from "@/utils";
const BACK_URL = "login_back_url"; const BACK_URL = "login_back_url";
export default { export default {
name: "Login", name: "Login",
mixins: [sendVerifyCode], mixins: [sendVerifyCode],
data: function() { data: function () {
return { return {
navList: ["账号登录"], navList: ["账号登录"],
current: 0, current: 0,
@ -147,7 +146,10 @@ export default {
methods: { methods: {
async loginMobile() { async loginMobile() {
var that = this; var that = this;
const { account, captcha } = that; const {
account,
captcha
} = that;
try { try {
await that await that
.$validator({ .$validator({
@ -179,7 +181,7 @@ export default {
}) })
.catch(err => { .catch(err => {
uni.showToast({ uni.showToast({
title: err.msg || err.response.data.msg|| err.response.data.message, title: err.msg || err.response.data.msg || err.response.data.message,
icon: "none", icon: "none",
duration: 2000 duration: 2000
}); });
@ -187,7 +189,11 @@ export default {
}, },
async register() { async register() {
var that = this; var that = this;
const { account, captcha, password } = that; const {
account,
captcha,
password
} = that;
try { try {
await that await that
.$validator({ .$validator({
@ -230,7 +236,7 @@ export default {
}) })
.catch(err => { .catch(err => {
uni.showToast({ uni.showToast({
title: err.msg || err.response.data.msg|| err.response.data.message, title: err.msg || err.response.data.msg || err.response.data.message,
icon: "none", icon: "none",
duration: 2000 duration: 2000
}); });
@ -238,7 +244,9 @@ export default {
}, },
async code() { async code() {
var that = this; var that = this;
const { account } = that; const {
account
} = that;
try { try {
await that await that
.$validator({ .$validator({
@ -268,17 +276,20 @@ export default {
}) })
.catch(err => { .catch(err => {
uni.showToast({ uni.showToast({
title: err.msg || err.response.data.msg|| err.response.data.message, title: err.msg || err.response.data.msg || err.response.data.message,
icon: "none", icon: "none",
duration: 2000 duration: 2000
}); });
}); });
}, },
navTap: function(index) { navTap: function (index) {
this.current = index; this.current = index;
}, },
async submit() { async submit() {
const { account, password } = this; const {
account,
password
} = this;
try { try {
await this.$validator({ await this.$validator({
account: [ account: [
@ -304,7 +315,9 @@ export default {
password, password,
spread: cookie.get("spread") spread: cookie.get("spread")
}) })
.then(({ data }) => { .then(({
data
}) => {
this.$store.commit("login", data.token, dayjs(data.expires_time)); this.$store.commit("login", data.token, dayjs(data.expires_time));
handleGetUserInfo(); handleGetUserInfo();
// let replace=this.$yroute.query.replace // let replace=this.$yroute.query.replace
@ -318,12 +331,12 @@ export default {
.catch(err => { .catch(err => {
console.log(err); console.log(err);
uni.showToast({ uni.showToast({
title: err.msg || err.response.data.msg|| err.response.data.message, title: err.msg || err.response.data.msg || err.response.data.message,
icon: "none", icon: "none",
duration: 2000 duration: 2000
}); });
}); });
} }
} }
}; };
</script> </script>