aiot-app/pages/pda/jobBooking/components/singleJobBom.vue

<template>
	<view>
		<!-- 单个报工 -->
		<view class="title_box rx-bc">
			<view class="name">报工信息</view>
		</view>


		<view class="material ">


			<view class="content_table">


				<view class="item rx-sc">
					<view class="rx ">
						<view class="lable lable150 rx-cc ">报工数量</view>
						<view class="content">
							{{ tableData.length || 0 }}

						</view>
					</view>

				</view>


				<view class="item rx-sc">
					<view class="rx ww55 ">
						<view class="lable lable150 rx-cc ">要求生产数量</view>
						<view class="content rx-sc">
							<view>{{ item.formingNum }}</view>
							<view class="unit">{{ item.unit }}</view>
						</view>
					</view>

					<view class="rx ww45">
						<view class="lable rx-cc ww80">重量</view>
						<view class="content content_num">
							<view>{{ item.formingWeight }}</view>
							<view class="unit">{{ item.weightUnit }}</view>

						</view>
					</view>

				</view>




				<view class="item rx-sc">
					<view class="rx ww55 ">
						<view class="lable lable150 rx-cc ">合格品数量</view>
						<view class="content content_num">
							<input class="uni-input" v-model="item.workReportInfo.formedNum" :disabled="isDetails"
								@input="blurNum(item.workReportInfo)" type="digit"></input>
							<view class="unit">{{ item.unit }}</view>

						</view>
					</view>

					<view class="rx ww45">
						<view class="lable rx-cc ww80">重量</view>
						<view class="content content_num">
							<input class="uni-input" v-model="item.workReportInfo.formedWeight" type="digit"
								:disabled="isDetails"></input>
							<view class="unit">{{ item.weightUnit }}</view>
						</view>
					</view>

				</view>

				<view class="item rx-sc" v-for="(not, notIndex) in notFormedList" :key='notIndex'>

					<view class="rx ww55 ">

						<view class="lable lable150 rx-cc ">不合格数量</view>
						<view class="content content_num">
							<!-- //详情 -->
							<input class="uni-input" v-model="item.workReportInfo.notFormedNum" type="digit"
								:disabled="isDetails" v-if="isDetails" @input="changeNum"></input>

							<input class="uni-input" v-model="not.notFormedNum" type="number" v-else
								@input="changeNum(not)"></input>
							<view class="unit">{{ item.unit }}</view>
						</view>
					</view>

					<view class="rx ww45">
						<view class="lable rx-cc ww80">重量</view>
						<view class="content content_num">
							<input class="uni-input" v-model="item.workReportInfo.notFormedWeight" type="digit"
								:disabled="isDetails" v-if="isDetails"></input>
							<input class="uni-input" v-model="not.notFormedWeight" type="digit" :disabled="isDetails"
								v-else></input>
							<view class="unit">{{ item.weightUnit }}</view>

							<!-- <view class="penalize" v-if='!isDetails'
								:style="{ background: not.warehouseId ? '#FFA07A' : '' }" @click="penalize">处置</view> -->
							<!-- <view class="penalize" v-if='isDetails'
								:style="{ background: not.warehouseId ? '#FFA07A' : '' }"
								@click="handleView(isDetails ? not.warehouseName : item.warehouseName)">查看</view> -->
						</view>
					</view>
				</view>
				<view class="item rx-sc">
					<view class="rx ww55 ">
						<view class="lable lable150 rx-cc ">报工备注</view>
						<view class="content content_num" style="width: 100%;">
							<input class="uni-input" v-model="item.workReportInfo.remark" :disabled="isDetails"
								type="text"></input>
						</view>

					</view>
					<!-- v-if="clientEnvironmentId==2" -->
					<view class="rx ww45 " v-if="clientEnvironmentId == 2">
						<view class="lable ww80 rx-cc ">批次号</view>
						<view class="content content_num" style="width: 100%;">
							{{ item.batchNo }}
							<input class="uni-input" v-model="batchNo" @input="batchNoNew" :disabled="isDetails"
								type="text"></input>
						</view>
					</view>

					<!-- 不是首工序展示这个按钮 -->
					<view class="unit-btn" @click='singleQuery' v-if="item.currentTaskDiagram.isFirstTask">确认</view>
				</view>


			</view>
			<view class="content_table">
				<!-- <view class="item rx-sc">
					<view class="rx ww55 ">
						<view class="lable lable150 rx-cc ">名称</view>
						<view class="content content_num ">
							<view>{{ forValue.name }}</view>
						</view>
					</view>

					<view class="rx ww45">
						<view class="lable rx-cc ww80">编码</view>
						<view class="content content_num">
							<view>{{ forValue.code }}</view>

						</view>
					</view>

				</view>
				<view class="item rx-sc">
					<view class="rx ww55">
						<view class="lable lable150 rx-cc ww80">单位</view>
						<view class="content content_num">
							<view>{{ forValue.unit }}</view>
						</view>
					</view>
					<view class="rx ww45 ">
						<view class="lable rx-cc ww80">规格</view>
						<view class="content content_num rx-sc">
							<view>{{ forValue.specification }}</view>
						</view>
					</view>
				</view>
				<view class="item rx-sc">


					<view class="rx ww55">
						<view class="lable lable150 rx-cc ww80">牌号</view>
						<view class="content  content_num">
							<view>{{ forValue.brandNum }}</view>

						</view>
					</view>
					<view class="rx ww45">
						<view class="lable rx-cc ww80">型号</view>
						<view class="content content_num">
							<view>{{ forValue.modelType }}</view>
						</view>
					</view>
				</view> -->
				<checkboxTable :tableData="tableData" :itemData="item" @tableDataFn="tableDataFn"></checkboxTable>
			</view>


		</view>



	</view>
</template>

<script>
import {
	createInProduct,
} from '@/api/pda/jobBooking.js'
import checkboxTable from '../componentsTable/checkbox/checkbox.vue'
export default {
	props: {
		item: {
			type: Object,
			default: () => { }
		},
		notFormed: {
			type: Array,
			default: () => []
		},
		isDetails: {
			type: Boolean,
			default: false
		},



	},

	watch: {

		notFormed: {
			immediate: true,
			deep: true,
			handler(newVal) {
				this.notFormedList = newVal
			}
		},
		item: {
			immediate: true,
			deep: true,
			handler(newVal) {
				if (!newVal.currentTaskDiagram.isFirstTask) {
					this.getSemiProductList(newVal)
				}
			}
		}
	},
	components: { checkboxTable },
	data() {
		return {
			forValue: {},

			tableData: [],
			batchNo: '',
			notFormedList: [],
			clientEnvironmentId: uni.getStorageSync("userInfo") && uni.getStorageSync("userInfo")
				.clientEnvironmentId, // *1 主环境-601环境   2 soll-索尔环境    3 tg-碳谷环境

		}
	},
	created() {

		if (this.isDetails) {
			this.notFormedList = this.notFormedList.map(m => {
				return {
					notFormedNum: Number(m.quantity),
					notFormedWeight: m.weight,
					...m
				}

			})
		}

	},

	methods: {
		tableDataFn(tableData) {
			console.log(tableData);
			let adultCount = 0;
			let noAdultCount = 0;

			this.arrDataStatistics(tableData);
			tableData.forEach(v => {
				if(v.selected){
					console.log(11111);
					if(v.extInfo.isQualified==1){
						adultCount+=1
					}else{
						noAdultCount+=1
					}
					
				}
			})
			this.$set(this.item.workReportInfo, 'formedNum', adultCount);
			this.$set(this.notFormedList[0], 'notFormedNum', noAdultCount);
			// this.tableData = this.notFormedList;
			if (!(this.clientEnvironmentId == 3 || this.item.singleReport !== 1)) {
				


				this.item.semiProductList = tableData;


			}



		},

		arrDataStatistics(arr) {
			console.log(arr);

			const adultCount = arr.filter(user => user.extInfo.isQualified == 1).length;
			const noAdultCount = arr.filter(user => user.extInfo.isQualified !== 1).length;

			console.log(adultCount, noAdultCount);
			this.$set(this.item.workReportInfo, 'formedNum', adultCount);
			this.$set(this.notFormedList[0], 'notFormedNum', noAdultCount);

		},

		getSemiProductList(newVal) {
			console.log(newVal);
			if (newVal.semiProductList.length) {
		
				newVal.semiProductList.map(v => {
					v.selected = true;
				})
				this.arrDataStatistics(newVal.semiProductList);
				this.tableData = newVal.semiProductList;

			}
			if (newVal.pickOutInList.length) {
			
				newVal.pickOutInList.map(v => {
					v.selected = true;
				})
				this.arrDataStatistics(newVal.pickOutInList);
				this.tableData = newVal.pickOutInList;

			}
		},

		singleQuery() {
			console.log(this.item.workReportInfo);

			if (!this.item.workReportInfo.formedNum) return uni.showToast({
				icon: 'none',
				title: "请输入合格品数"
			})
			if (this.notFormedList[0].notFormedNum == '' || this.notFormedList[0].notFormedNum == null) return uni.showToast({
				icon: 'none',
				title: "请输入不合格品数"
			})


			const req = {
				"formedNum": this.item.workReportInfo.formedNum,
				"notFormedNum": this.notFormedList[0].notFormedNum,
				"taskId": this.item.workReportInfo.taskId,
				"workOrderId": this.item.workReportInfo.workOrderId
			};

			createInProduct(req).then(res => {
				if (res && res.length) {
					this.forValue = res[0];

					res.map(v => {
						v.selected = true;
					})
					this.tableData = res;
					this.item.semiProductList = res;
				}

			})
		},

		/**
		 * 更新批次号
		 *
		 * @param e 事件对象
		 */
		batchNoNew(e) {

			this.item.workReportInfo.batchNo = this.item.batchNo + e.target.value;

		},

		setFormedNum(num) {
			this.item.workReportInfo.formedNum = num


			let weight = Number(this.item.workReportInfo.formedNum) * Number(this.item.singleWeight) * Number(this
				.item.weightMultiple)

			if (['G', 'g', '克'].includes(this.item.singleWeightUnit)) {
				weight = parseFloat((weight / 1000).toFixed(2))
			} else {
				weight = parseFloat(weight.toFixed(2))
			}

			this.$set(this.item.workReportInfo, 'formedWeight', weight)


			this.$forceUpdate()
		},


		penalize() {

			this.$emit('penalize', null)
		},

		handleView(name) {
			uni.showToast({
				icon: 'none',
				title: name || '未设置'
			})
		},

		blurNum(value) {
			let total = 0;
			//匹配非数字
			let val = value.formedNum;
			let reg = new RegExp("([^0-9]*)", "g");
			let ma = val.match(reg);
			//如果有非数字，替换成""
			if (ma.length > 0) {
				for (let k in ma) {
					if (ma[k] != "") {
						val = val.replace(ma[k], 0);
					}
				}
			}
			//可以为0，但不能以0开头
			if (val.startsWith("0") && val.length > 1) {
				val = val.substring(1, val.length);
			}
			value.formedNum = val;

			if (this.item.currentTaskDiagram.isFirstTask) {

				// formingNum 生产数量  feedQuantity   this.item.product[0] //投料数量
				if (value.formedNum > this.item.formingNum) {
					this.$set(this.item.workReportInfo, 'workReportInfo', this.item.formingNum)
					this.$set(this.notFormedList[0], 'notFormedNum', 0)
					this.notForme()
					return uni.showToast({
						icon: 'none',
						title: '合格品数量不能大于要求生产数量'
					})
				}
			} else {
				if (this.item.product.length) {

					if (value.formedNum > this.item.product[0].feedQuantity) {
						console.log(this.item.product[0].feedQuantity);
						this.$set(this.item.workReportInfo, 'workReportInfo', this.item.product[0].feedQuantity)
						this.$set(this.notFormedList[0], 'notFormedNum', 0)
						this.notForme()
						return uni.showToast({
							icon: 'none',
							title: '合格品数量不能大于投料数量'
						})
					}

				}
			}


			if (this.item.product[0] && this.item.product[0].feedQuantity > 0 && Number(this.item.workReportInfo
				.formedNum)) {

				this.$set(this.notFormedList[0], 'notFormedNum', this.item.product[0].feedQuantity - Number(this.item
					.workReportInfo.formedNum))
				this.notForme()

			}


			let weight = Number(this.item.workReportInfo.formedNum) * Number(this.item.singleWeight) * Number(this
				.item.weightMultiple)

			if (['G', 'g', '克'].includes(this.item.singleWeightUnit)) {
				weight = parseFloat((weight / 1000).toFixed(2))
			} else {
				weight = parseFloat(weight.toFixed(2))
			}

			this.$set(this.item.workReportInfo, 'formedWeight', weight)

			total = Number(this.item.workReportInfo.formedNum) + Number(this.notFormedList[0].notFormedNum)

			console.log(total);

			this.$emit('modeNum', total)

			this.$forceUpdate()

		},

		notForme() {

			let weight = Number(this.notFormedList[0].notFormedNum) * Number(this.item.singleWeight) * Number(this
				.item.weightMultiple)
			if (this.item.singleWeightUnit == 'G' || this.item.singleWeightUnit == 'g' || this.item.singleWeightUnit ==
				'克') {
				weight = parseFloat((weight / 1000).toFixed(2))
			} else {
				weight = parseFloat(weight.toFixed(2))
			}
			this.$set(this.notFormedList[0], 'notFormedWeight', weight)


			if (this.item.product[0] && this.item.product[0].feedQuantity > 0 && Number(this.notFormedList[0]
				.notFormedNum)) {
				this.$set(this.item.workReportInfo, 'formedNum', this.item.product[0].feedQuantity - Number(this
					.notFormedList[0]
					.notFormedNum))


				let weight = Number(this.item.workReportInfo.formedNum) * Number(this.item.singleWeight) * Number(this
					.item.weightMultiple)
				if (this.item.singleWeightUnit == 'G' || this.item.singleWeightUnit == 'g' || this.item
					.singleWeightUnit == '克') {
					weight = parseFloat((weight / 1000).toFixed(2))
				} else {
					weight = parseFloat(weight.toFixed(2))
				}
				this.$set(this.item.workReportInfo, 'formedWeight', weight)

			}



			this.$forceUpdate()

		},

		changeNum(value) {
			// 不合格数量
			let val = value.notFormedNum;
			//匹配非数字
			let reg = new RegExp("([^0-9]*)", "g");
			let ma = val.match(reg);
			//如果有非数字，替换成""
			if (ma.length > 0) {
				for (let k in ma) {
					if (ma[k] != "") {
						val = val.replace(ma[k], "0");
					}
				}
			}
			//可以为0，但不能以0开头
			if (val.startsWith("0") && val.length > 1) {
				val = val.substring(1, val.length);
			}

			// this.$set(this.item.workReportInfo, 'formedNum', val)
			value.notFormedNum = val;

			console.log(Number(this.item.workReportInfo.formedNum), 1);
			console.log(Number(this.notFormedList[0].notFormedNum), 2);


			let total = Number(this.item.workReportInfo.formedNum) + Number(this.notFormedList[0].notFormedNum)


			console.log(total);

			this.$emit('modeNum', total)

			this.notForme()
			// this.blurNum()
		},
	}
}
</script>

<style lang="scss" scoped>
.unit-btn {
	background-color: #157A2C;
	height: 48rpx;
	padding: 0 20rpx;
	line-height: 48rpx;
	color: #fff;
}

.content_num {
	display: flex;
	align-items: center;
	padding: 0 4rpx;
	font-size: 26rpx !important;
	/deep/ .uni-input-input {
		border: 2rpx solid #F0F8F2;
		background: #F0F8F2;
		color: $theme-color;
	}


}

.item {
	display: flex;
	justify-content: space-between;
}

.title_box {
	margin-top: 20rpx;

	.name {
		font-size: 28rpx;
		font-style: normal;
		font-weight: 400;
		color: $theme-color;
		padding-left: 20rpx;

		position: relative;

		&:before {
			position: absolute;
			content: '';
			left: 0rpx;
			top: 0rpx;
			bottom: 0rpx;
			width: 4rpx;
			height: 28rpx;
			background: $theme-color;
			margin: auto;
		}


	}



}


.material {
	margin-top: 10rpx;



	.content_table {
		width: 100%;
		border: 2rpx solid $border-color;

		.item {
			display: flex;
			border-bottom: 2rpx solid $border-color;


			.lable {
				width: 132rpx;
				text-align: center;
				background-color: #F7F9FA;
				font-size: 26rpx;
				border-right: 2rpx solid $border-color;
				flex-shrink: 0;
			}

			.lable220 {
				width: 220rpx !important;
				font-size: 24rpx;
			}

			.lable150 {
				width: 156rpx !important;
				font-size: 24rpx;
			}

			.ww80 {
				width: 80rpx;
			}

			.content {
				width: 518rpx;
				min-height: 64rpx;
				font-size: 28rpx;
				line-height: 28rpx;
				font-style: normal;
				font-weight: 400;
				padding: 18rpx 8rpx;
				box-sizing: border-box;
				word-wrap: break-word;
				flex-grow: 1 !important;


				.unit {
					padding: 0 4rpx;
					font-size: 24rpx;
					color: #404446;
				}

				.penalize {
					width: 160rpx;
					line-height: 60rpx;
					background: $theme-color;
					font-size: 24rpx;
					text-align: center;
					color: #fff;
				}

			}



			.pd4 {
				padding: 4rpx 8rpx;
			}



			&:last-child {
				border-bottom: none;
			}
		}

		.ww55 {
			width: 55%;
		}

		.ww45 {
			width: 45%;
		}
	}
}
</style>