bonus-material-app/src/pages/materialsStation/index/expiryDateList.vue

103 lines
3.2 KiB
Vue

<template>
<div class="content">
<div class="query">
<uni-easyinput
errorMessage
v-model="queryParams.keyWord"
placeholder="请输入关键字"
style="margin: 0 5px"
/>
<button size="mini" style="background-color: #f0a037; color: #fff" @click="getList">
查询
</button>
</div>
<!-- 滚动 -->
<scroll-view scroll-y="true" class="scroll-container" @scrolltolower="onScrollTolower">
<!-- 列表 -->
<uni-table ref="table" border stripe emptyText="暂无更多数据">
<uni-tr>
<uni-th width="50" align="center">序号</uni-th>
<uni-th width="150" align="center">设备类型</uni-th>
<uni-th width="150" align="center">规格型号</uni-th>
<uni-th width="120" align="center">设备编码</uni-th>
<uni-th width="110" align="center">本次检修时间</uni-th>
<uni-th width="110" align="center">下次检修时间</uni-th>
<uni-th width="100" align="center">在用班组</uni-th>
</uni-tr>
<uni-tr v-for="(item, index) in tableList" :key="index">
<uni-td align="center">{{ index + 1 }}</uni-td>
<uni-td align="center">{{ item.typeName }}</uni-td>
<uni-td align="center">{{ item.typeModelName }}</uni-td>
<uni-td align="center">{{ item.maCode || '-' }}</uni-td>
<uni-td align="center">{{ item.thisCheckTime || '-' }}</uni-td>
<uni-td align="center">{{ item.nextCheckTime || '-' }}</uni-td>
<uni-td align="center">{{ item.teamName || '-' }}</uni-td>
</uni-tr>
</uni-table>
<div style="display: flex; justify-content: center; align-items: center; height: 50px">
{{ total == tableList.length ? '没有更多数据了~' : '正在加载...' }}
</div>
</scroll-view>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { getAgreementIdApi, getSafeDetailsListApi } from '@/services/materialsStation'
import { onLoad } from '@dcloudio/uni-app'
const queryParams = ref({
pageNum: 1,
pageSize: 25,
keyWord: '',
status: '', // 2:临近检期1个月 1:临近检期3个月
})
const tableList = ref([])
const total = ref(0)
onLoad((opt) => {
console.log('🚀 ~ opt:', opt)
const params = opt.params ? JSON.parse(opt.params) : null
console.log('🚀 ~ params:', params)
queryParams.value.status = params.status || ''
getList()
})
const onScrollTolower = () => {
console.log('滚动到底部')
queryParams.value.pageSize += 10
getList()
}
const getList = async () => {
try {
uni.showLoading({ title: '加载中...', mask: true })
const { data: agreementIdList } = await getAgreementIdApi()
const res = await getSafeDetailsListApi({ ...queryParams.value, agreementIdList })
tableList.value = res.data.rows || []
total.value = res.data.total || 0
} catch (error) {
console.error('获取列表失败:', error)
} finally {
uni.hideLoading()
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 10px;
}
.query {
display: flex;
justify-content: space-between;
align-items: center;
color: #f0a037;
margin-bottom: 15px;
}
.scroll-container {
height: calc(100vh - 120px);
overflow-y: auto;
}
</style>