物流3.0优化，和退款详情的图片

yvan.ni
1 parent 1c4b2bd4
Showing 9 changed files with 498 additions and 46 deletions
components/nodata/nodata.js
components/nodata/nodata.wxss
packageF/pages/user/return_goods_info/return_goods_info.js
packageF/pages/user/return_goods_info/return_goods_info.wxml
packageG/pages/user/express/exp_filter.wxs
packageG/pages/user/express/express.js
packageG/pages/user/express/express.json
packageG/pages/user/express/express.wxml
packageG/pages/user/express/express.wxss
@@ -7,7 +7,7 @@ Component({
     // 完整的定义方式
     title:{
       type:String,
-      value:10
+      value:''
     }
   },
   /*** 页面的初始数据***/
@@ -13,4 +13,5 @@
 	padding-bottom: 40rpx;
 	color: #bbb;
 	font-size: 28rpx;
+	text-align: center;
 }
 \ No newline at end of file
@@ -176,5 +176,19 @@ Page({
             current: r[e.currentTarget.dataset.idx],
             urls: r
         });
-    }
+    },
+
+
+    //---图片失败，默认图片---
+    bind_bnerr2: function (e) {
+      var _errImg = e.target.dataset.errorimg;
+      var _errurl = e.target.dataset.url;
+      var ii = _errurl.indexOf(os.imghost);
+      if (ii != -1) {
+        var _errObj = {};
+        _errObj[_errImg] = "/miniapp/images/default_g_img.gif";
+        this.setData(_errObj) //注意这里的赋值方式,只是将数据列表中的此项图片路径值替换掉 ; 
+      }
+    },
+  
 });
 \ No newline at end of file
@@ -7,9 +7,15 @@
     </view>
 </view>
 <view class="goods-mes" wx:for="{{return_goods.goodslist}}">
+
     <view class="goods-pic">
-        <image class="wh100" src="{{resourceUrl+item.original_img}}" lazy-load="true"></image>
+        <image class="wh100" src="{{resourceUrl+item.original_img}}" 
+          binderror="bind_bnerr2" 
+          data-url="{{resourceUrl+item.original_img}}" 
+          data-errorimg="return_goods.goodslist[{{index}}].original_img"
+          lazy-load="true"></image>
     </view>
+
     <view class="goods-des">
         <view class="goods-name ellipsis-1">{{item.goods_name}}</view>
         <view class="now-price co-red" wx:if="{{return_goods.goods_id}}">退款金额 : ￥{{return_goods.back_money}}</view>
+module.exports = {
+
+  state_format:function (express){
+	if(!express) return '无轨迹';
+	if(express.State==-1) return '无轨迹';
+	if(express.State==0) return '已揽件';
+	if(express.State==1) return '在途中';
+	if(express.State==2) return '正在派件';
+	if(express.State==3) return '已签收';
+	if(express.State==4) return '派送失败';
+	if(express.State==5) return '疑难件';
+	if(express.State==6) return '退件签收';
+	return '其他';
+  }
+
+}
 \ No newline at end of file
 var e = getApp(), s = e.request,oo=e.globalData,os=oo.setting;
+var  ut = require("../../../../utils/util.js");
  
 Page({
     data: {
@@ -7,35 +8,227 @@ Page({
         delivery: null,
         express: null,
         re_arr:null,//反转后的数组
-        error: "快递信息异常"
+        error: "快递信息异常",
+        active:0,
+        has_connaect:1,
+        is_get:0
     },
     onLoad: function(e) {
-        this.requestDelivery(e.order_id);
+
+        var th=this;
+        //----获取系统参数-----
+        getApp().getConfig2(function (ee) {
+            var  is_connaect=1;
+
+            if(ee.switch_list){
+                var json_d = JSON.parse(ee.switch_list);
+                if(json_d.weapp_customertype==0){
+                    is_connaect=0;
+                }
+                th.setData({
+                    store_config: ee,
+                    sys_switch: json_d,
+                    has_connaect:is_connaect
+                })
+
+            }else{
+                th.setData({
+                    has_connaect:0
+                })
+            }
+
+            th.requestDelivery(e.order_id);
+        })
+
+
+
     },
     requestDelivery: function(e) {
         var r = this;
         s.get("/api/order/deliverydoc/page", {
-            data: { order_id: e,store_id:os.stoid },
+            data: { order_id: e,store_id:os.stoid,pageSize:100},
             success: function(e) {
-                r.setData({
-                    delivery: e.data.data.pageData[0],
-                }), r.requestExpress();
+
+                if(ut.ajax_ok(e)){
+                    var list=e.data.data.pageData;
+
+                    for (let i = 0; i < list.length; i++) {
+                        list[i].all_gd_num=0;
+                        var json=list[i].erp_ck_warelist;
+                        if(json){
+                            json=JSON.parse(json);
+                            for (let j = 0; j < json.length; j++) {
+                                list[i].all_gd_num+=json[j].qty;
+                            }
+                        }
+
+                        list[i].erp_sender_city=r.sheng_lue(list[i].erp_sender_city,4);
+                        list[i].erp_receiver_city=r.sheng_lue(list[i].erp_receiver_city,4);
+                    }
+
+
+
+                    r.setData({
+                        delivery: list[0],
+                        delivery_arr:list
+                    }), r.requestExpress();
+                }
+
+
+
             }
         });
     },
     requestExpress: function() {
         var s = this;
-
         var url="/api/weshop/order/wuliu/" + this.data.delivery.shipping_code + "/" + this.data.delivery.invoice_no + "/" + this.data.delivery.mobile;
-
         getApp().request.promiseGet(url, {}).then(e => {
-               var re_arr = e.data.data.Traces.reverse();
+            wx.hideLoading();
+            s.setData({is_get:1}) 
+
+            if(e.data.code==0 && e.data.data){
+                var re_arr = e.data.data.Traces.reverse();
                 s.setData({
-                  express: e.data.data, re_arr: re_arr,
+                    express: e.data.data, re_arr: re_arr,
                 });
+            }
  
         }).catch(function(err) {
+            wx.hideLoading();
             e.showWarning("请求失败");
         })
+
+    },
+
+
+    click_bao_btn(e){
+         var index= parseInt(e.currentTarget.dataset.idx);
+         var item=this.data.delivery_arr[index];
+         this.setData({
+             delivery: item,
+             active:index,
+             express:null,
+             re_arr:[],
+             is_get:0
+         });
+         wx.showLoading();
+         this.requestExpress();
+    },
+
+    //打开客服操作菜单
+    openCS() {
+        let self=this;
+        // 判断会员状态
+        let user_info = getApp().globalData.userInfo;
+        if (user_info == null || user_info.mobile == undefined || user_info.mobile == '' || user_info.mobile == null) {
+            wx.navigateTo({
+                url: '/packageE/pages/togoin/togoin',
+            })
+            return false;
+        };
+        // csType/在线客服设置：
+        // 0关闭（如果有设置热线电话，则显示拨打热线电话）、
+        // 1小程序客服、
+        // 2企业微信客服
+        if (this.data.sys_switch) {
+            let csType = this.data.sys_switch.weapp_customertype;
+            if (csType == 0) {
+                // 拨打电话号码
+                this.contactService();
+            } else {
+                this.getTel()
+                    .then(() => {
+                        self.setData({
+                            hiddenCS: false,
+                        });
+                    });
+            };
+        };
+
+    },
+
+    //关闭客服操作菜单
+    closeCS() {
+        this.setData({
+            hiddenCS: true,
+        });
+    },
+
+    // 获取客服电话
+    getTel() {
+        var self=this;
+        return new Promise((resolve, reject) => {
+            getApp().getConfig(function (t) {
+                if (t.store_tel == undefined) {
+                    getApp().request.get("/api/weshop/store/get/" + os.stoid, {
+                        isShowLoading: 1,
+                        data: {},
+                        success: function (rs) {
+                            getApp().globalData.config = rs.data.data;
+                            if (rs.data.data.store_tel == null && rs.data.data.store_tel == undefined) {
+                                getApp().my_warnning("商家未设置电话", 0, th);
+                                return false;
+                            }
+                            self.setData({
+                                store_tel: rs.data.data.store_tel,
+                            });
+                            // s.confirmBox("请联系客服：" + rs.data.data.store_tel);
+                        }
+                    })
+                } else {
+                    self.setData({
+                        store_tel: t.store_tel,
+                    });
+                    // s.confirmBox("请联系客服：" + t.store_tel);
+                };
+                resolve();
+            });
+        });
+    },
+
+
+    customer_chat: function () {
+        getApp().customer_chat("");
+    },
+
+    //---------联系客服------------
+    contactService: function () {
+        getApp().com_call(this);
+    },
+
+    //---------联系微信客服------------
+    con_weixin: function () {
+        var url = this.data.sys_switch.weapp_customertype_url;
+        var id = this.data.sys_switch.weapp_customertype_appid;
+        wx.openCustomerServiceChat({
+            extInfo: { url: url },
+            corpId: id,
+            success(res) { }
+        })
+    },
+
+    // 内容复制到剪贴板
+    copy() {
+        // console.log('点击了复制按钮');
+        wx.setClipboardData({
+            data: this.data.delivery.invoice_no,
+            success(res) {
+                wx.getClipboardData({
+                    success(res) {
+                        console.log(res.data);
+                    }
+                })
+            }
+        })
+    },
+
+    sheng_lue(txt,maxLength){
+        if(!txt) return '';
+        if (txt.length > maxLength) {
+            txt = txt.substr(0, maxLength) + '...';
+        }
+        return txt
     }
+
+
 });
 \ No newline at end of file
 {
-    "navigationBarTitleText": "查看物流信息"
+    "navigationBarTitleText": "查看物流信息",
+    "usingComponents": {
+        "nodata": "/components/nodata/nodata"
+    }
 }
 \ No newline at end of file
+<wxs module="util" src="exp_filter.wxs"></wxs>
+<view class="fir_top {{!delivery.erp_sender_city && !delivery.erp_receiver_city?'small':''}}">
+    <view class="f_title">
+        <view style="padding:0 32rpx">
+            <view class="flex jc_sb ai-center">
+                <view>
+                <text style="margin-right: 20rpx;">{{delivery.shipping_name}}：{{delivery.invoice_no}}</text>
+                <block wx:if="{{!delivery.erp_sender_city && !delivery.erp_receiver_city}}">
+                <image bindtap="copy" style="width:26rpx;" src="{{resourceUrl}}/miniapp/js_img/fuzhi_bs.png" mode="widthFix"></image>
+                </block>
+                </view>
+
+                <block wx:if="{{!delivery.erp_sender_city && !delivery.erp_receiver_city}}">
+                <!-- <text style="font-weight:bolder;"   wx:if="{{express.State==0}}" >无轨迹</text>
+                <text style="font-weight:bolder;"   wx:if="{{express.State==2}}" >已揽收</text>
+                <text style="font-weight:bolder;"   wx:if="{{express.State==2}}" >在途中</text>
+                <text style="font-weight:bolder;"   wx:if="{{express.State==3}}" >已签收</text>
+                <text style="font-weight:bolder;"   wx:if="{{express.State==4}}" >问题件</text>
+                <text style="font-weight:bolder;"   wx:if="{{!express}}" >无轨迹</text> -->
+                <text style="font-weight:bolder;"  >{{util.state_format(express)}}</text>
+                </block>
+               
+            
+                <image wx:else bindtap="copy" style="width:26rpx;" src="{{resourceUrl}}/miniapp/js_img/fuzhi_bs.png" mode="widthFix"></image>
+            </view>
+        </view>
+    </view>
+
+
+    <block wx:if="{{delivery.erp_sender_city || delivery.erp_receiver_city}}">
+        <view class="fir_top_mid flex jc_sb ai-center">
+            <view class="left_mid flex jc-center ai-center">
+                <!-- <view  wx:if="{{express.State==0}}" >无轨迹</view>
+                <view  wx:if="{{express.State==2}}" >已揽收</view>
+                <view  wx:if="{{express.State==2}}" >在途中</view>
+                <view  wx:if="{{express.State==3}}" >已签收</view>
+                <view  wx:if="{{express.State==4}}" >问题件</view>
+                <view  wx:if="{{!express}}" >无轨迹</view> -->
+                <view >{{util.state_format(express)}}</view>
+            </view>
+            <view class="right_mid flex jc-center ai-center">
+                <view class="right_mid_btn flex jc-center ai-center">
+                    <view>{{delivery.erp_sender_city || '无'}}</view>
+                    <image style="width:56rpx; margin:0 28rpx" src="{{resourceUrl}}/miniapp/js_img/from_to.png" mode="widthFix"></image>
+                    <view>{{delivery.erp_receiver_city || '无'}}</view>
+                </view>
+            </view>
+        </view>
+
+    </block>
+    <!-- <block wx:else>
+        <view class="fir_top_mid flex jc-center ai-center bold_color">
+                <view  wx:if="{{express.State==0}}" >无轨迹</view>
+                <view  wx:if="{{express.State==2}}" >已揽收</view>
+                <view  wx:if="{{express.State==2}}" >在途中</view>
+                <view  wx:if="{{express.State==3}}" >已签收</view>
+                <view  wx:if="{{express.State==4}}" >问题件</view>
+
+
+
+        </view>
+    </block> -->
+
+
+
+    <view class="fir_top_third">
+
+        <view class="flex jc_sb ai-center" style="height:100%">
+            <view bindtap="contactService" class="fir_top_third_btn flex jc-center ai-center">
+                <image class="addimg3" src="{{resourceUrl}}/miniapp/js_img/jsls_callphone.png"></image>拨打电话
+            </view>
+
+            <!-- 如果有联系客服的时候 -->
+            <block wx:if="{{has_connaect}}">
+                <view class="fir_top_third_lin"></view>
+
+
+                <!-- 小程序客服 -->
+                <block wx:if="{{sys_switch.weapp_customertype == 1}}">
+                    <button class="fir_top_third_btn flex jc-center ai-center" bindtap="click_contact" open-type="contact" session-from="wechat|{{userInfo.user_id}}|{{userInfo.nickname}}|{{userInfo.head_pic}}">
+                        <image class="addimg3" src="{{resourceUrl}}/miniapp/js_img/jsls_icon27.png"></image><text style="position: relative;top: 2rpx;" >联系客服</text>
+                    </button>
+                </block>
+                <!-- 微信客服 -->
+                <block wx:elif="{{sys_switch.weapp_customertype == 2}}">
+                    <view class="fir_top_third_btn flex jc-center ai-center" bindtap="con_weixin">
+                        <image class="addimg3" src="{{resourceUrl}}/miniapp/js_img/jsls_icon27.png"></image><text style="position: relative;top: 2rpx;" >联系客服</text>
+                    </view>
+                </block>
+
+                <!-- 商城客服 -->
+                <block wx:elif="{{sys_switch.weapp_customertype == 3}}">
+                    <view class="fir_top_third_btn flex jc-center ai-center" bindtap="customer_chat">
+                        <image class="addimg3" src="{{resourceUrl}}/miniapp/js_img/jsls_icon27.png"></image><text style="position: relative;top: 2rpx;" >联系客服</text>
+                    </view>
+                </block>
+
+<!--                <view bindtap="customer_chat" class="fir_top_third_btn flex jc-center ai-center">-->
+<!--                    <image class="addimg3" src="{{resourceUrl}}/miniapp/js_img/jsls_icon27.png"></image>联系客服-->
+<!--                </view>-->
+            </block>
+        </view>
+    </view>
+</view>
+
+<!---
 <view class="logistics-mes">
     <view class="logistics-num">
         <view class="logistics-title">快递单号 : </view>
@@ -7,7 +113,7 @@
         <view class="logistics-title">承运公司 : </view>
         <view class="logistics-cont">{{delivery.shipping_name}}</view>
     </view>
-   
+
      <view class="logistics-num">
         <view  class="logistics-title">物流状态 : </view>
         <view  wx:if="{{express.State==0}}" class="logistics-cont">无轨迹</view>
@@ -17,23 +123,40 @@
         <view  wx:if="{{express.State==4}}" class="logistics-cont">问题件</view>
     </view>
  
-</view>
-<view class="apply-state">
-    <view class="state-item">
-        <!-- <view class="item-wrap">
-            <view wx:if="{{express.State==2}}" class="state-title">在途中</view>
-            <view wx:if="{{express.State==3}}" class="state-title">已签收</view>
-            <view wx:if="{{express.State==4}}" class="state-title">问题件</view>
-            <view class="state-time">{{'    '}}</view>
-        </view> -->
-
-        <view class="item-wrap" wx:for="{{re_arr}}" wx:key="{{index}}">
-            <view class="state-title">{{item.AcceptStation}}</view>
-            <view class="state-time">{{item.AcceptTime}}</view>
+</view>-->
+
+<!-- 显示物流详情 -->
+<view style="padding-bottom:20rpx">
+    <view class="apply-state">
+        <view style="padding:25rpx 25rpx 0;">
+            <view class="deli_btn_box flex" wx:if="{{delivery_arr.length>1}}" >
+                <block wx:for="{{delivery_arr}}">
+                    <view bindtap="click_bao_btn" data-idx="{{index}}" class="bao_btn {{index==active?'b_active':''}}  ">包裹{{index+1}}<text wx:if="{{item.all_gd_num}}">(数量{{item.all_gd_num}})</text></view>
+                </block>
+            </view>
+            <view class="xq_title {{delivery_arr.length<2?'c_top':''}}  ">物流详情</view>
         </view>
+        <view style="padding:0 36rpx">
+            <view class="state-item">
+                <view class="item-wrap {{index==0?'fir':''}}  " wx:for="{{re_arr}}" wx:key="{{index}}">
+                    <view class="state-title">{{item.AcceptStation}}</view>
+                    <view class="state-time">{{item.AcceptTime}}</view>
+                    <view wx:if="{{index<re_arr.length-1}}" class="line"></view>
+
+                </view>
+            </view>
+        </view>
+
+        <block  wx:if="{{(!re_arr || re_arr.length==0) && is_get}}">
+           <view class="flex jc-center">
+              <nodata title="{{express && express.Reason?express.Reason:'暂无轨迹'}}" ></nodata>  
+           </view>
+            
+        </block>
+
+
+
     </view>
 </view>
  
-<view class="no_msg" wx:if="{{(!re_arr || re_arr.length==0) && express}}">
-      {{express.Reason}}
-</view>
+
+page{
+    background-color: #f1f1f1; color:#313131;
+}
+
 .logistics-mes {
     padding: 20rpx 30rpx;
     background-color: #fff;
@@ -12,6 +16,7 @@
 .logistics-title {
     color: #777;
     margin-right: 20rpx;
+    position: relative;top: 2rpx;
 }
  
 .logistics-cont {
@@ -19,14 +24,12 @@
 }
  
 .apply-state {
-    margin-top: 20rpx;
+    margin: 20rpx 17rpx 0;
     background-color: #fff;
-    padding-left: 50rpx;
-    padding-top: 60rpx;
+    border-radius: 17rpx;
 }
  
 .state-item {
-    border-left: 1px solid #ccc;
     padding:0 40rpx;
 }
  
@@ -34,31 +37,124 @@
     position: relative;
     margin-bottom: 20rpx;
     padding-bottom: 20rpx;
-    border-bottom: 1px solid #eee;
+    /* border-bottom: 1px solid #eee; */
     font-size: 24rpx;
     color: #aaa;
     line-height: 1;
 }
  
+.item-wrap .line{
+     height: 100%;width: 1rpx; background-color: #bfbfbf;
+     position: absolute;top: 22rpx; left: -40rpx;
+}
+
 .item-wrap::before {
     content: '';
     position: absolute;
-    left: -61rpx;
+    left: -52rpx;
     top: 0;
-    width: 26rpx;
-    height: 26rpx;
+    width: 22rpx;
+    height: 22rpx;
     border-radius: 50%;
-    background-color: #e23435;
-    border: 4px solid #ed8182;
+    background-color: #fff;
+    border: 1px solid #bfbfbf;
+    z-index: 100;
 }
  
-.state-title {
-    font-size: 28rpx;
-    font-weight: bold;
-    color: #666;
+.item-wrap.fir::before{
+    background-color: #e23435;
+    border: 5px solid #fdcfcd;
+    left: -61rpx;
+}
+.item-wrap .state-title {
+    font-size: 27rpx;
+    color: #898989;
     padding-bottom: 20rpx;
     line-height: 40rpx
 }
+
+.item-wrap.fir .state-title {
+    color: #313131;
+}
+.item-wrap.fir .state-time{
+    color: #fe0002;
+}
+
 .no_msg{
   text-align: center;color: #999; font-size: 32rpx
-}
 \ No newline at end of file
+}
+
+.deli_btn_box{
+    overflow-x:auto ; overflow-y:hidden ;
+}
+.bao_btn{
+    background-color: #f1f1f1; color: #313131;padding:0 34rpx; flex-shrink: 0; border-radius: 15rpx;
+    font-size: 26rpx; width: auto; height: 62rpx; line-height: 62rpx;
+}
+.bao_btn~.bao_btn{
+     margin-left: 18rpx;
+}
+.xq_title{
+    font-size: 34rpx; font-weight: bolder;color: #313131; line-height: 34rpx;margin-top: 50rpx;padding-bottom: 37rpx;
+}
+
+.xq_title.c_top{
+    margin-top: 20rpx;
+}
+
+.fir_top{
+    height: 328rpx;
+    margin: 20rpx 17rpx 0;overflow: hidden;
+    background-color: #fff;
+    border-radius: 17rpx;
+}
+
+.fir_top.small{
+   height: 145rpx;
+}
+
+.f_title{
+     height: 66rpx; line-height: 66rpx; background-color: #170a02; color: #fff; font-size: 25rpx;
+}
+.fir_top_mid{
+    height: 183rpx; border-bottom: 1rpx solid #eee;
+}
+.left_mid{
+    width:auto; flex-shrink: 0; margin-left: 24rpx; flex:1;
+    color: #fe0002; font-size: 35rpx; font-weight: bolder;
+}
+.right_mid{
+    width:440; flex-shrink: 0;
+}
+
+.bold_color{
+    color: #fe0002; font-size: 35rpx; font-weight: bolder;
+}
+
+.right_mid_btn{
+    height:109rpx; background-color: #f1f1f1; border-radius: 109rpx;
+    font-size: 26rpx; font-weight: bolder; color: #313131;
+    margin-right: 17rpx; width: 430rpx;
+}
+
+.fir_top_third{
+    height: 79rpx; color: #313131; font-size: 26rpx;
+}
+.fir_top_third_lin {
+    border-right: 1rpx solid #eee;
+    margin: 15rpx 11rpx; width: 2rpx;
+    height: 56rpx;
+}
+.addimg3{
+    width: 27rpx;
+    height: 27rpx;
+    padding: 0 12rpx;
+}
+.fir_top_third_btn{
+   width: 100%; height: 100%;
+}
+
+.bao_btn.b_active{
+   background-color:#fefbea;color: #fe0000; font-weight: bolder; border: 1rpx solid #fe0000;
+}
+