li-guang
2020-12-21 164acabd9e14052cb730826f427ef9d353fd0529
hive-app/pages/workbench/orderDetail.vue
@@ -1,9 +1,165 @@
<template>
   <!-- 订单详情 -->
   <view class="list">
      <view class="list-item">
         <view class="list-header">
            <text>订单信息</text>
         </view>
         <view class="list-content">
            <view class="flex justify-between">
               <text>会员姓名</text>
               <text class="gray">李某某</text>
            </view>
            <view class="flex justify-between">
               <text>联系方式</text>
               <text class="gray">15588881231</text>
            </view>
            <view class="flex justify-between">
               <text>订单号</text>
               <text class="gray">N12371237123173</text>
            </view>
            <view class="flex justify-between">
               <text>下单顾问</text>
               <text class="gray">广哥</text>
            </view>
            <view class="flex justify-between">
               <text>下单时间</text>
               <text class="gray">2020-12-12 19:06:08</text>
            </view>
         </view>
      </view>
      <view class="list-item">
         <view class="list-header">
            <text>订单明细</text>
         </view>
         <view class="list-content">
            <view class="list-content-row" v-for="item in 2">
               <view class="flex justify-between align-center">
                  <view>
                     <text class="font-15 mr-20">富脂肽原液(单支)</text>
                     <text>x1</text>
                  </view>
                  <view>
                     <text class="gray font-through">¥0.99</text>
                     <text class="ml-10">¥0.99</text>
                  </view>
               </view>
               <view class="gray font-13">
                  <text>现金支付:</text>
                  <text>¥0</text>
               </view>
               <view class="gray font-13">
                  <text>储蓄卡支付:</text>
                  <text>¥0</text>
               </view>
               <view class="gray font-13">
                  <text>
                     <text>业绩:</text>
                     <text>¥0</text>
                  </text>
                  <text class="ml-20">
                     <text>员工:</text>
                     <text>¥0</text>
                  </text>
               </view>
            </view>
         </view>
      </view>
      <view class="list-item">
         <view class="list-header">
            <text>支付信息</text>
         </view>
         <view class="list-content">
            <view class="flex justify-between">
               <text>现金支付</text>
               <text class="gray">¥5000.00</text>
            </view>
            <view class="flex justify-between">
               <text>储蓄卡支付</text>
               <text class="gray">¥352.00</text>
            </view>
            <view class="flex justify-between">
               <text>应付总额</text>
               <text class="gray">¥485.00</text>
            </view>
            <view class="flex justify-between">
               <text>实付总额</text>
               <text class="gray">¥6934.00</text>
            </view>
            <view class="flex justify-between">
               <text>优惠总额</text>
               <text class="gray">¥40.00</text>
            </view>
         </view>
      </view>
      <view class="list-item">
         <view class="list-header">
            <text>业绩提成</text>
         </view>
         <view class="list-content">
            <view class="list-content-row" v-for="item in 2">
               <view class="flex justify-between align-center gray font-13">
                  <view>
                     <text class="mr-20">富脂肽原液(单支)</text>
                     <text>x1</text>
                  </view>
                  <text>¥0.99</text>
               </view>
               <view class="flex justify-between">
                  <text>广哥</text>
                  <text>业绩:233</text>
               </view>
               <view class="flex justify-between">
                  <text>永哥</text>
                  <text>业绩:233</text>
               </view>
            </view>
         </view>
      </view>
   </view>
</template>
<script>
   export default {
      data() {
        return {
        }
      }
   }
</script>
<style>
   page{
      background: #F6F6F8;
   }
   .list-item{
      background: #FFFFFF;
      border-radius: 4px;
      margin: 10px;
   }
   .list-header{
      padding: 12px 15px;
      font-size: 16px;
      font-weight: bold;
      border-bottom: 1px solid #EDEAF4;
   }
   .list-content{
      padding: 12px 15px;
      font-size: 14px;
      line-height: 28px;
   }
   .list-content-row{
      border-bottom: 1px solid #EDEAF4;
      padding: 8px 0;
   }
   .list-content-row:nth-child(1){
      padding-top: 0;
   }
   .list-content-row:nth-last-child(1){
      border-bottom: 0;
      padding-bottom: 0;
   }
   .font-through{
      text-decoration: line-through;
   }
</style>