Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Z
ZiBoYingJI
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
Kimber
ZiBoYingJI
Commits
5ea66232
Commit
5ea66232
authored
Sep 26, 2024
by
Kimber
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
'update'
parent
f34edae9
Changes
3
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
289 additions
and
177 deletions
+289
-177
index.html
public/datav/index.html
+5
-0
watersource.html
public/datav/watersource.html
+275
-147
vue.config.js
vue.config.js
+9
-30
No files found.
public/datav/index.html
View file @
5ea66232
...
@@ -1264,7 +1264,12 @@
...
@@ -1264,7 +1264,12 @@
loading
.
close
();
loading
.
close
();
this
.
isReady
=
true
;
this
.
isReady
=
true
;
this
.
mineList
=
res
&&
res
.
data
&&
res
.
data
.
results
;
this
.
mineList
=
res
&&
res
.
data
&&
res
.
data
.
results
;
console
.
log
(
'
mineList ________________
'
,
this
.
mineList
);
this
.
mineNumber1
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
1
).
length
;
this
.
mineNumber1
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
1
).
length
;
this
.
mineNumber2
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
2
).
length
;
this
.
mineNumber2
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
2
).
length
;
this
.
mineNumber3
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
3
).
length
;
this
.
mineNumber3
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
3
).
length
;
...
...
public/datav/watersource.html
View file @
5ea66232
...
@@ -297,7 +297,16 @@
...
@@ -297,7 +297,16 @@
}
}
.md9
{
.md9
{
.md1b{
div.chartbox{
height
:
200px
;
}
.md1-wrap
{
padding
:
0
;}
ul
{
height
:
auto
;}
.icon
{
width
:
80px
;
height
:
80px
;}
}
}
}
}
}
</style>
</style>
...
@@ -434,9 +443,8 @@
...
@@ -434,9 +443,8 @@
style=
"background-color: rgba(13,27,48,.7);width: 120px;pointer-events:auto;"
style=
"background-color: rgba(13,27,48,.7);width: 120px;pointer-events:auto;"
@
click=
"isRoad = !isRoad"
>
@
click=
"isRoad = !isRoad"
>
<div
class=
"h50 round flex-text map-icon"
style=
"width: 120px;"
>
<div
class=
"h50 round flex-text map-icon"
style=
"width: 120px;"
>
<div
class=
"round flex-text"
style=
"width: 16px;height: 16px;border: 2px solid #ffffff;"
>
<div
class=
"round flex-text"
style=
"width: 16px;height: 16px;border:2px solid #ffffff;"
>
<div
class=
"round"
style=
"width: 8px;height: 8px;background-color: #ffffff;"
<div
class=
"round"
style=
"width: 8px;height: 8px;background-color:#ffffff;"
v-if=
"isRoad"
></div>
v-if=
"isRoad"
></div>
</div>
</div>
<div
class=
"f20 ml10"
>
路网
</div>
<div
class=
"f20 ml10"
>
路网
</div>
</div>
</div>
...
@@ -479,38 +487,38 @@
...
@@ -479,38 +487,38 @@
</div>
</div>
</div>
</div>
<div
class=
"absolute flex-text"
style=
"bottom: 10px;left: 50%;transform: translateX(-50%);"
>
<div
class=
"absolute flex-text
footer
"
style=
"bottom: 10px;left: 50%;transform: translateX(-50%);"
>
<div
class=
"flex-text"
:style=
"{ transform: 'scale(' + (widthScale > 1 ? 1 : widthScale) + ')' }"
>
<div
class=
"flex-text"
:style=
"{ transform: 'scale(' + (widthScale > 1 ? 1 : widthScale) + ')' }"
>
<div
class=
"flex-text"
:class=
"isFullScreen?'tr-bottom':'tr-bottom-re'"
>
<div
class=
"flex-text"
:class=
"isFullScreen?'tr-bottom':'tr-bottom-re'"
>
<div
class=
"relative
mine-0
"
>
<div
class=
"relative
"
@
click=
"mineTypeEvent(1)"
:class=
"{actv:mineType===1}
"
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-0.png"
alt=
""
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-0.png"
alt=
""
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber1 || '0'}}
</div>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber1 || '0'}}
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
地下矿山
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
地下矿山
</div>
</div>
</div>
</div>
</div>
<div
class=
"relative ml40
mine-1
"
>
<div
class=
"relative ml40
"
@
click=
"mineTypeEvent(2)"
:class=
"{actv:mineType===2}
"
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-1.png"
alt=
""
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-1.png"
alt=
""
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber2 || '0'}}
</div>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber2 || '0'}}
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
露天矿山
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
露天矿山
</div>
</div>
</div>
</div>
</div>
<div
class=
"relative ml40
mine-2
"
>
<div
class=
"relative ml40
"
@
click=
"mineTypeEvent(3)"
:class=
"{actv:mineType===3}
"
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-2.png"
alt=
""
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-2.png"
alt=
""
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber3 || '0'}}
</div>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber3 || '0'}}
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
尾矿库
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
尾矿库
</div>
</div>
</div>
</div>
</div>
<div
class=
"relative ml40
mine-3
"
>
<div
class=
"relative ml40
"
@
click=
"mineTypeEvent(4)"
:class=
"{actv:mineType===4}
"
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-3.png"
alt=
""
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-3.png"
alt=
""
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber4 || '0'}}
</div>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber4 || '0'}}
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
停产矿山
</div>
<div
class=
"f18"
style=
"margin-top: 3px;"
>
停产矿山
</div>
</div>
</div>
</div>
</div>
<div
class=
"relative ml40
mine-3
"
>
<div
class=
"relative ml40
"
@
click=
"mineTypeEvent(5)"
:class=
"{actv:mineType===5}
"
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-4.png"
alt=
""
>
<img
style=
"width: 134px;height: 146px;"
src=
"static/mine-bg-4.png"
alt=
""
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"poa-cover flex-text flex-column"
>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber5 || '0'}}
</div>
<div
class=
"color-theme f30"
style=
"margin-top: -24px;"
>
{{mineNumber5 || '0'}}
</div>
...
@@ -525,8 +533,6 @@
...
@@ -525,8 +533,6 @@
<!-- right -->
<!-- right -->
<div
style=
"transform-origin:right center;right:0;"
class=
"absolute"
:style=
"{transform: 'scale(' + (heightScale) + ')'}"
id=
"rightbar"
>
<div
style=
"transform-origin:right center;right:0;"
class=
"absolute"
:style=
"{transform: 'scale(' + (heightScale) + ')'}"
id=
"rightbar"
>
<!-- 变形监测报警统计 -->
<!-- 变形监测报警统计 -->
<!-- <div style="width:514px;background:rgba(0,0,0,.25);padding:10px 0;" class="l-md3">
<!-- <div style="width:514px;background:rgba(0,0,0,.25);padding:10px 0;" class="l-md3">
<div class="ml10 flex align-center f20 color-theme wp100"
<div class="ml10 flex align-center f20 color-theme wp100"
...
@@ -546,7 +552,7 @@
...
@@ -546,7 +552,7 @@
</div> -->
</div> -->
<!-- 风速监测 -->
<!-- 风速监测 -->
<div
class=
"md9"
style=
"width:514px;
margin-bottom:260px;
padding:10px 0 10px 15px;background:rgba(0,0,0,.3);"
>
<div
class=
"md9"
style=
"width:514px;padding:10px 0 10px 15px;background:rgba(0,0,0,.3);"
>
<div
class=
"ml10 flex align-center f20 color-theme wp100"
<div
class=
"ml10 flex align-center f20 color-theme wp100"
style=
"background-image:url('static/sub-title.png');background-size:100% 100%;height: 48px;"
>
style=
"background-image:url('static/sub-title.png');background-size:100% 100%;height: 48px;"
>
<div
class=
"ml40"
>
风速监测
</div>
<div
class=
"ml40"
>
风速监测
</div>
...
@@ -554,22 +560,48 @@
...
@@ -554,22 +560,48 @@
<div
class=
"relative md1b"
style=
"width:480px;"
>
<div
class=
"relative md1b"
style=
"width:480px;"
>
<div
class=
"m-tt3"
>
<div
class=
"m-tt3"
>
</div>
</div>
<div
class=
"md1-wrap"
>
<div
class=
"md1-wrap"
>
<ul
style=
"height:
22
0px;"
>
<ul
style=
"height:
11
0px;"
>
<li
v-for=
"item in deviceL1"
>
<li
v-for=
"item in deviceL1"
>
<div
class=
"icon"
><font>
{{item.
num
}}
</font></div>
<div
class=
"icon"
><font>
{{item.
value
}}
</font></div>
<span>
{{item.
name
}}
</span>
<span>
{{item.
key
}}
</span>
</li>
</li>
</ul>
</ul>
</div>
</div>
<div
class=
"chartbox"
>
<div
class=
"charts"
></div>
</div>
</div>
</div>
<!-- 温湿度监测 -->
<div
class=
"md9"
style=
"width:514px;padding:10px 0 10px 15px;background:rgba(0,0,0,.3);"
>
<div
class=
"ml10 flex align-center f20 color-theme wp100"
style=
"background-image:url('static/sub-title.png');background-size:100% 100%;height: 48px;"
>
<div
class=
"ml40"
>
温湿度监测
</div>
</div>
<div
class=
"relative md1b"
style=
"width:480px;"
>
<div
class=
"m-tt3"
>
</div>
<div
class=
"md1-wrap"
>
<ul
style=
"height:110px;"
>
<li
v-for=
"item in deviceL1"
>
<div
class=
"icon"
><font>
{{item.value}}
</font></div>
<span>
{{item.key}}
</span>
</li>
</ul>
</div>
<div
class=
"chartbox"
>
<div
class=
"chartbox"
>
<div
class=
"charts"
></div>
<div
class=
"charts"
></div>
</div>
</div>
<div
class=
"chartbox"
>
<div
class=
"charts"
></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
...
@@ -973,6 +1005,8 @@
...
@@ -973,6 +1005,8 @@
city
:[],
city
:[],
area
:[],
area
:[],
scompany
:[],
scompany
:[],
mineType
:
void
0
,
}
}
},
},
watch
:
{
watch
:
{
...
@@ -1000,10 +1034,7 @@
...
@@ -1000,10 +1034,7 @@
this
.
md31charts
=
md31
.
querySelector
(
"
.charts
"
);
this
.
md31charts
=
md31
.
querySelector
(
"
.charts
"
);
var
md9
=
this
.
$el
.
querySelector
(
"
.md9
"
);
var
md9
=
this
.
$el
.
querySelector
(
"
.md9
"
);
//var md9chart1 = this.$el.querySelector(".md9");
this
.
md9chart
=
md9
.
querySelector
(
"
.charts
"
);
this
.
heightScale
=
(
this
.
clientHeight
-
100
)
/
1080
this
.
heightScale
=
(
this
.
clientHeight
-
100
)
/
1080
...
@@ -1078,7 +1109,7 @@
...
@@ -1078,7 +1109,7 @@
})();
})();
//
md9
选择列表事件
//
right1
选择列表事件
(
function
(){
(
function
(){
self
.
m9tt3
=
md9
.
querySelector
(
"
.m-tt3
"
);
self
.
m9tt3
=
md9
.
querySelector
(
"
.m-tt3
"
);
var
select
=
document
.
createElement
(
"
select
"
);
var
select
=
document
.
createElement
(
"
select
"
);
...
@@ -1093,7 +1124,7 @@
...
@@ -1093,7 +1124,7 @@
qf
.
UI
.
selectRender
(
select
,
slist1
,
{
qf
.
UI
.
selectRender
(
select
,
slist1
,
{
onchange
:
function
(
val
){
onchange
:
function
(
val
){
self
.
md9param2
=
~~
val
;
self
.
md9param2
=
~~
val
;
self
.
r
eqMd9
();
self
.
r
ight1Data
();
},
},
});
});
self
.
m9tt3
.
appendChild
(
self
.
m9select2
);
self
.
m9tt3
.
appendChild
(
self
.
m9select2
);
...
@@ -1166,6 +1197,13 @@
...
@@ -1166,6 +1197,13 @@
if
(
i
<
3
){
if
(
i
<
3
){
reqiust
(
list
[
0
].
id
,
i
);
reqiust
(
list
[
0
].
id
,
i
);
}
else
{
}
else
{
var
item
=
{
name
:
"
全部
"
,
label
:
"
全部
"
,
id
:
24
,
};
list
.
unshift
(
item
);
that
.
reqEnterprise
(
list
[
0
]
&&
list
[
0
].
id
||
0
,
selects
[
i
],
callback
);
that
.
reqEnterprise
(
list
[
0
]
&&
list
[
0
].
id
||
0
,
selects
[
i
],
callback
);
};
};
});
});
...
@@ -1178,8 +1216,8 @@
...
@@ -1178,8 +1216,8 @@
}
}
};
};
axios
.
get
(
host
+
'
/api/yingji/deptandenterprise/enterprise
'
,
req
).
then
(
res
=>
{
axios
.
get
(
host
+
'
/api/yingji/deptandenterprise/enterprise
'
,
req
).
then
(
res
=>
{
res
=
res
.
data
;
var
res
=
res
.
data
,
list
=
res
.
body
;
var
list
=
res
.
body
||
[];
this
[
select
.
id
]
=
list
;
this
[
select
.
id
]
=
list
;
this
.
isReady
=
true
;
this
.
isReady
=
true
;
if
(
list
[
0
]){
if
(
list
[
0
]){
...
@@ -1206,6 +1244,7 @@
...
@@ -1206,6 +1244,7 @@
that
.
reqDispense
(
that
.
enterpriseId
);
that
.
reqDispense
(
that
.
enterpriseId
);
});
});
},
},
reqDeviceStatus
(){
reqDeviceStatus
(){
var
req
=
{
var
req
=
{
params
:
{
params
:
{
...
@@ -1237,9 +1276,12 @@
...
@@ -1237,9 +1276,12 @@
var
req
=
{
var
req
=
{
params
:
{
params
:
{
enterpriseId
:
id
enterpriseId
:
this
.
enterpriseId
,
deptId
:
this
.
deptId
,
mineType
:
this
.
mineType
,
}
}
};
};
axios
.
get
(
host
+
'
/api/datav/mine
'
,
req
).
then
(
res
=>
{
axios
.
get
(
host
+
'
/api/datav/mine
'
,
req
).
then
(
res
=>
{
loading
.
close
();
loading
.
close
();
this
.
isReady
=
true
;
this
.
isReady
=
true
;
...
@@ -1248,8 +1290,8 @@
...
@@ -1248,8 +1290,8 @@
this
.
mineNumber1
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
1
).
length
;
this
.
mineNumber1
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
1
).
length
;
this
.
mineNumber2
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
2
).
length
;
this
.
mineNumber2
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
2
).
length
;
this
.
mineNumber3
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
3
).
length
;
this
.
mineNumber3
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
3
).
length
;
this
.
mineNumber4
=
this
.
mineList
.
filter
(
x
=>
x
.
hasEnable
==
false
).
length
;
this
.
mineNumber4
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
4
).
length
;
this
.
mineNumber5
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
4
).
length
;
this
.
mineNumber5
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
5
).
length
;
const
markerUpdater
=
this
.
mineList
.
filter
(
mine
=>
{
const
markerUpdater
=
this
.
mineList
.
filter
(
mine
=>
{
if
(
!
mine
.
longitude
||
!
mine
.
latitude
)
{
if
(
!
mine
.
longitude
||
!
mine
.
latitude
)
{
...
@@ -1275,10 +1317,6 @@
...
@@ -1275,10 +1317,6 @@
drill
:
mine
.
emergencyDrillNumber
||
0
drill
:
mine
.
emergencyDrillNumber
||
0
};
};
});
});
/* this.marker = [
{ id: 0, longitude: '117.855635', latitude: '37.065754', mineType: 0, mineId: 0, type: 0, name: '应急管理局', number: '0', address: '平度市东阁街道', userName: '某某某', mobile: '18888888888', team: 0, supplies: 0, plan: 0, drill: 0 }
, ...markerUpdater
]; */
this
.
marker
=
[...
markerUpdater
];
this
.
marker
=
[...
markerUpdater
];
...
@@ -1287,7 +1325,6 @@
...
@@ -1287,7 +1325,6 @@
// 初始化
// 初始化
//_5minus();
//_5minus();
//this.getData();
// 获取数据
// 获取数据
this
.
getData
();
this
.
getData
();
});
});
...
@@ -1298,6 +1335,7 @@
...
@@ -1298,6 +1335,7 @@
params
:
{
params
:
{
enterpriseId
:
this
.
enterpriseId
,
enterpriseId
:
this
.
enterpriseId
,
deptId
:
this
.
deptId
,
deptId
:
this
.
deptId
,
mineType
:
this
.
mineType
,
}
}
};
};
axios
.
get
(
host
+
'
/api/shuili/rainNum
'
,
req
).
then
(
res
=>
{
axios
.
get
(
host
+
'
/api/shuili/rainNum
'
,
req
).
then
(
res
=>
{
...
@@ -1314,15 +1352,17 @@
...
@@ -1314,15 +1352,17 @@
Md3_1bSelect
(){
Md3_1bSelect
(){
var
that
=
this
;
var
that
=
this
;
var
req
=
{
var
req
=
{
params
:
{
params
:
{
enterpriseId
:
this
.
enterpriseId
,
enterpriseId
:
this
.
enterpriseId
,
deptId
:
this
.
deptId
,
deptId
:
this
.
deptId
,
mineType
:
this
.
mineType
,
}
}
};
};
axios
.
get
(
host
+
'
/data/rg/sensorList
'
,
req
).
then
(
res
=>
{
axios
.
get
(
host
+
'
/data/rg/sensorList
'
,
req
).
then
(
res
=>
{
var
res
=
res
.
data
,
list
=
res
.
body
||
[];
var
res
=
res
.
data
,
list
=
res
.
body
||
[];
qf
.
UI
.
selectRender
(
that
.
select2
,
list
,
{
qf
.
UI
.
selectRender
(
that
.
select2
,
list
,
{
'
name
'
:
'
equipName
'
,
'
name
'
:
'
equipName
'
,
'
value
'
:
'
equipNo
'
,
'
value
'
:
'
equipNo
'
,
...
@@ -1344,6 +1384,7 @@
...
@@ -1344,6 +1384,7 @@
params
:
{
params
:
{
enterpriseId
:
this
.
enterpriseId
,
enterpriseId
:
this
.
enterpriseId
,
deptId
:
this
.
deptId
,
deptId
:
this
.
deptId
,
mineType
:
this
.
mineType
,
equipNo
:
this
.
md31equipNo
,
equipNo
:
this
.
md31equipNo
,
timeUtil
:
this
.
md3_1param2
,
timeUtil
:
this
.
md3_1param2
,
}
}
...
@@ -1473,122 +1514,204 @@
...
@@ -1473,122 +1514,204 @@
},
},
left3Charts
(
body
){
reqMd3_3
(){
var
list
=
body
.
list
;
var
req
=
{
// 基于准备好的dom,初始化echarts实例
params
:
{
var
myChart
=
echarts
.
init
(
document
.
getElementById
(
"
main
"
));
enterpriseId
:
this
.
enterpriseId
,
myChart
.
clear
()
// 定时刷新 实际不刷新 演示用
deptId
:
this
.
deptId
,
let
xData
=
[]
mineType
:
this
.
mineType
,
let
yData1
=
[]
}
let
yData2
=
[]
if
(
this
.
TabCur
===
0
){
for
(
var
item
of
list
){
xData
.
push
(
item
.
date
);
yData1
.
push
(
item
.
values
.
alarmCount
);
};
};
};
axios
.
get
(
host
+
'
/api/shuili/rainAllData
'
,
req
).
then
(
res
=>
{
// 绘制图表
res
=
res
.
data
;
const
bars
=
[{
var
list
=
res
.
body
||
[];
name
:
'
报警数据
'
,
this
.
alarmlist
=
list
;
type
:
'
bar
'
,
});
data
:
yData1
,
itemStyle
:
{
normal
:
{
color
:
new
echarts
.
graphic
.
LinearGradient
(
0
,
1
,
0
,
0
,
[{
// 四个数字分别对应 数组中颜色的开始位置,分别为 右,下,左,上。例如(1,0,0,0 )代表从右边开始渐
// 变。offset取值为0~1,0代表开始时的颜色,1代表结束时的颜色,柱子表现为这两种颜色的渐变。
offset
:
0
,
color
:
'
#0ee3f9
'
},
{
offset
:
1
,
color
:
'
#09f1f6
'
}]),
//这里设置柱形图圆角 [左上角,右上角,右下角,左下角]
barBorderRadius
:
[
100
,
100
,
0
,
0
]
}
},
barWidth
:
'
40%
'
}];
const
lines
=
[];
if
(
this
.
TabCur
===
0
)
{
/* lines.push({
name: '人员报警',
type: 'line',
smooth: true,
data: yData2,
itemStyle: {
color: '#ffa900'
}
}); */
}
myChart
.
setOption
({
xAxis
:
{
data
:
xData
,
axisLine
:
{
lineStyle
:
{
color
:
'
#ffffff
'
}
},
axisTick
:
{
show
:
false
}
},
yAxis
:
{
splitLine
:
{
show
:
false
},
axisLabel
:
{
textStyle
:
{
color
:
'
#ffffff
'
}
}
},
},
grid
:
{
bottom
:
40
,
top
:
20
},
legend
:
{
right1Select
(){
show
:
true
,
var
that
=
this
;
textStyle
:
{
var
req
=
{
color
:
'
#FFF
'
params
:
{
enterpriseId
:
this
.
enterpriseId
,
deptId
:
this
.
deptId
,
}
}
};
axios
.
get
(
host
+
'
/data/sz/sensorList/feng
'
,
req
).
then
(
res
=>
{
var
res
=
res
.
data
,
list
=
res
.
body
||
[];
qf
.
UI
.
selectRender
(
that
.
m9select2
,
list
,
{
'
name
'
:
'
equipName
'
,
'
value
'
:
'
equipNo
'
,
onchange
:
function
(
val
){
that
.
right1equipNo
=
val
;
that
.
right1Data
();
},
},
dataZoom
:
[
});
{
that
.
right1Data
();
type
:
"
slider
"
,
show
:
false
,
start
:
0
,
endValue
:
30
,
// 一次性展示31个
textStyle
:
{
color
:
"
#ffffff
"
},
height
:
0
,
zoomLock
:
true
,
// 是否只平移不缩放
},
{
type
:
"
inside
"
,
//内置型数据区域缩放组件
moveOnMouseMove
:
true
// 开启鼠标移动窗口平移
}
],
series
:
[...
bars
,...
lines
]
});
});
},
},
right1Data
(){
var
that
=
this
;
reqMd8
(){
var
req
=
{
var
req
=
{
params
:
{
params
:
{
enterpriseId
:
this
.
enterpriseId
,
enterpriseId
:
this
.
enterpriseId
,
deptId
:
this
.
deptId
,
deptId
:
this
.
deptId
,
equipNo
:
this
.
right1equipNo
,
timeUtil
:
this
.
md9param2
,
}
}
};
};
axios
.
get
(
host
+
'
/api/shuili/rainAllData
'
,
req
).
then
(
res
=>
{
axios
.
get
(
host
+
'
/api/shuili/windNum
'
,
req
).
then
(
res
=>
{
res
=
res
.
data
;
var
res
=
res
.
data
,
body
=
res
.
body
||
[];
var
list
=
res
.
body
||
[];
that
.
deviceL1
=
body
.
list
;
this
.
alarmlist
=
list
;
});
});
},
reqMd3
()
{
// 曲线
return
;
var
req
=
{
var
req
=
{
params
:
{
params
:
{
enterpriseId
:
this
.
enterpriseId
,
enterpriseId
:
this
.
enterpriseId
,
deptId
:
this
.
deptId
,
deptId
:
this
.
deptId
,
dateRange
:
this
.
daterange3
.
timeSpace
.
toString
()
equipNo
:
this
.
right1equipNo
,
timeUtil
:
this
.
md9param2
,
}
}
};
};
axios
.
get
(
host
+
'
/api/
yingji/keynoteadmin/opencastAlertNatur
e
'
,
req
).
then
(
res
=>
{
axios
.
get
(
host
+
'
/api/
shuili/windDat
e
'
,
req
).
then
(
res
=>
{
res
=
res
.
data
;
var
res
=
res
.
data
,
body
=
res
.
body
||
[]
;
this
.
left3Charts
(
res
.
body
)
this
.
right1Chart
(
body
);
});
});
},
},
right1Chart
(
body
){
var
formatSeries
=
this
.
seriesDataFormat
(
body
,
{
datekey
:
'
date
'
,
serie
:{
type
:
'
spline
'
,
marker
:
{
enabled
:
false
},
},
colors
:[
"
#fcaa00
"
,
"
#20ef03
"
,
"
#38f1f3
"
]});
var
series
=
formatSeries
.
series
;
var
option
=
{
chart
:
{
type
:
'
column
'
,
backgroundColor
:
'
transparent
'
,
//marginTop:30,
marginBottom
:
55
,
marginLeft
:
30
,
},
title
:
{
text
:
''
},
subtitle
:
{
text
:
''
},
xAxis
:
{
type
:
'
datetime
'
||
'
category
'
,
labels
:
{
//rotation:0, // 设置轴标签旋转角度
style
:{
color
:
'
#fff
'
},
y
:
15
,
},
categories
:
formatSeries
.
categories
,
lineWidth
:
0
,
//lineColor:'#ff0000',
gridLineColor
:
'
#aaa
'
,
tickLength
:
0
,
// 刻度线
dateTimeLabelFormats
:
{
millisecond
:
'
%H:%M:%S.%L
'
,
second
:
'
%H:%M:%S
'
,
minute
:
'
%H:%M
'
,
hour
:
'
%H:%M
'
,
day
:
'
%m-%d
'
,
week
:
'
%m-%d
'
,
month
:
'
%Y-%m
'
,
year
:
'
%Y
'
}
},
yAxis
:
{
title
:
{
text
:
''
},
labels
:{
style
:{
color
:
'
#fff
'
},
x
:
-
6
,
},
gridLineColor
:
'
#0F5680
'
,
//minorGridLineWidth: 5,
//gridLineWidth: 5,
//max:opts.maxValDev ? maxVal + maxVal * opts.maxValDev : null,
},
plotOptions
:
{
column
:
{
borderWidth
:
0
,
//y:50,
//itemMarginTop:50,
},
bar
:{
borderWidth
:
0
,
},
},
legend
:
{
enabled
:
series
.
length
>
1
?
true
:
false
,
// 图例定位
layout
:
'
horizontal
'
,
// 水平布局:“horizontal”, 垂直布局:“vertical”
floating
:
false
,
// 图列是否浮动
align
:
'
right
'
,
// 图例容器
//width:'100%', // number || String
padding
:
2
,
// 内边距
margin
:
2
,
borderRadius
:
5
,
//borderWidth:1,
verticalAlign
:
'
top
'
,
// 图例项
//itemWidth:120, // 宽度
itemDistance
:
10
,
// 间距 20
y
:
-
10
,
itemMarginTop
:
2
,
itemStyle
:{
color
:
'
#fff
'
,},
itemHoverStyle
:{
color
:
'
#fff
'
,},
},
credits
:
{
enabled
:
false
},
tooltip
:
{
pointFormat
:
'
{series.name}:{point.y}
'
+
'
mm
'
,
dateTimeLabelFormats
:
{
millisecond
:
'
%H:%M:%S.%L
'
,
second
:
'
%H:%M:%S
'
,
minute
:
'
%m-%d %H:%M
'
,
hour
:
'
%m-%d %H:%M
'
,
day
:
'
%m-%d %H:%M
'
,
week
:
'
%m-%d %H:%M
'
,
month
:
'
%Y-%m
'
,
year
:
'
%Y
'
}
},
series
:
formatSeries
.
series
,
};
new
Highcharts
.
chart
(
this
.
md9chart
,
option
);
},
// 矿山类型
mineTypeEvent
(
value
){
if
(
this
.
mineType
===
value
){
this
.
mineType
=
void
0
}
else
{
this
.
mineType
=
value
;
};
// 矿山数据
this
.
reqMines
();
},
// -------------------------------------------------------------------
// -------------------------------------------------------------------
...
@@ -1651,9 +1774,7 @@
...
@@ -1651,9 +1774,7 @@
});
});
let
_this
=
this
let
_this
=
this
AMap
.
plugin
([
AMap
.
plugin
([
'
AMap.ControlBar
'
,],
function
()
{
'
AMap.ControlBar
'
,
],
function
()
{
// 添加 3D 罗盘控制
// 添加 3D 罗盘控制
map
.
addControl
(
new
AMap
.
ControlBar
({
map
.
addControl
(
new
AMap
.
ControlBar
({
position
:
{
position
:
{
...
@@ -1664,7 +1785,14 @@
...
@@ -1664,7 +1785,14 @@
}));
}));
});
});
var
icon
=
[
'
https://s3.bmp.ovh/imgs/2023/02/28/7c5a7440766955ea.png
'
,
'
https://s3.bmp.ovh/imgs/2023/02/28/a3be161800e3f011.png
'
,
'
https://s3.bmp.ovh/imgs/2023/02/28/9e2393a29da416fd.png
'
,
'
https://s3.bmp.ovh/imgs/2023/02/28/cd177c08c6052267.png
'
]
var
icon
=
[
'
static/center-icon.png
'
,
'
static/mine-icon-0.png
'
,
'
static/mine-icon-1.png
'
,
'
https://s3.bmp.ovh/imgs/2023/02/28/cd177c08c6052267.png
'
,
'
static/mine-icon-3.png
'
,
'
static/mine-icon-4.png
'
,
]
// 循环绘制marker
// 循环绘制marker
for
(
var
i
=
0
;
i
<
this
.
marker
.
length
;
i
++
)
{
for
(
var
i
=
0
;
i
<
this
.
marker
.
length
;
i
++
)
{
var
marker
=
new
AMap
.
Marker
({
var
marker
=
new
AMap
.
Marker
({
...
@@ -1783,7 +1911,13 @@
...
@@ -1783,7 +1911,13 @@
window
.
gotoDataView
=
(
mineType
,
mineId
)
=>
{
window
.
gotoDataView
=
(
mineType
,
mineId
)
=>
{
const
mine
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
mineType
&&
x
.
id
==
mineId
)[
0
]
const
mine
=
this
.
mineList
.
filter
(
x
=>
x
.
mineType
==
mineType
&&
x
.
id
==
mineId
)[
0
]
window
.
localStorage
.
setItem
(
'
kd.selected.mine
'
,
JSON
.
stringify
(
mine
))
window
.
localStorage
.
setItem
(
'
kd.selected.mine
'
,
JSON
.
stringify
(
mine
))
window
.
localStorage
.
setItem
(
'
bigScreenDetailMenuModel
'
,
'
emergency
'
);
window
.
open
(
selfHost
+
'
/datav/detail/video-monitor.html
'
,
'
_self
'
)
return
;
if
(
mineType
==
1
){
if
(
mineType
==
1
){
window
.
open
(
selfHost
+
'
/datav/underground.html
'
,
'
_self
'
)
window
.
open
(
selfHost
+
'
/datav/underground.html
'
,
'
_self
'
)
}
}
...
@@ -1898,8 +2032,9 @@
...
@@ -1898,8 +2032,9 @@
});
});
this
.
reqMd3_1
();
this
.
reqMd3_1
();
this
.
reqMd8
();
this
.
reqMd3_3
();
this
.
reqMd3
();
this
.
right1Select
();
this
.
reqDeviceStatus
();
// 设备状态
this
.
reqDeviceStatus
();
// 设备状态
}
}
...
@@ -1959,17 +2094,10 @@
...
@@ -1959,17 +2094,10 @@
},
},
// 切换重点在线监测总览
// 切换重点在线监测总览
changeoverviewTab
(
index
)
{
changeoverviewTab
(
index
)
{
0
if
(
index
==
this
.
overviewTabCur
)
return
this
.
overviewTabCur
=
index
this
.
overviewTabCur
=
index
},
},
clickAiActive
(
index
){
this
.
md3_1b1
=
index
;
this
.
md3_1bMask
=
false
;
this
.
right1
()
},
// 切换危险作业审批
// 切换危险作业审批
changeMaskTab
(
index
)
{
changeMaskTab
(
index
)
{
if
(
index
==
this
.
maskActive
)
return
if
(
index
==
this
.
maskActive
)
return
...
...
vue.config.js
View file @
5ea66232
...
@@ -22,24 +22,6 @@ module.exports = {
...
@@ -22,24 +22,6 @@ module.exports = {
assetsDir
:
'
static
'
,
assetsDir
:
'
static
'
,
lintOnSave
:
process
.
env
.
NODE_ENV
===
'
development
'
,
lintOnSave
:
process
.
env
.
NODE_ENV
===
'
development
'
,
productionSourceMap
:
false
,
productionSourceMap
:
false
,
pages
:{
index
:
{
// 页面的入口文件
entry
:
Mode
+
'
/main.js
'
,
// 页面的模板文件
//template: './public/edge.html',
//chunks:["edge"],
},
plus
:
{
// 页面的入口文件
entry
:
Mode
+
'
/plus.js
'
,
// 页面的模板文件
template
:
'
./public/plus.html
'
,
// build 生成的文件名称 例: dist/index.html
filename
:
'
plus.html
'
,
chunks
:[
"
plus
"
,
"
runtime
"
,
"
chunk-libs
"
,
"
chunk-elementUI
"
],
}
},
devServer
:
{
devServer
:
{
port
:
port
,
port
:
port
,
host
:
VUE_APP_BASE_API
&&
VUE_APP_BASE_API
.
split
(
/
\/\/
|:/
).
slice
(
-
2
)[
0
],
host
:
VUE_APP_BASE_API
&&
VUE_APP_BASE_API
.
split
(
/
\/\/
|:/
).
slice
(
-
2
)[
0
],
...
@@ -83,18 +65,15 @@ module.exports = {
...
@@ -83,18 +65,15 @@ module.exports = {
}
}
},
},
plugins
:
[
plugins
:
[
new
CopyWebpackPlugin
([{
// https://www.ydyno.com/archives/1260.html 使用gzip解压缩静态文件
from
:
"
./static
"
,
to
:
'
static
'
/* new CompressionPlugin({
}]),
test: /\.(js|css|html)?$/i, // 压缩文件格式
],
filename: '[path].gz[query]', // 压缩后的文件名
name
:
name
,
algorithm: 'gzip', // 使用gzip压缩
resolve
:
{
minRatio: 0.8 // 压缩率小于1才会压缩
alias
:
{
}) */
'
@
'
:
resolve
(
Mode
+
''
),
]
'
@crud
'
:
resolve
(
Mode
+
'
/components/Crud
'
)
}
}
},
},
chainWebpack
(
config
)
{
chainWebpack
(
config
)
{
config
.
plugins
.
delete
(
'
preload
'
)
// TODO: need test
config
.
plugins
.
delete
(
'
preload
'
)
// TODO: need test
...
...
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