fix: 天气显示

罗广辉

2025-04-21 2800fa4f32f3900509cb4d6eefaf2bfaf54efdd7

 src/views/Home/HomeLeft/MachineNestList.vue

@@ -1,27 +1,48 @@
<!-- 机巢详情列表 -->
<template>
   <common-title text="返回" :style="{ marginLeft: pxToRem(14) }" @details="detailsFun"></common-title>
   <common-title title="机巢概况" text="返回" :style="{ marginLeft: pxToRem(14) }" @details="detailsFun"></common-title>

   <div class="machine-nest-list">
      <MachineNestTotal @searchNickName="handleSearch" />
      <div class="content-wrapper">
         <div class="table-list">
            <div :class="[index % 2 ==1 ? 'table-itemeven':'table-item']" v-for="(item,index) in tableList" :key="index">
         <!-- <div
            class="table-list"
            v-if="tableList.length > 0"
            infinite-scroll-distance="6"
            v-infinite-scroll="loadMore"
            :infinite-scroll-disabled="busy"
            infinite-scroll-immediate="true"
         > -->
         <div
            class="table-list"
            v-if="tableList.length > 0"
         >
            <div
               :class="[index % 2 === 1 ? 'table-itemeven' : 'table-item']"
               v-for="(item, index) in tableList"
               :key="index" @click="signMachineNestClick(item)"
            >
               <img src="/src/assets/images/home/homeLeft/machinenestlist-sign.png" alt="" />
               <div class="middle">
                  <div class="title">{{ item.nickname }}</div>
                  <div class="number">
                     飞行次数：<span>{{ item.fly_count }}</span
                     >次 飞行里程：<span>{{ item.flight_mileage }}</span
                     >km
                     飞行次数：
                     <span>{{ item.fly_count }}</span>
                     次 飞行里程：
                     <span>{{ item.flight_mileage }}</span>
                     km
                  </div>
                  <div class="result">
                     任务成果：<span>{{ item.accumulate_data }}</span
                     >个 飞行时长：<span>{{ item.hour }}</span
                     >h
                     任务成果：
                     <span>{{ item.accumulate_data }}</span>
                     个 飞行时长：
                     <span>{{ item.hour }}</span>
                     h
                  </div>
                  <div class="numbering">23HK1453</div>
               </div>
               <div class="right" :class="item.status === 'WORKING' ? 'atcive' : item.status === 'OFFLINE'? 'offine' :'freetime'      " @click="signMachineNestClick(item)">
               <div
                  class="right"
                  :class="item.status === 'WORKING' ? 'atcive' : item.status === 'OFFLINE' ? 'offine' : 'freetime'">
                  {{ item.status === 'OFFLINE' ? '离线中' : item.status === 'WORKING' ? '作业中' : '空闲中' }}
               </div>
            </div>
@@ -49,12 +70,14 @@
import { useStore } from 'vuex'

const store = useStore()

const isMore = ref(true)
// 控制加载状态
const busy = ref(false)
const searchText = ref('')
// 分页参数
const pageParams = ref({
   current: 1,
   size: 8,
   size: 99,
   total: 0,
})

@@ -64,34 +87,29 @@
const getTableList = () => {
   const params = {
      nickname: searchText.value,
      current: pageParams.value.current,
      current: 1,
      size: pageParams.value.size,
   }
   selectDevicePage(params).then(res => {
      if (res.data.code !== 0) return
      tableList.value = res.data.data.records
      pageParams.value.total = res.data.data.total
      console.log('标题', tableList.value)
      if (res.data.data.records.length === 0) return (isMore.value = false)
      // pageParams.value.current += 1
      // pageParams.value.size += 8
      tableList.value = res.data.data.records;// [...tableList.value, ...res.data.data.records]
      busy.value = false
   })
}

// 加载更多数据
const loadMore = async () => {
   busy.value = true
   if (!isMore.value) return
   getTableList()
}
// 搜索数据
const handleSearch = name => {
   searchText.value = name
   pageParams.value.current = 1
   tableList.value = []
   getTableList()
}

// 分页方法
const handleSizeChange = val => {
   pageParams.value.size = val
   pageParams.value.current = 1
   getTableList()
}

const handleCurrentChange = val => {
   pageParams.value.current = val
   getTableList()
}

@@ -130,6 +148,13 @@
         font-weight: 500;
         font-size: 16px;
         color: #fff;
         // 滚动条
         &::-webkit-scrollbar {
            width: 0;
            display: none;
         }
         -ms-overflow-style: none; /* IE and Edge */
         scrollbar-width: none; /* Firefox */
         .table-item {
            display: flex;
            justify-content: space-between;
@@ -137,7 +162,7 @@
            padding-top: 6px;
            margin-top: 10px;

            height: 120px;
            height: 100px;
            background: linear-gradient(
               90deg,
               rgba(0, 122, 255, 0) 0%,
@@ -145,15 +170,14 @@
               rgba(0, 73, 153, 0) 100%
            );
         }
         .table-itemeven {
         .table-itemeven {
            display: flex;
            justify-content: space-between;
            justify-items: center;
            padding-top: 6px;
            margin-top: 10px;

            height: 120px;
			
            height: 100px;
         }
         img {
            width: 45px;
@@ -183,19 +207,18 @@
            cursor: pointer;
            font-size: 16px;
         }
      // 离线中
      .offine {
      color: #fff;
      }
      // 空闲中
      .freetime{
      color: #FFA768;
      }
      // 作业中
         .atcive {
         // 离线中
         .offine {
            color: #fff;
         }
         // 空闲中
         .freetime {
            color: #04f020;
            background: linear-gradient(90deg, rgba(12, 45, 92, 1) 0%, #154671 50%, rgba(12, 45, 92, 1) 100%),
               linear-gradient(90deg, rgba(12, 45, 92, 1) 0%, rgba(12, 45, 92, 1) 50%, rgba(12, 45, 92, 1) 100%);
         }
         // 作业中
         .atcive {
            color: #ffa768;
				
         }
         .numbering {
            font-size: 12px;
@@ -244,4 +267,4 @@
      }
   }
}
</style>
</style>