aiot-app/pages/pda/jobBooking/components/jobBom.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"
					v-if="Object.prototype.hasOwnProperty.call(item, 'product') && clientEnvironmentId != 3">
					<view class="rx ">
						<view class="lable lable220 rx-cc ">投料数量</view>
						<view class="content">

							{{ item.product[0] && item.product[0].feedQuantity }}
						</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>
					<view class="rx ww45 ">
						<view class="lable ww80 rx-cc ">批次号</view>
						<view class="content content_num" style="width: 100%;">
							{{ item.batchNo }}
							<input class="uni-input" v-model="item.workReportInfo.remark" :disabled="isDetails"
								 type="text"></input>
						</view>
					</view>
				</view>


			</view>


		</view>



	</view>
</template>

<script>
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
			}
		}
	},


	data() {
		return {
			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: {


		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>
.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;
				}

			}

			.content_num {
				display: flex;
				align-items: center;
				padding: 0 4rpx;

				/deep/ .uni-input-input {
					border: 2rpx solid #F0F8F2;
					background: #F0F8F2;
					color: $theme-color;
				}


			}

			.pd4 {
				padding: 4rpx 8rpx;
			}



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

		.ww55 {
			width: 55%;
		}

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