chengdandan
/
fayuanjiangbei
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: chengdandan:4ed697d5fa2c92e1504a0b875f996e92ea5823e7
Branches Tags
chengdandan:master
..
compare: chengdandan:57f57b451d81cceca3cfa7a4b4ad2ad170205e2d
Branches Tags
chengdandan:master

No commits in common. "4ed697d5fa2c92e1504a0b875f996e92ea5823e7" and "57f57b451d81cceca3cfa7a4b4ad2ad170205e2d" have entirely different histories.
4ed697d5fa ... 57f57b451d

25 changed files with 15439 additions and 37204 deletions
Show Stats Expand all files Collapse all files

3
package.json
View File

@ -7,7 +7,6 @@
"build": "vue-cli-service build"
},
"dependencies": {
"@videojs/http-streaming": "^2.16.2",
"amfe-flexible": "^2.2.1",
"axios": "^1.1.3",
"core-js": "^2.6.5",
@ -23,8 +22,6 @@
"postcss-px2rem-exclude": "^0.0.6",
"semver": "^7.4.0",
"v-fit-columns": "^0.2.0",
"video.js": "^8.0.4",
"videojs-contrib-hls": "^5.15.0",
"vue": "^2.6.10",
"vue-pdf": "4.2.0",
"vue-router": "^3.0.3",

1
public/camera/css/video-js.css
View File

File diff suppressed because one or more lines are too long

44
public/camera/demoVideo.html
View File

@ -1,44 +0,0 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>H5 PC测试</title>
<link href="css/video-js.css" rel="stylesheet">
<script src="js/video.min.js"></script>
<script src="js/videojs-contrib-hls.js"></script>
<style>
body{background-color: #191919}
#example-video{
margin: 0 auto;
width: 80%;
height:600px;
}
</style>
</head>
<body>
<div>
<h1 style="color: white; text-align: center;">HLS测试</h1>
<video id="example-video" class="video-js" autoplay="autoplay" controls preload="auto"
width="600" height="800" >
<!-- <source src="http://193.112.101.157:8080/hls/test.m3u8" type="application/x-mpegURL" /> -->
<!-- <source src="http://60.190.97.190:83/openUrl/LpSobcI/live.m3u8" type="application/x-mpegURL"> -->
<source :src="url" type="application/x-mpegURL">
</video>
</div>
</body>
<script>
window.onload = function() {
var player = videojs('example-video');
player.play();
},
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^'']*)(&|$)", "i");
// var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
console.log();
</script>
</html>

1
public/camera/js/hls.min.js vendored
View File

File diff suppressed because one or more lines are too long

8
public/camera/js/video.min.js vendored
View File

File diff suppressed because one or more lines are too long

21581
public/camera/js/videojs-contrib-hls.js
View File

File diff suppressed because it is too large Load Diff

8
public/camera/js/videojs-contrib-hls.min.js vendored
View File

File diff suppressed because one or more lines are too long

1
public/camera/js/videojs-ie8.min.js vendored
View File

File diff suppressed because one or more lines are too long

12
public/video/video.html
View File

@ -87,16 +87,10 @@
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
function getCameraList(name) {
var reg = new RegExp("(^|&)" + name + "=([^'']*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
// var videoBack = 'ws://192.168.105.213:9999/play?stream=rtsp://10.16.56.21:554/openUrl/EKndeuY?beginTime=20220709T141558&endTime=20220710T141558'
// $('#player').attr('video-url',videoBack);
$('#player').attr('video-url',getQueryString('src'));
// $('#player').attr('video-url',"http://138.227.200.2:83/openUrl/GNzyMUM/live.m3u8");
// $('#player').attr('video-url',"video.mp4");
// 截图
// function snapshot(){
// if(document.getElementsByClassName("easy-video-player-inner")[0]){
@ -120,10 +114,8 @@
//点击事件
$('#appc').click(function(){
let val = getQueryString('src')
let code = getCameraList('code')
window.parent.postMessage({
val,
code
val
}, '*'); // * 通配符 匹配所有地址; content 表示传递过去嵌套iframe页面的数据
})
</script>

126
src/App.vue
View File

@ -28,37 +28,23 @@
</div>
<div class="menu">
<div class="menuList">
<div
class="menuBtn"
v-for="(item, index) in menuBtn"
:key="index"
@click="menuChange(index, item.name)"
:class="{ menuAc: menuAc == index }"
>
<div class="menuBtn" v-for="(item, index) in menuBtn" :key="index" @click="menuChange(index,item.name)" :class="{menuAc : menuAc == index}">
<!-- <img :src="item.icon" :style="{'wdith':menuAc == index ? '75%':'55%','height':menuAc == index ? '85%':'71%'}"/> -->
<img
:src="item.icon"
:style="{
wdith: menuAc == index ? '75%' : '55%',
height: menuAc == index ? '85%' : '85%',
}"
/>
<div style="font-size: 0.55rem; margin-top: 5%">{{ item.name }}</div>
<img :src="item.icon" :style="{'wdith':menuAc == index ? '75%':'55%','height':menuAc == index ? '85%':'85%'}"/>
<div style="font-size: 0.55rem;margin-top: 5%;">{{ item.name }}</div>
</div>
</div>
</div>
<div class="content">
<keep-alive>
<router-view />
</keep-alive>
</div>
</div>
</template>
<script>
import pdf from "vue-pdf";
import axios from "axios";
import { getData } from "./api/index.js";
import pdf from 'vue-pdf'
import axios from "axios"
import {getData} from './api/index.js'
export default {
data(){
return{
@ -66,39 +52,31 @@ export default {
window.innerWidth ||
document.documentElement.clientWidth ||
document.body.clientWidth,
time: "",
weekList: [
"星期日",
"星期一",
"星期二",
"星期三",
"星期四",
"星期五",
"星期六",
],
week: "",
time:'',
weekList:['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
week:'',
floorAct:0,
floorList:[
{
name: "楼顶",
name:'楼顶',
},
{
name: "F5",
name:'F5',
},
{
name: "F4",
name:'F4',
},
{
name: "F3",
name:'F3',
},
{
name: "F2",
name:'F2',
},
{
name: "F1",
name:'F1',
},
{
name: "B1",
name:'B1',
},
],
menuBtn: [
@ -129,85 +107,85 @@ export default {
],
menuAc:0, //菜单点击
timer:null,
};
}
},
created() {
this.fun();
},
mounted() {
window.goPage = this.goPage();
this.menuChange(0, this.menuBtn[0].name);
let week = new Date(this.$moment().format("YYYY-MM-DD")).getDay();
this.week = this.weekList[week];
window.goPage = this.goPage()
this.menuChange(0,this.menuBtn[0].name)
let week = new Date(this.$moment().format("YYYY-MM-DD")).getDay()
this.week = this.weekList[week]
window.setInterval(()=>{
this.time = this.$moment().format("YYYY-MM-DD HH:mm:ss");
}, 100);
this.time = this.$moment().format("YYYY-MM-DD HH:mm:ss")
},100)
const that = this;
window.onresize = () => {
return () => {
return (() => {
(window.screenWidth =
window.innerWidth ||
document.documentElement.clientWidth ||
document.body.clientWidth),
(that.screenWidth = window.screenWidth);
that.fun();
};
});
};
},
methods:{
//菜单选中
menuChange(index,name){
this.goPage(name);
this.menuAc = index;
this.goPage(name)
this.menuAc = index
this.menuBtn.forEach((item,index) => {
if (index == 0) {
item.icon = require("./assets/images/shouYe.png");
item.icon = require("./assets/images/shouYe.png")
}else if (index == 1) {
item.icon = require("./assets/images/faTing.png");
item.icon = require("./assets/images/faTing.png")
}else if (index == 2) {
item.icon = require("./assets/images/jieNeng.png");
item.icon = require("./assets/images/jieNeng.png")
}else if (index == 3) {
item.icon = require("./assets/images/anFang.png");
item.icon = require("./assets/images/anFang.png")
}else if (index == 4) {
item.icon = require("./assets/images/yunWei.png");
item.icon = require("./assets/images/yunWei.png")
}else if (index == 5) {
item.icon = require("./assets/images/gaoJing.png");
item.icon = require("./assets/images/gaoJing.png")
}
});
if (index == 0) {
this.menuBtn[index].icon = require("./assets/images/shouYeAc.png");
this.$router.push("/");
this.menuBtn[index].icon = require("./assets/images/shouYeAc.png")
this.$router.push('/')
}else if (index == 1) {
this.menuBtn[index].icon = require("./assets/images/faTingAc.png");
this.$router.push("court");
this.menuBtn[index].icon = require("./assets/images/faTingAc.png")
this.$router.push('court')
}else if (index == 2) {
this.menuBtn[index].icon = require("./assets/images/jieNengAc.png");
this.$router.push("energySaving");
this.menuBtn[index].icon = require("./assets/images/jieNengAc.png")
this.$router.push('energySaving')
}else if (index == 3) {
this.menuBtn[index].icon = require("./assets/images/anFangAc.png");
this.$router.push("security");
this.menuBtn[index].icon = require("./assets/images/anFangAc.png")
this.$router.push('security')
}else if (index == 4) {
this.menuBtn[index].icon = require("./assets/images/yunWeiAc.png");
this.$router.push("operationMaintenance");
this.menuBtn[index].icon = require("./assets/images/yunWeiAc.png")
this.$router.push('operationMaintenance')
}else if (index == 5) {
this.menuBtn[index].icon = require("./assets/images/gaoJingAc.png");
this.$router.push("alarm");
this.menuBtn[index].icon = require("./assets/images/gaoJingAc.png")
this.$router.push('alarm')
}
},
goPage(name){
console.log(name);
console.log(name)
},
//选中楼层
floorChange(index){
this.floorAct = index;
this.floorAct = index
},
// 设置html标签的字体大小自适应 为了使得rem单位自适应
fun() {
const that = this;
var htmlobj = document.getElementsByTagName("html")[0];
htmlobj.style.fontSize = (that.screenWidth / 1920) * 20 + "px";
},
}
},
watch: {
screenWidth(val) {
@ -223,14 +201,15 @@ export default {
}
},
},
components: {},
};
components: {
},
}
</script>
<style lang="less">
/*将大屏设置为1920*1080,设置缩放的方向*/
#app {
font-family: "微软雅黑";
font-family:'微软雅黑' ;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
@ -238,6 +217,7 @@ export default {
height: 1080px;
transition: all 0.2s linear;
transform-origin: left top;
}
</style>
<style lang="less" scoped>

7
src/api/haikang.js
View File

@ -1,7 +0,0 @@
import axios from 'axios'
//根据等级获取报警数据
export const getHikvision = (data) => {
return axios.post('/video/cameras/hikvision/',
data
)
};

13
src/api/index.js
View File

@ -33,9 +33,9 @@ export const getBuildinginfos = (params) => {
};
// 获取分项用能信息接口
export const getSubitemList = (data) => {
return axios.post('ecs-server/services/ecm/subitemList',
return axios.post('ecs-server/services/ecm/subitemList', {
data
)
})
};
// 获取所有设备信息
export const getAllDevices = (params) => {
@ -45,14 +45,13 @@ export const getAllDevices = (params) => {
};
// 获取设备实时数据信息
export const getRealData = (data) => {
return axios.post('ecs-server/services/getRealData',
return axios.post('ecs-server/services/getRealData', {
data
)
})
};
// 获取区域用能数据信息
export const getAreaList = (data) => {
return axios.post('ecs-server/services/ecm/areaList',
return axios.post('ecs-server/services/ecm/areaList', {
data
// headers:{'Content-Type':'application/json;charset=utf-8'}
)
})
};

2
src/utils/mqttConfig.js
View File

@ -37,7 +37,7 @@ class mqttHandle {
const { host, port, endpoint, ...options } = this.connect;
console.log("this.connect.host", this.connect.host)
// const connectUrl = 'ws://138.227.111.141:8083/mqtt';
const connectUrl = 'ws://138.227.208.100:1884/mqtt';
const connectUrl = 'ws://172.16.1.253:1884/mqtt';
// const connectUrl = `ws://${this.connect.host}:${this.connect.port}`;
// if (!client.connected) {
// client.on('connect', function () {

101
src/views/camera/camera.vue
View File

@ -1,101 +0,0 @@
<template>
<div class="Camera">
<video
:ref="'video' + videoId"
:id="'video' + videoId"
class="video-js vjs-default-skin"
width="100%"
height="100%"
object-fit:cover
preload="auto"
style="overflow: hidden;"
>
<source :src="videoUrlList" type="application/x-mpegURL" />
</video>
</div>
</template>
<script>
import videojs from "video.js";
import "videojs-contrib-hls";
import "@videojs/http-streaming";
import "video.js/dist/video-js.min.css";
export default {
name:'camera',
props: {
videoUrl: {
type: String,
default: "",
},
id: {
type: Number,
default: 0,
},
},
data() {
return {
videoUrlList:'',
videoId : 0,
};
},
mounted(){
this.videoId = this.id
},
watch: {
videoUrl: {
deep: true,
handler(newVal) {
this.$nextTick(()=>{
this.clickSurveillance(newVal)
})
}
},
id: {
deep: true,
handler(newVal,oldVal) {
this.videoId = newVal
}
},
},
methods: {
// 点击摄像头
clickSurveillance(newVal) {
this.player = null
let that = this
// 注意这里需要加定时器或者在异步请求中才可以
setTimeout(() => {
this.player = videojs(
'video'+this.videoId,
{
bigPlayButton: false,
controlBar: false,
notSupportedMessage: "此视频暂无法播放，请稍后再试",
},
function () {
this.play();
}
);
// 当前要播放的视频地址
this.videoUrlList = newVal;
this.player.src(this.videoUrlList);
videojs('video' + this.videoId).ready(function () {
this.player = this;
this.player.play();
});
}, 500);
},
// 关闭摄像头
closeVideo() {
this.player.dispose();
},
},
};
</script>
<style lang="less" scoped>
.video-js{
width: 100%;
height: 100%;
}
</style>

89
src/views/camera/cameraBig.vue
View File

@ -1,89 +0,0 @@
<template>
<div class="Camera">
<video
ref="video"
id="video"
class="video-js vjs-default-skin"
width="100%"
height="100%"
object-fit:cover
preload="auto"
style="overflow: hidden;"
>
<source :src="videoUrlList" type="application/x-mpegURL" />
</video>
</div>
</template>
<script>
import videojs from "video.js";
import "videojs-contrib-hls";
import "@videojs/http-streaming";
import "video.js/dist/video-js.min.css";
export default {
name:'cameraBig',
props: {
cameraBig:{
type: String,
default: "",
},
},
data() {
return {
videoUrlList:'',
};
},
mounted(){
this.clickSurveillance(this.cameraBig)
},
watch: {
// cameraBig: {
// deep: true,
// handler(newVal) {
// console.log(newVal,'wwwwwwwwww');
// this.clickSurveillance(newVal)
// }
// },
},
methods: {
// 点击摄像头
clickSurveillance(newVal) {
let that = this
// 注意这里需要加定时器或者在异步请求中才可以
setTimeout(() => {
this.player = videojs(
'video',
{
bigPlayButton: false,
controlBar: false,
notSupportedMessage: "此视频暂无法播放，请稍后再试",
},
function () {
this.play();
}
);
// 当前要播放的视频地址
this.videoUrlList = newVal;
this.player.src(this.videoUrlList);
videojs('video').ready(function () {
this.player = this;
this.player.play();
});
}, 400);
},
// 关闭摄像头
closeVideo() {
console.log('关闭');
this.player.dispose();
},
},
};
</script>
<style lang="less" scoped>
.video-js{
width: 100%;
height: 100%;
}
</style>

440
src/views/energySaving.vue
View File

@ -1,5 +1,3 @@
const { color } = require("echarts")
<template>
<div class="energy">
<div class="left">
@ -37,7 +35,7 @@ const { color } = require("echarts")
>
<div v-for="(i, k) in item" :key="k" class="equipmentEnergyChild">
<div class="equipmentList">
<span>{{ i.data }}</span>
<span>{{ i.count }}</span>
<span style="color: rgb(225, 177, 25); font-size: 0.4rem"
>KWH</span
>
@ -352,19 +350,19 @@ export default {
{
name: "今日发电量",
icon: require("../assets/images/jieNengImg/energy.png"),
count: "0",
count: "",
unit: "kWh",
},
{
name: "总发电量",
icon: require("../assets/images/jieNengImg/energy.png"),
count: "0",
count: "",
unit: "kWh",
},
{
name: "有功功率",
icon: require("../assets/images/jieNengImg/power.png"),
count: "0",
count: "",
unit: "kWh",
},
{
@ -376,7 +374,7 @@ export default {
{
name: "运行时间",
icon: require("../assets/images/jieNengImg/runTime.png"),
count: "0",
count: "",
unit: "h",
},
{
@ -391,28 +389,25 @@ export default {
alarmFirstLevel:[],
alarmSecondLevel:[],
alarmThirdLevel:[],
equipmentList2: [],
};
},
mounted() {
this.getAllDevicesInfo();
window.setInterval(() => {
this.getAllDevicesInfo();
}, 10000);
this.getMqttData()
window.alarmSecondLevel= this.alarmSecondLevel
window.alarmThirdLevel= this.alarmThirdLevel
window.alarmAllLevel= this.alarmAllLevel
this.changeWarn(0);
//轮播八个一页
// for (let i = 0; i < this.equipmentList.length; i += 8) {
// this.equipmentList1.push(this.equipmentList.slice(i, i + 8));
// }
for (let i = 0; i < this.equipmentList.length; i += 8) {
this.equipmentList1.push(this.equipmentList.slice(i, i + 8));
}
// this.calculateEcharts();
this.getQOQ()
this.getYOY()
this.calculateEchartsTwo();
// window.createMqtt = this.createMqtt();
this.getAllDevicesInfo();
},
watch: {
alarmFirstLevel(val) {
@ -439,13 +434,62 @@ export default {
//获取能耗计量环比分析
getQOQ() {
let dataList = {
pbuildingId: "79",
buildingId: "79",
customerId: "12345678",
date: this.$moment().format("YYYYMM"),
dateType: "2",
meterType: "1",
// pbuildingId: "-1",
pbuildingId: "-1",
};
//模拟数据
// let resData = {
// values: [
// {
// dateDetail: "13",
// val: 380.29,
// tqVal: 0,
// hqVal: 0,
// },
// {
// dateDetail: "14",
// val: 0.18,
// tqVal: 0,
// hqVal: 380.29,
// },
// {
// dateDetail: "26",
// val: 70.31,
// tqVal: 0,
// hqVal: 0.18,
// },
// {
// dateDetail: "27",
// val: 12.02,
// tqVal: 0,
// hqVal: 70.31,
// },
// {
// dateDetail: "28",
// val: 18.3,
// tqVal: 0,
// hqVal: 12.02,
// },
// {
// dateDetail: "29",
// val: 7.88,
// tqVal: 0,
// hqVal: 18.3,
// },
// ],
// child: [
// {
// val: 489.02,
// buildName: "江北新区法院",
// buildId: 79,
// },
// ],
// };
// this.calculateEcharts(resData.child)
getAreaList(dataList).then((res)=>{
this.calculateEcharts(res.data.data.child);
})
@ -460,9 +504,58 @@ export default {
meterType: "1",
pbuildingId: "-1",
};
//模拟数据
// let resData = {
// values: [
// {
// dateDetail: "13",
// val: 380.29,
// tqVal: 0,
// hqVal: 0,
// },
// {
// dateDetail: "14",
// val: 0.18,
// tqVal: 0,
// hqVal: 380.29,
// },
// {
// dateDetail: "26",
// val: 70.31,
// tqVal: 0,
// hqVal: 0.18,
// },
// {
// dateDetail: "27",
// val: 12.02,
// tqVal: 0,
// hqVal: 70.31,
// },
// {
// dateDetail: "28",
// val: 18.3,
// tqVal: 0,
// hqVal: 12.02,
// },
// {
// dateDetail: "29",
// val: 7.88,
// tqVal: 0,
// hqVal: 18.3,
// },
// ],
// child: [
// {
// val: 489.02,
// buildName: "江北新区法院",
// buildId: 79,
// },
// ],
// };
// this.calculateEchartsTwo(resData.values)
//接口调用
getAreaList(dataList).then((res)=>{
this.calculateEchartsTwo(res.data.data.values);
this.calculateEcharts(res.data.data.values);
})
},
// //mqtt订阅数据
@ -522,24 +615,33 @@ export default {
},
// mqtt订阅（独立）
getDataByMqtt(url, topic) {
const clientId = Number(new Date()).toString(); // 用户名
// const host = url; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt
const clientId = "test_id_" + String(new Date().getTime()); // 用户名
const host = url; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt
const options = {
endpoint: "/mqtt",
clean: true, // 保留会话
cleanSession: true,
connectTimeout: 7000, // 超时时间
reconnectPeriod: 7000, // 重连时间间隔
host: '138.227.111.141',
port: '8083',
// 认证信息
clientId: Number(new Date()).toString(),
// clientId: 'JBFY',
username: "admin",
password: "123456",
// 配置
// 测试：订阅本机IP
// host: host,
// port: port,
keepalive: 60, // 心跳时间，默认60s，设置为0禁用
username: 'test', // 用户名（可选）
password: 1234, // 密码（可选）
clientId: clientId, // 客户端ID，默认随机生成
protocolId: "MQTT",
protocolVersion: 4,
clean: true, // false在离线时接收QoS1和2的消息
reconnectPeriod: 2000, // 重连间隔，默认1000毫秒
connectTimeout: 30 * 1000, // 收到CONNACK之前的等待时间
will: {
// 遗嘱消息（客户端严重断开连接时Broker将自动发送的消息）
topic: topic, // 要发布的主题
payload: "[MQTT-TEST] 遗嘱消息：连接异常断开！", // 要发布的消息
qos: 0, // QoS(Quality of Service)，QoS0：只负责发，QoS1：保证消息至少送达1次，QoS2：保证消息到且仅到1次
retain: false, // 保留标志
},
};
if (this.mqttClient == undefined) {
this.mqttClient = mqtt.connect(url, options); // 连接
this.mqttClient = mqtt.connect(host, options); // 连接
// const client = mqtt.connect(host, options); // 连接
// const client = mqtt.connect(host) // 连接
// 错误回调
@ -553,9 +655,15 @@ export default {
});
// 连接回调
this.mqttClient.on("connect", () => {
// console.log(
// "[MQTT-TEST] 已连接的客户端ID: " + this.models[cIdNum].cName
// );
});
// 接收回调
this.mqttClient.on("message", (topic, message, packet) => {
console.log(
`[MQTT-TEST] 从主题 "${topic}" 收到的内容: ${message.toString()}`,
new Date());
// 解析后端数据
let that = this;
if (topic.indexOf("device/publish/FB80") != -1) {
@ -586,6 +694,207 @@ export default {
},
//获取所有设备信息
getAllDevicesInfo() {
//模拟数据测试
// let allDevicesInfo = [
// {
// gatwayId: "1",
// metername: "A-VZCP2-2",
// meteraddress: "7",
// installtime: 1681363621,
// metercode: "320100A208001002",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP2-3",
// meteraddress: "8",
// installtime: 1681363633,
// metercode: "320100A208001003",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP2-4",
// meteraddress: "9",
// installtime: 1681363646,
// metercode: "320100A208001004",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP2-5",
// meteraddress: "10",
// installtime: 1681363658,
// metercode: "320100A208001005",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP1-1",
// meteraddress: "1",
// installtime: 1681363536,
// metercode: "320100A208001101",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP1-2",
// meteraddress: "2",
// installtime: 1681363554,
// metercode: "320100A208001102",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP1-3",
// meteraddress: "3",
// installtime: 1681363569,
// metercode: "320100A208001103",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP1-4",
// meteraddress: "4",
// installtime: 1681363584,
// metercode: "320100A208001104",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-FACP1-5",
// meteraddress: "5",
// installtime: 1681363597,
// metercode: "320100A208001105",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-FACP2-6",
// meteraddress: "11",
// installtime: 1681363670,
// metercode: "320100A208001006",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "2",
// metername: "C1-04ACP1-1",
// meteraddress: "1",
// installtime: 1681363682,
// metercode: "320100A208003001",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "2",
// metername: "C1-04ACP1-2",
// meteraddress: "1",
// installtime: 1681363692,
// metercode: "320100A208003002",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "2",
// metername: "C1-04ACP1-3",
// meteraddress: "1",
// installtime: 1681363704,
// metercode: "320100A208003003",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "2",
// metername: "C1-04ACP1-4",
// meteraddress: "1",
// installtime: 1681363714,
// metercode: "320100A208003004",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "2",
// metername: "C1-04ACP1-5",
// meteraddress: "1",
// installtime: 1681363725,
// metercode: "320100A208003005",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "1",
// metername: "A-VZCP2-1",
// meteraddress: "6",
// installtime: 1681363608,
// metercode: "320100A208001001",
// meterstatus: "1",
// metermodel: "MODBUS_ZFY",
// },
// {
// gatwayId: "2",
// metername: "辅楼一层水表1",
// meteraddress: "1",
// installtime: 1681279847,
// metercode: "320100A208003006",
// meterstatus: "1",
// metermodel: "188_ZFY",
// },
// {
// gatwayId: "2",
// metername: "辅楼一层水表2",
// meteraddress: "1",
// installtime: 1681279855,
// metercode: "320100A208003007",
// meterstatus: "1",
// metermodel: "188_ZFY",
// },
// ];
// this.equipmentList = Object.keys(allDevicesInfo).map((item, index) => {
// return {
// name: allDevicesInfo[index].metername,
// code: allDevicesInfo[index].metercode,
// };
// });
// let realInfo = [
// {
// collectType: "1",
// idata: "1579.53",
// id: "320100A208001002",
// },
// {
// collectType: "1",
// idata: "669.48",
// id: "320100A208001003",
// },
// {
// collectType: "1",
// idata: "341.37",
// id: "320100A208001004",
// },
// ];
// let realData = [];
// for (let i = 0; i < this.equipmentList.length; i++) {
// realInfo.forEach((item, index) => {
// if (this.equipmentList[i].code == item.id) {
// realData.push({
// data: item.idata,
// name: this.equipmentList[i].name,
// value: "",
// });
// }
// });
// }
// console.log(this.equipmentList, "=================", realData);
//调用接口数据
let allDevicesCode = [];
getAllDevices().then((res) => {
@ -599,33 +908,29 @@ export default {
);
res.data.dataResults.forEach((item, index) => {
allDevicesCode.push(item.metercode);
});
getRealData({
metercodes: allDevicesCode,
}).then((response) => {
let resList = []
// console.log(allDevicesCode,response.data.dataResults, "实时设备数据ssssssssssss");
for (const key in response.data.dataResults) {
resList = response.data.dataResults[1]
}
console.log(response, "实时设备数据");
for (let i = 0; i < this.equipmentList.length; i++) {
resList.forEach((is, k) => {
response.data.dataResults.forEach((is, k) => {
if (this.equipmentList[i].code == is.id) {
this.equipmentList2.push({
data: parseInt(is.idata),
this.equipmentList.push({
data: item.idata,
name: this.equipmentList[i].name,
value: "",
});
}
});
}
//分页
for (let i = 0; i < this.equipmentList2.length; i += 8) {
this.equipmentList1.push(this.equipmentList2.slice(i, i + 8));
}
});
});
console.log(this.equipmentList, "设备用能统计");
//分页
for (let i = 0; i < this.equipmentList.length; i += 8) {
this.equipmentList1.push(this.equipmentList.slice(i, i + 8));
}
});
},
//预警点击
changeWarn(index) {
@ -725,12 +1030,22 @@ export default {
});
},
calculateEcharts(val) {
// console.log(val,'=================s');
let imgSrc = "/img/car.png";
let chartData = [];
let chartData = [
{
value: 42,
name: "主楼",
},
{
value: 24,
name: "辅楼",
},
];
chartData = Object.keys(val).map((item,index)=>{
return {value:val[item].val,name:val[item].buildName}
})
let colorList = ["red", "rgb(255,122,0)","rgb(3, 255, 150)","rgb(0,215,245)"];
let colorList = ["red", "rgb(255,122,0)"];
let sum = chartData.reduce((per, cur) => per + cur.value, 0);
let gap = (1 * sum) / 100;
let pieData1 = [];
@ -751,6 +1066,7 @@ export default {
},
});
pieData1.push(gapData);
// 第二圈数据
pieData2.push({
...chartData[i],
@ -927,8 +1243,8 @@ export default {
val.forEach((item,index) => {
dataX.push(item.dateDetail)
tqData.push(item.tqVal)
bqData.push(item.hqVal)
tbData.push(item.val)
bqData.push(item.val)
tbData.push(item.tqVal)
});
var myChart = this.$echarts.init(
document.getElementById("calculateEchartsTwo")
@ -939,9 +1255,8 @@ export default {
grid: { containLabel: true, top: 30, right: 15, bottom: 0, left: 15 },
legend: {
show: true,
// data: ["同期", "本期", "同比"],
data: ["同期", "环期", "用量数值"],
textStyle: { fontSize: "0.7rem", color: "#ffffff" },
data: ["同期", "本期", "同比"],
textStyle: { fontSize: "0.9rem", color: "#ffffff" },
},
tooltip: {
trigger: "axis",
@ -958,7 +1273,7 @@ export default {
show: false,
},
axisLabel: {
// interval: 0,
interval: 0,
show: true,
fontSize: "0.9rem",
color: "#ffffff",
@ -967,7 +1282,6 @@ export default {
},
yAxis: [
{
name:'单位kWh',
axisLine: { show: false },
axisTick: { show: false },
axisLabel: {
@ -975,15 +1289,11 @@ export default {
fontSize: "0.9rem",
color: "#ffffff",
fontFamily: "SourceHanSansCN-Normal, SourceHanSansCN",
formatter: "{value}",
formatter: "{value}%",
},
splitLine: { show: false },
},
{
name:'比率',
textStyle:{
color:'#fff'
},
axisLine: { show: false },
axisTick: { show: false },
axisLabel: {
@ -991,7 +1301,7 @@ export default {
fontSize: "0.9rem",
color: "#ffffff",
fontFamily: "SourceHanSansCN-Normal, SourceHanSansCN",
formatter: "{value}",
formatter: "{value} %",
},
splitLine: { show: false },
},
@ -1016,7 +1326,7 @@ export default {
data: tqData,
},
{
name: "环期",
name: "本期",
type: "bar",
barWidth: "25%",
showBackground: true,
@ -1040,7 +1350,7 @@ export default {
data: bqData,
},
{
name: "用量数值",
name: "同比",
type: "line",
yAxisIndex: 1,
itemStyle: {
@ -1366,7 +1676,7 @@ export default {
background: url("../assets/images/jieNengImg/energyBack.png") no-repeat;
background-size: 100% 100%;
color: #fff;
font-size: 1rem;
font-size: 1.3rem;
font-weight: 500;
display: flex;
flex-direction: column;

408
src/views/index.vue
View File

@ -30,7 +30,7 @@
v-for="(item, index) in wisdomMonArr"
:key="index"
>
<div style="width: 100%; font-size: 0.6rem">
<div style="width: 100%;font-size: 0.6rem;">
<span>{{ item.name }}:</span>
<span style="color: rgb(225, 177, 25); margin-left: 5%">{{
item.count
@ -79,7 +79,7 @@
flex-direction: column;
align-items: flex-start;
margin-left: 3%;
width: 100%;
width:100%
"
>
<span>报警时间:{{ item.time }}</span>
@ -88,11 +88,12 @@
display: flex;
justify-content: space-between;
margin-top: 2%;
width: 100%;
width:100%
"
>
<span style="text-align: left">报警原因:{{ item.cause }}</span>
<span style="margin-right: 5%">风险等级:{{ item.risk }}</span>
<span>报警原因:{{ item.cause }}</span>
<span style="margin-right:5%">风险等级:{{ item.risk }}</span
>
</div>
</div>
</div>
@ -210,56 +211,32 @@
@click="changeCamera(item.video)"
>
<!-- <img :src="item.icon" style="width: 100%; height: 100%" /> -->
<!-- <iframe
:src="item.video"
<iframe
:src="item.video+'video.mp4'"
ref="iframeRef"
frameborder="0"
style="width: 100%; height: 100%"
></iframe> -->
<camera
style="width: 100%; height: 100%"
:videoUrl="item.video"
:id="index"
/>
></iframe>
</div>
</div>
</div>
</div>
<div class="camersBig" v-if="cameraBigShow">
<div class="camersBig" v-show="cameraBigShow">
<!-- <img :src="cameraBig" style="width:100%;height:100%"/> -->
<!-- <iframe
<iframe
:src="cameraBig"
ref="iframeRef"
frameborder="0"
style="width: 100%; height: 100%"
></iframe> -->
<cameraBig
style="width: 100%; height: 100%"
:cameraBig="cameraBigUrl"
ref="camersBig"
/>
></iframe>
<div class="close" @click="closeCamer"></div>
<div class="remoteControl">
<img
src="../assets/images/add.png"
style="width: 20%; height: 24%; cursor: pointer; z-index: 99"
@click="addZoom"
/>
<img
src="../assets/images/reduce.png"
style="width: 20%; height: 24%; cursor: pointer; z-index: 99"
@click="reduceZoom"
/>
<img src="../assets/images/add.png" style="width:20%;height:24%;cursor: pointer;z-index: 99"/>
<img src="../assets/images/reduce.png" style="width:20%;height:24%;cursor: pointer;z-index: 99"/>
</div>
<div class="remoteControl1">
<img
src="../assets/images/leftBtn.png"
style="width: 20%; height: 24%; cursor: pointer"
/>
<img
src="../assets/images/rightBtn.png"
style="width: 20%; height: 24%; cursor: pointer"
/>
<img src="../assets/images/leftBtn.png" style="width:20%;height:24%;cursor: pointer;"/>
<img src="../assets/images/rightBtn.png" style="width:20%;height:24%;cursor: pointer;"/>
</div>
</div>
</div>
@ -273,9 +250,6 @@ import {
getBuildinginfos,
getAreaList,
} from "../api/index";
import { getHikvision } from "../api/haikang";
import camera from "./camera/camera.vue";
import cameraBig from "./camera/cameraBig.vue";
export default {
data() {
return {
@ -374,39 +348,22 @@ export default {
value: "1",
},
],
cameraList: [
{
video: "",
},
{
video: "",
},
{
video: "",
},
{
video: "",
},
], //摄像
cameraBigUrl: "",
cameraList: [], //摄像
cameraBig: "",
cameraBigShow: false,
buildingList: [],
alarmAllLevel:[],
alarmFirstLevel:[],
alarmSecondLevel:[],
alarmThirdLevel:[],
camersCode: "",
};
},
mounted() {
this.getCamera();
//获取建筑id
this.getBuildingData();
let that = this;
window.alarmFirstLevel = this.alarmFirstLevel;
window.alarmSecondLevel = this.alarmSecondLevel;
window.alarmThirdLevel = this.alarmThirdLevel;
window.alarmAllLevel = this.alarmAllLevel;
window.alarmFirstLevel = this.alarmFirstLevel
window.alarmSecondLevel= this.alarmSecondLevel
window.alarmThirdLevel= this.alarmThirdLevel
window.alarmAllLevel= this.alarmAllLevel
this.warningOne();
this.warningTwo();
this.maintenanceLeft();
@ -414,60 +371,36 @@ export default {
// this.energyEcharts();
this.selectDataList(this.selectDate);
// window.createMqtt = this.createMqtt();
// window.addEventListener("message", function (e) {
// let val = e.data.val;
// if (val != null) {
// that.changeCamera("video/video.html?src=" + e.data.val);
// that.camersCode = e.data.code
// }
// });
// let camera = [
// {
// icon: require("../assets/images/camera.png"),
// video: "video/video.html?src=",
// },
// {
// icon: require("../assets/images/camera.png"),
// video: "video/video.html?src=",
// },
// {
// icon: require("../assets/images/camera.png"),
// video: "video/video.html?src=",
// },
// {
// icon: require("../assets/images/camera.png"),
// video: "video/video.html?src=",
// },
// ];
// setTimeout(() => {
// this.cameraList = camera;
// }, 1000);
this.warnSelect(0);
},
watch: {
alarmAllLevel(val) {
// 为了避免频繁触发resize函数导致页面卡顿，使用定时器
console.log("alarmAllLevel", val);
this.upmqttData(val);
},
alarmFirstLevel(val) {
// 为了避免频繁触发resize函数导致页面卡顿，使用定时器
console.log("alarmFirstLevel", val);
if (val.length != 0) {
this.upmqttData(val);
window.addEventListener("message", function (e) {
let val = e.data.val;
if (val != null) {
that.changeCamera("video/video.html?src=" + e.data.val);
}
});
let camera = [
{
icon: require("../assets/images/camera.png"),
video: "video/video.html?src=",
},
alarmSecondLevel(val) {
// 为了避免频繁触发resize函数导致页面卡顿，使用定时器
console.log("alarmSecondLevel", val);
this.upmqttData(val);
{
icon: require("../assets/images/camera.png"),
video: "video/video.html?src=",
},
alarmThirdLevel(val) {
// 为了避免频繁触发resize函数导致页面卡顿，使用定时器
console.log("alarmThirdLevel", val);
this.upmqttData(val);
{
icon: require("../assets/images/camera.png"),
video: "video/video.html?src=",
},
{
icon: require("../assets/images/camera.png"),
video: "video/video.html?src=",
},
];
setTimeout(() => {
this.cameraList = camera;
}, 1000);
this.warnSelect(0);
//获取建筑id
this.getBuildingData();
},
watch: {
alarmAllLevel(val) {
@ -497,131 +430,126 @@ export default {
},
},
methods: {
//放大变焦
addZoom() {
console.log(this.camersCode, "sssssssssssss");
let dataList = {
path: "/artemis/api/video/v1/ptzs/controlling",
data: {
cameraIndexCode: this.camersCode,
action: "0",
command: "ZOOM_IN",
speed: "50",
},
};
getHikvision(dataList).then((res) => {
console.log(res, "=============");
});
},
//缩小变焦
reduceZoom() {
console.log(this.camersCode, "sssssssssssss");
let dataList = {
path: "/artemis/api/video/v1/ptzs/controlling",
data: {
cameraIndexCode: this.camersCode,
action: "0",
command: "ZOOM_OUT",
speed: "50",
},
};
getHikvision(dataList).then((res) => {
console.log(res, "=============");
});
},
//获取视频流
getCamera() {
this.cameraList[0].video =
"https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8";
this.cameraList[1].video =
"https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8";
this.cameraList[2].video =
"http://playertest.longtailvideo.com/adaptive/bipbop/gear4/prog_index.m3u8";
this.cameraList[3].video =
"http://playertest.longtailvideo.com/adaptive/bipbop/gear4/prog_index.m3u8";
let pathUrl = "/artemis/api/video/v2/cameras/previewURLs";
let dataList = {
path: pathUrl,
data: {
protocol: "hls",
cameraIndexCode: "620804559ecf4ade8f13b17337ea8bfa",
},
};
getHikvision(dataList).then((res) => {
this.cameraList[0].video =
"video/video.html?src=" +
res.data.result.data.url +
"&code=" +
dataList.data.cameraIndexCode;
});
let dataList1 = {
path: pathUrl,
data: {
protocol: "hls",
cameraIndexCode: "3efe8f887f164548a5db4266590a05ca",
},
};
getHikvision(dataList1).then((res) => {
this.cameraList[1].video =
"video/video.html?src=" +
res.data.result.data.url +
"&code=" +
dataList1.data.cameraIndexCode;
});
let dataList2 = {
path: pathUrl,
data: {
protocol: "hls",
cameraIndexCode: "f103ede0eb2b470f84e26ceec42486bc",
},
};
getHikvision(dataList2).then((res) => {
this.cameraList[2].video =
"video/video.html?src=" +
res.data.result.data.url +
"&code=" +
dataList2.data.cameraIndexCode;
});
let dataList3 = {
path: pathUrl,
data: {
protocol: "hls",
cameraIndexCode: "bf16be84f6f8410c8dca2dfc5369a532",
},
};
getHikvision(dataList3).then((res) => {
this.cameraList[3].video =
"video/video.html?src=" +
res.data.result.data.url +
"&code=" +
dataList3.data.cameraIndexCode;
});
},
//获取建筑Id
getBuildingData() {
getBuildinginfos().then((res) => {
// getBuildinginfos().then((res) => {
//接口取值
this.buildingList = res.data.dataResults;
let buildArr = [];
// this.options =
Object.keys(this.buildingList).map((item, index) => {
if (this.buildingList[index].name.indexOf("水") == -1) {
buildArr[buildArr.length] = this.buildingList[index];
}
// return {
// label: buildNameList,
// value: this.buildingList[index].id,
// parentId: this.buildingList[index].parentId,
// };
});
this.options = Object.keys(buildArr).map((item, index) => {
// this.buildingList = res.data.dataResults
this.buildingList = [
{
name: "江北新区法院",
id: "79",
parentId: "-1",
},
{
name: "辅楼一层水表1",
id: "104",
parentId: "79",
},
{
name: "辅楼一层水表2",
id: "105",
parentId: "79",
},
{
name: "主楼用电",
id: "106",
parentId: "79",
},
{
name: "辅楼用电",
id: "107",
parentId: "79",
},
{
name: "A-FACP1-1",
id: "108",
parentId: "106",
},
{
name: "A-FACP1-2",
id: "109",
parentId: "106",
},
{
name: "A-FACP1-3",
id: "110",
parentId: "106",
},
{
name: "A-FACP1-4",
id: "111",
parentId: "106",
},
{
name: "A-FACP1-5",
id: "112",
parentId: "106",
},
{
name: "A-FACP2-1",
id: "113",
parentId: "106",
},
{
name: "A-FACP2-2",
id: "114",
parentId: "106",
},
{
name: "A-FACP2-3",
id: "116",
parentId: "106",
},
{
name: "A-FACP2-4",
id: "117",
parentId: "106",
},
{
name: "A-FACP2-5",
id: "118",
parentId: "106",
},
{
name: "A-FACP2-6",
id: "119",
parentId: "106",
},
{
name: "C1-04ACP1-1",
id: "120",
parentId: "107",
},
{
name: "C1-04ACP1-2",
id: "121",
parentId: "107",
},
{
name: "C1-04ACP1-3",
id: "122",
parentId: "107",
},
{
name: "C1-04ACP1-4",
id: "123",
parentId: "107",
},
{
name: "C1-04ACP1-5",
id: "124",
parentId: "107",
},
];
this.options = Object.keys(this.buildingList).map((item, index) => {
return {
label: buildArr[index].name,
label: this.buildingList[index].name,
value: this.buildingList[index].id,
parentId: this.buildingList[index].parentId,
};
});
});
// });
},
//智慧节能选择时间
selectDataList(val) {
@ -666,18 +594,16 @@ export default {
};
//接口获取区域
getAreaList(data).then((res) => {
console.log(res.data.data, "sssssssssssssss");
this.energyEcharts(res.data.data);
});
},
//选中图片
changeCamera(path) {
this.cameraBigUrl = path;
this.cameraBig = path;
this.cameraBigShow = true;
},
closeCamer() {
this.cameraBigShow = false;
this.$refs.camersBig.closeVideo();
},
//报警选中
warnSelect(index) {
@ -737,7 +663,7 @@ export default {
//获取mqtt数据
upmqttData(val) {
let icon = null;
var warnListMqtt = [];
var warnListMqtt = []
warnListMqtt = Object.keys(val).map((item, index) => {
if (val[index].AlarmLevel == 1) {
val[index].AlarmLevel = "一级";
@ -760,7 +686,7 @@ export default {
risk: val[index].AlarmLevel,
};
});
console.log("warnListMqtt", warnListMqtt);
console.log("warnListMqtt",warnListMqtt)
for (let i = 0; i < warnListMqtt.length; i++) {
this.warnList.splice(0,0,warnListMqtt[i]);
}
@ -1448,10 +1374,7 @@ export default {
}
},
},
components: {
camera,
cameraBig,
},
components: {},
};
</script>
@ -1623,8 +1546,9 @@ export default {
background: url(../assets/images/warnDottedLine.png) no-repeat;
background-size: 100% 100%;
overflow: auto;
.warnListContent {
height: 27%;
height: 25%;
width: 100%;
border: 1px dashed #fff;
color: #fff;

204
src/views/security.vue
View File

@ -56,6 +56,7 @@
</el-carousel-item>
</el-carousel>
<!-- </div> -->
</div>
<div class="leftTwo">
<div class="title" style="height: 8%">预警视频监控联动</div>
@ -159,15 +160,8 @@
width: 100%;
justify-content: flex-start;
"
><span style="white-space: nowrap">设备内容:</span
><span
style="
color: rgb(0, 255, 255);
margin-left: 5%;
display: flex;
justify-content: flex-end;
text-align: left;
"
>设备内容:<span
style="color: rgb(0, 255, 255); margin-left: 5%"
>{{ item.position }}</span
></span
>
@ -193,16 +187,14 @@
<script>
import { GetLevelAlarm , getSecurityAlarmCount} from "../api/index";
import { getHikvision } from "../api/haikang";
export default {
name: "security",
data() {
return {
securityList: [
{
tit: "摄像头监管",
security: [
{
tit:'摄像头监管',
security:[{
name: "",
count: "",
},
@ -226,12 +218,11 @@ export default {
name: "摄像头昨日报警数",
count: "0",
},
],
]
},
{
tit: "门禁监管",
security: [
{
tit:'门禁监管',
security:[{
name: "",
count: "",
},
@ -255,9 +246,8 @@ export default {
name: "门禁昨日报警数",
count: "0",
},
],
},
]
}
],
warnCameraList: [
@ -342,37 +332,15 @@ export default {
};
},
mounted() {
this.getAnfang();
//获取消防告警
this.getPoliceList();
this.getFireWarnList();
this.getFireWarnList()
// 获取安防告警
this.getPoliceList()
//获取安防统计今天昨天报警数量
this.getAlarmCount();
window.alarmFirstLevel = this.alarmFirstLevel;
window.alarmSecondLevel = this.alarmSecondLevel;
window.alarmThirdLevel = this.alarmThirdLevel;
},
watch: {
alarmFirstLevel(val) {
// 为了避免频繁触发resize函数导致页面卡顿，使用定时器
console.log("alarmFirstLevel", val);
if (val.length != 0) {
this.upmqttData(val);
}
},
alarmSecondLevel(val) {
// 为了避免频繁触发resize函数导致页面卡顿，使用定时器
console.log("alarmSecondLevel", val);
this.upmqttData(val);
},
alarmThirdLevel(val) {
// 为了避免频繁触发resize函数导致页面卡顿，使用定时器
console.log("alarmThirdLevel", val);
this.upmqttData(val);
},
this.getAlarmCount()
window.alarmFirstLevel = this.alarmFirstLevel
window.alarmSecondLevel= this.alarmSecondLevel
window.alarmThirdLevel= this.alarmThirdLevel
},
watch: {
alarmFirstLevel(val) {
@ -399,90 +367,9 @@ export default {
//获取昨天今天的报警数量
getAlarmCount(){
getSecurityAlarmCount().then((res)=>{
this.securityList[0].security[4].count = res.data.data.VideoTodayCount;
this.securityList[0].security[5].count =
res.data.data.VideoYesterdayCount;
this.securityList[1].security[4].count = res.data.data.DoorTodayCount;
this.securityList[1].security[5].count =
res.data.data.DoorYesterdayCount;
});
},
//获取设备离线在线数据
getAnfang() {
var indexcode = [
"13222435-8646-4006-982a-76febb4dd8a2",
"fd91efcf-9d11-4b3e-ad69-6e6c1069f4ec",
"e3043e94-c8d9-49b2-9627-7a10f15cf079",
"f5790df0-60e9-4a1f-be2f-e75d6331467d",
"05859fa6-6440-401e-950f-37ba61094c4d",
"21ff542a-ca97-4974-88e7-d52408b8a412",
"608d4d1d-a69a-4d07-82da-553914616b1d",
"5b5b43cd-a722-4eb4-b3f2-3b60fd1357ad",
"f524c8df-42f9-4f89-8594-cad8e3cdb37f",
"71ced52a-f04e-4d74-834c-8e329485106b",
"8763ebb7-4bc6-4022-80df-a38804f58d39",
"f349ab39-aa64-4e4f-ae85-585f30321325",
"8ca45d1f-5919-47df-be93-8c6c4efb81a4",
"1223f3b3-3fa3-4df2-b03a-058fcb62b4c9",
"1fc85a1e-1084-4cc2-91a4-ec2b5e74c5a2",
"b7bb3c6c-ceeb-4fc9-a37e-c7d075fd4ede",
"beac672d-7555-49fc-bc97-d873fcc8eb48",
"5a9e819d-af8d-45ea-9a77-bd36a2168e20",
"17e8a2a0-079b-4e70-bde6-24911980e1b2",
"d16fe1ce-4251-4cfb-8316-9380196942e1",
"266a956e-cb4f-47f4-8ab8-ecbbb6f4a3f7",
"a2038008-e1db-4666-8902-c69af1d7cc50",
"9273528b-9fa9-4877-8eb0-1595e3accf83",
"be26abf3-c2dd-41d3-ace1-b8a2006d663c",
"46ba67a9-e4d0-48ab-b837-255bb963860a",
"fe6e6dab-4ec7-47c1-a286-8ff661f8b8f6",
];
let dataList = {
path: "/artemis/api/resource/v2/door/search",
data: {
regionIndexCodes: indexcode,
pageNo: 1,
pageSize: 1000,
},
};
let indexCodeList = [];
getHikvision(dataList).then((res) => {
console.log("getHikvision", res.data.result.data.list);
res.data.result.data.list.forEach((item, index) => {
indexCodeList.push(item.indexCode);
});
let doorStatusList = {
path: "/artemis/api/acs/v1/door/states",
data: {
doorIndexCodes: indexCodeList,
},
};
let doorTotal = 0;
let doorOnLine = 0;
let offLine = 0;
let doorTotalList = [];
let doorOnLineList = [];
let offLineList = [];
getHikvision(doorStatusList).then((res) => {
console.log(res.data.authDoorList, "门禁状态数量");
for (let i = 0; i < res.data.authDoorList.length; i++) {
//获取总数的数组
doorTotalList.push(res.data.authDoorList);
if (res.data.authDoorList[i].doorState == 3) {
//获取离线的数组
offLineList.push(res.data.authDoorList[i].doorState);
}
}
//门禁总数数量
doorTotal = doorTotalList.length;
//门禁离线数数量
offLine = offLineList.length;
//门禁在线数数量
doorOnLine = doorTotal - offLine;
console.log(doorTotal, offLine, doorOnLine, "门禁数量==========");
});
});
this.securityList[0].security[4].count = res.data.data.TodayCount
this.securityList[0].security[5].count = res.data.data.YesterdayCount
})
},
videoChange(index) {
this.warnCameraList.forEach((item, i) => {
@ -492,34 +379,30 @@ export default {
index
].icon = require("../assets/images/anFang/videoAc.png");
},
//获取火灾报警、
getFireWarnList(){
let params = {
AlarmLevel: "",
DeviceTypes: "消防",
};
DeviceTypes:'消防'
}
GetLevelAlarm(params).then((res) => {
let icon = null;
let icon = null
this.fireWarnList = Object.keys(res.data.data).map((item, index) => {
if (res.data.data[index].Status == 0) {
res.data.data[index].Status = "未处理";
icon = require("../assets/images/jieNengImg/warnWhite.png");
icon = require("../assets/images/jieNengImg/warnWhite.png")
}else{
res.data.data[index].Status = "已处理";
icon = require("../assets/images/jieNengImg/warnBlue.png");
icon = require("../assets/images/jieNengImg/warnBlue.png")
}
return {
icon: icon,
time: this.$moment(res.data.data[index].AlarmTime).format(
"YYYY-MM-DD HH:mm:ss"
),
time: this.$moment(res.data.data[index].AlarmTime).format("YYYY-MM-DD HH:mm:ss"),
DeviceType: res.data.data[index].DeviceType,
// position: res.data.data[index].DeviceType,
position: res.data.data[index].AlarmName,
// status: res.data.data[index].AlarmLevel,
status: res.data.data[index].Status,
AlarmLevel: res.data.data[index].AlarmLevel,
};
});
});
@ -528,43 +411,40 @@ export default {
getPoliceList(){
let params = {
AlarmLevel: "",
DeviceTypes: "门禁,视频监控",
};
DeviceTypes:'门禁,视频监控'
}
GetLevelAlarm(params).then((res) => {
let icon = null;
let icon = null
this.policeList = Object.keys(res.data.data).map((item, index) => {
if (res.data.data[index].Status == 0) {
res.data.data[index].Status = "未处理";
icon = require("../assets/images/jieNengImg/warnWhite.png");
icon = require("../assets/images/jieNengImg/warnWhite.png")
}else{
res.data.data[index].Status = "已处理";
icon = require("../assets/images/jieNengImg/warnBlue.png");
icon = require("../assets/images/jieNengImg/warnBlue.png")
}
return {
icon: icon,
time: this.$moment(res.data.data[index].AlarmTime).format(
"YYYY-MM-DD HH:mm:ss"
),
time: this.$moment(res.data.data[index].AlarmTime).format("YYYY-MM-DD HH:mm:ss"),
DeviceType: res.data.data[index].DeviceType,
position: res.data.data[index].AlarmName,
// status: res.data.data[index].AlarmLevel,
status: res.data.data[index].Status,
AlarmLevel: res.data.data[index].AlarmLevel,
};
});
});
},
//获取mqtt数据
upmqttData(val) {
let icon = null;
var warnListMqtt = [];
let icon = null
var warnListMqtt = []
warnListMqtt = Object.keys(val).map((item, index) => {
if (val[index].Status == 0) {
val[index].Status = "未处理";
icon = require("../assets/images/jieNengImg/warnWhite.png");
icon = require("../assets/images/jieNengImg/warnWhite.png")
}else{
val[index].Status = "已处理";
icon = require("../assets/images/jieNengImg/warnBlue.png");
icon = require("../assets/images/jieNengImg/warnBlue.png")
}
if (val[index].AlarmLevel == 1) {
val[index].AlarmLevel = "一级";
@ -575,22 +455,19 @@ export default {
}
return {
icon: icon,
time: this.$moment(val[index].AlarmTime).format(
"YYYY-MM-DD HH:mm:ss"
),
time: this.$moment(val[index].AlarmTime).format("YYYY-MM-DD HH:mm:ss"),
position: val[index].AlarmName,
DeviceType: val[index].DeviceType,
status: val[index].Status,
AlarmLevel: val[index].AlarmLevel,
};
});
console.log("warnListMqtt", warnListMqtt);
console.log("warnListMqtt",warnListMqtt)
for (let i = 0; i < warnListMqtt.length; i++) {
if (warnListMqtt[i].AlarmLevel == "三级") {
if(warnListMqtt[i].AlarmLevel=='三级'){
this.policeList.splice(0,0,warnListMqtt[i]);
this.getAlarmCount();
this.getAlarmCount()
}
if (warnListMqtt[i].DeviceType == "消防") {
if(warnListMqtt[i].DeviceType=='消防'){
this.fireWarnList.splice(0,0,warnListMqtt[i]);
}
}
@ -774,7 +651,6 @@ export default {
padding-right: 20%;
box-sizing: border-box;
color: #fff;
font-size: 0.7rem;
}
}
::-webkit-scrollbar {

4
vue.config.js
View File

@ -16,7 +16,6 @@ module.exports = {
proxy: {
'/api': { //代理的名字
target:'http://172.16.1.253:12308/api/',
// target:'http://138.227.208.100:12308/api/',
ws: true,
changeOrigin: true,
pathRewrite:{
@ -32,8 +31,7 @@ module.exports = {
}
},
'/video': { //代理的名字
// target:'http://172.16.1.253:12308/api/',
target:'http://138.227.208.100:12307/',
target:'http://172.16.1.253:12308/api/',
ws: true,
changeOrigin: true,
pathRewrite:{