122 lines
2.6 KiB
Vue
Raw Normal View History

<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>