配煤计算器

zhang_12370

2025-07-03 0853f9d313128ab2117ff6361e2ecbba9e6c9653

配煤计算器

 src/views/calculator/index.vue

@@ -90,7 +90,7 @@
                            placeholder="请输入"
                            style="width: 100%"
                          />
                          

                          <el-select
                            v-model="item.name"
                            v-show="item.type === '已有煤'"
@@ -102,8 +102,8 @@
                              :key="ele.key"
                              :label="ele.value"
                              :value="ele.key"
                            >{{ ele.value }}
                          </el-option>
                              >{{ ele.value }}
                            </el-option>
                          </el-select>
                        </div>
                      </el-form-item>
@@ -255,8 +255,8 @@
        </div>
        <div class="footer">
          <el-button @click="cancel">重置</el-button>
          <el-button type="primary" @click="submitForm" plain>
            查看计算结果
          <el-button type="primary" @click="addWarehoused" plain>
            添加至待入库
          </el-button>
          <el-button type="primary" @click="submitForm">计算最优配比</el-button>
        </div>
@@ -339,6 +339,20 @@
                  <span class="prop-value cost"
                    >{{ result.optimal.props.cost.toFixed(2) }} 元/吨</span
                  >
                </div>
                <div class="prop-item">
                  <span class="prop-label">生成:</span>
                  <el-autocomplete
                    v-model="result.optimal.props.createCoal"
                    :fetch-suggestions="querySearch"
                    clearable
                    size="small"
                    class="inline-input red-border"
                    style="width: 180px; min-height: 24px !important"
                    placeholder="请输入生成煤种"
                    @blur="handleSelect($event)"
                    @select="handleSelect($event)"
                  />
                </div>
              </div>
            </div>
@@ -461,7 +475,7 @@
});
const coalInfoList = ref([]);
// onMounted
onMounted(async () => {
const getCoalInfo = async () => {
  let result = await getCoalInfoList();
  if (result.code === 200) {
    result.data.forEach((item) => {
@@ -474,6 +488,32 @@
  } else {
    ElMessage.error("获取煤种信息失败，请稍后重试");
  }
};
// 根据 key 返回中文名，否则原样返回
const matchCoal = value => {
  if (!value) return "";
  const found = coalInfoList.value.find(c => c.key === value);
  return found ? found.value : value;
};
// 自动补全搜索
const querySearch = (q, cb) => {
  const res = q
    ? coalInfoList.value.filter(c => c.value.includes(q))
    : coalInfoList.value;
  cb(res);
};
// 选择/失焦时，优先存 key，找不到则存原值
const handleSelect = item => {
  const val = item.value || (item.target && item.target.value) || "";
  const found = coalInfoList.value.find(c => c.value === val || c.key === val);
  result.value.optimal.props.createCoal = found ? found.key : val;
  let match = matchCoal(result.value.optimal.props.createCoal);
  if (match && match !== result.value.optimal.props.createCoal) {
    result.value.optimal.props.createCoal = match;
  }
};
onMounted(async () => {
  getCoalInfo();
});
// 线性规划求解函数
const solveBlend = (coals, constraints) => {
@@ -616,9 +656,18 @@
  };
  ElMessage.success("表单已重置");
};

const addWarehoused = () => {
  if(!result.value){
    ElMessage.warning("请先计算最优配比后再添加至待入库");
    return;
  }
  if(result.value.optimal.props.createCoal === "") {
    ElMessage.warning("请先选择生成煤种");
    return;
  }
  console.log(result.value)
};
const submitForm = () => {
  console.log(coalForms.value)
  // 数据验证
  let validCoals = coalForms.value.filter(
    (coal) => coal.name && coal.cv && coal.price
@@ -760,7 +809,7 @@
};
</script>

<style scoped>
<style scoped lang="scss">
.view {
  display: flex;
  gap: 10px;
@@ -992,6 +1041,7 @@
  background: #f5f7fa;
  border-radius: 4px;
  font-size: 13px;
  align-items: center;
}

.prop-label {
@@ -1150,4 +1200,10 @@
    padding: 4px 8px;
  }
}
:deep(.el-input__wrapper) {
  min-height: 24px !important;
}
:deep(.el-input__inner) {
  min-height: 24px !important;
}
</style>