<template>
  <section>
    <common>
      <template #main>
        <div>
          <ProduceDevices :title="'育苗设备'" :devices="devices"></ProduceDevices>
        </div>
        <div style="display: flex; justify-content: space-between; margin-top: 20px">
          <MyTable :title="'育苗策略'" :data="leftTableData" :column="leftTableTitle" style="width: 60%; margin-right: 20px"></MyTable>
          <MyTable :title="'育苗记录'" :data="rightTableData" :column="rightTableTitle" style="flex: 1"></MyTable>
        </div>
      </template>
    </common>
  </section>
</template>

<script setup>
import { ref } from 'vue';
import Common from '../components/common.vue';
import MyTable from '@/views/smartFarm/components/myTable.vue';
import ProduceDevices from '@/views/smartFarm/components/produceDevices.vue';

const devices = ref([
  {
    name: 'A-001',
    serial: 'YM20250101001', // 设备序列号
    icon: 'plant', // plant育苗 gogga病虫害 water喷灌
    isOpen: 1, // 0:关闭 1:开启
    isOperation: 0, // 0:待机中 1:运作中
    status: '1', // -1:故障 0:离线 1:正常
    id: 0,
  },
  {
    name: 'A-002',
    serial: 'YM20250101002',
    icon: 'plant',
    isOpen: 0,
    isOperation: 1,
    status: '1',
    id: 1,
  },
  {
    name: 'A-003',
    serial: 'YM20250101003',
    icon: 'gogga',
    isOpen: 0,
    isOperation: 0,
    status: '-1',
    id: 2,
  },
  {
    name: 'A-004',
    serial: 'YM20250101004',
    icon: 'water',
    isOpen: 1,
    isOperation: 0,
    status: '0',
    id: 3,
  },
  {
    name: 'A-005',
    serial: 'YM20250101005',
    icon: 'gogga',
    isOpen: 0,
    isOperation: 1,
    status: '1',
    id: 4,
  },
  {
    name: 'A-006',
    serial: 'YM20250101006',
    icon: 'water',
    isOpen: 1,
    isOperation: 0,
    status: '1',
    id: 5,
  },
]);

const leftTableData = ref([
  {
    name: '温度',
    value: '>25',
    device: '制冷机',
    behavior: '开启',
    time: 10,
  },
  {
    name: '湿度',
    value: '<24',
    device: '喷洒机',
    behavior: '关闭',
    time: 15,
  },
  {
    name: 'PH值',
    value: '>8',
    device: '配肥机',
    behavior: '开启',
    time: 5,
  },
  {
    name: '风速',
    value: '>中风',
    device: '通风窗',
    behavior: '关闭',
    time: '/',
  },
  {
    name: '光照',
    value: '>强光',
    device: '幕布',
    behavior: '开启',
    time: '/',
  },
]);
const leftTableTitle = ref([
  {
    label: '参数名称',
    prop: 'name',
    width: 'auto',
  },
  {
    label: '参数值',
    prop: 'value',
    width: 'auto',
  },
  {
    label: '智能设备',
    prop: 'device',
    width: 'auto',
  },
  {
    label: '机械行为',
    prop: 'behavior',
    width: 'auto',
  },
  {
    label: '持续时间(min)',
    prop: 'time',
    width: 'auto',
  },
]);

const rightTableData = ref([
  {
    date: '2025-01-01 10:36',
    device: '制冷机',
    behavior: '开启',
  },
  {
    date: '2025-01-01 10:30',
    device: '喷洒机',
    behavior: '关闭',
  },
  {
    date: '2025-01-01 10:22',
    device: '配肥机',
    behavior: '开启',
  },
  {
    date: '2025-01-01 10:10',
    device: '通风窗',
    behavior: '关闭',
  },
  {
    date: '2025-01-01 10:00',
    device: '幕布',
    behavior: '开启',
  },
]);
const rightTableTitle = ref([
  {
    label: '执行时间',
    prop: 'date',
    width: 'auto',
  },
  {
    label: '智能设备',
    prop: 'device',
    width: 'auto',
  },
  {
    label: '机械行为',
    prop: 'behavior',
    width: 'auto',
  },
]);
</script>

<style lang="scss" scoped>
.plantStatus {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  margin: 7px 0;
  .leftKey {
    color: #000000;
  }
  .rightValue {
    color: #25bf82;
  }
}
</style>
