修改
1
App.vue
@ -17,6 +17,7 @@
|
||||
.app {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: justify;
|
||||
color: #000000;
|
||||
}
|
||||
</style>
|
||||
@ -5,12 +5,142 @@
|
||||
我的
|
||||
</view>
|
||||
<image src="../../static/pages/userbanner.png" mode="" class="userbanner"></image>
|
||||
<image src="../../static/pages/headsculpture.png" mode="" class="headsculpture"></image>
|
||||
<view class="name">
|
||||
<image src="../../static/headsculpture.png" mode="" class="headsculpture"></image>
|
||||
<view class="namesigning">
|
||||
<span class="name">
|
||||
张三
|
||||
</view>
|
||||
</span>
|
||||
<view class="signing">
|
||||
|
||||
未签约
|
||||
</view>
|
||||
</view>
|
||||
<view class="phone">
|
||||
17869283647
|
||||
</view>
|
||||
<view class="switch btn">
|
||||
切换家庭成员
|
||||
</view>
|
||||
<view class="manage btn">
|
||||
管理家庭成员
|
||||
</view>
|
||||
<view class="Threecategories">
|
||||
<view class="item">
|
||||
<view class="number">
|
||||
0
|
||||
</view>
|
||||
<view class="text">
|
||||
行为积分
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="number">
|
||||
0
|
||||
</view>
|
||||
<view class="text">
|
||||
健康豆
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="number">
|
||||
0
|
||||
</view>
|
||||
<view class="text">
|
||||
优惠券
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="myorder">
|
||||
<view class="title">
|
||||
我的订单
|
||||
</view>
|
||||
<view class="righttitle">
|
||||
查看全部
|
||||
<image src="../../static/huijiantou.png" mode=""></image>
|
||||
</view>
|
||||
<view class="orderStatus">
|
||||
<view class="item">
|
||||
<image src="../../static/pages/daifukuan.png" mode=""></image>
|
||||
<view class="text">
|
||||
待付款
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<image src="../../static/pages/daishouhuo.png" mode=""></image>
|
||||
<view class="text">
|
||||
待收货
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<image src="../../static/pages/daipingjia.png" mode=""></image>
|
||||
<view class="text">
|
||||
待评价
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<image src="../../static/pages/yiwancheng.png" mode=""></image>
|
||||
<view class="text">
|
||||
已完成
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="myorder">
|
||||
<view class="title">
|
||||
常用功能
|
||||
</view>
|
||||
<view class="orderStatus">
|
||||
<view class="item">
|
||||
<image src="../../static/pages/jiankangdangan.png" mode=""></image>
|
||||
<view class="text">
|
||||
健康档案
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<image src="../../static/pages/wodeyuyue.png" mode=""></image>
|
||||
<view class="text">
|
||||
我的预约
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<image src="../../static/pages/fuwupingjia.png" mode=""></image>
|
||||
<view class="text">
|
||||
服务评价
|
||||
</view>
|
||||
</view>
|
||||
<view class="item"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="myorder titles">
|
||||
<view class="title">
|
||||
护理服务订单
|
||||
</view>
|
||||
<view class="righttitle">
|
||||
<image src="../../static/huijiantou.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="myorder titles">
|
||||
<view class="title">
|
||||
专家咨询订单
|
||||
</view>
|
||||
<view class="righttitle">
|
||||
<image src="../../static/huijiantou.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="myorder titles">
|
||||
<view class="title">
|
||||
签约信息
|
||||
</view>
|
||||
<view class="righttitle">
|
||||
<image src="../../static/huijiantou.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="myorder titles">
|
||||
<view class="title">
|
||||
退出登录
|
||||
</view>
|
||||
<view class="righttitle">
|
||||
<image src="../../static/huijiantou.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -28,28 +158,159 @@
|
||||
|
||||
<style lang="scss">
|
||||
.app {
|
||||
.titles {
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
.myorder {
|
||||
position: relative;
|
||||
|
||||
.orderStatus {
|
||||
text-align: center;
|
||||
margin: 60rpx auto 30rpx;
|
||||
width: 90%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding-bottom: 30rpx;
|
||||
|
||||
.item {
|
||||
width: 25%;
|
||||
|
||||
.text {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 70rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.righttitle {
|
||||
font-size: 26rpx;
|
||||
color: #969494;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 5rpx;
|
||||
|
||||
image {
|
||||
vertical-align: middle;
|
||||
padding-left: 20rpx;
|
||||
width: 13rpx;
|
||||
height: 23rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 30rpx;
|
||||
font-size: 32rpx;
|
||||
color: #4B4B4B;
|
||||
}
|
||||
}
|
||||
|
||||
.topbanner {
|
||||
width: 100%;
|
||||
height: 450rpx;
|
||||
height: 430rpx;
|
||||
position: relative;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 50rpx;
|
||||
|
||||
.Threecategories {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding-bottom: 30rpx;
|
||||
|
||||
.item {
|
||||
width: 33%;
|
||||
text-align: center;
|
||||
|
||||
.text {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.number {
|
||||
font-size: 36rpx;
|
||||
padding-bottom: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
right: 2%;
|
||||
width: 170rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
background: #51b9a0;
|
||||
border-radius: 5rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.manage {
|
||||
position: absolute;
|
||||
top: 54%;
|
||||
right: 2%;
|
||||
}
|
||||
|
||||
.phone {
|
||||
position: absolute;
|
||||
top: 56%;
|
||||
left: 30%;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.namesigning {
|
||||
position: absolute;
|
||||
top: 38%;
|
||||
left: 30%;
|
||||
|
||||
.name {
|
||||
display: inline-block;
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.signing {
|
||||
text-align: center;
|
||||
margin-left: 30rpx;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
display: inline-block;
|
||||
width: 90rpx;
|
||||
background: #FFFFFF;
|
||||
border: 2rpx solid #FFA115;
|
||||
border-radius: 5rpx;
|
||||
font-size: 22rpx;
|
||||
color: #FFA115;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.title {
|
||||
position: absolute;
|
||||
top: 20%;
|
||||
top: 15%;
|
||||
left: 0%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.headsculpture {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 8%;
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
top: 35%;
|
||||
left: 5%;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
}
|
||||
|
||||
.userbanner {
|
||||
|
||||
BIN
static/huijiantou.png
Normal file
|
After Width: | Height: | Size: 316 B |
BIN
static/pages/daifukuan.png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
static/pages/daipingjia.png
Normal file
|
After Width: | Height: | Size: 1.0 KiB |
BIN
static/pages/daishouhuo.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
static/pages/fuwupingjia.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
static/pages/jiankangdangan.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
static/pages/wodeyuyue.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
static/pages/yiwancheng.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |