商品详情

li-guang

2020-12-18 7baf798ebef349d2d40879dc1ec6cbe48c245b94

 hive-app/pages/workbench/orderList.vue

@@ -4,10 +4,7 @@
      <!-- #ifndef H5 -->
      <view class="status_bar"></view>
      <!-- #endif -->
      <view class="input-box">
         <view class="input-icon iconfont iconsousuo"></view>
         <input placeholder="输入会员姓名;手机号;编号查询" class="input" placeholder-class="input-text"/>
      </view>
      <search-bar :placeholder=placeholder class="header-input"></search-bar>
      <view>
         <h-tabs
            class="tab"
@@ -17,8 +14,7 @@
               activeColor: '#518EFF',
               underLineColor: '#518EFF',
               underLineHeight: 4,
               fontSize: '30px',
               itemWidth: 80,
               fontSize: '30',
               underLineWidth: 60,
            }"
         />
@@ -38,13 +34,38 @@
                  <text class="font-12 mt-10">欠款总额</text>
               </view>
               <view class="flex flex-v">
                  <text class="font-12">$ 8000.00</text>
                  <text class="font-12 mt-10">$ 0.00</text>
                  <text class="font-12 mt-10">$ 8000.00</text>
                  <text class="font-12">￥ 8000.00</text>
                  <text class="font-12 mt-10">￥ 0.00</text>
                  <text class="font-12 mt-10">￥ 8000.00</text>
               </view>
            </view>
            <view class="flex justify-end">
               <button class="blue-btn small-btn">取消订单</button>
            </view>
         </view>
         <view class="order">
            <view class="flex justify-between order-number">
               <text class="font-14">订单号: N202012123556</text>
               <text class="font-14 blue">已完成</text>
            </view>
            <view class="flex justify-between order-content">
               <view class="flex flex-v">
                  <text class="font-12">李某某</text>
                  <text class="font-12 gray mt-10">2020-12-15 18:11:01</text>
               </view>
               <view class="flex flex-v">
                  <text class="font-12">应付金额</text>
                  <text class="font-12 mt-10">实付金额</text>
               </view>
               <view class="flex flex-v">
                  <text class="font-12">￥ 8000.00</text>
                  <text class="font-12 mt-10">￥ 8000.00</text>
               </view>
            </view>
            <view class="flex justify-end">
               <navigator url="./orderDetail">
                  <button class="blue-btn small-btn">查看详情</button>
               </navigator>
            </view>
         </view>
      </view>
@@ -53,12 +74,15 @@

<script>
   import HTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue";
   import searchBar from '../../components/searchBar/index.vue';
   export default {
      components: {
          HTabs
          HTabs,
         searchBar
      },
      data() {
        return {
         placeholder:"输入会员姓名、手机号、编号查询",
          tabs:[
            {
               state: 1,
@@ -83,24 +107,8 @@
</script>

<style>
   .input-box{
      margin: 0 15px;
      background: #F8F8F8;
      border-radius: 25px;
      display: flex;
      align-items: center;
      padding: 10px 0;
   }
   .input-icon{
      font-size: 20px;
      margin: 0 16px;
   }
   .input{
      flex: 1;
      font-size: 14px;
   }
   .input-text{
      color: #ABB1CC;
   .header-input{
      margin: 0 10px;
   }
   .tab{
      border-bottom: 1px solid #EDEAF4;