zhgdyunapp_vue3/pages/projectEnd/betonManage/inspectionRecord.vue

<template>
	<view class="page_wrap fullHeight">
		<view class="fixedheader">
			<headers :showBack="true">
			<view class="headerName">
				批量送检
			</view>
		</headers>
		</view>
		
		<view class="smallHeight" :style="{ 'padding-top': (statusBarHeight + 45) * 1.5 + 'rpx' }">
			<view class="content">
				<scroll-view class="smallHeight content_list"  scroll-y>
					<view style="padding-top: 36rpx;padding-bottom: 90px">
						<checkbox-group @change="changeCheck" v-if="listData.length>0">
						<view class="list_item" v-for="(item,index) in listData" :key="index">
							 <checkbox :value="item.id" :checked="item.checked" />
							<view class="item_info">
								<view style="margin-bottom: 20rpx">
									<view class="flex">
										<view class="left">
											<view class="info_item"><text style="color: #948EAD">试块名称：</text>{{item.sampleName}}</view>
											<view class="info_item"><text style="color: #948EAD">实验室：</text>{{item.laboratoryName}}</view>
											<view class="info_item"><text style="color: #948EAD">入库时间：</text>{{item.putStorageTime}}</view>
										</view>
										<view class="right">
											<view class="info_item"><text style="color: #948EAD">养护周期(天)：</text>{{item.curingPeriod}}</view>
											<view class="info_item"><text style="color: #948EAD">试验负责人：</text>{{item.laboratoryDirector}}</view>
											<view class="info_item"><text style="color: #948EAD">入库人：</text>{{item.createUserName}}</view>
										</view>
									</view>
								</view>
								<view class="bottom_box">养护已到期，<text style="color: #5181F6" @click="sendInspection(item.id)">点击出库送检</text></view>
							</view>
						</view>
					
						</checkbox-group>
						<view class="no_data" v-else>
							<image src="../../../static/noData.png"></image>
							<view>暂无数据</view>
						</view>
					</view>
					
				</scroll-view>
				
				<view v-if="listData.length>0" class="addForm_btn" @click="goAdd">批量送检</view>
			</view>
		</view>
	</view>
</template>

<script>
export default{
	data(){
		return{
			statusBarHeight: 0,
			listData: [],
			detailId: '',
			checkedArr: []
		}
	},
	onShow(){
		this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight;
	},
	onLoad(options){
		this.detailId = options.id
		this.loadData()
	},
	methods:{
		sendInspection(id){
			let that = this
			this.sendRequest({
				url: 'xmgl/massReboundSampleStorageRecord/updateInspectionBatch',
				data: {ids: id},
				method: "POST",
				success(res) {
					console.log(res)
					uni.showToast({
						title: '送检成功！'
					})
					that.loadData()
				}
			})
		},
		loadData(){
			let that = this
			this.sendRequest({
				url: 'xmgl/massReboundSampleStorageRecord/selectList',
				data: {pouringId: this.detailId, dataType: 1},
				method: "POST",
				success(res) {
					console.log(res)
					that.listData = res.result
				}
			})
		},
		changeCheck(e){
			console.log(e.detail.value)
			this.checkedArr = e.detail.value
		},
		goAdd(){
			if(this.checkedArr < 1){
				return false
			}
			// uni.navigateTo({
			// 	url: './addInspectionRecord'
			// })
			let that = this
			this.sendRequest({
				url: 'xmgl/massReboundSampleStorageRecord/updateInspectionBatch',
				data: {ids: this.checkedArr.join(',')},
				method: "POST",
				success(res) {
					console.log(res)
					uni.showToast({
						title: '送检成功！'
					})
					that.loadData()
				}
			})
		}
	}
}
</script>

<style lang="scss" scoped>
	
	.fixedheader{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 2;
	}
	.smallHeight{
		height: 100%;
		box-sizing: border-box;
	}
	.content{
		height: 100%;
		// background: #fff;
	}
	.content_list{
		background: #fff;
		height: 100%;
		.list_item{
			// height: 150rpx;
			display: flex;
			align-items: center;
			padding: 0 18rpx;
			padding-bottom: 0;
			padding-right: 0px;
			box-sizing: border-box;
			width: 90%;
			margin: 0 auto;
			margin-bottom: 30rpx;
			border-radius: 10rpx;
			box-shadow: 0px 4rpx 11px 0px rgba(212, 220, 236, 0.65);
			position: relative;
			uni-checkbox{
				:deep(.uni-checkbox-input){
					margin-right: 12rpx;
					width: 36rpx;
					height: 36rpx;
					border-radius: 50%;
				}
				:deep(.uni-checkbox-input-checked){
					background-color: rgb(0, 122, 255);
				}
				:deep(.uni-checkbox-input-checked:before){
					color: #fff;
				}
			}
			.status{
				position: absolute;
				top: 0;
				right: 24rpx;
				font-size: 20rpx;
				height: 32rpx;
				line-height: 32rpx;
				padding: 0 20rpx;
				color: #fff;
				border-radius: 0 0 16rpx 16rpx;
			}
			.status1{
				background: rgba(#44D7B5, 1);
			}
			.status2{
				background: rgba(#F65352, 1);
			}
			.left{
				flex: 1;
				font-size: 28rpx;
				margin-right: 10rpx;
			}
			.right{
				flex: 1;
				font-size: 28rpx;
			}
			.info_item{
				margin-bottom: 4rpx;
			}
			
			.item_info{
				// margin-bottom: 20rpx;
				padding-top: 36rpx;
				flex: 1;
			}
			.bottom_box{
				width: 100%;
				height: 76rpx;
				line-height: 76rpx;
				text-align: center;
				font-size: 28rpx;
				background-image: linear-gradient(to right, rgba(81, 129, 246,0), rgba(81, 129, 246, 0.1),rgba(81, 129, 246,0));
			}
		}
		.flex{
			display: flex;
		}
	}
	.addForm_btn{
		width: 88%;
		height: 100rpx;
		line-height: 100rpx;
		font-size: 40rpx;
		background: #4181FE;
		color: #fff;
		border-radius: 50rpx;
		text-align: center;
		position: fixed;
		bottom: 40rpx;
		left: 50%;
		transform: translateX(-50%);
	}
	.no_data{
		text-align: center;
		color: rgba(0,0,0,0.5);
		padding-top: 100rpx;
		uni-image{
			width: 328rpx;
			height: 260rpx;
			display: block;
			margin: 0 auto;
			margin-bottom: 40rpx;
		}
	}
</style>