admin-sjzx/src/views/pqs/harmonicMonitoring/harmonicGovern/index.vue

<!--谐波治理参数准备页面-->
<template>
    <el-form :inline='false' :model='form' label-width='135px' :rules='rules' ref='formRef'>
        <!--基础数据-->
        <div class='singleParamContent'>
            <el-divider content-position='left' class='divider'>
                <span class='dividerFontStyle'>负荷工况</span>
            </el-divider>
            <el-row>
                <el-col :span='7'>
                    <el-form-item label='有功' prop='yggl'>
                        <el-input
                            v-model='form.yggl'
                            clearable
                        >
                            <template #append>kW</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span='7' :offset='1'>
                    <el-form-item label='无功' prop='wggl'>
                        <el-input
                            v-model='form.wggl'
                            clearable
                        >
                            <template #append>kvar</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span='8'>
                    <el-button style='height: 45px;width:250px;position: absolute;right: 0;' type='primary'
                               @click='calcSag'>开始评估
                    </el-button>
                </el-col>
                <el-col :span='7'>
                    <el-form-item label='负载电压' prop='fzdy'>
                        <el-input
                            v-model='form.fzdy'
                            :min='0.4'
                            :max='500'
                            clearable
                        >
                            <template #append>kV</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span='7' :offset='1'>
                    <el-form-item label='负载接线方式' prop='ptType'>
                        <el-select v-model='form.ptType' filterable>
                            <el-option
                                v-for='item in ptTypeList'
                                :key='item.id'
                                :label='item.name'
                                :value='item.id'
                            />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span='6' :offset='1'>
                    <el-form-item label='负荷谐波电流' prop='ptType'>
                        <el-select v-model='form.ptType' filterable>
                            <el-option
                                v-for='item in ptTypeList'
                                :key='item.id'
                                :label='item.name'
                                :value='item.id'
                            />
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span='1'>
                    <el-button @click='importData' style='margin-left: 5px' type='primary' :icon='Plus' />
                </el-col>
            </el-row>
        </div>
        <!--UPS参数-->
        <div class='singleParamContent'>
            <el-divider content-position='left' class='divider'>
                <span class='dividerFontStyle'>变压器参数</span>
            </el-divider>
            <el-row>
                <el-col :span='7'>
                    <el-form-item label='负载损耗' prop='fhsh'>
                        <el-input
                            v-model='form.fhsh'
                            clearable
                        >
                            <template #append>kW</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span='7' :offset='1'>
                    <el-form-item label='短路阻抗百分比' prop='dlzk'>
                        <el-input
                            v-model='form.dlzk'
                            clearable
                        >
                            <template #append>%</template>
                        </el-input>
                    </el-form-item>
                </el-col>

                <el-col :span='7' :offset='1'>
                    <el-form-item label='额定容量' prop='edrl'>
                        <el-input
                            v-model='form.edrl'
                            clearable
                        >
                            <template #append>MVA</template>
                        </el-input>
                    </el-form-item>
                </el-col>

                <el-col :span='7'>
                    <el-form-item label='一次侧电压' prop='ycdy'>
                        <el-input
                            v-model='form.ycdy'
                            clearable
                        >
                            <template #append>kV</template>
                        </el-input>
                    </el-form-item>
                </el-col>

                <el-col :span='7' :offset='1'>
                    <el-form-item label='二次测电压' prop='ecdy'>
                        <el-input
                            v-model='form.ecdy'
                            clearable
                        >
                            <template #append>kV</template>
                        </el-input>
                    </el-form-item>
                </el-col>

                <el-col :span='7' :offset='1'>
                    <el-form-item label='空载电流百分比' prop='kzdl'>
                        <el-input
                            v-model='form.kzdl'
                            clearable
                        >
                            <template #append>%</template>
                        </el-input>
                    </el-form-item>
                </el-col>

                <el-col :span='7'>
                    <el-form-item label='空载损耗' prop='kzsh'>
                        <el-input
                            v-model='form.kzsh'
                            clearable
                        >
                            <template #append>kW</template>
                        </el-input>
                    </el-form-item>
                </el-col>

            </el-row>
        </div>
        <!--滤波器参数-->
        <div class='singleParamContent'>
            <el-divider content-position='left' class='divider'>
                <span class='dividerFontStyle'>滤波器参数</span>
            </el-divider>
            <el-row>
                <el-col :span='7'>
                    <el-form-item label='目标功率因数' prop='glys'>
                        <el-input
                            v-model='form.glys'
                            clearable
                        >
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span='7' :offset='1'>
                    <el-form-item label='分配方式' prop='calcflag'>
                        <el-select v-model='form.calcflag' filterable>
                            <el-option
                                v-for='item in calcList'
                                :key='item.id'
                                :label='item.name'
                                :value='item.id'
                            />
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :span='7' :offset='1'>

                </el-col>

                <el-col :span='7'>

                </el-col>

                <el-col :span='7' :offset='1'>

                </el-col>

            </el-row>
        </div>


    </el-form>
    <data-upload-popup ref='dataUploadPopup' />
</template>
<script setup lang='ts'>
import { Plus } from '@element-plus/icons-vue'
import { ref, reactive, onMounted } from 'vue'
import emitter from '@/utils/emitter'
import { numberRegex, numberRegexSag } from '@/utils/regexPattern'
import { ElMessage } from 'element-plus'
import { calc } from '@/api/advance-boot/sgGroven/sgScheme'
import DataUploadPopup from '@/views/pqs/harmonicMonitoring/harmonicGovern/dataUploadPopup.vue'

defineOptions({
    name: 'calcParamPrepare'
})

const dataUploadPopup = ref()
const formRef = ref()
const ptTypeList: any = ref(
    [
        { 'id': 1, 'name': '星型' },
        { 'id': 2, 'name': '三角型' }
    ]
)

const calcList: any = ref(
    [
        { 'id': 1, 'name': '按谐波电流大小分配' },
        { 'id': 2, 'name': '无功均分' }
    ]
)
const incomingLineListData: any = ref([])


// 注意不要和表单ref的命名冲突
let form = reactive({
    yggl: '155.83',
    wggl: '96.57',
    fzdy: '0.4',
    ptType: 1,
    fhsh: '',
    dlzk: '',
    edrl: '',
    ycdy: '',
    ecdy: '',
    kzdl: '',
    kzsh: '',
    glys: '',
    pzys: '',
    jzcs: '',
    calcflag: ''
})


//form表单校验规则
const rules = {
    yggl: [
        { required: true, message: '有功功率必填', trigger: 'blur' },
        { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
    ],
    wggl: [
        { required: true, message: '无功必填', trigger: 'blur' },
        { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
    ],
    fzdy: [
        { required: true, message: '负载电压必填', trigger: 'blur' },
        { pattern: numberRegexSag, message: '请确保电压范围0.4kV~500kV', trigger: 'blur' }
    ],
    productLineId: [{ required: true, message: '生产线必选', trigger: 'change' }],
    payBackPeriod: [{ required: true, message: '期望回收周期必填', trigger: 'change' }],
    ups: {
        price: [
            { required: true, message: '购置价格不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        compensation: [
            { required: true, message: '补偿能力不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        maintainFee: [
            { required: true, message: '年维护费不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        responseTime: [
            { required: true, message: '响应时间不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        backupTime: [
            { required: true, message: '后备时间不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ]
    },

    avc: {
        price: [
            { required: true, message: '购置价格不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        compensation: [
            { required: true, message: '补偿能力不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        maintainFee: [
            { required: true, message: '年维护费不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        responseTime: [
            { required: true, message: '响应时间不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        backupTime: [
            { required: true, message: '后备时间不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ]
    },

    quick: {
        governMachinePower: [
            { required: true, message: '终端容量不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        price: [
            { required: true, message: '购置价格不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        buildFee: [
            { required: true, message: '构建成本不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        quickMaintainFee: [
            { required: true, message: '年维护费不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        actionTime: [
            { required: true, message: '动作时间不能为空', trigger: 'blur' },
            { pattern: numberRegex, message: '请输入有效的数值', trigger: 'blur' }
        ],
        incomingLineId: [{ required: true, message: '备用进线必选', trigger: 'change' }]
    }
}

//新增负荷谐波电流
const importData = () => {
// 弹出框，联级选择生产线--进线，上传文件
    dataUploadPopup.value.open('导入谐波电流数据')
}

/**
 * 挂载时初始化数据内容
 */
onMounted(() => {
    //todo...动态加载数据文件
})


/**
 * 计算暂降治理
 */
function calcSag() {
    formRef.value.validate((valid: any, errorMsg: any) => {
        if (valid) {
            //将所有参数传递到后端进行数据计算
            calc(form).then(res => {
                //先通知父组件打开历史页面
                emitter.emit('schemeRadio', '评估计算结果')
                emitter.emit('calcResult', false)
                //再将历史数据传递到历史页面
                emitter.emit('send-scheme-result', res.data)
            })
        } else {
            for (const item in errorMsg) {
                ElMessage.error(errorMsg[item][0].message)
            }
        }
    })
}

</script>

<style scoped>

.divider {
    font-family: AlimamaDongFangDaKai;
}

@keyframes colorChange {
    0% {
        color: #205CE8;
    }
    100% {
        color: #32B9FC;
    }
}


.dividerFontStyle {
    font-size: 25px !important;
    animation: colorChange 3s infinite;
}

.singleParamContent {
    padding: 5px 30px;
}

.el-col {
    margin-top: 15px !important;
}
</style>