yxk_h5_master/pages/wms/productionInStock/index.vue

<template>
	<view class="content">
		
		<view v-for="(item,index) in listCards" :key="index" class="example-box" style="position: relative;flex: 1;" @click="toDetail(index,item)">
			<dev-block :title="item.title" :titleHtml='item.titleHtml' :note="item.note" :extra="item.extra" :tagType="item.tagType"
			 :contentList="item.contentList" ></dev-block>
			<uni-icons type="scan" size="25" color='#5c91e4' class='scan_icon'></uni-icons>
		</view>
		<uni-load-more  :status="loading_status" ></uni-load-more>
		<view class="goHome" @click='goMain()'>
			<img src="@/static/img/gohome.png">
		</view>
	</view>
</template>

<script>
	import devBlock from '@/components/xinsoft-dev-block/xinsoft-dev-block.vue'
	import uniIcons from '@/components/uni-icons/uni-icons.vue'
import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	export default {
		components: {
			devBlock,
			uniIcons,
			uniLoadMore
		},
		data() {
			return {
				listCards: [],
				engineerId:'',
				status:'',
				singleStatus:56,
				pagenumber:1,//当前第几页
				pagesize:5,//每页加载数据条数
				
				loading_status: 'more',//more（loading前）、loading（loading中）、noMore（没有更多了）
			}
		},
		onShow(){
		
		},
		created() {
			var userInfo  = uni.getStorageSync('userInfo');
			this.getDateList();
			
		
		},
		//滚动到底部加载下一页
		onReachBottom(obj){
			if(this.loading_status=='noMore'){
				return false;
			}
			this.pagenumber++;
			this.getDateList();
		},
		//下拉刷新
		onPullDownRefresh(){
			this.listCards=[];
			this.pagenumber=1;
			this.loading_status="more";
			this.getDateList();
			  
		},
		methods: {
			//获取列表数据
			getDateList(){
				this.loading_status="loading";
				var filterRes = {
					auditSign:179
				};
				filterRes.pageno = this.pagenumber;
				filterRes.pagesize = this.pagesize;
				filterRes.status = 232;
				this.$http.request({
					url: '/apis/productionPlan/list',
					params: filterRes,
				}).then(res => {
					uni.stopPullDownRefresh();
					if(!res.data.data){
					this.loading_status="noMore";
					}else if(res.data.data.datas.length<this.pagesize){
						this.loading_status="noMore";
					}else{
						this.loading_status="more";
					}
					if (res.data.code == 0) {
						console.log(res.data.data.datas)
						this.listCards = this.listCards.concat(this.formaterData(res.data.data.datas));
						}
				}).catch(err => {
					this.loading_status="noMore";
				});
			},
			//设置状态颜色
			setTag(val) {
				if (val == 50) {
					return "106";
				} else if (val == 49) {
					return "108";
				} else {
					return "106";
				}
			},
		
			//列表数据格式化
			formaterData(data) {  
				var resData = [];
				data.forEach((vals, index) => {
					// var WorkOrderNo=vals.id?vals.recordWorkOrderNo:'';//巡检单号
					// var patrolName=vals.id?vals.patrolRecordName:'';//巡检名称
					if(vals.planCount<vals.putInCount){
						var combineJSON = {
							id: vals.id,
							contractNo:vals.planNo,
							supplierId:vals.supplierId,
							supplierName:vals.supplierName,
							titleHtml: "生产计划单号:<span style='color:#5c91e4'>"+vals.planNo+"</span>" ,
							contentList: [
								{
									id: 2,
									isDouble: true,
									labelName: '生产部门',
									labelContent: vals.proDeptName
								},
								{
									id: 3,
									isDouble: true,
									labelName: '日期',
									labelContent: vals.createTime?vals.createTime.substr(0,10):''
								},
								{
									id: 4,
									isDouble: true,
									labelName: '产品名称',
									labelContent: vals.materialName
								},{
									id: 5,
									isDouble: true,
									labelName: '规格型号',
									labelContent:vals.specification,
								},{
									id: 6,
									isDouble: true,
									labelName: '单位',
									labelContent: vals.unitUomName
								},{
									id: 6,
									isDouble: true,
									labelName: '计划生产数量',
									labelContent: vals.planCount
								}
							],
						}
						resData.push(combineJSON);
					}
				});
				console.log(resData)
				return resData;
			},
			//查看详情
			toDetail(index,item){
					uni.navigateTo({
						url: "add?contractNo="+encodeURIComponent(item.contractNo)+"&id="+encodeURIComponent(item.id)
					});
				
			},
		},
		//点击导航栏按钮
		onNavigationBarButtonTap(obj) {
				uni.navigateTo({
				    url: 'add'
				});
		},
		onBackPress(options) { //取消默认的返回事件.
			uni.switchTab({
				url: "../../main/main"
			});
			return true;
		}
	}
</script>

<style>
	page{
		height: 100%;
	}
</style>
<style scoped>
	
	.content{
		position: relative;
	}
	.filter_container {
		position: fixed;
		width: 50%;
		top: var(--window-top);
		background-color: #fff;
		height: 40px;
		z-index: 2;
		padding-top: 7px;
		box-sizing: border-box;
	}


	>>>.dev-label{
		white-space: nowrap;
		min-width: auto;
	}
>>>.select-tab-fixed-top{
	right: 0;
	width: 50%;
	z-index: 2;
	top:var(--window-top);
	white-space: nowrap
}
>>>.popup-layer{
	position: fixed;
	top: var(--window-top);
	margin-top: 40px;
}
>>>.filter-content-detail{
/* 	position: relative;
	height: 90px;
	overflow: scroll; */
}
	.search_container {
		position: relative;
		padding-left: 30px;
		box-sizing: border-box;
		color: #bdbdbd;
		margin: auto;
		width: 80%;
		height: 26px;
		background-color: #F6F6F6;
		border-radius: 26px;
		font-size: 14px;
		line-height: 26px;
	}
.search_icon{
	position: absolute;
	left: 5px;
	top: 3px;
}
	.fliter_content {
		position: absolute;
		right: 15px;
		left: 85px;
		height: 100%;
		z-index: 2;
	}
	.arrowright{
		position: absolute;
		right: 30upx;
		bottom: 30upx;
		font-size: 40upx !important;
	}
	>>>.dev-block__content{
		padding-right: 36upx;
	}
	>>>.dev-block__header-title-text{
		overflow: auto;
		white-space: pre-wrap !important;
		
	}
	.scan_icon{
		position: absolute;
		right: 20px;
		top: 10px;
	}
</style>