ldeyun/ruoyi-geek-vue3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加超声波测液位的页面

Browse Source
This commit is contained in:
廖德云 2025-12-04 00:07:18 +08:00
parent b4ddd5061a
commit 067d3cdc2e
5 changed files with 706 additions and 674 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/api/ngtools/NGCalcTools.js
View File

@ -22,5 +22,17 @@ export function calcFlow(data) {
} }
}) })
} }
// 页面深度计算
export function calcWaterDeep(data) {
return request({
url: '/WaterDeepCalc/calculatedepth',
method: 'post',
data: data,
headers: {
'Content-Type': 'application/json'
}
})
}

741
src/components/NGTools/meterPar.vue
View File

@ -1,19 +1,26 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="meterPar" ref="dataForm" label-position="top" size="small" :inline="true" label-width="160px" class="flex-form"> <el-form :model="meterPar" ref="dataForm" label-position="top" size="small" :inline="true" label-width="160px"
<el-form-item v-if="['0', '1', '2', '3'].includes(meterPar.dMeterType)" :style="{ width: selectWidth + 'px' }" label="流量计类别" prop="dMeterType"> class="flex-form">
<el-select :key="'meter-type-' + meterPar.dMeterType" v-model="meterPar.dMeterType" placeholder="请选择流量计类别 " clearable> <el-form-item v-if="['0', '1', '2', '3'].includes(meterPar.dMeterType)"
<el-option v-for="dict in ngtools_lljlx" :key="dict.value" :label="dict.label" :value="dict.value" /> :style="{ width: selectWidth + 'px' }" label="流量计类别" prop="dMeterType">
<el-select :key="'meter-type-' + meterPar.dMeterType" v-model="meterPar.dMeterType"
placeholder="请选择流量计类别 " clearable>
<el-option v-for="dict in ngtools_lljlx" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="计算标准" prop="dFlowCalbz"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="计算标准"
prop="dFlowCalbz">
<el-select v-model="meterPar.dFlowCalbz" placeholder="请选择计算标准 " clearable> <el-select v-model="meterPar.dFlowCalbz" placeholder="请选择计算标准 " clearable>
<el-option v-for="dict in ngtools_lljsbz" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_lljsbz" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="压缩因子计算标准" prop="dZcalbz"> <el-form-item :style="{ width: selectWidth + 'px' }" label="压缩因子计算标准" prop="dZcalbz">
<el-select v-model="meterPar.dZcalbz" placeholder="请选择压缩因子计算标准 " clearable> <el-select v-model="meterPar.dZcalbz" placeholder="请选择压缩因子计算标准 " clearable>
<el-option v-for="dict in ngtools_ysyzjsbz" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_ysyzjsbz" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="计量参比条件压力" prop="dCbtj"> <el-form-item :style="{ width: selectWidth + 'px' }" label="计量参比条件压力" prop="dCbtj">
@ -22,64 +29,57 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="节流装置类型" prop="dCoreType"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="节流装置类型"
prop="dCoreType">
<el-select v-model="meterPar.dCoreType" placeholder="请选择节流装置类型 " clearable> <el-select v-model="meterPar.dCoreType" placeholder="请选择节流装置类型 " clearable>
<el-option v-for="dict in ngtools_jlzzlx" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_jlzzlx" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="取压方式" prop="dPtmode"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="取压方式"
prop="dPtmode">
<el-select v-model="meterPar.dPtmode" placeholder="请选择取压方式 " clearable> <el-select v-model="meterPar.dPtmode" placeholder="请选择取压方式 " clearable>
<el-option v-for="dict in ngtools_qyfs" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_qyfs" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道类型" prop="dPipeType"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道类型"
prop="dPipeType">
<el-select v-model="meterPar.dPipeType" placeholder="请选择管道类型 " clearable> <el-select v-model="meterPar.dPipeType" placeholder="请选择管道类型 " clearable>
<el-option v-for="dict in ngtools_gdlx" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_gdlx" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道材料" prop="dPipeMaterial"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="管道材料"
prop="dPipeMaterial">
<el-select v-model="meterPar.dPipeMaterial" placeholder="请选择管道材料 " clearable> <el-select v-model="meterPar.dPipeMaterial" placeholder="请选择管道材料 " clearable>
<el-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板材料" prop="dOrificeMaterial"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板材料"
prop="dOrificeMaterial">
<el-select v-model="meterPar.dOrificeMaterial" placeholder="请选择孔板材料 " clearable> <el-select v-model="meterPar.dOrificeMaterial" placeholder="请选择孔板材料 " clearable>
<el-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0' || meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="管道内径" prop="dPipeD"> <el-form-item v-if="meterPar.dMeterType === '0' || meterPar.dMeterType === '3'"
<unit-converter :style="{ width: selectWidth + 'px' }" label="管道内径" prop="dPipeD">
v-model="meterPar.dPipeD" <unit-converter v-model="meterPar.dPipeD" :unit-type="'length'" v-model:unit-order="meterPar.dLenUnit"
:unit-type="'length'" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
v-model:unit-order="meterPar.dLenUnit"
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板孔径" prop="dOrificeD"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板孔径"
<unit-converter prop="dOrificeD">
v-model="meterPar.dOrificeD" <unit-converter v-model="meterPar.dOrificeD" :unit-type="'length'"
:unit-type="'length'" v-model:unit-order="meterPar.dOrificeUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dOrificeUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="喉部直径" prop="dOrificeD"> <el-form-item v-if="meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="喉部直径"
<unit-converter prop="dOrificeD">
v-model="meterPar.dOrificeD" <unit-converter v-model="meterPar.dOrificeD" :unit-type="'length'"
:unit-type="'length'" v-model:unit-order="meterPar.dOrificeUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dOrificeUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="压力类型" prop="dPfType"> <el-form-item :style="{ width: selectWidth + 'px' }" label="压力类型" prop="dPfType">
@ -87,392 +87,361 @@
<el-option v-for="dict in ngtools_yllx" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in ngtools_yllx" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dPfType === '0'" :style="{ width: selectWidth + 'px' }" label="当地大气压" prop="dPatm"> <el-form-item v-if="meterPar.dPfType === '0'" :style="{ width: selectWidth + 'px' }" label="当地大气压"
<unit-converter prop="dPatm">
v-model="meterPar.dPatm" <unit-converter v-model="meterPar.dPatm" :unit-type="'pressure'" v-model:unit-order="meterPar.dPatmUnit"
:unit-type="'pressure'" :show-english-only="false" :decimal-places="6" :width="selectWidth" />
v-model:unit-order="meterPar.dPatmUnit"
:show-english-only="false"
:decimal-places="6"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="输入压力" prop="dPf"> <el-form-item :style="{ width: selectWidth + 'px' }" label="输入压力" prop="dPf">
<unit-converter <unit-converter v-model="meterPar.dPf" :unit-type="'pressure'" v-model:unit-order="meterPar.dPfUnit"
v-model="meterPar.dPf" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
:unit-type="'pressure'"
v-model:unit-order="meterPar.dPfUnit"
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="输入温度" prop="dTf"> <el-form-item :style="{ width: selectWidth + 'px' }" label="输入温度" prop="dTf">
<unit-converter <unit-converter v-model="meterPar.dTf" :unit-type="'temperature'" v-model:unit-order="meterPar.dTfUnit"
v-model="meterPar.dTf" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
:unit-type="'temperature'"
v-model:unit-order="meterPar.dTfUnit"
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="输入差压" prop="dDp"> <el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="输入差压"
<unit-converter prop="dDp">
v-model="meterPar.dDp" <unit-converter v-model="meterPar.dDp" :unit-type="'pressure'" v-model:unit-order="meterPar.dDpUnit"
:unit-type="'pressure'" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
v-model:unit-order="meterPar.dDpUnit"
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="流出系数" prop="dCd"> <el-form-item v-if="meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="流出系数"
prop="dCd">
<el-input v-model="meterPar.dCd" placeholder="请输入流出系数 " clearable /> <el-input v-model="meterPar.dCd" placeholder="请输入流出系数 " clearable />
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'" :style="{ width: selectWidth + 'px' }" label="仪表系数" prop="dMeterFactor"> <el-form-item v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'"
:style="{ width: selectWidth + 'px' }" label="仪表系数" prop="dMeterFactor">
<el-input v-model="meterPar.dMeterFactor" placeholder="请输入仪表系数 " clearable /> <el-input v-model="meterPar.dMeterFactor" placeholder="请输入仪表系数 " clearable />
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'" :style="{ width: selectWidth + 'px' }" label="脉冲数" prop="dPulseNum"> <el-form-item v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'"
<unit-converter :style="{ width: selectWidth + 'px' }" label="脉冲数" prop="dPulseNum">
v-model="meterPar.dPulseNum" <unit-converter v-model="meterPar.dPulseNum" :unit-type="'user'" v-model:unit-order="meterPar.dVGscUnit"
:unit-type="'user'" :show-english-only="false" :decimal-places="5" :user-defined="true" :user-definedunit-name="'个'"
v-model:unit-order="meterPar.dVGscUnit" :enable-convert="false" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:user-defined="true"
:user-definedunit-name="'个'"
:enable-convert="false"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dMeterType === '8'" :style="{ width: selectWidth + 'px' }" label="管束车容积" prop="dVGsc"> <el-form-item v-if="meterPar.dMeterType === '8'" :style="{ width: selectWidth + 'px' }" label="管束车容积"
<unit-converter prop="dVGsc">
v-model="meterPar.dVGsc" <unit-converter v-model="meterPar.dVGsc" :unit-type="'volume'" v-model:unit-order="meterPar.dVGscUnit"
:unit-type="'volume'" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
v-model:unit-order="meterPar.dVGscUnit"
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最大体积流量" prop="dVFlowMax"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最大体积流量"
<unit-converter prop="dVFlowMax">
v-model="meterPar.dVFlowMax" <unit-converter v-model="meterPar.dVFlowMax" :unit-type="'volumeflow'"
:unit-type="'volumeflow'" v-model:unit-order="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dVFlowUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最小体积流量" prop="dVFlowMin"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最小体积流量"
<unit-converter prop="dVFlowMin">
v-model="meterPar.dVFlowMin" <unit-converter v-model="meterPar.dVFlowMin" :unit-type="'volumeflow'"
:unit-type="'volumeflow'" v-model:unit-order="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dVFlowUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="常用流量" prop="dVFlowCon"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="常用流量"
<unit-converter prop="dVFlowCon">
v-model="meterPar.dVFlowCon" <unit-converter v-model="meterPar.dVFlowCon" :unit-type="'volumeflow'"
:unit-type="'volumeflow'" v-model:unit-order="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dVFlowUnit" :enable-convert="true" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:enable-convert="true"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程下限" prop="dPfRangeMin"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程下限"
<unit-converter prop="dPfRangeMin">
v-model="meterPar.dPfRangeMin" <unit-converter v-model="meterPar.dPfRangeMin" :unit-type="'pressure'"
:unit-type="'pressure'" v-model:unit-order="meterPar.dPfUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dPfUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程上限" prop="dPfRangeMax"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程上限"
<unit-converter prop="dPfRangeMax">
v-model="meterPar.dPfRangeMax" <unit-converter v-model="meterPar.dPfRangeMax" :unit-type="'pressure'"
:unit-type="'pressure'" v-model:unit-order="meterPar.dPfUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dPfUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程下限" prop="dDpRangeMin"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程下限"
<unit-converter prop="dDpRangeMin">
v-model="meterPar.dDpRangeMin" <unit-converter v-model="meterPar.dDpRangeMin" :unit-type="'pressure'"
:unit-type="'pressure'" v-model:unit-order="meterPar.dDpUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dDpUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程上限" prop="dDpRangeMax"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程上限"
<unit-converter prop="dDpRangeMax">
v-model="meterPar.dDpRangeMax" <unit-converter v-model="meterPar.dDpRangeMax" :unit-type="'pressure'"
:unit-type="'pressure'" v-model:unit-order="meterPar.dDpUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dDpUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程下限" prop="dTfRangeMin"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程下限"
<unit-converter prop="dTfRangeMin">
v-model="meterPar.dTfRangeMin" <unit-converter v-model="meterPar.dTfRangeMin" :unit-type="'temperature'"
:unit-type="'temperature'" v-model:unit-order="meterPar.dTfUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dTfUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程上限" prop="dTfRangeMax"> <el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程上限"
<unit-converter prop="dTfRangeMax">
v-model="meterPar.dTfRangeMax" <unit-converter v-model="meterPar.dTfRangeMax" :unit-type="'temperature'"
:unit-type="'temperature'" v-model:unit-order="meterPar.dTfUnit" :show-english-only="false" :decimal-places="5"
v-model:unit-order="meterPar.dTfUnit" :width="selectWidth" />
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
</el-form-item> </el-form-item>
<!-- 液面深度计算 -->
<el-form-item v-if="meterPar.dMeterType === '20'" :style="{ width: selectWidth + 'px' }" label="常温层深度"
prop="dVFlowMax">
<unit-converter v-model="meterPar.dVFlowMax" :unit-type="'length'"
v-model:unit-order="meterPar.dVFlowUnit" :show-english-only="false" :decimal-places="5"
:width="selectWidth" />
</el-form-item>
<el-form-item v-if="meterPar.dMeterType === '20'" :style="{ width: selectWidth + 'px' }" label="测量时间"
prop="dVFlowMin">
<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-form-item>
<el-form-item v-if="meterPar.dMeterType === '20'" :style="{ width: selectWidth + 'px' }" label="地温梯度"
prop="dVFlowCon">
<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-form-item>
</el-form> </el-form>
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, watch, onMounted, inject } from 'vue'; import {
import unitConverter from '@/components/inputValueUnit/index'; ref,
watch,
onMounted,
inject
} from 'vue';
import unitConverter from '@/components/inputValueUnit/index';
// 定义组件名称 // 定义组件名称
const __name = 'meterParComponents'; const __name = 'meterParComponents';
// 1. 导入 useDict（确保路径正确） // 1. 导入 useDict（确保路径正确）
import { useDict } from '@/utils/dict'; import {
// 2. 调用 useDict 获取字典（返回的是 Ref 对象集合） useDict
const dictRefs = useDict( } from '@/utils/dict';
'ngtools_cbtj', // 2. 调用 useDict 获取字典（返回的是 Ref 对象集合）
'ngtools_jlzzlx', const dictRefs = useDict(
'ngtools_lljlx', 'ngtools_cbtj',
'ngtools_qyfs', 'ngtools_jlzzlx',
'ngtools_gdcz', 'ngtools_lljlx',
'ngtools_lcxsjsff', 'ngtools_qyfs',
'ngtools_gdlx', 'ngtools_gdcz',
'ngtools_yllx', 'ngtools_lcxsjsff',
'ngtools_lljsbz', 'ngtools_gdlx',
'ngtools_ysyzjsbz' 'ngtools_yllx',
); 'ngtools_lljsbz',
'ngtools_ysyzjsbz'
);
// 3. 解构出每个字典的 Ref 对象，并通过 computed 简化 .value 取值（可选，但更优雅） // 3. 解构出每个字典的 Ref 对象，并通过 computed 简化 .value 取值（可选，但更优雅）
import { computed } from 'vue'; import {
const ngtools_cbtj = computed(() => dictRefs.ngtools_cbtj.value || []); computed
const ngtools_jlzzlx = computed(() => dictRefs.ngtools_jlzzlx.value || []); } from 'vue';
const ngtools_lljlx = computed(() => dictRefs.ngtools_lljlx.value || []); const ngtools_cbtj = computed(() => dictRefs.ngtools_cbtj.value || []);
const ngtools_qyfs = computed(() => dictRefs.ngtools_qyfs.value || []); const ngtools_jlzzlx = computed(() => dictRefs.ngtools_jlzzlx.value || []);
const ngtools_gdcz = computed(() => dictRefs.ngtools_gdcz.value || []); const ngtools_lljlx = computed(() => dictRefs.ngtools_lljlx.value || []);
const ngtools_lcxsjsff = computed(() => dictRefs.ngtools_lcxsjsff.value || []); const ngtools_qyfs = computed(() => dictRefs.ngtools_qyfs.value || []);
const ngtools_gdlx = computed(() => dictRefs.ngtools_gdlx.value || []); const ngtools_gdcz = computed(() => dictRefs.ngtools_gdcz.value || []);
const ngtools_yllx = computed(() => dictRefs.ngtools_yllx.value || []); const ngtools_lcxsjsff = computed(() => dictRefs.ngtools_lcxsjsff.value || []);
const ngtools_lljsbz = computed(() => dictRefs.ngtools_lljsbz.value || []); const ngtools_gdlx = computed(() => dictRefs.ngtools_gdlx.value || []);
const ngtools_ysyzjsbz = computed(() => dictRefs.ngtools_ysyzjsbz.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. 添加字典加载状态，避免初始空渲染 // 4. 添加字典加载状态，避免初始空渲染
const dictLoaded = computed(() => { const dictLoaded = computed(() => {
// 检查所有必需字典是否已加载（至少有一条数据） // 检查所有必需字典是否已加载（至少有一条数据）
return ngtools_lljlx.value.length > 0 && ngtools_jlzzlx.value.length > 0; return ngtools_lljlx.value.length > 0 && ngtools_jlzzlx.value.length > 0;
}); });
// 自定义深拷贝函数，替代 lodash.cloneDeep // 自定义深拷贝函数，替代 lodash.cloneDeep
const deepClone = (obj) => { const deepClone = (obj) => {
if (obj === null || typeof obj !== 'object') { if (obj === null || typeof obj !== 'object') {
return obj; 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 进行监听 let clone = Array.isArray(obj) ? [] : {};
watch(
() => props.elFormWidth,
(newVal) => {
selectWidth.value = newVal;
},
{ deep: true }
);
// 对 value 进行深度监听 for (let key in obj) {
watch( if (obj.hasOwnProperty(key)) {
() => props.modelValue, clone[key] = deepClone(obj[key]);
(newVal) => { }
if (!isObjectEqual(newVal, meterPar.value)) {
console.log('Update from parent', newVal);
meterPar.value = deepClone({
...newVal,
dMeterType: String(newVal.dMeterType) // 强制类型转换
});
} }
},
{ deep: true, immediate: true } 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> </script>
<style scoped> <style scoped>
.app-container { .app-container {
height: 100%; height: 100%;
} }
.flex-form {
display: grid; .flex-form {
grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); display: grid;
gap: 5px; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
} gap: 5px;
}
</style> </style>

1
src/layout/components/Sidebar/SidebarItem.vue
View File

@ -36,6 +36,7 @@ function hasOneShowingChild(children: RouteItem[] = [], parent: RouteItem) {
}; };
function resolvePath(routePath: string, routeQuery?: any) { function resolvePath(routePath: string, routeQuery?: any) {
console.log(routeQuery);
if (isExternal(routePath)) return routePath if (isExternal(routePath)) return routePath
if (isExternal(props.basePath!)) return props.basePath if (isExternal(props.basePath!)) return props.basePath

615
src/views/ngtools/FlowCal/index.vue
View File

@ -13,8 +13,10 @@
<ngComponents v-model="parentMeterPar.dngComponents" :el-form-width="elFormItemWidthmin" /> <ngComponents v-model="parentMeterPar.dngComponents" :el-form-width="elFormItemWidthmin" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="计算结果" name="meterresult"> <el-tab-pane label="计算结果" name="meterresult">
<meterResult v-if="['0', '1', '2', '3'].includes(dMeterType)" :d-meter-type="dMeterType" v-model="parentMeterResult" :el-form-width="elFormItemWidth" /> <meterResult v-if="['0', '1', '2', '3'].includes(dMeterType)" :d-meter-type="dMeterType"
<NGResult v-if="['4', '5', '6', '7'].includes(dMeterType)" :d-meter-type="dMeterType" v-model="parentNGResult" :el-form-width="elFormItemWidthmin"></NGResult> v-model="parentMeterResult" :el-form-width="elFormItemWidth" />
<NGResult v-if="['4', '5', '6', '7','20'].includes(dMeterType)" :d-meter-type="dMeterType"
v-model="parentNGResult" :el-form-width="elFormItemWidthmin"></NGResult>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -23,305 +25,352 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted, onBeforeMount, watch } from 'vue'; import {
import { useRoute } from 'vue-router'; ref,
import meterPar from '@/components/NGTools/meterPar'; onMounted,
import ngComponents from '@/components/NGTools/NGCom'; onBeforeMount,
import meterResult from '@/components/NGTools/meterResult'; watch
import NGResult from '@/components/NGTools/NGResult'; } from 'vue';
import { calcNGPar, calcFlow } from '@/api/ngtools/NGCalcTools.js'; import {
useRoute
} from 'vue-router';
import meterPar from '@/components/NGTools/meterPar';
import ngComponents from '@/components/NGTools/NGCom';
import meterResult from '@/components/NGTools/meterResult';
import NGResult from '@/components/NGTools/NGResult';
import {
calcNGPar,
calcFlow,
calcWaterDeep
} from '@/api/ngtools/NGCalcTools.js';
// 定义响应式数据 // 定义响应式数据
const btnText = ref(''); const btnText = ref('');
const elFormItemWidth = ref(160); const elFormItemWidth = ref(160);
const elFormItemWidthmin = ref(140); const elFormItemWidthmin = ref(140);
const activeTab = ref('meterpar'); const activeTab = ref('meterpar');
const isShowMessage = ref(false); const isShowMessage = ref(false);
const message = ref(''); const message = ref('');
const parentMeterPar = ref({ const parentMeterPar = ref({
dFlowCalbz: '0', dFlowCalbz: '0',
dZcalbz: '0', dZcalbz: '0',
dCbtj: '0', dCbtj: '0',
dpbM: 0, dpbM: 0,
dtbM: 0, dtbM: 0,
dpbE: 0, dpbE: 0,
dtbE: 0, dtbE: 0,
dPatm: 0.0981, dPatm: 0.0981,
dPatmUnit: 2, dPatmUnit: 2,
dngComponents: '', dngComponents: '',
dMeterType: '0', dMeterType: '0',
dCoreType: '0', dCoreType: '0',
dPtmode: '0', dPtmode: '0',
dPipeType: '0', dPipeType: '0',
dPipeD: 259.38, dPipeD: 259.38,
dLenUnit: 3, dLenUnit: 3,
dPipeDtemp: 20, dPipeDtemp: 20,
dPileDtempU: 0, dPileDtempU: 0,
dPipeMaterial: '11.16', dPipeMaterial: '11.16',
dOrificeD: 150.25, dOrificeD: 150.25,
dOrificeUnit: 3, dOrificeUnit: 3,
dOrificeDtemp: 0, dOrificeDtemp: 0,
dOrificeDtempUnit: 0, dOrificeDtempUnit: 0,
dOrificeMaterial: '16.6', dOrificeMaterial: '16.6',
dOrificeSharpness: 0, dOrificeSharpness: 0,
dOrificeRk: 0, dOrificeRk: 0,
dOrificeRkLenU: 0, dOrificeRkLenU: 0,
dPf: 1.48, dPf: 1.48,
dPfUnit: 2, dPfUnit: 2,
dPfType: '0', dPfType: '0',
dTf: 15, dTf: 15,
dTfUnit: 0, dTfUnit: 0,
dDp: 12.5, dDp: 12.5,
dDpUnit: 1, dDpUnit: 1,
dVFlowUnit: 0, dVFlowUnit: 0,
dVFlowWorkUnit: 0, dVFlowWorkUnit: 0,
dMFlowUnit: 0, dMFlowUnit: 0,
dEFlowUnit: 6, dEFlowUnit: 6,
dCd: 0.9957, dCd: 0.9957,
dCdCalMethod: 0, dCdCalMethod: 0,
dMeterFactor: 2354, dMeterFactor: 2354,
dPulseNum: 12000, dPulseNum: 12000,
dVFlowMax: 6, dVFlowMax: 50,
dVFlowMin: 3, dVFlowMin: 8,
dVFlowCon: 5, dVFlowCon: 0.025,
dPfRangeMin: 0, dPfRangeMin: 0,
dPfRangeMax: 0, dPfRangeMax: 0,
dDpRangeMin: 0, dDpRangeMin: 0,
dDpRangeMax: 0, dDpRangeMax: 0,
dTfRangeMin: 0, dTfRangeMin: 0,
dTfRangeMax: 0, dTfRangeMax: 0,
dVGsc: 300, dVGsc: 300,
dVGscUnit: 0, dVGscUnit: 0,
dCalcType: 0, //0 流量 1 天然气 3 管束车 dCalcType: 0, //0 流量 1 天然气 3 管束车
dBqdd: 0 //0 不计算，1 计算 计算不确定度 dBqdd: 0 //0 不计算，1 计算 计算不确定度
}); });
const parentMeterResult = ref({ const parentMeterResult = ref({
dE: 0, dE: 0,
dFG: 0, dFG: 0,
dFT: 0, dFT: 0,
dDViscosity: 0, dDViscosity: 0,
dDExpCoefficient: 0, dDExpCoefficient: 0,
dRnPipe: 0, dRnPipe: 0,
dBk: 0, dBk: 0,
dRoughNessPipe: 0, dRoughNessPipe: 0,
dCdCorrect: 0, dCdCorrect: 0,
dCdNozell: 0, dCdNozell: 0,
dVFlowb: 0, dVFlowb: 0,
dVFlowf: 0, dVFlowf: 0,
dVFlowUnit: 2, dVFlowUnit: 2,
dMFlowb: 0, dMFlowb: 0,
dMFlowUnit: 0, dMFlowUnit: 0,
dEFlowb: 0, dEFlowb: 0,
dEFlowUnit: 0, dEFlowUnit: 0,
dVelocityFlow: 0, dVelocityFlow: 0,
dVelocityUnit: 0, dVelocityUnit: 0,
dPressLost: 0, dPressLost: 0,
dPressLostUnit: 0, dPressLostUnit: 0,
dBeta: 0, dBeta: 0,
dKappa: 0 dKappa: 0
}); });
const parentNGResult = ref({ const parentNGResult = ref({
dMrx: 0, dMrx: 0,
dZb: 0, dZb: 0,
dZf: 0, dZf: 0,
dFpv: 0, dFpv: 0,
dDb: 0, dDb: 0,
dDf: 0, dDf: 0,
dRhob: 0, dRhob: 0,
dRhof: 0, dRhof: 0,
dRD_Ideal: 0, dRD_Ideal: 0,
dRD_Real: 0, dRD_Real: 0,
dHo: 0, dHo: 0,
dH: 0, dH: 0,
dS: 0, dS: 0,
dCpi: 0, dCpi: 0,
dCp: 0, dCp: 0,
dCv: 0, dCv: 0,
dk: 0, dk: 0,
dKappa: 0, dKappa: 0,
dSOS: 0, dSOS: 0,
dSOSUnit: 0, dSOSUnit: 0,
dCstar: 0, dCstar: 0,
dHhvMol: 0, dHhvMol: 0,
dLhvMol: 0, dLhvMol: 0,
dHhvv: 0, dHhvv: 0,
dLhvv: 0, dLhvv: 0,
dHhvm: 0, dHhvm: 0,
dLhvm: 0, dLhvm: 0,
dZb11062: 0, dZb11062: 0,
dRhob11062: 0, dRhob11062: 0,
dRhof11062: 0, dRhof11062: 0,
dRD_Ideal11062: 0, dRD_Ideal11062: 0,
dRD_Real11062: 0, dRD_Real11062: 0,
dWobbeIndex: 0, dWobbeIndex: 0,
dPc: 0, dPc: 0,
dTC: 0, dTC: 0,
dBzsx: 0, dBzsx: 0,
dBzxx: 0, dBzxx: 0,
dTotalC: 0, dTotalC: 0,
dC2: 0, dC2: 0,
dC2j: 0, dC2j: 0,
dC3j: 0, dC3j: 0,
dC4j: 0, dC4j: 0,
dC5j: 0, dC5j: 0,
dC6j: 0, dC6j: 0,
dC3C4: 0 dC3C4: 0
}); });
const componentString = ref(''); const componentString = ref('');
const dMeterType = ref(0); const dMeterType = ref(0);
// 获取路由信息 // 获取路由信息
const route = useRoute(); const route = useRoute();
// 在组件挂载前获取路由参数 // 在组件挂载前获取路由参数
onBeforeMount(() => { onBeforeMount(() => {
const params = route.query; const params = route.query;
dMeterType.value = params.dMeterType; dMeterType.value = params.dMeterType;
}); });
// 在组件挂载后更新 parentMeterPar 的 dMeterType // 在组件挂载后更新 parentMeterPar 的 dMeterType
onMounted(() => { onMounted(() => {
parentMeterPar.value.dMeterType = dMeterType.value; parentMeterPar.value.dMeterType = dMeterType.value;
}); });
// 监听 dMeterType 的变化 // 监听 dMeterType 的变化
watch(dMeterType, (newValue) => { watch(dMeterType, (newValue) => {
if (['0', '1', '2', '3'].includes(newValue)) { if (['0', '1', '2', '3'].includes(newValue)) {
btnText.value = '计算流量'; btnText.value = '计算流量';
} else if (newValue === '4') { } else if (newValue === '4') {
btnText.value = '计算压缩因子'; btnText.value = '计算压缩因子';
} else if (newValue === '5') { } else if (newValue === '5') {
btnText.value = '计算声速'; btnText.value = '计算声速';
} else if (newValue === '6') { } else if (newValue === '6') {
btnText.value = '计算发热量'; btnText.value = '计算发热量';
} else if (newValue === '7') { } else if (newValue === '7') {
btnText.value = '计算其他参数'; btnText.value = '计算其他参数';
} } else if (newValue === '20') {
parentMeterPar.value.dMeterType = newValue; btnText.value = '计算井下页面深度';
console.log('dMeterType 变化后，parentMeterPar:', parentMeterPar.value);
});
// 显示消息提示框
const showMessage = () => {
isShowMessage.value = true;
setTimeout(() => {
isShowMessage.value = false;
}, 1000); // 1 秒后自动消失
};
// 计算按钮点击事件
const btnCalc = () => {
if (['0', '1', '2', '3'].includes(dMeterType.value)) {
calcBtnFlow();
} else if (['4', '5', '6', '7'].includes(dMeterType.value)) {
calc();
}
};
// 计算天然气参数
const calc = async () => {
console.log(parentMeterPar.value);
if (parentMeterPar.value.dngComponents === '') {
message.value = '组分为空，请输入天然气组分!';
showMessage();
activeTab.value = 'ngComponents';
return;
}
// 清空 parentNGResult 的值
for (const key in parentNGResult.value) {
if (parentNGResult.value.hasOwnProperty(key)) {
parentNGResult.value[key] = 0;
} }
} parentMeterPar.value.dMeterType = newValue;
try { console.log('dMeterType 变化后，parentMeterPar:', parentMeterPar.value);
const res = await calcNGPar(parentMeterPar.value); });
parentNGResult.value = res.data;
activeTab.value = 'meterresult';
console.log('Response:', res);
} catch (error) {
console.error('Request error:', error);
}
};
// 计算流量 // 显示消息提示框
const calcBtnFlow = async () => { const showMessage = () => {
console.log(parentMeterPar.value); isShowMessage.value = true;
if (parentMeterPar.value.dngComponents === '') { setTimeout(() => {
message.value = '组分为空，请输入天然气组分!'; isShowMessage.value = false;
showMessage(); }, 1000); // 1 秒后自动消失
activeTab.value = 'ngComponents'; };
return;
} // 计算按钮点击事件
// 清空 parentMeterResult 的值 const btnCalc = () => {
for (const key in parentMeterResult.value) { if (['0', '1', '2', '3'].includes(dMeterType.value)) {
if (parentMeterResult.value.hasOwnProperty(key)) { calcBtnFlow();
parentMeterResult.value[key] = 0; } else if (['4', '5', '6', '7', ].includes(dMeterType.value)) {
calc();
} }
} else if ([ '20'].includes(dMeterType.value)) {
try { calcBtnWaterDeep();
const res = await calcFlow(parentMeterPar.value); }
parentMeterResult.value = res.data[0]; };
console.log('Response:', parentMeterResult.value);
activeTab.value = 'meterresult';
} catch (error) {
console.error('Request error:', error); // 计算天然气参数
} const calc = async () => {
}; console.log(parentMeterPar.value);
if (parentMeterPar.value.dngComponents === '') {
message.value = '组分为空，请输入天然气组分!';
showMessage();
activeTab.value = 'ngComponents';
return;
}
// 清空 parentNGResult 的值
for (const key in parentNGResult.value) {
if (parentNGResult.value.hasOwnProperty(key)) {
parentNGResult.value[key] = 0;
}
}
try {
console.log(parentMeterPar.value)
console.log(dMeterType.value)
const res = await calcNGPar(parentMeterPar.value);
parentNGResult.value = res.data;
activeTab.value = 'meterresult';
console.log('Response:', res);
} catch (error) {
console.error('Request error:', error);
}
};
// 液面深度
const calcBtnWaterDeep = async () => {
console.log(parentMeterPar.value);
if (parentMeterPar.value.dngComponents === '') {
message.value = '组分为空，请输入天然气组分!';
showMessage();
activeTab.value = 'ngComponents';
return;
}
// 清空 parentNGResult 的值
for (const key in parentNGResult.value) {
if (parentNGResult.value.hasOwnProperty(key)) {
parentNGResult.value[key] = 0;
}
}
try {
console.log(parentMeterPar.value)
console.log(dMeterType.value)
const res = await calcWaterDeep(parentMeterPar.value);
parentNGResult.value = res.data;
activeTab.value = 'meterresult';
console.log('Response:', res);
} catch (error) {
console.error('Request error:', error);
}
};
// 计算流量
const calcBtnFlow = async () => {
console.log(parentMeterPar.value);
if (parentMeterPar.value.dngComponents === '') {
message.value = '组分为空，请输入天然气组分!';
showMessage();
activeTab.value = 'ngComponents';
return;
}
// 清空 parentMeterResult 的值
for (const key in parentMeterResult.value) {
if (parentMeterResult.value.hasOwnProperty(key)) {
parentMeterResult.value[key] = 0;
}
}
try {
const res = await calcFlow(parentMeterPar.value);
parentMeterResult.value = res.data[0];
console.log('Response:', parentMeterResult.value);
activeTab.value = 'meterresult';
} catch (error) {
console.error('Request error:', error);
}
};
</script> </script>
<style scoped> <style scoped>
.animated-button { .animated-button {
background-color: #007bff; background-color: #007bff;
color: white; color: white;
padding: 10px 20px; padding: 10px 20px;
border: none; border: none;
border-radius: 5px; border-radius: 5px;
cursor: pointer; cursor: pointer;
margin-right: 10px; margin-right: 10px;
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
} }
.animated-button:last-child { .animated-button:last-child {
margin-right: 0; margin-right: 0;
} }
.animated-button:hover { .animated-button:hover {
background-color: #0056b3; background-color: #0056b3;
transform: scale(1.05); transform: scale(1.05);
} }
.animated-button:active { .animated-button:active {
transform: scale(0.95); transform: scale(0.95);
} }
/* 在 Vue 3 中使用 :deep() 替代 /deep/ */ /* 在 Vue 3 中使用 :deep() 替代 /deep/ */
:deep(.el-tabs__nav) { :deep(.el-tabs__nav) {
padding: 0; padding: 0;
margin: 0; margin: 0;
display: flex; display: flex;
width: 100%; width: 100%;
} }
:deep(.el-tabs__item) { :deep(.el-tabs__item) {
flex: 1; flex: 1;
text-align: center; text-align: center;
padding: 10px; padding: 10px;
} }
.message-box { .message-box {
position: fixed; position: fixed;
top: 20px; top: 20px;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
background-color: #333; background-color: #333;
color: white; color: white;
padding: 10px 20px; padding: 10px 20px;
border-radius: 5px; border-radius: 5px;
z-index: 9999; z-index: 9999;
} }
</style> </style>

3
vite.config.js
View File

@ -31,7 +31,8 @@ export default defineConfig(({ mode, command }) => {
proxy: { proxy: {
// https://cn.vitejs.dev/config/#server-proxy // https://cn.vitejs.dev/config/#server-proxy
'/dev-api': { '/dev-api': {
target: 'http://ngtools.cn:9999',
target: 'http://192.168.3.19:9999',
changeOrigin: true, changeOrigin: true,
rewrite: (p) => p.replace(/^\/dev-api/, '') rewrite: (p) => p.replace(/^\/dev-api/, '')
}, },