快递管理路由折叠显示

app/OrderPackage.php

@@ -28,6 +28,10 @@ class OrderPackage extends Model
         return $this->belongsTo('App\Order','order_id','id');
     }
 
+    protected $casts = [
+        'transfer_status' => 'array',
+    ];
+
     public function commodities(){
         return $this->hasMany('App\OrderPackageCommodities','order_package_id','id');
     }

app/Services/OrderPackageReceivedSyncService.php

@@ -84,7 +84,7 @@ class OrderPackageReceivedSyncService
             if (isset($data['status'])) $orderPackage->status = $data['status'];
             if (isset($data['received_at'])) $orderPackage->received_at = $data['received_at'];
             if (isset($data['exception'])) $orderPackage->exception = $data['exception'];
-            if (isset($data['transfer_status'])) $orderPackage->transfer_status = $data['transfer_status'];
+            if (isset($data['transfer_status'])) $orderPackage->transfer_status = json_encode($data['transfer_status'],JSON_UNESCAPED_UNICODE);
             $orderPackage->save();
         }
     }

resources/views/package/logistic/index.blade.php

@@ -31,8 +31,20 @@
                     <td>@{{ package.weighed_at }}</td>
                     <td>@{{ package.exception }}</td>
                     <td>
-{{--                        <p v-for="log in getLogs(package.transfer_status)">@{{ log }}</p>--}}
-                        @{{ package.transfer_status | toObjected }}
+                        <div v-if="package.transfer_status && package.transfer_status.length>0" class="text-overflow-warp-200 up" :id="'route-'+i">
+                            <p v-for="route in package.transfer_status">
+                                @{{ route.accept_address+" "+ route.remark+" "+route.accept_time}}
+                            </p>
+                        </div>
+                        <div class="text-overflow-warp-200 " v-if=" package.transfer_status && !showList[i] && package.transfer_status.length > 0">
+                            @{{ package.transfer_status[0].accept_address+" "+ package.transfer_status[0].remark+" "+package.transfer_status[0].accept_time}}
+                        </div>
+                        <div @click="showRoute(i)" v-if="package.transfer_status && package.transfer_status.length > 1">
+                            <label class="text-center mt-0 p-0 cursor-pointer pull-left">
+                                <span class="fa" :class="package.isShowRoute ? 'fa-angle-double-down' : 'fa-angle-double-right'"></span>
+                                &nbsp;<span v-if="package.transfer_status && showList[i]">收起</span><span v-else>展开</span>&nbsp;@{{ package.transfer_status.length }} 条
+                            </label>
+                        </div>
                     </td>
                     <td>@{{ package.remark }}</td>
                 </tr>
@@ -51,7 +63,11 @@
         let vue = new Vue({
             el: "#list",
             data: {
-                packages: {!!  $orderPackages->toJson() !!}['data'],
+                packages: [
+                    @foreach($orderPackages as $package)
+                    {!! $package !!},
+                    @endforeach
+                ],
                 logistics: [
                         @foreach($logistics as $logistic)
                     {
@@ -66,10 +82,24 @@
                     },
                     @endforeach
                 ],
+                showList:{},
+            },
+            created(){
+                $.each(this.packages,function (index,item){
+                    if (item.transfer_status!=null&&item.transfer_status.length>1) {
+                        item.transfer_status.sort(function (item1, item2) {
+                            let date1 = new Date(item1.accept_time);
+                            let date2 = new Date(item2.accept_time);
+                            if (date1 - date2 > 0) return -1;
+                            if (date1 - date2 < 0) return 1;
+                            return 0;
+                        });
+                    }
+                });
             },
-
             mounted() {
                 let _this = this;
+                $(".up").slideUp();
                 let data = [
                     [
                         /*"","","","","","","","","","",""*/
@@ -136,9 +166,16 @@
                 _this.form.init();
             },
             methods:{
-                getLogs(value){
-                    return JSON.parse(value);
-                }
+                showRoute(id){
+                    if (this.showList[id]){
+                        this.$set(this.showList,id,false);
+                        $("#route-"+id).slideUp();
+                    }else{
+                        this.$set(this.showList,id,true);
+                        $("#route-"+id).slideDown();
+                    }
+                    this.$forceUpdate();
+                },
             },
             filters:{
                 toObjected:function(value){