<template>
|
<view>
|
<u-sticky>
|
<view style="background-color: #ffffff;">
|
<uni-search-bar @confirm="search" v-model="searchValue" @input="handleSearchInput"></uni-search-bar>
|
</view>
|
</u-sticky>
|
|
<!-- 移除了内部滚动容器，让页面自然滚动，所有数据都会显示 -->
|
<uni-list :border="true">
|
<uni-list-item
|
direction="column"
|
v-for="item in allReceivingOrders"
|
:key="item.orderNo"
|
clickable
|
@click="groupClick(item.orderNo)"
|
link
|
:to="page + item.orderNo"
|
>
|
<template v-slot:body>
|
<uni-group margin-top="20">
|
<view style="line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;">
|
入库单号： {{ item.orderNo }}
|
</view>
|
<view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;">
|
创建人员： {{ item.creater }}
|
</view>
|
<view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;">
|
创建日期： {{ item.createDate }}
|
</view>
|
<view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: left;">
|
物料料号：
|
<view class="container">
|
<view v-for="(materielCode, index) in getUniqueMaterielCodes(item.details)" :key="index">
|
{{ materielCode }}
|
<u-line color="blue" v-if="index < getUniqueMaterielCodes(item.details).length - 1" />
|
</view>
|
</view>
|
</view>
|
<view style="margin-top: 10rpx;display: flex;align-items: center;">
|
<view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 238rpx;height: 40rpx;font-size: 22rpx;background-color:rgba(22,127,247,0.18);color: #1F63FF;">
|
订单状态： {{ item.InboundOrderStatus }}
|
</view>
|
<view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 158rpx;height: 40rpx;font-size: 22rpx;color: #F56C6C;">
|
总量： {{ item.SumQty }}
|
</view>
|
<view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 158rpx;height: 40rpx;font-size: 22rpx;color: #F56C6C;">
|
已入： {{ item.OverQty }}
|
</view>
|
</view>
|
</uni-group>
|
</template>
|
</uni-list-item>
|
</uni-list>
|
|
<!-- 移除加载更多组件，因为不分页了 -->
|
<!-- <uni-load-more :status="status" v-if="loadVisible && allReceivingOrders.length > 0"></uni-load-more> -->
|
|
<!-- 空数据提示 -->
|
<view v-if="allReceivingOrders.length === 0 && !isLoading" style="text-align: center; padding: 100rpx 0; color: #999;">
|
暂无入库订单数据
|
</view>
|
|
<!-- 返回顶部按钮（可选） -->
|
<u-back-top :scroll-top="scrollTop" top="400"></u-back-top>
|
</view>
|
</template>
|
|
<script>
|
import { InboundOrderStatus } from '../../common/config.js';
|
|
export default {
|
data() {
|
return {
|
page: '/pages/stash/raworderboxing?',
|
searchValue: '',
|
allReceivingOrders: [], // 显示在前端的数据（可能被搜索过滤）
|
originalOrders: [], // 存储所有原始数据
|
scrollTop: 0,
|
warehouseId: '',
|
isLoaded: false, // 是否从详情页返回
|
isLoading: false, // 防止重复请求
|
};
|
},
|
onLoad(res) {
|
this.warehouseId = res.warehouseId;
|
this.page = this.page + 'warehouseId=' + this.warehouseId + '&orderNo=';
|
// 直接加载全部数据（不分页）
|
this.getAllData();
|
},
|
onShow() {
|
// 从详情页返回时，如果数据已被修改，可以重新加载
|
if (this.isLoaded) {
|
this.getAllData();
|
this.isLoaded = false;
|
}
|
},
|
onPageScroll(e) {
|
this.scrollTop = e.scrollTop;
|
},
|
methods: {
|
// 物料料号去重
|
getUniqueMaterielCodes(details) {
|
if (!details || !Array.isArray(details)) return [];
|
return [...new Set(details.map(item => item.materielCode))];
|
},
|
|
// 搜索输入处理（前端筛选）
|
handleSearchInput() {
|
if (this.searchValue === '') {
|
this.allReceivingOrders = [...this.originalOrders];
|
return;
|
}
|
const searchText = this.searchValue.toLowerCase().trim();
|
this.allReceivingOrders = this.originalOrders.filter(item => {
|
if (item.orderNo && item.orderNo.toLowerCase().includes(searchText)) {
|
return true;
|
}
|
if (item.details && item.details.length > 0) {
|
return item.details.some(detail =>
|
detail.materielCode && detail.materielCode.toLowerCase().includes(searchText)
|
);
|
}
|
return false;
|
});
|
},
|
|
search() {
|
this.handleSearchInput();
|
},
|
|
groupClick() {
|
this.isLoaded = true;
|
},
|
|
// 一次性获取所有数据（不分页）
|
getAllData() {
|
if (this.isLoading) return;
|
this.isLoading = true;
|
|
// 设置一个足够大的 pageSize 来获取所有数据（根据接口最大限制调整）
|
const postData = {
|
MainData: {
|
warehouseId: this.warehouseId,
|
orderNo: '',
|
pageNo: 1,
|
pageSize: 9999, // 假设接口支持这么大的分页
|
},
|
};
|
|
this.$u
|
.post('/api/InboundOrder/GetInboundOrders', postData)
|
.then(res => {
|
this.isLoading = false;
|
if (res.status) {
|
console.log(res.data);
|
const newData = res.data.map(i => ({
|
...i,
|
InboundOrderStatus: InboundOrderStatus.find(item => item.value == i.orderStatus)?.label || '未知状态',
|
SumQty: i.details?.map(item => item.orderQuantity).reduce((prev, next) => prev + next, 0) || 0,
|
OverQty: i.details?.map(item => item.overInQuantity).reduce((prev, next) => prev + next, 0) || 0,
|
}));
|
|
this.originalOrders = newData; // 直接替换，不分页追加
|
// 根据搜索词过滤显示
|
if (this.searchValue) {
|
this.handleSearchInput();
|
} else {
|
this.allReceivingOrders = [...this.originalOrders];
|
}
|
} else {
|
this.$u.toast('数据加载失败，请重试');
|
}
|
})
|
.catch(err => {
|
this.isLoading = false;
|
this.$u.toast('网络异常，请检查网络');
|
});
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.container {
|
display: flex;
|
flex-wrap: wrap;
|
gap: 10rpx;
|
}
|
.container view {
|
white-space: nowrap;
|
}
|
</style>
|
