进一步完善功能，加菜单，单位从本地存储读取
This commit is contained in:
parent
4441e3d171
commit
b911a5069a
@ -4,16 +4,15 @@
|
||||
<!-- <el-row> -->
|
||||
<!-- 常用组分选择框 -->
|
||||
<!-- <el-col :span="10"> -->
|
||||
<el-form-item label="常用组分">
|
||||
<el-select v-model="selectedComponent" @change="handleComponentChange" placeholder="请选择常用组分" clearable
|
||||
filterable>
|
||||
<el-form-item label="常用组分" :style="{ width: selectWidth + 'px' }">
|
||||
<el-select v-model="selectedComponent" @change="handleComponentChange" placeholder="请选择常用组分" clearable filterable>
|
||||
<el-option v-for="dict in dict.type.ngtools_cyzf" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- </el-col> -->
|
||||
<!-- 合计输入框 -->
|
||||
<!-- <el-col :span="6"> -->
|
||||
<el-form-item label="合计">
|
||||
<el-form-item label="合计" :style="{ width: selectWidth + 'px' }">
|
||||
<el-input :value="totalPercentage" readonly class="total-input" />
|
||||
</el-form-item>
|
||||
<!-- </el-col> -->
|
||||
@ -21,222 +20,228 @@
|
||||
</el-form>
|
||||
|
||||
<el-form :model="formData" label-position="top" size="small" :inline="true" class="component-form">
|
||||
<el-form-item v-for="field in componentFields" :key="field.prop" :label="field.label" :prop="field.prop">
|
||||
<el-input v-model="formData[field.prop]" controls-position="right" @change="handleValueChange"
|
||||
@focus="selectAllText" />
|
||||
<el-form-item v-for="field in componentFields" :key="field.prop" :label="field.label" :prop="field.prop" :style="{ width: selectWidth + 'px' }">
|
||||
<el-input v-model="formData[field.prop]" controls-position="right" @change="handleValueChange" @focus="selectAllText" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listComponents,
|
||||
getComponents,
|
||||
delComponents,
|
||||
addComponents,
|
||||
updateComponents
|
||||
} from '@/api/ngtools/components';
|
||||
import { listComponents, getComponents, delComponents, addComponents, updateComponents } from '@/api/ngtools/components';
|
||||
|
||||
// 字段配置元数据
|
||||
const COMPONENT_FIELDS = [{
|
||||
prop: 'ngC1',
|
||||
label: '甲烷C1'
|
||||
// 字段配置元数据
|
||||
const COMPONENT_FIELDS = [
|
||||
{
|
||||
prop: 'ngC1',
|
||||
label: '甲烷C1'
|
||||
},
|
||||
{
|
||||
prop: 'ngN2',
|
||||
label: '氮气N2'
|
||||
},
|
||||
{
|
||||
prop: 'ngCo2',
|
||||
label: '二氧化碳CO2'
|
||||
},
|
||||
{
|
||||
prop: 'ngC2',
|
||||
label: '乙烷C2'
|
||||
},
|
||||
{
|
||||
prop: 'ngC3',
|
||||
label: '丙烷C3'
|
||||
},
|
||||
{
|
||||
prop: 'ngH2o',
|
||||
label: '水H2O'
|
||||
},
|
||||
{
|
||||
prop: 'ngH2s',
|
||||
label: '硫化氢H2S'
|
||||
},
|
||||
{
|
||||
prop: 'ngH2',
|
||||
label: '氢气H2'
|
||||
},
|
||||
{
|
||||
prop: 'ngCo',
|
||||
label: '一氧化碳CO'
|
||||
},
|
||||
{
|
||||
prop: 'ngO2',
|
||||
label: '氧气O2'
|
||||
},
|
||||
{
|
||||
prop: 'ngIc4',
|
||||
label: '异丁烷iC4'
|
||||
},
|
||||
{
|
||||
prop: 'ngNc4',
|
||||
label: '正丁烷nC4'
|
||||
},
|
||||
{
|
||||
prop: 'ngIc5',
|
||||
label: '异戊烷iC5'
|
||||
},
|
||||
{
|
||||
prop: 'ngNc5',
|
||||
label: '正戊烷nC5'
|
||||
},
|
||||
{
|
||||
prop: 'ngC6',
|
||||
label: '己烷C6'
|
||||
},
|
||||
{
|
||||
prop: 'ngC7',
|
||||
label: '庚烷C7'
|
||||
},
|
||||
{
|
||||
prop: 'ngC8',
|
||||
label: '辛烷C8'
|
||||
},
|
||||
{
|
||||
prop: 'ngC9',
|
||||
label: '壬烷C9'
|
||||
},
|
||||
{
|
||||
prop: 'ngC10',
|
||||
label: '癸烷C10'
|
||||
},
|
||||
{
|
||||
prop: 'ngHe',
|
||||
label: '氦气He'
|
||||
},
|
||||
{
|
||||
prop: 'ngAr',
|
||||
label: '氩气Ar'
|
||||
}
|
||||
];
|
||||
|
||||
export default {
|
||||
name: 'NgComponentsForm',
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
{
|
||||
prop: 'ngN2',
|
||||
label: '氮气N2'
|
||||
},
|
||||
{
|
||||
prop: 'ngCo2',
|
||||
label: '二氧化碳CO2'
|
||||
},
|
||||
{
|
||||
prop: 'ngC2',
|
||||
label: '乙烷C2'
|
||||
},
|
||||
{
|
||||
prop: 'ngC3',
|
||||
label: '丙烷C3'
|
||||
},
|
||||
{
|
||||
prop: 'ngH2o',
|
||||
label: '水H2O'
|
||||
},
|
||||
{
|
||||
prop: 'ngH2s',
|
||||
label: '硫化氢H2S'
|
||||
},
|
||||
{
|
||||
prop: 'ngH2',
|
||||
label: '氢气H2'
|
||||
},
|
||||
{
|
||||
prop: 'ngCo',
|
||||
label: '一氧化碳CO'
|
||||
},
|
||||
{
|
||||
prop: 'ngO2',
|
||||
label: '氧气O2'
|
||||
},
|
||||
{
|
||||
prop: 'ngIc4',
|
||||
label: '异丁烷iC4'
|
||||
},
|
||||
{
|
||||
prop: 'ngNc4',
|
||||
label: '正丁烷nC4'
|
||||
},
|
||||
{
|
||||
prop: 'ngIc5',
|
||||
label: '异戊烷iC5'
|
||||
},
|
||||
{
|
||||
prop: 'ngNc5',
|
||||
label: '正戊烷nC5'
|
||||
},
|
||||
{
|
||||
prop: 'ngC6',
|
||||
label: '己烷C6'
|
||||
},
|
||||
{
|
||||
prop: 'ngC7',
|
||||
label: '庚烷C7'
|
||||
},
|
||||
{
|
||||
prop: 'ngC8',
|
||||
label: '辛烷C8'
|
||||
},
|
||||
{
|
||||
prop: 'ngC9',
|
||||
label: '壬烷C9'
|
||||
},
|
||||
{
|
||||
prop: 'ngC10',
|
||||
label: '癸烷C10'
|
||||
},
|
||||
{
|
||||
prop: 'ngHe',
|
||||
label: '氦气He'
|
||||
},
|
||||
{
|
||||
prop: 'ngAr',
|
||||
label: '氩气Ar'
|
||||
elFormWidth: {
|
||||
type: Number,
|
||||
default: 180
|
||||
}
|
||||
];
|
||||
|
||||
export default {
|
||||
name: 'NgComponentsForm',
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
dicts: ['ngtools_cyzf'],
|
||||
data() {
|
||||
return {
|
||||
selectWidth: 0,
|
||||
selectedComponent: null,
|
||||
formData: this.initFormData(),
|
||||
componentFields: COMPONENT_FIELDS
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
totalPercentage() {
|
||||
return Object.values(this.formData)
|
||||
.reduce((sum, val) => sum + (parseFloat(val) || 0), 0)
|
||||
.toFixed(4);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
elFormWidth: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
this.selectWidth = newVal;
|
||||
}
|
||||
},
|
||||
dicts: ['ngtools_cyzf'],
|
||||
data() {
|
||||
return {
|
||||
selectedComponent: null,
|
||||
formData: this.initFormData(),
|
||||
componentFields: COMPONENT_FIELDS
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
totalPercentage() {
|
||||
return Object.values(this.formData)
|
||||
.reduce((sum, val) => sum + (parseFloat(val) || 0), 0)
|
||||
.toFixed(4);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
this.parseValueString(newVal);
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initFormData() {
|
||||
return COMPONENT_FIELDS.reduce((acc, field) => {
|
||||
acc[field.prop] = 0;
|
||||
return acc;
|
||||
}, {});
|
||||
},
|
||||
selectAllText(event) {
|
||||
// 通过 event.target 获取原生 DOM 元素
|
||||
const inputElement = event.target;
|
||||
// 调用 select() 方法全选文本
|
||||
inputElement.select();
|
||||
},
|
||||
|
||||
parseValueString(valueStr) {
|
||||
const values = (valueStr || '').split('_');
|
||||
this.componentFields.forEach((field, index) => {
|
||||
const value = parseFloat(values[index]) || 0;
|
||||
this.$set(this.formData, field.prop, value);
|
||||
});
|
||||
},
|
||||
|
||||
generateValueString() {
|
||||
return Object.values(this.formData)
|
||||
.map((v) => v.toFixed(4))
|
||||
.join('_');
|
||||
},
|
||||
|
||||
async handleComponentChange(value) {
|
||||
if (!value) return;
|
||||
console.log(value);
|
||||
try {
|
||||
const temp = value.replace(/\\'"/g, '"').replace(/'/g, '"'); // 替换剩余单引号;
|
||||
const componentData = Object.assign({}, this.formData, JSON.parse(temp));
|
||||
Object.keys(this.formData).forEach((key) => {
|
||||
this.formData[key] = parseFloat(componentData[key]) || 0;
|
||||
});
|
||||
this.emitUpdate();
|
||||
} catch (error) {
|
||||
this.$message.error('获取标准组分失败');
|
||||
console.error(error);
|
||||
}
|
||||
},
|
||||
|
||||
handleValueChange() {
|
||||
this.$nextTick(() => {
|
||||
this.emitUpdate();
|
||||
});
|
||||
},
|
||||
|
||||
emitUpdate() {
|
||||
if (Math.abs(this.totalPercentage - 100) > 0.0001) {
|
||||
this.$message.warning('组分合计不等于100%，请检查输入');
|
||||
}
|
||||
this.$emit('input', this.generateValueString());
|
||||
},
|
||||
|
||||
async fetchComponentData(params) {
|
||||
try {
|
||||
const {
|
||||
data
|
||||
} = await getComponents(params);
|
||||
this.parseValueString(data.componentStr);
|
||||
} catch (error) {
|
||||
console.error('获取组分数据失败:', error);
|
||||
}
|
||||
value: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
this.parseValueString(newVal);
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.selectWidth = this.elFormWidth;
|
||||
},
|
||||
methods: {
|
||||
initFormData() {
|
||||
return COMPONENT_FIELDS.reduce((acc, field) => {
|
||||
acc[field.prop] = 0;
|
||||
return acc;
|
||||
}, {});
|
||||
},
|
||||
selectAllText(event) {
|
||||
// 通过 event.target 获取原生 DOM 元素
|
||||
const inputElement = event.target;
|
||||
// 调用 select() 方法全选文本
|
||||
inputElement.select();
|
||||
},
|
||||
|
||||
parseValueString(valueStr) {
|
||||
const values = (valueStr || '').split('_');
|
||||
this.componentFields.forEach((field, index) => {
|
||||
const value = parseFloat(values[index]) || 0;
|
||||
this.$set(this.formData, field.prop, value);
|
||||
});
|
||||
},
|
||||
|
||||
generateValueString() {
|
||||
return Object.values(this.formData)
|
||||
.map((v) => v.toFixed(4))
|
||||
.join('_');
|
||||
},
|
||||
|
||||
async handleComponentChange(value) {
|
||||
if (!value) return;
|
||||
console.log(value);
|
||||
try {
|
||||
const temp = value.replace(/\\'"/g, '"').replace(/'/g, '"'); // 替换剩余单引号;
|
||||
const componentData = Object.assign({}, this.formData, JSON.parse(temp));
|
||||
Object.keys(this.formData).forEach((key) => {
|
||||
this.formData[key] = parseFloat(componentData[key]) || 0;
|
||||
});
|
||||
this.emitUpdate();
|
||||
} catch (error) {
|
||||
this.$message.error('获取标准组分失败');
|
||||
console.error(error);
|
||||
}
|
||||
},
|
||||
|
||||
handleValueChange() {
|
||||
this.$nextTick(() => {
|
||||
this.emitUpdate();
|
||||
});
|
||||
},
|
||||
|
||||
emitUpdate() {
|
||||
if (Math.abs(this.totalPercentage - 100) > 0.0001) {
|
||||
this.$message.warning('组分合计不等于100%，请检查输入');
|
||||
}
|
||||
this.$emit('input', this.generateValueString());
|
||||
},
|
||||
|
||||
async fetchComponentData(params) {
|
||||
try {
|
||||
const { data } = await getComponents(params);
|
||||
this.parseValueString(data.componentStr);
|
||||
} catch (error) {
|
||||
console.error('获取组分数据失败:', error);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.component-form {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
||||
gap: 16px;
|
||||
/* margin-top: 20px; */
|
||||
}
|
||||
.component-form {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* 自适应列宽 */
|
||||
margin-bottom: -5px;
|
||||
gap: 10px; /* 设置表单项之间的间距 */
|
||||
}
|
||||
|
||||
.total-input>>>.el-input__inner {
|
||||
font-weight: bold;
|
||||
color: #409eff;
|
||||
}
|
||||
.total-input >>> .el-input__inner {
|
||||
font-weight: bold;
|
||||
color: #409eff;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,146 +1,160 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<h3>GB/T 17747</h3>
|
||||
<el-form :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="result-form">
|
||||
<el-form-item label="分子量" prop="dMrx" ref="selectRef">
|
||||
<!-- <div>当前 dMeterType 的值: {{ dMeterType }}</div>
|
||||
<div>NGResult 数据: {{ NGResult }}</div> -->
|
||||
<h3 v-if="dMeterType === '4'">GB/T 17747</h3>
|
||||
<el-form v-if="dMeterType === '4'" :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="flex-form">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="分子量" prop="dMrx">
|
||||
<el-input readonly v-model="NGResult.dMrx" placeholder="请输入分子量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标况压缩因子" prop="dZb">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="标况压缩因子" prop="dZb">
|
||||
<el-input readonly v-model="NGResult.dZb" placeholder="请输入标况压缩因子" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工况压缩因子" prop="dZf">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="工况压缩因子" prop="dZf">
|
||||
<el-input readonly v-model="NGResult.dZf" placeholder="请输入工况压缩因子" />
|
||||
</el-form-item>
|
||||
<el-form-item label="超压缩系数" prop="dFpv">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="超压缩系数" prop="dFpv">
|
||||
<el-input readonly v-model="NGResult.dFpv" placeholder="请输入超压缩系数" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标况摩尔密度" prop="dDb">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="标况摩尔密度" prop="dDb">
|
||||
<el-input readonly v-model="NGResult.dDb" placeholder="请输入标况摩尔密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工况摩尔密度" prop="dDf">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="工况摩尔密度" prop="dDf">
|
||||
<el-input readonly v-model="NGResult.dDf" placeholder="请输入工况摩尔密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标况质量密度" prop="dRhob">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="标况质量密度" prop="dRhob">
|
||||
<el-input readonly v-model="NGResult.dRhob" placeholder="请输入标况质量密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工况质量密度" prop="dRhof">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="工况质量密度" prop="dRhof">
|
||||
<el-input readonly v-model="NGResult.dRhof" placeholder="请输入工况质量密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="理想气体的相对密度" prop="dRD_Ideal">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="理想气体的相对密度" prop="dRD_Ideal">
|
||||
<el-input readonly v-model="NGResult.dRD_Ideal" placeholder="请输入理想气体的相对密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="真实气体的相对密度" prop="dRD_Real">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="真实气体的相对密度" prop="dRD_Real">
|
||||
<el-input readonly v-model="NGResult.dRD_Real" placeholder="请输入真实气体的相对密度" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<h3>AGA No10</h3>
|
||||
<el-form :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="result-form">
|
||||
<el-form-item label="理想气体的比焓" prop="dHo">
|
||||
|
||||
<h3 v-if="dMeterType === '5'">AGA No10</h3>
|
||||
<el-form v-if="dMeterType === '5'" :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="flex-form">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="理想气体的比焓" prop="dHo">
|
||||
<el-input readonly v-model="NGResult.dHo" placeholder="请输入理想气体的比焓" />
|
||||
</el-form-item>
|
||||
<el-form-item label="真实气体的焓" prop="dH">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="真实气体的焓" prop="dH">
|
||||
<el-input readonly v-model="NGResult.dH" placeholder="请输入真实气体的焓" />
|
||||
</el-form-item>
|
||||
<el-form-item label="真实气体的熵" prop="dS">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="真实气体的熵" prop="dS">
|
||||
<el-input readonly v-model="NGResult.dS" placeholder="请输入真实气体的熵" />
|
||||
</el-form-item>
|
||||
<el-form-item label="理想气体定压热容" prop="dCpi">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="理想气体定压热容" prop="dCpi">
|
||||
<el-input readonly v-model="NGResult.dCpi" placeholder="请输入理想气体定压热容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="定压热容" prop="dCp">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="定压热容" prop="dCp">
|
||||
<el-input readonly v-model="NGResult.dCp" placeholder="请输入定压热容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="定容积热容" prop="dCv">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="定容积热容" prop="dCv">
|
||||
<el-input readonly v-model="NGResult.dCv" placeholder="请输入定容积热容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="比热比" prop="dk">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="比热比" prop="dk">
|
||||
<el-input readonly v-model="NGResult.dk" placeholder="请输入比热比" />
|
||||
</el-form-item>
|
||||
<el-form-item label="等熵指数" prop="dKappa">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="等熵指数" prop="dKappa">
|
||||
<el-input readonly v-model="NGResult.dKappa" placeholder="请输入等熵指数" />
|
||||
</el-form-item>
|
||||
<el-form-item label="声速" prop="dSOS">
|
||||
<el-input readonly v-model="NGResult.dSOS" placeholder="请输入声速" />
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="声速" prop="dSOS">
|
||||
<unit-converter
|
||||
v-model="NGResult.dSOS"
|
||||
:unit-type="'speed'"
|
||||
:unit-order.sync="NGResult.dSOSUnit"
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
/>
|
||||
<!-- <el-input readonly v-model="NGResult.dSOS" placeholder="请输入声速" /> -->
|
||||
</el-form-item>
|
||||
<el-form-item label="临界流函数" prop="dCstar">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="临界流函数" prop="dCstar">
|
||||
<el-input readonly v-model="NGResult.dCstar" placeholder="请输入临界流函数" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<h3>GB/T 11063</h3>
|
||||
<el-form :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="result-form">
|
||||
<el-form-item label="摩尔高位发热量" prop="dHhvMol">
|
||||
|
||||
<h3 v-if="dMeterType === '6'">GB/T 11062</h3>
|
||||
<el-form v-if="dMeterType === '6'" :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="flex-form">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="摩尔高位发热量" prop="dHhvMol">
|
||||
<el-input readonly v-model="NGResult.dHhvMol" placeholder="请输入摩尔高位发热量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="摩尔低位发热量" prop="dLhvMol">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="摩尔低位发热量" prop="dLhvMol">
|
||||
<el-input readonly v-model="NGResult.dLhvMol" placeholder="请输入摩尔低位发热量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="体积高位发热量" prop="dHhvv">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="体积高位发热量" prop="dHhvv">
|
||||
<el-input readonly v-model="NGResult.dHhvv" placeholder="请输入体积高位发热量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="体积低位发热量" prop="dLhvv">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="体积低位发热量" prop="dLhvv">
|
||||
<el-input readonly v-model="NGResult.dLhvv" placeholder="请输入体积低位发热量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="质量高位发热量" prop="dHhvm">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="质量高位发热量" prop="dHhvm">
|
||||
<el-input readonly v-model="NGResult.dHhvm" placeholder="请输入质量高位发热量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="质量地位发热量" prop="dLhvm">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="质量地位发热量" prop="dLhvm">
|
||||
<el-input readonly v-model="NGResult.dLhvm" placeholder="请输入质量地位发热量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标况压缩因子" prop="dZb11062">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="标况压缩因子" prop="dZb11062">
|
||||
<el-input readonly v-model="NGResult.dZb11062" placeholder="请输入标况压缩因子" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标况质量密度" prop="dRhob11062">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="标况质量密度" prop="dRhob11062">
|
||||
<el-input readonly v-model="NGResult.dRhob11062" placeholder="请输入标况质量密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工况质量密度" prop="dRhof11062">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="工况质量密度" prop="dRhof11062">
|
||||
<el-input readonly v-model="NGResult.dRhof11062" placeholder="请输入工况质量密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="理想气体的相对密度" prop="dRD_Ideal11062">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="理想气体的相对密度" prop="dRD_Ideal11062">
|
||||
<el-input readonly v-model="NGResult.dRD_Ideal11062" placeholder="请输入理想气体的相对密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="真实气体的相对密度" prop="dRD_Real11062">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="真实气体的相对密度" prop="dRD_Real11062">
|
||||
<el-input readonly v-model="NGResult.dRD_Real11062" placeholder="请输入真实气体的相对密度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="真实气体的沃泊指数" prop="dWobbeIndex">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="真实气体的沃泊指数" prop="dWobbeIndex">
|
||||
<el-input readonly v-model="NGResult.dWobbeIndex" placeholder="请输入真实气体的沃泊指数" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<h3>其他</h3>
|
||||
<el-form :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="result-form">
|
||||
<el-form-item label="临界压力" prop="dPc">
|
||||
|
||||
<h3 v-if="dMeterType === '7'">其他</h3>
|
||||
<el-form v-if="dMeterType === '7'" :model="NGResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="flex-form">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="临界压力" prop="dPc">
|
||||
<el-input readonly v-model="NGResult.dPc" placeholder="请输入临界压力" />
|
||||
</el-form-item>
|
||||
<el-form-item label="临界温度" prop="dTC">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="临界温度" prop="dTC">
|
||||
<el-input readonly v-model="NGResult.dTC" placeholder="请输入临界温度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="爆炸上限" prop="dBzsx">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="爆炸上限" prop="dBzsx">
|
||||
<el-input readonly v-model="NGResult.dBzsx" placeholder="请输入爆炸上限" />
|
||||
</el-form-item>
|
||||
<el-form-item label="爆炸下限" prop="dBzxx">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="爆炸下限" prop="dBzxx">
|
||||
<el-input readonly v-model="NGResult.dBzxx" placeholder="请输入爆炸下限" />
|
||||
</el-form-item>
|
||||
<el-form-item label="总炭含量(kg/m3)" prop="dTotalC">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="总炭含量(kg/m3)" prop="dTotalC">
|
||||
<el-input readonly v-model="NGResult.dTotalC" placeholder="请输入总炭含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="C2组分含量(kg/m3)" prop="dC2">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="C2组分含量(kg/m3)" prop="dC2">
|
||||
<el-input readonly v-model="NGResult.dC2" placeholder="请输入C2组分含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="C2以上组分含量(kg/m3)" prop="dC2j">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="C2以上组分含量(kg/m3)" prop="dC2j">
|
||||
<el-input readonly v-model="NGResult.dC2j" placeholder="请输入C2以上组分含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="C3以上组分含量(kg/m3)" prop="dC3j">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="C3以上组分含量(kg/m3)" prop="dC3j">
|
||||
<el-input readonly v-model="NGResult.dC3j" placeholder="请输入C3以上组分含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="C4以上组分含量(kg/m3)" prop="dC4j">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="C4以上组分含量(kg/m3)" prop="dC4j">
|
||||
<el-input readonly v-model="NGResult.dC4j" placeholder="请输入C4以上组分含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="C5以上组分含量(kg/m3)" prop="dC5j">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="C5以上组分含量(kg/m3)" prop="dC5j">
|
||||
<el-input readonly v-model="NGResult.dC5j" placeholder="请输入C5以上组分含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="C6以上组分含量(kg/m3)" prop="dC6j">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="C6以上组分含量(kg/m3)" prop="dC6j">
|
||||
<el-input readonly v-model="NGResult.dC6j" placeholder="请输入C6以上组分含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="C3C4组分含量(kg/m3)" prop="dC3C4">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="C3C4组分含量(kg/m3)" prop="dC3C4">
|
||||
<el-input readonly v-model="NGResult.dC3C4" placeholder="请输入C3C4组分含量(kg/m3)" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -156,6 +170,11 @@ export default {
|
||||
},
|
||||
|
||||
props: {
|
||||
elFormWidth: {
|
||||
type: Number,
|
||||
default: 180
|
||||
},
|
||||
dMeterType: 0,
|
||||
value: {
|
||||
type: Object,
|
||||
default: () => ({
|
||||
@ -229,6 +248,7 @@ export default {
|
||||
dk: 0,
|
||||
dKappa: 0,
|
||||
dSOS: 0,
|
||||
dSOSUnit: 0,
|
||||
dCstar: 0,
|
||||
dHhvMol: 0,
|
||||
dLhvMol: 0,
|
||||
@ -260,6 +280,12 @@ export default {
|
||||
},
|
||||
|
||||
watch: {
|
||||
elFormWidth: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
this.selectWidth = newVal;
|
||||
}
|
||||
},
|
||||
value: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
@ -279,11 +305,7 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.selectWidth = this.$refs.selectRef.$el.offsetWidth;
|
||||
if (this.selectWidth === 0) this.selectWidth = 180;
|
||||
// console.log('wwww', this.selectWidth);
|
||||
});
|
||||
this.selectWidth = this.elFormWidth;
|
||||
},
|
||||
methods: {}
|
||||
};
|
||||
@ -294,18 +316,9 @@ export default {
|
||||
.app-container {
|
||||
height: 100%;
|
||||
}
|
||||
.el-input .el-input__inner {
|
||||
color: #0000ff; /* 你想要的字体颜色 */
|
||||
}
|
||||
.result-form {
|
||||
.flex-form {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
||||
gap: 10px;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.total-input >>> .el-input readonly__inner {
|
||||
font-weight: bold;
|
||||
color: #409eff;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* 自适应列宽 */
|
||||
gap: 10px; /* 设置表单项之间的间距 */
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,71 +1,60 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="meterPar" ref="dataForm" label-position="top" size="small" :inline="true" label-width="160px">
|
||||
<el-form-item label="流量计算标准" prop="dFlowCalbz" ref="selectRef">
|
||||
<el-select v-model="meterPar.dFlowCalbz" placeholder="请选择流量计算标准 " clearable>
|
||||
<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 dict.type.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-select v-model="meterPar.dFlowCalbz" placeholder="请选择计算标准 " clearable>
|
||||
<el-option v-for="dict in dict.type.ngtools_lljsbz" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="压缩因子计算标准" prop="dZcalbz">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="压缩因子计算标准" prop="dZcalbz">
|
||||
<el-select v-model="meterPar.dZcalbz" placeholder="请选择压缩因子计算标准 " clearable>
|
||||
<el-option v-for="dict in dict.type.ngtools_ysyzjsbz" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="计量参比条件压力" prop="dCbtj">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="计量参比条件压力" prop="dCbtj">
|
||||
<el-select v-model="meterPar.dCbtj" placeholder="请选择计量参比条件压力 " clearable>
|
||||
<el-option v-for="dict in dict.type.ngtools_cbtj" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="当地大气压" prop="dPatm">
|
||||
<unit-converter
|
||||
v-model="meterPar.dPatm"
|
||||
:unit-type="'pressure'"
|
||||
:unit-order.sync="meterPar.dPatmUnit"
|
||||
:show-english-only="false"
|
||||
:decimal-places="6"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="流量计类别" prop="dMeterType">
|
||||
<el-select :key="meterPar.dMeterType" v-model="meterPar.dMeterType" placeholder="请选择流量计类别 " clearable>
|
||||
<el-option v-for="dict in dict.type.ngtools_lljlx" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item 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 dict.type.ngtools_jlzzlx" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item 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 dict.type.ngtools_qyfs" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item 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 dict.type.ngtools_gdlx" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="管道内径" prop="dPipeD">
|
||||
<unit-converter
|
||||
v-model="meterPar.dPipeD"
|
||||
:unit-type="'length'"
|
||||
:unit-order.sync="meterPar.dLenUnit"
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item 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 dict.type.ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="孔板孔径" prop="dOrificeD">
|
||||
|
||||
<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 dict.type.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'" :unit-order.sync="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'"
|
||||
@ -73,77 +62,66 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="孔板材料" prop="dOrificeMaterial">
|
||||
<el-select v-model="meterPar.dOrificeMaterial" placeholder="请选择孔板材料 " clearable>
|
||||
<el-option v-for="dict in dict.type.ngtools_gdcz" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="输入压力" prop="dPf">
|
||||
<el-form-item v-if="meterPar.dMeterType === '3'" :style="{ width: selectWidth + 'px' }" label="喉部直径" prop="dOrificeD">
|
||||
<unit-converter
|
||||
v-model="meterPar.dPf"
|
||||
:unit-type="'pressure'"
|
||||
:unit-order.sync="meterPar.dPfUnit"
|
||||
v-model="meterPar.dOrificeD"
|
||||
:unit-type="'length'"
|
||||
:unit-order.sync="meterPar.dOrificeUnit"
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="压力类型" prop="dPfType">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="压力类型" prop="dPfType">
|
||||
<el-select v-model="meterPar.dPfType" placeholder="请选择压力类型 " clearable>
|
||||
<el-option v-for="dict in dict.type.ngtools_yllx" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="输入温度" prop="dTf">
|
||||
<el-form-item v-if="meterPar.dPfType === '0'" :style="{ width: selectWidth + 'px' }" label="当地大气压" prop="dPatm">
|
||||
<unit-converter
|
||||
v-model="meterPar.dTf"
|
||||
:unit-type="'temperature'"
|
||||
:unit-order.sync="meterPar.dTfUnit"
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="输入差压" prop="dDp">
|
||||
<unit-converter
|
||||
v-model="meterPar.dDp"
|
||||
v-model="meterPar.dPatm"
|
||||
:unit-type="'pressure'"
|
||||
:unit-order.sync="meterPar.dDpUnit"
|
||||
:unit-order.sync="meterPar.dPatmUnit"
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:decimal-places="6"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="体积流量单位" prop="dVFlowUnit">
|
||||
<el-input v-model="meterPar.dVFlowUnit" placeholder="请输入体积流量单位 " clearable />
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="输入压力" prop="dPf">
|
||||
<unit-converter v-model="meterPar.dPf" :unit-type="'pressure'" :unit-order.sync="meterPar.dPfUnit" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
|
||||
</el-form-item>
|
||||
<el-form-item label="质量流量单位" prop="dMFlowUnit">
|
||||
<el-input v-model="meterPar.dMFlowUnit" placeholder="请输入质量流量单位 " clearable />
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="输入温度" prop="dTf">
|
||||
<unit-converter v-model="meterPar.dTf" :unit-type="'temperature'" :unit-order.sync="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'" :unit-order.sync="meterPar.dDpUnit" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
|
||||
</el-form-item>
|
||||
<el-form-item label="能量流量单位" prop="dEFlowUnit">
|
||||
<el-input v-model="meterPar.dEFlowUnit" placeholder="请输入能量流量单位 " clearable />
|
||||
</el-form-item> -->
|
||||
|
||||
<el-form-item label="流出系数" prop="dCd">
|
||||
<!-- <el-form-item :style="{ width: selectWidth + 'px' }" label="体积流量单位" prop="dVFlowUnit">
|
||||
<el-input v-model="meterPar.dVFlowUnit" placeholder="请输入体积流量单位 " clearable />
|
||||
</el-form-item >
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="质量流量单位" prop="dMFlowUnit">
|
||||
<el-input v-model="meterPar.dMFlowUnit" placeholder="请输入质量流量单位 " clearable />
|
||||
</el-form-item >
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="能量流量单位" prop="dEFlowUnit">
|
||||
<el-input v-model="meterPar.dEFlowUnit" placeholder="请输入能量流量单位 " clearable />
|
||||
</el-form-item > -->
|
||||
|
||||
<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 label="流出系数计算方法" prop="dCdCalMethod">
|
||||
<el-select v-model="meterPar.dCdCalMethod" placeholder="请选择流出系数计算方法 " clearable>
|
||||
<el-option v-for="dict in dict.type.ngtools_lcxsjsff" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
<!-- <el-form-item :style="{ width: selectWidth + 'px' }" label="流出系数计算方法" prop="dCdCalMethod">
|
||||
<el-select v-model="meterPar.dCdCalMethod" placeholder="请选择流出系数计算方法 " clearable >
|
||||
<el-option v-for="dict in dict.type.ngtools_lcxsjsff" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="仪表系数" prop="dMeterFactor">
|
||||
</el-form-item > -->
|
||||
<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 label="脉冲数" prop="dPulseNum">
|
||||
<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'"
|
||||
@ -154,23 +132,14 @@
|
||||
:user-definedunit-name="'个'"
|
||||
:enable-convert="false"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="管束车容积" prop="dVGsc">
|
||||
<unit-converter
|
||||
v-model="meterPar.dVGsc"
|
||||
:unit-type="'volume'"
|
||||
:unit-order.sync="meterPar.dVGscUnit"
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
<el-form-item v-if="meterPar.dMeterType === '5'" :style="{ width: selectWidth + 'px' }" label="管束车容积" prop="dVGsc">
|
||||
<unit-converter v-model="meterPar.dVGsc" :unit-type="'volume'" :unit-order.sync="meterPar.dVGscUnit" :show-english-only="false" :decimal-places="5" :width="selectWidth" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="最大体积流量" prop="dVFlowMax">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最大体积流量" prop="dVFlowMax">
|
||||
<unit-converter
|
||||
v-model="meterPar.dVFlowMax"
|
||||
:unit-type="'volumeflow'"
|
||||
@ -178,10 +147,9 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="最小体积流量" prop="dVFlowMin">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="最小体积流量" prop="dVFlowMin">
|
||||
<unit-converter
|
||||
v-model="meterPar.dVFlowMin"
|
||||
:unit-type="'volumeflow'"
|
||||
@ -189,10 +157,9 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="常用流量" prop="dVFlowCon">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="常用流量" prop="dVFlowCon">
|
||||
<unit-converter
|
||||
v-model="meterPar.dVFlowCon"
|
||||
:unit-type="'volumeflow'"
|
||||
@ -201,11 +168,10 @@
|
||||
:decimal-places="5"
|
||||
:enable-convert="true"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="压力量程下限" prop="dPfRangeMin">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程下限" prop="dPfRangeMin">
|
||||
<unit-converter
|
||||
v-model="meterPar.dPfRangeMin"
|
||||
:unit-type="'pressure'"
|
||||
@ -213,10 +179,9 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="压力量程上限" prop="dPfRangeMax">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="压力量程上限" prop="dPfRangeMax">
|
||||
<unit-converter
|
||||
v-model="meterPar.dPfRangeMax"
|
||||
:unit-type="'pressure'"
|
||||
@ -224,10 +189,9 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="差压量程下限" prop="dDpRangeMin">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程下限" prop="dDpRangeMin">
|
||||
<unit-converter
|
||||
v-model="meterPar.dDpRangeMin"
|
||||
:unit-type="'pressure'"
|
||||
@ -235,10 +199,9 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="差压量程上限" prop="dDpRangeMax">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="差压量程上限" prop="dDpRangeMax">
|
||||
<unit-converter
|
||||
v-model="meterPar.dDpRangeMax"
|
||||
:unit-type="'pressure'"
|
||||
@ -246,10 +209,9 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="温度计量程下限" prop="dTfRangeMin">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程下限" prop="dTfRangeMin">
|
||||
<unit-converter
|
||||
v-model="meterPar.dTfRangeMin"
|
||||
:unit-type="'temperature'"
|
||||
@ -257,10 +219,9 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="温度计量程上限" prop="dTfRangeMax">
|
||||
<el-form-item v-if="meterPar.dBqdd === '1'" :style="{ width: selectWidth + 'px' }" label="温度计量程上限" prop="dTfRangeMax">
|
||||
<unit-converter
|
||||
v-model="meterPar.dTfRangeMax"
|
||||
:unit-type="'temperature'"
|
||||
@ -268,7 +229,6 @@
|
||||
:show-english-only="false"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -295,7 +255,7 @@ export default {
|
||||
'ngtools_ysyzjsbz'
|
||||
],
|
||||
mounted() {
|
||||
this.selectWidth = this.$refs.selectRef.$el.offsetWidth;
|
||||
this.selectWidth = this.elFormWidth;
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
@ -352,8 +312,14 @@ export default {
|
||||
dDpRangeMax: null,
|
||||
dTfRangeMin: null,
|
||||
dTfRangeMax: null,
|
||||
dVGsc: null
|
||||
dVGsc: null,
|
||||
dCalcType: 0, //0 流量 1 天然气 3 管束车
|
||||
dBqdd: 0 //0 不计算，1 计算
|
||||
})
|
||||
},
|
||||
elFormWidth: {
|
||||
type: Number,
|
||||
default: 180
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@ -363,17 +329,19 @@ export default {
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
elFormWidth: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
this.selectWidth = newVal;
|
||||
}
|
||||
},
|
||||
value: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
console.log('-------------------', newVal, newVal.dMeterType);
|
||||
this.formData = _.cloneDeep(newVal);
|
||||
}
|
||||
},
|
||||
meterPar: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
this.$emit('input', newVal);
|
||||
this.meterPar = _.cloneDeep(newVal);
|
||||
// 强制类型转换（如果必要）
|
||||
this.meterPar.dMeterType = String(this.meterPar.dMeterType);
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -383,4 +351,12 @@ export default {
|
||||
|
||||
<style scoped>
|
||||
/* 在这里可以添加一些样式 */
|
||||
.app-container {
|
||||
height: 100%;
|
||||
}
|
||||
.flex-form {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* 自适应列宽 */
|
||||
gap: 10px; /* 设置表单项之间的间距 */
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="meterResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="result-form">
|
||||
<el-form-item label="求渐近速度系数 E" prop="dE" ref="selectRef">
|
||||
<el-input readonly v-model="meterResult.dE" placeholder=" " />
|
||||
<el-form :model="meterResult" label-position="top" ref="queryRef" size="small" :inline="false" label-width="160px" class="flex-form">
|
||||
<el-form-item :style="{ width: selectWidth + 'px' }" label="求渐近速度系数 E" prop="dE">
|
||||
<el-input class="el-input" readonly v-model="meterResult.dE" placeholder=" " />
|
||||
</el-form-item>
|
||||
<el-form-item label="求相对密度系数 FG" prop="dFG">
|
||||
<el-input readonly v-model="meterResult.dFG" placeholder=" " />
|
||||
@ -40,7 +40,6 @@
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:input-disable="true"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="工况体积流量" prop="dVFlowf">
|
||||
@ -52,7 +51,6 @@
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="标况质量流量" prop="dMFlowb">
|
||||
@ -64,7 +62,6 @@
|
||||
:show-english-only="true"
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="标况能量流量" prop="dEFlowb">
|
||||
@ -76,7 +73,6 @@
|
||||
:decimal-places="5"
|
||||
:width="selectWidth"
|
||||
:input-disable="true"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="管道内天然气流速" prop="dVelocityFlow">
|
||||
@ -88,7 +84,6 @@
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="压力损失" prop="dPressLost">
|
||||
@ -100,7 +95,6 @@
|
||||
:decimal-places="5"
|
||||
:input-disable="true"
|
||||
:width="selectWidth"
|
||||
:style="{ width: selectWidth + 'px' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="直径比" prop="dBeta">
|
||||
@ -149,9 +143,15 @@ export default {
|
||||
dBeta: 0,
|
||||
dKappa: 0
|
||||
})
|
||||
},
|
||||
elFormWidth: {
|
||||
type: Number,
|
||||
default: 180
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.selectWidth = this.elFormWidth;
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
meterResult: {
|
||||
@ -179,11 +179,17 @@ export default {
|
||||
dBeta: 0,
|
||||
dKappa: 0
|
||||
},
|
||||
selectWidth: 180
|
||||
selectWidth: 0
|
||||
};
|
||||
},
|
||||
|
||||
watch: {
|
||||
elFormWidth: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
this.selectWidth = newVal;
|
||||
}
|
||||
},
|
||||
value: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
@ -204,9 +210,8 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.selectWidth = this.$refs.selectRef.$el.offsetWidth;
|
||||
if (this.selectWidth === 0) this.selectWidth = 180;
|
||||
console.log('wwww', this.selectWidth);
|
||||
// 在 DOM 更新后获取宽度
|
||||
this.selectWidth = this.elFormWidth;
|
||||
});
|
||||
},
|
||||
methods: {}
|
||||
@ -218,15 +223,9 @@ export default {
|
||||
.app-container {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.result-form {
|
||||
.flex-form {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.total-input >>> .el-input__inner {
|
||||
font-weight: bold;
|
||||
color: #409eff;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* 自适应列宽 */
|
||||
gap: 10px; /* 设置表单项之间的间距 */
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -13,10 +13,10 @@
|
||||
/>
|
||||
<!-- 单位标签 -->
|
||||
<span v-if="enableConvert" ref="unitLabel" @click="cycleUnit" @dblclick="toggleUnitSelector" class="unit-label" :style="{ color: 'blue', height: height + 'px' }">
|
||||
{{ textUnitName }}
|
||||
{{ ' ' + textUnitName + ' ' }}
|
||||
</span>
|
||||
<span v-else ref="unitLabel" class="unit-label" :style="{ color: 'blue', height: height + 'px' }">
|
||||
{{ textUnitName }}
|
||||
{{ ' ' + textUnitName + ' ' }}
|
||||
</span>
|
||||
<!-- 单位选择弹出窗口 -->
|
||||
<div v-if="showUnitSelector" class="unit-selector" ref="unitSelector" :style="{ left: unitSelectorLeft + 'px', top: unitSelectorTop + 'px' }">
|
||||
@ -92,15 +92,12 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.updateInputWidth();
|
||||
this.safeUpdateWidth();
|
||||
});
|
||||
// 在挂载时添加全局点击事件监听器
|
||||
document.addEventListener('click', this.handleClickOutside);
|
||||
},
|
||||
beforeUnmount() {
|
||||
// 在组件销毁前移除全局点击事件监听器
|
||||
document.removeEventListener('click', this.handleClickOutside);
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
inputValue: this.value,
|
||||
@ -148,11 +145,21 @@ export default {
|
||||
if (this.userDefined) {
|
||||
this.textUnitName = this.userDefinedunitName;
|
||||
this.$nextTick(() => {
|
||||
this.updateInputWidth();
|
||||
this.safeUpdateWidth();
|
||||
});
|
||||
} else {
|
||||
await this.loadUnits(newType);
|
||||
this.initCurrentUnit();
|
||||
let temp = JSON.parse(localStorage.getItem('unitData'));
|
||||
this.unitData = temp[newType];
|
||||
if (!this.unitData) {
|
||||
await this.loadUnits(newType);
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
console.log(66666, this.unitData);
|
||||
this.baseUnit = this.unitData.find((u) => u.baseUnit === 'Y');
|
||||
console.log(777, this.baseUnit);
|
||||
this.safeUpdateWidth();
|
||||
this.initCurrentUnit();
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -161,17 +168,21 @@ export default {
|
||||
unitOrder(newOrder) {
|
||||
if (this.userDefined) {
|
||||
this.textUnitName = this.userDefinedunitName;
|
||||
this.$nextTick(() => {
|
||||
this.updateInputWidth();
|
||||
});
|
||||
} else {
|
||||
const target = this.sortedUnits.find((u) => u.unitOrder === newOrder);
|
||||
if (target) this.currentUnit = target;
|
||||
this.textUnitName = this.showEnglishOnly ? target.unitName.split('(')[0].trim() : target.unitName;
|
||||
this.$nextTick(() => {
|
||||
this.updateInputWidth();
|
||||
});
|
||||
this.$nextTick(this.safeUpdateWidth);
|
||||
return;
|
||||
}
|
||||
// 安全查找单位
|
||||
const target = this.sortedUnits.find((u) => u.unitOrder === newOrder);
|
||||
if (!target) {
|
||||
console.warn(`单位序号 ${newOrder} 未找到，使用基准单位`);
|
||||
this.currentUnit = this.baseUnit || this.sortedUnits[0];
|
||||
this.textUnitName = this.currentUnit ? (this.showEnglishOnly ? this.currentUnit.unitName?.split('(')[0]?.trim() : this.currentUnit.unitName) : '';
|
||||
return;
|
||||
}
|
||||
this.currentUnit = target;
|
||||
this.textUnitName = this.showEnglishOnly ? target.unitName?.split('(')[0]?.trim() : target.unitName;
|
||||
|
||||
this.$nextTick(this.safeUpdateWidth);
|
||||
},
|
||||
|
||||
// 监听输入值变化
|
||||
@ -186,6 +197,13 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 新增安全宽度更新方法
|
||||
safeUpdateWidth() {
|
||||
if (this.$refs.unitLabel) {
|
||||
this.updateInputWidth();
|
||||
}
|
||||
},
|
||||
|
||||
selectAllText(event) {
|
||||
// 通过 event.target 获取触发事件的 input 元素
|
||||
const input = event.target;
|
||||
@ -213,12 +231,26 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeUnmount() {
|
||||
// 清除所有未完成的异步操作
|
||||
this.showUnitSelector = false;
|
||||
document.removeEventListener('click', this.handleClickOutside);
|
||||
|
||||
updateInputWidth() {
|
||||
const spanWidth = this.$refs.unitLabel.offsetWidth + 5;
|
||||
// console.log("widht", this.width, "spanWidth", spanWidth)
|
||||
this.inputWidth = this.width - spanWidth;
|
||||
// 清除引用
|
||||
this.$refs.unitLabel = null;
|
||||
this.$refs.unitSelector = null;
|
||||
},
|
||||
updateInputWidth() {
|
||||
// 安全访问检查
|
||||
if (!this.$refs.unitLabel) {
|
||||
console.warn('Unit label ref not available');
|
||||
return;
|
||||
}
|
||||
|
||||
const spanWidth = this.$refs.unitLabel.offsetWidth + 10;
|
||||
this.inputWidth = Math.max(50, this.width - spanWidth); // 添加最小宽度限制
|
||||
},
|
||||
|
||||
// 处理全局点击事件
|
||||
handleClickOutside(event) {
|
||||
if (this.$refs.unitSelector && !this.$refs.unitSelector.contains(event.target)) {
|
||||
@ -251,7 +283,9 @@ export default {
|
||||
this.currentUnit = target || this.baseUnit || this.sortedUnits[0];
|
||||
// 初始化时设置原始单位（关键修复）
|
||||
this.originalUnit = this.currentUnit;
|
||||
this.textUnitName = this.showEnglishOnly ? target.unitName.split('(')[0].trim() : target.unitName;
|
||||
// this.textUnitName = this.showEnglishOnly ? target.unitName.split('(')[0].trim() : target.unitName;
|
||||
// 安全设置单位名称
|
||||
this.textUnitName = this.currentUnit ? (this.showEnglishOnly ? this.currentUnit.unitName.split('(')[0].trim() : this.currentUnit.unitName) : '';
|
||||
this.$nextTick(() => {
|
||||
this.updateInputWidth();
|
||||
});
|
||||
@ -272,11 +306,14 @@ export default {
|
||||
cycleUnit() {
|
||||
const index = this.sortedUnits.findIndex((u) => u === this.currentUnit);
|
||||
const newUnit = this.sortedUnits[(index + 1) % this.sortedUnits.length];
|
||||
console.log('111111', index, newUnit);
|
||||
this.currentUnit = newUnit;
|
||||
this.textUnitName = this.showEnglishOnly ? newUnit.unitName.split('(')[0].trim() : newUnit.unitName;
|
||||
this.$nextTick(() => {
|
||||
this.updateInputWidth();
|
||||
this.convertAndEmit(); // 触发转换
|
||||
if (this.$refs.unitLabel) {
|
||||
this.updateInputWidth();
|
||||
this.convertAndEmit();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
@ -293,7 +330,10 @@ export default {
|
||||
// 执行换算并提交事件
|
||||
convertAndEmit() {
|
||||
// 移除参数
|
||||
if (!this.currentUnit || !this.baseUnit || !this.originalUnit) return;
|
||||
if (!this.currentUnit || !this.baseUnit || !this.originalUnit) {
|
||||
console.log(333333, this.currentUnit, this.baseUnit, this.originalUnit);
|
||||
return;
|
||||
}
|
||||
|
||||
let newValue = 0;
|
||||
if (this.unitType === 'temperature') {
|
||||
@ -376,7 +416,6 @@ export default {
|
||||
.unit-converter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@ -392,9 +431,8 @@ export default {
|
||||
border: 1px solid #d6d5d5;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
padding-left: 10px;
|
||||
padding-right: 5px;
|
||||
white-space: nowrap;
|
||||
padding: 0 8px; /* 可根据需要调整左右内边距 */
|
||||
}
|
||||
|
||||
.unit-label:hover {
|
||||
|
||||
@ -57,50 +57,57 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { calcNGPar } from '@/api/ngtools/NGCalcTools';
|
||||
import { listSysUnitConvert } from '@/api/system/sysUnitConvert.js';
|
||||
import { listSysUnitConvert } from '@/api/system/sysUnitConvert';
|
||||
export default {
|
||||
name: 'Index',
|
||||
data() {
|
||||
return {
|
||||
// 版本号
|
||||
version: '3.8.9'
|
||||
version: '3.8.9',
|
||||
unitData: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 1000,
|
||||
unitType: null,
|
||||
unitName: null,
|
||||
baseUnit: null,
|
||||
conversionFactor: null,
|
||||
unitTypeName: null,
|
||||
status: null,
|
||||
unitOrder: null
|
||||
}
|
||||
};
|
||||
},
|
||||
onload() {
|
||||
this.loadUnits();
|
||||
mounted() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
loadUnits() {
|
||||
console.log(0);
|
||||
listSysUnitConvert({
|
||||
// unitType: unitType,
|
||||
status: 'Y'
|
||||
})
|
||||
.then((res) => {
|
||||
// 检查 res 是否为有效对象且包含 rows 属性
|
||||
if (res && res.rows) {
|
||||
console.log('未找到 baseUnit 为 Y 的单位数据');
|
||||
this.unitData = res.rows;
|
||||
// 检查 unitData 是否为有效数组
|
||||
if (Array.isArray(this.unitData)) {
|
||||
this.baseUnit = this.unitData.find((u) => u.baseUnit === 'Y');
|
||||
// 检查 baseUnit 是否找到
|
||||
if (this.baseUnit) {
|
||||
// console.log(this.baseUnit.unitName);
|
||||
} else {
|
||||
console.log('未找到 baseUnit 为 Y 的单位数据');
|
||||
}
|
||||
} else {
|
||||
console.log('unitData 不是有效的数组');
|
||||
}
|
||||
} else {
|
||||
console.log('响应数据格式不正确，缺少 rows 属性');
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
console.error('单位数据加载失败:', e);
|
||||
groupByUnitType(data) {
|
||||
return data.reduce((acc, unit) => {
|
||||
const type = unit.unitType;
|
||||
if (!acc[type]) acc[type] = [];
|
||||
acc[type].push({
|
||||
id: unit.id,
|
||||
unitType: unit.unitType,
|
||||
unitName: unit.unitName,
|
||||
conversionFactor: unit.conversionFactor,
|
||||
unitOrder: unit.unitOrder,
|
||||
baseUnit: unit.baseUnit,
|
||||
status: unit.status,
|
||||
unitTypeName: unit.unitTypeName
|
||||
});
|
||||
return acc;
|
||||
}, {});
|
||||
},
|
||||
// 加载单位数据
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listSysUnitConvert(this.queryParams).then((response) => {
|
||||
console.log('aaaaaa', response);
|
||||
let unitData = this.groupByUnitType(response.rows);
|
||||
localStorage.setItem('unitData', JSON.stringify(unitData));
|
||||
this.$store.console.log('saaaaaaaaa', this.sysUnitConvertList);
|
||||
});
|
||||
},
|
||||
goTarget(href) {
|
||||
window.open(href, '_blank');
|
||||
|
||||
@ -1,21 +1,21 @@
|
||||
<template>
|
||||
<div>
|
||||
<div style="text-align: center; margin-top: 10px; margin-bottom: 10px">
|
||||
<button @click="calc" type="primary" class="animated-button">计算组分参数</button>
|
||||
<button @click="calcFlow" type="primary" class="animated-button">计算流量</button>
|
||||
<!-- <button @click="calc" type="primary" class="animated-button">计算组分参数</button> -->
|
||||
<button @click="btnCalc" type="primary" class="animated-button">{{ btnText }}</button>
|
||||
</div>
|
||||
|
||||
<el-tabs v-model="activeTab" style="width: 100%">
|
||||
<el-tab-pane label="工况参数" name="meterpar">
|
||||
<meterPar v-model="parentMeterPar" />
|
||||
<meterPar v-model="parentMeterPar" :el-form-width="elFormItemWidth" />
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="摩尔组分" name="ngComponents">
|
||||
<ngComponents v-model="parentMeterPar.dngComponents" />
|
||||
<ngComponents v-model="parentMeterPar.dngComponents" :el-form-width="elFormItemWidthmin" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="计算结果" name="meterresult">
|
||||
<meterResult v-model:meterResult="parentMeterResult" />
|
||||
<n-g-result v-model:NGResult="parentNGResult"></n-g-result>
|
||||
<meterResult v-if="['0', '1', '2', '3'].includes(dMeterType)" v-model:meterResult="parentMeterResult" :el-form-width="elFormItemWidthmin" />
|
||||
<n-g-result v-if="['4', '5', '6', '7'].includes(dMeterType)" :d-meter-type="dMeterType" v-model:NGResult="parentNGResult" :el-form-width="elFormItemWidthmin"></n-g-result>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
@ -41,6 +41,9 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
btnText: '',
|
||||
elFormItemWidth: 200,
|
||||
elFormItemWidthmin: 180,
|
||||
activeTab: 'meterpar',
|
||||
isShowMessage: false,
|
||||
message: '',
|
||||
@ -97,7 +100,9 @@ export default {
|
||||
dTfRangeMin: 0,
|
||||
dTfRangeMax: 0,
|
||||
dVGsc: 300,
|
||||
dVGscUnit: 0
|
||||
dVGscUnit: 0,
|
||||
dCalcType: 0, //0 流量 1 天然气 3 管束车
|
||||
dBqdd: 0 //0 不计算，1 计算 计算不确定度
|
||||
},
|
||||
|
||||
parentMeterResult: {
|
||||
@ -145,6 +150,7 @@ export default {
|
||||
dk: 0,
|
||||
dKappa: 0,
|
||||
dSOS: 0,
|
||||
dSOSUnit: 0,
|
||||
dCstar: 0,
|
||||
dHhvMol: 0,
|
||||
dLhvMol: 0,
|
||||
@ -176,18 +182,31 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
console.log('179行', this.dMeterType);
|
||||
this.parentMeterPar.dMeterType = this.dMeterType;
|
||||
console.log('180行', this.parentMeterPar);
|
||||
// console.log('179行', this.dMeterType);
|
||||
this.$nextTick(() => {
|
||||
this.parentMeterPar.dMeterType = this.dMeterType;
|
||||
// console.log('180行', this.parentMeterPar);
|
||||
});
|
||||
},
|
||||
created() {
|
||||
// 获取路由的查询参数
|
||||
let params = this.$route.query;
|
||||
console.log('186行', params);
|
||||
// console.log('186行', params);
|
||||
this.dMeterType = params.dMeterType;
|
||||
},
|
||||
watch: {
|
||||
dMeterType(newValue) {
|
||||
if (this.dMeterType === '0' || this.dMeterType === '1' || this.dMeterType === '2' || this.dMeterType === '3') {
|
||||
this.btnText = '计算流量';
|
||||
} else if (this.dMeterType === '4') {
|
||||
this.btnText = '计算压缩因子';
|
||||
} else if (this.dMeterType === '5') {
|
||||
this.btnText = '计算声速';
|
||||
} else if (this.dMeterType === '6') {
|
||||
this.btnText = '计算发热量';
|
||||
} else if (this.dMeterType === '7') {
|
||||
this.btnText = '计算其他参数';
|
||||
}
|
||||
this.parentMeterPar.dMeterType = newValue;
|
||||
console.log('dMeterType 变化后，parentMeterPar:', this.parentMeterPar);
|
||||
}
|
||||
@ -199,6 +218,14 @@ export default {
|
||||
this.isShowMessage = false;
|
||||
}, 1000); // 3 秒后自动消失
|
||||
},
|
||||
btnCalc() {
|
||||
if (this.dMeterType === '0' || this.dMeterType === '1' || this.dMeterType === '2' || this.dMeterType === '3') {
|
||||
this.calcBtnFlow();
|
||||
} else if (this.dMeterType === '4' || this.dMeterType === '5' || this.dMeterType === '6' || this.dMeterType === '7') {
|
||||
this.calc();
|
||||
}
|
||||
},
|
||||
|
||||
calc() {
|
||||
console.log(this.parentMeterPar);
|
||||
if (this.parentMeterPar.dngComponents === '') {
|
||||
@ -223,7 +250,7 @@ export default {
|
||||
console.error('Request error:', error);
|
||||
});
|
||||
},
|
||||
calcFlow() {
|
||||
calcBtnFlow() {
|
||||
console.log(this.parentMeterPar);
|
||||
if (this.parentMeterPar.dngComponents === '') {
|
||||
this.message = '组分为空，请输入天然气组分!';
|
||||
|
||||
@ -169,7 +169,7 @@ export default {
|
||||
this.loading = true;
|
||||
listSysUnitConvert(this.queryParams).then((response) => {
|
||||
this.sysUnitConvertList = response.rows;
|
||||
console.log(this.sysUnitConvertList);
|
||||
// console.log('saaaaaaaaa', this.sysUnitConvertList);
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
|
||||
@ -37,7 +37,7 @@ module.exports = {
|
||||
proxy: {
|
||||
// detail: https://cli.vuejs.org/config/#devserver-proxy
|
||||
[process.env.VUE_APP_BASE_API]: {
|
||||
target: `http://localhost:9090`,
|
||||
target: `http://192.168.3.246:9090`,
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
['^' + process.env.VUE_APP_BASE_API]: ''
|
||||
|
||||
Loading…
Reference in New Issue
Block a user