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

<template>
    <div class="contrl">
        <el-form ref="baseInfo" :model="baseInfo" label-width="auto" style="margin-top: 10px;" :rules="baseInfoRules">
            <el-divider content-position="left"><span style="color:#ff6154;">基本信息</span></el-divider>
            <el-row :gutter="10">
                <el-col :span="12">
                    <el-form-item label="测算名:" class="form-item" prop="calculateName">
                        <el-input v-model="baseInfo.calculateName" clearable style="width: 100%;" />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="10">
                <el-col :span="12">
                    <el-form-item label="评估基准日:" class="form-item" prop="valuationBasisDate">
                        <el-date-picker v-model="baseInfo.valuationBasisDate" type="date" placeholder="选择评估基准日"
                            style="width: 100%;" />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-button plain type="danger" style="float: right;" @click="createCalculate()">
                下一步
                <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 { createAssetsCalculate, getUnFinishedCalculateProgress } from '@/api/assetsCalculate';
export default {
    data() {
        return {
            baseInfo: {

            },
            baseInfoRules: {
                calculateName: [
                    { required: true, message: '请输入测算表名', trigger: 'blur' }
                ],
                valuationBasisDate: [
                    { required: true, message: '请选择评估基准日', trigger: 'blur' }
                ]
            }
        }
    },
    computed: {
        ...mapStores(assetsProjectInfo),
    },
    created() {
        if (this.projectStore.calculateProgress) {
            this.baseInfo.id = this.projectStore.calculateProgress.id;
            this.baseInfo.projectId = this.projectStore.projectInfo.id;
            this.baseInfo.calculateName = this.projectStore.calculateProgress.calculateName;
            this.baseInfo.valuationBasisDate = this.projectStore.calculateProgress.valuationBasisDate;
        }
    },
    methods: {
        // 创建测算表,填写测算表基础信息
        createCalculate() {
            this.$refs.baseInfo.validate((valid) => {
                if (valid) {
                    if (!this.projectStore.calculateProgress.id) {
                        this.baseInfo.progress = 'BASE';
                    }
                    this.baseInfo.projectId = this.projectStore.projectInfo.id;
                    createAssetsCalculate(this.baseInfo).then(res => {
                        if (res.code == 200) {
                            ElMessage({
                                showClose: true,
                                message: res.message,
                                type: 'success'
                            })
                            this.$router.push('/home/assets/workbench/calculate/eqptBaseInfo')
                            this.getCalculateProgress();
                        }
                    })
                }
            })
        },
        // 获取未完成测算表的进度信息并保存到缓存
        getCalculateProgress() {
            getUnFinishedCalculateProgress(this.projectStore.projectInfo.id).then(res => {
                if (res.data) {
                    this.projectStore.setCalculateProgress(res.data);
                }
            })
        }
    }
}
</script>

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

}

: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>