productivity-platform-web/src/views/assets/workbench/calculate/eqptBaseInfo.vue

<template>
    <div id="contrl" class="contrl">
        <el-divider content-position="left"><span style="color:#ff6154;">生成测算表</span></el-divider>
        <el-form ref="eqptBaseInfo" :model="eqptBaseInfo" label-width="auto" style="margin-top: 10px;"
            :rules="eqptBaseInfoRules">
            <el-row :gutter="10">
                <el-col :span="12">
                    <el-form-item label="工期:" class="form-item" prop="constructionPeriod">
                        <el-input-number v-model="eqptBaseInfo.constructionPeriod" clearable style="width: 95%;"
                            :precision="2" :step="0.1" />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="10">
                <el-col :span="12">
                    <el-form-item label="利息:" class="form-item" prop="interest">
                        <el-input-number v-model="eqptBaseInfo.interest" clearable style="width: 95%;" :precision="2"
                            :step="0.1" />%
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="10">
                <el-col :span="12">
                    <el-form-item label="前期费用率:" class="form-item" prop="preConstructionCostRatio">
                        <el-input-number v-model="eqptBaseInfo.preConstructionCostRatio" clearable style="width: 95%;"
                            :precision="2" :step="0.1" />%
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="10">
                <el-col :span="12">
                    <el-form-item label="建设单位管理费率:" class="form-item" prop="managementExpenseRatio">
                        <el-input-number v-model="eqptBaseInfo.managementExpenseRatio" clearable style="width: 95%;"
                            :precision="2" :step="0.1" />%
                    </el-form-item>
                </el-col>
            </el-row>
            <el-button plain type="danger" style="float: right;" @click="updateBaseInfo()">
                下一步
                <el-icon style="vertical-align: -20%;">
                    <ArrowRightBold />
                </el-icon>
            </el-button>
        </el-form>
    </div>
</template>

<script>
import { mapStores } from 'pinia'
import { assetsProjectInfo } from '@/stores/assetsProjectStore';
import { hasImportedEquipment } from '@/api/assetsCalculateEqptData';
import { updateCalculateBaseInfo, getCalculateBaseInfo } from '@/api/assetsCalculate';

export default {
    data() {
        return {
            hasImportedEquipment: false,
            eqptBaseInfo: {},
            eqptBaseInfoRules: {
                constructionPeriod: [
                    { required: true, message: '请输入工期', trigger: 'blur' }
                ],
                interest: [
                    { required: true, message: '请输入利息', trigger: 'blur' }
                ],
                preConstructionCostRatio: [
                    { required: true, message: '请输入前期费用率', trigger: 'blur' }
                ],
                managementExpenseRatio: [
                    { required: true, message: '请输入建设单位管理费率', trigger: 'blur' }
                ]
            },
            needUpdateStore: true
        }
    },
    created() {
        if(this.projectStore.calculateProgress) {
            this.getBaseInfo();
        }
    },
    computed: {
        ...mapStores(assetsProjectInfo),
    },
    methods: {
        // 更新测算表基础测算信息
        updateBaseInfo() {
            this.$refs.eqptBaseInfo.validate((valid) => {
                if (valid) {
                    let params = {};
                    params.calculateId = this.projectStore.calculateProgress.id;
                    params.baseInfo = JSON.stringify(this.eqptBaseInfo);
                    updateCalculateBaseInfo(params).then(res => {
                        if (res.code == 200) {
                            ElMessage({
                                showClose: true,
                                message: res.message,
                                type: 'success'
                            })
                            // 更新本地缓存的测算表进度
                            if (this.needUpdateStore) {
                                this.projectStore.calculateProgress.progress = 'IMPORT';
                            }
                            this.$router.push('/home/assets/workbench/calculate/importInfo');
                        }
                    })
                }
            })
        },
        // 获取测算表基础信息
        getBaseInfo() {
            getCalculateBaseInfo(this.projectStore.calculateProgress.id).then(res => {
                if (res.data) {
                    this.eqptBaseInfo = JSON.parse(res.data);
                    // 返回不为空说明该步骤以前已经完成了,不需要更新本地缓存
                    this.needUpdateStore = false;
                }
            })
        }
    }
}
</script>

<style scoped>
/* .contrl {
    font-size: 20px;
    width: 75%;
    border-right: 1.5px #dae1eb solid;
    padding: 0px 20px 20px 0px;
    float: left;

} */

:deep(.el-input__wrapper.is-focus) {
    --el-input-focus-border: #ff6154;
    --el-input-focus-border-color: #ff6154;
}

.target-windows {
    margin-top: 80px;
    overflow-y: scroll;
    padding: 5px;
    border: 1.5px #dae1eb solid;
    border-radius: 0.3em;
}

.title-div {
    height: 80px;
    line-height: 80px;
    width: 300px;
    float: left;
    font-size: 20px;
    font-weight: 900;
}

:deep(*) {
    color-scheme: light;
    --el-color-primary: #ff6154;
    --el-color-primary-light-3: #ff7154;
    --el-color-primary-light-5: #ff8154;
    --el-color-primary-light-7: #ff9154;
    --el-color-primary-light-8: #ffa999;
    --el-color-primary-light-9: #ffa854;
    --el-color-primary-dark-2: #ff8154;
}
</style>