Skip to content

蒋秀川 / miniProject

Go to a project
Commit 36efd0d4 by 李君
Options

小程序优化

1 parent 62ace672
Inline Side-by-side
Showing 6 changed files with 244 additions and 258 deletions
miniProject/app.wxss
......@@ -7,6 +7,11 @@ page{
background-color: #efeff4;
--tabs-bottom-bar-color:#1972F5;
}
.backgroundColor{
padding: 0 28rpx;
width: 100%;
background: linear-gradient(154deg, #C7D3FF 0%, #E9F9FF 48%, #FFFFFF 100%);
}
.van-picker__confirm{
color: #000!important;
}
......
miniProject/components/navbar/index.wxss
.navbar {
width: 100%;
overflow: hidden;
position: fixed;
top: 0;
left: 0;
z-index: 10;
flex-shrink: 0;
}
.navbar-home-title {
font-size: 40rpx;
color: #fff;
position: absolute;
left: 46rpx;
z-index: 10;
overflow: hidden;
}
.navbar-home-title1 {
font-size: 40rpx;
color: #fff;
margin-left: 20rpx;
}
.navbar-title {
width: 100%;
box-sizing: border-box;
padding-left: 80px;
padding-right: 90px;
height: 32px;
line-height: 32px;
text-align: center;
position: absolute;
left: 0;
z-index: 10;
color: #333;
font-size: 20px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.navbar-title1 {
height: 32px;
line-height: 32px;
text-align: center;
position: absolute;
left: 0;
z-index: 10;
color: #333;
font-size: 20px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.home-icon {
display: flex;
margin-top: 16rpx;
}
.navbar-action-wrap {
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
position: absolute;
right: 190rpx;
z-index: 11;
line-height: 1;
}
.navbar-action_item {
padding: 3px 0;
color: #333;
}
.navbar-action-group .navbar-action_item {
border-right: 1px solid #f0f0f0;
padding: 3px 14px;
}
.navbar-action-group .last {
border-right: none;
}
.home-left-icon {
display: flex;
margin-top: 7px;
}
.home-left-icon .item {
font-size: 12px;
margin-right: 10px;
}
.back {
position: absolute;
left: 35rpx;
z-index: 999;
display: flex;
align-items: center;
}
.back image {
width: 36rpx;
height: 36rpx;
}
\ No newline at end of file
width: 100%;
overflow: hidden;
position: fixed;
top: 0;
left: 0;
z-index: 10;
flex-shrink: 0;
}
.navbar-home-title {
font-size: 36rpx;
color: #fff;
position: absolute;
left: 46rpx;
z-index: 10;
overflow: hidden;
font-weight: 500;
font-size: 36rpx;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.navbar-home-title1 {
font-size: 32rpx;
color: #fff;
margin-left: -45rpx;
width: calc(100% - 19rpx);
text-align: center;
}
.navbar-title {
width: 100%;
box-sizing: border-box;
padding-left: 80px;
padding-right: 90px;
height: 32px;
line-height: 32px;
text-align: center;
position: absolute;
left: 0;
z-index: 10;
color: #333;
font-size: 20px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.navbar-title1 {
height: 32px;
line-height: 32px;
text-align: center;
position: absolute;
left: 0;
z-index: 10;
color: #333;
font-size: 20px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.home-icon {
display: flex;
margin-top: 16rpx;
}
.navbar-action-wrap {
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
position: absolute;
right: 190rpx;
z-index: 11;
line-height: 1;
}
.navbar-action_item {
padding: 3px 0;
color: #333;
}
.navbar-action-group .navbar-action_item {
border-right: 1px solid #f0f0f0;
padding: 3px 14px;
}
.navbar-action-group .last {
border-right: none;
}
.home-left-icon {
display: flex;
margin-top: 7px;
}
.home-left-icon .item {
font-size: 12px;
margin-right: 10px;
}
.back {
position: absolute;
left: 35rpx;
z-index: 999;
display: flex;
align-items: center;
width: 100%;
}
.back image {
width: 36rpx;
height: 36rpx;
}
\ No newline at end of file
miniProject/pages/editPwd/editPwd.wxml
<view class="container" style="padding-top: {{navHeight}}px;height:{{windowHeight}}px;">
<navbar
<navbar
page-name="修改密码"
bg-color="#fff"
navbar-color="rgba(0, 0, 0, .85)"
......@@ -38,6 +38,7 @@
bind:change='inputBlur3'
/>
</van-cell-group>
<text class="tips">密码不小于八位且包含大小写字母、数字、特殊符号</text>
<view style="margin-top: 20rpx;">
<view class="btn">
<van-button color="#1A77FF" round block type="primary" bindtap="onSubmit">确定 </van-button>
......
miniProject/pages/editPwd/editPwd.wxss
/* pages/editPwd.wxss */
.zong-content{
.zong-content {
width: 100%;
margin-top: 50rpx;
padding: 10rpx 30rpx;
}
.tips {
color: rgba(0, 0, 0, 0.65);
font-size: 24rpx;
}
\ No newline at end of file
miniProject/pages/me/index.wxml
<view class="container" style="padding-top: {{navHeight}}px;height:{{windowHeight}}px">
<navbar
page-name=""
bg-color="#0268FF"
navbar-color="#fff"
>
<navbar page-name="我的" bg-color="#C7D3FF" navbar-color="#000">
</navbar>
<view class="header">
<image src="../../images/me/avatar.png" class="avatar" />
<view class="name">
<view class="username">{{name}}</view>
<view class="company">{{accountName}}</view>
<view class="~backgroundColor">
<view class="header">
<image src="../../images/me/avatar.png" class="avatar" />
<view class="name">
<view class="username">{{name}}</view>
<view class="company">{{userForm.roles}}</view>
</view>
</view>
</view>
<view class="zong-content">
<van-form>
<van-cell-group>
<van-field
value="{{userForm.loginName}}"
name="用户名"
label="用户名"
placeholder="用户名"
disabled
/>
<van-field
value="{{userForm.realName}}"
name="姓名"
label="姓名"
placeholder="姓名"
bind:change='inputBlur'
/>
<van-field
value="{{userForm.tel}}"
name="电话号码"
label="电话号码"
placeholder="电话号码"
bind:change='inputBlur2'
/>
<van-field
value="{{userForm.email}}"
name="邮箱"
label="邮箱"
placeholder="邮箱"
bind:change='inputBlur3'
/>
<van-field
value="{{userForm.roles}}"
name="角色权限"
label="角色权限"
placeholder="角色权限"
disabled
/>
</van-cell-group>
<view style="margin-top: 20rpx;">
<view class="btn">
<van-button color="#1A77FF" round block type="primary" bindtap="onSubmit">修改 </van-button>
</view>
<view class="btn">
<van-button color="#1A77FF" round block type="primary" bindtap="undatePwd">修改密码 </van-button>
</view>
<view class="btn">
<van-button color="#1A77FF" round block type="primary" bindtap="logout">退出登录 </van-button>
</view>
<view class="zong-content">
<van-form>
<van-cell-group>
<van-field value="{{userForm.realName}}" class="vanField" name="姓名" label="姓名" label-class='label' input-class='input' placeholder="姓名" bind:change='inputBlur' right-icon="edit" right-icon-class='editClass' />
<van-field class="vanField" value="{{userForm.tel}}" name="电话号码" label-class='label' input-class='input' label="电话号码" placeholder="电话号码" bind:change='inputBlur2' right-icon="edit" right-icon-class='editClass' />
<van-field border="{{ false }}" class="vanField" value="{{userForm.email}}" name="邮箱" label-class='label' input-class='input' label="邮箱" placeholder="邮箱" bind:change='inputBlur3' right-icon="edit" right-icon-class='editClass' />
</van-cell-group>
</van-form>
</view>
<view class="items">
<view class="item" bindtap="undatePwd">
<text>修改密码</text>
<image src="../../images/arrow-r.png" class="arrow" />
</view>
<view class="item logout" bindtap="logout">
<text>退出登录</text>
<image src="../../images/arrow-r.png" class="arrow" />
</view>
</van-form>
<!-- <view
wx:for="{{menuItems}}"
wx:for-index="index"
wx:for-item="n"
wx:key="index"
class="item"
bindtap="goOtherPage"
data-value="{{n}}"
>
<image src="{{ '../../images/me/' + n.icon + '.png' }}" class="img" />
<view>{{n.name}}</view>
<image src="../../images/arrow-r.png" class="arrow" />
</view> -->
</view>
<view class="btn">
<van-button color="#597BFF" round block type="primary" bindtap="onSubmit">提交</van-button>
</view>
</view>
</view>
\ No newline at end of file
miniProject/pages/me/index.wxss
/* pages/me/index.wxss */
.header {
width: 100%;
height: 200rpx;
background-color: #0268FF;
box-sizing: border-box;
padding: 12rpx 56rpx 0;
display: flex;
align-items: center;
width: 100%;
height: 224rpx;
background-color: #fff;
border-radius: 16rpx;
box-sizing: border-box;
margin-top: 40rpx;
padding: 12rpx 0rpx 0 50rpx;
display: flex;
align-items: center;
}
.header .avatar {
width: 128rpx;
height: 128rpx;
margin-right: 32rpx;
width: 160rpx;
height: 160rpx;
border-radius: 50%;
margin-right: 32rpx;
}
.header .name {
font-size: 32rpx;
color: #fff;
font-family: PingFangSC-Medium, PingFang SC;
color: #000;
}
.header .username {
font-size: 32rpx;
line-height: 40rpx;
margin-bottom: 12rpx;
font-weight: 500;
font-size: 40rpx;
line-height: 40rpx;
margin-bottom: 12rpx;
}
.header .company {
text-align: center;
box-sizing: border-box;
padding: 0 12rpx;
height: 46rpx;
line-height: 46rpx;
border-radius: 25rpx;
color: rgba(255, 255, 255, .8);
background-color: rgba(9, 109, 217, .5);
border: 2rpx solid rgba(171, 225, 255, .5);
font-size: 24rpx;
text-align: center;
box-sizing: border-box;
height: 40rpx;
line-height: 40rpx;
color: rgba(0, 0, 0, 0.55);
font-size: 28rpx;
}
.btn{
margin-top: 20rpx;
}
.logout {
width: calc(100% - 72rpx);
height: 90rpx;
background-color: #1A77FF;
border-radius: 90rpx;
text-align: center;
line-height: 90rpx;
color: #fff;
position: absolute;
left: 36rpx;
bottom: 72rpx;
.btn {
margin-top: 30rpx;
}
.zong-content {
width: 100%;
height: 100%;
overflow-y: scroll;
box-sizing: border-box;
padding: 18rpx 28rpx;
padding: 10rpx 0;
width: 100%;
height: 324rpx;
margin-top: 24rpx;
border-radius: 16rpx;
background-color: #fff;
}
.zong-content .item {
width: 100%;
height: 118rpx;
background-color: #fff;
border-radius: 18rpx;
display: flex;
align-items: center;
margin-bottom: 16rpx;
color: rgba(0, 0, 0, .85);
font-size: 28rpx;
box-sizing: border-box;
padding: 0 38rpx 0 32rpx;
position: relative;
.label {
color: rgba(0, 0, 0, 0.9) !important;
font-size: 28rpx;
height: 66rpx;
line-height: 66rpx;
/* padding: 5px; */
}
.zong-content .item .img {
width: 57rpx;
height: 57rpx;
border-radius: 10rpx;
.input {
color: rgba(0, 0, 0, 0.7) !important;
font-size: 28rpx;
}
.editClass{
color: #597BFF;
font-size: 32rpx !important;
font-weight: 600 !important;
right: 25rpx;
}
.vanField .van-field__body{
height: 66rpx;
line-height: 66rpx;
}
.zong-content .item .arrow {
position: absolute;
right: 38rpx;
top: 50rpx;
color: rgba(0, 0, 0, .1);
width: 24rpx;
height: 24rpx;
.items{
margin-top: 24rpx;
border-radius: 16rpx;
background-color: #fff;
padding: 5px 10rpx 5rpx 23rpx;
}
.items .item {
width: 100%;
height: 100rpx;
display: flex;
align-items: center;
color: rgba(0,0,0,0.9);
font-size: 28rpx;
box-sizing: border-box;
padding: 0 23rpx 0 17rpx;
position: relative;
border-bottom: 1rpx solid #E1E1E1;
}
.items .logout{
border-width: 0;
}
.items .item .arrow {
position: absolute;
right: 38rpx;
color: rgba(0, 0, 0, .2);
width: 24rpx;
height: 24rpx;
}
\ No newline at end of file
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!