From 27dc9bdfc57e09b42922dab7d73117ad1486ceb5 Mon Sep 17 00:00:00 2001
From: tanghaolin <1723298894@qq.com>
Date: 星期三, 02 四月 2025 10:27:56 +0800
Subject: [PATCH] 修改计算页布局
---
src/views/GB19762-2025.vue | 61 +++++++++++++++++-------------
1 files changed, 35 insertions(+), 26 deletions(-)
diff --git a/src/views/GB19762-2025.vue b/src/views/GB19762-2025.vue
index ae5694c..97d3dd0 100644
--- a/src/views/GB19762-2025.vue
+++ b/src/views/GB19762-2025.vue
@@ -3,12 +3,18 @@
</div> -->
<div class="container mx-auto px-4 py-8 bg-white industrial-soft-style" style="margin-top: 20px; padding-top: 15px">
<div class="w-100 h-100" style="background-color: #fff">
+ <div class="mb-6 text-gray-500">
+ <el-breadcrumb separator="/">
+ <el-breadcrumb-item :to="{ path: '/' }">棣栭〉</el-breadcrumb-item>
+ <el-breadcrumb-item>鑳芥晥绛夌骇璁＄畻</el-breadcrumb-item>
+ </el-breadcrumb>
+ </div>
<!-- 椤堕儴鍒嗙被鑿滃崟 -->
<div class="rounded-lg shadow" style="background-color: #f6f7f9; margin-bottom: 10px">
<div class="border-b p-4 border-bottom-dashed-1 box-border" style="padding: 10px">
<div class="flex items-center">
<span class="text-gray-500">绂诲績娉电被鍨嬶細</span>
- <div class="flex flex-1">
+ <div class="flex flex-1 flex-wrap">
<span v-for="item in pumptype" class="ant-tag !px-2"
:class="pumpSelect === item.id ? 'ant-tag-checked' : ''" :key="item.id"
@click="changeSelectPumpType(item.id)"
@@ -21,7 +27,7 @@
<div class="border-b p-4 border-bottom-dashed-1 box-border" style="padding: 10px">
<div class="flex items-center">
<span class="text-gray-500">姘存车绫诲瀷锛�</span>
- <div class="flex flex-1">
+ <div class="flex flex-1 flex-wrap">
<span v-for="item in type.filter((c) => { return c.pumpid == pumpSelect })"
class="ant-tag !px-2" :class="typeSelect === item.tag ? 'ant-tag-checked' : ''"
:key="item.tag" @click="changeSelectType(item.tag)"
@@ -80,8 +86,10 @@
</div>
</div>
- <div class="grid grid-cols-4 gap-4" style="padding: 15px 10px; min-height: 30px">
- <img style="width:78px;height: 30px;" v-if="calcResult != null" :src="getImgUrl()">
+ <div class="grid" style="padding: 15px 10px; min-height: 30px">
+ <img v-if="level > -1" style="width:78px;height: 30px;" :src="getImgUrl()"><span v-if="level > -1">{{
+ calcResult }}</span>
+ <!-- <span v-if="level == 0">鏈绠楀嚭鑳芥晥绛夌骇锛岃妫�鏌ヨ緭鍏ユ暟鎹�!</span> -->
</div>
</div>
</div>
@@ -203,32 +211,33 @@
Efficiency.value = '';
typeSelect.value = 1;
calcResult.value = null;
+ level.value = 0;
}
const getImgUrl = () => {
- return `${SERVE_URL}static/img/calc-icons/${calcResult.value}.png`;
+ return `${SERVE_URL}static/img/calc-icons/${level.value}.png`;
}
// 璁＄畻
const Calc = () => {
- if (MaxFlow.value == null)
- {
+ if (MaxFlow.value == null) {
ElMessage.error("璇疯緭鍏ユ湁鏁堟祦閲忔暟鎹�!");
return;
}
- if (MaxHead.value == null)
- {
+ if (MaxHead.value == null) {
ElMessage.error("璇疯緭鍏ユ湁鏁堟壃绋嬫暟鎹�!");
return;
}
- if (Speed.value == null)
- {
+ if (Speed.value == null) {
ElMessage.error("璇疯緭鍏ユ湁鏁堣浆閫熸暟鎹�!");
return;
}
- if (Efficiency.value == null)
- {
+ if (Efficiency.value == null) {
ElMessage.error("璇疯緭鍏ユ湁鏁堟晥鐜囨暟鎹�!");
+ return;
+ }
+ if (Efficiency.value < 0 || Efficiency.value > 100) {
+ ElMessage.error("璇疯緭鍏ユ湁鏁堟晥鐜囨暟鎹��0-100銆�!");
return;
}
@@ -265,7 +274,7 @@
}
let level = GetEnergyLevel(c1V, c2V, c3V);
- calcResult.value = level;
+ //calcResult.value = level;
}
const GetEnergyLevel = (c1V: number, c2V: number, c3V: number) => {
@@ -274,13 +283,16 @@
{ level: 2, min: c2V, max: c1V },
{ level: 3, min: c3V, max: c2V }
]
- let level = 5;
+ let levelV = 0;
for (const range of levelDic) {
if (Efficiency.value >= range.min && Efficiency.value <= range.max) {
- level = range.level;
+ levelV = range.level;
}
}
- return level;
+ calcResult.value = "璁＄畻缁撴灉锛�1绾ф晥鐜囧�� " + c1V.toFixed(2) + "%锛�2绾ф晥鐜囧�� " + c2V.toFixed(2) + "%锛�3绾ф晥鐜囧�� " + c3V.toFixed(2) + "%";
+
+ level.value = levelV;
+ return levelV;
}
//鐭虫补鍖栧伐绂诲績娉佃绠�
@@ -331,7 +343,7 @@
c2V = oV + cv[0].c2;
c3V = oV + cv[0].c3;
let level = GetEnergyLevel(c1V, c2V, c3V);
- calcResult.value = level;
+ //calcResult.value = level;
}
//issingle: 鏄惁鍗曠骇,isdouble: 鏄惁鍙屽惛
@@ -352,21 +364,14 @@
const Speed = ref(null);
const Efficiency = ref(null);
const calcResult = ref(null);
+const level = ref(-1)
//鐩戝惉绫诲瀷閫夋嫨绛涢��
const changeSelectType = (tag: number) => {
typeSelect.value = tag;
- MaxFlow.value = '';
- MaxHead.value = '';
- Speed.value = '';
- Efficiency.value = '';
};
const changeSelectPumpType = (tag: number) => {
pumpSelect.value = tag;
typeSelect.value = type.filter((c) => { return c.pumpid == tag })[0].tag;
- MaxFlow.value = '';
- MaxHead.value = '';
- Speed.value = '';
- Efficiency.value = '';
};
</script>
<style lang="scss" scoped>
@@ -377,6 +382,7 @@
.text-gray-500 {
display: inline-block;
width: 150px;
+ flex-shrink: 0;
}
.h-100 {
@@ -439,6 +445,9 @@
.ant-tag-checked:hover {
color: #fff;
}
+.flex-wrap {
+ flex-wrap: wrap;
+}
:deep(.el-button--default) {
--
Gitblit v1.9.3