<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" ref="process0Ref" @handleClose="handleClose" />
    <!-- 计划整改措施 1-->
    <process2 v-if="control == 1" :addData="addData" ref="process1Ref" @handleClose="handleClose" />
    <!-- 实际采取措施 2 -->
    <process3 v-if="control == 2" :addData="addData" ref="process2Ref" @handleClose="handleClose" />
    <!-- 成效分析  3 -->
    <process4 v-if="control == 3" :addData="addData" ref="process3Ref" @handleClose="handleClose" />

    <div style="display: flex; justify-content: center; margin-top: 10px" v-show="active == control">
        <el-button type="primary" @click="Submit">提交审核</el-button>
        <el-button @click="handleClose">取消</el-button>
    </div>
</template>
<script setup lang="ts">
import { ref, reactive } 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 } from '@/api/process-boot/electricitymanagement'
const emit = defineEmits(['beforeClose'])
const dictData = useDictData()
const addData: any = ref({})
const active = ref(4)
const control = ref()
const stepTitle = ['原因分析', '计划整改措施', '实际采取措施', '成效分析']
const process0Ref = ref()
const process1Ref = ref()
const process2Ref = ref()
const process3Ref = ref()

const problemData = dictData.getBasicData('Problem_Sources')
const open = (row: any) => {
    addData.value = row

    getAbnormalDetail(row.powerQualityProblemNo).then((res: any) => {
        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
    })
}

const step = (e: number) => {
    if (active.value >= e) {
        control.value = e
    }
}

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