This commit is contained in:
parent
4bc97b35fd
commit
25acfbeb91
|
|
@ -46,6 +46,30 @@
|
||||||
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/yhj.png" mode=""></image>
|
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/yhj.png" mode=""></image>
|
||||||
<text>恭喜获得优惠券</text>
|
<text>恭喜获得优惠券</text>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="towcontenthereimage flex-colum">
|
||||||
|
<view class="towcontenthereimageone">
|
||||||
|
<text style="font-size:28rpx; color: #FF7C0D;">¥</text>
|
||||||
|
30.00
|
||||||
|
</view>
|
||||||
|
<view class="towcontenthereimagetow">
|
||||||
|
通用红包券
|
||||||
|
</view>
|
||||||
|
<view class="towcontenthereimagethere">
|
||||||
|
有效至 2024 07 11
|
||||||
|
</view>
|
||||||
|
<view class="towcontenthereimagefour">
|
||||||
|
限时红包变大 快来领取
|
||||||
|
</view>
|
||||||
|
<view class="towcontenthereimagefive flex-between">
|
||||||
|
<view class="towcontenthereimagefiveone">
|
||||||
|
我在想想
|
||||||
|
</view>
|
||||||
|
<view class="towcontenthereimagefivetow">
|
||||||
|
马上翻倍
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -215,6 +239,7 @@
|
||||||
|
|
||||||
.towcontentow {
|
.towcontentow {
|
||||||
margin-top: 16rpx;
|
margin-top: 16rpx;
|
||||||
|
|
||||||
.towcontentow_O {
|
.towcontentow_O {
|
||||||
font-family: PingFang SC, PingFang SC;
|
font-family: PingFang SC, PingFang SC;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
|
@ -229,24 +254,100 @@
|
||||||
color: #333333;
|
color: #333333;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.towcontenthere{
|
|
||||||
|
.towcontenthere {
|
||||||
margin-top: 32rpx;
|
margin-top: 32rpx;
|
||||||
border-top: 1rpx dashed #E5E5E5;
|
border-top: 1rpx dashed #E5E5E5;
|
||||||
.towcontentherebox{
|
|
||||||
margin-top: 32rpx;
|
.towcontentherebox {
|
||||||
image{
|
margin-top: 48rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
width: 38.48rpx;
|
width: 38.48rpx;
|
||||||
height: 38.42rpx;
|
height: 38.42rpx;
|
||||||
}
|
}
|
||||||
text{
|
|
||||||
|
text {
|
||||||
|
margin-left: 16rpx;
|
||||||
font-family: PingFang SC, PingFang SC;
|
font-family: PingFang SC, PingFang SC;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
color: #333333;
|
color: #333333;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.towcontenthereimage{
|
|
||||||
|
.towcontenthereimage {
|
||||||
|
margin-top: 48rpx;
|
||||||
|
width: 540rpx;
|
||||||
|
height: 498rpx;
|
||||||
|
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/yhjs.png) no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
justify-content: flex-start;
|
||||||
|
|
||||||
|
.towcontenthereimageone {
|
||||||
|
margin-top: 54rpx;
|
||||||
|
font-family: Roboto, Roboto;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 48rpx;
|
||||||
|
color: #FF7C0D;
|
||||||
|
}
|
||||||
|
|
||||||
|
.towcontenthereimagetow {
|
||||||
|
margin-top: 28rpx;
|
||||||
|
width: 184rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
line-height: 40rpx;
|
||||||
|
text-align: center;
|
||||||
|
background: rgba(255, 219, 151, 0.33);
|
||||||
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||||
|
font-family: PingFang SC, PingFang SC;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #C7620E;
|
||||||
|
}
|
||||||
|
|
||||||
|
.towcontenthereimagethere {
|
||||||
|
margin-top: 8rpx;
|
||||||
|
font-family: PingFang SC, PingFang SC;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.towcontenthereimagefour {
|
||||||
|
margin-top: 74rpx;
|
||||||
|
font-family: PingFang SC, PingFang SC;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.towcontenthereimagefive {
|
||||||
|
margin-top: 40rpx;
|
||||||
|
|
||||||
|
.towcontenthereimagefiveone {
|
||||||
|
padding: 12rpx 28rpx;
|
||||||
|
background: #FFF6D8;
|
||||||
|
border-radius: 46rpx 46rpx 46rpx 46rpx;
|
||||||
|
border: 2rpx solid #FFE18F;
|
||||||
|
font-family: PingFang SC, PingFang SC;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.towcontenthereimagefivetow {
|
||||||
|
margin-left: 16rpx;
|
||||||
|
padding: 12rpx 28rpx;
|
||||||
|
font-family: PingFang SC, PingFang SC;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(178deg, #FFFF81 0%, rgba(255, 76, 59, 0.56) 100%);
|
||||||
|
box-shadow: 0rpx 4rpx 6rpx 2rpx rgba(222, 91, 43, 0.65);
|
||||||
|
border-radius: 46rpx 46rpx 46rpx 46rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,13 @@
|
||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
<view class="user-info-wrap">
|
<view class="user-info-wrap">
|
||||||
<view style="width: 36px; height: 36px;border-radius: 10rpx;">
|
<view style="width: 108rpx; height: 108rpx;border-radius: 50%;">
|
||||||
<button open-type="chooseAvatar" @chooseavatar='onChooseAvatar'
|
<button open-type="chooseAvatar" @chooseavatar='onChooseAvatar'
|
||||||
style="padding: 0;margin: 0; width: 36px; height: 36px;border-radius: 10rpx;">
|
style="padding: 0;margin: 0; width: 108rpx; height: 108rpx;border-radius: 50%;">
|
||||||
<image style="width: 36px; height: 36px;" v-if="userInfo.avatar" :src="userInfo.avatar"
|
<image style="width: 108rpx; height: 108rpx;" v-if="userInfo.avatar" :src="userInfo.avatar"
|
||||||
mode="aspectFill">
|
mode="aspectFill">
|
||||||
</image>
|
</image>
|
||||||
<image style="width: 36px; height: 36px;" v-else src="@/static/avatar.png" mode="aspectFill">
|
<image style="width: 108rpx; height: 108rpx;" v-else src="@/static/avatar.png" mode="aspectFill">
|
||||||
</image>
|
</image>
|
||||||
</button>
|
</button>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -15,64 +15,18 @@
|
||||||
<text class="phone">{{userInfo.telephone || '无'}}</text>
|
<text class="phone">{{userInfo.telephone || '无'}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="card">
|
<view class="userinfoone">
|
||||||
<view class="header-wrap">
|
<view class="userinfoonebox">
|
||||||
<view class="header">
|
<view class="userinfooneboxitem flex-between">
|
||||||
<text class="title">我的订单</text>
|
<view class="userinfooneboxitemleft flex-start">
|
||||||
<view class="more" @click="orderHandle(1)">
|
<image src="@/static/ewm.png" mode="aspectFill"></image>
|
||||||
<text class="t">全部订单</text>
|
<text>优惠券</text>
|
||||||
<u-icon name="arrow-right" color="#999" size="24"></u-icon>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
<u-icon name="arrow-right" color="#575B66" size="28"></u-icon>
|
||||||
</view>
|
|
||||||
<view class="order-menu">
|
|
||||||
<view class="item" @click="orderHandle(2)">
|
|
||||||
<image class="icon" src="@/static/user/user_icon1.png" mode="aspectFit"></image>
|
|
||||||
<text class="t">待付款</text>
|
|
||||||
</view>
|
|
||||||
<view class="item" @click="orderHandle(3)">
|
|
||||||
<image class="icon" src="@/static/user/user_icon2.png" mode="aspectFit"></image>
|
|
||||||
<text class="t">待发货</text>
|
|
||||||
</view>
|
|
||||||
<view class="item" @click="orderHandle(4)">
|
|
||||||
<image class="icon" src="@/static/user/user_icon3.png" mode="aspectFit"></image>
|
|
||||||
<text class="t">已完成</text>
|
|
||||||
</view>
|
|
||||||
<view class="item" @click="orderHandle(5)">
|
|
||||||
<image class="icon" src="@/static/user/user_icon4.png" mode="aspectFit"></image>
|
|
||||||
<text class="t">退款</text>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="card">
|
|
||||||
<view class="header-wrap">
|
|
||||||
<view class="header">
|
|
||||||
<text class="title">更多服务</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="order-menu">
|
|
||||||
<navigator class="item" hover-class="none" url="/pages/order/successful">
|
|
||||||
<!-- <image class="icon" src="@/static/user_icon5.png" mode="aspectFit"></image> -->
|
|
||||||
<text class="t">优惠券</text>
|
|
||||||
</navigator>
|
|
||||||
<view class="item">
|
|
||||||
<!-- <image class="icon" src="@/static/user_icon6.png" mode="aspectFit"></image> -->
|
|
||||||
<text class="t">寄存记录</text>
|
|
||||||
</view>
|
|
||||||
<view class="item">
|
|
||||||
<!-- <image class="icon" src="@/static/user_icon7.png" mode="aspectFit"></image> -->
|
|
||||||
<text class="t">储值明细</text>
|
|
||||||
</view>
|
|
||||||
<view class="item">
|
|
||||||
<!-- <image class="icon" src="@/static/user_icon8.png" mode="aspectFit"></image> -->
|
|
||||||
<text class="t">设置</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="version-wrap">
|
|
||||||
<!-- <text class="t">版本号:2.0.0</text> -->
|
|
||||||
<text class="t">陕西超掌柜科技有限公司</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -147,22 +101,13 @@
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.user-info-wrap {
|
.user-info-wrap {
|
||||||
padding: $paddingSize + 20upx $paddingSize;
|
position: relative;
|
||||||
|
padding: 48rpx 32rpx 88rpx 32rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 750rpx;
|
width: 750rpx;
|
||||||
height: 280rpx;
|
|
||||||
background: #FFD158;
|
background: #FFD158;
|
||||||
border-radius: 0rpx 0rpx 40rpx 0rpx;
|
border-radius: 0rpx 0rpx 40rpx 0rpx;
|
||||||
|
|
||||||
.avatar {
|
|
||||||
$size: 120upx;
|
|
||||||
width: $size;
|
|
||||||
height: $size;
|
|
||||||
border-radius: 50%;
|
|
||||||
border: 2px solid #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.info {
|
.info {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding-left: $paddingSize;
|
padding-left: $paddingSize;
|
||||||
|
|
@ -182,63 +127,49 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.card {
|
.user-info-wrap::after {
|
||||||
border-radius: 20upx;
|
position: absolute;
|
||||||
background-color: #fff;
|
content: '';
|
||||||
margin-bottom: $paddingSize;
|
bottom:40rpx;
|
||||||
|
right: 0;
|
||||||
.header-wrap {
|
width: 40rpx;
|
||||||
padding: 0 $paddingSize;
|
height: 40rpx;
|
||||||
}
|
line-height: 40rpx;
|
||||||
|
text-align: center;
|
||||||
.header {
|
background-image: radial-gradient(40rpx at 0px 0px, rgba(0, 0, 0, 0) 40rpx, #fff 40rpx);
|
||||||
padding: 38upx 0;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
border-bottom: 1upx solid #f2f2f2;
|
|
||||||
|
|
||||||
.more {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.t {
|
|
||||||
color: #999;
|
|
||||||
margin-right: 8upx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.order-menu {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.item {
|
|
||||||
flex: 1;
|
|
||||||
padding: 38upx 0;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
$size: 68upx;
|
|
||||||
width: $size;
|
|
||||||
height: $size;
|
|
||||||
}
|
|
||||||
|
|
||||||
.t {
|
|
||||||
padding-top: 20upx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
.userinfoone{
|
||||||
.version-wrap {
|
position: relative;
|
||||||
padding: 100upx 0;
|
padding: 48rpx 28rpx;
|
||||||
display: flex;
|
width:100%;
|
||||||
flex-direction: column;
|
top: -40rpx;
|
||||||
align-items: center;
|
background: #F6F6F6;
|
||||||
|
border-radius: 40rpx 0 0rpx 0rpx;
|
||||||
.t {
|
.userinfoonebox{
|
||||||
color: #999;
|
padding: 32rpx 20rpx 32rpx 52rpx;
|
||||||
|
border-radius: 22rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
width: 100%;
|
||||||
|
.userinfooneboxitem{
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
.userinfooneboxitemleft{
|
||||||
|
image{
|
||||||
|
width: 41.33rpx;
|
||||||
|
height:36.9rpx;
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
margin-left: 32rpx;
|
||||||
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.userinfooneboxitem:nth-child(1){
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
Reference in New Issue