admin-sjzx/src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/detail.vue

<template>
    <div class="default-main">
        <el-descriptions :column="2" border>
            <el-descriptions-item label="填报人">
                {{ detailData.reporter }}
            </el-descriptions-item>
            <el-descriptions-item label="填报日期">
                {{ formatDate(detailData.reportDate, 'YYYY-MM-DD') }}
            </el-descriptions-item>
            <el-descriptions-item label="填报部门">
                {{ detailData.orgName }}
            </el-descriptions-item>
            <el-descriptions-item label="工程投产日期">
                {{ formatDate(detailData.expectedProductionDate, 'YYYY-MM-DD') }}
            </el-descriptions-item>
            <!-- <el-descriptions-item label="所属地市">
                {{ detailData.city }}
            </el-descriptions-item> -->
            <el-descriptions-item label="用户状态">
                {{
                    userStateList.find(item => {
                        return item.value == detailData.userStatus
                    })?.label
                }}
            </el-descriptions-item>
            <el-descriptions-item label="工程名">
                {{ detailData.userName }}
            </el-descriptions-item>
            <!--文件地址-->
            >
            <el-descriptions-item label="终端台账信息" v-if="detailData.lineFilePath">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.lineFilePath.url">
                    {{ detailData?.lineFilePath.name }}
                </a>
            </el-descriptions-item>
            <el-descriptions-item label="监测点台账信息" v-if="detailData.factoryInspectionReport">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.factoryInspectionReport.url">
                    {{ detailData?.factoryInspectionReport.name }}
                </a>
            </el-descriptions-item>
            <el-descriptions-item label="验收检验报告单" v-if="detailData?.informationSecurityTestReport">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.informationSecurityTestReport.url">
                    {{ detailData?.informationSecurityTestReport.name }}
                </a>
            </el-descriptions-item>
            <el-descriptions-item label="验收检验报告" v-if="detailData?.otherAttachments">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.otherAttachments.url">{{ detailData?.otherAttachments.name }}</a>
            </el-descriptions-item>
            <el-descriptions-item label="型式实验报告" v-if="detailData?.performanceTestReport">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.performanceTestReport.url">{{ detailData?.performanceTestReport.name }}</a>
            </el-descriptions-item>
            <el-descriptions-item label="出厂检验报告" v-if="detailData?.typeExperimentReport">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.typeExperimentReport.url">{{ detailData?.typeExperimentReport.name }}</a>
            </el-descriptions-item>
            <el-descriptions-item label="性能检测报告" v-if="detailData?.performanceTestReport">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.performanceTestReport.url">{{ detailData?.performanceTestReport.name }}</a>
            </el-descriptions-item>
            <el-descriptions-item label="信息安全检测报告" v-if="detailData?.typeExperimentReport">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.typeExperimentReport.url">{{ detailData?.typeExperimentReport.name }}</a>
            </el-descriptions-item>
            <el-descriptions-item label="其他附件" v-if="detailData?.additionalAttachments">
                <el-icon>
                    <Link />
                </el-icon>
                <a :href="detailData?.additionalAttachments.url">{{ detailData?.additionalAttachments.name }}</a>
            </el-descriptions-item>
        </el-descriptions>
    </div>
</template>
<script lang="ts" setup>
import { onMounted, ref, reactive } from 'vue'
import { useRoute } from 'vue-router'
import { formatDate } from '@/utils/formatTime'
import { propTypes } from '@/utils/propTypes'
import { getTerminalDetailsById } from '@/api/supervision-boot/terminal/index'
import { getDictTreeById } from '@/api/system-boot/dictTree'
import { useDictData } from '@/stores/dictData'
import { getFileNameAndFilePath } from '@/api/system-boot/file'
import { Link } from '@element-plus/icons-vue'

defineOptions({ name: 'BpmUserReportDetail' })

const { query } = useRoute() // 查询参数

const props = defineProps({
    id: propTypes.string.def(undefined)
})
const detailLoading = ref(false) // 表单的加载中
const detailData = ref<any>({}) // 详情数据
const queryId = query.id as unknown as string // 从 URL 传递过来的 id 编号
//用户性质数组
const userTypeList = reactive([
    {
        label: '新建电网工程',
        value: '0'
    },
    {
        label: '扩建电网工程',
        value: '1'
    },
    {
        label: '新建非线性负荷用户',
        value: '2'
    },
    {
        label: '扩建非线性负荷用户',
        value: '3'
    },
    {
        label: '新建新能源发电站',
        value: '4'
    },
    {
        label: '扩建新能源发电站',
        value: '5'
    },
    {
        label: '敏感及重要用户',
        value: '6'
    }
])
//用户状态数组
const userStateList = reactive([
    {
        label: '可研',
        value: '0'
    },
    {
        label: '建设',
        value: '1'
    },
    {
        label: '运行',
        value: '2'
    },
    {
        label: '退运',
        value: '3'
    }
])
const dictData = useDictData()
//字典获取所属地市
const areaOptionList = dictData.getBasicData('jibei_area')
//字典获取敏感电能质量指标
const energyQualityIndexList = dictData.getBasicData('Indicator_Type')
//字典获取行业类型
const industryList = dictData.getBasicData('industry_type_jb')
//字典电压等级
const voltageLevelList = dictData.getBasicData('Dev_Voltage_Stand')
//字典评估类型
const evaluationTypeList = dictData.getBasicData('Evaluation_Type')
//字典预测评估单位
const evaluationDeptList = dictData.getBasicData('evaluation_dept')
/** 获得数据 */
const getInfo = async () => {
    detailLoading.value = true
    try {
        await getTerminalDetailsById({ id: props.id || queryId }).then(res => {
            detailData.value = res.data;
            console.log(detailData.value,"+++++++++")
            getFileName()
        })
    } finally {
        detailLoading.value = false
    }
}
//判断userType选择取用的对象
const getFileName = async () => {
    //验收检验报告
    if (detailData.value.acceptanceInspectionReport) {
        await getFileNamePath(detailData.value.acceptanceInspectionReport, 'acceptanceInspectionReport')
    }
    //验收检验报告单
    if (detailData.value.acceptanceInspectionReportSingle) {
        await getFileNamePath(detailData.value.acceptanceInspectionReportSingle, 'acceptanceInspectionReportSingle')
    }
    //出厂检验报告
    if (detailData.value.factoryInspectionReport) {
        await getFileNamePath(detailData.value.factoryInspectionReport, 'factoryInspectionReport')
    }

    //信息安全检测报告
    if (detailData.value.informationSecurityTestReport) {
        await getFileNamePath(
            detailData.value.informationSecurityTestReport,
            'informationSecurityTestReport'
        )
    }
    //监测点台账信息
    if (detailData.value.lineFilePath) {
        await getFileNamePath(detailData.value.lineFilePath, 'lineFilePath')
    }

    //其他附件
    if (detailData.value.otherAttachments) {
        await getFileNamePath(detailData.value.otherAttachments, 'otherAttachments')
    }

    //性能检测报告
    if (detailData.value.performanceTestReport) {
        await getFileNamePath(detailData.value.performanceTestReport, 'performanceTestReport')
    }

    //型式实验报告
    if (detailData.value.typeExperimentReport) {
        await getFileNamePath(detailData.value.typeExperimentReport, 'typeExperimentReport')
    }

    //其他附件
    // if (detailData.value.additionalAttachments) {
    //     getFileNamePath(detailData.value.additionalAttachments, 'additionalAttachments')
    // }
}
//根据文件名请求
const getFileNamePath = async (val: any, pathName: any) => {
    await getFileNameAndFilePath({ filePath: val }).then(res => {
        console.log(111111111)
        if (res.data ) {
            //可研报告
            if (pathName == 'acceptanceInspectionReport' && detailData.value.acceptanceInspectionReport) {
                detailData.value.acceptanceInspectionReport = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //终端台账信息
            else if (pathName == 'acceptanceInspectionReportSingle' && detailData.value.acceptanceInspectionReportSingle) {
                detailData.value.acceptanceInspectionReportSingle = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //预测评估报告
            else if (pathName == 'factoryInspectionReport' && detailData.value.factoryInspectionReport) {
                detailData.value.factoryInspectionReport = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //预测评估评审意见报告
            else if (
                pathName == 'informationSecurityTestReport' &&
                detailData.value.informationSecurityTestReport
            ) {
                detailData.value.informationSecurityTestReport = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //用户接入变电站主接线示意图
            else if (pathName == 'lineFilePath' && detailData.value.lineFilePath) {
                detailData.value.lineFilePath = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //主要敏感设备清单
            else if (pathName == 'otherAttachments' && detailData.value.otherAttachments) {
                detailData.value.otherAttachments = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //抗扰度测试报告
            else if (pathName == 'performanceTestReport' && detailData.value.performanceTestReport) {
                detailData.value.performanceTestReport = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //背景电能质量测试报告
            else if (pathName == 'typeExperimentReport' && detailData.value.typeExperimentReport) {
                detailData.value.typeExperimentReport = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
            //其他附件
            else if (pathName == 'additionalAttachments' && detailData.value.additionalAttachments) {
                detailData.value.additionalAttachments = {
                    name: res.data.fileName,
                    url: res.data.url
                }
            }
        }
    })
}
defineExpose({ open: getInfo }) // 提供 open 方法，用于打开弹窗

/** 初始化 **/
onMounted(() => {
    getInfo()
})
</script>
<style lang="scss">
.default-main {
    height: calc(100vh - 100px);
    overflow: auto;
}

::v-deep.el-icon svg {
    margin: 5px !important;
    position: absolute !important;
    top: 20px !important;
}
</style>