8 changed files with 246 additions and 2 deletions
-
87src/components/order_list/retail/retail.vue
-
3src/js/api.js
-
6src/pages.json
-
8src/pages/order_list/order_list.vue
-
1src/subpackage/order/js/api.js
-
3src/subpackage/order/pages/order_manage/order_manage.vue
-
140src/subpackage/order/pages/retail/detail/detail.vue
-
BINsrc/subpackage/order/static/images/order_manage/order_18.png
@ -0,0 +1,87 @@ |
|||
<template> |
|||
<view class="retail-order" @click="toInfo"> |
|||
<a-header :source="orderInfo.source || '-'" :status="getStatus(orderInfo.pay_status)"></a-header> |
|||
<!-- 商品名称: 操作人： 购买时间: --> |
|||
<view class="ro-info"> |
|||
<a-line :value="orderInfo.order_no || '-'"> |
|||
<block slot="name">订单编号：</block> |
|||
</a-line> |
|||
<a-line :value="getGoodsName || '-'"> |
|||
<block slot="name">商品名称：</block> |
|||
</a-line> |
|||
<a-line :value="orderInfo.sys_optuname || '-'"> |
|||
<block slot="name">操作人：</block> |
|||
</a-line> |
|||
<a-line :value="orderInfo.pay_time || '-'"> |
|||
<block slot="name">购买时间：</block> |
|||
</a-line> |
|||
</view> |
|||
<view class="ro-total"><text>合计支付：</text>￥{{ orderInfo.pay_amount || 0 }}</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../utils/util'; |
|||
import a_header from '../a_header/a_header.vue'; |
|||
import a_line from '../a_line/a_line.vue'; |
|||
export default { |
|||
computed: { |
|||
getGoodsName(){ |
|||
let { orderInfo } = this; |
|||
let _ls = orderInfo&&orderInfo.retail_order_goods || []; |
|||
let _str = _ls.map(e=>e.name).join('；'); |
|||
if(_ls.length)_str += '；' |
|||
return _str |
|||
} |
|||
}, |
|||
components: { |
|||
'a-header': a_header, |
|||
'a-line': a_line, |
|||
}, |
|||
props: { |
|||
orderInfo: { |
|||
default: {}, |
|||
type: Object |
|||
} |
|||
}, |
|||
methods: { |
|||
getStatus(status){ |
|||
let _obj = { |
|||
1: '交易成功' |
|||
} |
|||
return _obj[status] || '-' |
|||
}, |
|||
toInfo(){ |
|||
let { orderInfo } = this; |
|||
util.routeTo(`/subpackage/order/pages/retail/detail/detail?order_no=${orderInfo.order_no}`, 'nT'); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.retail-order{ |
|||
background-color: #fff; |
|||
padding: 0 20upx 20upx; |
|||
border-radius: 10upx; |
|||
} |
|||
.ro-info{ |
|||
|
|||
} |
|||
.ro-total{ |
|||
line-height: 96upx; |
|||
font-size: 28upx; |
|||
color: #1a1a1a; |
|||
font-weight: 500; |
|||
text-align: right; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
>text{ |
|||
color: #9a9a9d; |
|||
font-weight: 400; |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,140 @@ |
|||
<template> |
|||
<view class="retail-container"> |
|||
<view class="rc-header"> |
|||
<a-header :source="orderInfo.source || '-'" :status="getStatus(orderInfo.pay_status)"></a-header> |
|||
<view class="rh-name"> |
|||
<a-line :value="orderInfo.sys_optuname || '-'"> |
|||
<block slot="name">操作人：</block> |
|||
</a-line> |
|||
</view> |
|||
</view> |
|||
<view class="rc-goods-info" v-if="orderInfo.retail_order_goods&&orderInfo.retail_order_goods.length"> |
|||
<view class="rgi-tit">商品详情</view> |
|||
<view class="rgi-goods-ls"> |
|||
<view class="rgl-item" v-for="(e, i) in orderInfo.retail_order_goods" :key="i"> |
|||
<!-- 商品名称 ：咖啡（小） 数量：1 价格：￥3 --> |
|||
<a-line :value="e.name || '-'"> |
|||
<block slot="name">商品名称：</block> |
|||
</a-line> |
|||
<a-line :value="e.nums || '0'"> |
|||
<block slot="name">数量：</block> |
|||
</a-line> |
|||
<a-line :value="'￥' + (e.price || '0')"> |
|||
<block slot="name">价格：</block> |
|||
</a-line> |
|||
</view> |
|||
</view> |
|||
<view class="rgi-total"><text>合计支付：</text>￥{{ orderInfo.pay_amount || 0 }}</view> |
|||
</view> |
|||
<view class="rc-pay-info"> |
|||
<!-- 订单编号 --> |
|||
<view class="rpi-tit">支付详情</view> |
|||
<p-line :keyname="'订单编号'" :value="orderInfo.order_no || '-'" isbtn></p-line> |
|||
<p-line :keyname="'支付方式'" :value="payTypeTxt(orderInfo.pay_type)"></p-line> |
|||
<p-line :keyname="'支付时间'" :value="orderInfo.pay_time || '-'"></p-line> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { ORDER_API } from '../../../js/api'; |
|||
import server from '../../../js/server'; |
|||
import util from '../../../../../utils/util'; |
|||
import a_header from '../../../../../components/order_list/a_header/a_header.vue'; |
|||
import a_line from '../../../../../components/order_list/a_line/a_line.vue'; |
|||
import s_line from '../../../components/s_line/s_line.vue'; |
|||
import p_line from '../../../components/p_line/p_line.vue'; |
|||
export default { |
|||
components: { |
|||
'a-line': a_line, |
|||
'a-header': a_header, |
|||
's-line': s_line, |
|||
'p-line': p_line, |
|||
}, |
|||
data(){ |
|||
return { |
|||
orderInfo: {} |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
this.getOrderInfo(options.order_no); |
|||
}, |
|||
methods: { |
|||
payTypeTxt: util.order_pay_type_txt, |
|||
getStatus(status){ |
|||
let _obj = { |
|||
1: '交易成功' |
|||
} |
|||
return _obj[status] || '-' |
|||
}, |
|||
getOrderInfo(order_no){ |
|||
util.showLoad(); |
|||
server.get({ |
|||
url: ORDER_API.retailOrderInfo, |
|||
data: { order_no }, |
|||
failMsg: '加载失败！' |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
this.orderInfo = res || {}; |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.retail-container{ |
|||
|
|||
} |
|||
.rc-header{ |
|||
margin-bottom: 26upx; |
|||
padding: 0 24upx; |
|||
background-color: #fff; |
|||
.rh-name{ |
|||
padding: 30upx 0; |
|||
} |
|||
} |
|||
.rc-goods-info{ |
|||
margin-bottom: 24upx; |
|||
padding: 0 24upx; |
|||
background-color: #fff; |
|||
.rgi-tit{ |
|||
padding-top: 20upx; |
|||
font-size: 32upx; |
|||
color: #1a1a1a; |
|||
} |
|||
.rgi-goods-ls{ |
|||
.rgl-item{ |
|||
padding: 30upx 0; |
|||
border-bottom: 2upx solid #D8D8D8; |
|||
} |
|||
} |
|||
.rgi-total{ |
|||
text-align: right; |
|||
line-height: 106upx; |
|||
font-weight: 500; |
|||
font-size: 28upx; |
|||
color: #1a1a1a; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
>text{ |
|||
color: #9a9a9d; |
|||
font-weight: 400; |
|||
} |
|||
} |
|||
} |
|||
.rc-pay-info{ |
|||
padding: 30upx; |
|||
background-color: #fff; |
|||
.rpi-tit{ |
|||
margin-bottom: 16upx; |
|||
line-height: 44upx; |
|||
font-size: 32upx; |
|||
color: #333; |
|||
} |
|||
} |
|||
</style> |
|||
|
After Width: 60 | Height: 60 | Size: 537 B |
Write
Preview
Loading…
Cancel
Save
Reference in new issue