TuBaoSoft-AP/pages/home/inventoryQuery/index.vue

<template>
	<view>
		<!-- <view class="condition">
			<view class="conditionone">
				<view :style="{'border-bottom':(underline =='0'?'3rpx solid #fff':'none')}" @click="whole">全部</view>
				<view :style="{'border-bottom':(underline =='1'?'3rpx solid #fff':'none')}" @click="show = !show,underline = '1'">仓库</view>
				<view :style="{'border-bottom':(underline =='3'?'3rpx solid #fff':'none')}" @click="choiceState = !choiceState,underline = '3'">状态</view>
			</view>
		</view> -->
		<view class="search">
			<u-search shape="round" placeholder="请输入提单号" @custom="custom" @search="custom" :clearabled="false">
			</u-search>
		</view>
		<view class="ordertop" v-for="(item, index) in lisi" :key="index">
			<view>
				<view class="iconblue"></view>
				<text class="license">提单号：{{item.fMblno}}</text>
				<view class="various" @click="viewDetails(item)">{{item.fOriginalbilldate}}</view>
			</view>
			<view class="line">
				<u-line color="#ccc" border-style='dashed' />
			</view>
			<view class="basic">
				<view>货物属性</view>
				<view>{{item.fBusinessTypes}}</view>
			</view>
			<view class="basic">
				<view>品名</view>
				<view>{{item.fGoodsids}}</view>
			</view>
			<view class="basic">
				<view>仓库</view>
				<view>{{item.fWarehouseids}}</view>
			</view>
			<view class="basic">
				<view>结余件数</view>
				<view>{{item.fQtyblc}}</view>
			</view>
			<view class="basic">
				<view>结余毛重(kg)</view>
				<view>{{item.fGrossweightblc}}</view>
			</view>
			<view class="basic">
				<view>结余净重(kg)</view>
				<view>{{item.fNetweightblc}}</view>
			</view>
			<view class="basic">
				<view>箱号</view>
				<view>{{item.fLocalcntrno}}</view>
			</view>
		</view>
		<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
	</view>
</template>

<script>
	export default {
		data(){
			return{
				underline:'0',
				loadText: {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
				total:0,
				iconType: 'flower',
				status: 'loadmore',
				form:{
					pageNum: 1,
					pageSize: 10
				},
				lisi:[]
			}
		},
		created() {
			this.query()
		},
		onReachBottom() {
			this.status = 'loading'
			if (this.lisi.length < this.total) {
				this.form.pageNum++
				this.query()
			} else {
				this.status = 'nomore'
			}
		},
		methods:{
			custom(text){
				console.log(text)
				this.form={
					fMblno:text,
					pageNum: 1,
					pageSize: 10
				}
				this.query()
			},
			query(){
				this.$u.get("/warehouseBusiness/whgenleg/appWhGenLegList",this.form).then(res=>{
					console.log(res)
					this.lisi = res.rows
					this.total = res.total
					if(this.total < 10) this.status = 'nomore'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.ordertop {
		width: 96%;
		background-color: #fff;
		margin: 20rpx auto;
		border-radius: 20rpx;
		padding-top: 20rpx;
		box-shadow: 0px 0px 8px 0px rgba(165, 189, 251, 0.4);
		padding-bottom: 10rpx;
	}
	
	.ordertop>view:nth-child(1) {
		width: 98%;
		margin-bottom: 60rpx;
	}
	.iconblue {
		width: 10rpx;
		height: 45rpx;
		float: left;
		background-color: #3a63cf;
		margin-right: 10rpx;
	}
	
	.license {
		float: left;
		font-size: 32rpx;
	}
	
	.various {
		float: right;
		width: 230rpx;
		border: 2rpx solid #3a63cf;
		text-align: center;
		border-radius: 100rpx;
		color: #1669e6;
	}
	.line {
		width: 92%;
		margin: 0 auto;
	}
	.basic {
		width: 94%;
		margin: 10rpx auto;
		display: flex;
		justify-content: space-between;
	}
	
	.basic>view {
		margin-bottom: 10rpx;
	}
	
	.basic>view:nth-child(1) {
		color: #797979;
	}
	.search {
		width: 96%;
		margin: 10rpx auto;
	}
	.condition {
		background-color: #1669e6;
		height: 60rpx;
	}
	.conditionone {
		width: 92%;
		height: 44rpx;
		margin: 0rpx auto;
		display: flex;
		justify-content: space-between;
		color: #fff;
	}
	
	.conditionone>view {
		color: #e6e8e8;
	}
</style>