zhuangpeimespda/pages/materialManagement/preparationByPlan/addTask/addTask.vue

<template>
	<view>
		<uni-card>
			<text>{{ '线别:' + lineCode }}</text>
			<ScanInput @scanConfirm="scanConfirm" placeholder="扫码或输入零件号"></ScanInput>
		</uni-card>
		<scroll-view class="scroll-view" scroll-y="true">
			<uni-card v-for="(item, index) in materialList" :key="index" :title="item.title">
				<uni-forms ref="formRef" :modelValue="item">
					<uni-forms-item label="已扫箱" required name="cases">
						<uni-easyinput type="number" :clearable="false" v-model.number="item.cases" />
					</uni-forms-item>
					<uni-forms-item label="零件数" required name="quantity">
						<uni-easyinput type="number" :clearable="false" v-model.number="item.quantity" />
					</uni-forms-item>
				</uni-forms>
				<uni-row :gutter="40">
					<uni-col :span="12">
						<!-- <span>{{item.title}}</span> -->
						<button type="default" @click="refreshButton(index)">复原</button>
					</uni-col>
					<uni-col :span="12">
						<button type="warn" @click="deleteButton(index)">删除</button>
					</uni-col>
				</uni-row>
			</uni-card>
		</scroll-view>
		<view class="bottom-box">
			<uni-row :gutter="20">
				<uni-col :span="12">
					<button type="default" @click="clear">清空</button>
				</uni-col>
				<uni-col :span="12">
					<button type="primary" @click="submit()">提交</button>
				</uni-col>
			</uni-row>
		</view>
	</view>
</template>

<script>
import { analysisScanCode } from '@/api/scan/index';
import { generateIngredientTaskByline } from '@/api/preparationTask/index.js';
import { warn } from 'vue';
export default {
	onLoad: function (option) {
		this.lineCode = option.lineCode;
		this.dateTime = option.dateTime;
		this.$nextTick(() => {});
	},
	data() {
		return {
			formRef: null,
			lineCode: '',
			dateTime: this.$dayjs().format('YYYY-MM-DD'),
			clearMaterialList: [],
			materialList: []
		};
	},
	methods: {
		// 扫码结果
		scanConfirm(val) {
			analysisScanCode({ materialCode: val }).then((res) => {
				if (res.code === 200) {
					const _data = res.data;
					let options = {
						title: `${_data.partnumber} ${_data.materialName}`,
						materialCode: _data.partnumber,
						materialName: _data.materialName,
						specification: _data.specification,
						color: _data.color,
						unit: _data.unit,
						cases: 1,
						quantity: 0
					};
					let _index = this.hasMaterial(options.materialCode);
					if (_index === -1) {
						this.materialList.push(options);
					} else {
						this.materialList[_index].cases += 1;
					}
				}
			});
		},
		// 是否已存在此零件
		hasMaterial(materialCode) {
			let index = 0;
			const list = this.materialList;
			for (index; index < list.length; index++) {
				if (list[index].materialCode === materialCode) {
					return index;
				}
			}
			return -1;
		},
		clear() {
			this.materialList = JSON.parse(JSON.stringify(this.clearMaterialList));
		},
		submit(ref) {
			if (!this.formValidate()) {
				return;
			}
			const postData = {
				Ingredient_task: this.materialList,
				lineCode: this.lineCode,
				HandleDate: this.dateTime
			};
			generateIngredientTaskByline(postData).then((res) => {
				if (res.code === 200) {
					uni.showToast({
						icon: 'success',
						title: '提交成功'
					});
					this.clear();
				}
			});
		},
		refreshButton(index) {
			this.materialList[index].cases = 1;
			this.materialList[index].quantity = 0;
		},
		deleteButton(index) {
			this.materialList.splice(index, 1);
		},
		// 手动校验
		formValidate() {
			if (this.materialList.length === 0) {
				uni.showToast({
					icon: 'none',
					title: '无零件'
				});
				return false;
			}
			for (let item of this.materialList) {
				if (item.quantity === 0) {
					uni.showToast({
						icon: 'none',
						title: item.materialCode + '零件号不可为0'
					});
					return false;
				}
				if (item.quantity === '') {
					uni.showToast({
						icon: 'none',
						title: item.materialCode + '零件号不可为空'
					});
					return false;
				}
			}
			return true;
		}
	}
};
</script>

<style scoped>
	.scroll-view{
		height: 1000rpx;
		padding-bottom: 40rpx;
	}
</style>