aiot-app/pages/warehouse/inventory/batch/components/putStorage.vue

<template>
	<!-- 入库 -->
	<view class="main-wrap" :class="{ info: isInfo }">
		<uni-search-bar class="uni-search-bar" @confirm="search" v-model="searchValue" @input="inputChange" cancelButton="none" placeholder="搜索关键字"></uni-search-bar>
		<view class="scroll_box">
			<scroll-view scroll-y="true" class="scroll-Y" @scrolltolower="lower">
				<view class="order-list">
					<view class="item" v-for="(item, index) in listData" :key="index">
						<view class="title">
							<view class="s1">入库单号 {{ item.bizNo }}</view>
							<view class="s2">
								{{ dict.bizScene[item.bizScene] }}
							</view>
						</view>
						<view class="main">
							<!-- <view class="row">
							<view class="row-item">
								<text class="t1">货位</text>
								<text class="t2">{{ item.warehouseName }}-{{ item.areaName }}-{{item.shelfCode}}—{{item.cargoSpaceCode}}</text>
							</view>
						</view> -->
							<view class="row">
								<view class="row-item">
									<text class="t1">入库数量</text>
									<text class="t2">{{ item.measureQuantity }}{{ item.measureUnit }}</text>
								</view>
								<view class="row-item">
									<text class="t1">包装数量</text>
									<text class="t2">{{ item.packingQuantity }}{{ item.packingUnit }}</text>
								</view>
							</view>
							<view class="row">
								<view class="row-item">
									<text class="t1">操作人</text>
									<text class="t2"></text>
								</view>
								<view class="row-item">
									<text class="t1">审核人</text>
									<text class="t2">{{ item.verifyName }}</text>
								</view>
							</view>
							<view class="row">
								<view class="row-item">
									<text class="t1">入库时间</text>
									<text class="t2">{{ item.createTime }}</text>
								</view>
							</view>
							<!-- <view class="ckmx" @click="goDetails(item)">查看明细</view> -->
						</view>
					</view>
				</view>
				<u-loadmore fontSize="32" iconSize="36" :status="status" style="margin: 20rpx 0" />
			</scroll-view>
		</view>
	</view>
</template>

<script>
	import { outInRecordsPage } from '@/api/warehouseManagement'
	export default {
		props: ['categoryId'],
		data() {
			return {
				page: 1,
				size: 20,
				isEnd: true,
				listData: [],
				status: 'loading',
				searchValue: '',
				timerId: '',
				dict: {
					bizScene: {
						1: '生产入库',
						2: '采购入库',
						3: '归还入库',
						4: '领料退货入库',
						6: '销售退货入库',
						7: '销售受托入库',
						8: '半成品入库',
						9: '外协入库',
						10: '委外入库',
						11: '委外退货入库',
						12: '委外入库(非采购)',
						13: '受托入库',
						14: '项目入库',
						15: '调拨入库',
						99: '其他入库'
					}
				}
			}
		},
		created() {
			this.getData()
		},
		methods: {
			// 触底
			lower() {
				console.log('触底')
				if (this.isEnd) {
					return
				}
				this.getMoreLists()
			},
			inputChange() {
				// 清除timer对应的延时器
				clearTimeout(this.timerId)
				// 重新启动一个延时器,并把timerId赋值给this.timer
				this.timerId = setTimeout(() => {
					// 如果500毫秒内,没有触发新的输入事件,则为搜索关键词赋值
					this.search()
				}, 500)
			},
			getData() {
				let par = {
					pageNum: this.page,
					size: this.size,
					type: 1,
					categoryId: this.categoryId
				}
				if (this.searchValue !== '') {
					par.keyWord = this.searchValue
				}
				// par = this.URLSearchParams(par)
				outInRecordsPage(par).then(res => {
					console.log('res----', res)
					this.listData = [...this.listData, ...res.list]
					let pages = res.count
					if (this.listData.length < pages) {
						this.isEnd = false
						this.status = 'loading'
					} else {
						this.isEnd = true
						this.status = 'nomore'
					}
				})
			},
			getMoreLists() {
				this.page++
				this.getData()
			},
			search() {
				this.page = 1
				this.listData = []
				this.status = 'loading'
				this.getData()
			},
			goDetails(item) {
				let par = {
					bizNo: item.id,
					type: '入库'
				}
				par = this.URLSearchParams(par)
				uni.navigateTo({
					url: '/pages/warehouse/inventory/order/outInStorageDetail?' + par
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main-wrap {
		height: calc(100% - 176rpx);

		&.info {
			height: calc(100% - 236rpx);
		}
	}

	.scroll-Y {
		height: calc(100vh - 322rpx);
	}

	.order-list {
		.item {
			background-color: #fff;
			margin-bottom: 30rpx;
			margin-bottom: 30rpx;

			.title {
				display: flex;
				padding: 20rpx;
				justify-content: space-between;
				align-items: center;
				border-bottom: 1px solid #dedede;

				.s1 {
					color: #333333;
					font-size: 28rpx;
					font-weight: bold;
				}

				.s2 {
					font-size: 28rpx;
					font-weight: bold;
					color: #333333;
				}
			}

			.main {
				padding: 0 30rpx;

				.row {
					display: flex;
					align-items: center;
					justify-content: space-between;
					padding: 20rpx 0;
					border-bottom: 1px dashed #dedede;
					.row-item {
						.t1 {
							font-weight: bold;
							font-size: 28rpx;
							color: #333333;
							margin-right: 20rpx;
						}

						.t2 {
							font-size: 28rpx;
							color: #333333;
						}
					}
				}

				.ckmx {
					color: #70b603;
					font-size: 28rpx;
					font-weight: bold;
					padding: 20rpx;
					display: flex;
					justify-content: flex-end;
				}
			}
		}
	}
</style>