batch.vue 5.88 KB
<template>
	<view>
		<view class="header">
			<uni-search-bar @confirm="search" @input="handleSearch" placeholder="输入入库单号"></uni-search-bar>
		</view>
		<view class='receipt-list'>
			<template v-for="item in receiptList">
				<view class="list-item p-15">
					<view class="item-header u-f u-f-jcsb ">
						<view class="left-content ">
							<view class="code">
								单号:{{item.code}}
							</view>
							<view>
								入库仓库:{{warehouseCodeFormat(item.warehouseCode)}}
							</view>
							<view>
								入库行数:{{item.totalLines}}
							</view>
							<view>
								入库数量:{{item.totalQty}}
							</view>
						</view>
						<view>
							<uni-tag text="已完成" type="success" size="small" v-if="item.lastStatus == 800"></uni-tag>
							<uni-tag text="未完成" type="error" size="small" v-else-if="item.lastStatus == 200"></uni-tag>
							<uni-tag text="全部" type="primary" size="small" v-else></uni-tag>
						</view>
					</view>
					<view class="item-footer  u-f u-f-aic u-f-jcsb">
						<view>
							<uni-tag :text="receiptTypeFormat(item.receiptType)" type="warning" :inverted="true" size="small"></uni-tag>
						</view>
						<view class="time">
							【{{item.createdBy}}】创建于{{formatDate(item.created)}}
						</view>
					</view>

				</view>
			</template>
			
			<uni-load-more :iconSize="18" :status="loadStatus"></uni-load-more>
		</view>
           <uni-fab :pattern="pattern" :horizontal="'right'" :popMenu="false" 
			 @fabClick="fabClick"></uni-fab>
			 <uni-drawer mode="right" ref="showDrawer" :width="320">
			     <view style="">
			         <view class="drawer-title">筛选</view>
					 <view class=""><uni-list>
		     <uni-list-item>
				    <view slot="header" class="slot-box"><text class="require">物料名称</text></view>
		            <template slot="footer">
		                <input class="uni-input" type="text"  placeholder="请输入名称" />
		            </template>
		        </uni-list-item>
				<uni-list-item>
					<view slot="header" class="slot-box"><text class="require">物料编号</text></view>
				       <template slot="footer">
				           <input class="uni-input" type="number" placeholder="请输入编号" />
				       </template>
				   </uni-list-item>
		        <uni-list-item title="规格">
		                <template slot="footer">
		                    <input class="uni-input" type="number" placeholder="请输入规格" />
		                </template>
		        </uni-list-item>
				<uni-list-item title="单位">
				        <template slot="footer">
				            <input class="uni-input" type="number" placeholder="请输入单位" />
				        </template>
				</uni-list-item>
				<uni-list-item title="物料类型">
				        <template slot="footer">
				          <label class="radio"><radio value="r1"  />成品</label>
						  <label class="radio"><radio value="r2"  />原材料</label>
				        </template>
				</uni-list-item>
		</uni-list></view>
			     </view>
			 </uni-drawer>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				receiptList: [],
				receiptTypeArr: [],
				warehouseArr: [],
				// 查询参数
				queryParams: {
					code: undefined,
					companyCode: uni.getStorageSync("userData").companies.toString(),
					pageNum: 1,
					pageSize: 10
				},
				total: null,
				loadStatus: "",
				pattern: {
					buttonColor: '#007aff'
				},
				
			}
		},
		onLoad() {
			this.getReceiptList();
			this.getReceiptTypeDict();
			this.getWarehouse();


		},
		onNavigationBarButtonTap(e) {
		
             this.$refs.showDrawer.open()
		},
		onPullDownRefresh() {
			this.getReceiptList()
		},
		onReachBottom() {
			if (this.queryParams.pageNum >= this.total / 10) {
				this.loadStatus = "noMore";
				return
			}
			this.loadStatus = "loading";
			this.queryParams.pageNum++;
			this.getReceiptList();
		},
		methods: {
			//获取入库列表
			getReceiptList() {

				this.$http.receipt.searchReceiptInCondition(this.queryParams).then(res => {
					console.log(res)
					if (this.queryParams.pageNum > 1) {

						this.receiptList = this.receiptList.concat(res.data.rows);
						
					} else {
						this.receiptList = res.data.rows;
					}


					this.total = res.data.total;
					uni.stopPullDownRefresh();

				})
			},
			// 顶部搜索
			handleSearch(e) {
				this.queryParams.code = e.value;
				this.getReceiptList()
			},
			
			// 获取仓库字典数据
			getWarehouse() {

				let params = {
					username: uni.getStorageSync('historyUser').username
				}
				this.$http.dict.getWarehouseByUserCode(params).then(res => {

					this.warehouseArr = res.data.data
				});
			},
			// 仓库字典翻译
			warehouseCodeFormat(warehouseCode) {
				return this.selectCommonLabel(this.warehouseArr, warehouseCode);
			},
			// 获取入库类型字典数据
			getReceiptTypeDict() {
				this.$http.dict.getReceiptType().then(res => {
					console.log(res)
					this.receiptTypeArr = res.data.data

				})
			},
			// 入库类型字典翻译
			receiptTypeFormat(receiptType) {
				return ;
			},
			// 悬浮按钮点击
			fabClick() {
				uni.navigateTo({
					url:"add"
				})
			}
		}

	}
</script>
<style lang='scss' scoped>
	.header {
		position: fixed;
		top: 88rpx;
		width: 100%;
		z-index: 1;
		border-bottom: 1px solid $uni-border-color;
	}

	.receipt-list {
		margin: 126rpx 0;

		.list-item {
			margin-top: 20rpx;
			padding-top: 20rpx;
			background-color: $uni-bg-color;

			.item-header {
				.left-content {
					color: $uni-text-color-gray;

					.code {
						color: $uni-text-color;
						font-size: $uni-font-size-lg;
						font-weight: bold;
					}

					.warehouse {
						margin-top: 10rpx;
					}
				}
			}

			.item-footer {
				hegiht: 90rpx;
				line-height: 90rpx;
				margin-top: 10rpx;
				border-top: 2rpx solid #e5e5e5;

				.time {
					color: $uni-text-color-gray;
				}
			}
		}
	}
	.drawer-title {
		
		height: 88rpx!important;
		line-height: 88rpx;
	}
</style>