|
|
@@ -0,0 +1,218 @@
|
|
|
+@extends('layouts.app')
|
|
|
+@section('title')订单管理-跟踪@endsection
|
|
|
+@section('content')
|
|
|
+ @component('order.tracking.menu')@endcomponent
|
|
|
+ <div class="container-fluid" id="tracking_div">
|
|
|
+ <div>
|
|
|
+ <div class="d-none" id="list">
|
|
|
+ @can('订单管理-跟踪-监听')
|
|
|
+ <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="pasteDataTitle" aria-hidden="true">
|
|
|
+ <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
|
|
|
+ <div class="modal-content">
|
|
|
+ <div class="modal-header row form-inline">
|
|
|
+ <input type="text" v-model="name" class="form-control form-control-sm col-5 offset-3" placeholder="搜索货主,点击下方块添加" />
|
|
|
+ <button class="btn btn-sm btn-info col-2" @click="seekOwner()">搜索</button>
|
|
|
+ <label class="col-2"></label>
|
|
|
+ </div>
|
|
|
+ <div class="modal-body container row" style="text-align:center">
|
|
|
+ <div class="col-2 mt-2" v-for="owner in owners">
|
|
|
+ <div style="border: 1px solid #aac7ea;height: 80px;text-align: center;line-height: 80px;border-radius: 4px;cursor: pointer"
|
|
|
+ :style="[{'background': loggingOwners.includes(Number(owner.name)) ? '#00FF00' : ''},
|
|
|
+ {'box-shadow' : seekOwners.includes(owner.name) ? '0px 0px 10px 5px rgba(0,0,0,0.9)' : ''}]"
|
|
|
+ @click="addTrackingOwner( owner.id )">@{{ owner.value }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ @endcan
|
|
|
+ <div id="form_div"></div>
|
|
|
+ <div class="form-inline mt-1 ">
|
|
|
+ <span class="dropdown">
|
|
|
+ <button type="button"
|
|
|
+ class="btn btn-outline-dark btn-sm form-control-sm dropdown-toggle tooltipTarget"
|
|
|
+ :class="[checkData.length>0?'btn-dark text-light':'']"
|
|
|
+ data-toggle="dropdown" title="导出所有页将会以搜索条件得到的筛选结果,将其全部记录(每一页)导出">导出Excel
|
|
|
+ </button>
|
|
|
+ <div class="dropdown-menu">
|
|
|
+ <a class="dropdown-item" @click="exportSelect()" href="javascript:">导出勾选内容</a>
|
|
|
+ <a class="dropdown-item" @click="exportAll()" href="javascript:">导出所有页</a>
|
|
|
+ </div>
|
|
|
+ </span>
|
|
|
+ @can('订单管理-跟踪-监听')
|
|
|
+ <button class="btn btn-outline-info btn-sm tooltipTarget ml-2" @click="openModal()">
|
|
|
+ 管理监听货主
|
|
|
+ </button>
|
|
|
+ @endif
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <table class="table table-sm table-bordered table-hover card-body table-responsive-sm p-0 m-0">
|
|
|
+ <tr class="text-center">
|
|
|
+ <th>
|
|
|
+ <input id="all" type="checkbox" @click="checkAll($event)"/>
|
|
|
+ </th>
|
|
|
+ <th>序号</th>
|
|
|
+ <th>公司</th>
|
|
|
+ <th>订单号</th>
|
|
|
+ <th>WEB+订单号</th>
|
|
|
+ <th>提货日期</th>
|
|
|
+ <th>销售</th>
|
|
|
+ <th>客户</th>
|
|
|
+ <th>SKU</th>
|
|
|
+ <th>物料描述</th>
|
|
|
+ <th>数量</th>
|
|
|
+ <th>订单备注</th>
|
|
|
+ <th>重量</th>
|
|
|
+ <th>体积</th>
|
|
|
+ <th>托盘合计</th>
|
|
|
+ <th>运输方式</th>
|
|
|
+ <th>运输单号</th>
|
|
|
+ <th>到达城市</th>
|
|
|
+ <th>到达城市</th>
|
|
|
+ <th>应送达时间</th>
|
|
|
+ <th>是否赶上卡班</th>
|
|
|
+ <th>到货情况</th>
|
|
|
+ <th>签收日期</th>
|
|
|
+ <th>签收单情况</th>
|
|
|
+ <th>备注</th>
|
|
|
+ </tr>
|
|
|
+
|
|
|
+ <tr v-for="(orderTracking,index) in orderTrackings">
|
|
|
+ <td>
|
|
|
+ <input id="all" type="checkbox" @click="checkAll($event)"/>
|
|
|
+ </td>
|
|
|
+ <td>@{{ index }}</td>
|
|
|
+ <td>公司</td>
|
|
|
+ <td>订单号</td>
|
|
|
+ <td>WEB+订单号</td>
|
|
|
+ <td>提货日期</td>
|
|
|
+ <td>销售</td>
|
|
|
+ <td>客户</td>
|
|
|
+ <td>SKU</td>
|
|
|
+ <td>物料描述</td>
|
|
|
+ <td>数量</td>
|
|
|
+ <td>订单备注</td>
|
|
|
+ <td>重量</td>
|
|
|
+ <td>体积</td>
|
|
|
+ <td>托盘合计</td>
|
|
|
+ <td>运输方式</td>
|
|
|
+ <td>运输单号</td>
|
|
|
+ <td>到达城市</td>
|
|
|
+ <td>到达城市</td>
|
|
|
+ <td>应送达时间</td>
|
|
|
+ <td>是否赶上卡班</td>
|
|
|
+ <td>到货情况</td>
|
|
|
+ <td>签收日期</td>
|
|
|
+ <td>签收单情况</td>
|
|
|
+ <td>备注</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+@endsection
|
|
|
+
|
|
|
+@section('lastScript')
|
|
|
+ <script type="text/javascript" src="{{asset('js/queryForm/export200818a.js')}}"></script>
|
|
|
+ <script type="text/javascript" src="{{asset('js/queryForm/queryForm200901.js')}}"></script>
|
|
|
+ <script type="text/javascript" src="{{asset('js/queryForm/header200826b.js')}}"></script>
|
|
|
+
|
|
|
+ <script>
|
|
|
+ let tracking_vue = new Vue({
|
|
|
+ el:'#tracking_div',
|
|
|
+ data:{
|
|
|
+ orderTrackings:[],
|
|
|
+ owners:[@foreach($owners as $owner){name: '{{ $owner->id }}', value: '{{ $owner->name}}'},@endforeach],
|
|
|
+ from:'',
|
|
|
+ checkData:'',
|
|
|
+ seekOwners : [],
|
|
|
+ name : "",
|
|
|
+ loggingOwners : [],
|
|
|
+ },
|
|
|
+ mounted:function(){
|
|
|
+ $('.tooltipTarget').tooltip({'trigger': 'hover'});
|
|
|
+ $("#list").removeClass('d-none');
|
|
|
+ let _this = this;
|
|
|
+ let data = [
|
|
|
+ [
|
|
|
+ {name:'start_at',type:'dateTime',tip:'起始日期',placeholder:'起始日期'},
|
|
|
+ {name:'owner_id',type:'select_multiple_select', tip: ['输入关键词快速定位下拉列表,回车确定', '选择要显示的客户'],
|
|
|
+ placeholder: ['货主', '定位或多选货主'],
|
|
|
+ data: _this.owners},
|
|
|
+ {name:'client_code',type:'input',tip:'订单号',placeholder:'订单号'},
|
|
|
+ {name:'client',type:'input',tip:'货主',placeholder:'货主'},
|
|
|
+ ],
|
|
|
+ [
|
|
|
+ {name:'end_at',type:'dateTime',tip:'结束日期',placeholder: '结束日期'},
|
|
|
+ {name:'logistic_number',type:'input',tip:'运输单号',placeholder:'运输单号'},
|
|
|
+ {name:'sku',type:'input',tip:'SKU',placeholder: '商品编号'},
|
|
|
+ ]
|
|
|
+ ];
|
|
|
+ this.from = new query({
|
|
|
+ el: '#form_div',
|
|
|
+ condition: data,
|
|
|
+ }).init();
|
|
|
+ },
|
|
|
+ watch:{
|
|
|
+ checkData: {
|
|
|
+ handler() {
|
|
|
+ if (this.checkData.length === this.orderTrackings.length && this.checkData.length !== 0) {
|
|
|
+ document.querySelector('#all').checked = true;
|
|
|
+ } else {
|
|
|
+ document.querySelector('#all').checked = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ checkAll(e){
|
|
|
+ if (e.target.checked) {
|
|
|
+ this.orderTrackings.forEach((el, i) => {
|
|
|
+ if (this.checkData.indexOf(el.id) === -1) {
|
|
|
+ this.checkData.push(el.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.checkData = [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ openModal(){
|
|
|
+ let url = "{{url('apiLocal/order/trackingOwner/all')}}";
|
|
|
+ axios.post(url).then(res=>{
|
|
|
+ this.loggingOwners = res.data;
|
|
|
+ $("#modal").modal('show');
|
|
|
+ });
|
|
|
+ },
|
|
|
+ seekOwner(){
|
|
|
+ if (!this.name)return ;
|
|
|
+ let name = this.name;
|
|
|
+ let seekOwners = [];
|
|
|
+ this.owners.forEach(function (owner) {
|
|
|
+ if ((owner.value).indexOf(name) !== -1){
|
|
|
+ seekOwners.push(owner.name);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (seekOwners.length > 0)this.seekOwners = seekOwners;
|
|
|
+ },
|
|
|
+ addTrackingOwner(owner_id,name){
|
|
|
+
|
|
|
+ },
|
|
|
+ selectedColor(id) {
|
|
|
+ if (id === this.selectedStyle) {
|
|
|
+ this.selectedStyle = '';
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.selectedStyle = id;
|
|
|
+ },
|
|
|
+ exportSelect:function(){
|
|
|
+
|
|
|
+ },
|
|
|
+ exportAll:function(){
|
|
|
+
|
|
|
+ },
|
|
|
+ }
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+@endsection
|