112 lines
3.9 KiB
Vue
112 lines
3.9 KiB
Vue
<template>
|
||
<!--工作流view的路径：/pqs/supervise/technology/detail-->
|
||
<div class="default-main">
|
||
<!-- <h1>详细信息回显</h1>-->
|
||
<el-descriptions :column="2" border>
|
||
<el-descriptions-item :label="detailData.leafletType == 1 ? '预警单名称' : '告警单名称'">
|
||
{{ detailData.leafletName }}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item :label="detailData.leafletType == 1 ? '预警单' : '告警单' + '问题来源'">
|
||
{{ getProblemType(detailData.problemType) }}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item :span="2" :label="detailData.leafletType == 1 ? '预警单' : '告警单' + '问题描述'">
|
||
{{ detailData.issueDetail }}
|
||
</el-descriptions-item>
|
||
<template v-if="detailData.problemType == 4">
|
||
<el-descriptions-item :span="2" label="附件">
|
||
<el-icon class="elView" v-if="detailData?.problemName">
|
||
<View @click="openFile(detailData?.problemName)" />
|
||
</el-icon>
|
||
<a :href="detailData.problemPath" target="_blank">{{ detailData.problemName }}</a>
|
||
</el-descriptions-item>
|
||
</template>
|
||
<el-descriptions-item :span="2" label="采取措施">
|
||
{{ detailData.takeStep }}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item :span="2" label="处理成效报告">
|
||
<el-icon class="elView" v-if="detailData?.reportName">
|
||
<View @click="openFile(detailData?.reportName)" />
|
||
</el-icon>
|
||
<a :href="detailData.reportPath" target="_blank">{{ detailData.reportName }}</a>
|
||
</el-descriptions-item>
|
||
</el-descriptions>
|
||
</div>
|
||
</template>
|
||
<script lang="ts" setup>
|
||
import { onMounted, ref } from 'vue'
|
||
import { useRoute } from 'vue-router'
|
||
import { propTypes } from '@/utils/propTypes'
|
||
import { getById } from '@/api/supervision-boot/leaflet'
|
||
import { getFileNameAndFilePath } from '@/api/system-boot/file'
|
||
import { Link, View } from '@element-plus/icons-vue'
|
||
|
||
defineOptions({ name: 'technology/detail' })
|
||
const openFile = (name: any) => {
|
||
window.open(window.location.origin + '/#/previewFile?' + name)
|
||
}
|
||
const { query } = useRoute() // 查询参数
|
||
|
||
const props = defineProps({
|
||
id: propTypes.string.def(undefined)
|
||
})
|
||
const detailLoading = ref(false) // 表单的加载中
|
||
const detailData: any = ref({}) // 详情数据
|
||
const queryId = query.id // 从 URL 传递过来的 id 编号
|
||
const getProblemType = (type: number) => {
|
||
if (type === 1) {
|
||
return '技术监督计划'
|
||
}
|
||
if (type === 2) {
|
||
return '在线监测超标问题'
|
||
}
|
||
if (type === 3) {
|
||
return '用户投诉问题'
|
||
}
|
||
if (type === 4) {
|
||
return '现场测试超标问题'
|
||
}
|
||
return '现场测试超标问题'
|
||
}
|
||
|
||
/** 获得数据 */
|
||
const getInfo = async () => {
|
||
detailLoading.value = true
|
||
try {
|
||
await getById(props.id || queryId).then(res => {
|
||
detailData.value = res.data
|
||
getFileData()
|
||
})
|
||
} finally {
|
||
detailLoading.value = false
|
||
}
|
||
}
|
||
|
||
const getFileData = async () => {
|
||
//如果有问题附件
|
||
if (detailData.value.problemPath) {
|
||
await getFileNameAndFilePath({ filePath: detailData.value.problemPath }).then(res => {
|
||
detailData.value.problemPath = res.data.url
|
||
detailData.value.problemName = res.data.fileName
|
||
})
|
||
}
|
||
|
||
await getFileNameAndFilePath({ filePath: detailData.value.reportPath }).then(res => {
|
||
detailData.value.reportPath = res.data.url
|
||
detailData.value.reportName = res.data.fileName
|
||
})
|
||
}
|
||
|
||
defineExpose({ open: getInfo }) // 提供 open 方法，用于打开弹窗
|
||
|
||
/** 初始化 **/
|
||
onMounted(() => {
|
||
getInfo()
|
||
})
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.elView {
|
||
cursor: pointer;
|
||
margin-right: 10px;
|
||
}
|
||
</style>
|