Commit 2687b9e4 authored by xinzhedeai's avatar xinzhedeai
parents 03c59bac 1e1a72e5
...@@ -226,6 +226,11 @@ ...@@ -226,6 +226,11 @@
span{color:#aaa;width:20px;} span{color:#aaa;width:20px;}
} }
} }
.footer{
.actv{box-shadow:inset 0 0 25px rgba(0, 0, 0, 0.2);}
}
} }
</style> </style>
</head> </head>
...@@ -306,7 +311,7 @@ ...@@ -306,7 +311,7 @@
<div class="flex-text m-body wp100" id="body"> <div class="flex-text m-body wp100" id="body">
<div :class="isFullScreen?'tr-left':'tr-left-re'" class="flex flex-column space-between relative" style="display:flex;justify-content:center;height:100%;"> <div :class="isFullScreen?'tr-left':'tr-left-re'" class="flex flex-column space-between relative" style="display:flex;justify-content:center;height:100%;">
<!-- 物联网主机 --> <!-- leftbar -->
<div style="transform-origin:left center;left:0;" class="absolute" :style="{transform:'scale(' + ( heightScale) + ')'}" id="leftbar"> <div style="transform-origin:left center;left:0;" class="absolute" :style="{transform:'scale(' + ( heightScale) + ')'}" id="leftbar">
<!-- 设备状态 --> <!-- 设备状态 -->
<div style="width: 514px;"> <div style="width: 514px;">
...@@ -455,38 +460,38 @@ ...@@ -455,38 +460,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>
...@@ -523,7 +528,7 @@ ...@@ -523,7 +528,7 @@
style="left: 0;bottom: 0;transform: translateY(calc(100% + 10px));background-color: rgba(13,27,48,.7);border-radius: 5px;padding: 3px 0;" style="left: 0;bottom: 0;transform: translateY(calc(100% + 10px));background-color: rgba(13,27,48,.7);border-radius: 5px;padding: 3px 0;"
v-show="aiShowMask"> v-show="aiShowMask">
<div class="f14 h30 flex-text select" :class="index == aiActive?'color-light':''" <div class="f14 h30 flex-text select" :class="index == aiActive?'color-light':''"
style="padding: 0 10px;" v-for="(item,index) in timeSelect" :key="index" style="padding: 0 10px;" v-for="(item, index) in timeSelect" :key="index"
@click.stop="clickAiActive(index)"> @click.stop="clickAiActive(index)">
<div class="flex-1">{{ item }}</div> <div class="flex-1">{{ item }}</div>
</div> </div>
...@@ -1028,6 +1033,8 @@ ...@@ -1028,6 +1033,8 @@
city:[], city:[],
area:[], area:[],
scompany:[], scompany:[],
mineType:void 0,
} }
}, },
watch: { watch: {
...@@ -1177,6 +1184,16 @@ ...@@ -1177,6 +1184,16 @@
if(i < 3){ if(i < 3){
reqiust(list[0].id, i); reqiust(list[0].id, i);
}else{ }else{
console.log('list ________________ ', list);
//var item = {
// name: "全部",
// label: "全部",
// id: 7,
//};
//
//list.unshift(item);
that.reqEnterprise(list[0] && list[0].id || 0, selects[i]); that.reqEnterprise(list[0] && list[0].id || 0, selects[i]);
}; };
}); });
...@@ -1185,7 +1202,7 @@ ...@@ -1185,7 +1202,7 @@
reqEnterprise(value, select){ reqEnterprise(value, select){
var req = { var req = {
params: { params: {
deptId:(this.deptId = value || 0) deptId:(this.deptId = value || 0),
} }
}; };
axios.get(host + '/api/yingji/deptandenterprise/enterprise', req).then(res => { axios.get(host + '/api/yingji/deptandenterprise/enterprise', req).then(res => {
...@@ -1201,9 +1218,9 @@ ...@@ -1201,9 +1218,9 @@
} }
// 矿山数据 // 矿山数据
this.reqMines(this.enterpriseId); this.reqMines();
this.setMap(); //this.setMap();
}); });
var that = this; var that = this;
...@@ -1239,11 +1256,15 @@ ...@@ -1239,11 +1256,15 @@
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 => {
console.log('reqMines ________________ ', req.params);
axios.get(host + '/api/datav/mine', req).then(res => {
loading.close(); loading.close();
this.isReady = true; this.isReady = true;
...@@ -1251,8 +1272,8 @@ ...@@ -1251,8 +1272,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) {
...@@ -1278,10 +1299,6 @@ ...@@ -1278,10 +1299,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];
...@@ -1324,6 +1341,19 @@ ...@@ -1324,6 +1341,19 @@
}); });
}, },
// 矿山类型
mineTypeEvent(value){
if(this.mineType === value){
this.mineType = void 0
}else{
this.mineType = value;
};
// 矿山数据
this.reqMines();
},
// ------------------------------------------------------------------- // -------------------------------------------------------------------
querySearchAsync(queryString, cb) { querySearchAsync(queryString, cb) {
...@@ -1365,7 +1395,7 @@ ...@@ -1365,7 +1395,7 @@
// 设置地图 // 设置地图
setMap() { setMap() {
map = new AMap.Map('map', { map = new AMap.Map('map', {
zoom: 14, // 缩放级别 zoom: 8, // 缩放级别
zooms: [3, 16], zooms: [3, 16],
layers: [ layers: [
// 卫星 // 卫星
...@@ -1385,9 +1415,7 @@ ...@@ -1385,9 +1415,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: {
...@@ -1398,7 +1426,14 @@ ...@@ -1398,7 +1426,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({
...@@ -1517,6 +1552,13 @@ ...@@ -1517,6 +1552,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('bigScreenDetailMenuModel', 'emergency');
window.open(selfHost + '/datav/detail/video-monitor.html', '_self')
return ;
window.localStorage.setItem('kd.selected.mine', JSON.stringify(mine)) window.localStorage.setItem('kd.selected.mine', JSON.stringify(mine))
window.open(selfHost + '/datav/detail/video-monitor.html', '_self') window.open(selfHost + '/datav/detail/video-monitor.html', '_self')
...@@ -1883,7 +1925,6 @@ ...@@ -1883,7 +1925,6 @@
* 仅第一次加载时执行 * 仅第一次加载时执行
*/ */
if (!refesh) { if (!refesh) {
//this.reqMines();
setTimeout(() => this.getData('refesh'), 60 * 1000);// 10秒一个刷新周期 setTimeout(() => this.getData('refesh'), 60 * 1000);// 10秒一个刷新周期
} }
......
...@@ -310,7 +310,7 @@ ...@@ -310,7 +310,7 @@
<!-- 设备状态 --> <!-- 设备状态 -->
<div style="width:514px;margin-bottom:260px;padding:10px 0 10px 15px;background:rgba(0,0,0,.3);"> <div style="width:514px;margin-bottom:260px;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>
</div> </div>
<div class="relative" style="width: 480px;"> <div class="relative" style="width: 480px;">
......
...@@ -255,7 +255,7 @@ ...@@ -255,7 +255,7 @@
} }
} }
.md3-1{ .md3-1, .md9{
border:1px solid red; border:1px solid red;
.md1-wrap{ .md1-wrap{
...@@ -275,7 +275,6 @@ ...@@ -275,7 +275,6 @@
} }
.md1b{ .md1b{
.m-tt3{ .m-tt3{
border:1px solid yellow; border:1px solid yellow;
display:flex;justify-content:flex-end; display:flex;justify-content:flex-end;
...@@ -286,7 +285,19 @@ ...@@ -286,7 +285,19 @@
select:focus{outline:none;} select:focus{outline:none;}
option{color:#d8f9ff;background-color:rgba(1,35,62,.7);} option{color:#d8f9ff;background-color:rgba(1,35,62,.7);}
} }
.chartbox{
position:relative;height:300px;;width:100%;
.charts{
position:absolute;top:0;left:0;height:100%;width:100%;
border:1px solid green;
}
}
}
} }
.md9{
} }
} }
</style> </style>
...@@ -371,6 +382,36 @@ ...@@ -371,6 +382,36 @@
<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="chartbox">
<div class="charts"></div>
</div>
</div>
<div class="mt20 mb20 animation relative ovh l-md2" style="width:480px;">
<div style="background-color:rgba(27,165,169,.5);border:1px solid #1EAEAC;font-weight:bold;" class="h30 flex space-between align-center f18 ml5 mt10 tt-2">
<div style="width: 120px;" class="flex-text">站点编号</div>
<div class="flex-1 text-center">测站名称</div>
<div class="text-center flex-1">实时雨量</div>
<div class="flex-text" style="width: 90px;">累计雨量</div>
<div style="width: 3px;" class="h30"></div>
</div>
<div class="ml5" style="height:300px;overflow-y:scroll;color:#0BD2E0;">
<div class="solid-bottom flex space-between f14" style="height:64px;" v-for="(item,index) in alarmlist" :key="index">
<div style="width: 120px;" class="flex-text ovh">
<div class="flex-1 ml10 mr10 ellipsis2 text-center">{{ item.date }}</div>
</div>
<div class="flex-1 flex-text ovh">
<div class="flex-1 ml10 mr10 ellipsis text-center">{{ item.sensorname }}</div>
</div>
<div class="text-center flex-1 flex-text">
<div>
<div>{{ item.ssvalue }}</div>
</div>
</div>
<div class="flex-text" style="width:90px;">{{item.svalue}}</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -484,39 +525,10 @@ ...@@ -484,39 +525,10 @@
<!-- 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 class="mt20 mb20 animation relative ovh l-md2" style="width:514px;background:rgba(0,0,0,.25);padding:10px 0;">
<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 style="width: 483px;background-color:rgba(27,165,169,.5);border:1px solid #1EAEAC;font-weight:bold;" class="h30 flex space-between align-center f18 ml5 mt10 tt-2">
<div style="width: 120px;" class="flex-text">矿山名称</div>
<div class="flex-1 text-center">设备名称</div>
<div class="text-center flex-1">报警时间</div>
<div class="flex-text" style="width: 90px;">状态</div>
<div style="width: 3px;" class="h30"></div>
</div>
<div class="ml5" style="height:300px;overflow-y:scroll;width:483px;color:#0BD2E0;">
<div class="solid-bottom flex space-between f14" style="height:64px;" v-for="(item,index) in alarmlist" :key="index">
<div style="width: 120px;" class="flex-text ovh">
<div class="flex-1 ml10 mr10 ellipsis2 text-center">{{ item.enterpriseName }}</div>
</div>
<div class="flex-1 flex-text ovh">
<div class="flex-1 ml10 mr10 ellipsis text-center">{{ item.name }}</div>
</div>
<div class="text-center flex-1 flex-text">
<div>
<div>{{ item.time }}</div>
</div>
</div>
<div class="flex-text" style="width: 90px;" :class="item.status == 1?'':'color-yellow'">{{item.state}}</div>
</div>
</div>
</div>
<!-- 变形监测报警统计 --> <!-- 变形监测报警统计 -->
<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"
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>
...@@ -531,6 +543,31 @@ ...@@ -531,6 +543,31 @@
<div class="m-t2"><div></div></div> <div class="m-t2"><div></div></div>
</div> </div>
<div id="main" style="width: 100%;height:300px;"></div> <div id="main" style="width: 100%;height:300px;"></div>
</div> -->
<!-- 风速监测 -->
<div class="md9" style="width:514px;margin-bottom:260px;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:220px;">
<li v-for="item in deviceL1">
<div class="icon"><font>{{item.num}}</font></div>
<span>{{item.name}}</span>
</li>
</ul>
</div>
<div class="chartbox">
<div class="charts"></div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -795,6 +832,9 @@ ...@@ -795,6 +832,9 @@
<script src="js/axios.min.js"></script> <script src="js/axios.min.js"></script>
<!-- cookie --> <!-- cookie -->
<script src="js/js.cookie.js"></script> <script src="js/js.cookie.js"></script>
<script src="js/highcharts.js"></script>
<script> <script>
const host = location.protocol + '//' + (location.hostname === '192.168.3.226' ? '192.168.3.37' : '192.168.13.200') + ':8013'; const host = location.protocol + '//' + (location.hostname === '192.168.3.226' ? '192.168.3.37' : '192.168.13.200') + ':8013';
...@@ -873,6 +913,10 @@ ...@@ -873,6 +913,10 @@
md3_1b1: 0, md3_1b1: 0,
md3_1bMask: false, md3_1bMask: false,
// 设备状态
deviceL1:[],
deviceL2:[],
// 公告信息 // 公告信息
notice: { notice: {
title: '', title: '',
...@@ -951,6 +995,17 @@ ...@@ -951,6 +995,17 @@
var leftbar = bodyel.querySelector("#leftbar"); var leftbar = bodyel.querySelector("#leftbar");
var rightbar = bodyel.querySelector("#rightbar"); var rightbar = bodyel.querySelector("#rightbar");
//
var md31 = this.$el.querySelector(".md3-1");
this.md31charts = md31.querySelector(".charts");
var md9 = this.$el.querySelector(".md9");
//var md9chart1 = this.$el.querySelector(".md9");
this.heightScale = (this.clientHeight - 100) / 1080 this.heightScale = (this.clientHeight - 100) / 1080
this.widthScale = this.clientWidth / 1920 this.widthScale = this.clientWidth / 1920
...@@ -1015,15 +1070,73 @@ ...@@ -1015,15 +1070,73 @@
// select1 // select1
qf.UI.selectRender(select, slist1, { qf.UI.selectRender(select, slist1, {
onchange: function(val){ onchange: function(val){
console.log('select ________________ ', val); self.md3_1param2 = ~~val;
self.reqMd3_1b();
}, },
}); });
self.m1tt3.appendChild(self.select2); self.m1tt3.appendChild(self.select2);
self.m1tt3.appendChild(select); self.m1tt3.appendChild(select);
self.md3_1param2 = ~~slist1[0].value;
})();
// md9 选择列表事件
(function(){
self.m9tt3 = md9.querySelector(".m-tt3");
var select = document.createElement("select");
self.m9select2 = document.createElement("select");
var slist1 = [
{name:'近一月',value:'1'},
{name:'近半年',value:'2'},
{name:'近一年',value:'3'},
];
// select1
qf.UI.selectRender(select, slist1, {
onchange: function(val){
self.md9param2 = ~~val;
self.reqMd9();
},
});
self.m9tt3.appendChild(self.m9select2);
self.m9tt3.appendChild(select);
self.md9param2 = ~~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){
var colors = opts.colors || ['#7CB5EC', '#90ED7D', '#F7A35C', '#8085E9', '#F15C80', '#E4D354', '#2B908F', '#F45B5B', '#91E8E1', '#0769CB', '#00ABBD', '#ffd886', "#9F2E61", "#4D670C"];
var len = names.length;
for(var i=0; i<len; i++){
var item = names[i];
var serie = Object.assign({}, opts.serie) || {};
serie.name = item.name;
!serie.data && (serie.data = []);
serie.key = item.key;
!serie.type && (serie.type = data.chartType || opts.type);
serie.color = colors[i];
series.push(serie);
};
for(var item of list){
var values = item.values;
var timestamp = item['date'];
categories.push(timestamp);
for(var serie of series){
var value = values[serie.key] * 1;
Math.abs(value) > maxVal && (maxVal = Math.abs(value));
serie.data.push([timestamp, value]);
};
};
};
return {series:series, categories:categories, maxVal:maxVal}
};
}, },
...@@ -1116,8 +1229,6 @@ ...@@ -1116,8 +1229,6 @@
this.reqMines(enterpriseId); this.reqMines(enterpriseId);
}, },
// 请求矿山列表 // 请求矿山列表
reqMines(id){ reqMines(id){
var loading = this.$loading({ var loading = this.$loading({
...@@ -1193,7 +1304,7 @@ ...@@ -1193,7 +1304,7 @@
} }
}; };
axios.get(host + '/api/shuili/rainNum', req).then(res => { axios.get(host + '/api/shuili/rainNum', req).then(res => {
res = res.data; var res = res.data, body = res.body || [];
var body = res.body || []; var body = res.body || [];
this.md3_1 = body.zongliang.value; this.md3_1 = body.zongliang.value;
this.md3_1l = body.list; this.md3_1l = body.list;
...@@ -1203,10 +1314,9 @@ ...@@ -1203,10 +1314,9 @@
this.Md3_1bSelect(); this.Md3_1bSelect();
}, },
Md3_1bSelect(){
console.log('Md3_1bSelect ________________ ', 1111111111);
Md3_1bSelect(){
var that = this;
var req = { var req = {
params: { params: {
...@@ -1216,46 +1326,156 @@ ...@@ -1216,46 +1326,156 @@
}; };
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(this.select2, list, { qf.UI.selectRender(that.select2, list, {
'name':'equipName', 'name':'equipName',
'value':'equipNo', 'value':'equipNo',
onchange: function(val){ onchange: function(val){
console.log('select1 ________________ ', val); that.md31equipNo = val;
that.reqMd3_1b();
}, },
}); });
that.md31equipNo = list[0] && list[0].equipNo || 0;
that.reqMd3_1b();
}); });
}, },
reqMd3_1b: function(){
reqMd8(){ var that = this;
var req = { var req = {
params: { params: {
enterpriseId: this.enterpriseId, enterpriseId: this.enterpriseId,
deptId: this.deptId, deptId: this.deptId,
equipNo: this.md31equipNo,
timeUtil: this.md3_1param2,
} }
}; };
axios.get(host + '/api/yingji/keynoteadmin/alertListNature', req).then(res => { axios.get(host + '/api/shuili/rainData', req).then(res => {
res = res.data; var res = res.data, body = res.body || [];
var list = res.body || []; var formatSeries = that.seriesDataFormat(body, {datekey:'date', serie:{
this.alarmlist = list; type: 'column',
}); marker: {
enabled: false
}, },
}, colors:["#fcaa00", "#20ef03", "#38f1f3"]});
reqMd3() { var series = formatSeries.series;
return ;
var req = { series[0].type = 'line';
params: { series[0].zIndex = 2;
enterpriseId:this.enterpriseId,
deptId: this.deptId, var option = {
dateRange: this.daterange3.timeSpace.toString() 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,
}; };
axios.get(host + '/api/yingji/keynoteadmin/opencastAlertNature', req).then(res => {
res = res.data; new Highcharts.chart(that.md31charts, option);
this.left3Charts(res.body)
}); });
}, },
left3Charts(body){ left3Charts(body){
var list = body.list; var list = body.list;
// 基于准备好的dom,初始化echarts实例 // 基于准备好的dom,初始化echarts实例
...@@ -1270,28 +1490,7 @@ ...@@ -1270,28 +1490,7 @@
yData1.push(item.values.alarmCount); yData1.push(item.values.alarmCount);
}; };
}; };
/* if (this.active === 0) {
xData = ['5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月', '1月', '2月', '3月', '4月']
for (const i in xData) {
yData1.push(Math.round(Math.random() * 40))
yData2.push(Math.round(Math.random() * 40))
}
}
if (this.active === 1) {
xData = ['11月', '12月', '1月', '2月', '3月', '4月']
for (const i in xData) {
yData1.push(Math.round(Math.random() * 40))
yData2.push(Math.round(Math.random() * 40))
}
}
if (this.active === 2) {
xData = ['3/27', '3/28', '3/29', '3/30', '3/31', '4/1', '4/2', '4/3', '4/4', '4/5', '4/6', '4/7', '4/8', '4/9', '4/10', '4/11', '4/12', '4/13', '4/14', '4/15', '4/16', '4/17', '4/18', '4/19', '4/20', '4/21', '4/22', '4/23', '4/24', '4/25']
for (const i in xData) {
yData1.push(Math.round(Math.random() * 10))
yData2.push(Math.round(Math.random() * 10))
}
} */
// 绘制图表 // 绘制图表
const bars = [{ const bars = [{
name: '报警数据', name: '报警数据',
...@@ -1362,6 +1561,39 @@ ...@@ -1362,6 +1561,39 @@
}); });
}, },
reqMd8(){
var req = {
params: {
enterpriseId: this.enterpriseId,
deptId: this.deptId,
}
};
axios.get(host + '/api/shuili/rainAllData', req).then(res => {
res = res.data;
var list = res.body || [];
this.alarmlist = list;
});
},
reqMd3() {
return ;
var req = {
params: {
enterpriseId:this.enterpriseId,
deptId: this.deptId,
dateRange: this.daterange3.timeSpace.toString()
}
};
axios.get(host + '/api/yingji/keynoteadmin/opencastAlertNature', req).then(res => {
res = res.data;
this.left3Charts(res.body)
});
},
// ------------------------------------------------------------------- // -------------------------------------------------------------------
querySearchAsync(queryString, cb) { querySearchAsync(queryString, cb) {
var results = queryString ? this.marker.filter(v => v.name.indexOf(queryString) != -1) : this.marker var results = queryString ? this.marker.filter(v => v.name.indexOf(queryString) != -1) : this.marker
......
...@@ -72,10 +72,13 @@ ...@@ -72,10 +72,13 @@
:ref="`addhdpic`" :ref="`addhdpic`"
class="helloworld" class="helloworld"
type="file" type="file"
accept=".pdf"
hidden hidden
@change="addhdPicChange" @change="addhdPicChange"
/> />
</label> </label>
<span>仅支持pdf格式文件</span>
</el-form-item> </el-form-item>
<el-form-item label=""> <el-form-item label="">
<div v-for="(item, index) in uploadedFiles" :key="item.name + index"> <div v-for="(item, index) in uploadedFiles" :key="item.name + index">
...@@ -181,6 +184,13 @@ ...@@ -181,6 +184,13 @@
<el-table-column width="200px" prop="createTime" label="录入时间" /> <el-table-column width="200px" prop="createTime" label="录入时间" />
<el-table-column label="操作" width="230px" align="center"> <el-table-column label="操作" width="230px" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button
v-show="scope.row.downloadWhether"
type="primary"
size="mini"
@click="viewFile(scope.row)"
>预览</el-button
>
<el-button <el-button
v-show="scope.row.downloadWhether" v-show="scope.row.downloadWhether"
type="primary" type="primary"
...@@ -227,6 +237,8 @@ export default { ...@@ -227,6 +237,8 @@ export default {
}, },
data() { data() {
return { return {
dialogVisible4:false,
pdfSrc:'',
modalBtnLoad: false, modalBtnLoad: false,
query: { query: {
originallyName: "", originallyName: "",
...@@ -268,6 +280,13 @@ export default { ...@@ -268,6 +280,13 @@ export default {
}, },
created() {}, created() {},
methods: { methods: {
viewFile(row){
this.pdfSrc = process.env.VUE_APP_LOCAL_API+'/file'+row.filePath;
const link = document.createElement('a');
link.href = this.pdfSrc;
link.target = '_blank';
link.click();
},
// searchParamReset() { // searchParamReset() {
// this.searchParam = { // this.searchParam = {
// originallyName: "", // originallyName: "",
......
...@@ -127,8 +127,7 @@ export default { ...@@ -127,8 +127,7 @@ export default {
// location.href = 'http://192.168.3.226:8057/datav/natural.html' // location.href = 'http://192.168.3.226:8057/datav/natural.html'
location.href = host + "/datav/natural.html"; location.href = host + "/datav/natural.html";
} else if (type === "水利系统") { } else if (type === "水利系统") {
// location.href = 'http://192.168.3.226:8057/datav/watersource.html' // location.href = host + "/datav/watersource.html";
location.href = host + "/datav/watersource.html";
} else if (type === "电子档案馆") { } else if (type === "电子档案馆") {
// this.$router.push({ path: "home4Center" }); // this.$router.push({ path: "home4Center" });
this.$router.push({ path: "/user/center" }); this.$router.push({ path: "/user/center" });
......
...@@ -88,7 +88,7 @@ ...@@ -88,7 +88,7 @@
</el-row> </el-row>
<el-row :gutter="100"> <el-row :gutter="100">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="行业类别:" prop="dict3"> <el-form-item label="矿山类别:" prop="dict3">
<el-select v-model="mainDataEditing.dict3" placeholder="请选择" style="width: 100%;"> <el-select v-model="mainDataEditing.dict3" placeholder="请选择" style="width: 100%;">
<el-option v-for="item in dict3List" :key="item.id" :label="item.value" :value="item.id" /> <el-option v-for="item in dict3List" :key="item.id" :label="item.value" :value="item.id" />
</el-select> </el-select>
...@@ -336,7 +336,7 @@ ...@@ -336,7 +336,7 @@
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="行业类别:" prop="dict3"> <el-form-item label="矿山类别:" prop="dict3">
<span>{{ dialog1Data.dict3Name }}</span> <span>{{ dialog1Data.dict3Name }}</span>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -622,35 +622,35 @@ export default { ...@@ -622,35 +622,35 @@ export default {
}, },
mainFormRules: { mainFormRules: {
name: [{ required: true, message: '请输入' }], name: [{ required: true, message: '请输入' }],
idCode: [{ required: true, message: '请输入' }], // idCode: [{ required: true, message: '请输入' }],
_administrativeAreaCascade: [{ required: true, message: '请选择' }], // _administrativeAreaCascade: [{ required: true, message: '请选择' }],
address: [{ required: true, message: '请输入' }], // address: [{ required: true, message: '请输入' }],
dict1: [{ required: true, message: '请选择' }], // dict1: [{ required: true, message: '请选择' }],
dict2: [{ required: true, message: '请选择' }], // dict2: [{ required: true, message: '请选择' }],
dict3: [{ required: true, message: '请选择' }], dict3: [{ required: true, message: '请选择' }],
hasRegisteredCapital: [{ required: true, message: '请选择' }], // hasRegisteredCapital: [{ required: true, message: '请选择' }],
registeredCapital: [{ required: true, message: '请输入' }], // registeredCapital: [{ required: true, message: '请输入' }],
businessScope: [{ required: true, message: '请输入' }], // businessScope: [{ required: true, message: '请输入' }],
setupDate: [{ required: true, message: '请选择' }], // setupDate: [{ required: true, message: '请选择' }],
beginLimitDate: [{ required: true, message: '请选择' }], // beginLimitDate: [{ required: true, message: '请选择' }],
endLimitDate: [{ required: true, message: '请选择' }], // endLimitDate: [{ required: true, message: '请选择' }],
dict4: [{ required: true, message: '请选择' }], // dict4: [{ required: true, message: '请选择' }],
dict5: [{ required: true, message: '请选择' }], // dict5: [{ required: true, message: '请选择' }],
dict6: [{ required: true, message: '请选择' }], // dict6: [{ required: true, message: '请选择' }],
dict7: [{ required: true, message: '请选择' }], // dict7: [{ required: true, message: '请选择' }],
dict41: [{ required: true, message: '请选择' }], // dict41: [{ required: true, message: '请选择' }],
liablePerson: [{ required: true, message: '请输入' }], // liablePerson: [{ required: true, message: '请输入' }],
liablePersonPhone: [{ required: true, trigger: 'blur', validator: validatePhone }], // liablePersonPhone: [{ required: true, trigger: 'blur', validator: validatePhone }],
businessAddress: [{ required: true, message: '请输入' }], // businessAddress: [{ required: true, message: '请输入' }],
longitude: [{ required: true, message: '请选择位置' }], // longitude: [{ required: true, message: '请选择位置' }],
latitude: [{ required: true, message: '请选择位置' }], // latitude: [{ required: true, message: '请选择位置' }],
_workLicenseFileList: [{ required: true, message: '请选择' }], // _workLicenseFileList: [{ required: true, message: '请选择' }],
workLicenseBeginDate: [{ required: true, message: '请选择' }], // workLicenseBeginDate: [{ required: true, message: '请选择' }],
workLicenseEndDate: [{ required: true, message: '请选择' }], // workLicenseEndDate: [{ required: true, message: '请选择' }],
_safetyLicenseFileList: [{ required: true, message: '请选择' }], // _safetyLicenseFileList: [{ required: true, message: '请选择' }],
safetyLicenseBeginDate: [{ required: true, message: '请选择' }], // safetyLicenseBeginDate: [{ required: true, message: '请选择' }],
safetyLicenseEndDate: [{ required: true, message: '请选择' }] // safetyLicenseEndDate: [{ required: true, message: '请选择' }]
}, },
searching: false, searching: false,
......
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