update
This commit is contained in:
hzz
parent
efbb5c1d0c
commit
dfbd2b6fb8
19
src/api/screen/R_D_Environment.js
Normal file
19
src/api/screen/R_D_Environment.js
Normal file
@ -0,0 +1,19 @@
|
||||
import request from '@/utils/request'
|
||||
//big/getScreen
|
||||
|
||||
// 查询办公室噪声数据
|
||||
export function getNoiseData(query) {
|
||||
return request({
|
||||
url: '/screen/goaSensor/getNoiseData',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
// 查询公区传感器数据
|
||||
export function getTopData(query) {
|
||||
return request({
|
||||
url: '/screen/goaSensor/getTopData?depts=100',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
@ -32,6 +32,8 @@ export function findChildren (object3D: Object3D, callback: (obj: Object3D) => b
|
||||
|
||||
export function checkNameIncludes (obj: Object3D, str: string): boolean {
|
||||
if (obj.name.includes(str)) {
|
||||
console.log(obj.name);
|
||||
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
|
||||
@ -45,9 +45,11 @@ defineExpose({
|
||||
.popover {
|
||||
position: absolute;
|
||||
background-color: rgb(29 78 216 / 0.6);
|
||||
/* background-image: url('/src/assets/images/preview-bottom.png'); */
|
||||
border-radius: 5px;
|
||||
font-size: 0.2rem;
|
||||
color: #fff;
|
||||
font-size: 30px;
|
||||
}
|
||||
.popover-title {
|
||||
padding: 12px;
|
||||
|
||||
@ -136,13 +136,12 @@ const initModel = () => {
|
||||
|
||||
const rackList: any[] = [];
|
||||
baseModel.traverse(item => {
|
||||
console.log(item, 'item');
|
||||
|
||||
if (checkIsRack(item)) {
|
||||
rackList.push(item);
|
||||
}
|
||||
});
|
||||
console.log(baseModel,rackList, 'rackList------111');
|
||||
// console.log(baseModel,rackList, 'rackList------111');
|
||||
|
||||
viewer.setRaycasterObjects(rackList);
|
||||
|
||||
@ -239,7 +238,7 @@ const onMouseClick = (intersects: THREE.Intersection[]) => {
|
||||
};
|
||||
|
||||
function checkIsRack(obj: any): boolean {
|
||||
return checkNameIncludes(obj, 'rack');
|
||||
return checkNameIncludes(obj, 'Door');
|
||||
}
|
||||
|
||||
const onMouseMove = (intersects: THREE.Intersection[]) => {
|
||||
@ -253,7 +252,7 @@ const onMouseMove = (intersects: THREE.Intersection[]) => {
|
||||
|
||||
let selectedObjectName = '';
|
||||
const findClickModel = (object: any) => {
|
||||
if (object.name.includes('rack')) {
|
||||
if (object.name.includes('Door')) {
|
||||
selectedObjectName = object.name;
|
||||
return;
|
||||
}
|
||||
|
||||
@ -9,10 +9,15 @@ const prop = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
xData: ['办公室1', '办公室2', '办公室3', '办公室4', '办公室5', '办公室6'],
|
||||
seriesData: [80, 60, 60, 60, 60, 60]
|
||||
};
|
||||
return [
|
||||
{
|
||||
"devId": "48a2ec70-a60c-11ef-91f3-abd609c7e488",
|
||||
"devName": "噪声监测7",
|
||||
"label": "noise-7",
|
||||
"place": null,
|
||||
"data": 0,
|
||||
"status": 0
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
@ -23,12 +28,19 @@ const bodyMax = 150;
|
||||
|
||||
const options = computed(() => {
|
||||
|
||||
|
||||
let xData = []
|
||||
let seriesData = []
|
||||
prop.data.forEach((item) => {
|
||||
xData.push(item.devName);
|
||||
seriesData.push(item.data);
|
||||
});
|
||||
const labelSetting = {
|
||||
show: true,
|
||||
position: 'top',
|
||||
offset: [0, -20],
|
||||
formatter: function (param) {
|
||||
return prop.data.xData[param.dataIndex] + '\r\n' + prop.data.seriesData[param.dataIndex] + 'dB';
|
||||
return xData[param.dataIndex] + '\r\n' + seriesData[param.dataIndex] + 'dB';
|
||||
},
|
||||
fontSize: 14,
|
||||
fontFamily: 'Arial',
|
||||
@ -39,7 +51,7 @@ const options = computed(() => {
|
||||
},
|
||||
backgroundColor: 'transparent',
|
||||
xAxis: {
|
||||
data: prop.data.xData,
|
||||
data: xData,
|
||||
axisTick: { show: false },
|
||||
axisLine: { show: false },
|
||||
axisLabel: { show: false }
|
||||
@ -52,7 +64,9 @@ const options = computed(() => {
|
||||
},
|
||||
grid: {
|
||||
top: 'center',
|
||||
height: 230
|
||||
height: 230,
|
||||
left: 0,
|
||||
right: 0
|
||||
},
|
||||
markLine: {
|
||||
z: -100
|
||||
@ -68,7 +82,7 @@ const options = computed(() => {
|
||||
itemStyle: {
|
||||
color: '#33FFFF'
|
||||
},
|
||||
data: prop.data.seriesData.map((item) => {
|
||||
data: seriesData.map((item) => {
|
||||
return {
|
||||
value: item
|
||||
};
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = ref({
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = ref({
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
36
src/views/screen/R_D_Environment/component/svgPm10.vue
Normal file
36
src/views/screen/R_D_Environment/component/svgPm10.vue
Normal file
@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<svg t="1731979776030" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="15886" width="256" height="256" :fill="prop.color">
|
||||
<path
|
||||
d="M507.44 955.95a438.912 438.912 0 0 1-172.62-35.08c-52.91-22.48-100.5-54.63-141.43-95.57-40.94-40.94-73.09-88.52-95.57-141.44a439.09 439.09 0 0 1-35.08-172.62c0-74.45 21.05-153.39 59.26-222.31 4.25-6.88 12.99-11.86 20.85-11.86 1.58 0 4.56 0.24 6.67 1.82 8.49 6.37 13.39 19.42 6.91 30.23l-0.24 0.39-0.22 0.41c-34.67 65.01-52.25 132.75-52.25 201.32 0 222.62 181.11 403.73 403.73 403.73s403.73-181.11 403.73-403.73c0-222.61-181.11-403.73-403.73-403.73-68.57 0-136.31 17.58-201.33 52.26l-0.4 0.22-0.39 0.23c-4.29 2.57-8.85 3.93-13.21 3.93-6.33 0-11.59-2.8-15.23-8.12-3.41-9.72-3.22-23.18 8.25-30.23C354.05 87.58 433 66.54 507.45 66.54a438.912 438.912 0 0 1 172.62 35.08c52.91 22.48 100.5 54.63 141.44 95.57 40.93 40.93 73.09 88.51 95.57 141.43 23.28 54.79 35.08 112.87 35.08 172.62s-11.8 117.84-35.08 172.62c-22.48 52.91-54.63 100.5-95.57 141.43-40.94 40.94-88.53 73.09-141.44 95.57a438.83 438.83 0 0 1-172.63 35.09z m0 0"
|
||||
p-id="15887" class="border"></path>
|
||||
<path
|
||||
d="M327.36 460.82c0 22.16 18.05 40.64 39.71 40.64s39.73-18.57 39.73-40.64c3.62-25.85-18.05-40.61-39.73-40.61s-39.71 18.44-39.71 40.61z m377.59-94.43c-14.46 0-25.3 11.09-25.3 22.16 3.62 11.07 14.46 22.16 25.3 22.16 14.43 0 25.27-11.09 25.27-22.16s-10.84-22.16-25.27-22.16z m-110.23 18.29c21.68 0 39.73-18.56 39.73-40.61s-18.06-40.61-39.73-40.61c-21.67 0-39.73 18.57-39.73 40.61-3.6 22.09 14.46 40.54 39.73 40.54v0.07zM429.23 395.7c18.08 0 36.11-14.78 36.11-33.23 0-18.45-14.43-33.21-36.11-33.21-18.06 0-36.11 14.76-36.11 33.23s14.46 33.21 36.11 33.21z m178.99 95.33c0 18.57 14.46 33.23 36.11 33.23 18.05 0 36.11-14.78 36.11-33.23 0-18.45-14.43-33.23-36.11-33.23-17.96 0-36.11 14.76-36.11 33.23z m-89.64-3.02c18.05 0 28.89-14.87 28.89-29.54s-14.43-29.43-28.89-29.43c-18.05 0-28.89 14.64-28.89 29.43 0 14.78 14.45 29.54 28.89 29.54z m178.2 63.15c-3.88 0-7.77 0-9.7 2-77.74 55.51-147.71 15.85-149.66 13.92-145.76-91.25-242.9 5.85-242.9 5.85a10.313 10.313 0 0 0-3.88 7.94c0.47 2.98 1.81 5.75 3.88 7.96 3.9 5.96 11.6 3.97 17.5 0 1.95-3.97 81.62-81.22 209.9-1.97 1.95 1.97 33.05 19.82 77.74 19.82 29.15 0 66.07-7.91 102.99-33.7a14.953 14.953 0 0 0 1.95-17.85 10.057 10.057 0 0 0-7.82-3.97z m-383.26-185a29.21 29.21 0 0 0 20.56-8.77c5.42-5.54 8.41-13 8.33-20.75 0.19-16.14-12.73-29.39-28.87-29.59a29.227 29.227 0 0 0-28.89 29.54 29.22 29.22 0 0 0 8.3 20.77 29.22 29.22 0 0 0 20.57 8.8z m57.14 267.22h-32.77v95.15h22.49v-31.52h10.91c19.7 0 36.9-9.98 36.9-32.65 0.04-23.55-16.95-30.98-37.53-30.98z m-0.49 45.58h-9.79v-27.52h9.17c10.79 0 16.8 3.34 16.8 12.93 0 9.58-5.27 14.59-16.18 14.59z m103.92-4.48c-1.76 5.5-3.27 11.6-5.15 17.41h-0.63c-1.76-5.87-3.27-11.91-5.15-17.41l-14.81-41.1h-24.23v95.15h20.08v-32.61c-0.39-11.05-1.35-22.07-2.88-33.02h0.51l7.52 22.79 12.67 34.81h12.3l12.56-34.81 7.77-22.79h0.51a320.218 320.218 0 0 0-2.88 33.02v32.72h20.38V633.5h-24.27l-14.3 40.98z m101.23-41.1h-16.45a62.13 62.13 0 0 1-23.21 8.59v14.09h17.2v54.14h-19.82v18.45H592V710.2h-16.69v-76.82z m62.66-1.79c-19.68 0-33 16.13-33 48.9 0 32.77 13.32 49.94 33 49.94s33.14-17.15 33.14-49.94c-0.01-32.79-13.42-48.9-33.14-48.9z m0 81.23c-6.64 0-11.9-6.15-11.9-32.28 0-26.13 5.27-31.35 11.9-31.35 6.64 0 12.07 5.38 12.07 31.35 0 25.97-5.41 32.23-12.07 32.23v0.05z m0 0"
|
||||
p-id="15888"></path>
|
||||
</svg>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/** .border设置循环旋转动画效果 */
|
||||
.border {
|
||||
animation: rotate 3s linear infinite;
|
||||
transform-origin: center;
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
36
src/views/screen/R_D_Environment/component/svgPm25.vue
Normal file
36
src/views/screen/R_D_Environment/component/svgPm25.vue
Normal file
@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<svg t="1731979377696" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="4643" width="256" height="256" :fill="prop.color">
|
||||
<path
|
||||
d="M510.24 954.86a438.195 438.195 0 0 1-172.33-35.02c-52.82-22.44-100.33-54.54-141.2-95.41-40.87-40.87-72.97-88.37-95.41-141.2A438.195 438.195 0 0 1 66.28 510.9c0-74.33 21.01-153.14 59.16-221.94 4.24-6.87 12.97-11.84 20.81-11.84 1.58 0 4.55 0.24 6.66 1.82 8.48 6.36 13.37 19.39 6.9 30.18l-0.24 0.39-0.22 0.41c-34.62 64.9-52.17 132.53-52.17 200.98 0 222.25 180.81 403.06 403.06 403.06S913.3 733.15 913.3 510.9c0-222.24-180.81-403.06-403.06-403.06-68.46 0-136.08 17.56-201 52.18l-0.4 0.22-0.39 0.23c-4.28 2.57-8.84 3.93-13.19 3.93-6.32 0-11.57-2.8-15.2-8.11-3.4-9.71-3.22-23.14 8.24-30.18 68.8-38.15 147.61-59.16 221.94-59.16a438.16 438.16 0 0 1 172.33 35.02c52.82 22.44 100.33 54.54 141.2 95.41 40.86 40.87 72.97 88.37 95.41 141.2 23.24 54.7 35.02 112.68 35.02 172.33s-11.78 117.64-35.02 172.33c-22.44 52.82-54.54 100.33-95.41 141.2-40.87 40.87-88.38 72.97-141.2 95.41a438.362 438.362 0 0 1-172.33 35.01z m0 0"
|
||||
p-id="4644" class="border"></path>
|
||||
<path
|
||||
d="M314.61 465.3c0 22.12 18.02 40.53 39.63 40.53 21.61 0 39.66-18.51 39.66-40.53 3.61-25.8-18.02-40.54-39.66-40.54-21.64 0.01-39.63 18.33-39.63 40.54z m376.86-94.32c-14.41-0.09-25.13 10.93-25.13 22.03 3.61 11.05 14.41 22.1 25.22 22.1 14.43 0 25.25-11.05 25.25-22.1s-10.91-22.12-25.34-22.12v0.09z m-110 18.25c21.63 0 39.66-18.53 39.66-40.54 0-22-18.02-40.54-39.66-40.54-21.63 0-39.63 18.53-39.63 40.54-3.61 22.01 14.41 40.44 39.63 40.44v0.1z m-165.15 11.05c18.02 0 36.04-14.73 36.04-33.17s-14.43-33.26-36.04-33.26c-18.02 0-36.04 14.75-36.04 33.17 0 18.41 14.41 33.17 36.04 33.17v0.09z m178.63 95.13c0 18.53 14.43 33.17 36.04 33.17 18.02 0 36.04-14.75 36.04-33.17 0-18.41-14.41-33.17-36.04-33.17-17.92-0.04-36.04 14.64-36.04 33.17z m-89.48-3.03c18.02 0 28.84-14.73 28.84-29.49 0-14.76-14.41-29.46-28.84-29.46-18.02 0-28.84 14.73-28.84 29.46s14.43 29.44 28.84 29.44v0.05z m177.87 63.05c-3.87 0-7.76 0-9.68 1.97-77.6 55.41-147.46 15.84-149.38 13.9-145.49-91.12-242.45 5.84-242.45 5.84a10.358 10.358 0 0 0-3.87 7.92c0.47 2.97 1.81 5.73 3.87 7.92 3.89 5.93 11.58 3.96 17.46 0 1.95-3.96 81.46-81.07 209.51-1.97 1.95 1.97 32.98 19.78 77.6 19.78 29.09 0 65.95-7.92 102.82-33.65a14.92 14.92 0 0 0 1.92-17.79 9.92 9.92 0 0 0-7.8-3.96v0.04zM300.8 370.73c16.1-0.18 29.01-13.37 28.84-29.46a29.16 29.16 0 0 0-28.82-29.53c-16.1 0.19-29.01 13.38-28.84 29.49a29.1 29.1 0 0 0 8.29 20.73c5.41 5.52 12.8 8.68 20.53 8.77z m27.15 266.72h-32.68v94.97h22.42v-31.45h10.89c19.66 0 36.83-9.98 36.83-32.59-0.01-23.52-16.91-30.93-37.46-30.93z m-0.51 45.59h-9.75v-27.57h9.15c10.77 0 16.77 3.31 16.77 12.9s-5.26 14.67-16.17 14.67z m103.75-4.64c-1.76 5.49-3.27 11.58-5.14 17.37h-0.6c-1.74-5.88-3.24-11.88-5.12-17.37l-14.78-41.02h-24.11v94.97h19.92v-32.41c-0.39-11.04-1.35-22.05-2.87-32.98h0.51l7.5 22.75 12.65 34.75h12.28l12.53-34.75 7.76-22.75h0.51a316.917 316.917 0 0 0-2.87 32.98v32.57h20.4v-94.97h-24.3l-14.27 40.86z m86.91 36.23c14.29-14.69 28.05-32.71 28.05-49.06 0-18.16-12.51-29.9-30.55-29.9-13.27 0-21.8 4.84-30.95 14.69l12.16 12.28c4.38-4.86 9.26-9.27 15.77-9.27 7.39 0 12.16 4.63 12.16 13.44 0 13.9-15.66 31.04-38.96 52.65v13.02h64.65v-19.16h-17.19c-5.07 0.13-10.13 0.57-15.14 1.31z m60.75-8.57c-5.8-0.36-11.23 2.86-13.69 8.12a14.157 14.157 0 0 0 2.52 15.72 14.158 14.158 0 0 0 15.55 3.42c5.39-2.16 8.92-7.39 8.9-13.21 0.18-3.66-1.15-7.24-3.68-9.9a13.39 13.39 0 0 0-9.7-4.16h0.1z m62.27-35.51c-3.31-0.06-6.6 0.59-9.64 1.92l1.37-16.21h33.19v-18.9h-52.35l-2.32 47.02 9.75 6.51c5.54-3.57 8.04-4.63 13.16-4.63 8.04 0 13.66 5.12 13.66 14.69s-5.63 14.82-14.66 14.82c-7.39 0-13.9-3.96-19.16-9.06l-10.33 14.43a44.022 44.022 0 0 0 32.57 13.18c17.9 0 33.7-12.39 33.7-33.75 0-20.57-13.29-30.02-29.07-30.02h0.13z m0 0"
|
||||
p-id="4645"></path>
|
||||
</svg>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/** .border设置循环旋转动画效果 */
|
||||
.border {
|
||||
animation: rotate 3s linear infinite;
|
||||
transform-origin: center;
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -12,7 +12,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = ref({
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = ref({
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = ref({
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = ref({
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
const prop = ref({
|
||||
const prop = defineProps({
|
||||
color: '#469DE9'
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -20,9 +20,11 @@
|
||||
</div>
|
||||
<div class="ct-box">
|
||||
<div class="ct-sensor">
|
||||
<div class="sensor-item" v-for="item in sensor_list">
|
||||
<component style="width: 75px;height: 75px;margin-top: 10px;" color="#469DE9" :is="item.component" :value="item.value" :unit="item.unit" />
|
||||
<div style="margin: 10px 0;color: #A8EFC0;">{{ item.value + item.unit }}</div>
|
||||
<div class="sensor-item" v-for="item in sensor_list"> <!-- :style="{color:item.status == 'true'?'#469DE9':'gray'}" -->
|
||||
<component style="width: 75px;height: 75px;margin-top: 10px;" :is="item.component"
|
||||
:value="item.value" :color="item.status == 'true'?'#469DE9':'gray'" :unit="item.unit" /><!-- -->
|
||||
|
||||
<div style="margin: 10px 0">{{ item.value + item.unit }}</div>
|
||||
<div>{{ item.name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -48,7 +50,7 @@
|
||||
</div>
|
||||
<div class="rbox-item">
|
||||
<ItemVue title="办公室噪音" pos="right">
|
||||
<ProgeChart />
|
||||
<ProgeChart :data="noiseDataList" />
|
||||
</ItemVue>
|
||||
</div>
|
||||
<div class="rbox-item">
|
||||
@ -56,14 +58,14 @@
|
||||
</ItemVue>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <ThreeBG /> -->
|
||||
<Sence />
|
||||
|
||||
|
||||
<!-- <Sence /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref,reactive, onMounted } from 'vue';
|
||||
import { ref, reactive, onMounted } from 'vue';
|
||||
// import ThreeBG from './component/threeBG.vue';
|
||||
import Sence from './component/Sence.vue';
|
||||
import ItemVue from './component/item.vue';
|
||||
@ -72,65 +74,130 @@ import PmVue from './component/pm.vue';
|
||||
import LineChart from './component/lineChart.vue';
|
||||
import ProgeChart from './component/proge.vue';
|
||||
import SvgFenchen from './component/svgFenchen.vue';
|
||||
import SvgPm25 from './component/svgPm25.vue';
|
||||
import SvgPm10 from './component/svgPm10.vue';
|
||||
import SvgJiaquan from './component/svgJiaquan.vue';
|
||||
import SvgZaosheng from './component/svgZaosheng.vue';
|
||||
import SvgTVOC from './component/svgTVOC.vue';
|
||||
import SvgShidu from './component/svgShidu.vue';
|
||||
import SvgWendu from './component/svgWendu.vue';
|
||||
import SvgYanwu from './component/svgYanwu.vue';
|
||||
import { getNoiseData,getTopData } from '@/api/screen/R_D_Environment';
|
||||
|
||||
|
||||
let noiseDataList = ref([
|
||||
{
|
||||
"devId": "48a2ec70-a60c-11ef-91f3-abd609c7e488",
|
||||
"devName": "噪声监测7",
|
||||
"label": "noise-7",
|
||||
"place": null,
|
||||
"data": 0,
|
||||
"status": 0
|
||||
}
|
||||
])
|
||||
let sensor_list = reactive([
|
||||
{
|
||||
name:'温度',
|
||||
component:SvgWendu,
|
||||
id: '',
|
||||
name: '温度',
|
||||
component: SvgWendu,
|
||||
value: 20,
|
||||
unit: '℃'
|
||||
unit: '℃',
|
||||
type: 'AirTemp_Reg',
|
||||
status: "true"
|
||||
},
|
||||
{
|
||||
name:'湿度',
|
||||
component:SvgShidu,
|
||||
id: '',
|
||||
name: '湿度',
|
||||
component: SvgShidu,
|
||||
value: 20,
|
||||
unit: '%'
|
||||
unit: '%',
|
||||
type: 'AirHumi_Reg',
|
||||
status: "true"
|
||||
},
|
||||
{
|
||||
name:'甲醛',
|
||||
component:SvgJiaquan,
|
||||
id: '',
|
||||
name: '甲醛',
|
||||
component: SvgJiaquan,
|
||||
value: 20,
|
||||
unit: 'mg/m³'
|
||||
unit: 'mg/m³',
|
||||
type: 'CH2O',
|
||||
status: "true"
|
||||
},
|
||||
{
|
||||
name:'TVOC',
|
||||
component:SvgTVOC,
|
||||
id: '',
|
||||
name: 'TVOC',
|
||||
component: SvgTVOC,
|
||||
value: 20,
|
||||
unit: 'mg/m³'
|
||||
unit: 'mg/m³',
|
||||
type: 'TVOC',
|
||||
status: "true"
|
||||
},
|
||||
{
|
||||
name:'粉尘',
|
||||
component:SvgFenchen,
|
||||
id: '',
|
||||
name: 'PM2.5',
|
||||
component: SvgPm25,
|
||||
value: 20,
|
||||
unit: 'mg/m³'
|
||||
unit: 'mg/m³',
|
||||
type:'HIGH_PM25_Reg',
|
||||
status: "true"
|
||||
},
|
||||
{
|
||||
name:'噪音',
|
||||
component:SvgZaosheng,
|
||||
id: '',
|
||||
name: 'PM10',
|
||||
component: SvgPm10,
|
||||
value: 20,
|
||||
unit: 'dB'
|
||||
unit: 'mg/m³',
|
||||
type:'HIGH_PM10_Reg',
|
||||
status: "true"
|
||||
},
|
||||
{
|
||||
name:'烟雾',
|
||||
component:SvgYanwu,
|
||||
id: '',
|
||||
name: '噪音',
|
||||
component: SvgZaosheng,
|
||||
value: 20,
|
||||
unit: 'mg/m³'
|
||||
unit: 'dB',
|
||||
type:'Noise_Reg',
|
||||
status: "true"
|
||||
},
|
||||
{
|
||||
id: '',
|
||||
name: '烟雾',
|
||||
component: SvgYanwu,
|
||||
value: 20,
|
||||
unit: 'mg/m³',
|
||||
type:'Smoke_Reg',
|
||||
status: "true"
|
||||
}
|
||||
])
|
||||
|
||||
|
||||
// 获取各办公室噪音数据
|
||||
function getNoiseDataList() {
|
||||
getNoiseData().then(res => {
|
||||
if (res.code === 200) {
|
||||
noiseDataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
// 获取顶部数据
|
||||
function getTopDataList() {
|
||||
getTopData().then(res => {
|
||||
if (res.code === 200) {
|
||||
res.data.forEach(item =>{
|
||||
let index = sensor_list.findIndex(sensor => sensor.type === item.type)
|
||||
sensor_list[index].value = item.data
|
||||
sensor_list[index].id = item.id
|
||||
sensor_list[index].status = item.status
|
||||
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
getNoiseDataList()
|
||||
getTopDataList()
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -165,16 +232,22 @@ onMounted(() => {
|
||||
.l-box {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
left: 33px;
|
||||
left: 0px;
|
||||
width: 410px;
|
||||
height: 950px;
|
||||
height: 980px;
|
||||
z-index: 2;
|
||||
background: url('/src/assets/images/preview-left.png') center center / 100% 100% no-repeat;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.lbox1 {
|
||||
width: 100%;
|
||||
height: 316px;
|
||||
}
|
||||
}
|
||||
|
||||
.ct-box {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
@ -184,12 +257,14 @@ onMounted(() => {
|
||||
display: flex;
|
||||
z-index: 2;
|
||||
justify-content: space-between;
|
||||
|
||||
.ct-sensor {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.sensor-item {
|
||||
width: 146px;
|
||||
height: 100%;
|
||||
@ -198,6 +273,7 @@ onMounted(() => {
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
|
||||
.sensor-icon {
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
@ -205,31 +281,38 @@ onMounted(() => {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cb-box {
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
left: 445px;
|
||||
width: 1026px;
|
||||
bottom: 0px;
|
||||
left: 435px;
|
||||
width: 1046px;
|
||||
height: 316px;
|
||||
display: flex;
|
||||
z-index: 2;
|
||||
justify-content: space-between;
|
||||
background: url('/src/assets/images/preview-bottom.png') center center / 100% 100% no-repeat;
|
||||
|
||||
.cbox {
|
||||
width: 50%;
|
||||
width: 48%;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.r-box {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
right: 38px;
|
||||
width: 410px;
|
||||
height: 950px;
|
||||
right: 0px;
|
||||
width: 420px;
|
||||
height: 980px;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background: url('/src/assets/images/preview-right.png') center center / 100% 100% no-repeat;
|
||||
|
||||
|
||||
.rbox-item {
|
||||
width: 100%;
|
||||
height: 316px;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user