admin-sjzx/src/views/pqs/supervise/electricalEnergy/components/filling.vue

<template>
    <el-divider content-position="left" style="font-size: 18px; font-weight: bolder">问题基本信息</el-divider>
    <el-form :inline="true" label-width="auto">
        <el-form-item label="所属单位:">
            <el-input v-model="addData.orgName" clearable placeholder="请填写" disabled></el-input>
        </el-form-item>

        <el-form-item label="问题来源:">
            <el-select disabled v-model="addData.problemSources" placeholder="请选择">
                <el-option
                    v-for="item in problemData"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                ></el-option>
            </el-select>
        </el-form-item>

        <el-form-item label="问题名称:">
            <el-input v-model="addData.problemName" clearable placeholder="请填写" disabled></el-input>
        </el-form-item>

        <el-form-item label="问题编号:">
            <el-input v-model="addData.powerQualityProblemNo" disabled clearable placeholder="请填写"></el-input>
        </el-form-item>
    </el-form>

    <el-divider content-position="left" style="font-size: 18px; font-weight: bolder">填报流程</el-divider>

    <el-steps :active="active" finish-status="success" class="mb10" simple>
        <el-step v-for="(item, i) in stepTitle">
            <template #title>
                <span @click="step(i)">{{ item }}</span>
            </template>
        </el-step>
    </el-steps>

    <!-- 原因分析 0 -->
    <process1
        v-if="control == 0"
        :addData="addData"
        :List="List"
        :disabled="disabled"
        ref="process0Ref"
        @handleClose="handleClose"
    />
    <!-- 计划整改措施 1-->
    <process2
        v-if="control == 1"
        :addData="addData"
        :List="List"
        :disabled="disabled"
        ref="process1Ref"
        @handleClose="handleClose"
    />
    <!-- 实际采取措施 2 -->
    <process3
        v-if="control == 2"
        :addData="addData"
        :List="List"
        :disabled="disabled"
        ref="process2Ref"
        @handleClose="handleClose"
    />
    <!-- 成效分析  3 -->
    <process4
        v-if="control == 3"
        :addData="addData"
        :List="List"
        :disabled="disabled"
        ref="process3Ref"
        @handleClose="handleClose"
    />

    <div style="display: flex; justify-content: center; margin-top: 10px" v-show="!disabled">
        <el-button type="primary" @click="Submit">提交审核</el-button>
        <el-button @click="handleClose">取消</el-button>
    </div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useDictData } from '@/stores/dictData'
import process1 from './process1.vue'
import process2 from './process2.vue'
import process3 from './process3.vue'
import process4 from './process4.vue'
import {
    getAbnormalDetail,
    getComplaintDetail,
    getGeneralSurveyDetail,
    getExcessiveDetail
} from '@/api/process-boot/electricitymanagement'
const emit = defineEmits(['beforeClose'])
const dictData = useDictData()
const addData: any = ref({})
const List: any = ref({})
const active = ref(4)
const control = ref()
const stepTitle = ['原因分析', '计划整改措施', '实际采取措施', '成效分析']
const process0Ref = ref()
const process1Ref = ref()
const process2Ref = ref()
const process3Ref = ref()
const disabled = ref(false)
const prop = defineProps({
    isDisabled: {
        type: Boolean,
        default: false
    }
})
const problemData = dictData.getBasicData('Problem_Sources')
const open = async (row: any) => {
    addData.value = row
    let res: any = {}
    if (row.problemSources == '设备异常') {
        res = await getAbnormalDetail(row.powerQualityProblemNo)
    } else if (row.problemSources == '在线监测告警') {
        res = await getExcessiveDetail(row.powerQualityProblemNo)
    } else if (row.problemSources == '用户投诉') {
        res = await getComplaintDetail(row.powerQualityProblemNo)
    } else if (row.problemSources == '普测超标') {
        res = await getGeneralSurveyDetail(row.powerQualityProblemNo)
    }

    setTimeout(() => {
        List.value = res.data

        if (res.data.filePathYyfx == null) {
            active.value = 0
        } else if (res.data.filePathJhzg == null) {
            active.value = 1
            if (row.reportProcessStatus == 'Fail') {
                active.value = 0
            }
        } else if (res.data.filePathSjcq == null) {
            active.value = 2
            if (row.reportProcessStatus == 'Fail') {
                active.value = 1
            }
        } else if (res.data.filePathZlxg == null) {
            active.value = 3
            if (row.reportProcessStatus == 'Fail') {
                active.value = 2
            }
        }
        control.value = active.value == 4 ? 3 : active.value
    }, 0)
}

const step = (e: number) => {
    if (active.value >= e) {
        control.value = e
        if (active.value == e && !prop.isDisabled) {
            disabled.value = false
        } else {
            disabled.value = true
        }
    }
}
onMounted(() => {
    if (prop.isDisabled) {
        disabled.value = prop.isDisabled
    }
})
// 提交
const Submit = () => {
    if (control.value == 0) {
        process0Ref.value.submit(0)
    } else if (control.value == 1) {
        process1Ref.value.submit(1)
    } else if (control.value == 2) {
        process2Ref.value.submit(2)
    } else if (control.value == 3) {
        process3Ref.value.submit(3)
    }
}
// 取消
const handleClose = () => {
    emit('beforeClose')
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
    width: 400px;
}
</style>