Skip to content

Z
ZiBoYingJI
Commit 18d5f37d authored by Kimber's avatar Kimber
Browse files
Options

'update'

parent 042ca33b
Show whitespace changes
Inline Side-by-side
Showing with 549 additions and 86 deletions
public/datav/detail/static/js/public-detail.js
View file @ 18d5f37d
......@@ -108,13 +108,17 @@ var gemhoUtil = {
const type = localStorage.getItem('bigScreenDetailMenuModel')
if(type === 'emergency'){
window.open('/datav/index.html')
//window.open('/datav/index.html')
window.location.href = '/datav/index.html';
}else if(type === 'natural'){
window.open('/datav/natural.html')
//window.open('/datav/natural.html')
window.location.href = '/datav/natural.html';
}else if(type === 'watersystem'){
window.open('/datav/watersource.html')
//window.open('/datav/watersource.html')
window.location.href = '/datav/watersource.html';
}else if(type === 'ecosystem'){
window.open('/datav/index.html')
//window.open('/datav/index.html')
window.location.href = '/datav/index.html';
}
},
changeMenu(item) {
......
public/datav/index.html
View file @ 18d5f37d
......@@ -227,9 +227,13 @@
}
}
.footer{
.actv{box-shadow:inset 0 0 25px rgba(0, 0, 0, 0.2);}
.item-wrap{
&>div{
cursor:pointer;
}
}
}
}
</style>
......@@ -462,7 +466,7 @@
<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" :class="isFullScreen?'tr-bottom':'tr-bottom-re'">
<div class="flex-text item-wrap" :class="isFullScreen?'tr-bottom':'tr-bottom-re'">
<div class="relative" @click="mineTypeEvent(1)" :class="{actv:mineType===1}">
<img style="width: 134px;height: 146px;" src="static/mine-bg-0.png" alt="">
<div class="poa-cover flex-text flex-column">
......
public/datav/natural.html
View file @ 18d5f37d
......@@ -248,6 +248,15 @@
span{color:#aaa;width:20px;}
}
}
.footer{
.actv{box-shadow:inset 0 0 25px rgba(0, 0, 0, 0.2);}
.item-wrap{
&>div{
cursor:pointer;
}
}
}
}
</style>
</head>
......@@ -399,38 +408,38 @@
</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" :class="isFullScreen?'tr-bottom':'tr-bottom-re'">
<div class="relative mine-0">
<div class="flex-text item-wrap" :class="isFullScreen?'tr-bottom':'tr-bottom-re'">
<div class="relative" @click="mineTypeEvent(1)" :class="{actv:mineType===1}">
<img style="width: 134px;height: 146px;" src="static/mine-bg-0.png" alt="">
<div class="poa-cover flex-text flex-column">
<div class="color-theme f30" style="margin-top: -24px;">{{mineNumber1 || '0'}}</div>
<div class="f18" style="margin-top: 3px;">地下矿山</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="">
<div class="poa-cover flex-text flex-column">
<div class="color-theme f30" style="margin-top: -24px;">{{mineNumber2 || '0'}}</div>
<div class="f18" style="margin-top: 3px;">露天矿山</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="">
<div class="poa-cover flex-text flex-column">
<div class="color-theme f30" style="margin-top: -24px;">{{mineNumber3 || '0'}}</div>
<div class="f18" style="margin-top: 3px;">尾矿库</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="">
<div class="poa-cover flex-text flex-column">
<div class="color-theme f30" style="margin-top: -24px;">{{mineNumber4 || '0'}}</div>
<div class="f18" style="margin-top: 3px;">停产矿山</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="">
<div class="poa-cover flex-text flex-column">
<div class="color-theme f30" style="margin-top: -24px;">{{mineNumber5 || '0'}}</div>
......@@ -890,6 +899,8 @@
city:[],
area:[],
scompany:[],
mineType:void 0,
}
},
watch: {
......@@ -952,7 +963,10 @@
var selects = mselect.children;
// 请求三级联动
this.reqSelectArea(selects);
this.reqSelectArea(selects, onloadDataFinish);
function onloadDataFinish(){
}
// left3 daterange event
var left3t2 = rightbar.querySelector("#daterage1>.m-t2");
......@@ -993,7 +1007,7 @@
})();
},
methods: {
reqSelectArea(selects){
reqSelectArea(selects, callback){
var that = this, i = 0;
return (function reqiust(id, i){
var req = {
......@@ -1021,20 +1035,27 @@
if(i < 3){
reqiust(list[0].id, i);
}else{
that.reqEnterprise(list[0] && list[0].id || 0, selects[i]);
var item = {
name: "全部",
label: "全部",
id: 24,
};
list.unshift(item);
that.reqEnterprise(list[0] && list[0].id || 0, selects[i], callback);
};
});
})(0, i);
},
reqEnterprise(value, select){
reqEnterprise(value, select, callback){
var req = {
params: {
deptId:(this.deptId = value || 0)
}
};
axios.get(host + '/api/yingji/deptandenterprise/enterprise', req).then(res => {
res = res.data;
var list = res.body || [];
var res = res.data, list = res.body;
this[select.id] = list;
this.isReady = true;
if(list[0]){
......@@ -1042,12 +1063,15 @@
}else{
this.enterpriseId = 0;
this.marker = [];
}
};
// 矿山数据
this.reqMines(this.enterpriseId);
this.reqDispense(this.enterpriseId);
// 设置地图
this.setMap();
callback && callback();
});
var that = this;
......@@ -1055,7 +1079,7 @@
var tag = e.target || e.srcElement;
var value = tag.selectedOptions[0].value;
that.enterpriseId = value;
that.reqMines(that.enterpriseId);
that.reqDispense(that.enterpriseId);
});
},
reqDeviceStatus(){
......@@ -1072,6 +1096,12 @@
});
},
// 数据分发
reqDispense(enterpriseId){
// 矿山数据
this.reqMines(enterpriseId);
},
// 请求矿山列表
reqMines(id){
var loading = this.$loading({
......@@ -1083,11 +1113,13 @@
var req = {
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();
this.isReady = true;
......@@ -1095,8 +1127,8 @@
this.mineNumber1 = this.mineList.filter(x => x.mineType == 1).length;
this.mineNumber2 = this.mineList.filter(x => x.mineType == 2).length;
this.mineNumber3 = this.mineList.filter(x => x.mineType == 3).length;
this.mineNumber4 = this.mineList.filter(x => x.hasEnable == false).length;
this.mineNumber5 = this.mineList.filter(x => x.mineType == 4).length;
this.mineNumber4 = this.mineList.filter(x => x.mineType == 4).length;
this.mineNumber5 = this.mineList.filter(x => x.mineType == 5).length;
const markerUpdater = this.mineList.filter(mine => {
if (!mine.longitude || !mine.latitude) {
......@@ -1122,10 +1154,6 @@
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];
......@@ -1134,7 +1162,6 @@
// 初始化
//_5minus();
//this.getData();
// 获取数据
this.getData();
});
......@@ -1289,6 +1316,18 @@
});
},
// 矿山类型
mineTypeEvent(value){
if(this.mineType === value){
this.mineType = void 0
}else{
this.mineType = value;
};
// 矿山数据
this.reqMines();
},
// -------------------------------------------------------------------
querySearchAsync(queryString, cb) {
var results = queryString ? this.marker.filter(v => v.name.indexOf(queryString) != -1) : this.marker
......@@ -1326,6 +1365,7 @@
gotoManagement1(){
window.location.href = '/#/login4Index';
},
// 设置地图
setMap() {
map = new AMap.Map('map', {
......@@ -1349,9 +1389,7 @@
});
let _this = this
AMap.plugin([
'AMap.ControlBar',
], function () {
AMap.plugin(['AMap.ControlBar',], function () {
// 添加 3D 罗盘控制
map.addControl(new AMap.ControlBar({
position: {
......@@ -1362,7 +1400,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
for (var i = 0; i < this.marker.length; i++) {
var marker = new AMap.Marker({
......@@ -1481,7 +1526,13 @@
window.gotoDataView = (mineType, mineId) => {
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('bigScreenDetailMenuModel', 'emergency');
window.open(selfHost + '/datav/detail/video-monitor.html', '_self')
return ;
if(mineType == 1){
window.open(selfHost + '/datav/underground.html', '_self')
}
......
public/datav/watersource.html
View file @ 18d5f37d
......@@ -179,7 +179,6 @@
}
.m-body{
border:1px solid red;
.md1-wrap{
width:420px;
ul{
......@@ -256,7 +255,7 @@
}
.md3-1, .md9{
border:1px solid red;
margin-top:10px;
.md1-wrap{
display:flex;width:100%;padding:10px 0;margin-top:10px;
......@@ -276,7 +275,6 @@
.md1b{
.m-tt3{
border:1px solid yellow;
display:flex;justify-content:flex-end;
select{
background-color:transparent;color:#e1ffff;border:1px solid #1DD2D9;
......@@ -290,7 +288,6 @@
position:relative;height:300px;;width:100%;
.charts{
position:absolute;top:0;left:0;height:100%;width:100%;
border:1px solid green;
}
}
}
......@@ -299,7 +296,7 @@
.md9{
.md1b{
div.chartbox{
height:200px;
height:150px;
}
.md1-wrap{padding:0;}
......@@ -308,6 +305,15 @@
.icon{width:80px;height:80px;}
}
}
.footer{
.actv{box-shadow:inset 0 0 25px rgba(0, 0, 0, 0.2);}
.item-wrap{
&>div{
cursor:pointer;
}
}
}
}
</style>
</head>
......@@ -489,7 +495,7 @@
<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" :class="isFullScreen?'tr-bottom':'tr-bottom-re'">
<div class="flex-text item-wrap" :class="isFullScreen?'tr-bottom':'tr-bottom-re'">
<div class="relative" @click="mineTypeEvent(1)" :class="{actv:mineType===1}">
<img style="width: 134px;height: 146px;" src="static/mine-bg-0.png" alt="">
<div class="poa-cover flex-text flex-column">
......@@ -531,28 +537,10 @@
<div :class="isFullScreen?'tr-right':'tr-right-re'"class="flex flex-column space-between relative" style="display:flex;justify-content:center;height:100%;">
<!-- right -->
<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 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="flex-text ml20 mt10" style="width: 450px;">
<div class="flex-1 flex-text f14 pointer animation"
:class="[index == 0?'':'ml15',index == TabCur?'color-light':'']"
style="height: 38px;background-image: url('static/button-bg.png');background-size: 100% 100%;"
v-for="(item,index) in tabs" :key="index" @click="changeTab(index)">{{ item }}</div>
</div>
<div class="space-end mt10 flex ml20" style="width: 450px;" id="daterage1">
<div class="m-t2"><div></div></div>
</div>
<div id="main" style="width: 100%;height:300px;"></div>
</div> -->
<div style="transform-origin:right center;right:0;margin-top:30px;" class="absolute" :style="{transform:'scale(' + (heightScale) + ')'}" id="rightbar">
<!-- 风速监测 -->
<div class="md9" style="width:514px;padding:10px 0 10px 15px;background:rgba(0,0,0,.3);">
<div class="md9" style="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>
......@@ -574,19 +562,18 @@
</div>
</div>
<!-- 温湿度监测 -->
<div class="md9" style="width:514px;padding:10px 0 10px 15px;background:rgba(0,0,0,.3);">
<!-- 温度监测 -->
<div class="md9 md10" style="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 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">
<li v-for="item in deviceL2">
<div class="icon"><font>{{item.value}}</font></div>
<span>{{item.key}}</span>
</li>
......@@ -595,12 +582,31 @@
<div class="chartbox">
<div class="charts"></div>
</div>
</div>
</div>
<!-- 湿度监测 -->
<div class="md9 md11" style="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 deviceL3">
<div class="icon"><font>{{item.value}}</font></div>
<span>{{item.key}}</span>
</li>
</ul>
</div>
<div class="chartbox">
<div class="charts"></div>
</div>
</div>
</div>
</div>
</div>
</div>
......@@ -948,6 +954,7 @@
// 设备状态
deviceL1:[],
deviceL2:[],
deviceL3:[],
// 公告信息
notice: {
......@@ -1036,6 +1043,12 @@
var md9 = this.$el.querySelector(".md9");
this.md9chart = md9.querySelector(".charts");
var md10 = this.$el.querySelector(".md10");
this.md10charts = md10.querySelector(".charts");
var md11 = this.$el.querySelector(".md11");
this.md11charts = md11.querySelector(".charts");
this.heightScale = (this.clientHeight - 100) / 1080
this.widthScale = this.clientWidth / 1920
......@@ -1116,6 +1129,7 @@
self.m9select2 = document.createElement("select");
var slist1 = [
{name:'近一周',value:'0'},
{name:'近一月',value:'1'},
{name:'近半年',value:'2'},
{name:'近一年',value:'3'},
......@@ -1132,9 +1146,59 @@
self.md9param2 = ~~slist1[0].value;
})();
}
// right2 选择列表事件
(function(){
self.m10tt3 = md10.querySelector(".m-tt3");
var select = document.createElement("select");
self.m10select2 = document.createElement("select");
var slist1 = [
{name:'近一周',value:'0'},
{name:'近一月',value:'1'},
{name:'近半年',value:'2'},
{name:'近一年',value:'3'},
];
// select1
qf.UI.selectRender(select, slist1, {
onchange: function(val){
self.md10param2 = ~~val;
self.right2Data();
},
});
self.m10tt3.appendChild(self.m10select2);
self.m10tt3.appendChild(select);
self.md10param2 = ~~slist1[0].value;
})();
// right3 选择列表事件
(function(){
self.m11tt3 = md11.querySelector(".m-tt3");
var select = document.createElement("select");
self.m11select2 = document.createElement("select");
var slist1 = [
{name:'近一周',value:'0'},
{name:'近一月',value:'1'},
{name:'近半年',value:'2'},
{name:'近一年',value:'3'},
];
// select1
qf.UI.selectRender(select, slist1, {
onchange: function(val){
self.md11param2 = ~~val;
self.right3Data();
},
});
self.m11tt3.appendChild(self.m11select2);
self.m11tt3.appendChild(select);
self.md11param2 = ~~slist1[0].value;
})();
}
this.seriesDataFormat = function(data, opts){
var names = data.names || [], list = data.list || data.lists, series = [], categories = [], maxVal = 0;
if(names[0] && list){
......@@ -1163,10 +1227,6 @@
};
return {series:series, categories:categories, maxVal:maxVal}
};
},
methods: {
reqSelectArea(selects, callback){
......@@ -1225,7 +1285,7 @@
}else{
this.enterpriseId = 0;
this.marker = [];
}
};
this.reqDispense(this.enterpriseId);
......@@ -1529,12 +1589,14 @@
});
},
// 风速
right1Select(){
var that = this;
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
mineType:this.mineType,
}
};
axios.get(host + '/data/sz/sensorList/feng', req).then(res => {
......@@ -1550,7 +1612,6 @@
that.right1Data();
});
},
right1Data(){
var that = this;
var req = {
......@@ -1697,8 +1758,351 @@
new Highcharts.chart(this.md9chart, option);
},
// 温度
right2Select(){
var that = this;
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
mineType:this.mineType,
}
};
axios.get(host + '/data/sz/sensorList/wen', req).then(res => {
var res = res.data, list = res.body || [];
qf.UI.selectRender(that.m10select2, list, {
'name':'equipName',
'value':'equipNo',
onchange: function(val){
that.right2equipNo = val;
that.right2Data();
},
});
that.right2equipNo = list[0] && list[0].equipNo || '';
that.right2Data();
});
},
right2Data(){
var that = this;
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
mineType:this.mineType,
equipNo: this.right2equipNo,
timeUtil: this.md10param2,
}
};
axios.get(host + '/api/shuili/temperatureNum', req).then(res => {
var res = res.data, body = res.body || [];
that.deviceL2 = body.list;
});
// 曲线
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
mineType:this.mineType,
equipNo: this.right2equipNo,
timeUtil: this.md10param2,
}
};
axios.get(host + '/api/shuili/temperatureData', req).then(res => {
var res = res.data, body = res.body || [];
this.right2Chart(body);
});
},
right2Chart(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.md10charts, option);
},
// 湿度
right3Select(){
var that = this;
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
mineType:this.mineType,
}
};
axios.get(host + '/data/sz/sensorList/shi', req).then(res => {
var res = res.data, list = res.body || [];
qf.UI.selectRender(that.m11select2, list, {
'name':'equipName',
'value':'equipNo',
onchange: function(val){
that.right3equipNo = val;
that.right3Data();
},
});
that.right3equipNo = list[0] && list[0].equipNo || '';
that.right3Data();
});
},
right3Data(){
var that = this;
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
mineType:this.mineType,
equipNo: this.right3equipNo,
timeUtil: this.md11param2,
}
};
axios.get(host + '/api/shuili/humidityNum', req).then(res => {
var res = res.data, body = res.body || [];
that.deviceL3 = body.list;
});
// 曲线
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
mineType:this.mineType,
equipNo: this.right3equipNo,
timeUtil: this.md11param2,
}
};
axios.get(host + '/api/shuili/humidityData', req).then(res => {
var res = res.data, body = res.body || [];
this.right3Chart(body);
});
},
right3Chart(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.md11charts, option);
},
// 矿山类型
......@@ -1713,7 +2117,6 @@
this.reqMines();
},
// -------------------------------------------------------------------
querySearchAsync(queryString, cb) {
var results = queryString ? this.marker.filter(v => v.name.indexOf(queryString) != -1) : this.marker
......@@ -2036,6 +2439,10 @@
this.right1Select();
this.right2Select();
this.right3Select();
this.reqDeviceStatus(); // 设备状态
}
/*
......
src/views/home4Index.vue
View file @ 18d5f37d
......@@ -42,7 +42,7 @@
</div>
</div>
<div class="bottomTitle">@中和地信有限公司</div>
<!-- <div class="bottomTitle">@中和地信有限公司</div> -->
</div>
</template>
......@@ -115,7 +115,6 @@ export default {
var host = location.protocol + "//" + window.location.host;
if (type === "admin") {
// this.$router.push({ path: "home4Center" });
this.$router.push({ path: "/user/center" });
} else if (type === "应急管理") {
// this.$router.push({ path: "home4Center" });
......@@ -123,11 +122,9 @@ export default {
// location.href = 'http://192.168.3.226:8057/datav/index.html'
location.href = host + "/datav/index.html";
} else if (type === "自然资源") {
// location.href = process.env.NODE_ENV + ''
// location.href = 'http://192.168.3.226:8057/datav/natural.html'
//location.href = host + "/datav/natural.html";
} else if (type === "水利系统") {
// location.href = host + "/datav/watersource.html";
//location.href = host + "/datav/watersource.html";
} else if (type === "电子档案馆") {
// this.$router.push({ path: "home4Center" });
this.$router.push({ path: "/user/center" });
......@@ -270,7 +267,7 @@ export default {
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: 100%;
background-size:100% 100%;
overflow: hidden;
}
.content{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment