jhlapp/pagesT/stock/WarehouseRegion.vue

<template>
	<view>
		<view class="search-view">
			<u-search
				disabled
				v-model="areaName"
				:clearabled="true"
				@custom="selclear"
				@click="openSel"
				:show-action="true"
				action-text="重置"
				placeholder="点击选择所属库区"
			></u-search>
		</view>
		<view class="list-ul">
			<view class="list-li" v-for="(item, index) in region_list" :key="index" @click="changeData(item)">
				<view class="name">{{ item.name }}</view>
				<view class="other-info">
					<text class="label">库位编码</text>
					{{ item.code }}
				</view>
				<view class="other-info">
					<text class="label">所属库区</text>
					{{ item.areaName }}
				</view>
			</view>
			<u-loadmore :status="load_status" />
		</view>
		<u-select v-model="select_show" @confirm="selconfirm" label-name="name" value-name="id" :list="position_list"></u-select>
	</view>
</template>

<script>
export default {
	data() {
		return {
			select_show: false,
			load_status: 'nomore',
			areaId: '',
			areaName: '',
			page: 1,
			pageSize: 10,
			total: 0,
			region_list: [],
			position_list: []
		};
	},
	async onLoad() {
		await this.getAllStorageLocation();
		await this.getListReservoir();
	},
	onPullDownRefresh() {
		this.page = 1;
		this.getAllStorageLocation();
	},
	// 上拉加载
	onReachBottom() {
		if (this.total / this.pageSize > this.page) {
			this.page += 1;
			this.getAllStorageLocation();
		}
	},
	methods: {
		changeData(item) {
			// 选择返回上一页
			this._prePage().warehouseLocation = item;
			uni.navigateBack();
		},
		selclear() {
			this.areaName = '';
			this.areaId = '';
			this.page = 1;
			this.getAllStorageLocation();
		},
		openSel() {
			this.select_show = true;
		},
		selconfirm(arr) {
			this.areaName = arr[0].label;
			this.areaId = arr[0].value;
			this.page = 1;
			this.getAllStorageLocation();
		},
		// 库位
		async getAllStorageLocation() {
			this.loading_status = 'loading';
			await this.$u.api
				.getAllStorageLocation({
					areaId: this.areaId,
					enableStatus: 5,
					page: this.page,
					pageSize: this.pageSize
				})
				.then(res => {
					if (this.page === 1) {
						this.region_list = res.data;
					} else {
						this.region_list = this.region_list.concat(res.data);
					}
					this.total = res.pageTotal;
					this.load_status = this.$utils.loadStatus(this.page, this.pageSize, this.total);
				});
		},
		// 库区
		async getListReservoir() {
			await this.$u.api.getListReservoir().then(res => {
				this.position_list = res.data;
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.search-view {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 20rpx;
	background-color: #ffffff;
}
.list-ul {
	padding-top: 100rpx;
	.list-li {
		width: 710rpx;
		margin: 20rpx auto;
		border-radius: 10rpx;
		background-color: #ffffff;
		padding: 24rpx;
		.name {
			padding-bottom: 10rpx;
			font-weight: bold;
		}
		.other-info {
			padding-top: 10rpx;
			font-size: 24rpx;
			.label {
				color: #879bba;
				margin-right: 20rpx;
			}
		}
	}
}
</style>