diff --git a/sub-operation-service/src/assets/images/smartFarm/logo2.png b/sub-operation-service/src/assets/images/smartFarm/logo2.png
new file mode 100644
index 0000000..f1628a9
Binary files /dev/null and b/sub-operation-service/src/assets/images/smartFarm/logo2.png differ
diff --git a/sub-operation-service/src/assets/images/smartFarm/message.png b/sub-operation-service/src/assets/images/smartFarm/message.png
new file mode 100644
index 0000000..2dc2daf
Binary files /dev/null and b/sub-operation-service/src/assets/images/smartFarm/message.png differ
diff --git a/sub-operation-service/src/assets/images/smartFarm/position.png b/sub-operation-service/src/assets/images/smartFarm/position.png
new file mode 100644
index 0000000..e0d30f6
Binary files /dev/null and b/sub-operation-service/src/assets/images/smartFarm/position.png differ
diff --git a/sub-operation-service/src/assets/images/smartFarm/优先级.png b/sub-operation-service/src/assets/images/smartFarm/优先级.png
new file mode 100644
index 0000000..fa17cef
Binary files /dev/null and b/sub-operation-service/src/assets/images/smartFarm/优先级.png differ
diff --git a/sub-operation-service/src/assets/images/smartFarm/认证.png b/sub-operation-service/src/assets/images/smartFarm/认证.png
new file mode 100644
index 0000000..6125c4b
Binary files /dev/null and b/sub-operation-service/src/assets/images/smartFarm/认证.png differ
diff --git a/sub-operation-service/src/router/index.js b/sub-operation-service/src/router/index.js
index 571aa99..6fbefbd 100644
--- a/sub-operation-service/src/router/index.js
+++ b/sub-operation-service/src/router/index.js
@@ -248,7 +248,7 @@ export const constantRoutes = [
             meta: { title: '使用申请' },
           },
           {
-            path: 'apply/:id',
+            path: 'brandApplyDetail',
             name: 'brandApplyDetail',
             component: () => import('@/views/brand/components/ApplyDetail.vue'),
             meta: { title: '产品申请' },
diff --git a/sub-operation-service/src/views/brand/components/ApplyDetail.vue b/sub-operation-service/src/views/brand/components/ApplyDetail.vue
index d1af96f..350fa50 100644
--- a/sub-operation-service/src/views/brand/components/ApplyDetail.vue
+++ b/sub-operation-service/src/views/brand/components/ApplyDetail.vue
@@ -19,7 +19,7 @@
       <el-form-item label="溯源码">
         <el-button type="primary" @click="uploadTraceCode">
           <template #icon>
-            <i class="el-icon-upload"></i>
+            <el-icon><Upload /></el-icon>
           </template>
           点击上传
         </el-button>
diff --git a/sub-operation-service/src/views/brand/components/ApplyList.vue b/sub-operation-service/src/views/brand/components/ApplyList.vue
index ba2b99a..ec3eb5e 100644
--- a/sub-operation-service/src/views/brand/components/ApplyList.vue
+++ b/sub-operation-service/src/views/brand/components/ApplyList.vue
@@ -24,9 +24,9 @@ const router = useRouter();
 const products = ref([]);
 
 // 获取商品数据
-getApplyList().then((res) => {
-  products.value = res.data;
-});
+// getApplyList().then((res) => {
+//   products.value = res.data;
+// });
 
 const applyData = [
   { id: 1, name: '耿马绿色蔬菜', imageUrl: 'images/brand/11.png' },
@@ -44,7 +44,7 @@ const applyData = [
 ];
 
 function gotoApplication(id) {
-  router.push(`/sub-operation-service/brand/apply/${id}`);
+  router.push('/sub-operation-service/brand/brandApplyDetail?id=' + id);
 }
 
 // TODO: 对接口需要删除这个方法
diff --git a/sub-operation-service/src/views/brand/index.vue b/sub-operation-service/src/views/brand/index.vue
index 34fea47..899c12f 100644
--- a/sub-operation-service/src/views/brand/index.vue
+++ b/sub-operation-service/src/views/brand/index.vue
@@ -52,7 +52,7 @@ const menuMap = {
 // 获取当前菜单激活项
 const activeMenu = computed(() => {
   const matched = Object.entries(menuMap).find(([key, names]) => names.includes(route.name));
-  console.log(matched[0]);
+  // console.log(matched[0]);
   return matched ? matched[0] : '';
 });
 // 菜单切换处理
diff --git a/sub-operation-service/src/views/ecommerce/components/goodSource.vue b/sub-operation-service/src/views/ecommerce/components/goodSource.vue
new file mode 100644
index 0000000..f76c64f
--- /dev/null
+++ b/sub-operation-service/src/views/ecommerce/components/goodSource.vue
@@ -0,0 +1,134 @@
+<template>
+  <div>
+    <el-card shadow="always">
+      <div class="route"><span style="cursor: pointer" @click.stop="changeDialog">采购商服务</span> <span>·</span> <span>采购服务</span></div>
+      <div style="display: flex; margin-top: 10px">
+        <img :src="getAssetsFile('images/smartFarm/logo2.png')" alt="" style="height: 150px; width: 150px" />
+        <div style="width: calc(100% - 150px); padding: 0 20px">
+          <div style="display: flex; justify-content: space-between; width: 100%; font-size: 18px; font-weight: bold">
+            <div>
+              耿马县勐简乡飘云生态农业<img
+                :src="getAssetsFile('images/smartFarm/优先级.png')"
+                alt=""
+                style="height: 20px; width: 20px; margin: 0 5px"
+              /><img :src="getAssetsFile('images/smartFarm/认证.png')" alt="" style="height: 20px; width: 20px" />
+            </div>
+            <div>
+              耿马县·勐简乡<img :src="getAssetsFile('images/smartFarm/position.png')" alt="" style="height: 20px; width: 20px; margin: 0 5px" />
+            </div>
+          </div>
+          <div class="shiming">已实名认证</div>
+          <div class="inTime">入驻时间： 37天</div>
+        </div>
+      </div>
+
+      <div style="display: flex; margin-top: 40px; justify-content: space-between">
+        <div class="between">
+          <div class="leftTitle">采购品种：</div>
+          <div class="rightValue">西红柿</div>
+        </div>
+        <div class="between">
+          <div class="leftTitle">采购数量：</div>
+          <div class="rightValue">5000kg</div>
+        </div>
+      </div>
+      <div style="display: flex; margin-top: 10px; justify-content: space-between">
+        <div class="between">
+          <div class="leftTitle">期望货源地：</div>
+          <div class="rightValue">耿马县·贺派乡</div>
+        </div>
+        <div class="between">
+          <div class="leftTitle">浏览次数：</div>
+          <div class="rightValue">188次</div>
+        </div>
+      </div>
+      <div style="display: flex; margin-top: 10px; justify-content: space-between">
+        <div class="between">
+          <div class="leftTitle">收获地：</div>
+          <div class="rightValue">耿马县·勐简乡</div>
+        </div>
+        <div class="between">
+          <div class="leftTitle">更新时间：</div>
+          <div class="rightValue">2025.01.01 11:11:11</div>
+        </div>
+      </div>
+      <div>
+        <el-button style="background-color: #25bf82; color: #ffffff; padding: 20px 30px; margin-top: 20px">
+          <template #icon>
+            <img :src="getAssetsFile('images/smartFarm/message.png')" alt="" style="height: 20px; width: 20px; margin: 0 5px" />
+          </template>
+          在线联系
+        </el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { getAssetsFile } from '@/utils/index.js';
+
+/* --------------- data --------------- */
+// #region
+const props = defineProps({
+  id: {
+    type: Number,
+    default: () => {
+      return 0;
+    },
+  },
+});
+// #endregion
+
+/* --------------- methods --------------- */
+// #region
+const emit = defineEmits(['updateStatus']); // 声明要触发的事件
+
+const changeDialog = () => {
+  const data = { message: false };
+  emit('updateStatus', data); // 触发事件并传递数据
+};
+// #endregion
+</script>
+
+<style lang="scss" scoped>
+.between {
+  width: 47%;
+  justify-content: space-between;
+  display: flex;
+  font-size: 18px;
+}
+.leftTitle {
+  font-weight: 400;
+  text-align: left;
+  color: #999999;
+}
+.rightValue {
+  font-weight: 400;
+  text-align: right;
+  color: #000000;
+}
+.shiming {
+  width: fit-content;
+  padding: 2px 5px;
+  margin-top: 20px;
+  background: rgba(37, 191, 130, 0.1);
+  border: 1px solid rgba(37, 191, 130, 0.5);
+  border-radius: 8px;
+  font-size: 14px;
+  font-weight: 400;
+  color: #25bf82;
+}
+.inTime {
+  font-size: 18px;
+  margin-top: 20px;
+  font-weight: 400;
+  text-align: left;
+  color: #999999;
+}
+.route {
+  font-size: 16px;
+  font-weight: 900;
+  text-align: left;
+}
+</style>
diff --git a/sub-operation-service/src/views/ecommerce/components/marketCharts.vue b/sub-operation-service/src/views/ecommerce/components/marketCharts.vue
index 158996a..dd53421 100644
--- a/sub-operation-service/src/views/ecommerce/components/marketCharts.vue
+++ b/sub-operation-service/src/views/ecommerce/components/marketCharts.vue
@@ -139,7 +139,7 @@ const chartsData = reactive({
           color: 'rgba(255, 255, 255, .6)',
         },
       },
-      extraCssText: 'box-shadow: 2px 2px 16px 1px rgba(0, 39, 102, 0.16)',
+      extraCssText: 'box-shadow: 2px 2px 16px 1px rgba(0, 39, 102, 0.16);z-index: 1',
       formatter: function (params) {
         let content = `<div style='font-size: 14px; color: #666;text-align:left'>${params[0].name}</div>`;
         if (Array.isArray(params)) {
diff --git a/sub-operation-service/src/views/ecommerce/components/purchaserPopup.vue b/sub-operation-service/src/views/ecommerce/components/purchaserPopup.vue
index 3263031..881ddb7 100644
--- a/sub-operation-service/src/views/ecommerce/components/purchaserPopup.vue
+++ b/sub-operation-service/src/views/ecommerce/components/purchaserPopup.vue
@@ -1,52 +1,99 @@
 <template>
   <div class="purchaser-popup-warp">
-    <el-dialog v-model="isShow" title="采购报价" width="800" :before-close="doCancel">
-      <el-form ref="ruleFormRef" :model="ruleForm" status-icon :rules="rules" label-width="auto" class="custom-form">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="商品分类" prop="typeId">
-              <el-cascader v-model="ruleForm.typeId" :options="treeList" :props="treeOption" clearable :placeholder="'请选择分类'" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="收购价格" prop="price">
-              <el-input-number v-model="ruleForm.price" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="采购商品" prop="goods">
-              <el-input v-model="ruleForm.goods" style="width: 200px" />
-            </el-form-item>
-          </el-col>
+    <el-dialog v-model="isShow" title="" width="80%" :before-close="doCancel" style="border-radius: 16px; padding: 40px 80px">
+      <el-form ref="ruleFormRef" :model="ruleForm" status-icon label-width="auto" class="custom-form">
+        <!--        <el-row :gutter="20">-->
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label="商品分类" prop="typeId">-->
+        <!--              <el-cascader v-model="ruleForm.typeId" :options="treeList" :props="treeOption" clearable :placeholder="'请选择分类'" />-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label="收购价格" prop="price">-->
+        <!--              <el-input-number v-model="ruleForm.price" />-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label="采购商品" prop="goods">-->
+        <!--              <el-input v-model="ruleForm.goods" style="width: 200px" />-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
 
-          <el-col :span="12">
-            <el-form-item label="收购数量" prop="num">
-              <el-input-number v-model="ruleForm.num" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="收货地址" prop="addr">
-              <el-input v-model="ruleForm.addr" :rows="2" type="textarea" :placeholder="'收货地址'" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label=" " prop="isPickup">
-              <el-radio-group v-model="ruleForm.isPickup">
-                <el-radio v-for="(n, index) in pickupOptions" :key="index" :value="n.value">{{ n.label }}</el-radio>
-              </el-radio-group>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="采购说明" prop="remark">
-              <el-input v-model="ruleForm.remark" :rows="2" type="textarea" :placeholder="'采购说明'" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label="收购数量" prop="num">-->
+        <!--              <el-input-number v-model="ruleForm.num" />-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label="收货地址" prop="addr">-->
+        <!--              <el-input v-model="ruleForm.addr" :rows="2" type="textarea" :placeholder="'收货地址'" />-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label=" " prop="isPickup">-->
+        <!--              <el-radio-group v-model="ruleForm.isPickup">-->
+        <!--                <el-radio v-for="(n, index) in pickupOptions" :key="index" :value="n.value">{{ n.label }}</el-radio>-->
+        <!--              </el-radio-group>-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label="采购说明" prop="remark">-->
+        <!--              <el-input v-model="ruleForm.remark" :rows="2" type="textarea" :placeholder="'采购说明'" />-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
+        <!--        </el-row>-->
+        <div style="display: flex; justify-content: flex-start">
+          <el-form-item label="分类名称：" prop="typeId" style="width: 50%">
+            <el-cascader
+              v-model="ruleForm.typeId"
+              :options="treeList"
+              :props="treeOption"
+              clearable
+              :placeholder="'请选择分类'"
+              style="width: 100%; border-radius: 10px; height: 30px"
+            />
+          </el-form-item>
+          <div style="width: 5%">&nbsp;</div>
+          <div class="inputs">
+            <span class="labels">收购价格：</span>
+            <input type="text" placeholder="请输入" />
+          </div>
+        </div>
+        <div style="display: flex; justify-content: flex-start; text-align: left; margin-top: 20px">
+          <div class="inputs">
+            <span class="labels">采购商品：</span>
+            <input type="text" placeholder="请输入" />
+          </div>
+          <div style="width: 5%">&nbsp;</div>
+          <div class="inputs unit">
+            <span class="labels">收购数量：</span>
+            <input type="text" placeholder="请输入" />
+          </div>
+        </div>
+        <div style="display: flex; justify-content: flex-start; text-align: left; margin-top: 20px">
+          <div class="inputs">
+            <span class="labels">收货地址：</span>
+            <input type="text" placeholder="请输入" />
+          </div>
+          <div style="width: 5%">&nbsp;</div>
+          <div class="inputs">
+            <el-radio-group v-model="formData.toHome">
+              <el-radio value="1" size="large">可上门收货</el-radio>
+              <el-radio value="0" size="large">不上门收货</el-radio>
+            </el-radio-group>
+          </div>
+        </div>
+        <div style="display: flex; justify-content: flex-start; text-align: left; margin-top: 20px">
+          <div class="inputs" style="width: 100%">
+            <span class="labels" style="width: 14%">收货地址：</span>
+            <el-input v-model="formData.address" maxlength="30" style="width: 100%" placeholder="请输入" show-word-limit type="textarea" />
+          </div>
+        </div>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
-          <el-button @click="doCancel">取消</el-button>
-          <el-button type="primary" @click="doSure"> 确定 </el-button>
+          <el-button type="primary" style="height: 40px; width: 120px" @click="doSure"> 确认 </el-button>
+          <el-button style="height: 40px; width: 120px" @click="doCancel">取消</el-button>
         </div>
       </template>
     </el-dialog>
@@ -59,6 +106,10 @@ import { useRoute, useRouter } from 'vue-router';
 import { fa } from 'element-plus/es/locale/index.mjs';
 const route = useRoute();
 const router = useRouter();
+const formData = ref({
+  toHome: '0',
+  address: '',
+});
 
 const props = defineProps({
   list: {
@@ -133,6 +184,40 @@ defineExpose({
 });
 </script>
 <style lang="scss" scoped>
+.dialog-footer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 20px;
+}
+.unit::after {
+  content: 'kg';
+  position: absolute;
+  right: 10px; /* 调整单位与输入框的距离 */
+  color: #000; /* 单位颜色 */
+  pointer-events: none; /* 防止单位遮挡输入框 */
+}
+.unit input {
+}
+.inputs {
+  color: #999999;
+  font-size: 18px;
+  width: 50%;
+  position: relative;
+  display: flex;
+  align-items: center;
+  .labels {
+    width: 25%;
+    margin-right: 10px;
+  }
+  input {
+    width: calc(74% - 20px);
+    border: 1px solid #999999;
+    border-radius: 10px;
+    height: 30px;
+    padding-left: 15px;
+  }
+}
 .purchaser-popup-warp {
 }
 .custom-form {
@@ -148,4 +233,10 @@ defineExpose({
     }
   }
 }
+.el-input__inner {
+  height: 30px !important;
+  border-radius: 10px;
+  font-size: 18px;
+  color: #999999;
+}
 </style>
diff --git a/sub-operation-service/src/views/ecommerce/purchaser.vue b/sub-operation-service/src/views/ecommerce/purchaser.vue
index 3ee3522..81805a5 100644
--- a/sub-operation-service/src/views/ecommerce/purchaser.vue
+++ b/sub-operation-service/src/views/ecommerce/purchaser.vue
@@ -2,22 +2,29 @@
   <div class="purchaser-index-warp">
     <common current-name="purchaser">
       <template #main>
-        <el-row class="purchaser-top">
-          <el-col :span="12">
-            <div class="purchaser-top-title">行情动态</div>
-            <div class="purchaser-charts">
-              <marketCharts></marketCharts>
-            </div>
-          </el-col>
-          <el-col :span="12">
-            <div class="purchaser-top-title">近7天热门产品</div>
-            <div class="purchaser-charts">
-              <hotGoodsWordClould></hotGoodsWordClould>
-            </div>
-          </el-col>
-        </el-row>
-        <filtertop :list="treeList"></filtertop>
-
+        <div v-if="showDetail">
+          <el-row class="purchaser-top">
+            <el-col :span="12">
+              <div class="purchaser-top-title">行情动态</div>
+              <div class="purchaser-charts">
+                <marketCharts :height="'180'"></marketCharts>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="purchaser-top-title">近7天热门产品</div>
+              <div class="purchaser-charts">
+                <hotGoodsWordClould></hotGoodsWordClould>
+              </div>
+              <div>
+                <el-button type="success" @click.stop="handleClick">一键发布采购信息</el-button>
+              </div>
+            </el-col>
+          </el-row>
+          <filtertop :list="treeList"></filtertop>
+        </div>
+        <div v-else>
+          <good-source :id="detailId" @update-status="handleUpdate"></good-source>
+        </div>
         <div class="hot-list-warp">
           <el-row :gutter="10">
             <el-col :span="8" align="left">
@@ -39,7 +46,7 @@
                 <el-table-column prop="buyer" label="采购时间" />
                 <el-table-column fixed="right" label="操作">
                   <template #default>
-                    <el-button link type="primary" size="small" @click.stop="handleClick"> 去报价 </el-button>
+                    <el-button link type="primary" size="small"> 去报价 </el-button>
                   </template>
                 </el-table-column>
               </el-table>
@@ -61,6 +68,8 @@ import purchaserPopup from './components/purchaserPopup.vue';
 import { ref, reactive, onMounted, watch, computed } from 'vue';
 import { getRegion } from '@/apis/index';
 import { useRoute, useRouter } from 'vue-router';
+import { transaction } from '@/apis/agricultural.js';
+import GoodSource from '@/views/ecommerce/components/goodSource.vue';
 const route = useRoute();
 const router = useRouter();
 
@@ -115,67 +124,10 @@ let treeList = reactive([
       },
     ],
   },
-  {
-    id: '02',
-    name: '种子种苗',
-    children: [
-      {
-        parentId: '02',
-        id: '0101',
-        name: '花卉种子种苗',
-        children: [
-          { parentId: '0101', id: '010101', name: '草本花卉' },
-          { parentId: '0101', id: '010102', name: '木本花卉' },
-          { parentId: '0101', id: '010103', name: '野生花卉' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0102',
-        name: '蔬菜种子种苗',
-        children: [
-          { parentId: '0102', id: '010201', name: '叶菜类' },
-          { parentId: '0102', id: '010202', name: '根茎类' },
-          { parentId: '0102', id: '010203', name: '果实类' },
-          { parentId: '0102', id: '010204', name: '豆类' },
-          { parentId: '0102', id: '010205', name: '瓜类' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0103',
-        name: '果树种苗',
-        children: [
-          { parentId: '0103', id: '010301', name: '柑橘类' },
-          { parentId: '0103', id: '010302', name: '仁果类' },
-          { parentId: '0103', id: '010303', name: '核果类' },
-          { parentId: '0103', id: '010304', name: '浆果类' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0104',
-        name: '药材种子与种苗',
-        children: [
-          { parentId: '0104', id: '010401', name: '寒地龙药' },
-          { parentId: '0104', id: '010402', name: '常见中药材' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0105',
-        name: '其他作物',
-        children: [
-          { parentId: '0105', id: '010501', name: '牧草' },
-          { parentId: '0105', id: '010502', name: '经济作物' },
-          { parentId: '0105', id: '010503', name: '观赏树木' },
-        ],
-      },
-    ],
-  },
 ]);
-
+const showDetail = ref(true);
 let popupQuote = ref(null);
+const detailId = ref(0);
 
 const typeTree = ref([]);
 const treeOption = ref({
@@ -194,6 +146,15 @@ const getTree = () => {
   });
 };
 
+const getTreeList = () => {
+  transaction().then((res) => {
+    if (res.code === 200) {
+      let a = res.data.sort((a, b) => Number(b.id) - Number(a.id));
+      treeList.splice(0, treeList.length, ...a);
+    }
+  });
+};
+
 const handleClick = () => {
   popupQuote.value && popupQuote.value.doShow();
 };
@@ -218,15 +179,33 @@ let tableData = reactive([
 ]);
 
 const rowClick = (data) => {
-  router.push('/sub-operation-service/ecommerce-purchaserDetail?id=' + data.id);
+  // router.push('/sub-operation-service/ecommerce-purchaserDetail?id=' + data.id);
+  detailId.value = data.id;
+  showDetail.value = false;
+};
+
+const handleUpdate = (data) => {
+  // console.log(data);
+  showDetail.value = !showDetail.value;
 };
 
 onMounted(() => {
   console.info('onMounted');
   getTree();
+  getTreeList();
 });
 </script>
 <style lang="scss" scoped>
+/* 确保 ElementUI 弹出层有更高的 z-index */
+.el-dialog {
+  z-index: 2000 !important;
+}
+
+/* 降低 ECharts tooltip 的 z-index */
+div[class^='zr-element'],
+.echarts-tooltip {
+  z-index: 1000 !important;
+}
 .purchaser-index-warp {
   width: 100%;
   .purchaser-top {
diff --git a/sub-operation-service/src/views/ecommerce/supplier.vue b/sub-operation-service/src/views/ecommerce/supplier.vue
index c7b685e..7c3362e 100644
--- a/sub-operation-service/src/views/ecommerce/supplier.vue
+++ b/sub-operation-service/src/views/ecommerce/supplier.vue
@@ -3,15 +3,25 @@
     <common current-name="supplier">
       <template #main>
         <banner name="supplier" :imglist="bannerList"></banner>
-        <filtertop :list="treeList"></filtertop>
+        <filtertop :list="treeList" @select="selected"></filtertop>
         <div class="goods-list-warp">
           <div class="goods-list">
-            <template v-for="(n, index) in 16" :key="index">
+            <template v-for="(n, index) in list" :key="n.id">
               <div class="goods-item">
-                <goodsItem></goodsItem>
+                <goodsItem :data="n"></goodsItem>
               </div>
             </template>
           </div>
+          <el-pagination
+            :current-page="pagination.current"
+            :page-sizes="[10, 20, 50, 100]"
+            :page-size="pagination.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="pagination.total"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+          >
+          </el-pagination>
         </div>
       </template>
     </common>
@@ -23,118 +33,73 @@ import banner from './components/banner.vue';
 import filtertop from './components/filtertop.vue';
 import goodsItem from './components/goodsItem.vue';
 import { ref, reactive, onMounted, watch, computed } from 'vue';
-let treeList = reactive([
-  {
-    id: '01',
-    name: '农产品',
-    children: [
-      {
-        parentId: '01',
-        id: '0101',
-        name: '植物性农产品',
-        children: [
-          { parentId: '0101', id: '010101', name: '谷物' },
-          { parentId: '0101', id: '010102', name: '蔬菜' },
-          { parentId: '0101', id: '010103', name: '水果' },
-          { parentId: '0101', id: '010104', name: '坚果与油料作物' },
-          { parentId: '0101', id: '010105', name: '糖料作物' },
-          { parentId: '0101', id: '010106', name: '纤维作物' },
-          { parentId: '0101', id: '010107', name: '茶叶' },
-          { parentId: '0101', id: '010108', name: '咖啡' },
-          { parentId: '0101', id: '010109', name: '香料' },
-        ],
-      },
-      {
-        parentId: '01',
-        id: '0102',
-        name: '动物性农产品',
-        children: [
-          { parentId: '0102', id: '010201', name: '肉类' },
-          { parentId: '0102', id: '010202', name: '奶制品' },
-          { parentId: '0102', id: '010203', name: '蛋类' },
-          { parentId: '0102', id: '010204', name: '蜂蜜' },
-          { parentId: '0102', id: '010205', name: '水产品' },
-        ],
-      },
-      {
-        parentId: '01',
-        id: '0103',
-        name: '特殊农产品',
-        children: [
-          { parentId: '0103', id: '010301', name: '花卉与苗木' },
-          { parentId: '0103', id: '010302', name: '药材' },
-          { parentId: '0103', id: '010303', name: '菌类' },
-        ],
-      },
-      {
-        parentId: '01',
-        id: '0104',
-        name: '其他',
-        children: [{ parentId: '0104', id: '010401', name: '饲料' }],
-      },
-    ],
-  },
-  {
-    id: '02',
-    name: '种子种苗',
-    children: [
-      {
-        parentId: '02',
-        id: '0101',
-        name: '花卉种子种苗',
-        children: [
-          { parentId: '0101', id: '010101', name: '草本花卉' },
-          { parentId: '0101', id: '010102', name: '木本花卉' },
-          { parentId: '0101', id: '010103', name: '野生花卉' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0102',
-        name: '蔬菜种子种苗',
-        children: [
-          { parentId: '0102', id: '010201', name: '叶菜类' },
-          { parentId: '0102', id: '010202', name: '根茎类' },
-          { parentId: '0102', id: '010203', name: '果实类' },
-          { parentId: '0102', id: '010204', name: '豆类' },
-          { parentId: '0102', id: '010205', name: '瓜类' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0103',
-        name: '果树种苗',
-        children: [
-          { parentId: '0103', id: '010301', name: '柑橘类' },
-          { parentId: '0103', id: '010302', name: '仁果类' },
-          { parentId: '0103', id: '010303', name: '核果类' },
-          { parentId: '0103', id: '010304', name: '浆果类' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0104',
-        name: '药材种子与种苗',
-        children: [
-          { parentId: '0104', id: '010401', name: '寒地龙药' },
-          { parentId: '0104', id: '010402', name: '常见中药材' },
-        ],
-      },
-      {
-        parentId: '02',
-        id: '0105',
-        name: '其他作物',
-        children: [
-          { parentId: '0105', id: '010501', name: '牧草' },
-          { parentId: '0105', id: '010502', name: '经济作物' },
-          { parentId: '0105', id: '010503', name: '观赏树木' },
-        ],
-      },
-    ],
-  },
-]);
+import { agriculturalList, transaction } from '@/apis/agricultural.js';
+let treeList = reactive([]);
 
+let list = reactive([]);
+let params = reactive({
+  current: 1,
+  size: 10,
+  parentId: null,
+  childrenId: null,
+});
+let pagination = reactive({
+  current: 1,
+  size: 10,
+  total: 0,
+});
 let bannerList = reactive(['images/ecommerce/' + 'banner1.png', 'images/ecommerce/' + 'banner1.png']);
+const getList = () => {
+  params.current = pagination.current;
+  params.size = pagination.size;
+  agriculturalList(params).then((res) => {
+    if (res.code === 200) {
+      list.splice(0, list.length, ...res.data.records);
+      pagination.total = res.data.total;
+    }
+  });
+};
+
+onMounted(() => {
+  getList();
+  getTree();
+});
+
+const handleSizeChange = (val) => {
+  pagination.size = val;
+  getList();
+};
+const handleCurrentChange = (val) => {
+  pagination.current = val;
+  getList();
+};
+const getTree = () => {
+  transaction().then((res) => {
+    if (res.code === 200) {
+      let a = res.data.sort((a, b) => Number(b.id) - Number(a.id));
+      treeList.splice(0, treeList.length, ...a);
+      // console.log('treeList', treeList);
+    }
+  });
+};
+
+const selected = (data) => {
+  // 获取所有值并转为数组
+  const val = Object.values(data);
+  console.log(data);
+  if (val.length === 1) {
+    params.parentId = val[0].id;
+  } else {
+    if (val[0].id === '') {
+      params.childrenId = '';
+      params.parentId = null;
+    } else {
+      params.childrenId = val[val.length - 1].id;
+      params.parentId = val[val.length - 1].parentId;
+    }
+  }
+  getList();
+};
 </script>
 <style lang="scss" scoped>
 .goods-list-warp {
diff --git a/sub-operation-service/src/views/smartFarm/components/devices.vue b/sub-operation-service/src/views/smartFarm/components/devices.vue
index 1a4ca56..f558ffc 100644
--- a/sub-operation-service/src/views/smartFarm/components/devices.vue
+++ b/sub-operation-service/src/views/smartFarm/components/devices.vue
@@ -5,6 +5,8 @@ import { useRoute, useRouter } from 'vue-router';
 const route = useRoute();
 const router = useRouter();
 
+const currentDevice = ref(0);
+
 // 图标icon对照表
 const icons = [
   { 监控: 'camera' },
@@ -61,7 +63,13 @@ const props = defineProps({
 <template>
   <div>
     <el-card style="border-radius: 16px">
-      <div style="font-size: 16px; font-weight: bold; text-align: left; color: #000; margin-bottom: 20px">{{ title }}</div>
+      <div style="color: #999999; line-height: 25px; text-align: left">
+        当前设备组
+        <el-select v-model="currentDevice" placeholder="Select" size="small" style="width: 160px; margin-left: 10px">
+          <el-option v-for="item in devices" :key="item.value" :label="item.detail" :value="item.id" />
+        </el-select>
+      </div>
+      <div style="font-size: 16px; font-weight: bold; text-align: left; color: #000; margin: 15px 0">{{ title }}</div>
       <div style="display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 20px">
         <div v-for="(item, index) in devices" :key="index" class="device">
           <div v-if="item.status == 1" class="status" style="background-color: #25bf82">正常</div>
diff --git a/sub-operation-service/src/views/smartFarm/components/stream.vue b/sub-operation-service/src/views/smartFarm/components/stream.vue
index 672a317..ad43f70 100644
--- a/sub-operation-service/src/views/smartFarm/components/stream.vue
+++ b/sub-operation-service/src/views/smartFarm/components/stream.vue
@@ -81,6 +81,14 @@ onMounted(async () => {
   <el-card style="border-radius: 16px">
     <div style="display: flex; justify-content: space-between">
       <div style="font-size: 16px; font-weight: bold; text-align: left">{{ title }}</div>
+      <div>
+        <div>当前设备状态：</div>
+        <div>
+          <div class="dot"></div>
+          <span>正常</span>
+        </div>
+      </div>
+
       <div style="color: #999999; line-height: 25px">
         当前设备
         <el-select v-model="currentDevice" placeholder="Select" size="small" style="width: 160px; margin-left: 10px">
@@ -125,4 +133,11 @@ onMounted(async () => {
     cursor: pointer;
   }
 }
+.dot {
+  height: 10px;
+  width: 10px;
+  display: inline-block;
+  border-radius: 90px;
+  background-color: #25bf82;
+}
 </style>
diff --git a/sub-operation-service/src/views/smartFarm/inspection/IntelligentIrrigation.vue b/sub-operation-service/src/views/smartFarm/inspection/IntelligentIrrigation.vue
index e744020..c19d5c5 100644
--- a/sub-operation-service/src/views/smartFarm/inspection/IntelligentIrrigation.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/IntelligentIrrigation.vue
@@ -29,13 +29,6 @@ const devices = ref([
     status: '1', //  0: 离线 1: 正常 -1: 异常
     id: 0,
   },
-  {
-    name: 'A-002',
-    icon: 'temperature',
-    detail: 'A区-监控设备66',
-    status: '1',
-    id: 1,
-  },
   {
     name: 'A-003',
     icon: 'humidity',
@@ -43,13 +36,6 @@ const devices = ref([
     status: '0',
     id: 2,
   },
-  {
-    name: 'A-004',
-    icon: 'humidity',
-    detail: 'A区-监控设备1',
-    status: '-1',
-    id: 3,
-  },
   {
     name: 'A-005',
     icon: 'valve',
@@ -57,13 +43,6 @@ const devices = ref([
     status: '-1',
     id: 4,
   },
-  {
-    name: 'A-006',
-    icon: 'valve',
-    status: '0',
-    detail: 'A区-监控设备21',
-    id: 5,
-  },
   {
     name: 'A-007',
     icon: 'sprinkler',
@@ -71,13 +50,6 @@ const devices = ref([
     detail: 'A区-监控设备4',
     id: 6,
   },
-  {
-    name: 'A-008',
-    detail: 'A区-监控设备3',
-    icon: 'sprinkler',
-    status: '-1',
-    id: 7,
-  },
   {
     name: 'A-009',
     detail: 'A区-监控设备9',
@@ -85,13 +57,6 @@ const devices = ref([
     status: '-1',
     id: 8,
   },
-  {
-    name: 'A-010',
-    detail: 'A区-监控设备10',
-    icon: 'waterSupplyValve',
-    status: '0',
-    id: 9,
-  },
   {
     name: 'A-011',
     detail: 'A区-监控设备3',
@@ -99,13 +64,6 @@ const devices = ref([
     status: '1',
     id: 10,
   },
-  {
-    name: 'A-012',
-    detail: 'A区-监控设备3',
-    icon: 'intelligentValveControl',
-    status: '1',
-    id: 11,
-  },
 ]);
 
 const srcList = ref(['https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg']);
diff --git a/sub-operation-service/src/views/smartFarm/inspection/IntelligentSeedSoaking.vue b/sub-operation-service/src/views/smartFarm/inspection/IntelligentSeedSoaking.vue
index 1359ff4..2b88201 100644
--- a/sub-operation-service/src/views/smartFarm/inspection/IntelligentSeedSoaking.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/IntelligentSeedSoaking.vue
@@ -29,13 +29,6 @@ const devices = ref([
     status: '1', //  0: 离线 1: 正常 -1: 异常
     id: 0,
   },
-  {
-    name: 'A-002',
-    icon: 'tempSensor',
-    detail: 'A区-监控设备66',
-    status: '1',
-    id: 1,
-  },
   {
     name: 'A-003',
     icon: 'heater',
@@ -43,13 +36,6 @@ const devices = ref([
     status: '1',
     id: 2,
   },
-  {
-    name: 'A-004',
-    icon: 'heater',
-    detail: 'A区-监控设备1',
-    status: '-1',
-    id: 3,
-  },
   {
     name: 'A-005',
     icon: 'heat',
@@ -57,13 +43,6 @@ const devices = ref([
     status: '1',
     id: 4,
   },
-  {
-    name: 'A-006',
-    icon: 'disinfectionLamp',
-    status: '0',
-    detail: 'A区-监控设备21',
-    id: 5,
-  },
   {
     name: 'A-007',
     icon: 'timer',
@@ -71,13 +50,6 @@ const devices = ref([
     detail: 'A区-监控设备4',
     id: 6,
   },
-  {
-    name: 'A-008',
-    detail: 'A区-监控设备3',
-    icon: 'timer',
-    status: '-1',
-    id: 7,
-  },
   {
     name: 'A-009',
     detail: 'A区-监控设备9',
@@ -92,13 +64,6 @@ const devices = ref([
     status: '1',
     id: 9,
   },
-  {
-    name: 'A-011',
-    detail: 'A区-监控设备3',
-    icon: 'liquidSensor',
-    status: '0',
-    id: 10,
-  },
   {
     name: 'A-012',
     detail: 'A区-监控设备3',
diff --git a/sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue b/sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue
index 9e4b2c9..ba831b5 100644
--- a/sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue
@@ -17,13 +17,6 @@ const devices = ref([
     status: '1',
     id: 0,
   },
-  {
-    name: 'A-002',
-    icon: 'temp',
-    detail: 'A区-监控设备2',
-    status: '1',
-    id: 1,
-  },
   {
     name: 'A-003',
     icon: 'ph',
@@ -31,13 +24,6 @@ const devices = ref([
     status: '1',
     id: 2,
   },
-  {
-    name: 'A-004',
-    icon: 'ph',
-    detail: 'A区-监控设备4',
-    status: '-1',
-    id: 3,
-  },
   {
     name: 'A-005',
     icon: 'O2',
@@ -59,20 +45,6 @@ const devices = ref([
     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',
@@ -87,13 +59,6 @@ const devices = ref([
     status: '1',
     id: 10,
   },
-  {
-    name: 'B-006',
-    icon: 'float',
-    detail: 'B区-监控设备6',
-    status: '1',
-    id: 11,
-  },
 ]);
 const rules = ref([
   {
diff --git a/sub-operation-service/src/views/smartFarm/inspection/envInspection.vue b/sub-operation-service/src/views/smartFarm/inspection/envInspection.vue
index df7a24a..26a8620 100644
--- a/sub-operation-service/src/views/smartFarm/inspection/envInspection.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/envInspection.vue
@@ -10,6 +10,13 @@
             <el-card style="width: 60%; margin-right: 20px; border-radius: 16px">
               <div style="display: flex; justify-content: space-between">
                 <div style="font-size: 16px; font-weight: bold; text-align: left">实时环境监测</div>
+                <div>
+                  <div>当前设备状态：</div>
+                  <div>
+                    <div class="dot"></div>
+                    <span>正常</span>
+                  </div>
+                </div>
                 <div style="color: #999999; line-height: 25px">
                   当前设备
                   <el-select
@@ -91,20 +98,6 @@ const devices = ref([
     status: '1',
     id: 0,
   },
-  {
-    name: 'A-002',
-    icon: 'temp',
-    detail: 'A区-监控设备2',
-    status: '1',
-    id: 1,
-  },
-  {
-    name: 'A-003',
-    icon: 'temp',
-    detail: 'A区-监控设备3',
-    status: '1',
-    id: 2,
-  },
   {
     name: 'A-004',
     icon: 'soilSensor',
@@ -119,13 +112,6 @@ const devices = ref([
     status: '1',
     id: 4,
   },
-  {
-    name: 'A-006',
-    icon: 'anemometer',
-    detail: 'A区-监控设备6',
-    status: '0',
-    id: 5,
-  },
   {
     name: 'B-001',
     icon: 'rainGauge',
@@ -133,13 +119,6 @@ const devices = ref([
     status: '1',
     id: 6,
   },
-  {
-    name: 'B-002',
-    icon: 'rainGauge',
-    detail: 'B区-监控设备2',
-    status: '-1',
-    id: 7,
-  },
   {
     name: 'B-003',
     icon: 'waterLoggingSensor',
@@ -154,13 +133,6 @@ const devices = ref([
     status: '1',
     id: 9,
   },
-  {
-    name: 'B-005',
-    icon: 'PM2.5',
-    detail: 'B区-监控设备5',
-    status: '1',
-    id: 10,
-  },
   {
     name: 'B-006',
     icon: 'light',
@@ -260,6 +232,13 @@ const chooseIcon = (type) => {
 </script>
 
 <style lang="scss" scoped>
+.dot {
+  height: 10px;
+  width: 10px;
+  display: inline-block;
+  border-radius: 90px;
+  background-color: #25bf82;
+}
 .plantStatus {
   display: flex;
   justify-content: space-between;
diff --git a/sub-operation-service/src/views/smartFarm/inspection/fieldInspection.vue b/sub-operation-service/src/views/smartFarm/inspection/fieldInspection.vue
index 7504c30..bd01df0 100644
--- a/sub-operation-service/src/views/smartFarm/inspection/fieldInspection.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/fieldInspection.vue
@@ -71,27 +71,6 @@ const devices = ref([
     status: '1',
     id: 0,
   },
-  {
-    name: 'A-002',
-    icon: 'camera',
-    detail: 'A区-监控设备66',
-    status: '1',
-    id: 1,
-  },
-  {
-    name: 'A-003',
-    icon: 'sensor',
-    detail: 'A区-监控设备7',
-    status: '0',
-    id: 2,
-  },
-  {
-    name: 'A-004',
-    icon: 'sensor',
-    detail: 'A区-监控设备1',
-    status: '-1',
-    id: 3,
-  },
   {
     name: 'A-005',
     icon: 'sensor',
@@ -99,27 +78,6 @@ const devices = ref([
     status: '-1',
     id: 4,
   },
-  {
-    name: 'A-006',
-    icon: 'camera',
-    status: '0',
-    detail: 'A区-监控设备21',
-    id: 5,
-  },
-  {
-    name: 'A-007',
-    icon: 'camera',
-    status: '0',
-    detail: 'A区-监控设备4',
-    id: 6,
-  },
-  {
-    name: 'A-008',
-    detail: 'A区-监控设备3',
-    icon: 'camera',
-    status: '0',
-    id: 7,
-  },
 ]);
 
 // #endregion
diff --git a/sub-operation-service/src/views/smartFarm/inspection/intelligentFertilizer.vue b/sub-operation-service/src/views/smartFarm/inspection/intelligentFertilizer.vue
index 440f165..e9f9a0c 100644
--- a/sub-operation-service/src/views/smartFarm/inspection/intelligentFertilizer.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/intelligentFertilizer.vue
@@ -60,13 +60,6 @@ const devices = ref([
     status: '0',
     id: 0,
   },
-  {
-    name: 'A-002',
-    icon: 'fertilizerTank',
-    detail: 'A区-监控设备66',
-    status: '0',
-    id: 1,
-  },
   {
     name: 'A-003',
     icon: 'fertilization',
@@ -81,20 +74,6 @@ const devices = ref([
     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',
@@ -102,20 +81,6 @@ const devices = ref([
     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',
@@ -123,20 +88,6 @@ const devices = ref([
     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 --------------- */
diff --git a/sub-operation-service/src/views/smartFarm/inspection/waterInspection.vue b/sub-operation-service/src/views/smartFarm/inspection/waterInspection.vue
index cd955de..029f359 100644
--- a/sub-operation-service/src/views/smartFarm/inspection/waterInspection.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/waterInspection.vue
@@ -15,13 +15,6 @@ const devices = ref([
     status: '1',
     id: 0,
   },
-  {
-    name: 'A-002',
-    icon: 'temp',
-    detail: 'A区-监控设备2',
-    status: '1',
-    id: 1,
-  },
   {
     name: 'A-003',
     icon: 'ph',
@@ -29,13 +22,6 @@ const devices = ref([
     status: '1',
     id: 2,
   },
-  {
-    name: 'A-004',
-    icon: 'ph',
-    detail: 'A区-监控设备4',
-    status: '-1',
-    id: 3,
-  },
   {
     name: 'A-005',
     icon: 'O2',
@@ -57,13 +43,6 @@ const devices = ref([
     status: '1',
     id: 6,
   },
-  {
-    name: 'B-002',
-    icon: 'elect',
-    detail: 'B区-监控设备2',
-    status: '-1',
-    id: 7,
-  },
   {
     name: 'B-003',
     icon: 'dust',
@@ -71,13 +50,6 @@ const devices = ref([
     status: '1',
     id: 8,
   },
-  {
-    name: 'B-004',
-    icon: 'dust',
-    detail: 'B区-监控设备4',
-    status: '1',
-    id: 9,
-  },
   {
     name: 'B-005',
     icon: 'float',
@@ -85,13 +57,6 @@ const devices = ref([
     status: '1',
     id: 10,
   },
-  {
-    name: 'B-006',
-    icon: 'float',
-    detail: 'B区-监控设备6',
-    status: '1',
-    id: 11,
-  },
 ]);
 const rules = ref([
   {
@@ -183,6 +148,13 @@ const chooseIcon = (type) => {
           <el-card style="border-radius: 16px; width: 58%; height: fit-content">
             <div style="display: flex; justify-content: space-between">
               <div style="font-size: 16px; font-weight: bold; text-align: left">实时水质监测</div>
+              <div>
+                <div>当前设备状态：</div>
+                <div>
+                  <div class="dot"></div>
+                  <span>正常</span>
+                </div>
+              </div>
               <div style="color: #999999; line-height: 25px">
                 当前设备
                 <el-select v-model="currentDevice" placeholder="Select" size="small" style="width: 160px; margin-left: 10px">
@@ -250,4 +222,11 @@ const chooseIcon = (type) => {
     height: 20px;
   }
 }
+.dot {
+  height: 10px;
+  width: 10px;
+  display: inline-block;
+  border-radius: 90px;
+  background-color: #25bf82;
+}
 </style>