Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
K
kd_control
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
zhanglw
kd_control
Commits
27e5ba9a
Commit
27e5ba9a
authored
May 09, 2023
by
zhanglw
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
铲车排行榜
parent
3aa6f4b2
Changes
5
Show whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
722 additions
and
1085 deletions
+722
-1085
common.js
src/assets/js/common.js
+8
-3
DPcomputer11.vue
.../MLargeScreen/components/smallComponents/DPcomputer11.vue
+261
-411
DPcomputer12.vue
.../MLargeScreen/components/smallComponents/DPcomputer12.vue
+272
-329
DPcomputer5.vue
...s/MLargeScreen/components/smallComponents/DPcomputer5.vue
+175
-342
index.vue
src/views/personnelPositioning/beacon/index.vue
+6
-0
No files found.
src/assets/js/common.js
View file @
27e5ba9a
...
@@ -1992,7 +1992,8 @@ var HttpReq = function(){
...
@@ -1992,7 +1992,8 @@ var HttpReq = function(){
//大屏——数据总览——采区产量统计——日产量
//大屏——数据总览——采区产量统计——日产量
apiPlanDayQuery
:
function
(
param
){
apiPlanDayQuery
:
function
(
param
){
return
request
({
return
request
({
url
:
'
/api/Plan/Day
'
,
// url: '/api/Plan/Day',
url
:
'
/api/carManager/clData
'
,
method
:
'
get
'
,
method
:
'
get
'
,
params
:
param
,
params
:
param
,
})
})
...
@@ -2087,7 +2088,8 @@ var HttpReq = function(){
...
@@ -2087,7 +2088,8 @@ var HttpReq = function(){
//大屏——车辆管理——卡车铲车排行榜day
//大屏——车辆管理——卡车铲车排行榜day
apiManmadesDay1Query
:
function
(
param
){
apiManmadesDay1Query
:
function
(
param
){
return
request
({
return
request
({
url
:
'
/api/Manmades/Day
'
,
// url: '/api/Manmades/Day',
url
:
'
/api/carManager/kcTop
'
,
method
:
'
get
'
,
method
:
'
get
'
,
params
:
param
,
params
:
param
,
})
})
...
@@ -2096,6 +2098,7 @@ var HttpReq = function(){
...
@@ -2096,6 +2098,7 @@ var HttpReq = function(){
apiManmadesZhou1Query
:
function
(
param
){
apiManmadesZhou1Query
:
function
(
param
){
return
request
({
return
request
({
url
:
'
/api/Manmades/Zhou
'
,
url
:
'
/api/Manmades/Zhou
'
,
// url: '/api/carManager/kcTopDay',
method
:
'
get
'
,
method
:
'
get
'
,
params
:
param
,
params
:
param
,
})
})
...
@@ -2104,6 +2107,7 @@ var HttpReq = function(){
...
@@ -2104,6 +2107,7 @@ var HttpReq = function(){
apiManmadesMou1Query
:
function
(
param
){
apiManmadesMou1Query
:
function
(
param
){
return
request
({
return
request
({
url
:
'
/api/Manmades/Mou
'
,
url
:
'
/api/Manmades/Mou
'
,
// url: '/api/carManager/kcTopDay',
method
:
'
get
'
,
method
:
'
get
'
,
params
:
param
,
params
:
param
,
})
})
...
@@ -2558,7 +2562,8 @@ var HttpReq = function(){
...
@@ -2558,7 +2562,8 @@ var HttpReq = function(){
//大屏组件4铲车排行榜接口
//大屏组件4铲车排行榜接口
apiManmadeschanjiedanDayQuery
:
function
(
param
){
apiManmadeschanjiedanDayQuery
:
function
(
param
){
return
request
({
return
request
({
url
:
'
/api/Manmades/chanjiedanDay
'
,
// url: '/api/Manmades/chanjiedanDay',
url
:
'
/api/carManager/ccTop
'
,
method
:
'
get
'
,
method
:
'
get
'
,
params
:
param
,
params
:
param
,
})
})
...
...
src/views/MLargeScreen/components/smallComponents/DPcomputer11.vue
View file @
27e5ba9a
...
@@ -4,17 +4,34 @@
...
@@ -4,17 +4,34 @@
<div
class=
"carManScrView_leftView_title truck_titleStyle"
>
<div
class=
"carManScrView_leftView_title truck_titleStyle"
>
<div>
卡车排行榜
</div>
<div>
卡车排行榜
</div>
<div
class=
"driverTitleDateStyle"
>
<div
class=
"driverTitleDateStyle"
>
<div
:class=
"truckRankListData.selectTimeText == 'day' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"truckChangeTime('day')"
>
日
</div>
<div
<div
:class=
"truckRankListData.selectTimeText == 'week' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"truckChangeTime('week')"
>
周
</div>
:class=
"truckRankListData.selectTimeText == 'day' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
<div
:class=
"truckRankListData.selectTimeText == 'month' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"truckChangeTime('month')"
>
月
</div>
@
click=
"truckChangeTime('day')"
>
日
</div>
<div
:class=
"truckRankListData.selectTimeText == 'week' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"truckChangeTime('week')"
>
周
</div>
<div
:class=
"truckRankListData.selectTimeText == 'month' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"truckChangeTime('month')"
>
月
</div>
</div>
</div>
</div>
</div>
<div
class=
"carManScrView_leftView_content"
>
<div
class=
"carManScrView_leftView_content"
>
<div
class=
"carManScrView_leftView_content_views2"
>
<div
class=
"carManScrView_leftView_content_views2"
>
<div
:class=
"truckRankListData.selectFieldText == 'juli' ? '' : 'selectFieldStyle' "
@
click=
"truckChangeField('juli')"
>
运输距离
</div>
<div
:class=
"truckRankListData.selectFieldText == 'juli' ? '' : 'selectFieldStyle' "
<div
:class=
"truckRankListData.selectFieldText == 'time' ? '' : 'selectFieldStyle' "
@
click=
"truckChangeField('time')"
>
工作时长
</div>
@
click=
"truckChangeField('juli')"
>
运输距离
<div
:class=
"truckRankListData.selectFieldText == 'zcar' ? '' : 'selectFieldStyle' "
@
click=
"truckChangeField('zcar')"
>
运载量
</div>
</div>
<div
:class=
"truckRankListData.selectFieldText == 'waiting' ? '' : 'selectFieldStyle' "
@
click=
"truckChangeField('waiting')"
>
接单数
</div>
<div
:class=
"truckRankListData.selectFieldText == 'time' ? '' : 'selectFieldStyle' "
@
click=
"truckChangeField('time')"
>
工作时长
</div>
<div
:class=
"truckRankListData.selectFieldText == 'yunZaiNumber' ? '' : 'selectFieldStyle' "
@
click=
"truckChangeField('yunZaiNumber')"
>
运载量
</div>
<div
:class=
"truckRankListData.selectFieldText == 'jieDanNumber' ? '' : 'selectFieldStyle' "
@
click=
"truckChangeField('jieDanNumber')"
>
接单数
</div>
</div>
</div>
<div
class=
"carManScrView_leftView_content_views3"
id=
"carManScrView_leftView_content_views3_1"
></div>
<div
class=
"carManScrView_leftView_content_views3"
id=
"carManScrView_leftView_content_views3_1"
></div>
</div>
</div>
...
@@ -22,266 +39,87 @@
...
@@ -22,266 +39,87 @@
</
template
>
</
template
>
<
script
>
<
script
>
import
{
Tools
,
HttpReq
,
CAMap
}
from
'
@/assets/js/common.js
'
;
import
{
Tools
,
HttpReq
,
CAMap
}
from
'
@/assets/js/common.js
'
;
import
*
as
echarts
from
'
echarts
'
;
import
*
as
echarts
from
'
echarts
'
;
export
default
{
export
default
{
data
()
{
data
()
{
return
{
return
{
DPcomputer11BoxTimer
:
null
,
DPcomputer11BoxTimer
:
null
,
//卡车排行榜
//卡车排行榜
truckRankListData
:
{
truckRankListData
:
{
echartsX
:
'
Km
'
,
echartsX
:
'
Km
'
,
carclass
:
'
卡车
'
,
carclass
:
'
卡车
'
,
selectTimeText
:
'
day
'
,
selectTimeText
:
'
day
'
,
selectFieldText
:
'
juli
'
,
selectFieldText
:
'
juli
'
,
driverName
:
[],
driverName
:
[],
driverSeriesData
:
[],
driverSeriesData
:
[],
driverName1
:[
'
kfdfdf
'
,
'
dsdsd1
'
,
'
dsdsd55
'
],
driverName1
:
[
'
kfdfdf
'
,
'
dsdsd1
'
,
'
dsdsd55
'
],
driverSeriesData1
:[
20
,
50
,
10
],
driverSeriesData1
:
[
20
,
50
,
10
],
},
},
}
}
},
},
mounted
(){
mounted
()
{
this
.
DPcomputer11BoxTimer
=
setInterval
(()
=>
{
this
.
loadData
();
},
10000
)
this
.
loadData
();
this
.
loadData
();
},
},
methods
:
{
methods
:
{
loadData
()
{
loadData
()
{
let
that
=
this
;
let
that
=
this
;
let
truckQuery1
=
{};
let
truckQuery1
=
{};
truckQuery1
.
size
=
7
;
truckQuery1
.
size
=
7
;
truckQuery1
.
sort
=
this
.
truckRankListData
.
selectFieldText
;
truckQuery1
.
sort
=
this
.
truckRankListData
.
selectFieldText
;
truckQuery1
.
carclass
=
this
.
truckRankListData
.
carclass
;
truckQuery1
.
carclass
=
this
.
truckRankListData
.
carclass
;
this
.
$nextTick
(()
=>
{
truckQuery1
.
duration
=
this
.
truckRankListData
.
selectTimeText
;
if
(
this
.
truckRankListData
.
selectTimeText
==
'
day
'
){
HttpReq
.
truckDispatching
.
apiManmadesDay1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
else
if
(
this
.
truckRankListData
.
selectTimeText
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesZhou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
else
if
(
this
.
truckRankListData
.
selectTimeText
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesMou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
})
this
.
DPcomputer11BoxTimer
=
setInterval
(()
=>
{
this
.
$nextTick
(()
=>
{
//获取卡车排行榜
let
truckQuery1
=
{};
truckQuery1
.
size
=
7
;
truckQuery1
.
sort
=
this
.
truckRankListData
.
selectFieldText
;
truckQuery1
.
carclass
=
this
.
truckRankListData
.
carclass
;
this
.
$nextTick
(()
=>
{
if
(
this
.
truckRankListData
.
selectTimeText
==
'
day
'
){
HttpReq
.
truckDispatching
.
apiManmadesDay1Query
(
truckQuery1
).
then
((
res
)
=>
{
HttpReq
.
truckDispatching
.
apiManmadesDay1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr1
=
[];
let
arr2
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
if
(
res
.
data
&&
res
.
data
.
length
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
res
.
data
.
reverse
().
forEach
((
item
,
index
)
=>
{
})
arr1
.
push
(
item
.
carNumber
);
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr2
.
push
(
item
.
data
);
arr1
.
push
(
item
.
number
);
})
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
}
else
{
})
arr1
.
push
(
'
暂无数据
'
);
this
.
truckRankListData
.
driverName
=
arr1
;
arr2
.
push
(
0
);
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
}
this
.
truckChangeEcharts
();
})
}
else
if
(
this
.
truckRankListData
.
selectTimeText
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesZhou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
else
if
(
this
.
truckRankListData
.
selectTimeText
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesMou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
this
.
truckChangeEcharts
();
})
})
}
})
})
},
10000
)
},
},
//卡车切换时间
//卡车切换时间
truckChangeTime
(
text
){
truckChangeTime
(
text
)
{
let
that
=
this
;
this
.
truckRankListData
.
selectTimeText
=
text
;
this
.
truckRankListData
.
selectTimeText
=
text
;
let
truckQuery1
=
{};
this
.
loadData
();
truckQuery1
.
size
=
7
;
truckQuery1
.
sort
=
this
.
truckRankListData
.
selectFieldText
;
truckQuery1
.
carclass
=
this
.
truckRankListData
.
carclass
;
if
(
text
==
'
day
'
){
HttpReq
.
truckDispatching
.
apiManmadesDay1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
else
if
(
text
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesZhou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
else
if
(
text
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesMou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
},
},
//卡车切换字段排序
//卡车切换字段排序
truckChangeField
(
text
)
{
truckChangeField
(
text
)
{
let
that
=
this
;
let
that
=
this
;
this
.
truckRankListData
.
selectFieldText
=
text
;
this
.
truckRankListData
.
selectFieldText
=
text
;
let
truckQuery1
=
{};
let
truckQuery1
=
{};
truckQuery1
.
size
=
7
;
truckQuery1
.
size
=
7
;
truckQuery1
.
sort
=
this
.
truckRankListData
.
selectFieldText
;
truckQuery1
.
sort
=
this
.
truckRankListData
.
selectFieldText
;
truckQuery1
.
carclass
=
this
.
truckRankListData
.
carclass
;
truckQuery1
.
carclass
=
this
.
truckRankListData
.
carclass
;
if
(
text
==
'
juli
'
)
{
if
(
text
==
'
juli
'
)
{
this
.
truckRankListData
.
echartsX
=
'
km
'
;
this
.
truckRankListData
.
echartsX
=
'
km
'
;
}
else
if
(
text
==
'
time
'
)
{
}
else
if
(
text
==
'
time
'
)
{
this
.
truckRankListData
.
echartsX
=
'
H
'
;
this
.
truckRankListData
.
echartsX
=
'
min
'
;
}
else
if
(
text
==
'
zcar
'
)
{
}
else
if
(
text
==
'
yunZaiNumber
'
)
{
this
.
truckRankListData
.
echartsX
=
'
吨
'
;
this
.
truckRankListData
.
echartsX
=
'
吨
'
;
}
else
if
(
text
==
'
waiting
'
)
{
}
else
if
(
text
==
'
jieDanNumber
'
)
{
this
.
truckRankListData
.
echartsX
=
'
次
'
;
this
.
truckRankListData
.
echartsX
=
'
次
'
;
}
}
this
.
$nextTick
(()
=>
{
this
.
loadData
();
if
(
this
.
truckRankListData
.
selectTimeText
==
'
day
'
){
HttpReq
.
truckDispatching
.
apiManmadesDay1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
else
if
(
this
.
truckRankListData
.
selectTimeText
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesZhou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
else
if
(
this
.
truckRankListData
.
selectTimeText
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesMou1Query
(
truckQuery1
).
then
((
res
)
=>
{
let
arr1
=
[];
let
arr2
=
[];
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
a
[
that
.
truckRankListData
.
selectFieldText
]
-
b
[
that
.
truckRankListData
.
selectFieldText
];
})
transitionRes
.
forEach
((
item
,
index
)
=>
{
arr1
.
push
(
item
.
number
);
arr2
.
push
(
item
[
this
.
truckRankListData
.
selectFieldText
]);
})
this
.
truckRankListData
.
driverName
=
arr1
;
this
.
truckRankListData
.
driverSeriesData
=
arr2
;
this
.
truckChangeEcharts
();
})
}
})
},
},
//卡车排行榜Echarts
//卡车排行榜Echarts
truckChangeEcharts
()
{
truckChangeEcharts
()
{
echarts
.
init
(
document
.
getElementById
(
'
carManScrView_leftView_content_views3_1
'
)).
dispose
();
echarts
.
init
(
document
.
getElementById
(
'
carManScrView_leftView_content_views3_1
'
)).
dispose
();
var
myChart
=
echarts
.
init
(
document
.
getElementById
(
'
carManScrView_leftView_content_views3_1
'
));
var
myChart
=
echarts
.
init
(
document
.
getElementById
(
'
carManScrView_leftView_content_views3_1
'
));
var
option
=
{
var
option
=
{
...
@@ -292,13 +130,13 @@ export default {
...
@@ -292,13 +130,13 @@ export default {
}
}
},
},
grid
:
{
grid
:
{
top
:
'
18%
'
,
top
:
'
18%
'
,
left
:
'
1%
'
,
left
:
'
1%
'
,
bottom
:
'
0%
'
,
bottom
:
'
0%
'
,
containLabel
:
true
containLabel
:
true
},
},
xAxis
:
{
xAxis
:
{
name
:
this
.
truckRankListData
.
echartsX
,
name
:
this
.
truckRankListData
.
echartsX
,
type
:
'
value
'
,
type
:
'
value
'
,
boundaryGap
:
[
0
,
0.01
],
boundaryGap
:
[
0
,
0.01
],
axisLabel
:
{
axisLabel
:
{
...
@@ -315,7 +153,7 @@ export default {
...
@@ -315,7 +153,7 @@ export default {
}
}
},
},
yAxis
:
{
yAxis
:
{
name
:
'
车牌号
'
,
name
:
'
车牌号
'
,
type
:
'
category
'
,
type
:
'
category
'
,
data
:
this
.
truckRankListData
.
driverName
,
data
:
this
.
truckRankListData
.
driverName
,
axisLabel
:
{
axisLabel
:
{
...
@@ -337,8 +175,8 @@ export default {
...
@@ -337,8 +175,8 @@ export default {
barWidth
:
12
,
barWidth
:
12
,
itemStyle
:
{
itemStyle
:
{
color
:
new
echarts
.
graphic
.
LinearGradient
(
0
,
0
,
1
,
0
,
[
color
:
new
echarts
.
graphic
.
LinearGradient
(
0
,
0
,
1
,
0
,
[
{
offset
:
0
,
color
:
'
#23FFE2
'
},
{
offset
:
0
,
color
:
'
#23FFE2
'
},
{
offset
:
1
,
color
:
'
#0F86EB
'
}
{
offset
:
1
,
color
:
'
#0F86EB
'
}
])
])
},
},
...
@@ -350,8 +188,8 @@ export default {
...
@@ -350,8 +188,8 @@ export default {
option
&&
myChart
.
setOption
(
option
);
option
&&
myChart
.
setOption
(
option
);
},
},
},
},
beforeDestroy
()
{
beforeDestroy
()
{
if
(
this
.
DPcomputer11BoxTimer
)
{
if
(
this
.
DPcomputer11BoxTimer
)
{
clearInterval
(
this
.
DPcomputer11BoxTimer
);
clearInterval
(
this
.
DPcomputer11BoxTimer
);
this
.
DPcomputer11BoxTimer
=
null
;
this
.
DPcomputer11BoxTimer
=
null
;
}
}
...
@@ -360,24 +198,26 @@ export default {
...
@@ -360,24 +198,26 @@ export default {
</
script
>
</
script
>
<
style
scoped
>
<
style
scoped
>
*
{
*
{
margin
:
0
;
margin
:
0
;
padding
:
0
;
padding
:
0
;
}
}
.DPcomputer11Box
{
.DPcomputer11Box
{
width
:
20vw
;
width
:
20vw
;
height
:
32vh
;
height
:
32vh
;
background-color
:
rgba
(
32
,
42
,
67
,
0.95
);
background-color
:
rgba
(
32
,
42
,
67
,
0.95
);
padding
:
5px
7px
;
padding
:
5px
7px
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
overflow
:
hidden
;
overflow
:
hidden
;
}
}
.DPcomputer11Box
.carManScrView_leftView_title
{
.DPcomputer11Box
.carManScrView_leftView_title
{
margin-bottom
:
5px
;
margin-bottom
:
5px
;
width
:
100%
;
width
:
100%
;
height
:
3.5vh
;
height
:
3.5vh
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/biaoti1.png')
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/biaoti1.png')
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
padding-left
:
10px
;
padding-left
:
10px
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
font-size
:
18px
;
font-size
:
18px
;
...
@@ -386,12 +226,14 @@ export default {
...
@@ -386,12 +226,14 @@ export default {
letter-spacing
:
1px
;
letter-spacing
:
1px
;
text-shadow
:
1px
1px
1px
#92CBFF
;
text-shadow
:
1px
1px
1px
#92CBFF
;
}
}
.DPcomputer11Box
.truck_titleStyle
{
.DPcomputer11Box
.truck_titleStyle
{
display
:
flex
;
display
:
flex
;
justify-content
:
space-between
;
justify-content
:
space-between
;
padding-right
:
4vw
;
padding-right
:
4vw
;
}
}
.DPcomputer11Box
.driverTitleDateStyle
{
.DPcomputer11Box
.driverTitleDateStyle
{
display
:
flex
;
display
:
flex
;
color
:
#06EFFE
;
color
:
#06EFFE
;
font-size
:
16px
;
font-size
:
16px
;
...
@@ -399,38 +241,43 @@ export default {
...
@@ -399,38 +241,43 @@ export default {
height
:
3.5vh
;
height
:
3.5vh
;
align-items
:
center
;
align-items
:
center
;
}
}
.DPcomputer11Box
.driverTitleDateStyle_son1
{
.DPcomputer11Box
.driverTitleDateStyle_son1
{
height
:
2.5vh
;
height
:
2.5vh
;
line-height
:
2.5vh
;
line-height
:
2.5vh
;
margin-right
:
5px
;
margin-right
:
5px
;
padding
:
0px
5px
;
padding
:
0px
5px
;
background-color
:
#2DB3BB
;
background-color
:
#2DB3BB
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
border-radius
:
5px
;
border-radius
:
5px
;
cursor
:
pointer
;
cursor
:
pointer
;
}
}
.DPcomputer11Box
.driverTitleDateStyle_son2
{
.DPcomputer11Box
.driverTitleDateStyle_son2
{
height
:
2.5vh
;
height
:
2.5vh
;
line-height
:
2.5vh
;
line-height
:
2.5vh
;
margin-right
:
5px
;
margin-right
:
5px
;
padding
:
0px
5px
;
padding
:
0px
5px
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
border-radius
:
5px
;
border-radius
:
5px
;
cursor
:
pointer
;
cursor
:
pointer
;
}
}
.DPcomputer11Box
.carManScrView_rightView_content
{
.DPcomputer11Box
.carManScrView_rightView_content
{
width
:
100%
;
width
:
100%
;
height
:
27vh
;
height
:
27vh
;
}
}
.DPcomputer11Box
.carManScrView_leftView_content_views2
{
.DPcomputer11Box
.carManScrView_leftView_content_views2
{
display
:
flex
;
display
:
flex
;
justify-content
:
space-between
;
justify-content
:
space-between
;
}
}
.DPcomputer11Box
.carManScrView_leftView_content_views2
>
div
{
.DPcomputer11Box
.carManScrView_leftView_content_views2
>
div
{
height
:
2.5vh
;
height
:
2.5vh
;
width
:
24%
;
width
:
24%
;
font-size
:
15px
;
font-size
:
15px
;
border
:
2px
solid
#01A6FC
;
border
:
2px
solid
#01A6FC
;
border-radius
:
5px
;
border-radius
:
5px
;
color
:
#06EFFE
;
color
:
#06EFFE
;
line-height
:
2.2vh
;
line-height
:
2.2vh
;
...
@@ -438,15 +285,18 @@ export default {
...
@@ -438,15 +285,18 @@ export default {
cursor
:
pointer
;
cursor
:
pointer
;
font-weight
:
600
;
font-weight
:
600
;
}
}
.DPcomputer11Box
.selectFieldStyle
{
.DPcomputer11Box
.selectFieldStyle
{
opacity
:
0.7
;
opacity
:
0.7
;
}
}
.DPcomputer11Box
.carManScrView_leftView_content_views3
{
.DPcomputer11Box
.carManScrView_leftView_content_views3
{
width
:
100%
;
width
:
100%
;
height
:
24vh
;
height
:
24vh
;
overflow-y
:
auto
;
overflow-y
:
auto
;
scrollbar-width
:
none
;
scrollbar-width
:
none
;
}
}
.DPcomputer11Box
.carManScrView_leftView_content_views3
::-webkit-scrollbar
{
.DPcomputer11Box
.carManScrView_leftView_content_views3
::-webkit-scrollbar
{
display
:
none
;
display
:
none
;
}
}
...
...
src/views/MLargeScreen/components/smallComponents/DPcomputer12.vue
View file @
27e5ba9a
...
@@ -4,43 +4,64 @@
...
@@ -4,43 +4,64 @@
<div
class=
"carManScrView_leftView_title truck_titleStyle"
>
<div
class=
"carManScrView_leftView_title truck_titleStyle"
>
<div>
铲车排行榜
</div>
<div>
铲车排行榜
</div>
<div
class=
"driverTitleDateStyle"
>
<div
class=
"driverTitleDateStyle"
>
<div
:class=
"forkLiftRankListData.selectTimeText == 'day' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"forkLiftChangeTime('day')"
>
日
</div>
<div
<div
:class=
"forkLiftRankListData.selectTimeText == 'week' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"forkLiftChangeTime('week')"
>
周
</div>
:class=
"forkLiftRankListData.selectTimeText == 'day' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
<div
:class=
"forkLiftRankListData.selectTimeText == 'month' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"forkLiftChangeTime('month')"
>
月
</div>
@
click=
"forkLiftChangeTime('day')"
>
日
</div>
<div
:class=
"forkLiftRankListData.selectTimeText == 'week' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"forkLiftChangeTime('week')"
>
周
</div>
<div
:class=
"forkLiftRankListData.selectTimeText == 'month' ? 'driverTitleDateStyle_son1' : 'driverTitleDateStyle_son2' "
@
click=
"forkLiftChangeTime('month')"
>
月
</div>
</div>
</div>
</div>
</div>
<div
class=
"carManScrView_leftView_content"
>
<div
class=
"carManScrView_leftView_content"
>
<div
class=
"carManScrView_leftView_content_views2"
>
<div
class=
"carManScrView_leftView_content_views2"
>
<div
:class=
"forkLiftRankListData.selectFieldText == 'time' ? '' : 'selectFieldStyle' "
@
click=
"forkLiftChangeField('time')"
>
工作时长
</div>
<div
:class=
"forkLiftRankListData.selectFieldText == 'workTime' ? '' : 'selectFieldStyle' "
<div
:class=
"forkLiftRankListData.selectFieldText == 'average' ? '' : 'selectFieldStyle' "
@
click=
"forkLiftChangeField('average')"
>
平均时长
</div>
@
click=
"forkLiftChangeField('workTime')"
>
工作时长
<div
:class=
"forkLiftRankListData.selectFieldText == 'yunzai' ? '' : 'selectFieldStyle' "
@
click=
"forkLiftChangeField('yunzai')"
>
装车量
</div>
</div>
<div
:class=
"forkLiftRankListData.selectFieldText == 'jiedan' ? '' : 'selectFieldStyle' "
@
click=
"forkLiftChangeField('jiedan')"
>
装车数
</div>
<div
:class=
"forkLiftRankListData.selectFieldText == 'aveTime' ? '' : 'selectFieldStyle' "
@
click=
"forkLiftChangeField('aveTime')"
>
平均时长
</div>
<div
:class=
"forkLiftRankListData.selectFieldText == 'loadingCapacity' ? '' : 'selectFieldStyle' "
@
click=
"forkLiftChangeField('loadingCapacity')"
>
装车量
</div>
</div>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'time'"
>
<div
:class=
"forkLiftRankListData.selectFieldText == 'loadingTimes' ? '' : 'selectFieldStyle' "
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
:class=
"'forkliftRankTwo' + (index + 1)"
>
@
click=
"forkLiftChangeField('loadingTimes')"
>
装车数
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
car
}}
</div>
</div>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
time
}}
H
</div>
</div>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'workTime'"
>
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
:class=
"'forkliftRankTwo' + (index + 1)"
>
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
carNumber
}}
</div>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
data
}}
min
</div>
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
</div>
</div>
</div>
</div>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'average'"
>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'aveTime'"
>
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
:class=
"'forkliftRankTwo' + (index + 1)"
>
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
car
}}
</div>
:class=
"'forkliftRankTwo' + (index + 1)"
>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
average
}}
H
</div>
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
carNumber
}}
</div>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
data
}}
min
</div>
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
</div>
</div>
</div>
</div>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'yunzai'"
>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'loadingCapacity'"
>
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
:class=
"'forkliftRankTwo' + (index + 1)"
>
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
car
}}
</div>
:class=
"'forkliftRankTwo' + (index + 1)"
>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
yunzai
}}
吨
</div>
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
carNumber
}}
</div>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
data
}}
吨
</div>
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
</div>
</div>
</div>
</div>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'jiedan'"
>
<div
class=
"carManScrView_leftView_content_views3"
v-if=
"forkLiftRankListData.selectFieldText == 'loadingTimes'"
>
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
:class=
"'forkliftRankTwo' + (index + 1)"
>
<div
v-for=
"(item,index) in forkLiftRankListData.listData"
:key=
"index"
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
car
}}
</div>
:class=
"'forkliftRankTwo' + (index + 1)"
>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
jiedan
}}
辆
</div>
<div
style=
"color:#BCF0FE;width: 45%;"
>
{{
item
.
carNumber
}}
</div>
<div
style=
"color:#1AC9FF;width: 39%;"
>
{{
item
.
data
}}
辆
</div>
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
<!--
<div
style=
"color:#BCF0FE;"
>
{{
item
.
createTime
}}
</div>
-->
</div>
</div>
</div>
</div>
...
@@ -49,160 +70,65 @@
...
@@ -49,160 +70,65 @@
</
template
>
</
template
>
<
script
>
<
script
>
import
{
Tools
,
HttpReq
,
CAMap
}
from
'
@/assets/js/common.js
'
;
import
{
Tools
,
HttpReq
,
CAMap
}
from
'
@/assets/js/common.js
'
;
export
default
{
export
default
{
data
()
{
data
()
{
return
{
return
{
DPcomputer12BoxTimer
:
null
,
DPcomputer12BoxTimer
:
null
,
//铲车排行榜
//铲车排行榜
forkLiftRankListData
:{
forkLiftRankListData
:
{
carclass
:
'
铲车
'
,
carclass
:
'
铲车
'
,
selectTimeText
:
'
day
'
,
selectTimeText
:
'
day
'
,
selectFieldText
:
'
time
'
,
selectFieldText
:
'
workTime
'
,
listData
:[],
listData
:
[
{
carNumber
:
''
,
data
:
0
},
{
carNumber
:
''
,
data
:
0
},
{
carNumber
:
''
,
data
:
0
},
{
carNumber
:
''
,
data
:
0
},
{
carNumber
:
''
,
data
:
0
}
],
},
},
}
}
},
},
mounted
()
{
mounted
()
{
this
.
loadData
();
this
.
loadData
();
this
.
DPcomputer12BoxTimer
=
setInterval
(()
=>
{
this
.
loadData
();
},
20000
)
},
},
methods
:{
methods
:
{
loadData
(){
loadData
()
{
let
that
=
this
;
//获取铲车排行榜
//获取铲车排行榜
let
forkLiftQuery1
=
{};
let
forkLiftQuery1
=
{};
forkLiftQuery1
.
size
=
5
;
forkLiftQuery1
.
size
=
5
;
forkLiftQuery1
.
sort
=
this
.
forkLiftRankListData
.
selectFieldText
;
forkLiftQuery1
.
sort
=
this
.
forkLiftRankListData
.
selectFieldText
;
forkLiftQuery1
.
carclass
=
this
.
forkLiftRankListData
.
carclass
;
forkLiftQuery1
.
carclass
=
this
.
forkLiftRankListData
.
carclass
;
this
.
$nextTick
(()
=>
{
forkLiftQuery1
.
duration
=
this
.
forkLiftRankListData
.
selectTimeText
;
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
day
'
)
{
this
.
$nextTick
(()
=>
{
HttpReq
.
truckDispatching
.
apiManmadeschanjiedanDayQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
HttpReq
.
truckDispatching
.
apiManmadeschanjiedanDayQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
if
(
res
.
data
&&
res
.
data
.
length
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
this
.
forkLiftRankListData
.
listData
=
res
.
data
;
})
}
else
{
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
this
.
forkLiftRankListData
.
listData
=
[{
carNumber
:
''
,
data
:
0
},{
carNumber
:
''
,
data
:
0
},{
carNumber
:
''
,
data
:
0
},{
carNumber
:
''
,
data
:
0
},{
carNumber
:
''
,
data
:
0
}];
})
}
else
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanZhouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
else
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanMouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
}
})
})
this
.
DPcomputer12BoxTimer
=
setInterval
(()
=>
{
//获取铲车排行榜
let
forkLiftQuery1
=
{};
forkLiftQuery1
.
size
=
5
;
forkLiftQuery1
.
sort
=
this
.
forkLiftRankListData
.
selectFieldText
;
forkLiftQuery1
.
carclass
=
this
.
forkLiftRankListData
.
carclass
;
this
.
$nextTick
(()
=>
{
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
day
'
){
HttpReq
.
truckDispatching
.
apiManmadeschanjiedanDayQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
else
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanZhouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
else
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanMouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
})
})
},
20000
)
},
},
//铲车切换时间
//铲车切换时间
forkLiftChangeTime
(
text
){
forkLiftChangeTime
(
text
)
{
let
that
=
this
;
this
.
forkLiftRankListData
.
selectTimeText
=
text
;
this
.
forkLiftRankListData
.
selectTimeText
=
text
;
let
forkLiftQuery1
=
{};
this
.
loadData
();
forkLiftQuery1
.
size
=
5
;
forkLiftQuery1
.
sort
=
this
.
forkLiftRankListData
.
selectFieldText
;
forkLiftQuery1
.
carclass
=
this
.
forkLiftRankListData
.
carclass
;
if
(
text
==
'
day
'
){
HttpReq
.
truckDispatching
.
apiManmadeschanjiedanDayQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
if
(
text
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanZhouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
if
(
text
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanMouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
},
},
//铲车切换字段排序
//铲车切换字段排序
forkLiftChangeField
(
text
){
forkLiftChangeField
(
text
)
{
let
that
=
this
;
this
.
forkLiftRankListData
.
selectFieldText
=
text
;
this
.
forkLiftRankListData
.
selectFieldText
=
text
;
let
forkLiftQuery1
=
{};
this
.
loadData
();
forkLiftQuery1
.
size
=
5
;
forkLiftQuery1
.
sort
=
this
.
forkLiftRankListData
.
selectFieldText
;
forkLiftQuery1
.
carclass
=
this
.
forkLiftRankListData
.
carclass
;
this
.
$nextTick
(()
=>
{
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
day
'
){
HttpReq
.
truckDispatching
.
apiManmadeschanjiedanDayQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
else
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
week
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanZhouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
else
if
(
this
.
forkLiftRankListData
.
selectTimeText
==
'
month
'
){
HttpReq
.
truckDispatching
.
apiManmadesChanjiedanMouQuery
(
forkLiftQuery1
).
then
((
res
)
=>
{
let
transitionRes
=
res
.
sort
(
function
(
a
,
b
){
return
b
[
that
.
forkLiftRankListData
.
selectFieldText
]
-
a
[
that
.
forkLiftRankListData
.
selectFieldText
];
})
this
.
forkLiftRankListData
.
listData
=
transitionRes
;
})
}
})
},
},
},
},
beforeDestroy
()
{
beforeDestroy
()
{
if
(
this
.
DPcomputer12BoxTimer
)
{
if
(
this
.
DPcomputer12BoxTimer
)
{
clearInterval
(
this
.
DPcomputer12BoxTimer
);
clearInterval
(
this
.
DPcomputer12BoxTimer
);
this
.
DPcomputer12BoxTimer
=
null
;
this
.
DPcomputer12BoxTimer
=
null
;
}
}
...
@@ -211,24 +137,26 @@ export default {
...
@@ -211,24 +137,26 @@ export default {
</
script
>
</
script
>
<
style
scoped
>
<
style
scoped
>
*
{
*
{
margin
:
0
;
margin
:
0
;
padding
:
0
;
padding
:
0
;
}
}
.DPcomputer12Box
{
.DPcomputer12Box
{
width
:
20vw
;
width
:
20vw
;
height
:
32vh
;
height
:
32vh
;
background-color
:
rgba
(
32
,
42
,
67
,
0.95
);
background-color
:
rgba
(
32
,
42
,
67
,
0.95
);
padding
:
5px
7px
;
padding
:
5px
7px
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
overflow
:
hidden
;
overflow
:
hidden
;
}
}
.DPcomputer12Box
.carManScrView_leftView_title
{
.DPcomputer12Box
.carManScrView_leftView_title
{
margin-bottom
:
5px
;
margin-bottom
:
5px
;
width
:
100%
;
width
:
100%
;
height
:
3.5vh
;
height
:
3.5vh
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/biaoti1.png')
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/biaoti1.png')
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
padding-left
:
10px
;
padding-left
:
10px
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
font-size
:
18px
;
font-size
:
18px
;
...
@@ -237,12 +165,14 @@ export default {
...
@@ -237,12 +165,14 @@ export default {
letter-spacing
:
1px
;
letter-spacing
:
1px
;
text-shadow
:
1px
1px
1px
#92CBFF
;
text-shadow
:
1px
1px
1px
#92CBFF
;
}
}
.DPcomputer12Box
.truck_titleStyle
{
.DPcomputer12Box
.truck_titleStyle
{
display
:
flex
;
display
:
flex
;
justify-content
:
space-between
;
justify-content
:
space-between
;
padding-right
:
4vw
;
padding-right
:
4vw
;
}
}
.DPcomputer12Box
.driverTitleDateStyle
{
.DPcomputer12Box
.driverTitleDateStyle
{
display
:
flex
;
display
:
flex
;
color
:
#06EFFE
;
color
:
#06EFFE
;
font-size
:
16px
;
font-size
:
16px
;
...
@@ -250,38 +180,43 @@ export default {
...
@@ -250,38 +180,43 @@ export default {
height
:
3.5vh
;
height
:
3.5vh
;
align-items
:
center
;
align-items
:
center
;
}
}
.DPcomputer12Box
.driverTitleDateStyle_son1
{
.DPcomputer12Box
.driverTitleDateStyle_son1
{
height
:
2.5vh
;
height
:
2.5vh
;
line-height
:
2.5vh
;
line-height
:
2.5vh
;
margin-right
:
5px
;
margin-right
:
5px
;
padding
:
0px
5px
;
padding
:
0px
5px
;
background-color
:
#2DB3BB
;
background-color
:
#2DB3BB
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
border-radius
:
5px
;
border-radius
:
5px
;
cursor
:
pointer
;
cursor
:
pointer
;
}
}
.DPcomputer12Box
.driverTitleDateStyle_son2
{
.DPcomputer12Box
.driverTitleDateStyle_son2
{
height
:
2.5vh
;
height
:
2.5vh
;
line-height
:
2.5vh
;
line-height
:
2.5vh
;
margin-right
:
5px
;
margin-right
:
5px
;
padding
:
0px
5px
;
padding
:
0px
5px
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
border-radius
:
5px
;
border-radius
:
5px
;
cursor
:
pointer
;
cursor
:
pointer
;
}
}
.DPcomputer12Box
.carManScrView_leftView_content
{
.DPcomputer12Box
.carManScrView_leftView_content
{
width
:
100%
;
width
:
100%
;
height
:
27vh
;
height
:
27vh
;
}
}
.DPcomputer12Box
.carManScrView_leftView_content_views2
{
.DPcomputer12Box
.carManScrView_leftView_content_views2
{
display
:
flex
;
display
:
flex
;
justify-content
:
space-between
;
justify-content
:
space-between
;
}
}
.DPcomputer12Box
.carManScrView_leftView_content_views2
>
div
{
.DPcomputer12Box
.carManScrView_leftView_content_views2
>
div
{
height
:
2.5vh
;
height
:
2.5vh
;
width
:
24%
;
width
:
24%
;
font-size
:
15px
;
font-size
:
15px
;
border
:
2px
solid
#01A6FC
;
border
:
2px
solid
#01A6FC
;
border-radius
:
5px
;
border-radius
:
5px
;
color
:
#06EFFE
;
color
:
#06EFFE
;
line-height
:
2.2vh
;
line-height
:
2.2vh
;
...
@@ -289,19 +224,23 @@ export default {
...
@@ -289,19 +224,23 @@ export default {
cursor
:
pointer
;
cursor
:
pointer
;
font-weight
:
600
;
font-weight
:
600
;
}
}
.DPcomputer12Box
.selectFieldStyle
{
.DPcomputer12Box
.selectFieldStyle
{
opacity
:
0.7
;
opacity
:
0.7
;
}
}
.DPcomputer12Box
.carManScrView_leftView_content_views3
{
.DPcomputer12Box
.carManScrView_leftView_content_views3
{
width
:
100%
;
width
:
100%
;
height
:
24vh
;
height
:
24vh
;
overflow-y
:
auto
;
overflow-y
:
auto
;
scrollbar-width
:
none
;
scrollbar-width
:
none
;
}
}
.DPcomputer12Box
.carManScrView_leftView_content_views3
::-webkit-scrollbar
{
.DPcomputer12Box
.carManScrView_leftView_content_views3
::-webkit-scrollbar
{
display
:
none
;
display
:
none
;
}
}
.DPcomputer12Box
.forkliftRankTwo1
{
.DPcomputer12Box
.forkliftRankTwo1
{
margin-top
:
1vh
;
margin-top
:
1vh
;
margin-bottom
:
1.5vh
;
margin-bottom
:
1.5vh
;
display
:
flex
;
display
:
flex
;
...
@@ -309,59 +248,63 @@ export default {
...
@@ -309,59 +248,63 @@ export default {
width
:
100%
;
width
:
100%
;
height
:
3vh
;
height
:
3vh
;
line-height
:
3vh
;
line-height
:
3vh
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list1.png')
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list1.png')
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
padding-left
:
4vw
;
padding-left
:
4vw
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
text-align
:
center
;
text-align
:
center
;
}
}
.DPcomputer12Box
.forkliftRankTwo2
{
.DPcomputer12Box
.forkliftRankTwo2
{
margin-bottom
:
1.5vh
;
margin-bottom
:
1.5vh
;
display
:
flex
;
display
:
flex
;
justify-content
:
space-evenly
;
justify-content
:
space-evenly
;
width
:
100%
;
width
:
100%
;
height
:
3vh
;
height
:
3vh
;
line-height
:
3vh
;
line-height
:
3vh
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list2.png')
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list2.png')
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
padding-left
:
4vw
;
padding-left
:
4vw
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
text-align
:
center
;
text-align
:
center
;
}
}
.DPcomputer12Box
.forkliftRankTwo3
{
.DPcomputer12Box
.forkliftRankTwo3
{
margin-bottom
:
1.5vh
;
margin-bottom
:
1.5vh
;
display
:
flex
;
display
:
flex
;
justify-content
:
space-evenly
;
justify-content
:
space-evenly
;
width
:
100%
;
width
:
100%
;
height
:
3vh
;
height
:
3vh
;
line-height
:
3vh
;
line-height
:
3vh
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list3.png')
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list3.png')
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
padding-left
:
4vw
;
padding-left
:
4vw
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
text-align
:
center
;
text-align
:
center
;
}
}
.DPcomputer12Box
.forkliftRankTwo4
{
.DPcomputer12Box
.forkliftRankTwo4
{
margin-bottom
:
1.5vh
;
margin-bottom
:
1.5vh
;
display
:
flex
;
display
:
flex
;
justify-content
:
space-evenly
;
justify-content
:
space-evenly
;
width
:
100%
;
width
:
100%
;
height
:
3vh
;
height
:
3vh
;
line-height
:
3vh
;
line-height
:
3vh
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list4.png')
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list4.png')
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
padding-left
:
4vw
;
padding-left
:
4vw
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
text-align
:
center
;
text-align
:
center
;
}
}
.DPcomputer12Box
.forkliftRankTwo5
{
.DPcomputer12Box
.forkliftRankTwo5
{
display
:
flex
;
display
:
flex
;
justify-content
:
space-evenly
;
justify-content
:
space-evenly
;
width
:
100%
;
width
:
100%
;
height
:
3vh
;
height
:
3vh
;
line-height
:
3vh
;
line-height
:
3vh
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list5.png')
;
background
:
no-repeat
center
center
url('~@/assets/images/cutGraph/list5.png')
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
padding-left
:
4vw
;
padding-left
:
4vw
;
box-sizing
:
border-box
;
box-sizing
:
border-box
;
text-align
:
center
;
text-align
:
center
;
...
...
src/views/MLargeScreen/components/smallComponents/DPcomputer5.vue
View file @
27e5ba9a
...
@@ -4,48 +4,47 @@
...
@@ -4,48 +4,47 @@
<div
class=
"dataScrView_centerView_title"
>
<div
class=
"dataScrView_centerView_title"
>
<div
:class=
"centerViewData.moduleText == 'centerModule1' ? 'centerModuleSelectStyle' : ''"
@
click=
"centerSelectFn('centerModule1')"
>
产量数据
</div>
<div
:class=
"centerViewData.moduleText == 'centerModule1' ? 'centerModuleSelectStyle' : ''"
@
click=
"centerSelectFn('centerModule1')"
>
产量数据
</div>
<div
:class=
"centerViewData.moduleText == 'centerModule2' ? 'centerModuleSelectStyle' : ''"
@
click=
"centerSelectFn('centerModule2')"
>
运载数据
</div>
<div
:class=
"centerViewData.moduleText == 'centerModule2' ? 'centerModuleSelectStyle' : ''"
@
click=
"centerSelectFn('centerModule2')"
>
运载数据
</div>
<!--
<div
:class=
"centerViewData.moduleText == 'centerModule3' ? 'centerModuleSelectStyle' : ''"
@
click=
"centerSelectFn('centerModule3')"
>
装载数据
</div>
-->
</div>
</div>
<div
class=
"dataScrView_centerView_planNum"
v-if=
"centerViewData.moduleText == 'centerModule1'"
>
<div
class=
"dataScrView_centerView_planNum"
v-if=
"centerViewData.moduleText == 'centerModule1'"
>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日计划量
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日计划量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
outputMineData
.
day
.
plan
}}
吨
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
clData
.
todayPlan
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/renwujihua1.png"
>
<img
src=
"../../../../assets/images/cutGraph/renwujihua1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日完成量
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日完成量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
outputMineData
.
day
.
finish
}}
吨
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
clData
.
todayComplete
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/mubiaoguanli1.png"
>
<img
src=
"../../../../assets/images/cutGraph/mubiaoguanli1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日完成率
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日完成率
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
parseInt
(
outputMineData
.
day
.
eff
)
}}
%
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
clData
.
todayCompleteRate
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/wancheng1.png"
>
<img
src=
"../../../../assets/images/cutGraph/wancheng1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
当月计划量
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
当月计划量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
outputMineData
.
month
.
plan
}}
吨
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
clData
.
toMonthPlan
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/jihuarenwu2.png"
>
<img
src=
"../../../../assets/images/cutGraph/jihuarenwu2.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
当月累计完成量
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
当月累计完成量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
outputMineData
.
month
.
finish
}}
吨
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
clData
.
toMonthComplete
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/zichantongji1.png"
>
<img
src=
"../../../../assets/images/cutGraph/zichantongji1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
当月完成率
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
当月完成率
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
parseInt
(
outputMineData
.
month
.
eff
)
}}
%
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
clData
.
toMonthCompleteRate
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/wanchenglv1.png"
>
<img
src=
"../../../../assets/images/cutGraph/wanchenglv1.png"
>
</div>
</div>
...
@@ -54,76 +53,46 @@
...
@@ -54,76 +53,46 @@
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日总运载量
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日总运载量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
arryCenterData
.
dayAllCarry1
}}
吨
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
lData
.
yunZaiTotal
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/renwujihua1.png"
>
<img
src=
"../../../../assets/images/cutGraph/renwujihua1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日平均运载量
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日平均运载量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
arryCenterData
.
dayAverageCarry1
}}
吨/小时
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
lData
.
yunZaiAveHour
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/mubiaoguanli1.png"
>
<img
src=
"../../../../assets/images/cutGraph/mubiaoguanli1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日总里程数
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日总里程数
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
arryCenterData
.
dayAllMil1
}}
KM
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
lData
.
milTotal
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/wancheng1.png"
>
<img
src=
"../../../../assets/images/cutGraph/wancheng1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日总车数
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日总车数
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
arryCenterData
.
dayAllCarNum
?
carryCenterData
.
dayAllCarNum
:
0
}}
辆
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
lData
.
trainsTotal
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/jihuarenwu2.png"
>
<img
src=
"../../../../assets/images/cutGraph/jihuarenwu2.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
单次运载平均时长
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
单次运载平均时长
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
arryCenterData
.
singleAverageTime
}}
H
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
lData
.
aveSingleTransportTime
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/zichantongji1.png"
>
<img
src=
"../../../../assets/images/cutGraph/zichantongji1.png"
>
</div>
</div>
<div>
<div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
单次运载平均里程
</div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
单次运载平均里程
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
arryCenterData
.
singleAverageMil
}}
KM
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
c
lData
.
aveSingleTransportMil
}}
</div>
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/wanchenglv1.png"
>
<img
src=
"../../../../assets/images/cutGraph/wanchenglv1.png"
>
</div>
</div>
</div>
</div>
<div
class=
"dataScrView_centerView_planNum3"
v-if=
"centerViewData.moduleText == 'centerModule3'"
>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日装载量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
loadCenterData
.
dayAllLoad1
}}
吨
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/renwujihua1.png"
>
</div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日平均装载量
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
loadCenterData
.
dayAverageLoad1
}}
吨/小时
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/mubiaoguanli1.png"
>
</div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日总工时
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
loadCenterData
.
dayAllTime
}}
H
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/wancheng1.png"
>
</div>
<div>
<div>
<div
style=
"color:#FFFFFF;font-size:14px;"
>
今日装载车数
</div>
<div
style=
"color:#00E9FD;font-size:16px;font-weight:600;"
>
{{
loadCenterData
.
dayLoadCarNum
?
loadCenterData
.
dayLoadCarNum
:
0
}}
辆
</div>
</div>
<img
src=
"../../../../assets/images/cutGraph/jihuarenwu2.png"
>
</div>
</div>
<div
id=
"centerEchartsView"
></div>
<div
id=
"centerEchartsView"
></div>
</div>
</div>
</
template
>
</
template
>
...
@@ -134,110 +103,67 @@ import * as echarts from 'echarts';
...
@@ -134,110 +103,67 @@ import * as echarts from 'echarts';
export
default
{
export
default
{
data
()
{
data
()
{
return
{
return
{
DPcomputer5BoxTimer
:
null
,
DPcomputer5BoxTimer
:
null
,
//产量数据以及中间图表数据
//产量数据以及中间图表数据
outputMineData
:
{
outputMineData
:
{
day
:{
finish
:
'
0
'
,
eff
:
0
,
plan
:
'
0
'
,},
day
:
{
finish
:
'
0
'
,
eff
:
0
,
plan
:
'
0
'
,},
month
:{
finish
:
'
0
'
,
eff
:
0
,
plan
:
'
0
'
,},
month
:
{
finish
:
'
0
'
,
eff
:
0
,
plan
:
'
0
'
,},
year
:{
finish
:
'
0
'
,
eff
:
0
,
plan
:
'
0
'
,},
year
:
{
finish
:
'
0
'
,
eff
:
0
,
plan
:
'
0
'
,},
},
},
//运载数据以及中间图表数据
//运载数据以及中间图表数据
carryCenterData
:
{
carryCenterData
:
{
dayAllCarry1
:
0
,
dayAllCarry1
:
0
,
dayAverageCarry1
:
0
,
dayAverageCarry1
:
0
,
dayAllMil1
:
0
,
dayAllMil1
:
0
,
dayAllCarNum
:
0
,
dayAllCarNum
:
0
,
singleAverageTime
:
0
,
singleAverageTime
:
0
,
singleAverageMil
:
0
,
singleAverageMil
:
0
,
},
},
//装载数据据以及中间图表数据
//装载数据据以及中间图表数据
loadCenterData
:
{
loadCenterData
:
{
dayAllLoad1
:
0
,
dayAllLoad1
:
0
,
dayAverageLoad1
:
0
,
dayAverageLoad1
:
0
,
dayAllTime
:
0
,
dayAllTime
:
0
,
dayLoadCarNum
:
0
,
dayLoadCarNum
:
0
,
},
},
//中间模块选择
//中间模块选择
centerViewData
:{
centerViewData
:
{
moduleText
:
'
centerModule1
'
,
moduleText
:
'
centerModule1
'
,
xAxisData
:[
'
00:00
'
,
'
01:00
'
,
'
02:00
'
,
'
03:00
'
,
'
04:00
'
,
'
05:00
'
,
'
06:00
'
,
'
07:00
'
,
'
08:00
'
,
'
09:00
'
,
'
10:00
'
,
'
11:00
'
,
'
12:00
'
,
'
13:00
'
,
'
14:00
'
,
'
15:00
'
,
'
16:00
'
,
'
17:00
'
,
'
18:00
'
,
'
19:00
'
,
'
20:00
'
,
'
21:00
'
,
'
22:00
'
,
'
23:00
'
],
xAxisData
:
[
'
00:00
'
,
'
01:00
'
,
'
02:00
'
,
'
03:00
'
,
'
04:00
'
,
'
05:00
'
,
'
06:00
'
,
'
07:00
'
,
'
08:00
'
,
'
09:00
'
,
'
10:00
'
,
'
11:00
'
,
'
12:00
'
,
'
13:00
'
,
'
14:00
'
,
'
15:00
'
,
'
16:00
'
,
'
17:00
'
,
'
18:00
'
,
'
19:00
'
,
'
20:00
'
,
'
21:00
'
,
'
22:00
'
,
'
23:00
'
],
seriesData
:[
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
],
seriesData
:
[
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
,
0
],
},
clData
:{
toMonthComplete
:
"
暂无数据
"
,
toMonthCompleteRate
:
"
暂无数据
"
,
toMonthPlan
:
"
暂无数据
"
,
todayComplete
:
"
暂无数据
"
,
todayCompleteRate
:
"
暂无数据
"
,
todayPlan
:
"
暂无数据
"
,
yunZaiTotal
:
"
暂无数据
"
,
yunZaiAveHour
:
"
暂无数据
"
,
milTotal
:
"
暂无数据
"
,
trainsTotal
:
"
暂无数据
"
,
aveSingleTransportTime
:
"
暂无数据
"
,
aveSingleTransportMil
:
"
暂无数据
"
,
},
},
}
}
},
},
mounted
(){
mounted
()
{
this
.
loadData
();
this
.
DPcomputer5BoxTimer
=
setInterval
(()
=>
{
this
.
loadData
();
this
.
loadData
();
},
10000
)
},
},
methods
:
{
methods
:
{
loadData
()
{
loadData
()
{
//获取采区当前日产量
//获取采区当前日产量
HttpReq
.
truckDispatching
.
apiPlanDayQuery
().
then
((
res
)
=>
{
HttpReq
.
truckDispatching
.
apiPlanDayQuery
().
then
((
res
)
=>
{
let
undueArray
=
{};
this
.
clData
=
res
.
data
;
if
(
res
.
length
==
0
||
JSON
.
stringify
(
res
[
0
])
==
'
{}
'
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
0
;
undueArray
.
plan
=
0
;
}
else
{
if
(
res
[
0
].
eff
==
''
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
else
{
undueArray
.
eff
=
parseFloat
(
res
[
0
].
eff
)
*
100
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
}
this
.
outputMineData
.
day
=
undueArray
;
})
//获取采区当前月产量
HttpReq
.
truckDispatching
.
apiPlanMonthQuery
().
then
((
res
)
=>
{
let
undueArray
=
{};
if
(
res
.
length
==
0
||
JSON
.
stringify
(
res
[
0
])
==
'
{}
'
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
0
;
undueArray
.
plan
=
0
;
}
else
{
if
(
res
[
0
].
eff
==
''
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
else
{
undueArray
.
eff
=
parseFloat
(
res
[
0
].
eff
)
*
100
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
}
this
.
outputMineData
.
month
=
undueArray
;
})
//获取采区当前年产量
HttpReq
.
truckDispatching
.
apiPlanYearQuery
().
then
((
res
)
=>
{
let
undueArray
=
{};
if
(
res
.
length
==
0
||
JSON
.
stringify
(
res
[
0
])
==
'
{}
'
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
0
;
undueArray
.
plan
=
0
;
}
else
{
if
(
res
[
0
].
eff
==
''
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
else
{
undueArray
.
eff
=
parseFloat
(
res
[
0
].
eff
)
*
100
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
}
this
.
outputMineData
.
year
=
undueArray
;
})
})
//中间echarts图表
//中间echarts图表
HttpReq
.
truckDispatching
.
apiPlanTime1Query
().
then
((
res
)
=>
{
HttpReq
.
truckDispatching
.
apiPlanTime1Query
().
then
((
res
)
=>
{
// let arr3 = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
// res.forEach((item, index) => {
// arr3.splice(parseInt(item.hour) - 7, 1, parseFloat(item.finish));
// })
this
.
centerViewData
.
seriesData
=
res
.
data
||
[];
this
.
centerViewData
.
seriesData
=
res
.
data
||
[];
this
.
centerEcharts
();
this
.
centerEcharts
();
})
})
...
@@ -261,104 +187,11 @@ export default {
...
@@ -261,104 +187,11 @@ export default {
this
.
loadCenterData
.
dayLoadCarNum
=
res
[
0
].
num
;
this
.
loadCenterData
.
dayLoadCarNum
=
res
[
0
].
num
;
}
}
})
})
this
.
DPcomputer5BoxTimer
=
setInterval
(()
=>
{
//获取采区当前日产量
HttpReq
.
truckDispatching
.
apiPlanDayQuery
().
then
((
res
)
=>
{
let
undueArray
=
{};
if
(
res
.
length
==
0
||
JSON
.
stringify
(
res
[
0
])
==
'
{}
'
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
0
;
undueArray
.
plan
=
0
;
}
else
{
if
(
res
[
0
].
eff
==
''
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
else
{
undueArray
.
eff
=
parseFloat
(
res
[
0
].
eff
)
*
100
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
}
this
.
outputMineData
.
day
=
undueArray
;
})
//获取采区当前月产量
HttpReq
.
truckDispatching
.
apiPlanMonthQuery
().
then
((
res
)
=>
{
let
undueArray
=
{};
if
(
res
.
length
==
0
||
JSON
.
stringify
(
res
[
0
])
==
'
{}
'
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
0
;
undueArray
.
plan
=
0
;
}
else
{
if
(
res
[
0
].
eff
==
''
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
else
{
undueArray
.
eff
=
parseFloat
(
res
[
0
].
eff
)
*
100
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
}
this
.
outputMineData
.
month
=
undueArray
;
})
//获取采区当前年产量
HttpReq
.
truckDispatching
.
apiPlanYearQuery
().
then
((
res
)
=>
{
let
undueArray
=
{};
if
(
res
.
length
==
0
||
JSON
.
stringify
(
res
[
0
])
==
'
{}
'
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
0
;
undueArray
.
plan
=
0
;
}
else
{
if
(
res
[
0
].
eff
==
''
)
{
undueArray
.
eff
=
0
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
else
{
undueArray
.
eff
=
parseFloat
(
res
[
0
].
eff
)
*
100
;
undueArray
.
finish
=
res
[
0
].
finish
;
undueArray
.
plan
=
res
[
0
].
plan
;
}
}
this
.
outputMineData
.
year
=
undueArray
;
})
//中间echarts图表
HttpReq
.
truckDispatching
.
apiPlanTime1Query
().
then
((
res
)
=>
{
// let arr3 = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
// res.forEach((item,index)=>{
// arr3.splice(parseInt(item.hour) - 7,1, parseFloat(item.finish));
// })
this
.
centerViewData
.
seriesData
=
res
.
data
||
[];
this
.
centerEcharts
();
})
//中间echarts运载数据
HttpReq
.
truckDispatching
.
apiPlanZDay1Query
().
then
((
res
)
=>
{
if
(
res
.
length
!=
0
)
{
this
.
carryCenterData
.
dayAllCarry1
=
res
[
0
].
finish
;
this
.
carryCenterData
.
dayAverageCarry1
=
parseFloat
(
res
[
0
].
pfin
).
toFixed
(
2
);
this
.
carryCenterData
.
dayAllMil1
=
res
[
0
].
allmil
?
parseFloat
(
res
[
0
].
allmil
).
toFixed
(
3
)
:
0
;
this
.
carryCenterData
.
dayAllCarNum
=
res
[
0
].
num
;
this
.
carryCenterData
.
singleAverageTime
=
parseFloat
(
res
[
0
].
time
).
toFixed
(
2
);
this
.
carryCenterData
.
singleAverageMil
=
res
[
0
].
averagemil
?
parseFloat
(
res
[
0
].
averagemil
).
toFixed
(
3
)
:
0
;
}
})
//中间echarts装载数据
HttpReq
.
truckDispatching
.
apiPlanZMonth1Query
().
then
((
res
)
=>
{
if
(
res
.
length
!=
0
)
{
this
.
loadCenterData
.
dayAllLoad1
=
res
[
0
].
finish
;
this
.
loadCenterData
.
dayAverageLoad1
=
parseFloat
(
res
[
0
].
pfin
).
toFixed
(
2
);
this
.
loadCenterData
.
dayAllTime
=
res
[
0
].
time
;
this
.
loadCenterData
.
dayLoadCarNum
=
res
[
0
].
num
;
}
})
},
10000
)
},
},
//中间模块选择
//中间模块选择
centerSelectFn
(
text
)
{
centerSelectFn
(
text
)
{
this
.
centerViewData
.
moduleText
=
text
;
this
.
centerViewData
.
moduleText
=
text
;
this
.
loadData
();
},
},
//中间模块Echarts
//中间模块Echarts
centerEcharts
()
{
centerEcharts
()
{
...
@@ -440,8 +273,8 @@ export default {
...
@@ -440,8 +273,8 @@ export default {
option
&&
myChart
.
setOption
(
option
);
option
&&
myChart
.
setOption
(
option
);
},
},
},
},
beforeDestroy
()
{
beforeDestroy
()
{
if
(
this
.
DPcomputer5BoxTimer
)
{
if
(
this
.
DPcomputer5BoxTimer
)
{
clearInterval
(
this
.
DPcomputer5BoxTimer
);
clearInterval
(
this
.
DPcomputer5BoxTimer
);
this
.
DPcomputer5BoxTimer
=
null
;
this
.
DPcomputer5BoxTimer
=
null
;
}
}
...
...
src/views/personnelPositioning/beacon/index.vue
View file @
27e5ba9a
...
@@ -196,6 +196,12 @@ export default {
...
@@ -196,6 +196,12 @@ export default {
cancelForm
()
{
cancelForm
()
{
this
.
visible
=
false
;
this
.
visible
=
false
;
this
.
$refs
.
formViewRef
.
resetFields
();
this
.
$refs
.
formViewRef
.
resetFields
();
this
.
formData
=
{
beaconame
:
''
,
beaconumber
:
''
,
xcoordinate
:
''
,
ycoordinate
:
''
,
}
},
},
tableRowClassName
({
row
,
rowIndex
})
{
tableRowClassName
({
row
,
rowIndex
})
{
},
},
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment