订单表头修复

resources/js/queryForm/header.js

@@ -92,22 +92,16 @@ window.Header = function getHeader(object) {
         let i = (_isCheckAllBox && firstTr) ? 1 : 0;
         for (i;i<(tds.length>0 ? tds.length : _columns.length);i++){
             let th = document.createElement("th");
-            if (firstTr) th.style.minWidth = (tds[i].offsetWidth-0.3)+"px";
-            let column = _columns[_isCheckAllBox ? i-1 : i];
+            if (firstTr) th.style.minWidth = (tds[i].offsetWidth-0.4)+"px";
+            let column = _columns[(_isCheckAllBox && firstTr) ? i-1 : i];
             if (_columns && column){
-                if (column.style)for (let key in column.style)if (column.style.hasOwnProperty(key)) th.style[key] = column.style[key];
-                if (column.class)th.className =  column.class;
-                let span = document.createElement("span");
-                span.style.display = "inline-block";
-                if (!column.neglect){
-                    th.style.cursor = "pointer";
-                    let font = document.createElement("span");
-                    font.className = "fa fa-sort";
-                    span.appendChild(font);
-                    th.onclick = rule(column,font);
+                switch (column.type) {
+                    case "multi":
+                        th = multiColumn(th,column);
+                        break;
+                    default:
+                        th = defaultColumn(th,column);
                 }
-                span.appendChild(document.createTextNode((column.value ? column.value : '')));
-                th.appendChild(span);
             }
             tr.appendChild(th);
         }
@@ -116,6 +110,44 @@ window.Header = function getHeader(object) {
         _targetDom.parentNode.insertBefore(div,_targetDom);
     }
 
+    function multiColumn(th,column) {
+        if (column.title){
+            let div = document.createElement("div");
+            div.className="w-100 text-center";
+            div.appendChild(document.createTextNode(column.title));
+            th.appendChild(div);
+        }
+        let div = document.createElement("div");
+        div.className="row text-center";
+        if (column.rows){
+            column.rows.forEach(row=>{
+                let node = document.createElement("div");
+                node.className = "col-"+(row.col ? row.col : 1);
+                node.appendChild(document.createTextNode(row.value));
+                div.appendChild(node);
+            });
+            th.appendChild(div);
+        }
+        return th;
+    }
+    
+    function defaultColumn(th,column) {
+        if (column.style)for (let key in column.style)if (column.style.hasOwnProperty(key)) th.style[key] = column.style[key];
+        if (column.class)th.className =  column.class;
+        let span = document.createElement("span");
+        span.style.display = "inline-block";
+        if (!column.neglect){
+            th.style.cursor = "pointer";
+            let font = document.createElement("span");
+            font.className = "fa fa-sort";
+            span.appendChild(font);
+            th.onclick = rule(column,font);
+        }
+        span.appendChild(document.createTextNode((column.value ? column.value : '')));
+        th.appendChild(span);
+        return th;
+    }
+
     //点击事件触发的排序规则
     function rule(column,columnSort) {
         return function () {

resources/views/order/index/delivering.blade.php

@@ -82,7 +82,7 @@
                             <span v-else>@{{ order.soreference5 }}</span>
                         </td>
                         <td class="text-muted text-wrap text-letter" style="max-width: 200px">@{{ order.c_contact }}</td>
-                        <td class="text-muted text-wrap text-letter" style="max-width: 200px">@{{ order.c_tel2?order.c_tel2:order.c_tel1 }}</td>
+                        <td class="text-muted text-wrap text-letter" style="width: 150px">@{{ order.c_tel2?order.c_tel2:order.c_tel1 }}</td>
                         <td class="text-nowrap"> @{{ order.c_province }}</td>
                         <td class="text-nowrap"> @{{ order.c_city }}</td>
                         <td class="text-nowrap"> @{{ order.c_district }}</td>
@@ -91,27 +91,24 @@
                         <td class="text-nowrap"> @{{ order.warehouseid }}</td>
                         <td class="text-nowrap"><span v-if="order.edisendflag2=='Y'">是</span><span v-if="order.edisendflag2=='N'">否</span><span v-if="order.edisendflag2=='W'">错误</span></td>
                         <td class="text-nowrap">@{{ order.edisendtime2 }}</td>
-                        <td colspan="7" class="text-center">
-                            <table v-if="commodities[order.orderno]&&commodities[order.orderno].length==1 || isBtn[order.orderno]" class="table text-nowrap table-sm">
-                                <tr v-for="oracleDOCOrderDetail in commodities[order.orderno]">
-                                    <td><div style="width: 180px;overflow: hidden">@{{ oracleDOCOrderDetail.sku }}</div></td>
-                                    <td><div style="width: 180px;overflow: hidden">@{{ oracleDOCOrderDetail.alternate_sku1 }}</div></td>
-                                    <td>
-                                        <div class="text-truncate text-primary tooltipTarget" style="width: 100px;cursor:pointer;text-decoration: underline" title="双击展开全部" @dblclick="nowrapText($event)">@{{ oracleDOCOrderDetail.descr_c  }}</div>
-                                        <div class="text-nowrap tooltipTarget"  style="display: none;cursor:pointer" @dblclick="truncateText($event)" title="双击收起全部">@{{ oracleDOCOrderDetail.descr_c  }}</div>
-                                    </td>
-                                    <td><div style="min-width: 100px">@{{ oracleDOCOrderDetail.qtyordered }}</div></td>
-                                    <td><div style="min-width: 150px">@{{ oracleDOCOrderDetail.lotnum }}</div></td>
-                                    <td><div style="width: 180px;overflow: hidden">@{{ oracleDOCOrderDetail.orderdetailcodename }}</div></td>
-                                    <td><div style="width: 180px;overflow: hidden">@{{ oracleDOCOrderDetail.checktime }}</div></td>
-                                </tr>
-                                <tr v-if="isBtn[order.orderno]">
-                                    <td colspan="7">
-                                        <b style="cursor:pointer;color: #4aa0e6;" @click="isBtn[order.orderno]=false;">点击收起明细</b>
-                                    </td>
-                                </tr>
-                            </table>
-                            <b @click="unfold(order.orderno)" style="cursor:pointer;text-decoration: underline;color: #4aa0e6;" v-if="commodities[order.orderno]&&commodities[order.orderno].length>1 && !isBtn[order.orderno]">共有 @{{ commodities[order.orderno].length }}  件商品，点击展开</b>
+                        <td colspan="7" class="text-center" style="min-width: 900px">
+                            <div :class="commodities[order.orderno]&&commodities[order.orderno].length==1 ? '' : 'up'" :id="'order-'+i">
+                                <div v-for="oracleDOCOrderDetail in commodities[order.orderno]" class="row">
+                                    <div class="col-2">@{{ oracleDOCOrderDetail.sku }}</div>
+                                    <div class="col-2">@{{ oracleDOCOrderDetail.alternate_sku1 }}</div>
+                                    <div class="col-2" @dblclick.stop="replaceText($event)">
+                                        <div class="w-100 text-overflow-replace-100 text-primary">@{{ oracleDOCOrderDetail.descr_c  }}</div>
+                                    </div>
+                                    <div class="col-1">@{{ oracleDOCOrderDetail.qtyordered }}</div>
+                                    <div class="col-2">@{{ oracleDOCOrderDetail.lotnum }}</div>
+                                    <div class="col-1">@{{ oracleDOCOrderDetail.orderdetailcodename }}</div>
+                                    <div class="col-2">@{{ oracleDOCOrderDetail.checktime }}</div>
+                                </div>
+                            </div>
+                            <div class="row text-center cursor-pointer" v-if="commodities[order.orderno]&&commodities[order.orderno].length>1">
+                                <b @click="unfold(i)" class="col-12 cursor-pointer" v-if="!upList[i]">共有 @{{ commodities[order.orderno].length }}  件商品，点击展开</b>
+                                <b class="col-12" @click="unfold(i)" v-else>点击收起明细</b>
+                            </div>
                         </td>
                         <td>@{{ order.notes }}</td>
                         <td>@{{ order.erpcancelflag }}</td>
@@ -246,7 +243,6 @@
                 ],
                 orders:{!! $orders !!},
                 commodities:{!! $commodities !!},
-                isBtn:{},
                 content:'',
                 codes:[
                         @foreach($codes as $code)
@@ -269,8 +265,10 @@
                     logisticInfo:'',
                     merchantInfo:'',
                 },
+                upList:{},
             },
             mounted:function () {
+                $(".up").slideUp();
                 $(".tooltipTarget").tooltip({'trigger':'hover'});
                 $("#list").removeClass('d-none');
                 if (this.orders.length>0){
@@ -346,13 +344,15 @@
                     {name:'warehouseid',value: '仓库'},
                     {name:'edisendflag2',value: '快递获取标记'},
                     {name:'edisendtime2',value: '快递获取时间'},
-                    {name:'sku',value: '产品代码', neglect: true, style:"min-width: 150px"},
-                    {name:'alternate_sku1',value: '产品条码', neglect: true, style:"min-width: 150px"},
-                    {name:'descr_c',value: '产品名称', neglect: true, style:"min-width: 180px"},
-                    {name:'qtyordered',value: '订单数量', neglect: true},
-                    {name:'lotnum',value: '批次号', style:"min-width: 150px"},
-                    {name:'orderdetailcodename',value: '明细状态', neglect: true, style:"min-width: 150px"},
-                    {name:'checktime',value: '复核时间', neglect: true},
+                    {type:"multi",title:"商品信息",rows:[
+                            {value:"产品代码",col:"2"},
+                            {value:"产品条码",col:"2"},
+                            {value:"产品名称",col:"2"},
+                            {value:"订单数量",col:"1"},
+                            {value:"批次号",col:"2"},
+                            {value:"明细状态",col:"1"},
+                            {value:"复核时间",col:"2"}
+                        ]},
                     {name:'notes',value: '备注', style:"min-width: 260px"},
                     {name:'erpcancelflag',value: '接口取消标记'},
                     {name:'picking_print_flag',value: '拣货单打印标记'},
@@ -371,8 +371,8 @@
             },
             watch:{
                 result_explain:function(){
-                    this.setLogisticInfo()
-                    this.setMerchantInfo()
+                    this.setLogisticInfo();
+                    this.setMerchantInfo();
                 }
             },
             methods:{
@@ -411,11 +411,9 @@
                     }
                     window.location.href=url;
                 },
-                unfold(orderno){
-                    this.$set(this.isBtn,orderno,true);
-                    setTimeout(function () {
-                        $(".tooltipTarget").tooltip({'trigger':'hover'});
-                    },1);
+                unfold(index){
+                    this.$set(this.upList,index,this.upList[index] ? !this.upList[index] : true);
+                    $("#order-"+index).slideToggle();
                 },
                 orderExport(checkAllSign){
                     let url = '{{url('order/index/export')}}';
@@ -752,18 +750,11 @@
                         tempTip.show('网络异常:'+error)
                     })
                 },
-                truncateText(e){
-                    $table = $(e.target).parents('.table').first();
-                    $table.find('.text-nowrap').hide();
-                    $table.find('.text-truncate').show();
-                },
-                nowrapText(e) {
-                    $table = $(e.target).parents('.table').first();
-                    $table.find('.text-truncate').hide();
-                    $table.find('.text-nowrap').show();
+                replaceText(e){
+                    e.target.firstChild.className = "w-100 text-overflow-warp-100";
                 },
                 getTagOrder(orderNos){
-                    this.tagOrders = []
+                    this.tagOrders = [];
                     if(orderNos.length ===  0 ){this.tagOrders =[];return ;}
                     if(this.orders.length === 0 ){this.tagOrders =[];return ;}
                     for (let i = 0; i < this.orders.length; i++) {

resources/views/store/deliveryAppointment/list.blade.php

@@ -89,7 +89,7 @@
                 </td>
                 <td>
                     <div v-if="info.cars.length>0">
-                        <div class="row" style="width: 500px">
+                        <div class="row" style="min-width: 600px">
                             <div class="col-2 font-weight-bold">@{{ info.cars[0].appointment_number }}</div>
                             <div class="col-2 text-secondary">@{{ info.cars[0].license_plate_number }}</div>
                             <div class="col-2 text-secondary">@{{ info.cars[0].car ? info.cars[0].car.name : '' }}</div>
@@ -98,7 +98,7 @@
                             <div class="col-2">@can("入库管理-客户预约-预约管理-卸货完成")<button class="btn btn-sm btn-outline-success" @click="unloading(i,0)" v-if="info.cars[0].status==1">卸货完成</button>@endcan</div>
                         </div>
                         <div class="up" :id="'item-'+info.id" v-show="info.cars.length>1">
-                            <div class="row" v-for="(car,j) in info.cars" v-if="j!==0">
+                            <div class="row" v-for="(car,j) in info.cars" v-if="j!==0" style="min-width: 600px">
                                 <div class="col-2 font-weight-bold">@{{ car.appointment_number }}</div>
                                 <div class="col-2 text-secondary">@{{ car.license_plate_number }}</div>
                                 <div class="col-2 text-secondary">@{{ car.car ? car.car.name : '' }}</div>