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'
}
})
}

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

@ -1,19 +1,26 @@
<template>
<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-item v-if="['0', '1', '2', '3'].includes(meterPar.dMeterType)" :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-form :model="meterPar" ref="dataForm" label-position="top" size="small" :inline="true" label-width="160px"
class="flex-form">
<el-form-item v-if="['0', '1', '2', '3'].includes(meterPar.dMeterType)"
: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-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-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-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="压缩因子计算标准" prop="dZcalbz">
<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-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="计量参比条件压力" prop="dCbtj">
@ -22,64 +29,57 @@
</el-select>
</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-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-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-option v-for="dict in ngtools_qyfs" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</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-option v-for="dict in ngtools_gdlx" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</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-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</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-option v-for="dict in ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item v-if="meterPar.dMeterType === '0' || meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="管道内径" prop="dPipeD">
<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-form-item v-if="meterPar.dMeterType === '0' || meterPar.dMeterType === '3'"
:style="{ width: selectWidth + 'px' }" label="管道内径" prop="dPipeD">
<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-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板孔径" prop="dOrificeD">
<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-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="孔板孔径"
prop="dOrificeD">
<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-form-item>
<el-form-item v-if="meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="喉部直径" prop="dOrificeD">
<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-form-item v-if="meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="喉部直径"
prop="dOrificeD">
<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-form-item>
<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-select>
</el-form-item>
<el-form-item v-if="meterPar.dPfType === '0'" :style="{ width: selectWidth + 'px' }" label="当地大气压" prop="dPatm">
<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-form-item v-if="meterPar.dPfType === '0'" :style="{ width: selectWidth + 'px' }" label="当地大气压"
prop="dPatm">
<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-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="输入压力" prop="dPf">
<unit-converter
v-model="meterPar.dPf"
:unit-type="'pressure'"
v-model:unit-order="meterPar.dPfUnit"
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
<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-form-item>
<el-form-item :style="{ width: selectWidth + 'px' }" label="输入温度" prop="dTf">
<unit-converter
v-model="meterPar.dTf"
:unit-type="'temperature'"
v-model:unit-order="meterPar.dTfUnit"
:show-english-only="false"
:decimal-places="5"
:width="selectWidth"
/>
<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-form-item>
<el-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="输入差压" prop="dDp">
<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-form-item v-if="meterPar.dMeterType === '0'" :style="{ width: selectWidth + 'px' }" label="输入差压"
prop="dDp">
<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-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-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-form-item>
<el-form-item v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'" :style="{ width: selectWidth + 'px' }" label="脉冲数" prop="dPulseNum">
<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-form-item v-if="meterPar.dMeterType === '1' || meterPar.dMeterType === '2'"
:style="{ width: selectWidth + 'px' }" label="脉冲数" prop="dPulseNum">
<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-form-item>
<el-form-item v-if="meterPar.dMeterType === '8'" :style="{ width: selectWidth + 'px' }" label="管束车容积" prop="dVGsc">
<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-form-item v-if="meterPar.dMeterType === '8'" :style="{ width: selectWidth + 'px' }" label="管束车容积"
prop="dVGsc">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最大体积流量" prop="dVFlowMax">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最大体积流量"
prop="dVFlowMax">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最小体积流量" prop="dVFlowMin">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最小体积流量"
prop="dVFlowMin">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="常用流量" prop="dVFlowCon">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="常用流量"
prop="dVFlowCon">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程下限" prop="dPfRangeMin">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程下限"
prop="dPfRangeMin">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程上限" prop="dPfRangeMax">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程上限"
prop="dPfRangeMax">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程下限" prop="dDpRangeMin">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程下限"
prop="dDpRangeMin">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程上限" prop="dDpRangeMax">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程上限"
prop="dDpRangeMax">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程下限" prop="dTfRangeMin">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程下限"
prop="dTfRangeMin">
<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-form-item>
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程上限" prop="dTfRangeMax">
<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-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程上限"
prop="dTfRangeMax">
<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-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>
</div>
</template>
<script setup>
import { ref, watch, onMounted, inject } from 'vue';
import unitConverter from '@/components/inputValueUnit/index';
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'
);
// 定义组件名称
const __name = 'meterParComponents';
// 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 || []);
// 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'
);
// 4. 添加字典加载状态，避免初始空渲染
const dictLoaded = computed(() => {
// 检查所有必需字典是否已加载（至少有一条数据）
return ngtools_lljlx.value.length > 0 && ngtools_jlzzlx.value.length > 0;
});
// 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 || []);
// 自定义深拷贝函数，替代 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;
};
// 4. 添加字典加载状态，避免初始空渲染
const dictLoaded = computed(() => {
// 检查所有必需字典是否已加载（至少有一条数据）
return ngtools_lljlx.value.length > 0 && ngtools_jlzzlx.value.length > 0;
});
// 自定义对象比较函数，替代 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));
// 自定义深拷贝函数，替代 lodash.cloneDeep
const deepClone = (obj) => {
if (obj === null || typeof obj !== 'object') {
return obj;
}
},
{ deep: true }
);
// 对 elFormWidth 进行监听
watch(
() => props.elFormWidth,
(newVal) => {
selectWidth.value = newVal;
},
{ deep: true }
);
let clone = Array.isArray(obj) ? [] : {};
// 对 value 进行深度监听
watch(
() => props.modelValue,
(newVal) => {
if (!isObjectEqual(newVal, meterPar.value)) {
console.log('Update from parent', newVal);
meterPar.value = deepClone({
...newVal,
dMeterType: String(newVal.dMeterType) // 强制类型转换
});
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
clone[key] = deepClone(obj[key]);
}
}
},
{ 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>
<style scoped>
.app-container {
height: 100%;
}
.flex-form {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
gap: 5px;
}
</style>
.app-container {
height: 100%;
}
.flex-form {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
gap: 5px;
}
</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) {
console.log(routeQuery);
if (isExternal(routePath)) return routePath
if (isExternal(props.basePath!)) return props.basePath

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

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

3
vite.config.js
View File

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