修改 预览展示页面

src/views/pqs/supervise/interfere/components/undocumented/detail.vue

@@ -52,7 +52,7 @@
             <el-descriptions-item label="预测评估单位">
                 {{ detailData.evaluationDept }}
             </el-descriptions-item>
-            <el-descriptions-item label="预测评估结论"  :span="2">
+            <el-descriptions-item label="预测评估结论" :span="2">
                 {{ detailData.evaluationConclusion }}
             </el-descriptions-item>
             <el-descriptions-item
@@ -207,11 +207,13 @@
             </el-descriptions-item>
             <el-descriptions-item label="可研报告">
                 <span v-if="detailData.userType == 0 || detailData.userType == 1">
-                    <el-icon><Link /></el-icon>
+                    <el-icon class="elView" v-if="proviteData?.feasibilityReport?.name">
+                        <View @click="openFile(proviteData?.feasibilityReport?.name)" />
+                    </el-icon>
                     <a target="_blank" :href="proviteData.feasibilityReport?.url" rel="nofollow">
                         {{ proviteData.feasibilityReport?.name }}
                     </a>
-                    <span @click="openFile(proviteData.feasibilityReport?.name )">预览</span>
+                 
                 </span>
                 <span
                     v-if="
@@ -221,97 +223,92 @@
                         detailData.userType == 5
                     "
                 >
-                    <el-icon><Link /></el-icon>
+                    <el-icon class="elView" v-if="proviteData?.feasibilityReport?.name">
+                        <View @click="openFile(proviteData?.feasibilityReport?.name)" />
+                    </el-icon>
                     <a target="_blank" :href="proviteData.feasibilityReport?.url">
                         {{ proviteData.feasibilityReport?.name }}
                     </a>
-                    <span @click="openFile(proviteData.feasibilityReport?.name )">预览</span>
                 </span>
                 <span v-if="detailData.userType == 6">
-                    <el-icon><Link /></el-icon>
+                    <el-icon class="elView" v-if="proviteData?.feasibilityReport?.name">
+                        <View @click="openFile(proviteData?.feasibilityReport?.name)" />
+                    </el-icon>
                     <a target="_blank" :href="proviteData.feasibilityReport?.url">
                         {{ proviteData.feasibilityReport?.name }}
                     </a>
-                    <span @click="openFile(proviteData.feasibilityReport?.name )">预览</span>
                 </span>
             </el-descriptions-item>
             <el-descriptions-item label="项目初步设计说明书">
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.preliminaryDesignDescription?.name">
+                    <View @click="openFile(proviteData?.preliminaryDesignDescription?.name)" />
                 </el-icon>
+
                 <a target="_blank" :href="proviteData?.preliminaryDesignDescription?.url">
                     {{ proviteData?.preliminaryDesignDescription?.name }}
                 </a>
-                <span @click="openFile(proviteData.preliminaryDesignDescription?.name )">预览</span>
             </el-descriptions-item>
             <el-descriptions-item label="预测评估报告">
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.predictionEvaluationReport?.name">
+                    <View @click="openFile(proviteData?.predictionEvaluationReport?.name)" />
                 </el-icon>
                 <a target="_blank" :href="proviteData?.predictionEvaluationReport?.url">
                     {{ proviteData?.predictionEvaluationReport?.name }}
                 </a>
-                <span @click="openFile(proviteData.predictionEvaluationReport?.name )">预览</span>
             </el-descriptions-item>
             <el-descriptions-item label="预测评估评审意见报告">
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.predictionEvaluationReviewOpinions?.name">
+                    <View @click="openFile(proviteData?.predictionEvaluationReviewOpinions?.name)" />
                 </el-icon>
                 <a target="_blank" :href="proviteData?.predictionEvaluationReviewOpinions?.url">
                     {{ proviteData?.predictionEvaluationReviewOpinions?.name }}
                 </a>
-                <span @click="openFile(proviteData.predictionEvaluationReviewOpinions?.name )">预览</span>
             </el-descriptions-item>
             <el-descriptions-item
                 label="用户接入变电站主接线示意图"
                 v-if="detailData.userType != 0 && detailData.userType != 1"
             >
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.substationMainWiringDiagram?.name">
+                    <View @click="openFile(proviteData?.substationMainWiringDiagram?.name)" />
                 </el-icon>
                 <a target="_blank" :href="proviteData?.substationMainWiringDiagram?.url">
                     {{ proviteData?.substationMainWiringDiagram?.name }}
                 </a>
-                <span @click="openFile(proviteData.substationMainWiringDiagram?.name )">预览</span>
             </el-descriptions-item>
             <el-descriptions-item label="主要敏感终端清单" v-if="detailData.userType == 6">
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.sensitiveDevices?.name">
+                    <View @click="openFile(proviteData?.sensitiveDevices?.name)" />
                 </el-icon>
                 <a target="_blank" :href="proviteData?.sensitiveDevices?.url">
                     {{ proviteData?.sensitiveDevices?.name }}
                 </a>
-                <span @click="openFile(proviteData.sensitiveDevices?.name )">预览</span>
             </el-descriptions-item>
             <el-descriptions-item label="抗扰度测试报告" v-if="detailData.userType == 6">
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.antiInterferenceReport?.name">
+                    <View @click="openFile(proviteData?.antiInterferenceReport?.name)" />
                 </el-icon>
                 <a target="_blank" :href="proviteData?.antiInterferenceReport?.url">
                     {{ proviteData?.antiInterferenceReport?.name }}
                 </a>
-                <span @click="openFile(proviteData.antiInterferenceReport?.name )">预览</span>
             </el-descriptions-item>
             <el-descriptions-item label="背景电能质量测试报告" v-if="detailData.userType == 6">
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.powerQualityReport?.name">
+                    <View @click="openFile(proviteData?.powerQualityReport?.name)" />
                 </el-icon>
                 <a target="_blank" :href="proviteData?.powerQualityReport?.url">
                     {{ proviteData?.powerQualityReport?.name }}
                 </a>
-                <span @click="openFile(proviteData.powerQualityReport?.name )">预览</span>
             </el-descriptions-item>
             <el-descriptions-item
                 label="其他附件"
                 v-if="proviteData?.additionalAttachments && proviteData?.additionalAttachments?.url"
             >
-                <el-icon>
-                    <Link />
+                <el-icon class="elView" v-if="proviteData?.additionalAttachments?.name">
+                    <View @click="openFile(proviteData?.additionalAttachments?.name)" />
                 </el-icon>
                 <a target="_blank" :href="proviteData?.additionalAttachments?.url">
                     {{ proviteData?.additionalAttachments?.name }}
                 </a>
-                <span @click="openFile(proviteData.additionalAttachments?.name )">预览</span>
             </el-descriptions-item>
         </el-descriptions>
     </div>
@@ -325,7 +322,7 @@ import { getUserReportById } from '@/api/supervision-boot/userReport/form'
 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'
+import { Link, View } from '@element-plus/icons-vue'
 import PreviewFile from '@/components/PreviewFile/index.vue'
 defineOptions({ name: 'BpmUserReportDetail' })
 
@@ -337,8 +334,8 @@ const props = defineProps({
 const detailLoading = ref(false) // 表单的加载中
 const detailData = ref<any>({}) // 详情数据
 const queryId = query.id as unknown as string // 从 URL 传递过来的 id 编号
-const openFile = (name:any) => {
-    window.open(window.location.origin + '/#/previewFile?'+name)
+const openFile = (name: any) => {
+    window.open(window.location.origin + '/#/previewFile?' + name)
 }
 //用户性质数组
 const userTypeList = reactive([
@@ -419,23 +416,23 @@ const getInfo = async () => {
 }
 const proviteData = ref()
 //可研报告
-const feasibilityReportRef = ref(null)
+const feasibilityReportRef:any = ref(null)
 //项目初步设计说明书
-const preliminaryDesignDescriptionRef = ref(null)
+const preliminaryDesignDescriptionRef:any = ref(null)
 //预测评估报告
-const predictionEvaluationReportRef = ref(null)
+const predictionEvaluationReportRef:any = ref(null)
 //预测评估评审意见报告
-const predictionEvaluationReviewOpinionsRef = ref(null)
+const predictionEvaluationReviewOpinionsRef:any = ref(null)
 //用户接入变电站主接线示意图
-const substationMainWiringDiagramRef = ref(null)
+const substationMainWiringDiagramRef:any= ref(null)
 //主要敏感终端清单
-const sensitiveDevicesRef = ref(null)
+const sensitiveDevicesRef:any = ref(null)
 //抗扰度测试报告
-const antiInterferenceReportRef = ref(null)
+const antiInterferenceReportRef:any = ref(null)
 //背景电能质量测试报告
-const powerQualityReportRef = ref(null)
+const powerQualityReportRef:any = ref(null)
 //其他附件
-const additionalAttachmentsRef = ref(null)
+const additionalAttachmentsRef:any = ref(null)
 //预览
 const preview = (val: any, url: any) => {
     nextTick(() => {
@@ -637,12 +634,16 @@ onMounted(() => {
     position: absolute !important;
     top: 20px !important;
 }
-.el-icon {
-    float: left;
-}
+// .el-icon {
+//     float: left;
+// }
 a {
     display: block;
     width: 200px;
     float: left;
 }
+.elView {
+    cursor: pointer;
+    margin-right: 5px;
+}
 </style>