<template>
	<!-- 外层容器：替代原el-form，保留数据模型和引用（如需表单验证可保留ref） -->
	<div ref="dataForm" class="meter-par-container">
		<!-- 1. 流量计类别 -->
		<el-row v-if="['0', '1', '2', '3'].includes(meterPar.dMeterType)" class="form-row" :gutter="10">
			<!-- 左列：标签 -->
			<el-col :span="10" class="label-col">
				<label class="form-label">流量计类别</label>
			</el-col>
			<!-- 右列：下拉框 -->
			<el-col :span="14" class="control-col">
				<el-select :key="'meter-type-' + meterPar.dMeterType" v-model="meterPar.dMeterType"
					placeholder="请选择流量计类别 " clearable :style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_lljlx" :key="dict.value" :label="dict.label"
						:value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 2. 计算标准（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">计算标准</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dFlowCalbz" placeholder="请选择计算标准 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_lljsbz" :key="dict.value" :label="dict.label"
						:value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 3. 压缩因子计算标准 -->
		<el-row class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">压缩因子计算标准</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dZcalbz" placeholder="请选择压缩因子计算标准 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_ysyzjsbz" :key="dict.value" :label="dict.label"
						:value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 4. 计量参比条件压力 -->
		<el-row class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">计量参比条件压力</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dCbtj" placeholder="请选择计量参比条件压力 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_cbtj" :key="dict.value" :label="dict.label" :value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 5. 节流装置类型（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">节流装置类型</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dCoreType" placeholder="请选择节流装置类型 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_jlzzlx" :key="dict.value" :label="dict.label"
						:value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 6. 取压方式（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">取压方式</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dPtmode" placeholder="请选择取压方式 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_qyfs" :key="dict.value" :label="dict.label" :value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 7. 管道类型（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">管道类型</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dPipeType" placeholder="请选择管道类型 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_gdlx" :key="dict.value" :label="dict.label" :value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 8. 管道材料（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">管道材料</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dPipeMaterial" placeholder="请选择管道材料 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 9. 孔板材料（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">孔板材料</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dOrificeMaterial" placeholder="请选择孔板材料 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 10. 管道内径（dMeterType='0'/'3'显示） -->
		<el-row v-if="meterPar.dMeterType === '0' || meterPar.dMeterType === '3'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">管道内径</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dPipeD" :unit-type="'length'" v-model:unit-order="meterPar.dLenUnit"
					:show-english-only="false" :decimal-places="5" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 11. 孔板孔径（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">孔板孔径</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dOrificeD" :unit-type="'length'"
					v-model:unit-order="meterPar.dOrificeUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 12. 喉部直径（仅dMeterType='3'显示） -->
		<el-row v-if="meterPar.dMeterType === '3'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">喉部直径</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dOrificeD" :unit-type="'length'"
					v-model:unit-order="meterPar.dOrificeUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 13. 压力类型 -->
		<el-row class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">压力类型</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-select v-model="meterPar.dPfType" placeholder="请选择压力类型 " clearable
					:style="{ width: selectWidth + 'px' }">
					<el-option v-for="dict in ngtools_yllx" :key="dict.value" :label="dict.label" :value="dict.value" />
				</el-select>
			</el-col>
		</el-row>

		<!-- 14. 当地大气压（仅dPfType='0'显示） -->
		<el-row v-if="meterPar.dPfType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">当地大气压</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dPatm" :unit-type="'pressure'" v-model:unit-order="meterPar.dPatmUnit"
					:show-english-only="false" :decimal-places="6" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 15. 输入压力 -->
		<el-row class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">输入压力</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dPf" :unit-type="'pressure'" v-model:unit-order="meterPar.dPfUnit"
					:show-english-only="false" :decimal-places="5" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 16. 输入温度 -->
		<el-row class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">输入温度</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dTf" :unit-type="'temperature'" v-model:unit-order="meterPar.dTfUnit"
					:show-english-only="false" :decimal-places="5" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 17. 输入差压（仅dMeterType='0'显示） -->
		<el-row v-if="meterPar.dMeterType === '0'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">输入差压</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dDp" :unit-type="'pressure'" v-model:unit-order="meterPar.dDpUnit"
					:show-english-only="false" :decimal-places="5" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 18. 流出系数（仅dMeterType='3'显示） -->
		<el-row v-if="meterPar.dMeterType === '3'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">流出系数</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-input v-model="meterPar.dCd" placeholder="请输入流出系数 " clearable
					:style="{ width: selectWidth + 'px' }" />
			</el-col>
		</el-row>

		<!-- 19. 仪表系数（dMeterType='1'/'2'显示） -->
		<el-row v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">仪表系数</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<el-input v-model="meterPar.dMeterFactor" placeholder="请输入仪表系数 " clearable
					:style="{ width: selectWidth + 'px' }" />
			</el-col>
		</el-row>

		<!-- 20. 脉冲数（dMeterType='1'/'2'显示） -->
		<el-row v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">脉冲数</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dPulseNum" :unit-type="'user'" v-model:unit-order="meterPar.dVGscUnit"
					:show-english-only="false" :decimal-places="5" :user-defined="true" :user-definedunit-name="'个'"
					:enable-convert="false" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 21. 管束车容积（仅dMeterType='8'显示） -->
		<el-row v-if="meterPar.dMeterType === '8'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">管束车容积</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dVGsc" :unit-type="'volume'" v-model:unit-order="meterPar.dVGscUnit"
					:show-english-only="false" :decimal-places="5" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 22. 最大体积流量（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">最大体积流量</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dVFlowMax" :unit-type="'volumeflow'"
					v-model:unit-order="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 23. 最小体积流量（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">最小体积流量</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dVFlowMin" :unit-type="'volumeflow'"
					v-model:unit-order="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 24. 常用流量（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">常用流量</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dVFlowCon" :unit-type="'volumeflow'"
					v-model:unit-order="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
					:enable-convert="true" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 25. 压力量程下限（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">压力量程下限</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dPfRangeMin" :unit-type="'pressure'"
					v-model:unit-order="meterPar.dPfUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 26. 压力量程上限（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">压力量程上限</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dPfRangeMax" :unit-type="'pressure'"
					v-model:unit-order="meterPar.dPfUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 27. 差压量程下限（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">差压量程下限</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dDpRangeMin" :unit-type="'pressure'"
					v-model:unit-order="meterPar.dDpUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 28. 差压量程上限（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">差压量程上限</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dDpRangeMax" :unit-type="'pressure'"
					v-model:unit-order="meterPar.dDpUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 29. 温度计量程下限（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">温度计量程下限</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dTfRangeMin" :unit-type="'temperature'"
					v-model:unit-order="meterPar.dTfUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 30. 温度计量程上限（仅dBqdd='1'显示） -->
		<el-row v-if="meterPar.dBqdd === '1'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">温度计量程上限</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dTfRangeMax" :unit-type="'temperature'"
					v-model:unit-order="meterPar.dTfUnit" :show-english-only="false" :decimal-places="5"
					:width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 31. 常温层深度（仅dMeterType='20'显示） -->
		<el-row v-if="meterPar.dMeterType === '20'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">常温层深度</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dVFlowMax" :unit-type="'user'" v-model:unit-order="meterPar.dVGscUnit"
					:show-english-only="false" :decimal-places="5" :user-defined="true" :user-definedunit-name="'米'"
					:enable-convert="false" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 32. 测量时间（仅dMeterType='20'显示） -->
		<el-row v-if="meterPar.dMeterType === '20'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">测量时间</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dVFlowMin" :unit-type="'user'" v-model:unit-order="meterPar.dVGscUnit"
					:show-english-only="false" :decimal-places="5" :user-defined="true" :user-definedunit-name="'秒'"
					:enable-convert="false" :width="selectWidth" />
			</el-col>
		</el-row>

		<!-- 33. 地温梯度（仅dMeterType='20'显示） -->
		<el-row v-if="meterPar.dMeterType === '20'" class="form-row" :gutter="10">
			<el-col :span="10" class="label-col">
				<label class="form-label">地温梯度</label>
			</el-col>
			<el-col :span="14" class="control-col">
				<unit-converter v-model="meterPar.dVFlowCon" :unit-type="'user'" v-model:unit-order="meterPar.dVGscUnit"
					:show-english-only="false" :decimal-places="5" :user-defined="true" :user-definedunit-name="'度/米'"
					:enable-convert="false" :width="selectWidth" />
			</el-col>
		</el-row>
	</div>
</template>
<script setup>
	import {
		ref,
		watch,
		onMounted,
		inject
	} from 'vue';
	import unitConverter from '@/components/inputValueUnit/index';

	// 定义组件名称
	const __name = 'meterParComponents';

	// 1. 导入 useDict（确保路径正确）
	import {
		useDict
	} from '@/utils/dict';
	// 2. 调用 useDict 获取字典（返回的是 Ref 对象集合）
	const dictRefs = useDict(
		'ngtools_cbtj',
		'ngtools_jlzzlx',
		'ngtools_lljlx',
		'ngtools_qyfs',
		'ngtools_gdcz',
		'ngtools_lcxsjsff',
		'ngtools_gdlx',
		'ngtools_yllx',
		'ngtools_lljsbz',
		'ngtools_ysyzjsbz'
	);

	// 3. 解构出每个字典的 Ref 对象，并通过 computed 简化 .value 取值（可选，但更优雅）
	import {
		computed
	} from 'vue';
	const ngtools_cbtj = computed(() => dictRefs.ngtools_cbtj.value || []);
	const ngtools_jlzzlx = computed(() => dictRefs.ngtools_jlzzlx.value || []);
	const ngtools_lljlx = computed(() => dictRefs.ngtools_lljlx.value || []);
	const ngtools_qyfs = computed(() => dictRefs.ngtools_qyfs.value || []);
	const ngtools_gdcz = computed(() => dictRefs.ngtools_gdcz.value || []);
	const ngtools_lcxsjsff = computed(() => dictRefs.ngtools_lcxsjsff.value || []);
	const ngtools_gdlx = computed(() => dictRefs.ngtools_gdlx.value || []);
	const ngtools_yllx = computed(() => dictRefs.ngtools_yllx.value || []);
	const ngtools_lljsbz = computed(() => dictRefs.ngtools_lljsbz.value || []);
	const ngtools_ysyzjsbz = computed(() => dictRefs.ngtools_ysyzjsbz.value || []);

	// 4. 添加字典加载状态，避免初始空渲染
	const dictLoaded = computed(() => {
		// 检查所有必需字典是否已加载（至少有一条数据）
		return ngtools_lljlx.value.length > 0 && ngtools_jlzzlx.value.length > 0;
	});

	// 自定义深拷贝函数，替代 lodash.cloneDeep
	const deepClone = (obj) => {
		if (obj === null || typeof obj !== 'object') {
			return obj;
		}

		let clone = Array.isArray(obj) ? [] : {};

		for (let key in obj) {
			if (obj.hasOwnProperty(key)) {
				clone[key] = deepClone(obj[key]);
			}
		}

		return clone;
	};

	// 自定义对象比较函数，替代 lodash.isEqual
	const isObjectEqual = (obj1, obj2) => {
		// 基本类型比较
		if (obj1 === obj2) return true;

		// 类型不同
		if (typeof obj1 !== typeof obj2) return false;

		// 非对象类型
		if (typeof obj1 !== 'object' || obj1 === null || obj2 === null) return false;

		// 数组比较
		if (Array.isArray(obj1) && Array.isArray(obj2)) {
			if (obj1.length !== obj2.length) return false;
			for (let i = 0; i < obj1.length; i++) {
				if (!isObjectEqual(obj1[i], obj2[i])) return false;
			}
			return true;
		}

		// 对象比较
		const keys1 = Object.keys(obj1);
		const keys2 = Object.keys(obj2);

		if (keys1.length !== keys2.length) return false;

		for (let key of keys1) {
			if (!keys2.includes(key) || !isObjectEqual(obj1[key], obj2[key])) {
				return false;
			}
		}

		return true;
	};

	// 定义 props
	const props = defineProps({
		modelValue: {
			type: Object,
			default: () => ({
				dFlowCalbz: null,
				dZcalbz: null,
				dCbtj: null,
				dpbM: null,
				dtbM: null,
				dpbE: null,
				dtbE: null,
				dPatm: null,
				dPatmUnit: null,
				dngCompents: null,
				dMeterType: null,
				dCoreType: null,
				dPtmode: null,
				dPipeType: null,
				dPipeD: null,
				dLenUnit: null,
				dPipeDtemp: null,
				dPileDtempU: null,
				dPipeMaterial: null,
				dOrificeD: null,
				dOrificeUnit: null,
				dOrificeDtemp: null,
				dOrificeDtempUnit: null,
				dOrificeMaterial: null,
				dOrificeSharpness: null,
				dOrificeRk: null,
				dOrificeRkLenU: null,
				dPf: null,
				dPfUnit: null,
				dPfType: null,
				dTf: null,
				dTfUnit: null,
				dDp: null,
				dDpUnit: null,
				dVFlowUnit: 0,
				dVFlowWorkUnit: 0,
				dMFlowUnit: 0,
				dEFlowUnit: 6,
				dCd: null,
				dCdCalMethod: null,
				dMeterFactor: null,
				dPulseNum: null,
				dVFlowMax: null,
				dVFlowMin: null,
				dVFlowCon: null,
				dPfRangeMin: null,
				dPfRangeMax: null,
				dDpRangeMin: null,
				dDpRangeMax: null,
				dTfRangeMin: null,
				dTfRangeMax: null,
				dVGsc: null,
				dCalcType: 0, // 0 流量 1  天然气  3 管束车
				dBqdd: 0 // 0 不计算，1 计算
			})
		},
		elFormWidth: {
			type: Number,
			default: 180
		}
	});

	// 定义 emits
	const emits = defineEmits(['update:modelValue']);

	// 定义响应式数据
	const selectWidth = ref(0);
	const meterPar = ref(deepClone(props.modelValue));
	const isUpdating = ref(false);

	// 在挂载后设置 selectWidth
	onMounted(() => {
		selectWidth.value = props.elFormWidth;
	});

	// 对 meterPar 进行深度监听
	watch(
		meterPar,
		(newVal) => {
			if (!isObjectEqual(newVal, props.modelValue)) {
				console.log('Emit to parent', newVal);
				emits('update:modelValue', deepClone(newVal));
			}
		}, {
			deep: true
		}
	);

	// 对 elFormWidth 进行监听
	watch(
		() => props.elFormWidth,
		(newVal) => {
			selectWidth.value = newVal;
		}, {
			deep: true
		}
	);

	// 对 value 进行深度监听
	watch(
		() => props.modelValue,
		(newVal) => {
			if (!isObjectEqual(newVal, meterPar.value)) {
				console.log('Update from parent', newVal);
				meterPar.value = deepClone({
					...newVal,
					dMeterType: String(newVal.dMeterType) // 强制类型转换
				});
			}
		}, {
			deep: true,
			immediate: true
		}
	);
</script>

<style scoped>
	/* 整体容器样式 */
	.meter-par-container {
		padding: 10px;
	}

	/* 每一行的间距 */
	.form-row {
		margin-bottom: 12px;
		align-items: center;
		/* 标签和控件垂直居中对齐 */
	}

	/* 标签列样式 */
	.label-col {
		text-align: right;
		/* 标签右对齐，视觉更规整 */
		padding-right: 10px;
	}

	.form-label {
		font-size: 12px;
		color: #606266;
		/* 匹配Element UI默认标签颜色 */
		font-weight: 300;
	}

	/* 控件列样式 */
	.control-col {
		padding-left: 10px;
	}
</style>