<template>
    <!-- 上传 -->
    <el-dialog draggable :title="title" v-model="uploadConclusions" width="1500px" :before-close="cancel">
        <el-divider content-position="left">基本信息</el-divider>
        <el-form
            :inline="true"
            ref="formRef"
            :model="addForm"
            label-width="auto"
            :rules="rules"
            :disabled="title == '未建档干扰源用户详情' || title == '系统接入方案审核'"
        >
            <el-form-item label="所属单位:">
                <Area v-model="addForm.orgNo" disabled />
            </el-form-item>
            <el-form-item label="干扰源类型:">
                <el-select v-model="addForm.loadType" clearable collapse-tags placeholder="请选择" disabled filterable>
                    <el-option
                        v-for="item in interferenceType"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                    ></el-option>
                </el-select>
            </el-form-item>

            <el-form-item label="干扰源用户名称:" prop="userName">
                <el-input v-model="addForm.userName" clearable placeholder="请输入关键字" disabled></el-input>
            </el-form-item>
            <el-form-item label="建档时间:">
                <el-input v-model="addForm.recordTime" clearable placeholder="请输入关键字" disabled></el-input>
            </el-form-item>

            <el-divider content-position="left" style="font-weight: bolder; font-size: 18px">
                系统接入方案上传
            </el-divider>
            <el-form label-width="120px">
                <el-form-item class="item" label="上传文件:">
                    <el-upload
                        v-if="title == '未建档干扰源用户入网报告结论上传'"
                        v-model:file-list="addForm.fileList"
                        ref="upload"
                        action=""
                        :limit="1"
                        :on-exceed="handleExceed"
                        :auto-upload="false"
                    >
                        <template #trigger>
                            <el-button type="primary">上传文件</el-button>
                        </template>
                    </el-upload>
                    <el-button type="primary" link @click="download" v-else>
                        {{ addForm.ifilePathName }}
                    </el-button>
                </el-form-item>
            </el-form>

            <el-divider content-position="left" style="font-weight: bolder; font-size: 18px">
                入网评估结论填报
            </el-divider>
            <el-form-item label="是否超标:" style="margin-top: 10px" prop="iIsOverLimit" @change="changeOverLimit">
                <el-radio v-model="addForm.iIsOverLimit" :label="1">是</el-radio>
                <el-radio v-model="addForm.iIsOverLimit" :label="0">否</el-radio>
            </el-form-item>
            <br v-if="show" />
            <el-form-item label="超标指标:" style="margin-top: 10px" prop="IOverLimitTarget" v-if="show">
                <el-checkbox-group v-model="addForm.IOverLimitTarget">
                    <el-checkbox v-for="(item, ind) in exceeded" :label="item.id">
                        {{ item.name }}
                    </el-checkbox>
                </el-checkbox-group>
            </el-form-item>
            <br v-if="show" />
            <el-form-item label="计划采取措施:" style="margin-top: 10px" prop="IPlanStep" v-if="show">
                <el-select v-model="addForm.IPlanStep" placeholder="请选择" filterable>
                    <el-option
                        v-for="item in takeMeasures"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                    ></el-option>
                </el-select>
            </el-form-item>
            <br />
            <el-form-item label="入网详情:" style="margin-top: 10px" prop="IDescription">
                <el-input
                    v-model="addForm.IDescription"
                    :autosize="{ minRows: 2, maxRows: 4 }"
                    placeholder="请输入入网详情"
                    type="textarea"
                    style="width: 400px"
                ></el-input>
            </el-form-item>

            <el-form
                :inline="true"
                :model="addForm"
                label-width="auto"
                ref="form1Ref"
                style="margin-left: 32px"
                :rules="rules"
                v-if="title == '系统接入方案审核'"
            >
                <el-divider content-position="left" style="font-size: 18px; font-weight: bolder">审核意见</el-divider>
                <el-form-item label="审核意见:" prop="checkComment">
                    <el-input
                        type="textarea"
                        style="width: 400px"
                        placeholder="请输入审核意见"
                        :autosize="{ minRows: 2, maxRows: 4 }"
                        v-model="addForm.checkComment"
                    ></el-input>
                </el-form-item>
            </el-form>
        </el-form>
        <div
            style="display: flex; justify-content: center; margin-top: 30px"
            v-if="title != '未建档干扰源用户详情' && title != '系统接入方案审核'"
        >
            <el-button type="primary" class="ml20" @click="submit(1)">审核</el-button>
            <el-button type="primary" class="ml20" @click="submit(2)">保存</el-button>
            <el-button type="primary" class="ml20" @click="cancel">取消</el-button>
        </div>

        <div style="display: flex; justify-content: center; margin-top: 30px" v-if="title == '系统接入方案审核'">
            <el-button type="primary" class="ml20" @click="audit(1)">通过</el-button>
            <el-button type="primary" class="ml20" @click="audit(0)">不通过</el-button>
            <el-button type="primary" class="ml20" @click="cancel">取消</el-button>
        </div>
    </el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { useDictData } from '@/stores/dictData'
import Area from '@/components/form/area/index.vue'
import { UploadInstance, UploadProps, UploadRawFile, ElMessage, ElMessageBox } from 'element-plus'
import { genFileId } from 'element-plus'
import { uploadLoadTypeUserI, getLoadTypeUserById, checkLoadTypeUserI } from '@/api/process-boot/interference'
const dictData = useDictData()

const exceeded = dictData.getBasicData('Steady_Statis')
const takeMeasures = dictData.getBasicData('Plan_Take')
const interferenceType = dictData.getBasicData('Interference_Source')

const emit = defineEmits(['onSubmit'])
const uploadConclusions = ref(false)
const show = ref(false)
const addForm: any = ref({
    id: '',
    orgNo: '',
    loadType: '',
    userName: '',
    recordTime: '',
    iIsOverLimit: '',
    IDescription: '',
    IPlanStep: '',
    IOverLimitTarget: [],
    fileList: []
})
const upload = ref()
const title = ref('')
const rules = {
    iIsOverLimit: [{ required: true, message: '请选择是否超标', trigger: 'change' }],
    IDescription: [{ required: true, message: '请输入入网详情', trigger: 'blur' }],
    IPlanStep: [{ required: true, message: '请选择计划采取措施', trigger: 'change' }],
    IOverLimitTarget: [{ required: true, message: '请选择超标指标', trigger: 'change' }],
    checkComment: [{ required: true, message: '请输入入网详情', trigger: 'blur' }]
}
const formRef = ref()
const form1Ref = ref()

// 填报 审核
const submit = (flag: any) => {
    formRef.value.validate((valid: any) => {
        if (valid) {
            const formData = new FormData()

            addForm.value.fileList.forEach((item: any) => {
                if (item.raw == undefined) {
                } else {
                    formData.append('file', item.raw)
                }
            })
            formData.append('id', addForm.value.id)
            formData.append('IDescription', addForm.value.IDescription)
            formData.append('iIsOverLimit', addForm.value.iIsOverLimit)
            formData.append('IPlanStep', addForm.value.IPlanStep)
            formData.append('IOverLimitTarget', addForm.value.IOverLimitTarget.toString())

            formData.append('status', flag)
            // 提交
            uploadLoadTypeUserI(formData).then((res: any) => {
                ElMessage.success(flag == 1 ? '提交成功!' : '保存成功!')
                emit('onSubmit')
                cancel()
            })
        }
    })
}
// 入网审核
const audit = (flag: any) => {
    form1Ref.value?.validate((valid: any) => {
        if (valid) {
            checkLoadTypeUserI({
                checkComment: addForm.value.checkComment,
                checkPerson: dictData.state.area[0].id,
                checkResult: flag,
                id: addForm.value.id
            }).then((res: any) => {
                ElMessage.success('操作成功')
                cancel()
                emit('onSubmit')
            })
        }
    })
}
const handleExceed: UploadProps['onExceed'] = files => {
    upload.value!.clearFiles()
    const file = files[0] as UploadRawFile
    file.uid = genFileId()
    upload.value!.handleStart(file)
}
// 下载
const download = async () => {
    // window.open(addForm.value.ifile)
    let response = await fetch(addForm.value.ifile)
    let blob = await response.blob()
    let a = document.createElement('a')
    a.href = window.URL.createObjectURL(blob)
    a.download = addForm.value.ifilePathName
    a.click()
    a.remove()
}

// 重置
const cancel = () => {
    formRef.value?.resetFields()
    uploadConclusions.value = false
}

const open = (text: string, row: any) => {
    title.value = text
    getLoadTypeUserById({ id: row.id }).then((res: any) => {
        uploadConclusions.value = true
        addForm.value = {
            id: res.data.id,
            orgNo: res.data.orgNo,
            loadType: res.data.loadType,
            userName: res.data.userName,
            recordTime: res.data.recordTime,
            iIsOverLimit: res.data.iisOverLimit ? res.data.iisOverLimit : 0,
            IDescription: res.data.idescription ? res.data.idescription : '',
            IPlanStep: res.data.iplanStep ? res.data.iplanStep : '',
            IOverLimitTarget: res.data.ioverLimitTarget ? res.data.ioverLimitTarget.split(',') : [],
            fileList: res.data.ifilePathName ? [{ name: res.data.ifilePathName, status: 'ready' }] : [],
            ifilePathName: res.data.ifilePathName ? res.data.ifilePathName : '',
            ifile: res.data.ifile
        }
        res.data.iisOverLimit == 0 ? (show.value = false) : (show.value = true)
    })
}
const changeOverLimit = (e: any) => {
    if (e.target.value == 0) {
        show.value = false
    } else {
        show.value = true
    }
    addForm.value.IOverLimitTarget = []
    addForm.value.IPlanStep = ''
}

defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
    width: 400px;
}
</style>
