|
|
@@ -2,12 +2,12 @@
|
|
|
<el-card class="box-card">
|
|
|
<template #header>
|
|
|
<div class="card-header">
|
|
|
- <span>反酸模型</span>
|
|
|
+ <span>{{ t('Calculation.refluxTitle') }}</span>
|
|
|
<div class="mode-switch">
|
|
|
<el-button type="primary" :class="['mode-button', 'dry-mode', currentMode === 'dry' ? 'active' : '']"
|
|
|
- @click="setMode('dry')" icon="el-icon-crop" round>旱地</el-button>
|
|
|
+ @click="setMode('dry')" icon="el-icon-crop" round>{{ t('AcidModelMap.dryLand') || '旱地' }}</el-button>
|
|
|
<el-button type="primary" :class="['mode-button', 'paddy-mode', currentMode === 'paddy' ? 'active' : '']"
|
|
|
- @click="setMode('paddy')" icon="el-icon-watermelon" round>水田</el-button>
|
|
|
+ @click="setMode('paddy')" icon="el-icon-watermelon" round>{{ t('AcidModelMap.paddyField') || '水田' }}</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -15,43 +15,43 @@
|
|
|
<el-form :model="form" ref="predictForm" label-width="240px" label-position="left" class="form-container"
|
|
|
:class="currentMode === 'dry' ? 'dry-form' : 'paddy-form'">
|
|
|
<!-- 旱地模式下显示交换性氢 -->
|
|
|
- <el-form-item v-if="currentMode === 'dry'" label="交换性氢(cmol/kg)" prop="H" :error="errorMessages.H" required>
|
|
|
- <el-input v-model="form.H" size="large" placeholder="请输入交换性氢0~5(cmol/kg)"
|
|
|
+ <el-form-item v-if="currentMode === 'dry'" :label="t('Calculation.exchangeableHydrogen')" prop="H" :error="errorMessages.H" required>
|
|
|
+ <el-input v-model="form.H" size="large" :placeholder="t('Calculation.reflux.exchangeableHydrogenPlaceholder')"
|
|
|
@input="handleInput('H', $event, 0, 5)"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="交换性铝(cmol/kg)" prop="Al" :error="errorMessages.Al" required>
|
|
|
- <el-input v-model="form.Al" size="large" placeholder="请输入交换性铝0~10(cmol/kg)"
|
|
|
+ <el-form-item :label="t('Calculation.exchangeableAluminum')" prop="Al" :error="errorMessages.Al" required>
|
|
|
+ <el-input v-model="form.Al" size="large" :placeholder="t('Calculation.reflux.exchangeableAluminumPlaceholder')"
|
|
|
@input="handleInput('Al', $event, 0, 10)"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="土壤有机质(g/kg)" prop="OM" :error="errorMessages.OM" required>
|
|
|
- <el-input v-model="form.OM" size="large" placeholder="请输入土壤有机质0~35(g/kg)"
|
|
|
+ <el-form-item :label="t('Calculation.soilOrganicMatter')" prop="OM" :error="errorMessages.OM" required>
|
|
|
+ <el-input v-model="form.OM" size="large" :placeholder="t('Calculation.reflux.soilOrganicMatterPlaceholder')"
|
|
|
@input="handleInput('OM', $event, 0, 35)"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="硝酸盐(mg/kg)" prop="NO3" :error="errorMessages.NO3" required>
|
|
|
- <el-input v-model="form.NO3" size="large" placeholder="请输入硝酸盐0~70(mg/kg)"
|
|
|
+ <el-form-item :label="t('Calculation.nitrate')" prop="NO3" :error="errorMessages.NO3" required>
|
|
|
+ <el-input v-model="form.NO3" size="large" :placeholder="t('Calculation.reflux.nitratePlaceholder')"
|
|
|
@input="handleInput('NO3', $event, 0, 70)"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="铵盐(mg/kg)" prop="NH4" :error="errorMessages.NH4" required>
|
|
|
- <el-input v-model="form.NH4" size="large" placeholder="请输入铵盐0~20(mg/kg)"
|
|
|
+ <el-form-item :label="t('Calculation.ammoniumSalt')" prop="NH4" :error="errorMessages.NH4" required>
|
|
|
+ <el-input v-model="form.NH4" size="large" :placeholder="t('Calculation.reflux.ammoniumSaltPlaceholder')"
|
|
|
@input="handleInput('NH4', $event, 0, 20)"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="阳离子交换量(cmol/kg)" prop="CEC" :error="errorMessages.CEC" required>
|
|
|
- <el-input v-model="form.CEC" size="large" placeholder="请输入阳离子交换量0~20(cmol/kg)"
|
|
|
+ <el-form-item :label="t('Calculation.cationExchangeCapacity')" prop="CEC" :error="errorMessages.CEC" required>
|
|
|
+ <el-input v-model="form.CEC" size="large" :placeholder="t('Calculation.reflux.cationExchangeCapacityPlaceholder')"
|
|
|
@input="handleInput('CEC', $event, 0, 20)"></el-input>
|
|
|
</el-form-item>
|
|
|
- <!-- 水田模式下显示FeO -->
|
|
|
- <el-form-item v-if="currentMode === 'paddy'" label="氧化铁(g/kg)" prop="FeO" :error="errorMessages.FeO" required>
|
|
|
- <el-input v-model="form.FeO" size="large" placeholder="请输入氧化铁 0~50(g/kg)"
|
|
|
+ <!-- 水田模式下显示 FeO -->
|
|
|
+ <el-form-item v-if="currentMode === 'paddy'" :label="t('AcidModelMap.ferricOxide')" prop="FeO" :error="errorMessages.FeO" required>
|
|
|
+ <el-input v-model="form.FeO" size="large" :placeholder="t('AcidModelMap.ferricOxidePlaceholder') || '请输入氧化铁 0~50(g/kg)'"
|
|
|
@input="handleInput('FeO', $event, 0, 50)"></el-input>
|
|
|
</el-form-item>
|
|
|
|
|
|
- <el-button type="primary" @click="onSubmit" class="onSubmit">计算</el-button>
|
|
|
+ <el-button type="primary" @click="onSubmit" class="onSubmit">{{ t('Calculation.calculateButton') }}</el-button>
|
|
|
|
|
|
<el-dialog v-model="dialogVisible" @close="onDialogClose" :close-on-click-modal="false" width="500px" align-center
|
|
|
- title="计算结果">
|
|
|
+ :title="t('Calculation.resultTitle')">
|
|
|
<span class="dialog-class">ΔpH: {{ result }}</span>
|
|
|
<template #footer>
|
|
|
- <el-button @click="dialogVisible = false">关闭</el-button>
|
|
|
+ <el-button @click="dialogVisible = false">{{ t('Calculation.closeButton') }}</el-button>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
</el-form>
|
|
|
@@ -62,6 +62,9 @@
|
|
|
import { reactive, ref, nextTick, onMounted } from 'vue';
|
|
|
import { ElMessage } from 'element-plus';
|
|
|
import { api5000 } from '../../../utils/request'; // 使用api5000
|
|
|
+import { useI18n } from 'vue-i18n';
|
|
|
+
|
|
|
+const { t } = useI18n();
|
|
|
|
|
|
// 计算模式类型
|
|
|
type CalculationMode = 'dry' | 'paddy';
|
|
|
@@ -187,14 +190,14 @@ const onSubmit = async () => {
|
|
|
const value = form[field];
|
|
|
if (!validateInput(value, min, max)) {
|
|
|
isValid = false;
|
|
|
- errorMessages[field] = `输入值应在 ${min} 到 ${max} 之间且为有效数字`;
|
|
|
+ errorMessages[field] = t('Calculation.validationRange', { min, max })
|
|
|
} else {
|
|
|
errorMessages[field] = '';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (!isValid) {
|
|
|
- ElMessage.error('输入值不符合要求,请检查输入');
|
|
|
+ ElMessage.error(t('Calculation.validationError'))
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
@@ -231,19 +234,19 @@ const onSubmit = async () => {
|
|
|
result.value = parseFloat(response.data.result[0].toFixed(2));
|
|
|
dialogVisible.value = true;
|
|
|
} else {
|
|
|
- ElMessage.error('未获取到有效的预测结果');
|
|
|
+ ElMessage.error(t('Calculation.invalidResult'))
|
|
|
}
|
|
|
} catch (error: any) {
|
|
|
console.error('请求失败:', error);
|
|
|
if (error.response) {
|
|
|
- ElMessage.error(`请求失败,状态码: ${error.response.status}`);
|
|
|
+ ElMessage.error(t('Calculation.requestFailed') + error.response.status);
|
|
|
} else if (error.request) {
|
|
|
- ElMessage.error('请求发送成功,但没有收到响应');
|
|
|
+ ElMessage.error(t('Calculation.noResponse'));
|
|
|
} else {
|
|
|
- ElMessage.error('请求过程中发生错误: ' + error.message);
|
|
|
+ ElMessage.error(t('Calculation.requestError') + error.message);
|
|
|
}
|
|
|
}
|
|
|
-};
|
|
|
+}
|
|
|
|
|
|
// 弹框关闭后重置表单
|
|
|
const onDialogClose = () => {
|