zhibinlv
/
WZC2
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

【前端pc】大屏看板-物流时刻状态需求更改

dev_pc_nev
安虹睿 2 months ago
parent
9fd776824d
commit
d345767854
1 changed files with 72 additions and 32 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 104
      fe/WmsLargeScreen/src/views/logisticsTimeBoard.vue

104
fe/WmsLargeScreen/src/views/logisticsTimeBoard.vue
View File

@ -8,11 +8,18 @@
></boardHeader>
<dv-loading v-show="dataLoading">Loading... </dv-loading>
<ul class="stateExplain">
<!-- 计划statuNomal 提前statuWarning 准时statuSuccess 延后statuLate 延期statuError -->
<li class="colorNomal"><span class="state statuNomal"></span>计划</li>
<li class="colorWarning"><span class="state statuWarning"></span>提前</li>
<li class="colorSucess"><span class="state statuSuccess"></span>准时</li>
<li class="colorLate"><span class="state statuLate"></span>延后</li>
<li class="colorError"><span class="state statuError"></span>延期</li>
<!-- <li :style="{color:colors.nomal}"><span class="state" :style="{background:colors.nomal}"></span>无计划</li> -->
<!-- :style="{background:colors.green}" -->
<li class="colorSucess"><span class="state statuSuccess"></span>准时</li>
<!-- 2025-03-12前版本 -->
<!-- <li class="colorSucess"><span class="state statuSuccess"></span>准时</li>
<li class="colorWarning"><span class="state statuWarning"></span>提前/延迟</li>
<li class="colorError"><span class="state statuError"></span>未到</li>
<li class="colorError"><span class="state statuError"></span>未到</li> -->
</ul>
<div class="lineContain" v-if="!dataLoading">
<dv-scroll-board :config="config" ref="logisticsScrollBoard" style="height:100%" />
@ -154,35 +161,54 @@ export default {
// 1）绿色（准时）：发货单到货时间（2022-11-01 14:15），前后各1个小时，为准时。
// if((Math.abs(_number_planTime - _number_time) <= _oneHour) && v.sta == '1'){
// -------------2025-03-12前版本star------------------
// if(v.receiptStatus == "准时"){
// // _background = this.colors.green
// _background_class= "statuSuccess";
// }
// // 2）黄色（提前/延时）：到货时间（2022-11-01 14:15）
// // 提前：按照预计到货时间提前60分钟的收货是提前
// // 延时：按照预计到货时间超过60分钟后的收货都是延时
// // if((Math.abs(_number_planTime - _number_time) > _oneHour) && v.sta == '1'){
// if(v.receiptStatus == "延后" || v.receiptStatus == "提前"){
// // _background = this.colors.yellow
// _background_class= "statuWarning";
// }
// // 3）红色（未到）：超过60分钟，并且到现在为止还没有到货的，在预计到货时间的时间列，
// // 单元格标记为红色；同时，在供应商简称列（单元格）填充红色。
// // 如果后期收到货，并且该供应商没有未收货，供应商简称列（单元格）改为正常显示。
// // if((Math.abs(_number_planTime - _number_time) > _oneHour) && v.sta == '0'){
// // 在当前时间看板内v.receiptStatus == "延期" || v.isDelay = true标红，
// // 不在当前时间看板内v.isDelay = true标红
// if(v.receiptStatus == "延期" || v.isDelay){
// // _background = this.colors.red
// // _background_name = this.colors.red
// _background_class= "statuError";
// if(this.headerType == 'night'){
// _background_name_class = "statuError"
// }else{
// _background_name_class= "";
// }
// }
// -------------2025-03-12前版本end------------------
// -------------2025-03-12新版本star------------------
if(v.receiptStatus == "计划"){
_background_class= "statuNomal";
}
if(v.receiptStatus == "提前"){
_background_class= "statuWarning";
}
if(v.receiptStatus == "准时"){
// _background = this.colors.green
_background_class= "statuSuccess";
}
// 2）黄色（提前/延时）：到货时间（2022-11-01 14:15）
// 提前：按照预计到货时间提前60分钟的收货是提前
// 延时：按照预计到货时间超过60分钟后的收货都是延时
// if((Math.abs(_number_planTime - _number_time) > _oneHour) && v.sta == '1'){
if(v.receiptStatus == "延后" || v.receiptStatus == "提前"){
// _background = this.colors.yellow
_background_class= "statuWarning";
if(v.receiptStatus == "延后"){
_background_class= "statuLate";
}
// 3）红色（未到）：超过60分钟，并且到现在为止还没有到货的，在预计到货时间的时间列，
// 单元格标记为红色；同时，在供应商简称列（单元格）填充红色。
// 如果后期收到货，并且该供应商没有未收货，供应商简称列（单元格）改为正常显示。
// if((Math.abs(_number_planTime - _number_time) > _oneHour) && v.sta == '0'){
// 在当前时间看板内v.receiptStatus == "延期" || v.isDelay = true标红，
// 不在当前时间看板内v.isDelay = true标红
if(v.receiptStatus == "延期" || v.isDelay){
// _background = this.colors.red
// _background_name = this.colors.red
if(v.receiptStatus == "延期"){
_background_class= "statuError";
if(this.headerType == 'night'){
_background_name_class = "statuError"
}else{
_background_name_class= "";
}
}
// -------------2025-03-12前版本end------------------
if(name || name == ""){
// 供应商名称标记
@ -651,34 +677,47 @@ export default {
<style lang="less">
.logisticsTimeBoardPage{
@borderColor:#43caff;
@colorNomal:rgba(82,172,197, 1);
@colorNomal:rgba(127,170,251, 1);
@colorSuccess:rgba(11, 254, 255, 1);
@colorWarning:rgba(254,140,10, 1) ;
@colorWarning:rgba(254,140,10, 1);
@colorLate:rgba(255, 45, 140, 1);
@colorError:rgba(255,45,45,1);
@statuSize:1.2rem;
@fillNomal:linear-gradient(to right, rgba(82,172,197,0.7) , rgba(82,172,197,0.3));
@fillNomal:linear-gradient(to right, rgba(127,170,251, 0.7), rgba(127,170,251, 0.3));
@fillSuccess:linear-gradient(to right, rgba(11, 254, 255,0.7) , rgba(11, 254, 255,0.3));
@fillWarning:linear-gradient(to right, rgba(254,140,10,0.7) , rgba(254,140,10,0.3));
@fillLate:linear-gradient(to right, rgba(255, 45, 140, 0.7), rgba(255, 45, 140, 0.3));
@fillError:linear-gradient(to right, rgba(255,45,45,0.7) , rgba(255,45,45,0.3));
// 状态颜色
// 计划
.statuNomal{
border: @colorNomal solid 0.1rem;
background-image: @fillNomal;
width: 100%;
}
// 提前
.statuWarning{
border: @colorWarning solid 0.1rem;
background-image: @fillWarning;
width: 100%;
box-sizing: border-box;
}
// 准时
.statuSuccess{
border: @colorSuccess solid 0.1rem;
background-image: @fillSuccess;
width: 100%;
box-sizing: border-box;
}
.statuWarning{
border: @colorWarning solid 0.1rem;
background-image: @fillWarning;
// 延后
.statuLate{
border: @colorLate solid 0.1rem;
background-image: @fillLate;
width: 100%;
box-sizing: border-box;
}
// 延期
.statuError{
border: @colorError solid 0.1rem;
background-image: @fillError;
@ -686,8 +725,9 @@ export default {
box-sizing: border-box;
}
.colorNomal{color:@colorNomal}
.colorSucess{color:@colorSuccess}
.colorWarning{color:@colorWarning}
.colorSucess{color:@colorSuccess}
.colorLate{color:@colorLate}
.colorError{color:@colorError}
// 状态栏
.stateExplain{

Write Preview
Loading…
Cancel
Save