| | |
| | | <div class="name">机巢名称</div> |
| | | <div class="status">机巢状态</div> |
| | | </div> |
| | | <div |
| | | <!-- <div |
| | | class="table-body" |
| | | v-if="tableList.length > 0" |
| | | infinite-scroll-distance="6" |
| | | v-infinite-scroll="loadMore" |
| | | :infinite-scroll-disabled="busy" |
| | | infinite-scroll-immediate="true" |
| | | > |
| | | > --> |
| | | <div |
| | | class="table-body" |
| | | v-if="tableList.length > 0"> |
| | | <div |
| | | class="table-item" |
| | | :class="[index % 2 == 1 ? '' : 'table-item-odd']" |
| | | :class="[index % 2 === 1 ? '' : 'table-item-odd']" |
| | | v-for="(item, index) in tableList" |
| | | :key="index" |
| | | @click="signMachineNestClick(item)" |
| | | @mouseover="changeIndex(index)" |
| | | @mouseout="changeIndexBack(index)" |
| | | |
| | | > |
| | | <div class="name"> |
| | | <img class="imageicon" src="/src/assets/images/home/homeLeft/overviewnext-way.png" alt="" /> |
| | | <img class="imageicon" :src="overviewnextWay" 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.nickname }} |
| | |
| | | import { selectDevicePage } from '@/api/home/machineNest.js' |
| | | import { useStore } from 'vuex' |
| | | |
| | | import overviewnextWay from '@/assets/images/home/homeLeft/overviewnext-way.png' |
| | | |
| | | const store = useStore() |
| | | |
| | | const isMore = ref(true) |
| | |
| | | // 分页参数 |
| | | const pageParams = ref({ |
| | | current: 1, |
| | | size: 5, |
| | | size: 99, |
| | | total: 0, |
| | | }) |
| | | // 机巢列表 |
| | |
| | | selectDevicePage(params).then(res => { |
| | | if (res.data.code !== 0) return |
| | | if (res.data.data.records.length === 0) return (isMore.value = false) |
| | | pageParams.value.current += 1 |
| | | tableList.value = [...tableList.value, ...res.data.data.records] |
| | | // pageParams.value.current += 1 |
| | | // pageParams.value.size += 5; |
| | | 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 loadMore = async () => { |
| | | // busy.value = true |
| | | // if (!isMore.value) return |
| | | // getTableList() |
| | | // } |
| | | |
| | | // 搜索数据 |
| | | const handleSearch = name => { |
| | | searchText.value = name |
| | | pageParams.value.current = 1 |
| | | // pageParams.value.size = 5; |
| | | tableList.value = [] |
| | | isMore.value = true |
| | | getTableList() |
| | |
| | | line-height: 33px; |
| | | margin-bottom: 13px; |
| | | .name { |
| | | margin-left: 60px; |
| | | margin-left: 46px; |
| | | |
| | | } |
| | | } |
| | | .table-body { |
| | | height: 190px; |
| | | |
| | | overflow: auto; |
| | | &::-webkit-scrollbar { |
| | | width: 0; |
| | |
| | | cursor: pointer; |
| | | } |
| | | .active { |
| | | color: #8effac; |
| | | 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%); |
| | | color: #ffa768; |
| | | |
| | | } |
| | | .idle-active { |
| | | color: #ffa768; |
| | | color: #8effac; |
| | | } |
| | | .imageicon { |
| | | object-fit: cover; |