From 992815eb3ce28ad9f82219770f5dc5a9ccc71e9b Mon Sep 17 00:00:00 2001
From: "liujw155@outlook.com" <liujw155@outlook.com>
Date: Fri, 8 Oct 2021 18:02:33 +0800
Subject: [PATCH] add order

---
 src/pages.json                                     |   6 +
 src/subpackage/order/pages/mall/detail/detail.vue  |  75 ++++++++
 .../order/pages/rent_and_sale/detail/detail.vue    | 192 ++++++++++++++-------
 3 files changed, 207 insertions(+), 66 deletions(-)
 create mode 100644 src/subpackage/order/pages/mall/detail/detail.vue

diff --git a/src/pages.json b/src/pages.json
index d98713b..c6a890d 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -390,6 +390,12 @@
 			"root": "subpackage/order",
 			"pages": [
 				{
+					"path": "pages/mall/detail/detail",
+					"style" : {
+						"navigationBarTitleText": "商城订单详情" 
+					}
+				},
+				{
 					"path": "pages/rent_and_sale/detail/detail",
 					"style" : {
 						"navigationBarTitleText": "租售柜订单详情" 
diff --git a/src/subpackage/order/pages/mall/detail/detail.vue b/src/subpackage/order/pages/mall/detail/detail.vue
new file mode 100644
index 0000000..1ed2e47
--- /dev/null
+++ b/src/subpackage/order/pages/mall/detail/detail.vue
@@ -0,0 +1,75 @@
+<template>
+    <view class="mall-detail">
+        <view class="md-send">
+            <view class="ms-status-bar">已退款</view>
+            <view class="ms-send-info">
+                <view class="msi-txt">
+                    <view>快递：顺丰速递  SF1090317923085</view>
+                    <view>复制</view>
+                </view>
+                <image></image>
+            </view>
+            <view class="md-box"></view>
+        </view>
+        
+    </view> 
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    .ms-status-bar{
+        padding: 0 44upx;
+        line-height: 108upx;
+        font-size: 36upx;
+        color: #fff;
+        background-color: #0a9a79;
+    }
+    .ms-send-info{
+        @include centerFlex(space-between);
+        padding: 0 44upx;
+        height: 108upx;
+        background-color: #fff;
+        .msi-txt{
+            @include centerFlex(flex-start);
+            >view{
+                &:first-child{
+                    font-size: 28upx;
+                    color: #000;
+                    @include textHide(1);
+                }
+                &+view{
+                    flex-shrink: 0;
+                    margin-left: 20upx;
+                    font-size: 28upx;
+                    color: $themeColor;
+                }
+            }
+        }
+        >image{
+            margin-left: 20upx;
+            flex-shrink: 0;
+            width: 32upx;
+            height: 32upx;
+            background-color: skyblue;
+        }
+
+    }
+    .md-box{
+        padding: 30upx 20upx;
+        border-radius: 10upx;
+        background-color: #fff;
+    }
+    .md-tit{
+        margin-bottom: 30upx;
+        line-height: 44upx;
+        font-weight: 500;
+        font-size: 32upx;
+        color: #1a1a1a;
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/order/pages/rent_and_sale/detail/detail.vue b/src/subpackage/order/pages/rent_and_sale/detail/detail.vue
index 44be971..a863333 100644
--- a/src/subpackage/order/pages/rent_and_sale/detail/detail.vue
+++ b/src/subpackage/order/pages/rent_and_sale/detail/detail.vue
@@ -1,70 +1,111 @@
 <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>
+        <!-- 出租 -->
+        <block v-if="false">
+            <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>
-        <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 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 class="ras-fixd-bar">
+                <view>结束计费</view>
+            </view>
+        </block>
+        <!-- 销售 -->
+        <block>
+            <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="'￥198' || '-'">
+                    <block slot="name">价格：</block> 
+                </a-line>
+            </view>
+            <view class="ras-box ras-price-info">
+                <view class="ras-tit">费用详情</view>
+                <s-line :keyname="'金额小计'" :value="'¥6'"></s-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>
+            <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="'2020-08-22 10:12:25'"></p-line>
+                <p-line :keyname="'交易流水号'" :value="'20200918125536456408765'"></p-line>
+                <p-line :keyname="'退款单号'" :value="'sc20 0822 0815 6894'"></p-line>
+                <p-line :keyname="'退款时间'" :value="'2020-08-23 10:12:25'"></p-line>
+            </view>
+        </block>
     </view>
 </template>
 
@@ -86,9 +127,9 @@ export default {
 <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 */
+        padding-bottom: 142upx;
+        padding-bottom: calc( 142upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+        padding-bottom: calc( 142upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
     }
     .ras-box{
         margin-bottom: 24upx;
@@ -139,5 +180,24 @@ export default {
             }
         }
     }
+
+    .ras-fixd-bar{
+        position: fixed;        
+        left: 0;
+        bottom: 0;
+        width: 100%;
+        padding: 10upx 24upx;
+        padding-bottom: calc( 10upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+        padding-bottom: calc( 10upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
+        background-color: #f2f2f7;
+        >view{
+            line-height: 112upx;
+            text-align: center;
+            font-size: 32upx;
+            border-radius: 10upx;
+            background-color: $themeColor;
+            color: #fff;
+        }
+    }
     
 </style>
\ No newline at end of file