登录页样式

This commit is contained in:
2024-02-22 10:13:20 +08:00
parent c9acd9b2ed
commit a9aac2124c
13 changed files with 72 additions and 64 deletions

View File

@@ -1,24 +1,29 @@
<template>
<view class="zd_content bg">
<view class="p1">欢迎来到</view>
<view class="p2">信丰天能手持系统</view>
<view class="input-box">
<input class="large-input" type="text" placeholder="请输入用户名" v-model="user">
<view class="login_content">
<view class="info-wraper">
<view class="p1">欢迎来到</view>
<view class="p2">信丰天能手持系统</view>
<view class="login-bg"></view>
</view>
<div class="input-box">
<input class="large-input" :password="!showPassword" placeholder="请输入密码" v-model="password">
<span class="iconfont icon_eye_close" :class="[showPassword ? 'icon_eye_active' : '']" @tap="changePassword">&#xe6a0;</span>
</div>
<view class="radio-box">
<view class="radio-wrap">
<span class="iconfont icon_unchecked" :class="{'icon_checked': saveUser}" @tap="toSaveUser">&#xe66b;</span>
<text class="radio-label">记住用户名</text>
<view class="form-wraper">
<view class="input-box">
<input class="large-input" type="text" placeholder="请输入用户名" v-model="user">
</view>
<text class="setup-text" @tap="setup">设置</text>
<text class="setup-text" @tap="isUpdate">升级版本</text>
<div class="input-box">
<input class="large-input" :password="!showPassword" placeholder="请输入密码" v-model="password">
<span class="iconfont icon_eye_close" :class="[showPassword ? 'icon_eye_active' : '']" @tap="changePassword">&#xe6a0;</span>
</div>
<view class="radio-box">
<view class="radio-wrap">
<span class="iconfont icon_unchecked" :class="{'icon_checked': saveUser}" @tap="toSaveUser">&#xe66b;</span>
<text class="radio-label">记住用户名</text>
</view>
<text class="setup-text" @tap="setup">设置</text>
<text class="setup-text" @tap="isUpdate">升级版本</text>
</view>
<button class="login-btn" :disabled="disabled" @tap="toLogin">确认登录</button>
<view v-if="version !== ''" class="version-name">v{{version}}</view>
</view>
<button class="login-btn" :disabled="disabled" @tap="toLogin">确认登录</button>
<view v-if="version !== ''" class="version-name">v{{version}}</view>
<Up-grade v-if="grade === true" @closeUpdate="closeUpdate" :androidUrl="androidUrl"></up-grade>
</view>
</template>
@@ -70,9 +75,9 @@
})
},
async toLogin() {
// uni.redirectTo({
// url: '/pages/home/home'
// })
uni.redirectTo({
url: '/pages/home/home'
})
this.disabled = true
if (this.user === '') {
uni.showToast({
@@ -130,12 +135,39 @@
<style lang="stylus" scoped>
@import '../../common/style/mixin.styl';
.login_content
position: relative
top 0
height: 100%
_bis('../../static/image/login_bg.png', 100%,,bottom)
background-color #fff
overflow: hidden
.info-wraper
position relative
_wh(100%, auto)
padding 190rpx 0 55rpx 0
background linear-gradient(to bottom, #fae2ca 0%, #fff5ea 20%, #fdfdfd 100%)
.p1
position relative
z-index 10
_font(40rpx,75rpx,#444,666)
padding-top: 190rpx
padding 0 40rpx
.p2
position relative
z-index 10
_font(46rpx,1,#444,600)
padding: 10rpx 0 55rpx 0
padding: 10rpx 40rpx 0 40rpx
.login-bg
position: absolute
z-index: 1
_wh(80%, 100%)
right 0
bottom 0
opacity: 0.3
_bis('../../static/image/bg.png', 100%,,bottom)
.form-wraper
width 100%
padding 0 40rpx
.input-box
_fj()
margin-top 68rpx
@@ -159,22 +191,11 @@
.setup-text
_font(28rpx, 28rpx,$red,,right)
padding-left 25rpx
.bg
background-color: #fff;
_bis('../../static/image/login_bg.png', 100%,,bottom)
.login-btn
width 100%
border-radius 46rpx
_font(36rpx,92rpx,#fff,,center)
background-color $red
.zd_content
position: relative
top 0
height: 100%
padding-left 40rpx
padding-right 40rpx
background-color: #fff
overflow: hidden
.version-name
width 100%
position: absolute