修改订单样式

pages/mobile/center/vendor/index.vue

@@ -50,10 +50,10 @@
             <img src="/images/mobile/center/user/order.jpg" alt="">
             <p>销售订单</p>
           </nuxt-link>
-          <nuxt-link tag="li" to="/">
-            <img src="/images/mobile/center/user/wuliu_icon.png" alt="">
-            <p>物流管理</p>
-          </nuxt-link>
+          <!--<nuxt-link tag="li" to="/">-->
+            <!--<img src="/images/mobile/center/user/wuliu_icon.png" alt="">-->
+            <!--<p>物流管理</p>-->
+          <!--</nuxt-link>-->
           <nuxt-link tag="li" to="/mobile/center/vendor/payCenter">
             <img src="/images/mobile/center/user/finance_icon.png" alt="">
             <p>财务对账</p>

pages/mobile/order/details.vue

@@ -2,179 +2,249 @@
   <div class="order-wrapper">
     <div class="order-details-wrap">
       <div class="order-details-top">
-        <div class="clearfix top-t-wrap">
-          <div class="pull-left">
-            <template v-if="orderList.status === 404 && vendorType === 'buyer'">待收货</template>
-            <template v-if="vendorType !== 'buyer' && orderList.status === 404">
-              请耐心等待买家确认收货
-            </template>
-            <span v-if="vendorType === 'buyer' && orderList.status === 404">{{restTime()}}</span>
-          </div>
-          <div class="pull-right" v-if="vendorType !== 'buyer'">
-            <div class="concat" @click="cancatAlert()">
-              <i class="iconfont icon-kefu1"></i>联系买家
-            </div>
-          </div>
-          <div class="pull-right" v-if="vendorType === 'buyer'">
-            <div class="concat" @click="cancatAlert()">
-              <i class="iconfont icon-kefu1"></i>联系卖家
-            </div>
-          </div>
+        <div class="orderNumber clearfix">
+          <div class="pull-left">订单号：<span>{{orderList.orderid}}</span></div>
+          <div class="pull-right">{{orderList.createtime || orderList.creattime | time}}</div>
         </div>
-        <div class="sendGoods_buyer">
-          <div class="sendGoods_buyer_top">
-            <span class="name">{{orderList.area.name || '收货人'}}</span>
-            <span class="tel">{{orderList.area.tel || '收货人电话'}}</span>
-          </div>
-          <div class="sendGoods_buyer_bottom">
-            <img src="/images/order/address_icon.png"/>
-            <span>{{orderList.area.area}}{{orderList.area.detailAddress}}</span>
+        <div class="orderStatus clearfix">
+          <div class="clearfix">
+            <span style="color: #666">订单状态：</span>
+            <template v-if="vendorType === 'buyer'">
+              <span v-if="orderList.status === 404">待收货</span>
+              <span v-if="orderList.status === 404" style="color: #666">{{restTime()}}</span>
+              <span v-else-if="orderList.status === 505 || orderList.status === 406 || orderList.status === 407 || orderList.status === 403 || orderList.status === 408">待卖家发货</span>
+              <span v-else-if="orderList.status === 501 || orderList.status === 502 || orderList.status === 503 || orderList.status === 524">待付款</span>
+              <span v-else-if="orderList.status === 602 || orderList.status === 603 || orderList.status === 315 || orderList.status === 604 || orderList.status === 605 || orderList.status === 606">已取消</span>
+              <span v-else-if="orderList.status === 504">付款确认中</span>
+              <span v-else-if="orderList.status === 520 || orderList.status === 405">交易已完成</span>
+              <span v-else-if="orderList.status === 525">卖家请求取消</span>
+            </template>
+            <template v-else>
+              <span v-if="orderList.status === 502 || orderList.status === 406">买家已付款</span>
+              <span v-else-if="orderList.status === 602 || orderList.status === 603 || orderList.status === 315 || orderList.status === 604 || orderList.status === 605 || orderList.status === 606">订单已取消</span>
+              <span v-else-if="orderList.status === 501 || orderList.status === 524 ">待买家付款</span>
+              <span v-else-if="orderList.status === 404">请耐心等待买家确认收货</span>
+              <span v-else-if="orderList.status === 405 || orderList.status === 514 || orderList.status === 503 || orderList.status === 506">待商城付款</span>
+              <span v-else-if="orderList.status === 606">交易关闭</span>
+              <span v-else-if="orderList.status === 520">交易完成</span>
+              <span v-else-if="orderList.status === 525">卖家发起取消,待确认</span>
+              <span v-else-if="orderList.status === 504">付款确认中</span>
+            </template>
           </div>
         </div>
-        <div class="clearfix top-w-wrap">
-          <div class="name pull-left">订单备注</div>
-          <div class="detailsinfo pull-left">{{orderList.purchaseRemark || '无'}}</div>
-        </div>
       </div>
       <ul class="order-list-wrap">
         <li class="clearfix">
-          <div class="list-wrap-title clearfix">
-            <div class="pull-left" v-if="vendorType !== 'buyer'" @click="toShopdetails(orderList)">
-              <template v-if="orderList.buyentername">
-                <span class="labelInfo_ForItem" v-if="orderList.storeid === '33069557578d44e69bd91ad12d28a8d4'">寄售</span>
+          <div class="clearfix top-t-wrap">
+            <div class="pull-left clearfix">
+              <template v-if="vendorType !== 'buyer'">
+                <div style="color: #666">买家：</div>
+                <!--<span class="labelInfo_ForItem" v-if="item.storeid === '33069557578d44e69bd91ad12d28a8d4'">寄售</span>-->
+                <div style="color: #333">{{orderList.buyentername || '(个人账户)'}}</div><div>&nbsp;|&nbsp;{{orderList.buyername}}</div>
               </template>
-              {{orderList.buyername}}&nbsp;|&nbsp;{{orderList.buyentername || '(个人账户)'}}
             </div>
-            <div class="pull-left" v-else @click="toShopdetails(orderList)">
-              <span class="labelInfo_ForItem" v-if="orderList.storeid === '33069557578d44e69bd91ad12d28a8d4'">寄售</span>
-              {{orderList.sellername}}</div>
-            <div class="pull-right">
-              <template v-if="vendorType === 'buyer'">
-                <span class="red" v-if="orderList.status === 505 || orderList.status === 406 || orderList.status === 407 || orderList.status === 403 || orderList.status === 408">待卖家发货</span>
-                <span class="red" v-else-if="orderList.status === 501 || orderList.status === 502 || orderList.status === 503 || orderList.status === 524">待付款</span>
-                <span class="red" v-else-if="orderList.status === 404">待收货</span>
-                <span class="red" v-else-if="orderList.status === 602 || orderList.status === 603 || orderList.status === 315 || orderList.status === 604 || orderList.status === 605 || orderList.status === 606">已取消</span>
-                <span class="red" v-else-if="orderList.status === 504">付款确认中</span>
-                <span class="red" v-else-if="orderList.status === 520 || orderList.status === 405">交易已完成</span>
-                <span class="red" v-else-if="orderList.status === 525">卖家请求取消</span>
-              </template>
-              <template v-else>
-                <span class="red" v-if="orderList.status === 502 || orderList.status === 406">买家已付款</span>
-                <!--<span class="red">待发货</span>-->
-                <span class="red" v-else-if="orderList.status === 602 || orderList.status === 603 || orderList.status === 315 || orderList.status === 604 || orderList.status === 605 || orderList.status === 606">订单已取消</span>
-                <span class="red" v-else-if="orderList.status === 501 || orderList.status === 524 ">待买家付款</span>
-                <span class="red" v-else-if="orderList.status === 404">待买家收货</span>
-                <span class="red" v-else-if="orderList.status === 405 || orderList.status === 514 || orderList.status === 503 || orderList.status === 506">待商城付款</span>
-                <span class="red" v-else-if="orderList.status === 606">交易关闭</span>
-                <span class="red" v-else-if="orderList.status === 520">交易完成</span>
-                <span class="red" v-else-if="orderList.status === 525">卖家发起取消,待确认</span>
-                <span class="red" v-else-if="orderList.status === 504">付款确认中</span>
-              </template>
+            <div class="pull-right" v-if="vendorType !== 'buyer'">
+              <div class="concat" @click="cancatAlert()">
+                <i class="iconfont icon-kefu1"></i>联系买家
+              </div>
+            </div>
+            <div class="pull-right" v-if="vendorType === 'buyer'">
+              <div class="concat" @click="cancatAlert()">
+                <i class="iconfont icon-kefu1"></i>联系卖家
+              </div>
             </div>
           </div>
           <div class="list-wrap-content" @click="toproductdetails(details)" v-for="(details, index) in orderList.purchaseDetails" v-if="index < showItem">
             <div class="list-item clearfix">
               <div class="list-wrap-content-brand clearfix pull-left">
                 <div class="name pull-left">品牌：</div>
-                <div class="pull-left">{{details.brName || '-'}}</div>
+                <div class="pull-left spec">{{details.brName || '-'}}</div>
+              </div>
+              <div class="pull-left list-wrap-content-brand clearfix">
+                <div class="name pull-left">交期(天)：</div>
+                <div class="pull-left spec noMargin">{{details.b2cMinDelivery}}-{{details.b2cMaxDelivery}}</div>
               </div>
-              <!--<div class="pull-right lab">-->
-                <!--{{details.goodsnumber || ''}}-->
-              <!--</div>-->
             </div>
             <div class="list-item clearfix">
               <div class="list-wrap-content-brand clearfix pull-left">
                 <div class="name pull-left">类目：</div>
-                <div class="pull-left">{{details.kiName || '-'}}</div>
+                <div class="pull-left spec">{{details.kiName || '-'}}</div>
               </div>
-              <div class="pull-right pri">
-                <span>¥</span>{{details.taxUnitprice || details.taxUnitPrice}}
+              <div class="pull-left list-wrap-content-brand clearfix">
+                <div class="name pull-left">单价：</div>
+                <div class="pull-left spec noMargin">
+                  <span>¥</span>{{details.taxUnitprice || details.taxUnitPrice}}
+                </div>
               </div>
             </div>
             <div class="list-item clearfix">
               <div class="list-wrap-content-brand clearfix pull-left">
                 <div class="name pull-left">型号：</div>
-                <div class="pull-left">{{details.cmpCode || '-'}}</div>
+                <div class="pull-left spec">{{details.cmpCode || '-'}}</div>
               </div>
-              <div class="pull-right lab">
-                <span>x</span>{{details.number}}
+              <div class="pull-left list-wrap-content-brand clearfix">
+                <div class="name pull-left">数量：</div>
+                <div class="pull-left spec noMargin"><span>x</span>{{details.number}}</div>
               </div>
             </div>
             <div class="list-item clearfix">
               <div class="list-wrap-content-brand clearfix pull-left">
                 <div class="name pull-left">规格：</div>
-                <div class="pull-left">{{details.spec || '-'}}</div>
+                <div class="pull-left spec">{{details.spec || '-'}}</div>
               </div>
-            </div>
-            <div class="list-item clearfix">
-              <div class="list-wrap-content-brand clearfix pull-left blue">
-                <div class="name pull-left blue">物料编码：</div>
-                <div class="pull-left">{{details.goodsnumber || '-'}}</div>
+              <div class="pull-left pri clearfix">
+                <div class="name pull-left">小计：</div>
+                <span>¥</span>{{details.ensurePrice}}
               </div>
             </div>
           </div>
         </li>
       </ul>
       <div class="lookMorePro" @click="showItem = orderList.purchaseDetails.length" v-if="showItem === 3 && orderList.purchaseDetails && orderList.purchaseDetails.length > 3">查看剩余产品<img src="/images/mobile/user/icon-right.png"/></div>
+      <!--<div class="clearfix top-w-wrap">-->
+        <!--<div class="name pull-left">订单备注</div>-->
+        <!--<div class="detailsinfo pull-left">{{orderList.purchaseRemark || '无'}}</div>-->
+      <!--</div>-->
       <div class="order-details-priInfo">
         <div class="clearfix">
-          <div class="pull-left">商品金额总计：</div>
-          <div class="pull-right">¥{{orderList.ensurePrice - orderList.fare | priceFiter}}</div>
-        </div>
-        <div class="clearfix">
-          <div class="pull-left">运费：</div>
-          <div class="pull-right">¥{{orderList.fare | priceFiter}}</div>
+          <div class="justifyAlign">运费：</div>
+          <span style="display: inline-block;min-width:2rem;text-align: left">
+              <a class="red" style="color:#f43938;">¥{{orderList.fare | priceFiter}}</a>
+          </span>
         </div>
         <div class="clearfix">
-          <div class="pull-left">手续费：</div>
-          <div class="pull-right"><a class="red" style="color:#f43938;">¥0.00</a><span class="del" style="text-decoration: line-through;color: #999;font-size: 0.24rem;">(¥{{parseFloat(orderList.ensurePrice * 0.0045).toFixed(2)}})</span></div>
+          <div class="justifyAlign">手续费：</div>
+          <span style="display: inline-block;width:2rem;text-align: left">
+            <a class="red" style="color:#f43938;">¥0.00</a>
+            <!--<a class="del" style="text-decoration: line-through;color: #999;font-size: 0.24rem;">(¥{{parseFloat(orderList.ensurePrice * 0.0045).toFixed(2)}})</a>-->
+            <span class="jianmian">减免</span>
+            <img src="/images/order/remem_icon.png" style="min-width:0.2rem;height:0.2rem" />
+          </span>
         </div>
-        <!--<div class="clearfix">-->
-          <!--<div class="pull-left">促销优惠：</div>-->
-          <!--<div class="pull-right">-¥13212.32132</div>-->
-        <!--</div>-->
-        <!--<div class="clearfix small">-->
-          <!--<div class="pull-left">积分冲抵：</div>-->
-          <!--<div class="pull-right">-¥13212.32132</div>-->
-        <!--</div>-->
       </div>
       <div class="list-all-info clearfix">
-        <div>共<span>{{orderList.batchQty}}</span>件商品&nbsp;&nbsp;合计：
-          <span class="pri"><a class="red">¥</a>{{orderList.ensurePrice}}</span>
-          <span class="lab">(含运费：<a class="red">¥</a><a class="red">{{orderList.fare | priceFiter}}</a>)</span></div>
+        <!--共<span>{{orderList.batchQty}}</span>件商品&nbsp;&nbsp;合计：-->
+        <div style="font-size: 0.27rem;" class="justifyAlign">合计：</div>
+        <span class="pri" style="min-width: 2rem;text-align: left"><a class="red" style="color:#f43938;font-size: 0.32rem;">¥</a>{{orderList.ensurePrice}}</span>
+        <!--<span class="lab">(含运费：<a class="red">¥</a><a class="red">{{orderList.fare | priceFiter}}</a>)</span>-->
         <!--<div>手续费：<a class="red">¥0.00</a><span class="del">(¥{{parseFloat(orderList.ensurePrice * 0.0045).toFixed(2)}})</span></div>-->
       </div>
       <div class="order-details-info">
+        <!--<div class="clearfix">-->
+          <!--<div class="name pull-left">配送方式</div>-->
+          <!--<div class="pull-right" :style="!orderList.rule.ruleName ? {lineHeight: '0.88rem'} : ''">-->
+            <!--<div :style="orderList.rule.ruleName ? {margin: '0.13rem 0 0.06rem 0'} : ''">{{orderList.sendType === 1301 ? '第三方配送' : (orderList.sendType === 1302 ? '卖家配送': '上门自提')}}</div>-->
+            <!--<div class="smallfont">{{orderList.rule.ruleName ? orderList.rule.ruleName : ''}}</div>-->
+          <!--</div>-->
+        <!--</div>-->
         <div class="clearfix">
-          <div class="name pull-left">配送方式</div>
+          <div class="name pull-left">收获地址</div>
           <div class="pull-right">
-            {{orderList.sendType === 1301 ? '第三方配送' : (orderList.sendType === 1302 ? '卖家配送': '上门自提')}}
-            <!--第三方配送-->
+            <div class="name" style="margin: 0.22rem 0 0 0">{{orderList.area.area}} &nbsp;&nbsp;{{orderList.area.detailAddress}}</div>
+          </div>
+          <div style="clear:both"></div>
+          <div style="padding-bottom: 0.1rem;" class="smallfont">
+            <span class="tel" style="width: 50%;display: inline-block">收货人: <a style="color: #333">{{orderList.area.name}}</a></span>
+            <span class="tel" style="width: 50%;display: inline-block">电话:<a style="color: #333">{{orderList.area.tel}}</a></span>
           </div>
         </div>
         <div class="clearfix">
-          <div class="name pull-left">配送规则</div>
-          <div class="pull-right">
-            ({{orderList.rule.ruleName ? orderList.rule.ruleName : ''}})
-          </div>
+          <div class="name pull-left">发票信息</div>
+          <template v-if="orderList.invoicetype === 1205 || orderList.invoicetype === 1206">
+            <div class="pull-right clearfix" @click="showinvoiceType = !showinvoiceType" style="line-height: 0.88rem;padding: 0;border-bottom: 0;max-width: 6rem;">
+              <div class="overHiddenText" style="float:left">{{orderList.invoicetitle}}</div>
+              <div class="smallfont" style="font-size: 0.24rem;float: left">
+                  ({{orderList.invoicetype === 1205 ? '增值税(专用)发票': '增值税普通发票'}})
+              </div>
+              <img src="/images/mobile/user/icon-right.png" :class="showinvoiceType ? 'dropList' : '' " style="float: left"/>
+            </div>
+          </template>
+          <template v-else>
+            <div class="pull-right clearfix" style="line-height: 0.88rem;padding: 0;border-bottom: 0;">
+              暂不开票
+            </div>
+          </template>
+
         </div>
         <div class="clearfix">
-          <div class="name pull-left">付款方式</div>
-          <div class="pull-right">
+          <div class="name pull-left">支付方式</div>
+          <div class="pull-right" style="line-height: 0.88rem">
             <!--{{orderList.paytype}}-->
             {{orderList.paytype === '1103' ? '线下付款' : '线下付款'}}
           </div>
         </div>
         <div class="clearfix">
-          <div class="name pull-left">发票信息</div>
-          <div class="pull-right" @click="(orderList.invoicetype === 1205 || orderList.invoicetype === 1206) ? showinvoiceType = !showinvoiceType : ''">
-            {{(orderList.invoicetype === 1205 || orderList.invoicetype === 1206) ? '查看更多信息' : '暂不开票'}}
-            <img src="/images/mobile/user/icon-right.png"  v-if="orderList.invoicetype === 1205 || orderList.invoicetype === 1206" :class="showinvoiceType ? 'dropList' : '' "/>
+          <template v-if="logisticsInfo.length === 0">
+            <div class="name pull-left">物流信息</div>
+            <div class="pull-right"  style="line-height: 0.88rem">暂无信息</div>
+          </template>
+          <template v-else>
+            <div class="name" style="line-height: 0.88rem;">物流信息</div>
+            <ul class="logistics_ul" v-if="logisticsInfo.length > 0" style="width: 100%">
+              <li class="clearfix" v-for="(item, index) in logisticsInfo">
+                <div class="pull-left" :class="index > 0 ? '' : 'marginL'">
+                  <div class="logistics_icon" :class="index > 0 ? '' : 'active'">
+                    <div class="red" v-if="index === 0"></div>
+                  </div>
+                </div>
+                <div class="pull-right" :class="index > 0 ? '' : 'marginT'">
+                  <div class="logistics_time">{{item.AcceptTime}}</div>
+                  <div class="logistics_info">{{item.AcceptStation}}</div>
+                </div>
+              </li>
+            </ul>
+          </template>
+        </div>
+      </div>
+      <div class="order-details-moreinfo clearfix">
+        <div class="clearfix moreinfoList">
+          <div class="pull-left">
+            <div class="">创建时间：
+              {{orderList.createtime || orderList.creattime | time2}}</div>
+            <div class="" v-if="vendorType === 'buyer'">付款时间：
+              <template v-if="getOverTiem(505) > 0">{{getOverTiem(505) | time2 }}</template>
+              <template v-else>暂未付款</template>
+            </div>
+            <div class="" v-else>付款时间：
+              <template v-if="getOverTiem(502) > 0">{{getOverTiem(502) | time2 }}</template>
+              <template v-else>暂未付款</template>
+            </div>
+            <div class="">发货时间：
+              <template v-if="getOverTiem(404) > 0">{{getOverTiem(404) | time2 }}</template>
+              <template v-else>暂未发货</template>
+            </div>
           </div>
+          <!--<div class="pull-right copyBtn" @click="copyBtn()">复制</div>-->
+        </div>
+        <div class="list-btn clearfix" ref="listBtn" v-show="ShowFixedBtn">
+          <template v-if="vendorType === 'buyer'">
+            <div class="sendGoods" v-if="orderList.status === 404" @click="buyerGetGoods(orderList)">确认收货</div>
+            <div class="sendGoods" v-if="!orderList.installmentId && (orderList.status === 503 || orderList.status === 501)" @click="gotoPay(orderList)">立即付款</div>
+            <div class="sendGoods" @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" v-if="orderList.installmentId && (orderList.status === 503 || orderList.status === 504 || orderList.status === 524 ) && orderList.installment.status !== 505 && !orderList.againUpload">立即付款</div>
+            <div class="" @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" v-if="orderList.installmentId && (orderList.status === 503 || orderList.status === 504 || orderList.status === 524 ) && orderList.installment.status !== 505 && orderList.againUpload">重新上传</div>
+            <div class="" @click="cancelOrder(orderList)" v-if="orderList.status === 503 || orderList.status === 501 || orderList.status === 502">取消订单</div>
+            <div @click="paidTime(orderList)" class="" v-if="_getHoursFromNow(orderList.paytime) > sellsendGoodsTime - 1 && orderList.status !== 404 ">提醒发货</div>
+            <!--<div @click="lookLogisticsInfo(orderList)" class="" v-if="orderList.status === 404 || orderList.status === 520 || orderList.status === 405 || orderList.status === 521">查看物流</div>-->
+          </template>
+          <template v-else>
+            <div class="sendGoods" v-if="(orderList.status === 502 || orderList.status === 406) && !orderList.uasPurcid" @click="sendGoods(orderList)">点击发货</div>
+            <div @click="changelogistics(orderList)" class="sendGoods" v-if="orderList.status === 404 && !orderList.uasPurcid && status === ''">修改物流</div>
+            <!--<div @click="lookLogisticsInfo(orderList)" class="" v-if="orderList.status === 404 || orderList.status === 520 || orderList.status === 405 || orderList.status === 503 || orderList.status === 514">查看物流</div>-->
+            <div @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" class="" v-if="orderList.installmentId && ((orderList.installment.status === 503 && orderList.Overtime) || orderList.installment.status === 504) && orderList.status !== 606 && orderList.status !== 525">
+              取消订单
+            </div>
+            <div @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" class="" v-if="installmentDetailPaid(orderList) && orderList.status !== 525 && orderList.status !== 606">
+              确认收款
+            </div>
+          </template>
         </div>
       </div>
-      <!-- 发票信息 -->
-      <div class="order-details-invoiceinfo" v-if="orderList.invoicetype === 1205 || orderList.invoicetype === 1206" v-show="showinvoiceType">
+    </div>
+    <!-- 发票信息 -->
+    <div class="mobile-modal" @touchmove="preventTouchMove($event)" v-if="orderList.invoicetype === 1205 || orderList.invoicetype === 1206" v-show="showinvoiceType">
+      <div class="sendGoods_Alert">
+        <div class="sendGoods_title">发票信息<span><i class="iconfont icon-guanbi1" @click="showinvoiceType = false"></i></span></div>
+        <div class="order-details-invoiceinfo" >
         <div class="invoiceList clearfix" >
           <div class="pull-left">发票类型：</div>
           <div class="pull-right">
@@ -217,55 +287,10 @@
           <div class="pull-left">详细地址：</div>
           <div class="pull-right">{{invoiceAddress.area}}{{invoiceAddress.detailAddress}}</div>
         </div>
-      </div>
-      <div class="order-details-moreinfo clearfix">
-        <div class="clearfix moreinfoList">
-          <div class="pull-left">
-            <div class="">订单编号：
-              <span id="orderNumber">{{orderList.orderid}}</span>
-              <textarea id="input" cols="1" rows="1" style="position: fixed;left: 0px;top: 0px;">这是幕后黑手</textarea>
-            </div>
-            <div class="">创建时间：
-              {{orderList.createtime || orderList.creattime | time}}</div>
-            <div class="" v-if="vendorType === 'buyer'">付款时间：
-              <template v-if="getOverTiem(505) > 0">{{getOverTiem(505) | time }}</template>
-              <template v-else>暂未付款</template>
-            </div>
-            <div class="" v-else>付款时间：
-              <template v-if="getOverTiem(502) > 0">{{getOverTiem(502) | time }}</template>
-              <template v-else>暂未付款</template>
-            </div>
-            <div class="">发货时间：
-              <template v-if="getOverTiem(404) > 0">{{getOverTiem(404) | time }}</template>
-              <template v-else>暂未发货</template>
-            </div>
-          </div>
-          <div class="pull-right copyBtn" @click="copyBtn()">复制</div>
-        </div>
-        <div class="list-btn clearfix">
-          <template v-if="vendorType === 'buyer'">
-            <div class="sendGoods" v-if="orderList.status === 404" @click="buyerGetGoods(orderList)">确认收货</div>
-            <div class="sendGoods" v-if="!orderList.installmentId && (orderList.status === 503 || orderList.status === 501)" @click="gotoPay(orderList)">立即付款</div>
-            <div class="sendGoods" @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" v-if="orderList.installmentId && (orderList.status === 503 || orderList.status === 504 || orderList.status === 524 ) && orderList.installment.status !== 505 && !orderList.againUpload">立即付款</div>
-            <div class="" @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" v-if="orderList.installmentId && (orderList.status === 503 || orderList.status === 504 || orderList.status === 524 ) && orderList.installment.status !== 505 && orderList.againUpload">重新上传</div>
-            <div class="" @click="cancelOrder(orderList)" v-if="orderList.status === 503 || orderList.status === 501 || orderList.status === 502">取消订单</div>
-            <div @click="paidTime(orderList)" class="" v-if="_getHoursFromNow(orderList.paytime) > sellsendGoodsTime - 1 && orderList.status !== 404 ">提醒发货</div>
-            <div @click="lookLogisticsInfo(orderList)" class="" v-if="orderList.status === 404 || orderList.status === 520 || orderList.status === 405 || orderList.status === 521">查看物流</div>
-          </template>
-          <template v-else>
-            <div class="sendGoods" v-if="(orderList.status === 502 || orderList.status === 406) && !orderList.uasPurcid" @click="sendGoods(orderList)">点击发货</div>
-            <div @click="changelogistics(orderList)" class="sendGoods" v-if="orderList.status === 404 && !orderList.uasPurcid && status === ''">修改物流</div>
-            <div @click="lookLogisticsInfo(orderList)" class="" v-if="orderList.status === 404 || orderList.status === 520 || orderList.status === 405 || orderList.status === 503 || orderList.status === 514">查看物流</div>
-            <div @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" class="" v-if="orderList.installmentId && ((orderList.installment.status === 503 && orderList.Overtime) || orderList.installment.status === 504) && orderList.status !== 606 && orderList.status !== 525">
-              取消订单
-            </div>
-            <div @click="onMind('此订单为分期付款，请前往【PC】端进行相关操作')" class="" v-if="installmentDetailPaid(orderList) && orderList.status !== 525 && orderList.status !== 606">
-              确认收款
-            </div>
-          </template>
         </div>
       </div>
     </div>
+    <!-- /end -->
     <!-- 发货弹窗 -->
     <div class="mobile-modal" v-if="showSend" @touchmove="preventTouchMove($event)">
       <div class="sendGoods_Alert">
@@ -374,7 +399,6 @@
       </div>
     </div>
     <!-- /联系买卖家 -->
-
     <remind-box :title="collectResult" :timeoutCount="timeoutCount"></remind-box>
   </div>
 </template>
@@ -388,6 +412,7 @@
       middleware: 'authenticated',
       data() {
         return {
+          ShowFixedBtn: false, // 是否显示悬浮按钮
           showStoreInfo: false, // 联系信息弹窗
           showinvoiceType: false, // 是否展示发票信息
           cancatInfo: {
@@ -401,7 +426,7 @@
           sendGoodsInfo: { // 发货弹窗对象
             area: {}
           },
-          status: '', // 物流状态
+          status: '1', // 物流状态
           peisongShow: false, // 是否显示配送商选择弹窗
           seekKeyword: '',
           peisongChooseIndex: 0, // 配送商选择下标
@@ -415,7 +440,8 @@
           $Orderreason: '', // 取消订单原因
           OrderCancelIndex: '', // 取消订单原因下标
           showItem: 3, // 允许展示多个产品
-          invoiceAddress: {} // 发票信息
+          invoiceAddress: {}, // 发票信息
+          logisticsInfo: [] // 物流信息
         }
       },
       async asyncData({route}) {
@@ -466,6 +492,38 @@
         priceFiter(val) {
           if (!val) return '0.00'
           return val.toFixed(2)
+        },
+        time: function (time) {
+          if (typeof time === 'number') {
+            if (!time) {
+              return '无'
+            } else {
+              let d = new Date(time)
+              let year = d.getFullYear()
+              let month = d.getMonth() + 1
+              let day = d.getDate() < 10 ? '0' + d.getDate() : '' + d.getDate()
+              return year + '-' + month + '-' + day
+            }
+          }
+        },
+        time2: function (time) {
+          if (typeof time === 'number') {
+            if (!time) {
+              return '无'
+            } else {
+              let d = new Date(time)
+              let year = d.getFullYear()
+              let month = d.getMonth() + 1
+              let day = d.getDate() < 10 ? '0' + d.getDate() : '' + d.getDate()
+              let hour = d.getHours() < 10 ? '0' + d.getHours() : '' + d.getHours()
+              let minutes = d.getMinutes() < 10 ? '0' + d.getMinutes() : '' + d.getMinutes()
+              let seconds = d.getSeconds() < 10 ? '0' + d.getSeconds() : '' + d.getSeconds()
+              let _arr = [year, month, day].map(item => {
+                return item.toString().length < 2 ? '0' + item : item
+              })
+              return _arr.join('-') + ' ' + hour + ':' + minutes + ':' + seconds
+            }
+          }
         }
       },
       created() {
@@ -473,6 +531,7 @@
           this.$http.get(`/trade/logistics/${this.orderList.lgtId}`).then(data => {
             this.$http.get(`/kdn/logistics/query?companyName=${data.data.companyName}&logisticsCode=${data.data.number}`).then(res => {
               let str = res.data.traces
+              this.logisticsInfo = JSON.parse(str).reverse()
               if (str.indexOf('揽件') !== -1 || str.indexOf('收件') !== -1 || str.indexOf('转运') !== -1 || str.indexOf('运输') !== -1 || str.indexOf('发往') !== -1 ||
                 str.indexOf('发出') !== -1 || str.indexOf('收入') !== -1 || str.indexOf('扫描') !== -1 || str.indexOf('到达') !== -1) {
                 this.status = 'transit'
@@ -888,6 +947,11 @@
       },
       components: {
         RemindBox
+      },
+      mounted() {
+        this.$nextTick(res => {
+          this.$refs.listBtn.children.length > 0 ? this.ShowFixedBtn = true : this.ShowFixedBtn = false
+        })
       }
     }
 </script>
@@ -906,33 +970,43 @@
     margin: 1.26rem 0 0.98rem 0;
     height: calc(100vh - 1.26rem - 0.98rem);
     overflow-y: scroll;
+    position: absolute;
     .order-details-wrap {
       .order-details-top {
-        .top-t-wrap {
+        .orderNumber {
+          margin-bottom: 0.2rem;
+          font-size: 0.27rem;
+          color: #666;
+          @include lineHeight(0.88rem);
+          background: #fff;
+          padding: 0 0.2rem;
+          .pull-left {
+            width: 5rem;
+            @include overFlowHidden();
+            span {
+              color: #3f84f6
+            }
+          }
+        }
+        .orderStatus {
           background: #fff;
           padding: 0 0.2rem;
           height: 0.88rem;
           line-height: 0.88rem;
-          .pull-left {
+          margin-bottom: 0.2rem;
+          .clearfix {
             font-size: 0.28rem;
             color: #333;
             span {
-              color: #f21c1c
+              float: left;
+              color: #333;
             }
-          }
-          .pull-right {
-            @include lineHeight(0.56rem);
-            border: 1px solid #3f84f6;
-            color: #3f84f6;
-            font-size: 0.26rem;
-            text-align: center;
-            border-radius: 3px;
-            margin-top: 0.14rem;
-            padding: 0 0.1rem;
-            overflow: hidden;
-            i {
-              font-size: 0.26rem;
-              margin-left: 0.05rem;
+            img {
+              width: 0.18rem;
+              height: 0.32rem;
+              vertical-align: top;
+              margin-top: 0.18rem;
+              margin-left: 0.1rem;
             }
           }
         }
@@ -961,37 +1035,73 @@
             }
           }
         }
-        .top-w-wrap {
+
+      }
+      .order-list-wrap {
+        .top-t-wrap {
           background: #fff;
-          margin: 0.2rem 0;
           padding: 0 0.2rem;
-          @include lineHeight(0.88rem);
-          .name {
-            color: #333;
+          height: 0.88rem;
+          line-height: 0.88rem;
+          .pull-left {
             font-size: 0.28rem;
-            margin-right: 0.2rem;
+            color: #333;
+            width: 5rem;
+            @include overFlowHidden();
+            div {
+              max-width: 3rem;
+              @include overFlowHidden();
+              float: left;
+            }
+            img {
+              width: 0.18rem;
+              height: 0.32rem;
+              vertical-align: top;
+              margin-top: 0.18rem;
+              margin-left: 0.1rem;
+            }
           }
-          .detailsinfo {
-            font-size: 0.28rem;
-            color: #999;
-            width: 5.6rem;
-            @include overFlowHidden()
+          .pull-right {
+            @include lineHeight(0.56rem);
+            border: 1px solid #3f84f6;
+            color: #3f84f6;
+            font-size: 0.26rem;
+            text-align: center;
+            border-radius: 3px;
+            margin-top: 0.14rem;
+            padding: 0 0.1rem;
+            overflow: hidden;
+            i {
+              font-size: 0.26rem;
+              margin-left: 0.05rem;
+            }
           }
         }
-      }
-      .order-list-wrap {
         li {
           margin-top: 0.2rem;
         }
         .list-wrap-title{
           padding: 0 0.2rem;
           background: #fff;
-          @include lineHeight(0.88rem);
+          @include lineHeight(0.67rem);
           font-size: 0.28rem;
           color: #333;
+          border-bottom: 1px solid #e4e4e4;
           .pull-left {
             width: 5rem;
-            @include overFlowHidden()
+            @include overFlowHidden();
+            span {
+              max-width: 3rem;
+              @include overFlowHidden();
+              display: inline-block;
+            }
+            img {
+              width: 0.18rem;
+              height: 0.32rem;
+              vertical-align: top;
+              margin-top: 0.18rem;
+              margin-left: 0.1rem;
+            }
           }
           .pull-right {
             .red {
@@ -1007,21 +1117,21 @@
           .list-item {
             font-size: 0.28rem;
             color: #333;
-            margin-top: 0.18rem;
+            /*line-height: 0.5rem;*/
+            margin-top: 0.22rem;
             &:nth-child(1) {
               margin-top: 0px;
             }
-            &:nth-child(2) {
-              margin-top: 0.21rem;
-            }
-            &:nth-child(3) {
-              margin-top: 0.1rem;
-            }
             .list-wrap-content-brand {
               @include overFlowHidden();
               .spec {
-                width: 4rem;
-                @include overFlowHidden()
+                width: 3.1rem;
+                @include overFlowHidden();
+                margin-right: 0.2rem;
+                &.noMargin {
+                  margin-right: 0;
+                  width: 1.5rem;
+                }
               }
             }
             .name {
@@ -1037,16 +1147,8 @@
               }
             }
             .pri {
-              font-size: 0.32rem;
+              font-size: 0.28rem;
               color: #f43938;
-              max-width: 2.2rem;
-              @include overFlowHidden();
-              span {
-                font-size: 0.24rem;
-              }
-            }
-            .blue {
-              color: #3f84f6
             }
           }
         }
@@ -1072,6 +1174,23 @@
           }
         }
       }
+      .top-w-wrap {
+        background: #fff;
+        padding: 0 0.2rem;
+        border-bottom: 1px solid #e4e4e4;
+        @include lineHeight(0.88rem);
+        .name {
+          color: #333;
+          font-size: 0.28rem;
+          margin-right: 0.2rem;
+        }
+        .detailsinfo {
+          font-size: 0.28rem;
+          color: #999;
+          width: 5.6rem;
+          @include overFlowHidden()
+        }
+      }
       .lookMorePro {
         background: #fff;
         font-size: 0.28rem;
@@ -1089,30 +1208,45 @@
         }
       }
       .order-details-priInfo {
-        margin-top: 0.2rem;
-        border-top: 1px solid #e4e4e4;
+        /*border-top: 1px solid #e4e4e4;*/
         border-bottom: 1px solid #e4e4e4;
         font-size: 0.28rem;
         color: #333;
-        padding: 0.2rem;
+        padding: 0.1rem;
         background: #fff;
+        text-align: right;
         .clearfix {
           @include lineHeight(0.5rem);
         }
+        span {
+          @include overFlowHidden();
+        }
         .small {
           font-size: 0.24rem;
           color: #999;
         }
+        .jianmian {
+          font-size: 0.22rem;
+          color: #fff;
+          width: 0.48rem;
+          height:0.25rem;
+          text-align: center;
+          line-height: 0.25rem;
+          background: #15b262;
+          margin: 0 0.1rem;
+        }
       }
       .list-all-info{
         text-align: right;
         background: #fff;
-        padding: 0 0.2rem;
-        @include overFlowHidden();
-        line-height: 0.5rem;
+        padding: 0 0.1rem;
+        @include lineHeight(0.72rem);
         font-size: 0.26rem;
         color: #333;
         border-bottom: 1px solid #e4e4e4;
+        span {
+          display: inline-block;
+        }
         .pri {
           font-size: 0.32rem;
           color: #f43938;
@@ -1135,26 +1269,27 @@
         background: #fff;
         margin-top: 0.2rem;
         .clearfix{
+          padding: 0 0.2rem;
+          font-size: 0.28rem;
+          color: #333;
+          .pull-left {
+            @include lineHeight(0.88rem);
+          }
           img {
-            transform: rotate(90deg);
-            width: 0.16rem;
-            height: 0.26rem;
+            width: 0.18rem;
+            height: 0.32rem;
             vertical-align: top;
             margin-top: 0.3rem;
             margin-left: 0.1rem;
             margin-right: 0.1rem;
-            &.dropList {
-              transform: rotate(270deg);
-            }
           }
-          padding: 0 0.2rem;
-          font-size: 0.28rem;
-          color: #666;
-          @include lineHeight(0.89rem);
           border-bottom: 1px solid #e4e4e4;
           .pull-right {
-            @include overFlowHidden();
             max-width: 5rem;
+            text-align: right;
+          }
+          .smallfont{
+            color: #666;
           }
         }
       }
@@ -1204,6 +1339,71 @@
           }
         }
       }
+      .logistics_ul {
+        background: #fff;
+        li.clearfix {
+          position: relative;
+          border-left: 2px solid #e4e5ea;
+          margin-left: 0.2rem;
+          border-bottom: 0px;
+          .pull-left {
+            position: absolute;
+            left: -7px;
+            top: 0.36rem;
+            .logistics_icon {
+              width: 12px;
+              height: 12px;
+              border-radius: 50%;
+              background: #b5b5b5;
+              &.active {
+                width: 20px;
+                height: 20px;
+                border-radius: 50%;
+                background: rgba(0, 0, 0, 0);
+                position: relative;
+                &~.logistics_line {
+                  margin-left: 9px;
+                }
+                .red {
+                  position: absolute;
+                  width: 12px;
+                  height: 12px;
+                  background: #0ca43a;
+                  margin-left: 4px;
+                  margin-top: 4px;
+                  border-radius: 50%;
+                }
+              }
+            }
+            &.marginL {
+              left: -10px;
+              top: -0.1rem
+            }
+          }
+          .pull-right {
+            padding-top: 0.2rem;
+            font-size: 0.24rem;
+            color: #333;
+            border-bottom: 1px solid #f3f3f3;
+            padding-bottom: 0.2rem;
+            max-width: 6.4rem;
+            width: 6.4rem;
+            .logistics_time {
+              @include lineHeight(20px);
+            }
+            .logistics_info {
+              margin-top: 0.2rem;
+              word-break:break-all;
+              word-wrap: break-word;
+              line-height: 0.45rem
+            }
+            &.marginT {
+              padding-top: 0;
+              margin-top: -0.1rem;
+            }
+          }
+        }
+      }
     }
     .sendGoods_Alert {
       background: #fff;
@@ -1565,7 +1765,7 @@
       border-radius: 3px;
     }
     .order-details-invoiceinfo {
-      padding: 0.1rem 0.4rem;
+      padding: 0.1rem 0.2rem;
       background: #fff;
       .invoiceList {
         font-size: 0.24rem;
@@ -1581,5 +1781,22 @@
         }
       }
     }
+    .overHiddenText {
+      @include overFlowHidden();
+      max-width: 3rem;
+    }
+    .justifyAlign {
+      width: 1.2rem;
+      display:inline-block;
+      text-align: justify;
+      vertical-align:top;
+    }
+    .justifyAlign::after{
+      content:"";
+      display: inline-block;
+      width:100%;
+      overflow:hidden;
+      height:0;
+    }
   }
 </style>

pages/mobile/order/index.vue

@@ -6,16 +6,27 @@
       <div :class="activeType === 'comfirmed' ? 'active' : ''" @click="ChangeList('comfirmed')"><span>待发货</span></div>
       <div :class="activeType === 'inbound' ? 'active' : ''" @click="ChangeList('inbound')"><span>待收货</span></div>
     </div>
+    <div class="search-content search-content2" >
+      <input type="text" placeholder="订单号/产品信息/买家名字" v-model="keyword" @keyup.13="searchOrderlist">
+      <span @click="searchOrderlist" >
+          <i class="iconfont icon-sousuo"></i>
+      </span>
+    </div>
     <ul class="order-list-wrap"  id="order-wrapper" v-show="orderList.length > 0">
       <li class="clearfix" v-for="item in orderList">
+        <div class="orderNumber clearfix">
+          <div class="pull-left">订单号：<span>{{item.orderid}}</span></div>
+          <div class="pull-right">{{item.createtime || item.creattime | time}}</div>
+        </div>
         <div class="list-wrap-title clearfix">
           <div class="pull-left" v-if="vendorType !== 'buyer'" @click="toShopdetails(item)">
-            <span class="labelInfo_ForItem" v-if="item.storeid === '33069557578d44e69bd91ad12d28a8d4'">寄售</span>
-            {{item.buyername}}&nbsp;|&nbsp;{{item.buyentername || '(个人账户)'}}
+            <span>买家：</span>
+            <!--<span class="labelInfo_ForItem" v-if="item.storeid === '33069557578d44e69bd91ad12d28a8d4'">寄售</span>-->
+            <span>{{item.buyentername || '(个人账户)'}}</span><span>&nbsp;|&nbsp;{{item.buyername}}</span>
           </div>
-          <div class="pull-left" v-else @click="toShopdetails(item)">
-            <span class="labelInfo_ForItem" v-if="item.storeid === '33069557578d44e69bd91ad12d28a8d4'">寄售</span>
-            {{item.sellername}}</div>
+          <div class="pull-left" v-else @click="toShopdetails(item)">卖家：
+            <!--<span class="labelInfo_ForItem" v-if="item.storeid === '33069557578d44e69bd91ad12d28a8d4'">寄售</span>-->
+            {{item.sellername}}<img src="/images/mobile/user/icon-right.png"/></div>
           <div class="pull-right">
             <template v-if="vendorType === 'buyer'">
               <span class="red" v-if="item.status === 505 || item.status === 406 || item.status === 407 || item.status === 403 || item.status === 408">待卖家发货</span>
@@ -40,7 +51,7 @@
             </template>
           </div>
         </div>
-        <div class="list-wrap-content" @click="toproductdetails(details)" v-for="(details, index) in item.purchaseDetails" v-if="index < 3">
+        <div class="list-wrap-content" @click="toproductdetails(details)" v-for="(details, index) in item.purchaseDetails" v-if="index < item.showItem">
           <div class="list-item clearfix">
             <div class="list-wrap-content-brand clearfix pull-left">
               <div class="name pull-left">品牌：</div>
@@ -55,8 +66,9 @@
               <div class="name pull-left">类目：</div>
               <div class="pull-left spec">{{details.kiName || '-'}}</div>
             </div>
-            <div class="pull-right pri">
-              <span>¥</span>{{details.taxUnitprice || details.taxUnitPrice}}
+            <div class="pull-left list-wrap-content-brand clearfix">
+              <div class="name pull-left">单价：</div>
+              <div class="pull-left spec noMargin">{{details.taxUnitprice || details.taxUnitPrice}}</div>
             </div>
           </div>
           <div class="list-item clearfix">
@@ -64,8 +76,9 @@
               <div class="name pull-left">型号：</div>
               <div class="pull-left spec">{{details.cmpCode || '-'}}</div>
             </div>
-            <div class="pull-right lab">
-              <span>x</span>{{details.number}}
+            <div class="pull-left list-wrap-content-brand clearfix">
+              <div class="name pull-left">数量：</div>
+              <div class="pull-left spec noMargin"><span>x</span>{{details.number}}</div>
             </div>
           </div>
           <div class="list-item clearfix">
@@ -73,14 +86,16 @@
               <div class="name pull-left">规格：</div>
               <div class="pull-left spec">{{details.spec || '-'}}</div>
             </div>
+            <div class="pull-left pri clearfix">
+              <div class="name pull-left">小计：</div>
+              <span>¥</span>{{details.ensurePrice}}
+            </div>
           </div>
         </div>
+        <div class="lookMorePro" @click="item.showItem = item.purchaseDetails.length" v-if="item.showItem === 3 && item.purchaseDetails && item.purchaseDetails.length > 3">查看更多<img src="/images/mobile/user/icon-right.png"/></div>
         <div class="list-all-info clearfix">
-          <div class="orderNumber clearfix">
-            <div class="pull-left">{{item.createtime || item.creattime | time}}</div>
-            <div class="pull-right">订单号：{{item.orderid}}</div>
-          </div>
-          <div>共<span>{{item.batchQty}}</span>件商品&nbsp;&nbsp;合计：
+          <!--共<span>{{item.batchQty}}</span>件商品&nbsp;&nbsp;-->
+          <div>合计：
             <span class="pri"><a class="red">¥</a>{{item.ensurePrice }}</span>
             <span class="lab">(含运费：<a class="red">¥</a><a class="red">{{item.fare | priceFiter}}</a>)</span></div>
         </div>
@@ -299,7 +314,8 @@
         cancelList: ['我不想买了', '信息填写有误，重新购买', '先看看样品再下单', '付款遇到问题（如余额不足、超出限额等）', '买错了', '其他原因'], // 取消订单原因数组
         $CancenOrderId: '', // 取消订单id
         $Orderreason: '', // 取消订单原因
-        OrderCancelIndex: '' // 取消订单原因下标
+        OrderCancelIndex: '', // 取消订单原因下标
+        keyword: ''
       }
     },
     computed: {
@@ -330,6 +346,17 @@
       }
     },
     methods: {
+      // 搜索
+      searchOrderlist() {
+        this.page = 1
+        if (this.$route.query.type !== 'buyer') {
+          // 卖家中心
+          this.sellOrderList(this.activeType)
+        } else {
+          // 买家中心
+          this.buyerOrderList(this.activeType)
+        }
+      },
       // 确认付款
       gotoPay(item) {
         let id = EncryptionFilter(item.orderid)
@@ -369,7 +396,8 @@
           status: this.$status,
           storeType: 'other',
           isRate: false,
-          currentPage: this.page
+          currentPage: this.page,
+          keyword: this.keyword
         }
         if (this.vendorType === 'buyer') {
           params.sorting = { creattime: 'DESC' }
@@ -382,6 +410,7 @@
         })
       },
       ChangeList(_tp) {
+        this.keyword = ''
         this.activeType = _tp
         this.page = 1
         if (this.$route.query.type !== 'buyer') {
@@ -410,7 +439,8 @@
           isRate: false,
           currentPage: 1,
           sorting: { creattime: 'DESC' },
-          status: status
+          status: status,
+          keyword: this.keyword
         })
       },
       // 卖家中心订单列表加载数据
@@ -432,7 +462,8 @@
           page: 1,
           sorting: {createtime: 'DESC'},
           status: status,
-          storeType: 'other'
+          storeType: 'other',
+          keyword: this.keyword
         })
       },
       // 是否为分期付款
@@ -783,6 +814,7 @@
             // _obj[i].paidTimeFromNow = this._getHoursFromNow(_obj[i].paytime)
             // _obj[i].lastNotiDelivery = this._getHoursFromNow(_obj[i].lastNotifyDeliveryTime)
           }
+          _obj[i].showItem = _obj[i].purchaseDetails.length > 3 ? 3 : _obj[i].purchaseDetails.length
         }
         return _obj
       },
@@ -870,21 +902,47 @@
       }
     }
   }
+  .search-content2 {
+    text-align: center;
+    padding: .25rem 0 0 0;
+    margin-top: 0 !important;
+    input {
+      width: 7.1rem;
+      border: 1px solid #376ff3;
+    }
+    span {
+      height: .46rem;
+      line-height: .46rem;
+    }
+  }
   .order-list-wrap {
-    height: calc(100vh - 1.26rem - 0.96rem - 0.84rem);
+    height: calc(100vh - 1.26rem - 0.96rem - 0.84rem - 1rem);
     overflow-y: scroll;
     li {
-      margin-top: 0.2rem;
+      margin-bottom: 0.2rem;
     }
     .list-wrap-title{
        padding: 0 0.2rem;
        background: #fff;
-       @include lineHeight(0.88rem);
+       @include lineHeight(0.67rem);
        font-size: 0.28rem;
        color: #333;
+       border-bottom: 1px solid #e4e4e4;
        .pull-left {
          width: 5rem;
-         @include overFlowHidden()
+         @include overFlowHidden();
+         span {
+           max-width: 3rem;
+           @include overFlowHidden();
+           display: inline-block;
+         }
+         img {
+           width: 0.18rem;
+           height: 0.32rem;
+           vertical-align: top;
+           margin-top: 0.18rem;
+           margin-left: 0.1rem;
+         }
        }
        .pull-right {
          .red {
@@ -901,21 +959,20 @@
         font-size: 0.28rem;
         color: #333;
         /*line-height: 0.5rem;*/
-        margin-top: 0.18rem;
+        margin-top: 0.22rem;
         &:nth-child(1) {
           margin-top: 0px;
         }
-        &:nth-child(2) {
-          margin-top: 0.21rem;
-        }
-        &:nth-child(3) {
-          margin-top: 0.1rem;
-        }
         .list-wrap-content-brand {
           @include overFlowHidden();
           .spec {
-            width: 4rem;
-            @include overFlowHidden()
+            width: 3.4rem;
+            @include overFlowHidden();
+            margin-right: 0.2rem;
+            &.noMargin {
+              margin-right: 0;
+              width: 1.5rem;
+            }
           }
         }
         .name {
@@ -931,13 +988,23 @@
           }
         }
         .pri {
-          font-size: 0.32rem;
+          font-size: 0.28rem;
           color: #f43938;
-          max-width: 2.2rem;
-          @include overFlowHidden();
-          span {
-            font-size: 0.24rem;
-          }
+        }
+      }
+    }
+    .orderNumber {
+      font-size: 0.27rem;
+      color: #666;
+      border-bottom: 1px solid #e4e4e4;
+      @include lineHeight(0.88rem);
+      background: #fff;
+      padding: 0 0.2rem;
+      .pull-left {
+        width: 5rem;
+        @include overFlowHidden();
+        span {
+          color: #3f84f6
         }
       }
     }
@@ -950,11 +1017,6 @@
       font-size: 0.26rem;
       color: #333;
       border-bottom: 1px solid #e4e4e4;
-      .orderNumber {
-        font-size: 0.24rem;
-        color: #999;
-        border-bottom: 1px solid #e4e4e4;
-      }
       .pri {
         font-size: 0.32rem;
         color: #f43938;
@@ -1004,6 +1066,22 @@
         }
       }
     }
+    .lookMorePro {
+      background: #fff;
+      font-size: 0.28rem;
+      color: #999;
+      text-align: center;
+      border-bottom: 1px solid #e4e4e4;
+      @include lineHeight(0.67rem);
+      img {
+        transform: rotate(90deg);
+        width: 0.16rem;
+        height: 0.26rem;
+        vertical-align: top;
+        margin-top: 0.23rem;
+        margin-left: 0.1rem;
+      }
+    }
   }
   .sendGoods_Alert {
     background: #fff;