|
|
@@ -18,8 +18,8 @@
|
|
|
.h-90{
|
|
|
height: 90%;
|
|
|
}
|
|
|
- .h-5{
|
|
|
- height: 5%;
|
|
|
+ .h-10{
|
|
|
+ height: 10%;
|
|
|
}
|
|
|
.h-9{
|
|
|
height: 9%;
|
|
|
@@ -100,11 +100,17 @@
|
|
|
margin-left:10%;
|
|
|
width: 80%;
|
|
|
}
|
|
|
+ .br-1{
|
|
|
+ border-right:2px solid #aaaaaa;
|
|
|
+ }
|
|
|
+ table{
|
|
|
+ border-top: 3px solid #1b1e21;
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body onload="initLoad()" class="h-100">
|
|
|
<div class="container-fluid h-100 d-none" id="container">
|
|
|
- <div class="offset-1 h1 font-weight-bold h-100">
|
|
|
+ <div class="ml-5 h1 font-weight-bold mt-2 mb-0 h-10">
|
|
|
<div class="h-5"></div>
|
|
|
<div class="h-5 h6">
|
|
|
<div class="font-weight-bold row">
|
|
|
@@ -119,66 +125,56 @@
|
|
|
</div>
|
|
|
<hr class="font-weight-bold">
|
|
|
</div>
|
|
|
- <div class="w-100 h-90">
|
|
|
- <div class="h-9 mt-1 row" v-for="(data,i) in list" :class="data.status==1 ? 'text-primary' : (data.status==2 ? 'text-success' : 'text-dark')" v-if="i<5">
|
|
|
- <div class="col-3 text-line">@{{ data.license_plate_number ? data.license_plate_number : '*******' }}
|
|
|
- <span class="badge" :class="data.status==1 ? 'badge-primary' : (data.status==2 ? 'badge-success' : 'badge-secondary')" style="font-size: 20px" v-if="data.tonne || data.cubic_meter">
|
|
|
- <span v-if="data.tonne">吨 :@{{ data.tonne }}<br></span>
|
|
|
- <span v-if="data.cubic_meter">立方:@{{ data.cubic_meter }}</span>
|
|
|
- </span>
|
|
|
- <small class="h3 m-0"><span class="badge badge-pill badge-primary">质检</span></small>
|
|
|
- </div>
|
|
|
- <div class="col-2 text-line">@{{ data.driver_name }}</div>
|
|
|
- <div class="col-3 text-line">@{{ data.driver_phone }}</div>
|
|
|
- <div class="col-2 text-line">
|
|
|
- <span class="badge badge-pill badge-primary" {{--v-if="data.is_delivery"--}} v-if="data.status == 1">{{--已送达--}}作业中</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="row h-50 position-fixed w-100" style="bottom: 1px;">
|
|
|
- <div class="col-7">
|
|
|
- <div class="row" style="height: 20%" v-for="(data,i) in list" :class="data.status==1 ? 'text-primary' : (data.status==2 ? 'text-success' : 'text-dark')" v-if="i>5">
|
|
|
- <div class="col-8 text-line">@{{ data.license_plate_number ? data.license_plate_number : '*******' }}
|
|
|
- <span class="badge" :class="data.status==1 ? 'badge-primary' : (data.status==2 ? 'badge-success' : 'badge-secondary')" style="font-size: 20px" v-if="data.tonne || data.cubic_meter">
|
|
|
- <span v-if="data.tonne">吨 :@{{ data.tonne }}<br></span>
|
|
|
- <span v-if="data.cubic_meter">立方:@{{ data.cubic_meter }}</span>
|
|
|
- </span>
|
|
|
- <small class="h3 m-0"><span class="badge badge-pill badge-primary">质检</span></small>
|
|
|
- </div>
|
|
|
- <div class="col-4 text-line">@{{ data.driver_name }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="col-5" style="border: 3px solid #6c757d;border-radius: 5px">
|
|
|
- <div class="w-100 text-center h1 font-weight-bold">次日预约</div>
|
|
|
- <div class="mt-2 text-muted row" v-for="(data,i) in nextList">
|
|
|
- <div class="col-5">@{{ data.license_plate_number ? data.license_plate_number : '*******' }}
|
|
|
- <span class="badge badge-secondary" style="font-size: 14px" v-if="data.tonne || data.cubic_meter">
|
|
|
- <span v-if="data.tonne">吨 :@{{ data.tonne }}<br></span>
|
|
|
- <span v-if="data.cubic_meter">立方:@{{ data.cubic_meter }}</span>
|
|
|
- </span>
|
|
|
- <small class="h3 m-0"><span class="badge badge-pill badge-primary">质检</span></small>
|
|
|
- </div>
|
|
|
- <div class="col-3">@{{ data.driver_name }}</div>
|
|
|
- <div class="col-3">@{{ data.driver_phone }}</div>
|
|
|
- </div>
|
|
|
- <div class="media h-100" v-if="nextList.length==0">
|
|
|
- <div class="align-self-center mx-auto text-secondary font-weight-bold h1" style="transform:scale(1.6) ">暂无</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <div class="row h-90 mt-0">
|
|
|
+ <div class="col-8 br-1">
|
|
|
+ <div class="w-100 text-center">
|
|
|
+ <h1 class="font-weight-bold">当日预约</h1>
|
|
|
</div>
|
|
|
+ <table class="table w-100 h3">
|
|
|
+ <tr>
|
|
|
+ <th>货主</th>
|
|
|
+ <th>车牌/预约号</th>
|
|
|
+ <th>吨位/立方</th>
|
|
|
+ <th>特殊要求</th>
|
|
|
+ <th>预约时间</th>
|
|
|
+ <th>到场时间</th>
|
|
|
+ <th>状态</th>
|
|
|
+ </tr>
|
|
|
+ <tr v-for="data in list">
|
|
|
+ <td class="text-secondary">@{{ data.owner_name }}</td>
|
|
|
+ <td class="text-danger">@{{ data.license_plate_number }}</td>
|
|
|
+ <td class="text-secondary"><i v-if="data.tonne">@{{ data.tonne }}吨</i><br><i v-if="data.cubic_meter">@{{ data.cubic_meter }}立方</i></td>
|
|
|
+ <td class="text-primary">@{{ data.type }}</td>
|
|
|
+ <td class="text-secondary">@{{ data.period }}</td>
|
|
|
+ <td class="text-secondary">@{{ data.delivery_time }}</td>
|
|
|
+ <td :class="data.status == '未送达' ? 'text-dark' : (data.status=='作业中' ? 'text-primary' : 'text-success')">@{{ data.status }}</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
</div>
|
|
|
- {{--<div class="row h-40 mt-0">
|
|
|
- <div class="col-5">
|
|
|
- <div class="h-20 mt-0 row" v-for="(data,i) in list" :class="data.is_delivery ? 'text-success' : 'text-primary'" v-if="i>4">
|
|
|
- <div class="col-7 text-line">@{{ data.license_plate_number }}</div>
|
|
|
- <div class="col-5 text-line">
|
|
|
- <span class="ml-3">@{{ data.driver_name }}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="col-6">
|
|
|
- <div class="mt-4" id="code"></div>
|
|
|
+ <div class="col-4">
|
|
|
+ <div class="w-100 text-center">
|
|
|
+ <h2 class="font-weight-bold">次日预约</h2>
|
|
|
</div>
|
|
|
- </div>--}}
|
|
|
+ <table class="table w-100 h4">
|
|
|
+ <tr>
|
|
|
+ <th>货主</th>
|
|
|
+ <th>车牌/预约号</th>
|
|
|
+ <th>吨位/立方</th>
|
|
|
+ <th>特殊要求</th>
|
|
|
+ <th>预约时间</th>
|
|
|
+ </tr>
|
|
|
+ <tr v-for="data in nextList">
|
|
|
+ <td class="text-secondary">@{{ data.owner_name }}</td>
|
|
|
+ <td class="text-danger">@{{ data.license_plate_number }}</td>
|
|
|
+ <td class="text-secondary"><i v-if="data.tonne">@{{ data.tonne }}吨</i><br><i v-if="data.cubic_meter">@{{ data.cubic_meter }}立方</i></td>
|
|
|
+ <td class="text-primary">@{{ data.type }}</td>
|
|
|
+ <td class="text-secondary">@{{ data.period }}</td>
|
|
|
+ <td class="text-secondary">@{{ data.delivery_time }}</td>
|
|
|
+ <td :class="data.status == '未送达' ? 'text-dark' : (data.status=='作业中' ? 'text-primary' : 'text-success')">@{{ data.status }}</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static">
|
|
|
<div class="modal-dialog modal-dialog-centered modal-xl" role="document">
|
|
|
@@ -283,7 +279,7 @@
|
|
|
mounted(){
|
|
|
$("#container").removeClass("d-none");
|
|
|
if (warehouse) this._initData();
|
|
|
- //this._broadcast();
|
|
|
+ this._broadcast();
|
|
|
/*this._getKey();
|
|
|
setTimeout(()=>{
|
|
|
//刷新密匙
|
|
|
@@ -298,10 +294,33 @@
|
|
|
initEcho();
|
|
|
window.Echo.channel('{{config('database.redis.options.prefix')}}delivery').listen('.car',(res)=>{this._sortData(res.delivery)})
|
|
|
},
|
|
|
+ _countChange(oldStatus,newStatus){
|
|
|
+ switch (oldStatus) {
|
|
|
+ case '未送达':
|
|
|
+ this.count.notReached--;
|
|
|
+ break;
|
|
|
+ case '作业中':
|
|
|
+ this.count.work--;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ if (!oldStatus && newStatus)this.count.total++;
|
|
|
+ switch (newStatus) {
|
|
|
+ case '未送达':
|
|
|
+ this.count.notReached++;
|
|
|
+ break;
|
|
|
+ case '作业中':
|
|
|
+ this.count.work++;
|
|
|
+ break;
|
|
|
+ case '已完成':
|
|
|
+ this.count.success++;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
_sortData(res){
|
|
|
if (res.warehouse!=warehouse)return;
|
|
|
if (this.list.every((data,i)=>{
|
|
|
if (data.id === res.id){
|
|
|
+ this._countChange(data.status,res.status);
|
|
|
//this.$set(this.list[i],"is_delivery",true);
|
|
|
data.status = res.status;
|
|
|
this.list.splice(i,1);
|
|
|
@@ -318,14 +337,19 @@
|
|
|
}
|
|
|
return true;
|
|
|
})){
|
|
|
+ this._countChange(null,res.status);
|
|
|
if (this.list.length>=10) this.list = this.list.splice(0,9);
|
|
|
let obj = {
|
|
|
"id" : res.id,
|
|
|
"license_plate_number" : res.license_plate_number,
|
|
|
"driver_name" : res.driver_name,
|
|
|
"driver_phone" : res.driver_phone,
|
|
|
- "cubic_meter" : res.driver_phone,
|
|
|
- "tonne" : res.driver_phone,
|
|
|
+ "cubic_meter" : res.cubic_meter,
|
|
|
+ "tonne" : res.tonne,
|
|
|
+ "owner_name" : res.owner_name,
|
|
|
+ "type" : res.type,
|
|
|
+ "period" : res.period,
|
|
|
+ "delivery_time" : res.delivery_time,
|
|
|
"status" : res.status,
|
|
|
/*"is_delivery" : true,*/
|
|
|
};
|
|
|
@@ -347,7 +371,6 @@
|
|
|
}
|
|
|
});
|
|
|
},1800000);*/
|
|
|
- this.count.success++;
|
|
|
},
|
|
|
//初始化数据
|
|
|
_initData(){
|