Merge branch 'dev' of http://47.109.205.240:3000/Web/daimp-front into dev

main/src/micro/app.js

@@ -61,7 +61,7 @@ export const rightApps = [
     // entry: VITE_APP_SUB_GSS,
     entry: VITE_APP_SUB_GSR,
     // activeRule: '/sub-government-screen-service',
-    activeRule: '/new-digital-agriculture-screen/v2/land',
+    activeRule: '/new-digital-agriculture-screen',
     title: '数据大屏',
     icon: 'images/platform/icon-screen.png',
   },

main/src/views/index.vue

@@ -35,9 +35,8 @@ import { leftApps, rightApps } from '@/micro/app';
 import { getAssetsFile } from '@/utils';
 
 const gotoPage = (row) => {
-  console.log(row);
+  // window.history.pushState({}, row.name, row.activeRule);
-  console.log(window.history.pushState({}, row.name, row.activeRule));
+  window.location.href = row.activeRule;
-  window.history.pushState({}, row.name, row.activeRule);
 };
 </script>
 <style lang="scss" scoped>

new-digital-agriculture-screen/auto-imports.d.ts

@@ -1,75 +0,0 @@
-/* eslint-disable */
-/* prettier-ignore */
-// @ts-nocheck
-// noinspection JSUnusedGlobalSymbols
-// Generated by unplugin-auto-import
-export {}
-declare global {
-  const EffectScope: typeof import('vue')['EffectScope']
-  const computed: typeof import('vue')['computed']
-  const createApp: typeof import('vue')['createApp']
-  const customRef: typeof import('vue')['customRef']
-  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
-  const defineComponent: typeof import('vue')['defineComponent']
-  const effectScope: typeof import('vue')['effectScope']
-  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
-  const getCurrentScope: typeof import('vue')['getCurrentScope']
-  const h: typeof import('vue')['h']
-  const inject: typeof import('vue')['inject']
-  const isProxy: typeof import('vue')['isProxy']
-  const isReactive: typeof import('vue')['isReactive']
-  const isReadonly: typeof import('vue')['isReadonly']
-  const isRef: typeof import('vue')['isRef']
-  const markRaw: typeof import('vue')['markRaw']
-  const nextTick: typeof import('vue')['nextTick']
-  const onActivated: typeof import('vue')['onActivated']
-  const onBeforeMount: typeof import('vue')['onBeforeMount']
-  const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
-  const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
-  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
-  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
-  const onDeactivated: typeof import('vue')['onDeactivated']
-  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
-  const onMounted: typeof import('vue')['onMounted']
-  const onRenderTracked: typeof import('vue')['onRenderTracked']
-  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
-  const onScopeDispose: typeof import('vue')['onScopeDispose']
-  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
-  const onUnmounted: typeof import('vue')['onUnmounted']
-  const onUpdated: typeof import('vue')['onUpdated']
-  const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
-  const provide: typeof import('vue')['provide']
-  const reactive: typeof import('vue')['reactive']
-  const readonly: typeof import('vue')['readonly']
-  const ref: typeof import('vue')['ref']
-  const resolveComponent: typeof import('vue')['resolveComponent']
-  const shallowReactive: typeof import('vue')['shallowReactive']
-  const shallowReadonly: typeof import('vue')['shallowReadonly']
-  const shallowRef: typeof import('vue')['shallowRef']
-  const toRaw: typeof import('vue')['toRaw']
-  const toRef: typeof import('vue')['toRef']
-  const toRefs: typeof import('vue')['toRefs']
-  const toValue: typeof import('vue')['toValue']
-  const triggerRef: typeof import('vue')['triggerRef']
-  const unref: typeof import('vue')['unref']
-  const useAttrs: typeof import('vue')['useAttrs']
-  const useCssModule: typeof import('vue')['useCssModule']
-  const useCssVars: typeof import('vue')['useCssVars']
-  const useId: typeof import('vue')['useId']
-  const useLink: typeof import('vue-router')['useLink']
-  const useModel: typeof import('vue')['useModel']
-  const useRoute: typeof import('vue-router')['useRoute']
-  const useRouter: typeof import('vue-router')['useRouter']
-  const useSlots: typeof import('vue')['useSlots']
-  const useTemplateRef: typeof import('vue')['useTemplateRef']
-  const watch: typeof import('vue')['watch']
-  const watchEffect: typeof import('vue')['watchEffect']
-  const watchPostEffect: typeof import('vue')['watchPostEffect']
-  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
-}
-// for type re-export
-declare global {
-  // @ts-ignore
-  export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
-  import('vue')
-}

new-digital-agriculture-screen/components.d.ts

@@ -1,53 +0,0 @@
-/* eslint-disable */
-/* prettier-ignore */
-// @ts-nocheck
-// Generated by unplugin-vue-components
-// Read more: https://github.com/vuejs/core/pull/3399
-export {}
-
-declare module 'vue' {
-  export interface GlobalComponents {
-    BaseBg: typeof import('./src/components/baseBg.vue')['default']
-    CenterMap: typeof import('./src/components/centerMap.vue')['default']
-    'CenterMap copy': typeof import('./src/components/centerMap copy.vue')['default']
-    CodeDialog: typeof import('./src/components/code-dialog/index.vue')['default']
-    Components: typeof import('./src/components/index.js')['default']
-    copy: typeof import('./src/components/centerMap copy.vue')['default']
-    CurrentTime: typeof import('./src/components/currentTime.vue')['default']
-    CustomBack: typeof import('./src/components/customBack.vue')['default']
-    CustomCarouselPicture: typeof import('./src/components/custom-carousel-picture/index.vue')['default']
-    CustomEchartBar: typeof import('./src/components/custom-echart-bar/index.vue')['default']
-    CustomEchartBubble: typeof import('./src/components/custom-echart-bubble/index.vue')['default']
-    CustomEchartColumnLine: typeof import('./src/components/custom-echart-column-line/index.vue')['default']
-    CustomEchartHyalineCake: typeof import('./src/components/custom-echart-hyaline-cake/index.vue')['default']
-    CustomEchartLine: typeof import('./src/components/custom-echart-line/index.vue')['default']
-    CustomEchartLineLine: typeof import('./src/components/custom-echart-line-line/index.vue')['default']
-    CustomEchartMaps: typeof import('./src/components/custom-echart-maps/index.vue')['default']
-    CustomEchartMixin: typeof import('./src/components/custom-echart-mixin/index.vue')['default']
-    CustomEchartPictorialBar: typeof import('./src/components/custom-echart-pictorial-bar/index.vue')['default']
-    CustomEchartPie: typeof import('./src/components/custom-echart-pie/index.vue')['default']
-    CustomEchartPie3d: typeof import('./src/components/custom-echart-pie-3d/index.vue')['default']
-    CustomEchartPieGauge: typeof import('./src/components/custom-echart-pie-gauge/index.vue')['default']
-    CustomEchartRadar: typeof import('./src/components/custom-echart-radar/index.vue')['default']
-    CustomEchartScatterBlister: typeof import('./src/components/custom-echart-scatter-blister/index.vue')['default']
-    CustomEchartTriangle: typeof import('./src/components/custom-echart-triangle/index.vue')['default']
-    CustomEchartWaterDroplet: typeof import('./src/components/custom-echart-water-droplet/index.vue')['default']
-    CustomEchartWordCloud: typeof import('./src/components/custom-echart-word-cloud/index.vue')['default']
-    CustomIframe: typeof import('./src/components/custom-iframe/index.vue')['default']
-    CustomImportExcel: typeof import('./src/components/custom-import-excel/index.vue')['default']
-    CustomProgress: typeof import('./src/components/customProgress.vue')['default']
-    CustomRankList: typeof import('./src/components/custom-rank-list/index.vue')['default']
-    CustomRichEditor: typeof import('./src/components/custom-rich-editor/index.vue')['default']
-    CustomScrollBoard: typeof import('./src/components/custom-scroll-board/index.vue')['default']
-    CustomScrollTitle: typeof import('./src/components/custom-scroll-title/index.vue')['default']
-    CustomTableOperate: typeof import('./src/components/custom-table-operate/index.vue')['default']
-    CustomTableTree: typeof import('./src/components/custom-table-tree/index.vue')['default']
-    NewHyalineCake: typeof import('./src/components/custom-echart-hyaline-cake/new-hyaline-cake.vue')['default']
-    NewPie: typeof import('./src/components/custom-echart-hyaline-cake/new-pie.vue')['default']
-    RouterLink: typeof import('vue-router')['RouterLink']
-    RouterView: typeof import('vue-router')['RouterView']
-    SubTop: typeof import('./src/components/subTop.vue')['default']
-    SvgIcon: typeof import('./src/components/svg-icon/index.vue')['default']
-    UpFile: typeof import('./src/components/custom-rich-editor/upFile.js')['default']
-  }
-}

new-digital-agriculture-screen/src/router/index.js

@@ -17,6 +17,70 @@ export const constantRoutes = [
     component: () => import('@/views/error/403.vue'),
     hidden: true,
   },
+  {
+    path: '/new-digital-agriculture-screen',
+    name: 'home',
+    component: Layout,
+    redirect: '/new-digital-agriculture-screen/v2/land', //原home
+    meta: { title: '首页', icon: '' },
+    children: [
+      // {
+      //   path: '/new-digital-agriculture-screen/v2/home',
+      //   component: () => import('@/views/home/index.vue'),
+      //   name: 'home',
+      //   meta: { title: '首页', icon: '' },
+      // },
+      {
+        path: '/new-digital-agriculture-screen/v2/land',
+        component: () => import('@/views/land/index.vue'),
+        name: 'land',
+        meta: { title: '土地资源', icon: '' },
+      },
+      {
+        path: '/new-digital-agriculture-screen/v2/inputs',
+        name: 'inputs',
+        component: () => import('@/views/inputs/index.vue'),
+        meta: { title: '投入品监管', icon: '' },
+      },
+      {
+        path: '/new-digital-agriculture-screen/v2/entities',
+        name: 'entities',
+        component: () => import('@/views/entities/index.vue'),
+        meta: { title: '产出品管理', icon: '' },
+      },
+      // {
+      //   path: 'breed',
+      //   name: 'breed',
+      //   component: () => import('@/views/breed/index.vue'),
+      //   meta: { title: '', icon: '' },
+      // },
+      // {
+      //   path: 'plant',
+      //   name: 'plant',
+      //   component: () => import('@/views/plant/index.vue'),
+      //   meta: { title: '', icon: '' },
+      // },
+      {
+        path: '/new-digital-agriculture-screen/v2/business',
+        name: 'business',
+        component: () => import('@/views/business/index.vue'),
+        meta: { title: '生产经营主体', icon: '' },
+      },
+      {
+        path: '/new-digital-agriculture-screen/v2/trace',
+        name: 'trace',
+        component: () => import('@/views/trace/index.vue'),
+        meta: { title: '农产品溯源', icon: '' },
+      },
+      // {
+      //   path: 'early',
+      //   name: 'early',
+      //   component: () => import('@/views/early/index.vue'),
+      //   meta: { title: '', icon: '' },
+      // },
+    ],
+  },
+
   // {
   //   // 原来的首页默认配置
   //   path: '/new-digital-agriculture-screen',
@@ -34,7 +98,7 @@ export const constantRoutes = [
   //   ],
   // },
   // ...demoRouters,
-  v2,
+  // v2,
   // {
   //   path: '/test',
   //   name: 'test',

sub-operation-service/src/router/index.js

@@ -133,6 +133,12 @@ export const constantRoutes = [
         name: 'envInspection',
         meta: { title: '环境监测' },
       },
+      {
+        path: '/sub-operation-service/smartFarm/intelligentFertilizer',
+        component: () => import('@/views/smartFarm/inspection/intelligentFertilizer.vue'),
+        name: 'intelligentFertilizer',
+        meta: { title: '智能配肥' },
+      },
       {
         path: '/sub-operation-service/smartFarm/growSeedlings',
         component: () => import('@/views/smartFarm/manageControl/growSeedlings.vue'),

sub-operation-service/src/views/dashboard/index.vue

@@ -1,3 +1,6 @@
+<template>
+  <dev></dev>
+</template>
 <!-- <template>
   <div class="data-home-index">
     <el-row style="width: 100%; height: 100%">

sub-operation-service/src/views/smartFarm/components/devices.vue

@@ -27,7 +27,7 @@ const icons = [
   { 温度传感器: 'tempSensor' },
   { 智能阀控: 'intelligentValveControl' },
   { 供水阀: 'waterSupplyValve' },
-  { 混合阀: 'mixingPump' },
+  { 混合泵: 'mixingPump' },
   { 混合罐: 'mixingTank' },
   { 施肥: 'fertilization' },
   { 肥料罐: 'fertilizerTank' },

sub-operation-service/src/views/smartFarm/components/leftMenu.vue

@@ -79,6 +79,12 @@ const leftMenu = reactive([
         icon: 'menu1.png',
         path: '/sub-operation-service/smartFarm/envInspection',
       },
+      {
+        name: 'intelligentFertilizer',
+        title: '智能配肥',
+        icon: 'menu1.png',
+        path: '/sub-operation-service/smartFarm/intelligentFertilizer',
+      },
     ],
   },
   {

sub-operation-service/src/views/smartFarm/components/myTable.vue

@@ -33,22 +33,18 @@ onMounted(() => {
       <div class="my-table-title" style="">{{ title }}</div>
       <div style="height: 170px">
         <table border="0" cellspacing="0" cellpadding="8">
-          <thead>
+          <tr class="my-table-th">
-            <tr class="my-table-th">
+            <th v-for="(item, index) in column" :key="item.prop || index">
-              <th v-for="(item, index) in column" :key="item.prop || index">
+              {{ item?.label || '' }}
-                {{ item?.label || '' }}
+            </th>
-              </th>
+          </tr>
-            </tr>
+          <tr v-for="(item, index) in data" :key="item.id || index">
-          </thead>
+            <td v-for="(cell, i) of item" :key="item.id || i">
-          <tbody>
+              <span v-if="cell == '开启'" style="color: #25bf82">{{ cell }}</span>
-            <tr v-for="(item, index) in data" :key="item.id || index">
+              <span v-else-if="cell == '关闭'" style="color: #fe4066">{{ cell }}</span>
-              <td v-for="(cell, i) of item" :key="item.id || i">
+              <span v-else>{{ cell }}</span>
-                <span v-if="cell == '开启'" style="color: #25bf82">{{ cell }}</span>
+            </td>
-                <span v-else-if="cell == '关闭'" style="color: #fe4066">{{ cell }}</span>
+          </tr>
-                <span v-else>{{ cell }}</span>
-              </td>
-            </tr>
-          </tbody>
         </table>
       </div>
     </el-card>

sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue

@@ -1,227 +1,7 @@
-<script setup>
+<script setup></script>
-import Devices from '@/views/smartFarm/components/devices.vue';
-import Common from '@/views/smartFarm/components/common.vue';
-import stream from '@/views/smartFarm/components/stream.vue';
-import { ref, onMounted, onBeforeUnmount } from 'vue';
-import { getAssetsFile } from '@/utils/index.js';
-import * as echarts from 'echarts';
-import BugData from '@/views/smartFarm/components/bugData.vue';
-import SickData from '@/views/smartFarm/components/sickData.vue';
-
-const currentDevice = ref(0);
-const devices = ref([
-  {
-    name: 'A-001',
-    icon: 'temp',
-    detail: 'A区-监控设备1',
-    status: '1',
-    id: 0,
-  },
-  {
-    name: 'A-002',
-    icon: 'temp',
-    detail: 'A区-监控设备2',
-    status: '1',
-    id: 1,
-  },
-  {
-    name: 'A-003',
-    icon: 'ph',
-    detail: 'A区-监控设备3',
-    status: '1',
-    id: 2,
-  },
-  {
-    name: 'A-004',
-    icon: 'ph',
-    detail: 'A区-监控设备4',
-    status: '-1',
-    id: 3,
-  },
-  {
-    name: 'A-005',
-    icon: 'O2',
-    detail: 'A区-监控设备5',
-    status: '1',
-    id: 4,
-  },
-  {
-    name: 'A-006',
-    icon: 'elect',
-    detail: 'A区-监控设备6',
-    status: '0',
-    id: 5,
-  },
-  {
-    name: 'B-001',
-    icon: 'light',
-    detail: 'B区-监控设备1',
-    status: '1',
-    id: 6,
-  },
-  {
-    name: 'B-002',
-    icon: 'elect',
-    detail: 'B区-监控设备2',
-    status: '-1',
-    id: 7,
-  },
-  {
-    name: 'B-003',
-    icon: 'dust',
-    detail: 'B区-监控设备3',
-    status: '1',
-    id: 8,
-  },
-  {
-    name: 'B-004',
-    icon: 'dust',
-    detail: 'B区-监控设备4',
-    status: '1',
-    id: 9,
-  },
-  {
-    name: 'B-005',
-    icon: 'float',
-    detail: 'B区-监控设备5',
-    status: '1',
-    id: 10,
-  },
-  {
-    name: 'B-006',
-    icon: 'float',
-    detail: 'B区-监控设备6',
-    status: '1',
-    id: 11,
-  },
-]);
-const rules = ref([
-  {
-    name: '温度',
-    icon: 'temp',
-    unit: '℃',
-    goat: '15',
-    status: '1',
-  },
-  {
-    name: 'PH值',
-    icon: 'ph',
-    unit: '',
-    goat: '6.5',
-    status: '1',
-  },
-  {
-    name: '溶解氧',
-    icon: 'O2',
-    goat: '0.4',
-    unit: 'mg/L',
-    status: '1',
-  },
-  {
-    name: '色度',
-    icon: 'light',
-    goat: '15',
-    unit: 'PCU',
-    status: '1',
-  },
-  {
-    name: '浊度',
-    icon: 'dust',
-    goat: '1.5',
-    unit: 'NTU',
-    status: '1',
-  },
-  {
-    name: '导电率',
-    icon: 'elect',
-    goat: '3000',
-    unit: 'μS/cm',
-    status: '1',
-  },
-  {
-    name: '悬浮物',
-    icon: 'float',
-    goat: '9000',
-    unit: 'mg/L',
-    status: '0',
-  },
-]);
-const isFullscreen = ref(false);
-const toggleFullscreen = () => {
-  isFullscreen.value = !isFullscreen.value;
-};
-
-const chooseIcon = (type) => {
-  switch (type) {
-    case 'light':
-      return '分光器.png';
-    case 'float':
-      return '悬浮物.png';
-    case 'O2':
-      return '水质溶解氧.png';
-    case 'elect':
-      return '水质电导率.png';
-    case 'dust':
-      return '浊度.png';
-    case 'temp':
-      return '温度.png';
-    case 'ph':
-      return '酸碱度.png';
-  }
-};
-
-// #endregion
-</script>
 
 <template>
-  <div>
+  <div></div>
-    <common>
-      <template #main>
-        <div>
-          <devices :title="'病虫害监测设备'" :devices="devices"></devices>
-        </div>
-        <div style="margin-top: 10px; display: flex; justify-content: space-between">
-          <div style="display: flex; justify-content: space-between; margin-top: 10px">
-            <stream :title="'病害监测实时监控'" :devices="devices" style="width: 60%; height: fit-content"></stream>
-            <div style="width: 38%">
-              <el-card style="border-radius: 16px; padding: 10px">
-                <div style="font-size: 16px; font-weight: bold; text-align: left; color: #000">虫害数据</div>
-                <sick-data style="width: 38%; min-width: 300px"></sick-data>
-              </el-card>
-            </div>
-          </div>
-        </div>
-        <div style="margin-top: 10px; display: flex; justify-content: space-between">
-          <div style="display: flex; justify-content: space-between; margin-top: 10px; width: 100%">
-            <stream :title="'虫害监测实时监控'" :devices="devices" style="width: 60%; height: fit-content"></stream>
-            <div style="width: 38%">
-              <el-card style="border-radius: 16px; padding: 10px">
-                <div style="font-size: 16px; font-weight: bold; text-align: left; color: #000">虫害数据</div>
-                <bug-data style="width: 38%; min-width: 300px"></bug-data>
-              </el-card>
-            </div>
-          </div>
-        </div>
-      </template>
-    </common>
-  </div>
 </template>
 
-<style scoped lang="scss">
+<style scoped lang="scss"></style>
-.rates {
-  margin: 10px 0;
-  height: 100px;
-  font-size: 14px;
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  justify-content: center;
-  background-size: 80%;
-  background-repeat: no-repeat;
-  background-position: center;
-  width: 25%;
-  img {
-    height: 20px;
-  }
-}
-</style>

sub-operation-service/src/views/smartFarm/inspection/intelligentFertilizer.vue

@@ -0,0 +1,161 @@
+<template>
+  <section>
+    <common>
+      <template #main>
+        <div>
+          <devices :title="'智能配肥设备'" :devices="devices"></devices>
+        </div>
+        <div style="display: flex; justify-content: space-between; margin-top: 10px">
+          <stream :title="'施肥监测实时监控'" :devices="devices" style="width: 60%; height: fit-content"></stream>
+          <el-card style="width: calc(40% - 20px); border-radius: 16px; padding: 10px">
+            <div style="font-size: 16px; font-weight: bold; text-align: left">配肥分析</div>
+            <div class="plantStatus">
+              <div class="leftKey">土壤酸碱度:</div>
+              <div class="rightValue">正常</div>
+            </div>
+            <div class="plantStatus">
+              <div class="leftKey">土壤养分含量:</div>
+              <div class="errorValue">N 元素不足</div>
+            </div>
+            <div class="plantStatus">
+              <div class="leftKey">光照强度:</div>
+              <div class="errorValue">偏高</div>
+            </div>
+            <div class="plantStatus">
+              <div class="leftKey">风速:</div>
+              <div class="rightValue">微风</div>
+            </div>
+            <div class="plantStatus">
+              <div class="leftKey">作物生长状态:</div>
+              <div class="rightValue">良好</div>
+            </div>
+            <div class="plantStatus">
+              <div class="leftKey">设备状态:</div>
+              <div class="rightValue">正常</div>
+            </div>
+            <div class="plantStatus">
+              <div class="leftKey">肥料储备:</div>
+              <div class="rightValue">充足</div>
+            </div>
+          </el-card>
+        </div>
+      </template>
+    </common>
+  </section>
+</template>
+
+<script setup>
+import { ref, onMounted, onBeforeUnmount } 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 * as echarts from 'echarts';
+/* --------------- data --------------- */
+// #region
+const devices = ref([
+  {
+    name: 'A-001',
+    icon: 'fertilizerTank',
+    detail: 'A区-监控设备9',
+    status: '0',
+    id: 0,
+  },
+  {
+    name: 'A-002',
+    icon: 'fertilizerTank',
+    detail: 'A区-监控设备66',
+    status: '0',
+    id: 1,
+  },
+  {
+    name: 'A-003',
+    icon: 'fertilization',
+    detail: 'A区-监控设备7',
+    status: '0',
+    id: 2,
+  },
+  {
+    name: 'A-004',
+    icon: 'mixingTank',
+    detail: 'A区-监控设备1',
+    status: '-1',
+    id: 3,
+  },
+  {
+    name: 'A-005',
+    icon: 'mixingTank',
+    detail: 'A区-监控设备5',
+    status: '-1',
+    id: 4,
+  },
+  {
+    name: 'A-006',
+    icon: 'mixingTank',
+    status: '0',
+    detail: 'A区-监控设备21',
+    id: 5,
+  },
+  {
+    name: 'A-007',
+    icon: 'mixingPump',
+    status: '0',
+    detail: 'A区-监控设备4',
+    id: 6,
+  },
+  {
+    name: 'A-008',
+    detail: 'A区-监控设备3',
+    icon: 'mixingPump',
+    status: '0',
+    id: 7,
+  },
+  {
+    name: 'A-009',
+    detail: 'A区-监控设备9',
+    icon: 'mixingPump',
+    status: '0',
+    id: 8,
+  },
+  {
+    name: 'A-010',
+    detail: 'A区-监控设备10',
+    icon: 'solenoidValve',
+    status: '0',
+    id: 9,
+  },
+  {
+    name: 'A-008',
+    detail: 'A区-监控设备3',
+    icon: 'solenoidValve',
+    status: '0',
+    id: 10,
+  },
+  {
+    name: 'A-008',
+    detail: 'A区-监控设备3',
+    icon: 'solenoidValve',
+    status: '0',
+    id: 11,
+  },
+]);
+// #endregion
+/* --------------- methods --------------- */
+// #region
+
+// #endregion
+</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>