Skip to content

U
user
Commit 7c5d6d65 by weijiguang
Options

优化订单UI

parent 5e7d1237
Showing with 162 additions and 124 deletions
orderSubPackage/pages/orderInfo/index.vue
...@@ -4,8 +4,7 @@ ...@@ -4,8 +4,7 @@
<u-icon @click="goBack" name="arrow-left" color="#000000" size="20"></u-icon> <u-icon @click="goBack" name="arrow-left" color="#000000" size="20"></u-icon>
<view class="tabTitle" :style="{'line-height':navigationBarHeight+'px'}">订单详情</view> <view class="tabTitle" :style="{'line-height':navigationBarHeight+'px'}">订单详情</view>
</view> </view>
<div class="order_status" :style="{'margin-top':(statusBarHeight+navigationBarHeight+getPx(32))+'px'}">
<div class="order_status" :style="{'margin-top':(statusBarHeight+navigationBarHeight+13)+'px'}">
<view class="status_text">订单状态：{{ orderStatusText }}</view> <view class="status_text">订单状态：{{ orderStatusText }}</view>
<view class="tips"> <view class="tips">
<view v-if="orderInfo.state == 7">为保持口感，请尽快引用哦~</view> <view v-if="orderInfo.state == 7">为保持口感，请尽快引用哦~</view>
...@@ -22,22 +21,18 @@ ...@@ -22,22 +21,18 @@
<div class="order_flow" v-if="qrShow"> <div class="order_flow" v-if="qrShow">
<div v-if="qrShow" class="code">取单码 {{ orderInfo.orderNum }}</div> <div v-if="qrShow" class="code">取单码 {{ orderInfo.orderNum }}</div>
<div class="realQrcodeBox" v-if="qrShow&&isBuild"> <div class="realQrcodeBox" v-if="qrShow&&isBuild">
<image mode="aspectFit" :src="ewmImg" class="qr_real"></image> <image mode="aspectFit" :src="ewmImg"/>
</div> </div>
<div v-if="qrShow&&!isBuild" class="qr_code" > <div v-if="qrShow&&!isBuild" class="qr_code" >
<image mode="aspectFit" :src="'/static/imgs/erweimazhedang.png'" class="qr"></image> <image mode="aspectFit" :src="'/static/imgs/erweimazhedang.png'" class="qr" />
</div> </div>
<view class="status_text">——制作完成后才能扫哦——</view> <view class="scan_tips" v-if="qrTextShow">——制作完成后才能扫哦——</view>
<canvas v-if="qrShow" class="canvas-code" canvas-id="myQrcode" <canvas v-if="qrShow" class="canvas-code" canvas-id="myQrcode" style="background:#fff;width: 200px;height: 200px; display:block; left:-800rpx;position:absolute;" />
style="background:#fff;width: 200px;height: 200px; display:block; left:-800rpx;position:absolute;" />
<div v-if="qrShow" class="flow_describe"> <div v-if="qrShow" class="flow_describe">
<view class="title">扫码流程</view> <view class="title">扫码流程</view>
<image :mode="'aspectFit'" class="flow_img" src="/static/imgs/saomaliucheng.png"></image> <image :mode="'aspectFit'" class="flow_img" src="/static/imgs/saomaliucheng.png" />
</div> </div>
</div> </div>
<div class="shop_info"> <div class="shop_info">
<div class="address"> <div class="address">
<div class="address_1">{{ orderInfo.shop.name }}</div> <div class="address_1">{{ orderInfo.shop.name }}</div>
...@@ -46,10 +41,8 @@ ...@@ -46,10 +41,8 @@
<div v-for="item in orderInfo.orderDetails" :key="item.id"> <div v-for="item in orderInfo.orderDetails" :key="item.id">
<div class="goods"> <div class="goods">
<div class="goods_item"> <div class="goods_item">
<image mode="aspectFit" v-if="jsonParse(item.goods.pics).thumbnailApplet" <image v-if="jsonParse(item.goods.pics).thumbnailApplet" :src="jsonParse(item.goods.pics).thumbnailApplet" class="goods_img" />
:src="jsonParse(item.goods.pics).thumbnailApplet" class="goods_img"> <image v-else :src="jsonParse(item.goods.pics).thumbnail" class="goods_img" />
</image>
<image mode="aspectFit" v-else :src="jsonParse(item.goods.pics).thumbnail" class="goods_img"></image>
<div class="goods_text"> <div class="goods_text">
<div class="goods_name"> <div class="goods_name">
<div class="name">{{ item.goodsName }}</div> <div class="name">{{ item.goodsName }}</div>
...@@ -89,18 +82,20 @@ ...@@ -89,18 +82,20 @@
<div class="order_describe"> <div class="order_describe">
<view class="title">订单信息</view> <view class="title">订单信息</view>
<div class="item"> <view class="item_cont">
<span class="label">下单时间：</span> <view class="item">
<span class="value">{{ orderInfo.createdAt }}</span> <span class="label">下单时间：</span>
</div> <span class="value">{{ orderInfo.createdAt }}</span>
<div class="item"> </view>
<span class="label">取单码号：</span> <view class="item1">
<span class="value">{{ orderInfo.orderNum }}</span> <span class="label">取单号码：</span>
</div> <span class="value">{{ orderInfo.orderNum }}</span>
<div class="item"> </view>
<span class="label">订单编号：</span> <view class="item1">
<span class="value">{{ orderInfo.orderNo }}</span> <span class="label">订单编号：</span>
</div> <span class="value">{{ orderInfo.orderNo }}</span>
</view>
</view>
</div> </div>
<div class="customer_service"> <div class="customer_service">
<button class="function_item_text" open-type="contact" bindcontact="handleContact" session-from="sessionFrom"> <button class="function_item_text" open-type="contact" bindcontact="handleContact" session-from="sessionFrom">
...@@ -108,8 +103,8 @@ ...@@ -108,8 +103,8 @@
<u-icon name="server-fill" color="#000000" size="16"></u-icon> <u-icon name="server-fill" color="#000000" size="16"></u-icon>
<span :style="{'margin-left':'16rpx'}">有疑问，联系客服</span> <span :style="{'margin-left':'16rpx'}">有疑问，联系客服</span>
</view> </view>
<view class="icno-arrow"> <view >
<image :style="{'height':'100%','width':'100%'}" :src="'../../../static/imgs/jiantouhei.png'" /> <image class="icno-arrow" :src="'../../../static/imgs/jiantouhei.png'" />
</view> </view>
</button> </button>
</div> </div>
...@@ -175,6 +170,11 @@ export default { ...@@ -175,6 +170,11 @@ export default {
} }
}, },
methods: { methods: {
getPx(rpx) {
// console.log((rpx * (wx.getSystemInfoSync().windowWidth / 750)));
// console.log(wx.getSystemInfoSync().windowWidth);
return rpx * (wx.getSystemInfoSync().windowWidth / 750);
},
goBack(){ goBack(){
uni.switchTab({ url: '/pages/order/order' }) uni.switchTab({ url: '/pages/order/order' })
}, },
...@@ -253,6 +253,9 @@ export default { ...@@ -253,6 +253,9 @@ export default {
qrShow() { qrShow() {
return ['2','3','4','5'].indexOf(this.orderInfo.state) >= 0; return ['2','3','4','5'].indexOf(this.orderInfo.state) >= 0;
}, },
qrTextShow() {
return ['2','3'].indexOf(this.orderInfo.state) >= 0;
},
// 1 未支付 // 1 未支付
// 2 已支付 // 2 已支付
// 3 支付制作中 // 3 支付制作中
...@@ -324,15 +327,18 @@ export default { ...@@ -324,15 +327,18 @@ export default {
padding-bottom: 30rpx; padding-bottom: 30rpx;
.topBar{ .topBar{
position: fixed; position: fixed;
padding:0rpx 34rpx;
width: 100%; width: 100%;
background: white; background: white;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
z-index: 9999; z-index: 9999;
padding-left: 34rpx;
// .arrow-left {
// margin-left: 20rpx;
// }
.tabTitle{ .tabTitle{
font-size: 26rpx; font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
text-align: center; text-align: center;
...@@ -345,8 +351,8 @@ export default { ...@@ -345,8 +351,8 @@ export default {
.order_status { .order_status {
// max-height: 174rpx; // max-height: 174rpx;
background: #FFFFFF; background: #FFFFFF;
margin: 32rpx 32rpx; margin: 32rpx 32rpx;
padding: 24rpx 0rpx 30rpx 0rpx; padding: 24rpx 0rpx 32rpx 0rpx;
.status_text { .status_text {
font-size: 32rpx; font-size: 32rpx;
...@@ -358,13 +364,12 @@ export default { ...@@ -358,13 +364,12 @@ export default {
.tips { .tips {
text-align: center; text-align: center;
margin-top: 19rpx; margin-top: 15rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #999999; color: #999999;
.time { .time {
font-size: 32rpx; font-size: 32rpx;
...@@ -376,7 +381,7 @@ export default { ...@@ -376,7 +381,7 @@ export default {
} }
.btns { .btns {
padding-top: 26rpx; padding-top: 28rpx;
text-align: center; text-align: center;
width: 428rpx; width: 428rpx;
display: flex; display: flex;
...@@ -415,15 +420,7 @@ export default { ...@@ -415,15 +420,7 @@ export default {
.order_flow { .order_flow {
background: #FFFFFF; background: #FFFFFF;
margin: 32rpx; margin: 32rpx;
padding-top: 55rpx; padding-top: 56rpx;
.status_text {
font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
text-align: center;
}
.code { .code {
text-align: center; text-align: center;
...@@ -431,13 +428,22 @@ export default { ...@@ -431,13 +428,22 @@ export default {
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
color: #333333; color: #333333;
padding-bottom: 20rpx;
}
.status_text {
font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
text-align: center;
} }
.qr_code { .qr_code {
height: 347rpx; height: 340rpx;
width: 353rpx; width: 354rpx;
display: block; display: block;
margin: 92rpx auto; margin: 72rpx auto;
position: relative; position: relative;
padding-bottom: 40rpx; padding-bottom: 40rpx;
margin-bottom: 0rpx; margin-bottom: 0rpx;
...@@ -446,27 +452,36 @@ export default { ...@@ -446,27 +452,36 @@ export default {
.qr { .qr {
width: 100%; width: 100%;
height: 100%; height: 100%;
vertical-align: bottom;
} }
} }
.scan_tips {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #666666;
text-align: center;
}
.realQrcodeBox{ .realQrcodeBox{
margin: 20rpx auto; margin: 0 auto;
width: 510rpx; width: 510rpx;
height: 510rpx; height: 510rpx;
image{ image{
width: 100%; width: 100%;
height: 100%; height: 100%;
vertical-align: bottom;
} }
} }
.flow_describe { .flow_describe {
height: 300rpx;
padding-left: 32rpx;
background: #FFFFFF;
border-radius: 10rpx;
padding-top: 50rpx; padding-top: 50rpx;
padding-bottom: 60rpx; padding-left: 32rpx;
padding-right: 30rpx;
padding-bottom: 58rpx;
.title { .title {
height: 40rpx;
line-height: 40rpx;
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
...@@ -474,10 +489,11 @@ export default { ...@@ -474,10 +489,11 @@ export default {
} }
.flow_img { .flow_img {
padding:36rpx 32rpx 0rpx 32rpx; padding: 18rpx 0rpx 0rpx 32rpx;
width: 590rpx; width: 592rpx;
height: 244rpx; height: 244rpx;
display: block; display: block;
vertical-align: bottom;
} }
} }
} }
...@@ -485,7 +501,7 @@ export default { ...@@ -485,7 +501,7 @@ export default {
.shop_info { .shop_info {
margin: 32rpx; margin: 32rpx;
background: #FFFFFF; background: #FFFFFF;
padding: 40rpx 30rpx 24rpx 30rpx; padding: 40rpx 30rpx 22rpx 30rpx;
h3 { h3 {
font-size: 28rpx; font-size: 28rpx;
...@@ -517,19 +533,19 @@ export default { ...@@ -517,19 +533,19 @@ export default {
} }
.goods { .goods {
padding-top: 20rpx; // padding-top: 20rpx;
.goods_item { .goods_item {
display: flex; display: flex;
align-items: center; align-items: center;
margin-top: 20rpx; margin-top: 30rpx;
} }
.goods_img { .goods_img {
height: 112rpx; height: 112rpx;
width: 112rpx; width: 112rpx;
background-color: #eee; background-color: #eee;
margin-right: 30rpx; margin-right: 24rpx;
} }
.goods_text { .goods_text {
...@@ -539,9 +555,12 @@ export default { ...@@ -539,9 +555,12 @@ export default {
.goods_name { .goods_name {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; // align-items: center;
.name { .name {
height: 40rpx;
line-height: 40rpx;
margin-top: 10rpx;
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
...@@ -549,6 +568,9 @@ export default { ...@@ -549,6 +568,9 @@ export default {
} }
.price { .price {
height: 40rpx;
line-height: 40rpx;
margin-top: 12rpx;
font-size: 28rpx; font-size: 28rpx;
font-family: Futura-Medium, Futura; font-family: Futura-Medium, Futura;
font-weight: 500; font-weight: 500;
...@@ -556,6 +578,8 @@ export default { ...@@ -556,6 +578,8 @@ export default {
} }
.psce_name { .psce_name {
height: 34rpx;
line-height: 34rpx;
margin-top: 18rpx; margin-top: 18rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
...@@ -564,16 +588,14 @@ export default { ...@@ -564,16 +588,14 @@ export default {
} }
.size { .size {
height: 34rpx;
line-height: 34rpx;
margin-top: 24rpx;
font-size: 24rpx; font-size: 24rpx;
margin-top: 18rpx;
font-family: ArialMT; font-family: ArialMT;
color: #666666; color: #666666;
} }
} }
.goods_psce {
margin-top: 10rpx;
}
} }
} }
...@@ -622,11 +644,13 @@ export default { ...@@ -622,11 +644,13 @@ export default {
align-items: center; align-items: center;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-top: 31rpx; margin-top: 32rpx;
border-top: 1rpx solid #EEEEEE; border-top: 1rpx solid #EEEEEE;
padding-top: 24rpx; padding-top: 23rpx;
.size { .size {
height: 40rpx;
line-height: 40rpx;
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
...@@ -636,14 +660,17 @@ export default { ...@@ -636,14 +660,17 @@ export default {
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
.paid_in { .paid_in {
height: 40rpx;
line-height: 40rpx;
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #333333; color: #333333;
line-height: 44rpx;
} }
.money { .money {
height: 48rpx;
line-height: 50rpx;
vertical-align: top; vertical-align: top;
font-size: 36rpx; font-size: 36rpx;
font-family: Futura-Medium, Futura; font-family: Futura-Medium, Futura;
...@@ -656,8 +683,8 @@ export default { ...@@ -656,8 +683,8 @@ export default {
.order_describe { .order_describe {
background: #fff; background: #fff;
padding: 26rpx 31rpx; padding: 24rpx 30rpx 24rpx 32rpx;
margin: 32rpx; margin: 30rpx 32rpx 32rpx 32rpx;
.title { .title {
font-size: 28rpx; font-size: 28rpx;
...@@ -665,33 +692,45 @@ export default { ...@@ -665,33 +692,45 @@ export default {
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
line-height: 40rpx; line-height: 40rpx;
height: 40rpx;
border-bottom: 1rpx solid #ECECEC; border-bottom: 1rpx solid #ECECEC;
padding-bottom: 24rpx; padding-bottom: 24rpx;
} }
.item_cont {
padding-top: 6rpx;
}
.item1,
.item { .item {
margin-top: 20rpx; margin-top: 20rpx;
line-height: 34rpx;
.label { .label {
font-size: 24rpx; font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #999999; color: #999999;
line-height: 34rpx;
height: 34rpx;
} }
.value { .value {
font-size: 24rpx; font-size: 24rpx;
font-family: ArialMT; font-family: ArialMT;
color: #666666; color: #666666;
line-height: 28rpx;
height: 28rpx;
} }
} }
.item1 {
margin-top: 18rpx;
}
} }
.customer_service { .customer_service {
height: 90rpx; height: 90rpx;
line-height: 90rpx; line-height: 90rpx;
background: #FFFFFF; background: #FFFFFF;
font-weight: 500; font-weight: 400;
color: #000000; color: #000000;
padding: 0rpx 31rpx; padding: 0rpx 31rpx;
margin: 32rpx; margin: 32rpx;
...@@ -712,8 +751,8 @@ export default { ...@@ -712,8 +751,8 @@ export default {
align-items: center; align-items: center;
} }
.icno-arrow{ .icno-arrow{
width: 9rpx; width: 9.27rpx;
height: 21rpx; height: 21.68rpx;
} }
} }
.function_item_text::after { .function_item_text::after {
......
pages/order/order.vue
...@@ -19,8 +19,8 @@ ...@@ -19,8 +19,8 @@
<view class="order_item" v-for="item in list" :key="item.id" @click="openInfo(item)"> <view class="order_item" v-for="item in list" :key="item.id" @click="openInfo(item)">
<view class="order_header"> <view class="order_header">
<view> <view>
<h3 class="order_adrass">{{ item.shop.name }}</h3> <view class="order_adrass">{{ item.shop.name }}</view>
<text class="order_time">{{ item.createdAt }}</text> <view class="order_time">{{ item.createdAt }}</view>
</view> </view>
<view class="order_status"> <view class="order_status">
<text>{{ getStateText(item.state) }}</text> <text>{{ getStateText(item.state) }}</text>
...@@ -29,9 +29,8 @@ ...@@ -29,9 +29,8 @@
</view> </view>
<div class="order_content"> <div class="order_content">
<view class="order_content_box1"> <view class="order_content_box1">
<view class="goods_item" v-for="good in item.orderDetails" :key="good.id"> <view class="goods_item" v-for="(good,index) in item.orderDetails" :key="good.id">
<image class="goods_img" v-if="jsonParse(good.goods.pics).thumbnailApplet" <image class="goods_img" v-if="jsonParse(good.goods.pics).thumbnailApplet" :src="jsonParse(good.goods.pics).thumbnailApplet"></image>
:src="jsonParse(good.goods.pics).thumbnailApplet"></image>
<image v-else class="goods_img" :src="jsonParse(good.goods.pics).thumbnail"></image> <image v-else class="goods_img" :src="jsonParse(good.goods.pics).thumbnail"></image>
<view class="goods_text"> <view class="goods_text">
...@@ -48,16 +47,16 @@ ...@@ -48,16 +47,16 @@
</view> </view>
</view> </view>
</view> </view>
<view v-if="index==item.orderDetails.length-1 && (item.state == 2 || item.state == 3 || item.state == 4 || item.state == 5)" class="qr_code">
<image class="qr_code_img" src="/static/imgs/icon-barcode.png"></image>
<view class="qr_text">点击二维码取单</view>
</view>
</view> </view>
</view> </view>
<view v-if="item.state == 2 || item.state == 3 || item.state == 4 || item.state == 5" class="qr_code">
<image class="qr_code_img" src="/static/imgs/icon-barcode.png"></image>
<view class="qr_text">点击二维码取单</view>
</view>
</div> </div>
<view class="order_footer"> <view class="order_footer">
<view class="total"> <view class="total">
共{{ orderDetailsSize(item.orderDetails) }}件商品 合计<text class="price">￥{{ Utils.isInteger(item.amount) }}</text> 共{{ orderDetailsSize(item.orderDetails) }}件商品 实付<text class="price">￥{{ Utils.isInteger(item.amount) }}</text>
</view> </view>
<a class="btn" @click.stop="PayNow(item)" v-if="item.state == 1" type="primary">立刻支付</a> <a class="btn" @click.stop="PayNow(item)" v-if="item.state == 1" type="primary">立刻支付</a>
<a class="btn" v-else @click.stop="oneMoreOrder(item)" type="primary">再来一单</a> <a class="btn" v-else @click.stop="oneMoreOrder(item)" type="primary">再来一单</a>
...@@ -249,9 +248,9 @@ export default { ...@@ -249,9 +248,9 @@ export default {
} }
.empty_text { .empty_text {
width: 500rpx; width: 500rpx;
margin-top: 35rpx; margin-top: 32rpx;
text-align: center; text-align: center;
font-size: 24rpx; font-size: 24rpx;
...@@ -283,14 +282,13 @@ export default { ...@@ -283,14 +282,13 @@ export default {
/* 兼容老版本的方法 */ /* 兼容老版本的方法 */
-webkit-transform: translateX(-50%); -webkit-transform: translateX(-50%);
transform: translate(-50%); transform: translate(-50%);
margin-top: 311rpx; margin-top: 352rpx;
.empty_icon { .empty_icon {
width: 324rpx; width: 324rpx;
height: 236rpx; height: 236rpx;
} }
.empty_text { .empty_text {
margin-top: 35rpx; margin-top: 32rpx;
text-align: center; text-align: center;
font-size: 24rpx; font-size: 24rpx;
...@@ -299,7 +297,7 @@ export default { ...@@ -299,7 +297,7 @@ export default {
color: #999999; color: #999999;
} }
.empty_button { .empty_button {
margin-top: 35rpx; margin-top: 36rpx;
width: 167rpx; width: 167rpx;
height: 64rpx; height: 64rpx;
border-radius: 2rpx; border-radius: 2rpx;
...@@ -322,9 +320,9 @@ export default { ...@@ -322,9 +320,9 @@ export default {
.order_item { .order_item {
width: 686rpx; width: 686rpx;
background: #FFFFFF; background: #FFFFFF;
margin: 30rpx auto 0; margin: 32rpx auto 0;
box-sizing: border-box; box-sizing: border-box;
padding: 25rpx 22rpx 32rpx 32rpx; padding: 25rpx 30rpx 30rpx 30rpx;
.order_header { .order_header {
display: flex; display: flex;
...@@ -335,11 +333,14 @@ export default { ...@@ -335,11 +333,14 @@ export default {
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
line-height: 40rpx;
} }
.order_time { .order_time {
font-size: 24rpx; font-size: 24rpx;
font-family: ArialMT; font-family: ArialMT;
margin-top: 4rpx;
line-height: 28rpx;
color: #999999; color: #999999;
} }
...@@ -351,6 +352,7 @@ export default { ...@@ -351,6 +352,7 @@ export default {
display: flex; display: flex;
align-items: baseline; align-items: baseline;
justify-content: flex-start; justify-content: flex-start;
line-height: 34rpx;
.xiaojiantou { .xiaojiantou {
width: 12rpx; width: 12rpx;
height: 16rpx; height: 16rpx;
...@@ -361,7 +363,6 @@ export default { ...@@ -361,7 +363,6 @@ export default {
} }
.order_content { .order_content {
margin-top: 42rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -370,34 +371,31 @@ export default { ...@@ -370,34 +371,31 @@ export default {
flex: 1; flex: 1;
} }
.qr_code {
font-size: 16rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #666666;
line-height: 22rpx;
text-align: center;
margin-right: 10rpx;
margin-left: 39rpx;
.qr_code_img {
width: 76rpx;
height: 76rpx;
}
.qr_text {
margin-top:10rpx;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
}
}
.goods_item { .goods_item {
margin-top: 42rpx;
display: flex; display: flex;
align-items: center; // align-items: center;
.qr_code {
text-align: center;
margin-right: 10rpx;
margin-left: 38rpx;
.qr_code_img {
vertical-align: bottom;
width: 76rpx;
height: 76rpx;
}
.qr_text {
line-height: 28rpx;
margin-top: 10rpx;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
}
}
.goods_img { .goods_img {
height: 96rpx; height: 96rpx;
...@@ -414,21 +412,22 @@ export default { ...@@ -414,21 +412,22 @@ export default {
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #666666; color: #666666;
margin-top: 10rpx;
line-height: 40rpx;
} }
.goods_spce { .goods_spce {
margin-top: 2.6rpx; margin-top: 2rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
line-height: 34rpx;
color: #999999; color: #999999;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
} }
} }
} }
...@@ -436,7 +435,7 @@ export default { ...@@ -436,7 +435,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin-top: 41rpx; margin-top: 40rpx;
.total { .total {
font-size: 28rpx; font-size: 28rpx;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment