APP
/
ox_zhiNengZhuShou
3
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

add order

account
刘嘉炜 4 years ago
parent
b5c0deff4c
commit
7459a9022d
4 changed files with 236 additions and 1 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 81
      src/components/order_list/rent_and_sale/rent_and_sale.vue
  2. 6
      src/pages.json
  3. 7
      src/pages/order_list/order_list.vue
  4. 143
      src/subpackage/order/pages/rent_and_sale/detail/detail.vue

81
src/components/order_list/rent_and_sale/rent_and_sale.vue
View File

@ -0,0 +1,81 @@
<template>
<view class="rent-and-sale">
<a-header :source="'地址'" :status="'状态'">
<view slot="line" class="ras-line">
<image class="rl-img" mode="aspectFit" src="/static/images/icon/location.png"></image>
<view class="rl-view">储物柜-B柜</view>
</view>
</a-header>
<view class="ras-info">
<a-line :value="'sc20 0822 0815 6894'">
<block slot="name">订单编号：</block>
</a-line>
<a-line :value="'1小时58分46秒'">
<block slot="name">租借时长：</block>
</a-line>
<a-line :value="'2020-08-22 10:30:40'">
<block slot="name">租借时间：</block>
</a-line>
<a-line :value="'KARAKAL球拍'">
<block slot="name">商品名称：</block>
</a-line>
<a-line :value="'2020-08-22 10:30:40'">
<block slot="name">购买时间：</block>
</a-line>
</view>
<view class="ras-total">
<view class="rt-view"><text class="rv-text">合计支付：</text>￥{{ orderInfo.pay_amount || '0' }}</view>
</view>
</view>
</template>
<script>
import a_header from '../a_header/a_header.vue';
import a_line from '../a_line/a_line.vue';
export default {
components: {
'a-header': a_header,
'a-line': a_line,
},
}
</script>
<style lang="scss">
@import '~style/public.scss';
.rent-and-sale{
background-color: #fff;
padding: 0 20upx 20upx;
border-radius: 10upx;
}
.ras-info{
padding-top: 20upx;
}
.ras-line{
margin-top: 10upx;
@include centerFlex(flex-start);
.rl-img{
flex-shrink: 0;
margin-right: 12upx;
height: 28upx;
width: 28upx;
}
.rl-view{
font-size: 24upx;
line-height: 34upx;
color: #9A9A9D;
}
}
.ras-total{
padding: 10upx 0;
@include centerFlex(flex-end);
.rt-view{
font-weight: 500;
font-size: 28upx;
color: #333;
@include textHide(1);
.rv-text{
font-weight: 400;
}
}
}
</style>

6
src/pages.json
View File

@ -390,6 +390,12 @@
"root": "subpackage/order",
"pages": [
{
"path": "pages/rent_and_sale/detail/detail",
"style" : {
"navigationBarTitleText": "租售柜订单详情"
}
},
{
"path": "pages/locker/detail/detail",
"style" : {
"navigationBarTitleText": "储物柜订单详情"

7
src/pages/order_list/order_list.vue
View File

@ -63,6 +63,9 @@
<view class="ool-item">
<locker></locker>
</view>
<view class="ool-item">
<rent-and-sale></rent-and-sale>
</view>
<!-- <view class="ool-item">
<spectacular-monent></spectacular-monent>
</view>
@ -127,6 +130,7 @@
import spectacular_monent from '../../components/order_list/spectacular_monent/spectacular_monent.vue';
import club_rental from '../../components/order_list/club_rental/club_rental.vue';
import locker from '../../components/order_list/locker/locker.vue';
import rent_and_sale from '../../components/order_list/rent_and_sale/rent_and_sale.vue';
import util from '../../utils/util';
import { servers } from '../../js/server';
@ -147,6 +151,7 @@
'curriculum': curriculum,
'club-rental': club_rental,
'locker': locker,
'rent-and-sale': rent_and_sale,
},
computed:{
isStoreInfo(){
@ -224,7 +229,7 @@
let _classifyArr = getClassifyList(+_type);
this.orderType = _type;
this.curTabID = _classifyArr[0].id || ''
if(_classifyArr&&_classifyArr[0])this.curTabID = _classifyArr[0].id || ''
// 场地预约拆分订单
if(options.order_type == 3&&options.type!=undefined)this.appointOrderType = options.type;

143
src/subpackage/order/pages/rent_and_sale/detail/detail.vue
View File

@ -0,0 +1,143 @@
<template>
<view class="rent-and-sale">
<o-header></o-header>
<view class="ras-box">
<view class="ras-tit">租用详情</view>
<a-line :value="'欧轩智能租售柜' || '-'">
<block slot="name">设备名称：</block>
</a-line>
<a-line :value="'球拍' || '-'">
<block slot="name">租用设备：</block>
</a-line>
<a-line :value="'7号柜' || '-'">
<block slot="name">柜子编号：</block>
</a-line>
<a-line :value="'2020-01-10 15:02:24 ' || '-'">
<block slot="name">租借时间：</block>
</a-line>
<a-line :value="'2020-01-10 17:37:33' || '-'">
<block slot="name">归还时间：</block>
</a-line>
<a-line :value="'2小时35分9秒' || '-'" value-color="#009874">
<block slot="name">租借时长：</block>
</a-line>
</view>
<view class="ras-box ras-price-info">
<view class="ras-tit">费用详情</view>
<a-line :value="'20元/小时' || '-'">
<block slot="name">收费标准：</block>
</a-line>
<a-line :value="'¥100' || '-'">
<block slot="name">支付押金：</block>
</a-line>
<a-line :value="'¥60' || '-'">
<block slot="name">产生费用：</block>
</a-line>
<s-line :keyname="'积分抵扣'" :value="'¥6'"></s-line>
<s-line :keyname="'折扣金额'" :value="'¥6'"></s-line>
<s-line :keyname="'优惠券优惠'" :value="'¥6'"></s-line>
<view class="rpi-total"><text>合计支付：</text>￥5</view>
<view class="ras-border"></view>
<view class="rpi-refund-info">
<view>应退还金额：¥40</view>
<view>（注：应退还金额=支付押金-合计应支付金额）</view>
</view>
</view>
<view class="ras-box">
<view class="ras-tit">支付详情</view>
<p-line :keyname="'订单编号'" :value="'sc20 0822 0815 1234'" isbtn></p-line>
<p-line :keyname="'支付方式'" :value="'会员卡支付'"></p-line>
<p-line :keyname="'支付金额'" :value="'50元'"></p-line>
<p-line :keyname="'支付时间'" :value="'2020-08-22 10:12:25'"></p-line>
<p-line :keyname="'交易流水号'" :value="'20200918125536456408765'"></p-line>
<view class="ras-border"></view>
<p-line :keyname="'订单编号'" :value="'sc20 0822 0815 1234'"></p-line>
<p-line :keyname="'支付方式'" :value="'会员卡支付'"></p-line>
<p-line :keyname="'支付金额'" :value="'50元'"></p-line>
<p-line :keyname="'支付时间'" :value="'2020-08-22 10:12:25'"></p-line>
<p-line :keyname="'交易流水号'" :value="'20200918125536456408765'"></p-line>
</view>
<view class="ras-box">
<view class="ras-tit">退款详情</view>
<p-line :keyname="'退款编号'" :value="'sc20 0822 0815 6894'" isbtn></p-line>
<p-line :keyname="'退款方式'" :value="'原路退还'"></p-line>
<p-line :keyname="'退款状态'" :value="'退款成功'"></p-line>
<p-line :keyname="'退款金额'" :value="'40元'"></p-line>
<p-line :keyname="'退款时间'" :value="'2020-08-23 10:12:25'"></p-line>
</view>
</view>
</template>
<script>
import header from '../../../components/header/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,
'o-header': header,
's-line': s_line,
'p-line': p_line,
},
}
</script>
<style lang='scss'>
@import '~style/public.scss';
.rent-and-sale{
padding-bottom: 0upx;
padding-bottom: calc( 0upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
padding-bottom: calc( 0upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
}
.ras-box{
margin-bottom: 24upx;
padding: 30upx;
background-color: #fff;
}
.ras-tit{
margin-bottom: 20upx;
line-height: 44upx;
font-size: 32upx;
color: #333;
}
.ras-border{
margin: 20upx 0;
height: 2upx;
background-color: #D8D8D8;
}
.ras-price-info{
.rpi-total{
margin-top: 20upx;
text-align: right;
font-size: 28upx;
font-weight: 500;
color: #333;
>text{
color: #9A9A9D;
font-weight: 400;
}
}
.rpi-refund-info{
margin-bottom: 10upx;
>view{
text-align: right;
@include textHide(1);
&:first-child{
margin-bottom: 22upx;
font-size: 28upx;
line-height: 40upx;
color: #EA5061;
}
&+view{
font-size: 24upx;
line-height: 34upx;
color: #9a9a9d;
}
}
}
}
</style>
Write Preview
Loading…
Cancel
Save