feat：增加单个机巢页面

chenyao

2025-03-29 efab54d762db66fa208be819ec73c667ad0efc4c

feat：增加单个机巢页面

 src/api/home/machineNest.js

New file
@@ -0,0 +1,10 @@
import request from '@/axios';

// 机巢列表
export const getDeviceInfoNum = () => {
  return request({
    url: '/manage/api/v1/devices/getDeviceInfoNum',
    method: 'post',
    params: {},
  });
};

 src/page/login/index.vue

@@ -1,8 +1,5 @@
<template>
  <div class="login-container" @keyup.enter="handleLogin">
    <!-- <div class="login-time">
      {{ time }}
    </div> -->
    <div class="login-header">
      <div class="title">中图智飞低空智能感知网平台</div>
    </div>

 src/router/views/index.js

@@ -16,6 +16,15 @@
        component: () => import(/* webpackChunkName: "home" */ '@/views/Home/Home.vue'),
      },
      {
        path: 'signMachineNest',
        name: '单个机巢详情',
        meta: {
          i18n: 'dashboard',
          menu: false,
        },
        component: () => import(/* webpackChunkName: "TaskManage" */ '@/views/SignMachineNest/SignMachineNest.vue'),
      },
      {
        path: 'taskManage',
        name: '任务管理',
        meta: {

 src/styles/login.scss

@@ -3,26 +3,6 @@
  position: relative;
  width: 100%;
  height: 100%;
  // position: relative;
  // display: flex;
  // align-items: center;
  // width: 100%;
  // height: 100%;
  // // background-color: #fff;
  // background: linear-gradient(110deg, rgb(2, 40, 85) 0%, rgb(44, 119, 241) 50%, rgb(255,255,255) 50%, rgb(240,240,240) 100%);
  // overflow: hidden;
  // &::before{
  //   position: absolute;
  //   top: 0;
  //   left: 0;
  //   width: 100%;
  //   height: 100%;
  //   margin-left: -48%;
  //   background-image: url(/img/login-bg.svg);
  //   background-position: 100%;
  //   background-repeat: no-repeat;
  //   background-size: auto 100%;
  // }
}
.login-header {
  background: url('../assets/images/login/big-title.png') no-repeat center / 100% 100%;

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

@@ -32,7 +32,7 @@
          <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 {
@@ -163,6 +185,7 @@
      }
      .status {
        color: #6fc3ff;
        cursor: pointer;
      }
      .atcive {
        color: #04f020;

 src/views/SignMachineNest/SignMachineNest.vue

New file
@@ -0,0 +1,9 @@
<template>
  <MachineLeft></MachineLeft>
  <MachineRight></MachineRight>
</template>

<script setup>
import MachineLeft from './components/MachineLeft.vue'
import MachineRight from './components/MachineRight.vue';
</script>

 src/views/SignMachineNest/components/MachineLeft.vue

New file
@@ -0,0 +1,7 @@
<template>
  <div class="machine-left">左边</div>
</template>

<script setup></script>

<style scoped lang="scss"></style>

 src/views/SignMachineNest/components/MachineRight.vue

New file
@@ -0,0 +1,7 @@
<template>
  <div class="machine-right">右边</div>
</template>

<script setup></script>

<style scoped lang="scss"></style>