代码提交

This commit is contained in:
lixiaobang 2023-04-19 17:49:41 +08:00
parent 790b7d84ce
commit 8c38a2c9da
3 changed files with 241 additions and 199 deletions

View File

@ -12,4 +12,16 @@ export const GetLevelAlarm = (params) => {
return axios.get('api/GetLevelAlarm', {
params
})
};
//获取昨天、今天报警数量
export const getSecurityAlarmCount = (params) => {
return axios.get('api/GetSecurityAlarmCount', {
params
})
};
//获取报警统计接口
export const getAlarmStatistics = (params) => {
return axios.get('api/GetAlarmStatistics', {
params
})
};

View File

@ -242,7 +242,7 @@
</template>
<script>
import { GetLevelAlarm } from "../api/index";
import { GetLevelAlarm, getAlarmStatistics } from "../api/index";
export default {
data() {
return {
@ -377,7 +377,7 @@ export default {
setTimeout(() => {
this.cameraList = camera;
}, 1000);
this.warnSelect(0)
this.warnSelect(0);
},
methods: {
//
@ -444,67 +444,51 @@ export default {
},
//
warningOne() {
var myChart = this.$echarts.init(document.getElementById("warningOne"));
let option = {
legend: {
show: true,
align: "left",
x: "45%",
orient: "vertical",
textStyle: {
color: "#fff",
fontSize: "0.4rem",
},
data: [
// {
// name: "",
// icon: "",
// },
{
name: "消防报警",
},
],
},
tooltip: {
show: true,
},
grid: {
left: "13%",
right: "4%",
bottom: "15%",
top: "17%",
},
xAxis: {
data: ["温感", "烟感", "手动报警"],
axisLine: {
let data = [];
let dataX = []
getAlarmStatistics({
Type: "消防",
}).then((res) => {
res.data.data.forEach((item, index) => {
data.push(item.Count);
dataX.push(item.Name)
});
var myChart = this.$echarts.init(document.getElementById("warningOne"));
let option = {
legend: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.3)",
},
},
axisTick: {
show: false,
},
axisLabel: {
color: "#fff",
fontSize: "0.4rem",
// rotate: "45"
},
},
yAxis: [
{
type: "value",
name: "/次",
minInterval: 1,
nameTextStyle: {
align: "left",
x: "45%",
orient: "vertical",
textStyle: {
color: "#fff",
fontSize: "0.4rem",
},
// scale: true,
data: [
// {
// name: "",
// icon: "",
// },
{
name: "消防报警",
},
],
},
tooltip: {
show: true,
},
grid: {
left: "13%",
right: "4%",
bottom: "15%",
top: "17%",
},
xAxis: {
data: dataX,
axisLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.4)",
color: "rgba(66, 164, 255,0.3)",
},
},
axisTick: {
@ -513,119 +497,129 @@ export default {
axisLabel: {
color: "#fff",
fontSize: "0.4rem",
},
splitLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.5)",
},
// rotate: "45"
},
},
],
series: [
{
name: "消防报警",
type: "bar",
barWidth: 20,
zlevel: 2,
itemStyle: {
normal: {
color: this.$echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: "#01B1FF",
},
{
offset: 1,
color: "#033BFF",
},
],
false
),
},
},
label: {
normal: {
show: true,
fontSize: "0.4rem",
yAxis: [
{
type: "value",
name: "/次",
minInterval: 1,
nameTextStyle: {
color: "#fff",
position: "inside",
fontSize: "0.4rem",
},
// scale: true,
axisLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.4)",
},
},
axisTick: {
show: false,
},
axisLabel: {
color: "#fff",
fontSize: "0.4rem",
},
splitLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.5)",
},
},
},
data: [90, 94, 98],
},
],
};
myChart.setOption(option);
],
series: [
{
name: "消防报警",
type: "bar",
barWidth: 20,
zlevel: 2,
itemStyle: {
normal: {
color: this.$echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: "#01B1FF",
},
{
offset: 1,
color: "#033BFF",
},
],
false
),
},
},
label: {
normal: {
show: true,
fontSize: "0.4rem",
color: "#fff",
position: "inside",
},
},
data: data,
},
],
};
myChart.setOption(option);
});
},
//
warningTwo() {
var myChart = this.$echarts.init(document.getElementById("warningTwo"));
let option = {
legend: {
show: true,
align: "left",
x: "45%",
orient: "vertical",
textStyle: {
color: "#fff",
fontSize: "0.4rem",
},
data: [
// {
// name: "",
// icon: "",
// },
{
name: "设备报警",
},
],
},
tooltip: {
show: true,
},
grid: {
left: "13%",
right: "4%",
bottom: "15%",
top: "17%",
},
xAxis: {
data: ["空调", "照明", "电梯", "太阳灯"],
axisLine: {
let data = [];
let dataX = []
getAlarmStatistics({
Type: "设备",
}).then((res) => {
res.data.data.forEach((item, index) => {
data.push(item.Count);
dataX.push(item.Name)
});
var myChart = this.$echarts.init(document.getElementById("warningTwo"));
let option = {
legend: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.3)",
},
},
axisTick: {
show: false,
},
axisLabel: {
color: "#fff",
fontSize: "0.4rem",
// rotate: "45"
},
},
yAxis: [
{
type: "value",
name: "/次",
minInterval: 1,
nameTextStyle: {
align: "left",
x: "45%",
orient: "vertical",
textStyle: {
color: "#fff",
fontSize: "0.4rem",
},
// scale: true,
data: [
// {
// name: "",
// icon: "",
// },
{
name: "设备报警",
},
],
},
tooltip: {
show: true,
},
grid: {
left: "13%",
right: "4%",
bottom: "15%",
top: "17%",
},
xAxis: {
data: dataX,
axisLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.4)",
color: "rgba(66, 164, 255,0.3)",
},
},
axisTick: {
@ -634,55 +628,81 @@ export default {
axisLabel: {
color: "#fff",
fontSize: "0.4rem",
},
splitLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.5)",
},
// rotate: "45"
},
},
],
series: [
{
name: "设备报警",
type: "bar",
barWidth: 20,
zlevel: 2,
itemStyle: {
normal: {
color: this.$echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: "#01B1FF",
},
{
offset: 1,
color: "#033BFF",
},
],
false
),
},
},
label: {
normal: {
show: true,
fontSize: "0.4rem",
yAxis: [
{
type: "value",
name: "/次",
minInterval: 1,
nameTextStyle: {
color: "#fff",
position: "inside",
fontSize: "0.4rem",
},
// scale: true,
axisLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.4)",
},
},
axisTick: {
show: false,
},
axisLabel: {
color: "#fff",
fontSize: "0.4rem",
},
splitLine: {
show: true,
lineStyle: {
color: "rgba(66, 164, 255,0.5)",
},
},
},
data: [90, 100, 98, 97],
},
],
};
myChart.setOption(option);
],
series: [
{
name: "设备报警",
type: "bar",
barWidth: 20,
zlevel: 2,
itemStyle: {
normal: {
color: this.$echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: "#01B1FF",
},
{
offset: 1,
color: "#033BFF",
},
],
false
),
},
},
label: {
normal: {
show: true,
fontSize: "0.4rem",
color: "#fff",
position: "inside",
},
},
data: data,
},
],
};
myChart.setOption(option);
});
},
maintenanceLeft() {
var myChart = this.$echarts.init(

View File

@ -147,7 +147,7 @@
</template>
<script>
import { GetLevelAlarm } from "../api/index";
import { GetLevelAlarm , getSecurityAlarmCount} from "../api/index";
export default {
name: "security",
data() {
@ -261,8 +261,17 @@ export default {
this.getFireWarnList()
//
this.getPoliceList()
//
this.getAlarmCount()
},
methods: {
//
getAlarmCount(){
getSecurityAlarmCount().then((res)=>{
this.securityList[4].count = res.data.data.TodayCount
this.securityList[5].count = res.data.data.YesterdayCount
})
},
videoChange(index) {
this.warnCameraList.forEach((item, i) => {
item.icon = require("../assets/images/anFang/video.png");
@ -321,6 +330,7 @@ export default {
});
});
},
},
watch: {},
components: {},