Skip to content

U
user
Commit 31e89ad2 by weijiguang
Options

修改订单详情UI

parent b511068a
Showing with 44 additions and 47 deletions
orderSubPackage/pages/orderInfo/index.vue
......@@ -15,12 +15,11 @@
<image mode="aspectFit" :src="ewmImg" class="qr"></image>
<view class="status_text">{{ orderStatusText }}</view>
</div>
<canvas 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;" />
<div v-if="qrShow" class="flow_describe">
<h3>扫码流程 </h3>
<image :mode="'aspectFit'" width="600px" class="flow_img" src="../../../static/imgs/order_flow.png">
</image>
<h3>扫码流程</h3>
<image :mode="'aspectFit'" class="flow_img" src="/static/imgs/order_flow.png"></image>
</div>
<div class="shop_info">
<div class="address">
......@@ -33,10 +32,7 @@
<image mode="aspectFit" v-if="jsonParse(item.goods.pics).thumbnailApplet"
:src="jsonParse(item.goods.pics).thumbnailApplet" class="goods_img">
</image>
<image mode="aspectFit" 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_name">
<div class="name">{{ item.goodsName }}</div>
......@@ -44,16 +40,17 @@
</div>
<div class="goods_psce">
<div class="psce_name">
<span v-for="rule in jsonParse(item.specRuleDetail)" :key="rule.specId">
{{ rule.ruleName }}/
<span v-for="(rule, index) in jsonParse(item.specRuleDetail)" :key="rule.specId">
{{ rule.ruleName }}
<text v-if="index != jsonParse(item.specRuleDetail).length - 1">/</text>
</span>
</div>
<div class="size">*{{ item.num }}</div>
<div class="size">x{{ item.num }}</div>
</div>
</div>
</div>
</div>
<div class="discount">
<!-- <div class="discount">
<div class="discount_1">
<div class="name">优惠免减</div>
<div class="price">¥{{ setPrice(item.amount - item.realAmount) }}</div>
......@@ -62,10 +59,10 @@
<div class="name">特惠价</div>
<div class="price">¥{{ setPrice(item.realAmount) }}</div>
</div>
</div>
</div> -->
</div>
<div class="total">
<div class="size">共一件商品</div>
<div class="size">共{{ totalNum }}件商品</div>
<div>
<span class="paid_in">实付</span>
<span class="money">￥{{ setPrice(orderInfo.amount) }}</span>
......@@ -108,6 +105,7 @@ export default {
onLoad() {
const resData = uni.getStorageSync('orderInfo');
this.orderInfo = resData
console.log("orderInfo:"+JSON.stringify(this.orderInfo));
this.ewmImg = '/static/imgs/noQr.png'
const isBuild = ['2', '3', '4', '5'].indexOf(this.orderInfo.state) != -1;
......@@ -171,7 +169,6 @@ export default {
}
})
},
jsonParse(json) {
return JSON.parse(json)
......@@ -183,6 +180,13 @@ export default {
},
},
computed: {
totalNum() {
let totalNum = 0;
this.orderInfo.orderDetails.map(item => {
totalNum += parseInt(item.num);
})
return totalNum;
},
qrShow() {
console.log("order state:"+this.orderInfo.state);
return ['2','3','4','5'].indexOf(this.orderInfo.state) != -1
......@@ -253,8 +257,8 @@ export default {
}
.order_status {
width: 686rpx;
max-height: 174rpx;
width: 590rpx;
// max-height: 174rpx;
background: #FFFFFF;
border-radius: 10rpx;
margin: 32rpx auto 0;
......@@ -273,8 +277,6 @@ export default {
display: flex;
align-items: center;
justify-content: center;
}
.btn {
......@@ -283,7 +285,8 @@ export default {
background: #006ECF;
border-radius: 6rpx;
display: inline-block;
margin: 20rpx;
margin: 0rpx 20rpx;
margin-top: 20rpx;
padding: 0;
line-height: 52rpx;
font-family: PingFangSC-Medium, PingFang SC;
......@@ -295,10 +298,11 @@ export default {
.btn_cancel {
width: 160rpx;
height: 52rpx;
border: 1rpx solid #CCCCCC;
border: 1rpx solid #EEEEEE;
border-radius: 6rpx;
display: inline-block;
margin: 20rpx;
margin: 0rpx 20rpx;
margin-top: 20rpx;
padding: 0;
line-height: 52rpx;
font-family: PingFangSC-Medium, PingFang SC;
......@@ -313,7 +317,6 @@ export default {
background: #FFFFFF;
border-radius: 10rpx;
margin-top: 32rpx;
padding-top: 65rpx;
.code {
font-size: 36rpx;
......@@ -321,7 +324,7 @@ export default {
font-weight: 600;
color: #000000;
text-align: center;
padding-top: 30rpx;
}
.qr_code {
......@@ -351,15 +354,13 @@ export default {
}
.flow_describe {
width: 686rpx;
height: 340rpx;
width: 590rpx;
background: #FFFFFF;
box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(166, 166, 166, 0.5);
border-radius: 10rpx;
margin: 0 auto;
padding: 30rpx;
margin-bottom: 10rpx;
h3 {
font-size: 28rpx;
......@@ -369,10 +370,9 @@ export default {
}
.flow_img {
width: 600rpx;
height: 214rpx;
width: 590rpx;
height: 211rpx;
display: block;
margin: 24rpx auto;
}
}
}
......@@ -382,11 +382,9 @@ export default {
background: #FFFFFF;
border-radius: 10rpx;
margin: 0 auto;
margin-top: 32rpx;
padding: 24rpx 32rpx;
padding: 0rpx 32rpx;
box-sizing: border-box;
h3 {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
......@@ -395,10 +393,11 @@ export default {
}
.address {
margin-top: 16rpx;
padding-top: 20rpx;
border-bottom: 1rpx solid #EEEEEE;
padding-bottom: 20rpx;
.address_1 {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
......@@ -414,10 +413,8 @@ export default {
}
}
.goods {
margin-top: 10rpx;
padding-top: 15rpx;
padding-top: 20rpx;
.goods_item {
display: flex;
......@@ -429,7 +426,7 @@ export default {
height: 80rpx;
width: 80rpx;
background-color: #eee;
margin-right: 50rpx;
margin-right: 30rpx;
}
.goods_text {
......@@ -473,14 +470,12 @@ export default {
margin-top: 10rpx;
}
}
}
.discount {
margin-top: 24rpx;
padding-bottom: 24rpx;
border-bottom: 1rpx solid #CCCCCC;
border-bottom: 1rpx solid #EEEEEE;
.discount_1 {
display: flex;
......@@ -510,7 +505,6 @@ export default {
margin-top: 18rpx;
.price {
font-family: Arial-BoldMT, Arial;
font-weight: 700;
color: #000;
......@@ -524,6 +518,9 @@ export default {
display: flex;
justify-content: space-between;
margin-top: 52rpx;
border-top: 1rpx solid #EEEEEE;
padding-bottom: 20rpx;
padding-top: 20rpx;
.size {
font-size: 24rpx;
......@@ -561,7 +558,7 @@ export default {
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
color: #000000;
border-bottom: 1rpx solid #CCCCCC;
border-bottom: 1rpx solid #EEEEEE;
}
.item {
......
orderSubPackage/pages/settlement/index.vue
......@@ -299,7 +299,7 @@ export default {
.take_order {
margin-top: 28rpx;
padding-top: 28rpx;
border-top: 1rpx solid #CCCCCC;
border-top: 1rpx solid #EEEEEE;
.title {
font-size: 28rpx;
......@@ -344,7 +344,7 @@ export default {
.goods {
margin-top: 42rpx;
border-bottom: 1rpx solid #CCCCCC;
border-bottom: 1rpx solid #EEEEEE;
padding-bottom: 20rpx;
.goods_item {
......
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