fix:[模板管理]麻精药配置表单

src/lang/en/template/commonTemplate.js

@@ -46,6 +46,7 @@ export default {
 
   // 按钮
   saveBtn: 'Save',
+  addBtn: 'Add',
   deleteBtn: 'Delete',
 
   // 错误提示

src/lang/zh/template/commonTemplate.js

@@ -46,6 +46,7 @@ export default {
 
 
   // 按钮
+  addBtn: '新增',
   saveBtn: '保存',
   deleteBtn: '刪除',
 

src/views/business/comps/template/comps/gsp/DMYPPZJLB.vue

@@ -2,31 +2,49 @@
 <template>
 	<div>
 		<div class="detail-container">
-			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{ formData.bdmc }}<img src="@/assets/images/detail-title.png" /></div>
+			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{ formData.bdmc }}<img
+					src="@/assets/images/detail-title.png" /></div>
 			<div class="detail-content">
 				<div class="content">
+					<!-- 基本信息 -->
 					<BaseInfoFormPackage fieldItemLabel="template.common.baseInfo" label="template.common.baseInfo"
 						ref="baseInfoRef" :formConfig="baseInfoFormConfig" :formData="formData" />
+					<!-- 基本信息 -->
 					<TableList label="template.common.reagentInfo" :columns="sysjColumns" :dataSource="resource" />
 					<TableList label="template.common.wzInfo" :columns="sywzColumns" :dataSource="resourceWz" />
 					<TableList label="template.common.instrumentInfo" :columns="yqColumns" :dataSource="yqResource" />
+					<!-- 存储条件 -->
 					<BaseInfoFormPackage fieldItemLabel="template.common.storageCondition"
 						label="template.common.storageCondition" ref="storageConditionRef"
 						:formConfig="storageFormConfig" :formData="formData" />
 					<LineLabel label="template.common.operationSteps" />
-					<div class="template-form-item">
-						<el-button class="print-btn" v-if="fillType === 'actFill'" type="primary"
-							@click="printTag">{{ $t('template.common.bqdy') }}</el-button>
-						<BaseInfoFormPackage fieldItemLabel="template.common.operationSteps" ref="stepFormPackageRef"
-							:formConfig="stepFormConfig" @blur="onHandleBlur" :formData="formData" />
+					<!-- 操作步骤 -->
+					<div v-for="(formConfig, ladderIndex) in formData.formConfigs" :key="'ladder_' + ladderIndex">
+						<div class="template-form-item">
+							<div class="config-header-right">
+								<el-button v-if="fillType === 'preFill'" type="primary" @click="handleAddFormConfig">{{
+									$t('template.common.addBtn') }}</el-button>
+								<el-button v-if="fillType === 'preFill' && formData.formConfigs.length > 1"
+									type="danger" @click="handleDeleteFormConfig(ladderIndex)">{{
+										$t('template.common.deleteBtn')
+									}}</el-button>
+								<el-button class="print-btn" v-if="fillType === 'actFill'" type="primary"
+									@click="printTag">{{ $t('template.common.bqdy') }}</el-button>
+							</div>
+							<BaseInfoFormPackage fieldItemLabel="template.common.operationSteps"
+								:ref="`formConfigStepFormPackageRef_${ladderIndex}`" :formConfig="stepFormConfig"
+								:formData="formConfig" />
+							<Step class="mt-0 s-container" :ref="`formStepRef_${ladderIndex}`"
+								:formData="formConfig.stepData" :fieldItemLabel="$t('template.common.jtpz')"
+								:prefixKey="'form_' + ladderIndex"></Step>
+						</div>
 					</div>
-					<Step ref="stepRef" :formData="formData.stepData"></Step>
+					<!-- 备注 -->
 					<BaseInfoFormPackage fieldItemLabel="template.common.remark" label="template.common.remark"
 						ref="remarkRef" :formConfig="remarkConig" :formData="formData" />
 				</div>
 			</div>
 		</div>
-		<!-- <button @click="onSave">保存</button> -->
 	</div>
 </template>
 
@@ -41,6 +59,7 @@ import { getLatestSn } from '@/api/template';
 import { EventBus } from "@/utils/eventBus";
 import { uniqeResource } from "@/utils/calUnitTools";
 import { debounce } from 'lodash-es'
+import { duplicateResource, getExpireDate } from "@/utils/index.js";
 
 export default {
 	name: "DMYPPZJLB",
@@ -249,13 +268,32 @@ export default {
 	},
 	mounted() {
 		const formData = this.getFormDataByTemplateData();
-		if(!formData.targetCodeSn&& this.fillType === "actFill"){
+		if (!formData.targetCodeSn && this.fillType === "actFill") {
 			this.getCode(formData);
+		} else {
+			if (!this.formData.formConfigs) {
+				this.$set(this.formData, 'formConfigs', []);
+				this.formData.formConfigs.push({
+					formConfigs: [],
+				});
+			}
 		}
-
 	},
 	methods: {
-		//打印标签
+		//新增
+		handleAddFormConfig() {
+			if (!this.formData.formConfigs) {
+				this.$set(this.formData, 'formConfigs', []);
+			}
+			this.formData.formConfigs.push({
+				formConfigs: [],
+			});
+		},
+		//删除
+		handleDeleteFormConfig(index) {
+			this.formData.formConfigs.splice(index, 1);
+		},
+		//todo 打印标签
 		printTag() {
 			const printConfig = this.getBasePrintConfig();
 			const { storageCondition, targetCodeSn } = this.formData;
@@ -264,58 +302,123 @@ export default {
 
 			EventBus.$emit('showTagPrintDialog', { printConfig })
 		},
-		//获取目标溶液编号
+		//填报获取编号
 		getCode: debounce(async function (v) {
-			const result = await getLatestSn({
-				count: 1,
-				pre:v.targetCode,
-				type:1
-			})
-			if (result.code == 200) {
-				this.$refs.stepFormPackageRef.updateFormData("targetCodeSn", result.data[0])
+			if (this.formData.formConfigs && this.formData.formConfigs.length > 0) {
+				for (let i = 0; i < this.formData.formConfigs.length; i++) {
+					let item = this.formData.formConfigs[i]
+					const result = await getLatestSn({
+						count: 1,
+						pre: item.targetCode,
+						type: 1
+					})
+					if (result.code == 200) {
+						this.$refs[`formConfigStepFormPackageRef_${i}`][0].updateFormData("targetCodeSn", result.data[0])
+					}
+				}
 			}
 		}, 100),
-		//获取已填写的表单数据
+		//获取字段值，不检验
 		getFilledFormData() {
-			return this.getFilledFormDataByRefs(["baseInfoRef", "storageConditionRef", "stepFormPackageRef", "stepRef", "remarkRef"])
+			const baseData = this.$refs.baseInfoRef.getFilledFormData();
+			const conditionData = this.$refs.storageConditionRef.getFilledFormData();
+			const formConfigsData = [];
+			if (this.formData.formConfigs && this.formData.formConfigs.length > 0) {
+				for (let i = 0; i < this.formData.formConfigs.length; i++) {
+					const formData = this.$refs[`formConfigStepFormPackageRef_${i}`][0].getFilledFormData();
+					const stepData = this.$refs[`formStepRef_${i}`][0].getFilledFormData();
+					if(this.formData.startDate&&formData.effectivePeriod&&formData.effectivePeriodUnit){
+					   formData.expireDate=getExpireDate(this.formData.startDate, formData.effectivePeriod, formData.effectivePeriodUnit)
+					}
+					formConfigsData.push({
+						...formData,
+						...stepData,
+					});
+				}
+			}
+			const remarkData = this.$refs.remarkRef.getFilledFormData();
+			return {
+				...baseData,
+				...conditionData,
+				formConfigs: formConfigsData,
+				...remarkData
+			}
+		},
+		//检验
+		async validFields() {
+			// 构建需要验证的引用数组
+			let refsToValidate = ["baseInfoRef", "storageConditionRef", "remarkRef"];
+
+			if (this.formData.formConfigs && this.formData.formConfigs.length > 0) {
+				for (let i = 0; i < this.formData.formConfigs.length; i++) {
+					refsToValidate.push(`formConfigStepFormPackageRef_${i}`);
+					refsToValidate.push(`formStepRef_${i}`);
+				}
+			}
+
+			return await this.validFormFields(refsToValidate);
 		},
-		//获取填写完成的表单数据
+		//获取字段值
 		async getFormData() {
-			let content = await this.validFormFields(["baseInfoRef", "storageConditionRef", "stepFormPackageRef", "stepRef", "remarkRef"]);
+			//先校验再获取值
+			const validFlag = await this.validFields();
+			if (!validFlag) {
+				return false;
+			}
+			let content = this.getFilledFormData();
+			return content;
+		},
+		//获取生成，使用物资
+		getResource() {
+			let content = this.getFilledFormData();
 			//生成resource
 			let tmpResource = []
 			if (this.fillType === "actFill") {
-				//配置的试剂
-				tmpResource.push({
-					mc: content.targetName,
-					bh: content.targetCode + content.targetCodeSn,
-					ph: '',
-					ndz: content.targetActConcentration + content.targetActConcentrationUnit,
-					nd: content.targetActConcentration,
-					nddw: content.targetActConcentrationUnit,
-					ly: 'ELN配制',
-					sxrq: content.expireDate,
-					kc: content.targetActVolume,
-					kcdw: content.targetActVolumeUnit,
-					syl: null,
-					type: null,
-					elnType: this.product,
-					syldw: content.targetActVolumeUnit,
-					yxzq: content.effectivePeriod,
-					yxzqdw: content.effectivePeriodUnit,
-				})
+				let tableList = content.formConfigs
+				if (tableList && tableList.length > 0) {
+					for (let i = 0; i < tableList.length; i++) {
+						let item = tableList[i]
+						tmpResource.push({
+							mc: item.targetName,
+							bh: item.targetCode + item.targetCodeSn,
+							ph: '',
+							ndz: item.targetActConcentration + item.targetActConcentrationUnit,
+							nd: item.targetActConcentration,
+							nddw: item.targetActConcentrationUnit,
+							ly: 'ELN配制',
+							sxrq: item.expireDate,
+							kc: item.targetActVolume,
+							kcdw: item.targetActVolumeUnit,
+							syl: null,
+							type: null,
+							elnType: this.product,
+							syldw: item.targetActVolumeUnit,
+							yxzq: item.effectivePeriod,
+							yxzqdw: item.effectivePeriodUnit,
+						})
+					}
+				}
 			}
 			//使用的试剂、仪器
-			const stepResource = this.$refs.stepRef.getStepResource()
-			this.resourceTmp =uniqeResource(tmpResource,stepResource.sjResource||[])
-			this.yqResourceTmp = stepResource.yqResource||[]
-			return content;
+			const stepResource = this.getStepResource()
+			this.resourceTmp = uniqeResource(tmpResource, stepResource.sjResource || [])
+			this.yqResourceTmp = stepResource.yqResource || []
+			debugger
+			return this.resourceTmp;
 		},
-		//保存
-		async onSave() {
-			let content =await this.$refs.stepRef.getFormData();
-			console.log(content);
-			
+		//获取步骤使用物资
+		getStepResource() {
+			const sjResource = [], yqResource = [];
+			if (this.formData.formConfigs && this.formData.formConfigs.length > 0) {
+				for (let i = 0; i < this.formData.formConfigs.length; i++) {
+					const paralleResource = this.$refs[`formStepRef_${i}`][0].getStepResource();
+					sjResource.push(...paralleResource.sjResource);
+					yqResource.push(...paralleResource.yqResource);
+				}
+			}
+			//去重
+			const { sj, yq } = duplicateResource(sjResource, yqResource)
+			return { sjResource: sj, yqResource: yq };
 		},
 	}
 };
@@ -328,4 +431,13 @@ export default {
 .print-btn {
 	margin-bottom: 20px;
 }
+
+.config-header-right {
+	margin-bottom: 15px;
+	font-weight: bold;
+	font-size: 16px;
+	color: #303133;
+	text-align: right;
+	width: 100%;
+}
 </style>