计算工具

qin

2025-03-31 20be1a99fd0f78ac87cebfba99829b4ffa8a1495

计算工具

 src/assets/icons/1.png

 src/assets/icons/2.png

 src/assets/icons/3.png

 src/assets/pdf/GB19762-2025.pdf

Binary files differ

 src/components/AppHeader.vue

@@ -18,6 +18,7 @@
                        <el-menu-item index="/eec-label-search" class="!px-4">证书查询</el-menu-item>
                        <el-menu-item index="/news-detail/99" class="!px-4">政策文件</el-menu-item>
                        <el-menu-item index="/select-selpara" class="!px-4" @click="linkClick">泵选型</el-menu-item>
                        <el-menu-item index="/gb19762-2025" class="!px-4">计算工具</el-menu-item>
                    </el-menu>
                </nav>


 src/router/index.ts

@@ -93,6 +93,11 @@
            name: 'cart',
            component: () => import('../views/CartPage.vue'),
        },
        {
            path: '/gb19762-2025',
            name: 'gb19762-2025',
            component: () => import('../views/GB19762-2025.vue'),
        },
    ],
});
router.beforeEach((to, from, next) => {

 src/views/GB19762-2025.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,427 @@
<template>
    <!-- <div class="detail-container">{{ Math.pow(Math.log(60), 2) }}
    </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="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">
                            <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)"
                                :type="pumpSelect === item.id ? 'primary' : 'default'" size="small">
                                {{ item.name }}
                            </span>
                        </div>
                    </div>
                </div>
                <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">
                            <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)"
                                :type="typeSelect === item.tag ? 'primary' : 'default'" size="small">
                                {{ item.name }}
                            </span>
                        </div>
                    </div>
                </div>
                <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">最高效率点流量(m³/h)：</span>
                        <div class="flex flex-1">
                            <el-input v-model="MaxFlow" placeholder="请输入最高效率点流量" class="!w-[300px]" clearable>
                            </el-input>
                        </div>
                    </div>
                </div>
                <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">最高效率点扬程(m)：</span>
                        <div class="flex flex-1">
                            <el-input v-model="MaxHead" placeholder="请输入最高效率点扬程" class="!w-[300px]" clearable>
                            </el-input>
                        </div>
                    </div>
                </div>
                <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">水泵转速(r/min)：</span>
                        <div class="flex flex-1">
                            <el-input v-model="Speed" placeholder="请输入水泵转速" class="!w-[300px]" clearable>
                            </el-input>
                        </div>
                    </div>
                </div>
                <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" style="color:blue">水泵效率(%)：</span>
                        <div class="flex flex-1">
                            <el-input v-model="Efficiency" placeholder="请输入效率" class="!w-[300px]" clearable>
                            </el-input>
                        </div>
                    </div>
                </div>
                <div class="border-b p-4 border-bottom-dashed-1 box-border" style="padding: 10px">
                    <div class="flex items-center">
                        <el-button type="primary" @click="Calc">计算</el-button>
                        <el-button @click="clear" type="info">清空</el-button>
                        <span style="margin-left: 85px;">参考国标文件：</span>
                        <span style="color:dodgerblue;cursor: pointer;font-weight: bold;">
                            <a href="/src/assets/pdf/GB19762-2025.pdf" target="_blank">
                                ç¦»å¿ƒæ³µèƒ½æ•ˆé™å®šå€¼åŠèƒ½æ•ˆç­‰çº§ GB+19762-2025</a>
                        </span>
                    </div>
                </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>
        </div>
    </div>
</template>
<script setup lang="ts">
import { onMounted, ref, computed } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import { ElMessage } from 'element-plus';

const router = useRouter();
const route = useRoute();

const pumptype = [
    { name: '清水离心泵', id: 1 },
    { name: '石油化工离心泵', id: 2 },
]

const type = [
    {
        name: '单级单吸清水离心泵', isdouble: false, issingle: true, pumpid: 1, tag: 1, contant: [
            { minFlow: 5, maxFlow: 300, c1: 162.33, c2: 163.33, c3: 168.33 },
            { minFlow: 300, maxFlow: 10000, c1: 161.33, c2: 163.33, c3: 168.33 },
        ]
    },
    {
        name: '单级双吸清水离心泵', isdouble: true, issingle: true, pumpid: 1, tag: 2, contant: [
            { minFlow: 50, maxFlow: 600, c1: 162.33, c2: 163.33, c3: 168.33 },
            { minFlow: 600, maxFlow: 20000, c1: 161.33, c2: 163.33, c3: 168.33 },
        ]
    },
    {
        name: '管道清水离心泵', isdouble: false, issingle: true, pumpid: 1, tag: 3, contant: [
            { minFlow: 5, maxFlow: 300, c1: 164.33, c2: 165.33, c3: 171.33 },
            { minFlow: 300, maxFlow: 3000, c1: 163.33, c2: 165.33, c3: 171.33 },
        ]
    },
    {
        name: '多级清水离心泵', isdouble: false, issingle: false, pumpid: 1, tag: 4, contant: [
            { minFlow: 5, maxFlow: 100, c1: 140.33, c2: 142.33, c3: 150.33 },
            { minFlow: 100, maxFlow: 3000, c1: 139.33, c2: 142.33, c3: 150.33 },
        ]
    },
    {
        name: '轻型多级清水离心泵(立式)', isdouble: false, issingle: false, pumpid: 1, tag: 5, contant: [
            { minFlow: 5, maxFlow: 300, c1: 137.33, c2: 139.33, c3: 144.33 },
        ]
    },
    {
        name: '轻型多级清水离心泵(卧式)', isdouble: false, issingle: false, pumpid: 1, tag: 6, contant: [
            { minFlow: 5, maxFlow: 300, c1: 140.33, c2: 142.33, c3: 147.33 },
        ]
    },
    {
        name: '单级单吸石油化工离心泵', isdouble: false, issingle: true, pumpid: 2, tag: 7, contant: [
            {
                minFlow: 6, maxFlow: 300, speed: [
                    { min: 20, max: 59, c1: 10, c2: 5, c3: -4 },
                    { min: 60, max: 119, c1: 4, c2: 1, c3: -6 },
                    { min: 120, max: 210, c1: 3, c2: 1, c3: -6 },
                    { min: 211, max: 300, c1: 3, c2: 1, c3: -6 },
                ]
            },
            {
                minFlow: 301, maxFlow: 30000, speed: [
                    { min: 20, max: 59, c1: 11, c2: 5, c3: -5 },
                    { min: 60, max: 119, c1: 5, c2: 1, c3: -5 },
                    { min: 120, max: 210, c1: 3, c2: 2, c3: -5 },
                    { min: 211, max: 300, c1: 3, c2: 2, c3: -5 },
                ]
            },
        ]
    },
    {
        name: '单级双吸石油化工离心泵', isdouble: true, issingle: true, pumpid: 2, tag: 8, contant: [
            {
                minFlow: 6, maxFlow: 300, speed: [
                    { min: 20, max: 59, c1: 10, c2: 5, c3: -4 },
                    { min: 60, max: 119, c1: 4, c2: 1, c3: -6 },
                    { min: 120, max: 210, c1: 3, c2: 1, c3: -6 },
                    { min: 211, max: 300, c1: 3, c2: 1, c3: -6 },
                ]
            },
            {
                minFlow: 301, maxFlow: 30000, speed: [
                    { min: 20, max: 59, c1: 11, c2: 5, c3: -5 },
                    { min: 60, max: 119, c1: 5, c2: 1, c3: -5 },
                    { min: 120, max: 210, c1: 3, c2: 2, c3: -5 },
                    { min: 211, max: 300, c1: 3, c2: 2, c3: -5 },
                ]
            },
        ]
    },
    {
        name: '多级石油化工离心泵', isdouble: false, issingle: false, pumpid: 2, tag: 9, contant: [
            {
                minFlow: 6, maxFlow: 300, speed: [
                    { min: 20, max: 59, c1: 5, c2: 3, c3: -5 },
                    { min: 60, max: 119, c1: 6, c2: 4, c3: -4 },
                    { min: 120, max: 210, c1: 1, c2: -1, c3: -5 },
                    { min: 211, max: 300, c1: 1, c2: -1, c3: -5 },
                ]
            },
            {
                minFlow: 301, maxFlow: 30000, speed: [
                    { min: 20, max: 59, c1: 3, c2: 1, c3: -4 },
                    { min: 60, max: 119, c1: 3, c2: 1, c3: -4 },
                    { min: 120, max: 210, c1: 1, c2: -1, c3: -5 },
                    { min: 211, max: 300, c1: 1, c2: -1, c3: -5 },
                ]
            },
        ]
    },
];
const clear = () => {
    MaxFlow.value = 0;
    MaxHead.value = 0;
    Speed.value = 0;
    Efficiency.value = 0;
    typeSelect.value = 1;
    calcResult.value = null;
}

const getImgUrl = () => {
    return "/src/assets/icons/" + calcResult.value + ".png";
}
// è®¡ç®—
const Calc = () => {
    let pump = type.filter((c) => { return c.tag == typeSelect.value })
    if (pump[0].pumpid == 1)
        CalcClearWaterPump(pump[0])
    else
        CalcPetrochemicalPump(pump[0])
}
//清水离心泵计算
const CalcClearWaterPump = (pump) => {
    let speedrate = SpeedRate(Speed.value, MaxFlow.value, MaxHead.value, pump.issingle, pump.isdouble)
    let c1V, c2V, c3V = 0;
    let cv = pump.contant.filter((c) => { return c.minFlow <= MaxFlow.value && c.maxFlow >= MaxFlow.value });
    if (pump.issingle) {
        c1V = -8.44 * Math.pow(Math.log(speedrate), 2) - 0.48 * Math.pow(Math.log(MaxFlow.value), 2) + 0.09 * Math.log(speedrate) * Math.log(MaxFlow.value) +
            84.63 * Math.log(speedrate) + 8.5 * Math.log(MaxFlow.value) - cv[0].c1;

        c2V = -8.44 * Math.pow(Math.log(speedrate), 2) - 0.48 * Math.pow(Math.log(MaxFlow.value), 2) + 0.09 * Math.log(speedrate) * Math.log(MaxFlow.value) +
            84.63 * Math.log(speedrate) + 8.5 * Math.log(MaxFlow.value) - cv[0].c2;

        c3V = -8.44 * Math.pow(Math.log(speedrate), 2) - 0.48 * Math.pow(Math.log(MaxFlow.value), 2) + 0.09 * Math.log(speedrate) * Math.log(MaxFlow.value) +
            84.63 * Math.log(speedrate) + 8.5 * Math.log(MaxFlow.value) - cv[0].c3;
    }
    else {
        c1V = -6.93 * Math.pow(Math.log(speedrate), 2) - 0.19 * Math.pow(Math.log(MaxFlow.value), 2) - 0.4 * Math.log(speedrate) * Math.log(MaxFlow.value) +
            72.67 * Math.log(speedrate) + 8.73 * Math.log(MaxFlow.value) - cv[0].c1;

        c2V = -6.93 * Math.pow(Math.log(speedrate), 2) - 0.19 * Math.pow(Math.log(MaxFlow.value), 2) - 0.4 * Math.log(speedrate) * Math.log(MaxFlow.value) +
            72.67 * Math.log(speedrate) + 8.73 * Math.log(MaxFlow.value) - cv[0].c2;

        c3V = -6.93 * Math.pow(Math.log(speedrate), 2) - 0.19 * Math.pow(Math.log(MaxFlow.value), 2) - 0.4 * Math.log(speedrate) * Math.log(MaxFlow.value) +
            72.67 * Math.log(speedrate) + 8.73 * Math.log(MaxFlow.value) - cv[0].c3;

    }
    let level = GetEnergyLevel(c1V, c2V, c3V);
    calcResult.value = level;
}

const GetEnergyLevel = (c1V: number, c2V: number, c3V: number) => {
    let levelDic = [
        { level: 1, min: c1V, max: 100 },
        { level: 2, min: c2V, max: c1V },
        { level: 3, min: c3V, max: c2V }
    ]
    let level = 5;
    for (const range of levelDic) {
        if (Efficiency.value >= range.min && Efficiency.value <= range.max) {
            level = range.level;
        }
    }
    return level;
}

//石油化工离心泵计算
const CalcPetrochemicalPump = (pump) => {
    let speedrate = SpeedRate(Speed.value, MaxFlow.value, MaxHead.value, pump.issingle, pump.isdouble)
    console.log(speedrate)

    let jzV = 0;
    let jzFlow = MaxFlow.value;
    if (MaxFlow.value > 3000)
        jzFlow = 3000
    if (pump.issingle) {
        jzV = 4.7057338 * Math.pow(10, -5) * Math.pow(Math.log(jzFlow), 6) - 6.6320555 * Math.pow(10, -3) * Math.pow(Math.log(jzFlow), 5) +
            1.5115754 * Math.pow(10, -1) * Math.pow(Math.log(jzFlow), 4) - 1.4023278 * Math.pow(Math.log(jzFlow), 3) +
            5.5234828 * Math.pow(Math.log(jzFlow), 2) - 8.3298912 * Math.pow(10, -1) * Math.log(jzFlow) +
            4.1951745 * 10;
    } else {
        jzV = 5.5836234 * Math.pow(10, -4) * Math.pow(Math.log(jzFlow), 6) - 1.2499816 * Math.pow(10, -2) * Math.pow(Math.log(jzFlow), 5) +
            9.9576618 * Math.pow(10, -2) * Math.pow(Math.log(jzFlow), 4) - 4.6811292 * Math.pow(10, -1) * Math.pow(Math.log(jzFlow), 3) +
            1.9459872 * Math.pow(Math.log(jzFlow), 2) + 1.4371144 * Math.log(jzFlow) +
            4.1467097 * 10;
    }

    let xzV = 0;
    if (speedrate > 210 && speedrate <= 300) {
        xzV = -1.1111111 * Math.pow(10, -10) * Math.pow(speedrate, 6) + 1.6769231 * Math.pow(10, -7) * Math.pow(speedrate, 5) -
            1.0507265 * Math.pow(10, -4) * Math.pow(speedrate, 4) + 3.4987040 * Math.pow(10, -2) * Math.pow(speedrate, 3) -
            6.5298720 * Math.pow(speedrate, 2) + 6.4773909 * Math.pow(10, 2) * speedrate -
            2.6684155 * Math.pow(10, 4);
    } else if (speedrate >= 20 && speedrate < 120) {
        xzV = 3.7873403 * Math.pow(10, -10) * Math.pow(speedrate, 6) - 1.7898913 * Math.pow(10, -7) * Math.pow(speedrate, 5) +
            3.4269717 * Math.pow(10, -5) * Math.pow(speedrate, 4) - 3.4148047 * Math.pow(10, -3) * Math.pow(speedrate, 3) +
            1.9050630 * Math.pow(speedrate, 2) * Math.pow(10, -1) - 6.0391904 * speedrate +
            9.8970658 * 10;
    } else xzV = 0;

    let oV = 0;
    if (speedrate >= 120 && speedrate <= 210)
        oV = jzV
    else oV = jzV - xzV

    let conV = pump.contant.filter((c) => { return c.minFlow <= MaxFlow.value && c.maxFlow >= MaxFlow.value });
    let cv = conV[0].speed.filter((c) => {
        return c.min <= speedrate && c.max >= speedrate
    })
    let c1V, c2V, c3V = 0;
    c1V = oV + cv[0].c1;
    c2V = oV + cv[0].c2;
    c3V = oV + cv[0].c3;
    let level = GetEnergyLevel(c1V, c2V, c3V);
    calcResult.value = level;
}

//issingle: æ˜¯å¦å•çº§,isdouble: æ˜¯å¦åŒå¸
const SpeedRate = (speed: number, q: number, h: number, issingle: boolean, isdouble: boolean) => {
    let singleV = 1;
    let doubleV = 1;
    if (!issingle)
        singleV = 5;
    if (isdouble)
        doubleV = 2;
    return 3.65 * speed * Math.pow(q / 3600 / doubleV, 0.5) / Math.pow(h / singleV, 0.75)
}
// é€‰ä¸­çŠ¶æ€
const typeSelect = ref(1);
const pumpSelect = ref(1);
const MaxFlow = ref(0);
const MaxHead = ref(0)
const Speed = ref(0);
const Efficiency = ref(0);
const calcResult = ref(null);
//监听类型选择筛选
const changeSelectType = (tag: number) => {
    typeSelect.value = tag;
    MaxFlow.value = 0;
    MaxHead.value = 0;
    Speed.value = 0;
    Efficiency.value = 0;
};
const changeSelectPumpType = (tag: number) => {
    pumpSelect.value = tag;
    typeSelect.value = type.filter((c) => { return c.pumpid == tag })[0].tag;
    MaxFlow.value = 0;
    MaxHead.value = 0;
    Speed.value = 0;
    Efficiency.value = 0;
};
</script>
<style lang="scss" scoped>
.w-100 {
    width: 100%;
}

.text-gray-500 {
    display: inline-block;
    width: 150px;
}

.h-100 {
    height: 100%;
}

.industrial-soft-style {
    position: relative;
}

.border-bottom-dashed-1 {
    // border-bottom: 1px dashed #e2e8f0;
}

.box-border {
    box-sizing: border-box;
}

.industrial-soft-style::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #38ca94;
    background-image: linear-gradient(90deg, #9bc864, #40cb8f 21%, #00c7c4 47%, #00bcef 74%, #0af);
}

.ant-tag {
    box-sizing: border-box;
    color: rgba(0, 0, 0, 0.65);
    font-variant: tabular-nums;
    line-height: 1.5;
    list-style: none;
    font-feature-settings: 'tnum';
    display: inline-block;
    height: auto;
    margin: 0 4px 0 0;
    padding: 2px 2px;
    line-height: 20px;
    white-space: nowrap;
    cursor: default;
    opacity: 1;
    transition: all 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    margin-right: 5px;
    font-size: 14px;
}

.ant-tag:hover {
    color: #1c97b7;
    cursor: pointer;
}

.ant-tag-checked {
    background-color: #1c97b7;
    color: #fff;
}

.ant-tag-checked:hover {
    color: #fff;
}


:deep(.el-button--default) {
    --el-button-bg-color: transparent;
    --el-button-border-color: transparent;
    --el-button-hover-bg-color: var(--el-color-primary-light-9);
    --el-button-hover-border-color: transparent;
}
</style>