feat:增加机巢数据和巡检详情

chenyao

2025-03-29 48bc5ec76be628ed581d3201150bddaeaadeed3e

 src/views/Home/components/HomeLeft/OverviewNext.vue

@@ -28,11 +28,11 @@
      </div>
      <div class="table-item" v-for="item in tableList">
        <div class="name">
          <img class="yjzx-img" width="10" height="10" src="@/assets/images/table-zx.png" alt="" />
          <img width="13" height="15" src="@/assets/images/table-icon.png" alt="" />
          <img class="yjzx-img" width="10" height="10" src="@/assets/images/home/homeLeft/table-zx.png" alt="" />
          <img width="13" height="15" src="@/assets/images/home/homeLeft/table-icon.png" alt="" />
          {{ item.name }}
        </div>
        <div class="status">{{ item.status }}</div>
        <div class="status" @click="signMachineNestClick">{{ item.status }}</div>
      </div>
    </div>
  </div>
@@ -41,6 +41,8 @@
import { pxToRem } from '@/utils/rem';
import { Search } from '@element-plus/icons-vue';
import CommonTitle from '@/components/CommonTitle.vue';
import { getDeviceInfoNum } from '@/api/home/machineNest.js'
import router from '@/router/';

const list = ref([
  { name: '执行中', value: 89, color: '#FFA768' },
@@ -56,9 +58,29 @@
  { name: '小兰工业园3号', status: '预计执行' },
]);

// 获取机巢列表
const getList = () => {
  getDeviceInfoNum().then((res) => {
    console.log(res);
  });
}
// 单个机巢详情
const signMachineNestClick = () => {
  router.push({
    path: '/signMachineNest',
    query: {
      id: '123'  // 这里可以传递你需要的参数
    }
  });
}

const detailsFun = () => {
  console.log('details');
};

onMounted(() => {
  getList();
});
</script>
<style scoped lang="scss">
.overview-next {
@@ -78,7 +100,7 @@
  .next-num {
    width: 358px;
    height: 92px;
    background: url(@/assets/images/next-num.png) no-repeat center / 100% 100%;
    background: url(@/assets/images/home/homeLeft/next-num.png) no-repeat center / 100% 100%;
    position: relative;
    .total {
      position: absolute;
@@ -163,6 +185,7 @@
      }
      .status {
        color: #6fc3ff;
        cursor: pointer;
      }
      .atcive {
        color: #04f020;