<!-- 生物样品内标工作液制备表 -->
<template>
	<div>
		<div class="detail-container">
			<div class="detail-title"><img src="@/assets/images/detail-title.png">生物样品内标工作液制备表<img
					src="@/assets/images/detail-title.png" /></div>
			<div class="detail-content">
				<div class="content">
					<BaseInfoFormPcakge label="试验基本信息" ref="baseInfoRef" :formConfig="baseInfoFormConfig"
						:formData="formData" />
					<TableList label="试验试剂信息" :columns="sysjColumns" :dataSource="dataSource" />
					<TableList label="仪器使用信息" :columns="yqsColumns" :dataSource="dataSource" />
					<BaseInfoFormPcakge label="存储条件" ref="storageConditionRef" :formConfig="storageFormConfig"
						:formData="formData" />
					<LineLabel label="操作步骤" />
					<div class = "mt-20">
						<el-button type="primary" @click="handleAddParalle">新增平行配制</el-button>
						<el-button type="primary" @click="handleAddLadder">新增阶梯配制</el-button>
					</div>
					
					<!-- 阶梯配制区域 -->
					<div 
						label="阶梯配制" 
						v-for="(ladderConfig, ladderIndex) in formData.ladderConfigs" 
						:key="'ladder_' + ladderIndex"
					>
						
						<div class="template-form-item">
							<div class="config-header">
								<div>阶梯配制</div>
								<el-button 
									type="text" 
									icon="el-icon-delete" 
									@click="deleteLadderConfig(ladderIndex)"
								>删除</el-button>
							</div>
							<BaseInfoFormPcakge 
								@clickable="handleClickable" 
								:ref="`ladderStepFormPackageRef_${ladderIndex}`"
								:formConfig="ladderStepFormConfig" 
								@blur="onHandleBlur" 
								:formData="ladderConfig" 
							/>
							<CustomTable 
								@blur="onHandleTableBlur" 
								:showOperation="fillType === 'actFill'"
								:ref="`ladderStepTableRef_${ladderIndex}`" 
								:columns="ladderStepColumns" 
								:formData="ladderConfig"
							>
								<template slot="operation" slot-scope="{ row, rowIndex}">
									<TableOpertaion 
										:fillType="fillType" 
										:row="row" 
										:rowIndex="rowIndex"
										@deleteRow="(rowIndex) => deleteRow(rowIndex, 'ladder', ladderIndex)"
									></TableOpertaion>
								</template>
							</CustomTable>
							<div class="add-row">
								<el-button @click="handleAddRow('ladder', undefined, ladderIndex)">添加行</el-button>
							</div>
							<Step 
								class="mt-0"
								:ref="`ladderStepRef_${ladderIndex}`" 
								:formData="ladderConfig.ladderStepData"
							></Step>
						</div>
					</div>
					
					<!-- 平行配制区域 -->
					<div 
						label="平行配制" 
						v-for="(paralleConfig, paralleIndex) in formData.paralleConfigs" 
						:key="'paralle_' + paralleIndex"
					>
						
						<div class="template-form-item">
							<div class="config-header">
								<div>平行配制</div>
								<el-button 
									type="text" 
									icon="el-icon-delete" 
									@click="deleteParalleConfig(paralleIndex)"
								>删除</el-button>
							</div>
							<BaseInfoFormPcakge 
								@clickable="handleClickable" 
								:ref="`paralleStepFormPackageRef_${paralleIndex}`"
								:formConfig="paralleStepFormConfig" 
								@blur="onHandleBlur" 
								:formData="paralleConfig" 
							/>
							<CustomTable 
								@blur="onHandleTableBlur" 
								:showOperation="fillType === 'actFill'"
								:ref="`paralleStepTableRef_${paralleIndex}`" 
								:columns="paralleStepColumns" 
								:formData="paralleConfig"
							>
								<template slot="operation" slot-scope="{ row, rowIndex}">
									<TableOpertaion 
										:fillType="fillType" 
										:row="row" 
										:rowIndex="rowIndex"
										@deleteRow="(rowIndex) => deleteRow(rowIndex, 'paralle', paralleIndex)"
									></TableOpertaion>
								</template>
							</CustomTable>
							<div class="add-row">
								<el-button @click="handleAddRow('paralle', undefined, paralleIndex)">添加行</el-button>
							</div>
							<Step 
								class="mt-0"
								:ref="`paralleStepRef_${paralleIndex}`" 
								:formData="paralleConfig.paralleStepData"
							></Step>
						</div>
					</div>
					<BaseInfoFormPcakge label="备注" ref="remarkRef" :formConfig="remarkConig" :formData="formData" />

				</div>
			</div>
			<button @click="onSave">保存</button>
		</div>
		<SelectReagentDialog @submit="onSelectReagentSubmit" @cancel="selectReagentVisible = false"
			ref="selectReagentDialogRef" :visible.sync="selectReagentVisible">
		</SelectReagentDialog>
	</div>
</template>

<script>
import BaseInfoFormPcakge from "@/components/Template/BaseInfoFormPcakge";
import LineLabel from "@/components/Template/LineLabel";
import TableList from "@/components/Template/Table";
import Step from "@/components/Template/Step";
import templateMixin from "../../mixins/templateMixin";
import CustomTable from '@/components/Template/CustomTable.vue';
import SelectReagentDialog from '../../dialog/SelectReagentDialog.vue';
import TableOpertaion from "@/components/Template/operation/TableOpertaion.vue"

export default {
	name: "SWYPBQGZYZBB",
	components: { BaseInfoFormPcakge, LineLabel, TableList, Step, CustomTable, SelectReagentDialog, TableOpertaion },
	mixins: [templateMixin],
	props: {
		fillType: {
			type: String,
			default: 'preFill',
		},
	},
	watch: {
		value: {
			immediate: true,
			handler(v) {
				// 数据回显
				if (v && Object.keys(v).length > 0) {
					this.formData = { ...this.formData, ...v };
					
					// 处理阶梯配制配置
					if (v.ladderConfigs && Array.isArray(v.ladderConfigs) && v.ladderConfigs.length > 0) {
						// 确保 ladderConfigs 是数组
						if (!this.formData.ladderConfigs || !Array.isArray(this.formData.ladderConfigs)) {
							this.$set(this.formData, 'ladderConfigs', []);
						}
						
						// 回显每个阶梯配制配置的数据
						v.ladderConfigs.forEach((ladderConfig, index) => {
							// 确保配置项有必要的属性
							if (!this.formData.ladderConfigs[index]) {
								this.formData.ladderConfigs[index] = {
									ladderStepData: [],
									ladderTableFormData: [],
									showLadderConfig: true
								};
							}
							
							// 回显表格数据
							if (ladderConfig.ladderTableFormData && ladderConfig.ladderTableFormData.length > 0 && this.$refs[`ladderStepTableRef_${index}`]) {
								this.$refs[`ladderStepTableRef_${index}`].updateDataSource(ladderConfig.ladderTableFormData);
							}
							
							// 确保步骤数据有值
							if (!ladderConfig.ladderStepData) {
								this.$set(this.formData.ladderConfigs[index], 'ladderStepData', []);
							}
							
							// 确保显示状态有值
							if (ladderConfig.showLadderConfig === undefined) {
								this.$set(this.formData.ladderConfigs[index], 'showLadderConfig', !!ladderConfig.ladderStepData && ladderConfig.ladderStepData.length > 0);
							}
						});
					}
					
					// 处理平行配制配置
					if (v.paralleConfigs && Array.isArray(v.paralleConfigs) && v.paralleConfigs.length > 0) {
						// 确保 paralleConfigs 是数组
						if (!this.formData.paralleConfigs || !Array.isArray(this.formData.paralleConfigs)) {
							this.$set(this.formData, 'paralleConfigs', []);
						}
						
						// 回显每个平行配制配置的数据
						v.paralleConfigs.forEach((paralleConfig, index) => {
							// 确保配置项有必要的属性
							if (!this.formData.paralleConfigs[index]) {
								this.formData.paralleConfigs[index] = {
									paralleStepData: [],
									paralleTableFormData: [],
									showParalleConfig: true
								};
							}
							
							// 回显表格数据
							if (paralleConfig.paralleTableFormData && paralleConfig.paralleTableFormData.length > 0 && this.$refs[`paralleStepTableRef_${index}`]) {
								this.$refs[`paralleStepTableRef_${index}`].updateDataSource(paralleConfig.paralleTableFormData);
							}
							
							// 确保步骤数据有值
							if (!paralleConfig.paralleStepData) {
								this.$set(this.formData.paralleConfigs[index], 'paralleStepData', []);
							}
							
							// 确保显示状态有值
							if (paralleConfig.showParalleConfig === undefined) {
								this.$set(this.formData.paralleConfigs[index], 'showParalleConfig', !!paralleConfig.paralleStepData && paralleConfig.paralleStepData.length > 0);
							}
						});
					}
					
					// 兼容旧数据格式（单个配置）
					if (v.ladderTableFormData && v.ladderTableFormData.length > 0 && (!v.ladderConfigs || v.ladderConfigs.length === 0)) {
						this.formData.ladderConfigs = [{
							ladderStepData: v.ladderStepData || [],
							ladderTableFormData: v.ladderTableFormData,
							showLadderConfig: v.showLadderConfig !== undefined ? v.showLadderConfig : true
						}];
					}
					
					if (v.paralleTableFormData && v.paralleTableFormData.length > 0 && (!v.paralleConfigs || v.paralleConfigs.length === 0)) {
						this.formData.paralleConfigs = [{
							paralleStepData: v.paralleStepData || [],
							paralleTableFormData: v.paralleTableFormData,
							showParalleConfig: v.showParalleConfig !== undefined ? v.showParalleConfig : true
						}];
					}
				}
			}
		},
		fillType: {
			immediate: true,
			handler(v) {
				console.log(v, "fillType")
			}
		},
	},
	computed: {
		// 存储条件表单配置
		storageFormConfig() {
			return [
				{
					type: "conditionItem",
					config: {
						storageCondition1: {
							label: "存储条件",
							type: "select",
							fillType: "preFill",
							options: this.getDictOptions('business_cctj'),
							otherCode: "other1",
						},

					}
				}
			];
		},
		// 备注表单配置
		remarkConig() {
			return [
				{
					type: "cellItem",
					config: {
						remark: {
							label: "",
							type: "textarea",
							fillType: "actFill",
							span: 1,
							placeholder: "请输入备注",
							maxlength: 1000,
							rows: 5
						}
					}
				}
			]
		},
		// 试验基本信息表单配置
		baseInfoFormConfig() {
			return [
				{
					type: "cardItem",
					config: {
						studyMc: {
							label: "试验名称",
							type: "input",
							disabled: true,
						},
						studySn: {
							label: "试验编号",
							type: "input",
							disabled: true,
						},
						methodCode: {
							label: "方法编号",
							type: "input",
							fillType: "preFill",
							maxlength: 50,
						},
						versionNum: {
							label: "版本号",
							type: "inputNumber",
							fillType: "actFill",
							prepend: "V",
							maxlength: 50,
						},

					}
				},
				{
					type: "conditionItem",
					label: "试验配制条件",
					config: {
						pre: {
							label: "预填",
							type: "select",
							multiple: true,
							fillType: "preFill",
							options: this.getDictOptions('business_pztj'),
							otherCode: "preOther",
						},
						act: {
							label: "实际",
							type: "select",
							fillType: "actFill",
							otherCode: "actOther",
							multiple: true,
							options: this.getDictOptions('business_pztj')
						}
					}
				},
				{
					type: "cellItem",
					config: {
						containerMaterial: {
							label: "容器材质",
							type: "select",
							options: this.getDictOptions('business_rqcz'),
							fillType: "actFill",
							otherCode: "containerMaterialOther",
						}
					}
				},
				{
					type: "cellItem",
					label: "处理时间",
					config: {
						createTime: {
							label: "开始时间",
							type: "input",
						},
						endTime: {
							label: "结束时间",
							type: "input",
						},
					}
				}
			]
		},
		paralleStepFormConfig(){
			return[
				{
					type:"step",
					config:{
						solution: {
							label: "稀释液",
							type: "input",
							fillType: "preFill",
							subType: "clickable",
							subKey: "subSolution",
							subFillType: "actFill",
							maxlength: 20,
						},
						stepStorageCondition: {
							label: "存储条件",
							type: "select",
							fillType: "preFill",
							options: this.getDictOptions('business_cctj'),
							otherCode: "stepStorageConditionOther",
						},
					}
				}
			]
		},
		// 操作步骤表单配置
		ladderStepFormConfig() {
			return [
				{
					type: "step",
					config: {
						startSolution: {
							label: "起始源溶液",
							type: "input",
							fillType: "preFill",
							subType: "clickable",
							subKey: "subStartSolution",
							subFillType: "actFill",
							maxlength: 20,
						},
						targetStartSolution: {
							label: "预设起始源溶液浓度",
							type: "inputNumber",
							subType: "select",
							fillType: "preFill",
							subOptions: this.getDictOptions('business_nddw'),
							subKey: "subTargetStartSolution",
							maxlength: 10,
						},
						targetAcSolution: {
							label: "实际起始源溶液浓度",
							type: "input",
							fillType: "actFill",
							disabled: true,
							maxlength: 10,
						},
						solution: {
							label: "稀释液",
							type: "input",
							fillType: "preFill",
							subType: "clickable",
							subKey: "subSolution",
							subFillType: "actFill",
							maxlength: 20,
						},
						codeSTD: {
							label: "起始编号STD",
							type: "input",
							maxlength: 10,
							fillType: "preFill",
						},
						stepStorageCondition: {
							label: "存储条件",
							type: "select",
							fillType: "preFill",
							options: this.getDictOptions('business_cctj'),
							otherCode: "stepStorageConditionOther",
						},

						effectivePeriod: {
							label: "目标溶液有效周期",
							type: "input",
							subType: "select",
							subKey: "effectivePeriodUnit",
							fillType: "preFill",
							subOptions: this.getDictOptions('business_yxqdw'),
						},
						expireDate: {
							label: "目标溶液失效日",
							type: "input",
						},
					}
				}
			]
		},
		paralleStepColumns() {
			return [
				{
					label: "目标溶液编号",
					prop: "targetSolutionCode",
					bodyType: "input",
					subType: "span",
					subKey: "subTargetSolutionCode",
					bodyFillType: "preFill",
					width: 280
				},
				{
					label: "起始溶液编号",
					prop: "startSolutionCode",
					width: 280,
					bodyType: "input",
					bodyFillType: "actFill",
					bodyMaxlength: 10,
				},
				{
					label: "预设起始溶液体积",
					prop: "targetStartSolutionVolume",
					width: 280,
					headerSelectKey: "targetStartSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "targetStartSolutionVolumePrecision",
					bodyFillType: "preFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "targetStartSolutionVolumePrecision",
					bodyMaxlength: 10,
					bodySubPlaceholder: "请输入保留小数位数",
				},
				{
					label: "实际起始溶液体积",
					prop: "actStartSolutionVolume",
					width: 280,
					headerSelectKey: "actStartSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					bodyType: "inputNumber",
					bodyFillType: "actFill",
					bodyMaxlength: 10,
					copyFrom: "targetStartSolutionVolume",//复制哪个字段
				},
				{
					label: "预设稀释液体积",
					prop: "targetDiluentVolume",
					width: 280,
					headerSelectKey: "targetDiluentVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "targetDiluentVolumePrecision",
					bodyFillType: "preFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "targetDiluentVolumePrecision",
					bodyMaxlength: 10,
					bodySubPlaceholder: "请输入保留小数位数",
				},
				{
					label: "实际稀释液体积",
					prop: "actDiluentVolume",
					width: 280,
					headerSelectKey: "actDiluentVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					bodyType: "inputNumber",
					bodyFillType: "actFill",
					bodyMaxlength: 10,
					copyFrom: "targetDiluentVolume",//复制哪个字段
				},
				{
					label: "预设目标溶液浓度",
					prop: "targetSolutionConcentration",
					width: 280,
					headerSelectKey: "targetSolutionConcentrationUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_nddw'),
					bodyType: "inputNumber",
					bodyFillType: "preFill",
					bodyMaxlength: 10,
				},
				{
					label: "实际目标溶液浓度",
					prop: "actSolutionConcentration",
					width: 280,
					headerSelectKey: "actSolutionConcentrationUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_nddw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "actSolutionConcentrationPrecision",
					bodyFillType: "actFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "actSolutionConcentrationPrecision",
					bodyMaxlength: 10,
					copyFrom: "targetSolutionConcentration",//复制哪个字段
					bodySubPlaceholder: "请输入保留小数位数",
				},
				{
					label: "预设目标溶液体积",
					prop: "targetSolutionVolume",
					width: 280,
					headerSelectKey: "targetSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					bodyType: "inputNumber",
					bodyFillType: "preFill",
					bodyMaxlength: 10,
				},
				{
					label: "实际目标溶液体积",
					prop: "actSolutionVolume",
					width: 280,
					headerSelectKey: "actSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "actSolutionVolumePrecision",
					bodyFillType: "actFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "actSolutionVolumePrecision",
					bodyMaxlength: 10,
					copyFrom: "targetSolutionVolume",//复制哪个字段
					bodySubPlaceholder: "请输入保留小数位数",
				},
			]
		},
		// 步骤表格列配置
		ladderStepColumns() {
			return [
				{
					label: "目标溶液编号",
					prop: "targetSolutionCode",
					bodyType: "input",
					subType: "span",
					subKey: "subTargetSolutionCode",
					bodyFillType: "preFill",
					width: 280
				},
				{
					label: "起始溶液编号",
					prop: "startSolutionCode",
					width: 280,
					bodyType: "input",
					bodyFillType: "actFill",
					bodyMaxlength: 10,
				},
				{
					label: "预设起始溶液体积",
					prop: "targetStartSolutionVolume",
					width: 280,
					headerSelectKey: "targetStartSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "targetStartSolutionVolumePrecision",
					bodyFillType: "preFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "targetStartSolutionVolumePrecision",
					bodyMaxlength: 10,
					bodySubPlaceholder: "请输入保留小数位数",
				},
				{
					label: "实际起始溶液体积",
					prop: "actStartSolutionVolume",
					width: 280,
					headerSelectKey: "actStartSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					bodyType: "inputNumber",
					bodyFillType: "actFill",
					bodyMaxlength: 10,
					copyFrom: "targetStartSolutionVolume",//复制哪个字段
				},
				{
					label: "预设稀释液体积",
					prop: "targetDiluentVolume",
					width: 280,
					headerSelectKey: "targetDiluentVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "targetDiluentVolumePrecision",
					bodyFillType: "preFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "targetDiluentVolumePrecision",
					bodyMaxlength: 10,
					bodySubPlaceholder: "请输入保留小数位数",
				},
				{
					label: "实际稀释液体积",
					prop: "actDiluentVolume",
					width: 280,
					headerSelectKey: "actDiluentVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					bodyType: "inputNumber",
					bodyFillType: "actFill",
					bodyMaxlength: 10,
					copyFrom: "targetDiluentVolume",//复制哪个字段
				},
				{
					label: "预设目标溶液浓度",
					prop: "targetSolutionConcentration",
					width: 280,
					headerSelectKey: "targetSolutionConcentrationUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_nddw'),
					bodyType: "inputNumber",
					bodyFillType: "preFill",
					bodyMaxlength: 10,
				},
				{
					label: "实际目标溶液浓度",
					prop: "actSolutionConcentration",
					width: 280,
					headerSelectKey: "actSolutionConcentrationUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_nddw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "actSolutionConcentrationPrecision",
					bodyFillType: "actFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "actSolutionConcentrationPrecision",
					bodyMaxlength: 10,
					copyFrom: "targetSolutionConcentration",//复制哪个字段
					bodySubPlaceholder: "请输入保留小数位数",
				},
				{
					label: "预设目标溶液体积",
					prop: "targetSolutionVolume",
					width: 280,
					headerSelectKey: "targetSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					bodyType: "inputNumber",
					bodyFillType: "preFill",
					bodyMaxlength: 10,
				},
				{
					label: "实际目标溶液体积",
					prop: "actSolutionVolume",
					width: 280,
					headerSelectKey: "actSolutionVolumeUnit",
					fillType: "preFill",
					headerOptions: this.getDictOptions('business_tjdw'),
					defaultValue: "mg",
					bodyType: "inputNumber",
					bodySubType: "inputNumber",
					bodySubKey: "actSolutionVolumePrecision",
					bodyFillType: "actFill",
					bodySubFillType: "preFill",
					showBodySub: this.fillType === "preFill",
					bodyDisabled: true,
					bodyPrecisionKey: "actSolutionVolumePrecision",
					bodyMaxlength: 10,
					copyFrom: "targetSolutionVolume",//复制哪个字段
					bodySubPlaceholder: "请输入保留小数位数",
				},
			]
		},
	},
	data() {
		return {
			selectReagentVisible: false,
			subSolutionVisible: false,
			currentSubKey: "",//当前点击的子项key
			dataSource: [],
			stepTableDataSource: [],
			sysjColumns: [
				{ label: "试剂名称", prop: "reagentName" },
				{ label: "编号", prop: "reagentCode" },
				{ label: "批号", prop: "reagentNo" },
				{ label: "浓度/含量/纯度", prop: "concentration" },
				{ label: "来源", prop: "source" },
				{ label: "失效日", prop: "expireDate" },
			],
			yqsColumns: [
				{ label: "仪器名称", prop: "instrumentName" },
				{ label: "仪器型号", prop: "instrumentModel" },
				{ label: "仪器编号", prop: "instrumentCode" },
				{ label: "下次测试/校准/检定日期", prop: "nextTestDate" },
			],

		};
	},
	mounted() {
		if (this.fillType === "preFill") {
			this.formData = {
				effectivePeriodUnit: "days",//设置默认值
				createTime: "2026-01-02 18:05:36",//设置默认值
				versionNum: 1,
				stepTableFormData: [],
				ladderConfigs: [], // 阶梯配制配置列表
				paralleConfigs: [], // 平行配制配置列表
				headerSelectFields: {
					targetStartSolutionVolumeUnit: "mg",
					actStartSolutionVolumeUnit: "mg",
					targetDiluentVolumeUnit: "mg",
					actDiluentVolumeUnit: "mg",
					targetSolutionConcentrationUnit: "mg",
					actSolutionConcentrationUnit: "mg",
					targetSolutionVolumeUnit: "mg",
					actSolutionVolumeUnit: "mg",
				}
			}
		}
	},
	methods: {
		//新增平行配制
		handleAddParalle() {
			// 初始化平行配制配置列表
			if (!this.formData.paralleConfigs) {
				this.$set(this.formData, 'paralleConfigs', []);
			}
			
			// 添加新的平行配制配置
			this.formData.paralleConfigs.push({
				paralleStepData: [],
				paralleTableFormData: [],
				showParalleConfig: true
			});
		},
		//新增阶梯配制
		handleAddLadder() {
			// 初始化阶梯配制配置列表
			if (!this.formData.ladderConfigs) {
				this.$set(this.formData, 'ladderConfigs', []);
			}
			
			// 添加新的阶梯配制配置
			this.formData.ladderConfigs.push({
				ladderStepData: [],
				ladderTableFormData: [],
				showLadderConfig: true
			});
		},
		// 删除阶梯配制配置
		deleteLadderConfig(index) {
			this.formData.ladderConfigs.splice(index, 1);
		},
		// 删除平行配制配置
		deleteParalleConfig(index) {
			this.formData.paralleConfigs.splice(index, 1);
		},
		// 添加表格行
		handleAddRow(type, rowIndex, configIndex = 0) {
			const tableRef = type === 'ladder' ? 
				this.$refs[`ladderStepTableRef_${configIndex}`] : 
				this.$refs[`paralleStepTableRef_${configIndex}`];
				console.log(tableRef,"refff")
			if (tableRef && tableRef[0].addRow) {
				tableRef[0].addRow({});
			}
		},
		// 删除表格行
		deleteRow(rowIndex, type, configIndex = 0) {
			// 根据类型删除对应的表格行
			if (type === 'ladder') {
				const tableRef = this.$refs[`ladderStepTableRef_${configIndex}`];
				if (tableRef) {
					tableRef.deleteRow(rowIndex);
				}
			} else if (type === 'paralle') {
				const tableRef = this.$refs[`paralleStepTableRef_${configIndex}`];
				if (tableRef) {
					tableRef.deleteRow(rowIndex);
				}
			}
		},
		handleClickable(item) {
			if (this.fillType === "preFill") {
				// return;
			}
			const { subKey = "" } = item;
			if (subKey === "subStartSolution" || subKey === "subSolution") {//起始源溶液点击事件
				this.selectReagentVisible = true;
				this.currentSubKey = subKey;
			}
		},
		//选择试剂提交事件
		onSelectReagentSubmit(code) {
			this.$refs.stepFormPackageRef.updateFormData(this.currentSubKey, code);
			this.selectReagentVisible = false;
		},
		async getFormData() {
			const baseData = await this.$refs.baseInfoRef.getFormData();
			const conditionData = await this.$refs.storageConditionRef.getFormData();
			
			// 获取所有阶梯配制数据
			const ladderConfigsData = [];
			if (this.formData.ladderConfigs && this.formData.ladderConfigs.length > 0) {
				for (let i = 0; i < this.formData.ladderConfigs.length; i++) {
					const ladderFormData = await this.$refs[`ladderStepFormPackageRef_${i}`][0].getFormData();
					const ladderTableFormData = await this.$refs[`ladderStepTableRef_${i}`][0].getFormData();
					const ladderStepData = await this.$refs[`ladderStepRef_${i}`][0].getFormData();
					
					ladderConfigsData.push({
						...ladderFormData,
						...ladderTableFormData,
						ladderStepData,
						showLadderConfig: true
					});
				}
			}
			
			// 获取所有平行配制数据
			const paralleConfigsData = [];
			if (this.formData.paralleConfigs && this.formData.paralleConfigs.length > 0) {
				for (let i = 0; i < this.formData.paralleConfigs.length; i++) {
					const paralleFormData = await this.$refs[`paralleStepFormPackageRef_${i}`][0].getFormData();
					const paralleTableFormData = await this.$refs[`paralleStepTableRef_${i}`][0].getFormData();
					const paralleStepData = await this.$refs[`paralleStepRef_${i}`][0].getFormData();
					
					paralleConfigsData.push({
						...paralleFormData,
						...paralleTableFormData,
						paralleStepData,
						showParalleConfig: true
					});
				}
			}
			
			const remarkData = await this.$refs.remarkRef.getFormData();
			
			return {
				...baseData,
				...conditionData,
				ladderConfigs: ladderConfigsData,
				paralleConfigs: paralleConfigsData,
				...remarkData
			}
		},
		async onSave() {
			const formData = await this.getFormData();
			console.log(formData, "formData")
		}
	}
};
</script>
<style rel="stylesheet/scss" lang="scss">
.mt-20 {
	margin-top: 20px;
}

.config-section {
	margin-bottom: 20px;
	padding: 15px;
	border: 1px solid #ebeef5;
	border-radius: 4px;
	background-color: #fafafa;
}

.config-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
	font-weight: bold;
	font-size: 16px;
	color: #303133;
}

.config-header .el-button {
	color: #f56c6c;
	font-size: 14px;
}

.config-header .el-button:hover {
	color: #f78989;
}

.mt-0{
	margin-top: 0;
}
</style>