122 lines
2.6 KiB
Vue
122 lines
2.6 KiB
Vue
![]() |
<template>
|
||
|
<section>
|
||
|
<common>
|
||
|
<template #main>
|
||
|
<div>
|
||
|
<devices :title="'智能浸种设备'" :devices="devices"></devices>
|
||
|
</div>
|
||
|
<div style="display: flex; align-items: stretch; justify-content: space-between; margin-top: 20px">
|
||
|
<stream :title="'浸种监测实时监控'" :devices="devices" style="width: 60%; margin-right: 20px; height: fit-content"></stream>
|
||
|
<DataDisplay :title="'浸种分析'" :data="rightData" :show-image="true" :image-list="srcList" style="flex: 1"></DataDisplay>
|
||
|
</div>
|
||
|
</template>
|
||
|
</common>
|
||
|
</section>
|
||
|
</template>
|
||
|
|
||
|
<script setup>
|
||
|
import { ref, onMounted } from 'vue';
|
||
|
import Common from '../components/common.vue';
|
||
|
import Devices from '@/views/smartFarm/components/devices.vue';
|
||
|
import Stream from '@/views/smartFarm/components/stream.vue';
|
||
|
import DataDisplay from '@/views/smartFarm/components/dataDisplay.vue';
|
||
|
|
||
|
const devices = ref([
|
||
|
{
|
||
|
name: 'A-001',
|
||
|
icon: 'tempSensor',
|
||
|
detail: 'A区-监控设备9',
|
||
|
status: '1', // 0: 离线 1: 正常 -1: 异常
|
||
|
id: 0,
|
||
|
},
|
||
|
{
|
||
|
name: 'A-003',
|
||
|
icon: 'heater',
|
||
|
detail: 'A区-监控设备7',
|
||
|
status: '1',
|
||
|
id: 2,
|
||
|
},
|
||
|
{
|
||
|
name: 'A-005',
|
||
|
icon: 'heat',
|
||
|
detail: 'A区-监控设备5',
|
||
|
status: '1',
|
||
|
id: 4,
|
||
|
},
|
||
|
{
|
||
|
name: 'A-007',
|
||
|
icon: 'timer',
|
||
|
status: '1',
|
||
|
detail: 'A区-监控设备4',
|
||
|
id: 6,
|
||
|
},
|
||
|
{
|
||
|
name: 'A-009',
|
||
|
detail: 'A区-监控设备9',
|
||
|
icon: 'mixer',
|
||
|
status: '1',
|
||
|
id: 8,
|
||
|
},
|
||
|
{
|
||
|
name: 'A-010',
|
||
|
detail: 'A区-监控设备10',
|
||
|
icon: 'liquidSensor',
|
||
|
status: '1',
|
||
|
id: 9,
|
||
|
},
|
||
|
{
|
||
|
name: 'A-012',
|
||
|
detail: 'A区-监控设备3',
|
||
|
icon: 'disinfectionLamp',
|
||
|
status: '1',
|
||
|
id: 11,
|
||
|
},
|
||
|
]);
|
||
|
|
||
|
const srcList = ref(['https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg']);
|
||
|
const rightData = ref([
|
||
|
{
|
||
|
title: '温度', //左侧文本
|
||
|
status: '1', // 0:不正常 1:正常
|
||
|
statusText: '21℃ 正常', //左侧文本
|
||
|
},
|
||
|
{
|
||
|
title: '湿度',
|
||
|
status: '1',
|
||
|
statusText: '18℃ 正常',
|
||
|
},
|
||
|
{
|
||
|
title: '光照强度',
|
||
|
status: '1',
|
||
|
statusText: '正常',
|
||
|
},
|
||
|
{
|
||
|
title: '浸泡液位',
|
||
|
status: '1',
|
||
|
statusText: '正常',
|
||
|
},
|
||
|
{
|
||
|
title: '溶解氧含量',
|
||
|
status: '1',
|
||
|
statusText: '36% 正常',
|
||
|
},
|
||
|
{
|
||
|
title: '酸碱度',
|
||
|
status: '1',
|
||
|
statusText: '6.7 正常',
|
||
|
},
|
||
|
{
|
||
|
title: '设备状态',
|
||
|
status: '1',
|
||
|
statusText: '正常',
|
||
|
},
|
||
|
{
|
||
|
title: '种子状态',
|
||
|
status: '1',
|
||
|
statusText: '出芽',
|
||
|
},
|
||
|
]);
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped></style>
|